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

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

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

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

@@ -0,0 +1,25 @@
+import { describe, expect, test, beforeEach, afterEach } from 'vitest';
+import { setupHydrationWarningCapture, testHydration } from '../../tests/react-hydration';
+import './step.js';
+describe('w-step React SSR hydration', () => {
+    beforeEach(() => setupHydrationWarningCapture());
+    afterEach(() => {
+        window.__HYDRATION_WARNINGS__ = [];
+    });
+    test('default (no attributes) hydrates without warnings', async () => {
+        const warnings = await testHydration('w-step', {});
+        expect(warnings).toEqual([]);
+    });
+    test('active step hydrates without warnings', async () => {
+        const warnings = await testHydration('w-step', {
+            active: true,
+        });
+        expect(warnings).toEqual([]);
+    });
+    test('completed step hydrates without warnings', async () => {
+        const warnings = await testHydration('w-step', {
+            completed: true,
+        });
+        expect(warnings).toEqual([]);
+    });
+});

package/dist/packages/step/step.js

@@ -32,7 +32,7 @@ Please compile your catalog first.
   --w-icon-size: 32px;
 }
 
-`;var Y=new Map,Ke='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function Qe(o,e={}){var t;let r=(t=e.responseParser)!=null?t:(a=>a.text());return Y.has(o)||Y.set(o,fetch(o).then(r)),Y.get(o)}var v=class extends Ge{constructor(){super(...arguments);this.name="";this.svg=null}async fetchIcon(r){let a=`https://assets.finn.no/pkg/eikons/v1/${this.locale||"en"}/${r}.svg`;try{let s=await Qe(a);return new DOMParser().parseFromString(s,"text/html").body.querySelector("svg")}catch(s){return null}}firstUpdated(){this.loadIcon()}updated(r){(r.has("name")||r.has("locale"))&&this.loadIcon()}async loadIcon(){if(!this.name){this.svg=null;return}let r=await this.fetchIcon(this.name);r||(r=new DOMParser().parseFromString(Ke,"text/html").body.firstElementChild),this.svg=r}render(){let r=this.size||"medium",t={"w-icon":!0,"w-icon--s":r==="small","w-icon--m":r==="medium","w-icon--l":r==="large"},a=typeof r=="string"&&r.endsWith("px")?`--w-icon-size: ${r};`:"";return qe`<div class="${Be(t)}" style="${a}" part="w-${this.name.toLowerCase()}">${this.svg}</div>`}};v.styles=[ae],u([$({type:String,reflect:!0})],v.prototype,"name",2),u([$({type:String,reflect:!0})],v.prototype,"size",2),u([$({type:String,reflect:!0})],v.prototype,"locale",2),u([Je()],v.prototype,"svg",2);customElements.get("w-icon")||customElements.define("w-icon",v);var We=["en","nb","fi","da","sv"],R="en",S=o=>We.find(e=>o===e||o.toLowerCase().includes(e))||R;function O(){if(typeof window=="undefined"){let o=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return S(o)}try{let o=ne(document);if(o)return S(o);let e=tr();if(e)return S(e);let r=ne(ce());return r?S(r):R}catch(o){return console.warn("could not detect locale, falling back to source locale",o),R}}var se=(o,e,r,t,a)=>{g.load("en",o),g.load("nb",e),g.load("fi",r),g.load("da",t),g.load("sv",a);let s=O();g.activate(s),le(),rr()},er="warp-i18n-change";function le(){typeof window!="undefined"&&window.dispatchEvent(new Event(er))}var ie=!1;function rr(){if(ie||typeof window=="undefined"||!(document!=null&&document.documentElement))return;ie=!0;let o=()=>{let a=O();g.locale!==a&&(g.activate(a),le())},e=new MutationObserver(a=>{for(let s of a)if(s.type==="attributes"&&s.attributeName==="lang"){o();break}});e.observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});let r=ce();r&&r.documentElement&&r!==document&&e.observe(r.documentElement,{attributes:!0,attributeFilter:["lang"]});let t=or();t&&e.observe(t,{attributes:!0,attributeFilter:["lang"]})}function ce(){var o,e;try{return(e=(o=window.parent)==null?void 0:o.document)!=null?e:null}catch(r){return null}}function ne(o){var e,r;try{return(r=(e=o==null?void 0:o.documentElement)==null?void 0:e.lang)!=null?r:""}catch(t){return""}}function or(){var o;try{return(o=window.frameElement)!=null?o:null}catch(e){return null}}function tr(){var o,e,r;try{return(r=(e=(o=window.frameElement)==null?void 0:o.getAttribute)==null?void 0:e.call(o,"lang"))!=null?r:""}catch(t){return""}}import{css as ar}from"lit";var de=ar`*,: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}.text-center{text-align:center}.text-right{text-align:right}.border-2{border-width:2px}.rounded-full{border-radius:9999px}.flex{display:flex}.grid{display:grid}.flex-1{flex:1}.gap-x-16{column-gap:1.6rem}.gap-y-16{row-gap:1.6rem}.row-span-2{grid-row:span 2/span 2}.col-span-3{grid-column:span 3/span 3}.row-start-1{grid-row-start:1}.row-start-2{grid-row-start:2}.col-start-2{grid-column-start:2}.grid-flow-col{grid-auto-flow:column}.grid-rows-\\[20px_auto\\]{grid-template-rows:20px auto}.grid-rows-\\[auto_20px\\]{grid-template-rows:auto 20px}.grid-cols-\\[1fr_20px_1fr\\]{grid-template-columns:1fr 20px 1fr}.grid-cols-\\[1fr_20px\\]{grid-template-columns:1fr 20px}.grid-cols-\\[20px_1fr\\]{grid-template-columns:20px 1fr}.items-center{align-items:center}.justify-self-end{justify-self:end}.justify-self-center{justify-self:center}.static{position:static}.s-bg{background-color:var(--w-s-color-background)}.s-bg-disabled{background-color:var(--w-s-color-background-disabled)}.s-bg-primary{background-color:var(--w-s-color-background-primary)}.s-icon-inverted{color:var(--w-s-color-icon-inverted)}.s-border{border-color:var(--w-s-color-border)}.s-border-primary{border-color:var(--w-s-color-border-primary)}.h-2{height:.2rem}.h-20{height:2rem}.h-full{height:100%}.w-2{width:.2rem}.w-20{width:2rem}.w-full{width:100%}.last\\:mb-0:last-child{margin-bottom:0}.px-16{padding-left:1.6rem;padding-right:1.6rem}.pb-0{padding-bottom:0}.pb-32{padding-bottom:3.2rem}.invisible{visibility:hidden}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}`;import{css as pe}from"lit";var ge=pe`
+`;var Y=new Map,Ke='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function Qe(o,e={}){var t;let r=(t=e.responseParser)!=null?t:(a=>a.text());return Y.has(o)||Y.set(o,fetch(o).then(r)),Y.get(o)}var v=class extends Ge{constructor(){super(...arguments);this.svg=null}async fetchIcon(r){let a=`https://assets.finn.no/pkg/eikons/v1/${this.locale||"en"}/${r}.svg`;try{let s=await Qe(a);return new DOMParser().parseFromString(s,"text/html").body.querySelector("svg")}catch(s){return null}}firstUpdated(){this.loadIcon()}updated(r){(r.has("name")||r.has("locale"))&&this.loadIcon()}async loadIcon(){if(!this.name){this.svg=null;return}let r=await this.fetchIcon(this.name);r||(r=new DOMParser().parseFromString(Ke,"text/html").body.firstElementChild),this.svg=r}render(){let r=this.size||"medium",t=this.name||"",a={"w-icon":!0,"w-icon--s":r==="small","w-icon--m":r==="medium","w-icon--l":r==="large"},s=typeof r=="string"&&r.endsWith("px")?`--w-icon-size: ${r};`:"";return qe`<div class="${Be(a)}" style="${s}" part="w-${t.toLowerCase()}">${this.svg}</div>`}};v.styles=[ae],u([$({type:String,reflect:!0})],v.prototype,"name",2),u([$({type:String,reflect:!0})],v.prototype,"size",2),u([$({type:String,reflect:!0})],v.prototype,"locale",2),u([Je()],v.prototype,"svg",2);customElements.get("w-icon")||customElements.define("w-icon",v);var We=["en","nb","fi","da","sv"],R="en",S=o=>We.find(e=>o===e||o.toLowerCase().includes(e))||R;function O(){if(typeof window=="undefined"){let o=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return S(o)}try{let o=ne(document);if(o)return S(o);let e=tr();if(e)return S(e);let r=ne(ce());return r?S(r):R}catch(o){return console.warn("could not detect locale, falling back to source locale",o),R}}var se=(o,e,r,t,a)=>{g.load("en",o),g.load("nb",e),g.load("fi",r),g.load("da",t),g.load("sv",a);let s=O();g.activate(s),le(),rr()},er="warp-i18n-change";function le(){typeof window!="undefined"&&window.dispatchEvent(new Event(er))}var ie=!1;function rr(){if(ie||typeof window=="undefined"||!(document!=null&&document.documentElement))return;ie=!0;let o=()=>{let a=O();g.locale!==a&&(g.activate(a),le())},e=new MutationObserver(a=>{for(let s of a)if(s.type==="attributes"&&s.attributeName==="lang"){o();break}});e.observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});let r=ce();r&&r.documentElement&&r!==document&&e.observe(r.documentElement,{attributes:!0,attributeFilter:["lang"]});let t=or();t&&e.observe(t,{attributes:!0,attributeFilter:["lang"]})}function ce(){var o,e;try{return(e=(o=window.parent)==null?void 0:o.document)!=null?e:null}catch(r){return null}}function ne(o){var e,r;try{return(r=(e=o==null?void 0:o.documentElement)==null?void 0:e.lang)!=null?r:""}catch(t){return""}}function or(){var o;try{return(o=window.frameElement)!=null?o:null}catch(e){return null}}function tr(){var o,e,r;try{return(r=(e=(o=window.frameElement)==null?void 0:o.getAttribute)==null?void 0:e.call(o,"lang"))!=null?r:""}catch(t){return""}}import{css as ar}from"lit";var de=ar`*,: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}.text-center{text-align:center}.text-right{text-align:right}.border-2{border-width:2px}.rounded-full{border-radius:9999px}.flex{display:flex}.grid{display:grid}.flex-1{flex:1}.gap-x-16{column-gap:1.6rem}.gap-y-16{row-gap:1.6rem}.row-span-2{grid-row:span 2/span 2}.col-span-3{grid-column:span 3/span 3}.row-start-1{grid-row-start:1}.row-start-2{grid-row-start:2}.col-start-2{grid-column-start:2}.grid-flow-col{grid-auto-flow:column}.grid-rows-\\[20px_auto\\]{grid-template-rows:20px auto}.grid-rows-\\[auto_20px\\]{grid-template-rows:auto 20px}.grid-cols-\\[1fr_20px_1fr\\]{grid-template-columns:1fr 20px 1fr}.grid-cols-\\[1fr_20px\\]{grid-template-columns:1fr 20px}.grid-cols-\\[20px_1fr\\]{grid-template-columns:20px 1fr}.items-center{align-items:center}.justify-self-end{justify-self:end}.justify-self-center{justify-self:center}.static{position:static}.s-bg{background-color:var(--w-s-color-background)}.s-bg-disabled{background-color:var(--w-s-color-background-disabled)}.s-bg-primary{background-color:var(--w-s-color-background-primary)}.s-icon-inverted{color:var(--w-s-color-icon-inverted)}.s-border{border-color:var(--w-s-color-border)}.s-border-primary{border-color:var(--w-s-color-border-primary)}.h-2{height:.2rem}.h-20{height:2rem}.h-full{height:100%}.w-2{width:.2rem}.w-20{width:2rem}.w-full{width:100%}.last\\:mb-0:last-child{margin-bottom:0}.px-16{padding-left:1.6rem;padding-right:1.6rem}.pb-0{padding-bottom:0}.pb-32{padding-bottom:3.2rem}.invisible{visibility:hidden}.transition-colors{transition-property:color,background-color,border-color,text-decoration-color,fill,stroke;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}`;import{css as pe}from"lit";var ge=pe`
   *,
   :before,
   :after {