@warp-ds/elements 2.8.2-next.1 → 2.8.2-next.3

package/dist/packages/datepicker/datepicker.react.stories.d.ts

@@ -3,7 +3,7 @@ import React from 'react';
 import { DatePicker } from './react';
 declare const _default: {
     title: string;
-    render(args: Omit<React.HTMLAttributes<import("./datepicker").WarpDatepicker>, "name" | "locale" | "form" | "input" | "label" | "onchange" | "onChange" | "render" | "renderOptions" | "connectedCallback" | "disconnectedCallback" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "value" | "updated" | "resetFormControl" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "month" | "calendar" | "wrapper" | "headerFormat" | "weekdayFormat" | "isDayDisabled" | "dayFormat" | "isCalendarOpen" | "navigationDate" | "selectedDate" | "weeks" | "toggleButton" | "previousMonthButton" | "todayCell" | "selectedCell"> & {
+    render(args: Omit<React.HTMLAttributes<import("./datepicker").WarpDatepicker>, "value" | "input" | "form" | "label" | "name" | "locale" | "onchange" | "onChange" | "render" | "renderOptions" | "connectedCallback" | "disconnectedCallback" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "updated" | "resetFormControl" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "month" | "calendar" | "wrapper" | "headerFormat" | "weekdayFormat" | "isDayDisabled" | "dayFormat" | "isCalendarOpen" | "navigationDate" | "selectedDate" | "weeks" | "toggleButton" | "previousMonthButton" | "todayCell" | "selectedCell"> & {
         onChange?: (e: Event) => void;
         onchange?: (e: Event) => void;
     } & Partial<Omit<import("./datepicker").WarpDatepicker, keyof HTMLElement>> & React.RefAttributes<import("./datepicker").WarpDatepicker>): React.JSX.Element;

package/dist/packages/expandable/expandable.hydration.test.d.ts

@@ -0,0 +1 @@
+import './expandable.js';

package/dist/packages/expandable/expandable.hydration.test.js

@@ -0,0 +1,47 @@
+import { describe, expect, test, beforeEach, afterEach } from 'vitest';
+import { setupHydrationWarningCapture, testHydration } from '../../tests/react-hydration';
+import './expandable.js';
+describe('w-expandable React SSR hydration', () => {
+    beforeEach(() => setupHydrationWarningCapture());
+    afterEach(() => {
+        window.__HYDRATION_WARNINGS__ = [];
+    });
+    test('default (no attributes) hydrates without warnings', async () => {
+        const warnings = await testHydration('w-expandable', {});
+        expect(warnings).toEqual([]);
+    });
+    test('with title hydrates without warnings', async () => {
+        const warnings = await testHydration('w-expandable', {
+            title: 'Show more',
+        });
+        expect(warnings).toEqual([]);
+    });
+    test('expanded state hydrates without warnings', async () => {
+        const warnings = await testHydration('w-expandable', {
+            title: 'Show more',
+            expanded: true,
+        });
+        expect(warnings).toEqual([]);
+    });
+    test('with box variant hydrates without warnings', async () => {
+        const warnings = await testHydration('w-expandable', {
+            title: 'Show more',
+            box: true,
+        });
+        expect(warnings).toEqual([]);
+    });
+    test('with bleed hydrates without warnings', async () => {
+        const warnings = await testHydration('w-expandable', {
+            title: 'Show more',
+            bleed: true,
+        });
+        expect(warnings).toEqual([]);
+    });
+    test('with animated hydrates without warnings', async () => {
+        const warnings = await testHydration('w-expandable', {
+            title: 'Show more',
+            animated: true,
+        });
+        expect(warnings).toEqual([]);
+    });
+});

package/dist/packages/expandable/expandable.js

@@ -1,4 +1,4 @@
-var X=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var _=e=>{throw TypeError(e)};var V=(e,r,o)=>r in e?X(e,r,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[r]=o;var n=(e,r,o,t)=>{for(var a=t>1?void 0:t?q(r,o):r,b=e.length-1,f;b>=0;b--)(f=e[b])&&(a=(t?f(r,o,a):f(a))||a);return t&&a&&X(r,o,a),a};var g=(e,r,o)=>V(e,typeof r!="symbol"?r+"":r,o),G=(e,r,o)=>r.has(e)||_("Cannot "+o);var w=(e,r,o)=>(G(e,r,"read from private field"),o?o.call(e):r.get(e)),C=(e,r,o)=>r.has(e)?_("Cannot add the same private member more than once"):r instanceof WeakSet?r.add(e):r.set(e,o);var p=function(){for(var e=[],r=arguments.length;r--;)e[r]=arguments[r];return e.reduce(function(o,t){return o.concat(typeof t=="string"?t:Array.isArray(t)?p.apply(void 0,t):typeof t=="object"&&t?Object.keys(t).map(function(a){return t[a]?a:""}):"")},[]).join(" ")};import{css as ve,html as d,LitElement as we}from"lit";import{property as c}from"lit/decorators.js";import{ifDefined as ge}from"lit/directives/if-defined.js";import{html as I,LitElement as J}from"lit";import{property as x,state as K}from"lit/decorators.js";import{classMap as Q}from"lit/directives/class-map.js";import{css as H}from"lit";var E=H`
+var X=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var _=e=>{throw TypeError(e)};var V=(e,r,o)=>r in e?X(e,r,{enumerable:!0,configurable:!0,writable:!0,value:o}):e[r]=o;var n=(e,r,o,t)=>{for(var a=t>1?void 0:t?q(r,o):r,c=e.length-1,u;c>=0;c--)(u=e[c])&&(a=(t?u(r,o,a):u(a))||a);return t&&a&&X(r,o,a),a};var g=(e,r,o)=>V(e,typeof r!="symbol"?r+"":r,o),G=(e,r,o)=>r.has(e)||_("Cannot "+o);var w=(e,r,o)=>(G(e,r,"read from private field"),o?o.call(e):r.get(e)),C=(e,r,o)=>r.has(e)?_("Cannot add the same private member more than once"):r instanceof WeakSet?r.add(e):r.set(e,o);var b=function(){for(var e=[],r=arguments.length;r--;)e[r]=arguments[r];return e.reduce(function(o,t){return o.concat(typeof t=="string"?t:Array.isArray(t)?b.apply(void 0,t):typeof t=="object"&&t?Object.keys(t).map(function(a){return t[a]?a:""}):"")},[]).join(" ")};import{css as ve,html as p,LitElement as we}from"lit";import{property as d}from"lit/decorators.js";import{ifDefined as ge}from"lit/directives/if-defined.js";import{html as I,LitElement as J}from"lit";import{property as x,state as K}from"lit/decorators.js";import{classMap as Q}from"lit/directives/class-map.js";import{css as H}from"lit";var E=H`
 :host {
   display: inline-block;
 }
@@ -23,16 +23,16 @@ var X=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var _=e=>{thro
   --w-icon-size: 32px;
 }
 
-`;var k=new Map,W='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function ee(e,r={}){var t;let o=(t=r.responseParser)!=null?t:(a=>a.text());return k.has(e)||k.set(e,fetch(e).then(o)),k.get(e)}var v=class extends J{constructor(){super(...arguments);this.name="";this.size="medium";this.locale="en";this.svg=null}async fetchIcon(o){let t=`https://assets.finn.no/pkg/eikons/v1/${this.locale}/${o}.svg`;try{let a=await ee(t);return new DOMParser().parseFromString(a,"text/html").body.querySelector("svg")}catch(a){return null}}firstUpdated(){this.loadIcon()}updated(o){(o.has("name")||o.has("locale"))&&this.loadIcon()}async loadIcon(){if(!this.name){this.svg=null;return}let o=await this.fetchIcon(this.name);o||(o=new DOMParser().parseFromString(W,"text/html").body.firstElementChild),this.svg=o}render(){let o={"w-icon":!0,"w-icon--s":this.size==="small","w-icon--m":this.size==="medium","w-icon--l":this.size==="large"},t=typeof this.size=="string"&&this.size.endsWith("px")?`--w-icon-size: ${this.size};`:"";return I`<div class="${Q(o)}" style="${t}" part="w-${this.name.toLowerCase()}">${this.svg}</div>`}};v.styles=[E],n([x({type:String,reflect:!0})],v.prototype,"name",2),n([x({type:String,reflect:!0})],v.prototype,"size",2),n([x({type:String,reflect:!0})],v.prototype,"locale",2),n([K()],v.prototype,"svg",2);customElements.get("w-icon")||customElements.define("w-icon",v);var y=typeof window!="undefined",Z=!0;if(y){let e=window.matchMedia("(prefers-reduced-motion: reduce)"),r=({matches:o})=>Z=!o;e.addEventListener&&e.addEventListener("change",r),r(e)}var $=e=>{e.style.transition=null,e.style.backfaceVisibility=null,e.style.overflow=null},L=e=>{let r=Z?"var(--f-expansion-duration, 0.3s)":"0.01s";e.style.transition=`height ${r}`,e.style.backfaceVisibility="hidden",e.style.overflow="hidden"},re=(e,r)=>()=>{e.style.height="auto",e.style.overflow=null,r&&r()},oe=e=>()=>{e&&e()},T=(e,r)=>{let o=(()=>{if(!r)return new Promise(b=>{r=b})})(),t=re(e,r);$(e),e.style.height="auto";let a=e.scrollHeight;if(y&&requestAnimationFrame(()=>{e.addEventListener("transitionend",t,{once:!0}),e.style.height="0px",e.style.transitionTimingFunction="ease-out",L(e),requestAnimationFrame(()=>e.style.height=a+"px")}),o)return o},M=(e,r)=>{let o=(()=>{if(!r)return new Promise(b=>{r=b})})(),t=oe(r);$(e);let a=e.scrollHeight;if(y&&requestAnimationFrame(()=>{e.addEventListener("transitionend",t,{once:!0}),e.style.height=a+"px",e.style.transitionTimingFunction="ease-in",L(e),requestAnimationFrame(()=>e.style.height="0px")}),o)return o};import{css as te,html as z,LitElement as ae}from"lit";import{ifDefined as ne}from"lit/directives/if-defined.js";var h=class extends ae{constructor(){super(),this.show=!1,this._mounted=!1,this._removeElement=!1}willUpdate(){this._mounted||(this._removeElement=!this.show),this.show&&this._removeElement&&(this._removeElement=!1)}updated(){if(this._wrapper){if(!this._mounted){this._mounted=!0;return}this.show&&T(this._wrapper),!this.show&&!this._removeElement&&M(this._wrapper,()=>this._removeElement=!0)}}get _wrapper(){return this!=null?this:null}render(){return z`<div aria-hidden=${ne(this.show?void 0:"true")}>${this._removeElement?z``:z`<slot></slot>`}</div>`}};g(h,"properties",{show:{type:Boolean,reflect:!0},_removeElement:{type:Boolean,state:!0}}),g(h,"styles",[te`
+`;var k=new Map,W='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function ee(e,r={}){var t;let o=(t=r.responseParser)!=null?t:(a=>a.text());return k.has(e)||k.set(e,fetch(e).then(o)),k.get(e)}var v=class extends J{constructor(){super(...arguments);this.svg=null}async fetchIcon(o){let a=`https://assets.finn.no/pkg/eikons/v1/${this.locale||"en"}/${o}.svg`;try{let c=await ee(a);return new DOMParser().parseFromString(c,"text/html").body.querySelector("svg")}catch(c){return null}}firstUpdated(){this.loadIcon()}updated(o){(o.has("name")||o.has("locale"))&&this.loadIcon()}async loadIcon(){if(!this.name){this.svg=null;return}let o=await this.fetchIcon(this.name);o||(o=new DOMParser().parseFromString(W,"text/html").body.firstElementChild),this.svg=o}render(){let o=this.size||"medium",t=this.name||"",a={"w-icon":!0,"w-icon--s":o==="small","w-icon--m":o==="medium","w-icon--l":o==="large"},c=typeof o=="string"&&o.endsWith("px")?`--w-icon-size: ${o};`:"";return I`<div class="${Q(a)}" style="${c}" part="w-${t.toLowerCase()}">${this.svg}</div>`}};v.styles=[E],n([x({type:String,reflect:!0})],v.prototype,"name",2),n([x({type:String,reflect:!0})],v.prototype,"size",2),n([x({type:String,reflect:!0})],v.prototype,"locale",2),n([K()],v.prototype,"svg",2);customElements.get("w-icon")||customElements.define("w-icon",v);var y=typeof window!="undefined",Z=!0;if(y){let e=window.matchMedia("(prefers-reduced-motion: reduce)"),r=({matches:o})=>Z=!o;e.addEventListener&&e.addEventListener("change",r),r(e)}var $=e=>{e.style.transition=null,e.style.backfaceVisibility=null,e.style.overflow=null},L=e=>{let r=Z?"var(--f-expansion-duration, 0.3s)":"0.01s";e.style.transition=`height ${r}`,e.style.backfaceVisibility="hidden",e.style.overflow="hidden"},re=(e,r)=>()=>{e.style.height="auto",e.style.overflow=null,r&&r()},oe=e=>()=>{e&&e()},T=(e,r)=>{let o=(()=>{if(!r)return new Promise(c=>{r=c})})(),t=re(e,r);$(e),e.style.height="auto";let a=e.scrollHeight;if(y&&requestAnimationFrame(()=>{e.addEventListener("transitionend",t,{once:!0}),e.style.height="0px",e.style.transitionTimingFunction="ease-out",L(e),requestAnimationFrame(()=>e.style.height=a+"px")}),o)return o},M=(e,r)=>{let o=(()=>{if(!r)return new Promise(c=>{r=c})})(),t=oe(r);$(e);let a=e.scrollHeight;if(y&&requestAnimationFrame(()=>{e.addEventListener("transitionend",t,{once:!0}),e.style.height=a+"px",e.style.transitionTimingFunction="ease-in",L(e),requestAnimationFrame(()=>e.style.height="0px")}),o)return o};import{css as te,html as z,LitElement as ae}from"lit";import{ifDefined as ne}from"lit/directives/if-defined.js";var h=class extends ae{constructor(){super(),this.show=!1,this._mounted=!1,this._removeElement=!1}willUpdate(){this._mounted||(this._removeElement=!this.show),this.show&&this._removeElement&&(this._removeElement=!1)}updated(){if(this._wrapper){if(!this._mounted){this._mounted=!0;return}this.show&&T(this._wrapper),!this.show&&!this._removeElement&&M(this._wrapper,()=>this._removeElement=!0)}}get _wrapper(){return this!=null?this:null}render(){return z`<div aria-hidden=${ne(this.show?void 0:"true")}>${this._removeElement?z``:z`<slot></slot>`}</div>`}};g(h,"properties",{show:{type:Boolean,reflect:!0},_removeElement:{type:Boolean,state:!0}}),g(h,"styles",[te`
       :host {
         display: block;
       }
-    `]);customElements.get("w-expand-transition")||customElements.define("w-expand-transition",h);var ie=["en","nb","fi","da","sv"],Y="en",u=e=>ie.find(r=>e===r||e.toLowerCase().includes(r))||Y;function j(){if(typeof window=="undefined"){let e=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return u(e)}try{let e=S(document);if(e)return u(e);let r=le();if(r)return u(r);let o=S(se());return o?u(o):Y}catch(e){return console.warn("could not detect locale, falling back to source locale",e),Y}}function se(){var e,r;try{return(r=(e=window.parent)==null?void 0:e.document)!=null?r:null}catch(o){return null}}function S(e){var r,o;try{return(o=(r=e==null?void 0:e.documentElement)==null?void 0:r.lang)!=null?o:""}catch(t){return""}}function le(){var e,r,o;try{return(o=(r=(e=window.frameElement)==null?void 0:e.getAttribute)==null?void 0:r.call(e,"lang"))!=null?o:""}catch(t){return""}}import{html as ce,LitElement as de}from"lit";import{unsafeHTML as pe}from"lit/directives/unsafe-html.js";var m=class extends de{get _markup(){return`<h${this.level}
+    `]);customElements.get("w-expand-transition")||customElements.define("w-expand-transition",h);var ie=["en","nb","fi","da","sv"],Y="en",m=e=>ie.find(r=>e===r||e.toLowerCase().includes(r))||Y;function j(){if(typeof window=="undefined"){let e=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return m(e)}try{let e=S(document);if(e)return m(e);let r=le();if(r)return m(r);let o=S(se());return o?m(o):Y}catch(e){return console.warn("could not detect locale, falling back to source locale",e),Y}}function se(){var e,r;try{return(r=(e=window.parent)==null?void 0:e.document)!=null?r:null}catch(o){return null}}function S(e){var r,o;try{return(o=(r=e==null?void 0:e.documentElement)==null?void 0:r.lang)!=null?o:""}catch(t){return""}}function le(){var e,r,o;try{return(o=(r=(e=window.frameElement)==null?void 0:e.getAttribute)==null?void 0:r.call(e,"lang"))!=null?o:""}catch(t){return""}}import{html as ce,LitElement as de}from"lit";import{unsafeHTML as pe}from"lit/directives/unsafe-html.js";var f=class extends de{get _markup(){return`<h${this.level}
     style="margin: 0; font-weight: unset; font-size: unset; line-height: unset;"
   >
     <slot></slot>
   </h${this.level}>
-`}render(){return this.level?pe(this._markup):ce`<slot></slot>`}};g(m,"properties",{level:{type:Number}});customElements.get("w-unstyled-heading")||customElements.define("w-unstyled-heading",m);import{css as P}from"lit";var F=P`
+`}render(){return this.level?pe(this._markup):ce`<slot></slot>`}};g(f,"properties",{level:{type:Number}});customElements.get("w-unstyled-heading")||customElements.define("w-unstyled-heading",f);import{css as P}from"lit";var F=P`
   *,
   :before,
   :after {
@@ -2471,30 +2471,30 @@ var X=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var _=e=>{thro
                     display: none
                 }
             }
-        `;import{css as be}from"lit";var B=be`*,: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}.t4{font-weight:700;font-size:var(--w-font-size-m);line-height:var(--w-line-height-m)}.text-left{text-align:left}.align-middle{vertical-align:middle}.bg-transparent{background-color:#0000}.appearance-none{-webkit-appearance:none;appearance:none}.will-change-height{will-change:height}.border-0{border-width:0}.border-2{border-width:2px}.rounded-8{border-radius:8px}.rounded-l-0{border-top-left-radius:0;border-bottom-left-radius:0}.rounded-r-0{border-top-right-radius:0;border-bottom-right-radius:0}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.hover\\:underline:hover{text-decoration-line:underline}.focus-visible\\:underline:focus-visible{text-decoration-line:underline}.overflow-hidden{overflow:hidden}.focus\\:outline-none:focus{outline-offset:2px;outline:2px solid #0000}.items-center{align-items:center}.justify-between{justify-content:space-between}.relative{position:relative}.static{position:static}.s-bg{background-color:var(--w-s-color-background)}.s-bg-info-subtle{background-color:var(--w-s-color-background-info-subtle)}.s-bg-subtle{background-color:var(--w-s-color-background-subtle)}.hover\\:s-bg-subtle-hover:hover{background-color:var(--w-s-color-background-subtle-hover)}.active\\:s-bg-subtle-active:active{background-color:var(--w-s-color-background-subtle-active)}.s-text{color:var(--w-s-color-text)}.s-icon{color:var(--w-s-color-icon)}.s-border{border-color:var(--w-s-color-border)}.s-surface-sunken{background-color:var(--w-s-color-surface-sunken)}.h-0{height:0}.w-full{width:100%}.m-0{margin:0}.-mx-16{margin-left:-1.6rem;margin-right:-1.6rem}.last-child\\:mb-0>:last-child{margin-bottom:0}.ml-8{margin-left:.8rem}.px-0{padding-left:0;padding-right:0}.px-16{padding-left:1.6rem;padding-right:1.6rem}.py-0{padding-top:0;padding-bottom:0}.py-16{padding-top:1.6rem;padding-bottom:1.6rem}.pt-0{padding-top:0}.pt-16{padding-top:1.6rem}.pt-8{padding-top:.8rem}.invisible{visibility:hidden}.break-words{overflow-wrap:break-word}.cursor-pointer{cursor:pointer}.-rotate-180{--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-rotate:-180deg;transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.part-\\[w-icon-chevron-down-16-part\\]\\:-rotate-180::part(w-icon-chevron-down-16-part){--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-rotate:-180deg;transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.rotate-180{--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-rotate:180deg;transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.part-\\[w-icon-chevron-up-16-part\\]\\:rotate-180::part(w-icon-chevron-up-16-part){--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-rotate:180deg;transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.transform{transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.part-\\[w-icon-chevron-down-16-part\\]\\:transform::part(w-icon-chevron-down-16-part){transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.part-\\[w-icon-chevron-up-16-part\\]\\:transform::part(w-icon-chevron-up-16-part){transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.transform-gpu{transform:translate3d(var(--w-translate-x),var(--w-translate-y),var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.part-\\[w-icon-chevron-down-16-part\\]\\:transform-gpu::part(w-icon-chevron-down-16-part){transform:translate3d(var(--w-translate-x),var(--w-translate-y),var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.part-\\[w-icon-chevron-up-16-part\\]\\:transform-gpu::part(w-icon-chevron-up-16-part){transform:translate3d(var(--w-translate-x),var(--w-translate-y),var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.transition-transform{transition-property:transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.part-\\[w-icon-chevron-down-16-part\\]\\:transition-transform::part(w-icon-chevron-down-16-part){transition-property:transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.part-\\[w-icon-chevron-up-16-part\\]\\:transition-transform::part(w-icon-chevron-up-16-part){transition-property:transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.part-\\[w-icon-chevron-down-16-part\\]\\:ease-in-out::part(w-icon-chevron-down-16-part){transition-timing-function:cubic-bezier(.4,0,.2,1)}.part-\\[w-icon-chevron-up-16-part\\]\\:ease-in-out::part(w-icon-chevron-up-16-part){transition-timing-function:cubic-bezier(.4,0,.2,1)}@media (min-width:480px){.sm\\:rounded-8{border-radius:8px}.sm\\:mx-0{margin-left:0;margin-right:0}}`;var he={base:"group block relative break-words last-child:mb-0 px-16 rounded-8",bleed:"-mx-16 sm:mx-0 rounded-l-0 rounded-r-0 sm:rounded-8",info:"s-bg-info-subtle",neutral:"s-surface-sunken",bordered:"border-2 s-border s-bg"},i={wrapper:"will-change-height s-text py-16",box:"s-bg-subtle hover:s-bg-subtle-hover active:s-bg-subtle-active py-0 px-0 group block relative break-words last-child:mb-0 rounded-8",bleed:"-mx-16 rounded-l-0 rounded-r-0 sm:mx-0 sm:rounded-8",chevron:"inline-block align-middle s-icon",chevronNonBox:"ml-8",chevronTransform:"transform transition-transform transform-gpu ease-in-out",chevronExpand:"-rotate-180",chevronCollapse:"rotate-180",elementsChevronDownTransform:"part-[w-chevrondown]:transform part-[w-chevrondown]:transition-transform part-[w-chevrondown]:transform-gpu part-[w-chevrondown]:ease-in-out",elementsChevronUpTransform:"part-[w-chevronup]:transform part-[w-chevronup]:transition-transform part-[w-chevronup]:transform-gpu part-[w-chevronup]:ease-in-out",elementsChevronExpand:"part-[w-chevrondown]:-rotate-180",elementsChevronCollapse:"part-[w-chevronup]:rotate-180",expansion:"overflow-hidden",expansionNotExpanded:"h-0 invisible",button:"focus:outline-none appearance-none cursor-pointer bg-transparent border-0 m-0 hover:underline focus-visible:underline",buttonBox:"w-full text-left relative inline-flex items-center justify-between group relative break-words last-child:mb-0 px-16 rounded-8",contentWithTitle:"pt-0",title:"flex w-full justify-between items-center",titleType:"t4"},l,N,D,A,R,O,U,s=class extends we{constructor(){super(...arguments);C(this,l);this.expanded=!1;this.box=!1;this.bleed=!1;this.noChevron=!1;this.animated=!1;this._hasTitle=!0;this._showChevronUp=!1}updated(o){o.has("expanded")&&setTimeout(()=>{this._showChevronUp=this.expanded},200)}firstUpdated(){var a;let o=!!this.title,t=((a=this.renderRoot.querySelector("slot[name='title']"))==null?void 0:a.assignedNodes().length)>0;this._hasTitle=o||t}get _expandableSlot(){return d`<div class="${w(this,l,O)}">
+        `;import{css as be}from"lit";var B=be`*,: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}.t4{font-weight:700;font-size:var(--w-font-size-m);line-height:var(--w-line-height-m)}.text-left{text-align:left}.align-middle{vertical-align:middle}.bg-transparent{background-color:#0000}.appearance-none{-webkit-appearance:none;appearance:none}.will-change-height{will-change:height}.border-0{border-width:0}.border-2{border-width:2px}.rounded-8{border-radius:8px}.rounded-l-0{border-top-left-radius:0;border-bottom-left-radius:0}.rounded-r-0{border-top-right-radius:0;border-bottom-right-radius:0}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.hover\\:underline:hover{text-decoration-line:underline}.focus-visible\\:underline:focus-visible{text-decoration-line:underline}.overflow-hidden{overflow:hidden}.focus\\:outline-none:focus{outline-offset:2px;outline:2px solid #0000}.items-center{align-items:center}.justify-between{justify-content:space-between}.relative{position:relative}.static{position:static}.s-bg{background-color:var(--w-s-color-background)}.s-bg-info-subtle{background-color:var(--w-s-color-background-info-subtle)}.s-bg-subtle{background-color:var(--w-s-color-background-subtle)}.hover\\:s-bg-subtle-hover:hover{background-color:var(--w-s-color-background-subtle-hover)}.active\\:s-bg-subtle-active:active{background-color:var(--w-s-color-background-subtle-active)}.s-text{color:var(--w-s-color-text)}.s-icon{color:var(--w-s-color-icon)}.s-border{border-color:var(--w-s-color-border)}.s-surface-sunken{background-color:var(--w-s-color-surface-sunken)}.h-0{height:0}.w-full{width:100%}.m-0{margin:0}.-mx-16{margin-left:-1.6rem;margin-right:-1.6rem}.last-child\\:mb-0>:last-child{margin-bottom:0}.ml-8{margin-left:.8rem}.px-0{padding-left:0;padding-right:0}.px-16{padding-left:1.6rem;padding-right:1.6rem}.py-0{padding-top:0;padding-bottom:0}.py-16{padding-top:1.6rem;padding-bottom:1.6rem}.pt-0{padding-top:0}.pt-16{padding-top:1.6rem}.pt-8{padding-top:.8rem}.invisible{visibility:hidden}.break-words{overflow-wrap:break-word}.cursor-pointer{cursor:pointer}.-rotate-180{--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-rotate:-180deg;transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.part-\\[w-icon-chevron-down-16-part\\]\\:-rotate-180::part(w-icon-chevron-down-16-part){--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-rotate:-180deg;transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.rotate-180{--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-rotate:180deg;transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.part-\\[w-icon-chevron-up-16-part\\]\\:rotate-180::part(w-icon-chevron-up-16-part){--w-rotate-x:0;--w-rotate-y:0;--w-rotate-z:0;--w-rotate:180deg;transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.transform{transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.part-\\[w-icon-chevron-down-16-part\\]\\:transform::part(w-icon-chevron-down-16-part){transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.part-\\[w-icon-chevron-up-16-part\\]\\:transform::part(w-icon-chevron-up-16-part){transform:translateX(var(--w-translate-x))translateY(var(--w-translate-y))translateZ(var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.transform-gpu{transform:translate3d(var(--w-translate-x),var(--w-translate-y),var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.part-\\[w-icon-chevron-down-16-part\\]\\:transform-gpu::part(w-icon-chevron-down-16-part){transform:translate3d(var(--w-translate-x),var(--w-translate-y),var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.part-\\[w-icon-chevron-up-16-part\\]\\:transform-gpu::part(w-icon-chevron-up-16-part){transform:translate3d(var(--w-translate-x),var(--w-translate-y),var(--w-translate-z))rotate(var(--w-rotate))rotateX(var(--w-rotate-x))rotateY(var(--w-rotate-y))rotateZ(var(--w-rotate-z))skewX(var(--w-skew-x))skewY(var(--w-skew-y))scaleX(var(--w-scale-x))scaleY(var(--w-scale-y))scaleZ(var(--w-scale-z))}.transition-transform{transition-property:transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.part-\\[w-icon-chevron-down-16-part\\]\\:transition-transform::part(w-icon-chevron-down-16-part){transition-property:transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.part-\\[w-icon-chevron-up-16-part\\]\\:transition-transform::part(w-icon-chevron-up-16-part){transition-property:transform;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.part-\\[w-icon-chevron-down-16-part\\]\\:ease-in-out::part(w-icon-chevron-down-16-part){transition-timing-function:cubic-bezier(.4,0,.2,1)}.part-\\[w-icon-chevron-up-16-part\\]\\:ease-in-out::part(w-icon-chevron-up-16-part){transition-timing-function:cubic-bezier(.4,0,.2,1)}@media (min-width:480px){.sm\\:rounded-8{border-radius:8px}.sm\\:mx-0{margin-left:0;margin-right:0}}`;var he={base:"group block relative break-words last-child:mb-0 px-16 rounded-8",bleed:"-mx-16 sm:mx-0 rounded-l-0 rounded-r-0 sm:rounded-8",info:"s-bg-info-subtle",neutral:"s-surface-sunken",bordered:"border-2 s-border s-bg"},i={wrapper:"will-change-height s-text py-16",box:"s-bg-subtle hover:s-bg-subtle-hover active:s-bg-subtle-active py-0 px-0 group block relative break-words last-child:mb-0 rounded-8",bleed:"-mx-16 rounded-l-0 rounded-r-0 sm:mx-0 sm:rounded-8",chevron:"inline-block align-middle s-icon",chevronNonBox:"ml-8",chevronTransform:"transform transition-transform transform-gpu ease-in-out",chevronExpand:"-rotate-180",chevronCollapse:"rotate-180",elementsChevronDownTransform:"part-[w-chevrondown]:transform part-[w-chevrondown]:transition-transform part-[w-chevrondown]:transform-gpu part-[w-chevrondown]:ease-in-out",elementsChevronUpTransform:"part-[w-chevronup]:transform part-[w-chevronup]:transition-transform part-[w-chevronup]:transform-gpu part-[w-chevronup]:ease-in-out",elementsChevronExpand:"part-[w-chevrondown]:-rotate-180",elementsChevronCollapse:"part-[w-chevronup]:rotate-180",expansion:"overflow-hidden",expansionNotExpanded:"h-0 invisible",button:"focus:outline-none appearance-none cursor-pointer bg-transparent border-0 m-0 hover:underline focus-visible:underline",buttonBox:"w-full text-left relative inline-flex items-center justify-between group relative break-words last-child:mb-0 px-16 rounded-8",contentWithTitle:"pt-0",title:"flex w-full justify-between items-center",titleType:"t4"},l,N,D,A,R,O,U,s=class extends we{constructor(){super(...arguments);C(this,l);this.expanded=!1;this.box=!1;this.bleed=!1;this.noChevron=!1;this.animated=!1;this._hasTitle=!0;this._showChevronUp=!1}updated(o){o.has("expanded")&&setTimeout(()=>{this._showChevronUp=this.expanded},200)}firstUpdated(){var a;let o=!!this.title,t=((a=this.renderRoot.querySelector("slot[name='title']"))==null?void 0:a.assignedNodes().length)>0;this._hasTitle=o||t}get _expandableSlot(){return p`<div class="${w(this,l,O)}">
       <slot></slot>
-    </div>`}render(){return d` <div class="${w(this,l,N)}">
-      ${this._hasTitle?d`<w-unstyled-heading level=${this.headingLevel}>
+    </div>`}render(){return p` <div class="${w(this,l,N)}">
+      ${this._hasTitle?p`<w-unstyled-heading level=${this.headingLevel}>
             <button
               type="button"
               aria-expanded="${this.expanded}"
               class="${w(this,l,D)}"
               @click=${()=>this.expanded=!this.expanded}>
               <div class="${i.title}">
-                ${this.title?d`<span class="${i.titleType}">${this.title}</span>`:d`<slot name="title"></slot>`}
-                ${this.noChevron?"":d`<div class="${w(this,l,A)}">${w(this,l,R)}</div>`}
+                ${this.title?p`<span class="${i.titleType}">${this.title}</span>`:p`<slot name="title"></slot>`}
+                ${this.noChevron?"":p`<div class="${w(this,l,A)}">${w(this,l,R)}</div>`}
               </div>
             </button>
           </w-unstyled-heading>`:""}
-      ${this.animated?d`<w-expand-transition ?show=${this.expanded}> ${this._expandableSlot} </w-expand-transition>`:d`<div class="${w(this,l,U)}" aria-hidden=${ge(this.expanded?void 0:!0)}>
+      ${this.animated?p`<w-expand-transition ?show=${this.expanded}> ${this._expandableSlot} </w-expand-transition>`:p`<div class="${w(this,l,U)}" aria-hidden=${ge(this.expanded?void 0:!0)}>
             ${this._expandableSlot}
           </div>`}
-    </div>`}};l=new WeakSet,N=function(){return p([i.wrapper,this.box&&i.box,this.bleed&&i.bleed])},D=function(){return p(this.buttonClass,[i.button,this.box&&i.buttonBox])},A=function(){return p([i.chevron,!this.box&&i.chevronNonBox])},R=function(){let o=p([i.elementsChevronUpTransform,"flex",!this.expanded&&this._showChevronUp&&i.elementsChevronCollapse]),t=p([i.elementsChevronDownTransform,"flex",this.expanded&&!this._showChevronUp&&i.elementsChevronExpand]),a=j();return this._showChevronUp?d`<w-icon name="ChevronUp" size="small" locale="${a}" class="${o}"></w-icon>`:d`<w-icon name="ChevronDown" size="small" locale="${a}" class="${t}"></w-icon>`},O=function(){return p(this.contentClass,[this.box?"pt-16":"pt-8",this.box&&he.base,this._hasTitle&&this.box&&i.contentWithTitle])},U=function(){return p([i.expansion,!this.expanded&&i.expansionNotExpanded])},s.styles=[F,B,ve`
+    </div>`}};l=new WeakSet,N=function(){return b([i.wrapper,this.box&&i.box,this.bleed&&i.bleed])},D=function(){return b(this.buttonClass,[i.button,this.box&&i.buttonBox])},A=function(){return b([i.chevron,!this.box&&i.chevronNonBox])},R=function(){let o=b([i.elementsChevronUpTransform,"flex",!this.expanded&&this._showChevronUp&&i.elementsChevronCollapse]),t=b([i.elementsChevronDownTransform,"flex",this.expanded&&!this._showChevronUp&&i.elementsChevronExpand]),a=j();return this._showChevronUp?p`<w-icon name="ChevronUp" size="small" locale="${a}" class="${o}"></w-icon>`:p`<w-icon name="ChevronDown" size="small" locale="${a}" class="${t}"></w-icon>`},O=function(){return b(this.contentClass,[this.box?"pt-16":"pt-8",this.box&&he.base,this._hasTitle&&this.box&&i.contentWithTitle])},U=function(){return b([i.expansion,!this.expanded&&i.expansionNotExpanded])},s.styles=[F,B,ve`
       :host {
         display: block;
       }
       ::slotted(:last-child) {
         margin-bottom: 0px !important;
       }
-    `],n([c({type:Boolean,reflect:!0})],s.prototype,"expanded",2),n([c({type:String})],s.prototype,"title",2),n([c({type:Boolean})],s.prototype,"box",2),n([c({type:Boolean})],s.prototype,"bleed",2),n([c({attribute:"button-class",type:String})],s.prototype,"buttonClass",2),n([c({attribute:"content-class",type:String})],s.prototype,"contentClass",2),n([c({attribute:"no-chevron",type:Boolean})],s.prototype,"noChevron",2),n([c({type:Boolean})],s.prototype,"animated",2),n([c({attribute:"heading-level",type:Number})],s.prototype,"headingLevel",2),n([c({type:Boolean,state:!0})],s.prototype,"_hasTitle",2),n([c({type:Boolean,state:!0})],s.prototype,"_showChevronUp",2);customElements.get("w-expandable")||customElements.define("w-expandable",s);export{s as WarpExpandable};
+    `],n([d({type:Boolean,reflect:!0})],s.prototype,"expanded",2),n([d({type:String})],s.prototype,"title",2),n([d({type:Boolean})],s.prototype,"box",2),n([d({type:Boolean})],s.prototype,"bleed",2),n([d({attribute:"button-class",type:String})],s.prototype,"buttonClass",2),n([d({attribute:"content-class",type:String})],s.prototype,"contentClass",2),n([d({attribute:"no-chevron",type:Boolean})],s.prototype,"noChevron",2),n([d({type:Boolean})],s.prototype,"animated",2),n([d({attribute:"heading-level",type:Number})],s.prototype,"headingLevel",2),n([d({type:Boolean,state:!0})],s.prototype,"_hasTitle",2),n([d({type:Boolean,state:!0})],s.prototype,"_showChevronUp",2);customElements.get("w-expandable")||customElements.define("w-expandable",s);export{s as WarpExpandable};
 //# sourceMappingURL=expandable.js.map