Merge branch 'v1/contrib' into v1/bugfix/input-border-radius

Author: iOvergaard

packages/uui-base/lib/utils/drag.ts

@@ -25,10 +25,9 @@ export const drag = (
     // TouchEvent is not available in Firefox
     if ('TouchEvent' in window && event instanceof TouchEvent) {
       pointerEvent = event.touches[0];
-    } else if ( event instanceof PointerEvent ) {
+    } else if (event instanceof PointerEvent) {
       pointerEvent = event;
-    }
-    else {
+    } else {
       return;
     }
 

packages/uui-tabs/lib/uui-tab-group.element.ts

@@ -77,8 +77,6 @@ export class UUITabGroupElement extends LitElement {
     demandCustomElement(this, 'uui-popover-container');
     demandCustomElement(this, 'uui-symbol-more');
 
-    if (!this.hasAttribute('role')) this.setAttribute('role', 'tablist');
-
     await this.updateComplete;
     this.#resizeObserver.observe(this._mainElement);
   }
@@ -268,7 +266,7 @@ export class UUITabGroupElement extends LitElement {
   render() {
     return html`
       <div id="main">
-        <div id="grid">
+        <div id="grid" role="tablist">
           <slot @slotchange=${this.#onSlotChange}></slot>
         </div>
         <uui-button
@@ -284,7 +282,7 @@ export class UUITabGroupElement extends LitElement {
         id="popover-container"
         popover
         placement="bottom-end">
-        <div id="hidden-tabs-container">
+        <div id="hidden-tabs-container" role="tablist">
           ${repeat(this.#hiddenTabElements, el => html`${el}`)}
         </div>
       </uui-popover-container>

packages/uui-tabs/lib/uui-tabs.test.ts

@@ -17,6 +17,21 @@ describe('UuiTab', () => {
         <uui-tab label="Content">Content</uui-tab>
         <uui-tab label="Packages">Packages</uui-tab>
         <uui-tab label="Media" active>Media</uui-tab>
+        <uui-tab label="Content1">Content to force a more button</uui-tab>
+        <uui-tab label="Content2">Content to force a more button</uui-tab>
+        <uui-tab label="Content3">Content to force a more button</uui-tab>
+        <uui-tab label="Content4">Content to force a more button</uui-tab>
+        <uui-tab label="Content5">Content to force a more button</uui-tab>
+        <uui-tab label="Content6">Content to force a more button</uui-tab>
+        <uui-tab label="Content7">Content to force a more button</uui-tab>
+        <uui-tab label="Content8">Content to force a more button</uui-tab>
+        <uui-tab label="Content9">Content to force a more button</uui-tab>
+        <uui-tab label="Content10">Content to force a more button</uui-tab>
+        <uui-tab label="Content11">Content to force a more button</uui-tab>
+        <uui-tab label="Content12">Content to force a more button</uui-tab>
+        <uui-tab label="Content13">Content to force a more button</uui-tab>
+        <uui-tab label="Content14">Content to force a more button</uui-tab>
+        <uui-tab label="Content15">Content to force a more button</uui-tab>
       </uui-tab-group>
     `);