@warp-ds/elements 2.8.2-next.2 → 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,d=e.length-1,u;d>=0;d--)(u=e[d])&&(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 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,7 +23,7 @@ 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.svg=null}async fetchIcon(o){let a=`https://assets.finn.no/pkg/eikons/v1/${this.locale||"en"}/${o}.svg`;try{let d=await ee(a);return new DOMParser().parseFromString(d,"text/html").body.querySelector("svg")}catch(d){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={"w-icon":!0,"w-icon--s":o==="small","w-icon--m":o==="medium","w-icon--l":o==="large"},a=typeof o=="string"&&o.endsWith("px")?`--w-icon-size: ${o};`:"";return I`<div class="${Q(t)}" style="${a}" 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(d=>{r=d})})(),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(d=>{r=d})})(),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;
       }
@@ -2496,5 +2496,5 @@ var X=Object.defineProperty;var q=Object.getOwnPropertyDescriptor;var _=e=>{thro
       ::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