@warp-ds/elements 2.9.1-next.2 → 2.9.1-next.4

package/dist/packages/switch/switch.d.ts

@@ -4,6 +4,8 @@ export declare class WarpSwitch extends WarpSwitch_base {
     #private;
     static shadowRootOptions: {
         delegatesFocus: boolean;
+        clonable?: boolean;
+        customElementRegistry?: CustomElementRegistry;
         mode: ShadowRootMode;
         serializable?: boolean;
         slotAssignment?: SlotAssignmentMode;

package/dist/packages/tab/tab.d.ts

@@ -2,12 +2,19 @@ import { LitElement, PropertyValues } from 'lit';
 /**
  * Individual tab component used within w-tabs container.
  *
- * [See Storybook for usage examples](https://warp-ds.github.io/elements/?path=/docs/tabs--docs)
+ * @parent w-tabs
  */
 export declare class WarpTab extends LitElement {
     static styles: import("lit").CSSResult[];
+    /**
+     * Use delegatesFocus so focus delegates to the internal button
+     *
+     * @internal
+     */
     static shadowRootOptions: {
         delegatesFocus: boolean;
+        clonable?: boolean;
+        customElementRegistry?: CustomElementRegistry;
         mode: ShadowRootMode;
         serializable?: boolean;
         slotAssignment?: SlotAssignmentMode;
@@ -16,65 +23,65 @@ export declare class WarpTab extends LitElement {
     private _handleClick;
     constructor();
     /**
-     * @summary
-     * @description
-     */
-    id: string;
-    /**
-     * @summary
-     * @description
+     * The `id` of the `<w-tab-panel>` this tab controls.
      */
     for: string;
     /**
-     * @summary
-     * @description
+     * @internal
      */
     private _ariaControlsAttr?;
     /**
      * Internal tabindex managed by parent w-tabs.
      * Non-reflecting to avoid DOM changes during hydration.
+     *
      * @internal
-     
-     * @summary
-     * @description
-    */
+     */
     _parentTabIndex: number | undefined;
     /**
      * Internal aria-selected managed by parent w-tabs.
+     *
      * Non-reflecting to avoid DOM changes during hydration.
+     *
      * @internal
-     
-     * @summary
-     * @description
-    */
+     */
     _parentAriaSelected: 'true' | 'false' | undefined;
     /**
      * Override tabIndex getter to return the computed internal tabIndex.
      * This allows external code to check if the tab is focusable.
+     *
+     * @internal
      */
     get tabIndex(): number;
     /**
      * Override tabIndex setter to set _parentTabIndex (for backwards compatibility).
+     *
+     * @internal
      */
     set tabIndex(value: number);
     /**
      * Computed aria-selected: prefers parent-managed, falls back to own property
+     *
+     * @internal
      */
     get _computedAriaSelected(): 'true' | 'false' | undefined;
     private get _effectiveAriaControls();
+    /**
+     * Indicate that this is the currently active tab.
+     *
+     * @internal Set by w-tabs
+     */
     set ariaSelected(value: 'true' | 'false');
+    /** @internal */
     get ariaSelected(): 'true' | 'false';
     private _ownAriaSelected;
     /**
      * @deprecated Use `aria-selected="true"` instead
-     
-     * @summary
-     * @description
-    */
+     *
+     * @internal Set by w-tabs
+     */
     active: boolean;
     /**
-     * @summary
-     * @description
+     * Whether to show the `icon` slot over the tab title instead of inline.
      */
     over: boolean;
     private get _classes();

package/dist/packages/tab/tab.js

@@ -1,4 +1,4 @@
-var f=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var i=(d,a,e,r)=>{for(var o=r>1?void 0:r?x(a,e):a,n=d.length-1,c;n>=0;n--)(c=d[n])&&(o=(r?c(a,e,o):c(o))||o);return r&&o&&f(a,e,o),o};var p=function(){for(var d=[],a=arguments.length;a--;)d[a]=arguments[a];return d.reduce(function(e,r){return e.concat(typeof r=="string"?r:Array.isArray(r)?p.apply(void 0,r):typeof r=="object"&&r?Object.keys(r).map(function(o){return r[o]?o:""}):"")},[]).join(" ")};import{css as y,html as b,LitElement as w}from"lit";import{property as l}from"lit/decorators.js";import{css as u}from"lit";var h=u`
+var f=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var n=(d,a,e,r)=>{for(var o=r>1?void 0:r?x(a,e):a,i=d.length-1,c;i>=0;i--)(c=d[i])&&(o=(r?c(a,e,o):c(o))||o);return r&&o&&f(a,e,o),o};var p=function(){for(var d=[],a=arguments.length;a--;)d[a]=arguments[a];return d.reduce(function(e,r){return e.concat(typeof r=="string"?r:Array.isArray(r)?p.apply(void 0,r):typeof r=="object"&&r?Object.keys(r).map(function(o){return r[o]?o:""}):"")},[]).join(" ")};import{css as y,html as b,LitElement as w}from"lit";import{property as l}from"lit/decorators.js";import{css as u}from"lit";var h=u`
   *,
   :before,
   :after {
@@ -2437,7 +2437,7 @@ var f=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var i=(d,a,e,r
                     display: none
                 }
             }
-        `;import{css as k}from"lit";var m=k`*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.border-b{border-bottom-width:1px}.border-b-4{border-bottom-width:4px}.inline-block{display:inline-block}.inline-grid{display:inline-grid}.hidden{display:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}.grid-cols-8{grid-template-columns:repeat(8,minmax(0,1fr))}.grid-cols-9{grid-template-columns:repeat(9,minmax(0,1fr))}.-bottom-0{bottom:0}.absolute{position:absolute}.relative{position:relative}.static{position:static}.s-border{border-color:var(--w-s-color-border)}.s-border-selected{border-color:var(--w-s-color-border-selected)}.-mb-1{margin-bottom:-.1rem}.mb-32{margin-bottom:3.2rem}.resize{resize:both}.transition-all{transition-property:all;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.bg-transparent{background-color:#0000}.appearance-none{-webkit-appearance:none;appearance:none}.border-0{border-width:0}.border-b-4{border-bottom-width:4px}.border-transparent{border-color:#0000}.inline-block{display:inline-block}.flex{display:flex}.grid{display:grid}.focusable:focus{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:focus-visible{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:not(:focus-visible){outline:none}.gap-8{gap:.8rem}.focus\\:outline-none:focus{outline-offset:2px;outline:2px solid #0000}.items-center{align-items:center}.justify-center{justify-content:center}.static{position:static}.s-text-link{color:var(--w-s-color-text-link)}.s-text-subtle{color:var(--w-s-color-text-subtle)}.hover\\:s-text-link:hover{color:var(--w-s-color-text-link)}.s-border-selected{border-color:var(--w-s-color-border-selected)}.hover\\:s-border-primary:hover{border-color:var(--w-s-color-border-primary)}.m-0{margin:0}.mx-auto{margin-left:auto;margin-right:auto}.p-0{padding:0}.p-16{padding:1.6rem}.pb-8{padding-bottom:.8rem}.cursor-pointer{cursor:pointer}.font-bold{font-weight:700}.w-full{width: 100%;}`;var s={base:"grid w-full items-center font-bold gap-8 antialias p-16 pb-8 border-b-4 bg-transparent border-transparent hover:s-text-link hover:s-border-primary",inactive:"s-text-subtle",active:"s-text-link s-border-selected",icon:"mx-auto",content:"flex items-center justify-center gap-8",contentUnderlined:"content-underlined"},z="focusable appearance-none cursor-pointer bg-transparent border-0 m-0 p-0 inline-block",t=class extends w{constructor(){super();this._handleClick=e=>{e.tab||(e.tab=this)};this.active=!1;this.over=!1;this._internals=this.attachInternals()}get tabIndex(){var e;return(e=this._parentTabIndex)!=null?e:0}set tabIndex(e){this._parentTabIndex=e}get _computedAriaSelected(){var e;return(e=this._parentAriaSelected)!=null?e:this._ownAriaSelected}get _effectiveAriaControls(){return this._ariaControlsAttr||this.for||""}set ariaSelected(e){var o;let r=this._ownAriaSelected;this._ownAriaSelected=e,this._internals.ariaSelected=(o=this._computedAriaSelected)!=null?o:null,this.requestUpdate("ariaSelected",r)}get ariaSelected(){var e;return(e=this._computedAriaSelected)!=null?e:"false"}get _classes(){return p([z,s.base,this.active||this.ariaSelected==="true"?s.active:s.inactive])}get _hasIcon(){return this.querySelector('[slot="icon"]')!==null}connectedCallback(){super.connectedCallback(),this._internals.role="tab",this.syncAriaControls(),this.addEventListener("click",this._handleClick)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this._handleClick)}updated(e){var o;super.updated(e);let r=e;e.has("_parentAriaSelected")&&(this._internals.ariaSelected=(o=this._computedAriaSelected)!=null?o:null),r.has("_ariaControlsAttr")&&this.syncAriaControls(),e.has("for")&&this.syncAriaControls(),e.has("active")&&this.hasAttribute("active")&&(this._internals.ariaSelected=this.active?"true":"false")}syncAriaControls(){var c,g,v;let e=this._effectiveAriaControls,r=this.closest("w-tabs"),o=(v=(g=r==null?void 0:r.querySelector(`w-tab-panel#${CSS.escape(e)}`))!=null?g:(c=this.ownerDocument)==null?void 0:c.getElementById(e))!=null?v:null,n=this._internals;if("ariaControlsElements"in n){n.ariaControlsElements=o?[o]:[];return}"ariaControls"in n&&(n.ariaControls=e||null)}render(){var r;let e=this._hasIcon;return b`
+        `;import{css as k}from"lit";var m=k`*,:before,:after{--w-rotate:0;--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-scale-x:1;--w-scale-y:1;--w-scale-z:1;--w-skew-x:0;--w-skew-y:0;--w-translate-x:0;--w-translate-y:0;--w-translate-z:0}.border-b{border-bottom-width:1px}.border-b-4{border-bottom-width:4px}.inline-block{display:inline-block}.inline-grid{display:inline-grid}.hidden{display:none}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))}.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid-cols-3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid-cols-4{grid-template-columns:repeat(4,minmax(0,1fr))}.grid-cols-5{grid-template-columns:repeat(5,minmax(0,1fr))}.grid-cols-6{grid-template-columns:repeat(6,minmax(0,1fr))}.grid-cols-7{grid-template-columns:repeat(7,minmax(0,1fr))}.grid-cols-8{grid-template-columns:repeat(8,minmax(0,1fr))}.grid-cols-9{grid-template-columns:repeat(9,minmax(0,1fr))}.-bottom-0{bottom:0}.absolute{position:absolute}.relative{position:relative}.static{position:static}.s-border{border-color:var(--w-s-color-border)}.s-border-selected{border-color:var(--w-s-color-border-selected)}.-mb-1{margin-bottom:-.1rem}.mb-32{margin-bottom:3.2rem}.resize{resize:both}.transition-all{transition-property:all;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.bg-transparent{background-color:#0000}.appearance-none{-webkit-appearance:none;appearance:none}.border-0{border-width:0}.border-b-4{border-bottom-width:4px}.border-transparent{border-color:#0000}.inline-block{display:inline-block}.flex{display:flex}.grid{display:grid}.focusable:focus{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:focus-visible{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:not(:focus-visible){outline:none}.gap-8{gap:.8rem}.focus\\:outline-none:focus{outline-offset:2px;outline:2px solid #0000}.items-center{align-items:center}.justify-center{justify-content:center}.static{position:static}.s-text-link{color:var(--w-s-color-text-link)}.s-text-subtle{color:var(--w-s-color-text-subtle)}.hover\\:s-text-link:hover{color:var(--w-s-color-text-link)}.s-border-selected{border-color:var(--w-s-color-border-selected)}.hover\\:s-border-primary:hover{border-color:var(--w-s-color-border-primary)}.m-0{margin:0}.mx-auto{margin-left:auto;margin-right:auto}.p-0{padding:0}.p-16{padding:1.6rem}.pb-8{padding-bottom:.8rem}.cursor-pointer{cursor:pointer}.font-bold{font-weight:700}.w-full{width: 100%;}`;var s={base:"grid w-full items-center font-bold gap-8 antialias p-16 pb-8 border-b-4 bg-transparent border-transparent hover:s-text-link hover:s-border-primary",inactive:"s-text-subtle",active:"s-text-link s-border-selected",icon:"mx-auto",content:"flex items-center justify-center gap-8",contentUnderlined:"content-underlined"},z="focusable appearance-none cursor-pointer bg-transparent border-0 m-0 p-0 inline-block",t=class extends w{constructor(){super();this._handleClick=e=>{e.tab||(e.tab=this)};this.active=!1;this.over=!1;this._internals=this.attachInternals()}get tabIndex(){var e;return(e=this._parentTabIndex)!=null?e:0}set tabIndex(e){this._parentTabIndex=e}get _computedAriaSelected(){var e;return(e=this._parentAriaSelected)!=null?e:this._ownAriaSelected}get _effectiveAriaControls(){return this._ariaControlsAttr||this.for||""}set ariaSelected(e){var o;let r=this._ownAriaSelected;this._ownAriaSelected=e,this._internals.ariaSelected=(o=this._computedAriaSelected)!=null?o:null,this.requestUpdate("ariaSelected",r)}get ariaSelected(){var e;return(e=this._computedAriaSelected)!=null?e:"false"}get _classes(){return p([z,s.base,this.active||this.ariaSelected==="true"?s.active:s.inactive])}get _hasIcon(){return this.querySelector('[slot="icon"]')!==null}connectedCallback(){super.connectedCallback(),this._internals.role="tab",this.syncAriaControls(),this.addEventListener("click",this._handleClick)}disconnectedCallback(){super.disconnectedCallback(),this.removeEventListener("click",this._handleClick)}updated(e){var o;super.updated(e);let r=e;e.has("_parentAriaSelected")&&(this._internals.ariaSelected=(o=this._computedAriaSelected)!=null?o:null),r.has("_ariaControlsAttr")&&this.syncAriaControls(),e.has("for")&&this.syncAriaControls(),e.has("active")&&this.hasAttribute("active")&&(this._internals.ariaSelected=this.active?"true":"false")}syncAriaControls(){var c,g,v;let e=this._effectiveAriaControls,r=this.closest("w-tabs"),o=(v=(g=r==null?void 0:r.querySelector(`w-tab-panel#${CSS.escape(e)}`))!=null?g:(c=this.ownerDocument)==null?void 0:c.getElementById(e))!=null?v:null,i=this._internals;if("ariaControlsElements"in i){i.ariaControlsElements=o?[o]:[];return}"ariaControls"in i&&(i.ariaControls=e||null)}render(){var r;let e=this._hasIcon;return b`
       <button
         type="button"
         role="none"
@@ -2468,5 +2468,5 @@ var f=Object.defineProperty;var x=Object.getOwnPropertyDescriptor;var i=(d,a,e,r
         outline: 2px solid var(--w-s-color-border-focus, #1a73e8);
         outline-offset: var(--w-outline-offset, 1px);
       }
-    `],t.shadowRootOptions={...w.shadowRootOptions,delegatesFocus:!0},i([l({attribute:"id",reflect:!0})],t.prototype,"id",2),i([l({attribute:"for",reflect:!0})],t.prototype,"for",2),i([l({attribute:"aria-controls"})],t.prototype,"_ariaControlsAttr",2),i([l({attribute:!1})],t.prototype,"_parentTabIndex",2),i([l({attribute:!1})],t.prototype,"_parentAriaSelected",2),i([l({attribute:"aria-selected"})],t.prototype,"ariaSelected",1),i([l({type:Boolean,reflect:!0})],t.prototype,"active",2),i([l({type:Boolean,reflect:!0})],t.prototype,"over",2);customElements.get("w-tab")||customElements.define("w-tab",t);export{t as WarpTab};
+    `],t.shadowRootOptions={...w.shadowRootOptions,delegatesFocus:!0},n([l({attribute:"for",reflect:!0})],t.prototype,"for",2),n([l({attribute:"aria-controls"})],t.prototype,"_ariaControlsAttr",2),n([l({attribute:!1})],t.prototype,"_parentTabIndex",2),n([l({attribute:!1})],t.prototype,"_parentAriaSelected",2),n([l({attribute:"aria-selected"})],t.prototype,"ariaSelected",1),n([l({type:Boolean,reflect:!0})],t.prototype,"active",2),n([l({type:Boolean,reflect:!0})],t.prototype,"over",2);customElements.get("w-tab")||customElements.define("w-tab",t);export{t as WarpTab};
 //# sourceMappingURL=tab.js.map