@warp-ds/elements 2.2.0-next.21 → 2.2.0-next.23

package/dist/packages/alert/styles.js

@@ -1,2 +1,2 @@
 import { css } from 'lit';
-export const styles = css `*,: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}.will-change-height{will-change:height}.border{border-width:1px}.border-l-4{border-left-width:4px}.rounded-4{border-radius:4px}.block{display:block}.flex{display:flex}.static{position:static}.s-bg-info-subtle{background-color:var(--w-s-color-background-info-subtle)}.s-bg-negative-subtle{background-color:var(--w-s-color-background-negative-subtle)}.s-bg-positive-subtle{background-color:var(--w-s-color-background-positive-subtle)}.s-bg-warning-subtle{background-color:var(--w-s-color-background-warning-subtle)}.s-text{color:var(--w-s-color-text)}.s-icon-info{color:var(--w-s-color-icon-info)}.s-icon-negative{color:var(--w-s-color-icon-negative)}.s-icon-positive{color:var(--w-s-color-icon-positive)}.s-icon-warning{color:var(--w-s-color-icon-warning)}.s-border-info-subtle{border-color:var(--w-s-color-border-info-subtle)}.s-border-l-info{border-left-color:var(--w-s-color-border-info)}.s-border-l-negative{border-left-color:var(--w-s-color-border-negative)}.s-border-l-positive{border-left-color:var(--w-s-color-border-positive)}.s-border-l-warning{border-left-color:var(--w-s-color-border-warning)}.s-border-negative-subtle{border-color:var(--w-s-color-border-negative-subtle)}.s-border-positive-subtle{border-color:var(--w-s-color-border-positive-subtle)}.s-border-warning-subtle{border-color:var(--w-s-color-border-warning-subtle)}.min-w-16{min-width:1.6rem}.w-16{width:1.6rem}.last-child\\:mb-0>:last-child{margin-bottom:0}.mr-8{margin-right:.8rem}.p-16{padding:1.6rem}.text-s{font-size:var(--w-font-size-s);line-height:var(--w-line-height-s)}`;
+export const styles = css `*,: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}.will-change-height{will-change:height}.border{border-width:1px}.border-l-4{border-left-width:4px}.rounded-4{border-radius:4px}.block{display:block}.inline{display:inline}.flex{display:flex}.static{position:static}.s-bg-info-subtle{background-color:var(--w-s-color-background-info-subtle)}.s-bg-negative-subtle{background-color:var(--w-s-color-background-negative-subtle)}.s-bg-positive-subtle{background-color:var(--w-s-color-background-positive-subtle)}.s-bg-warning-subtle{background-color:var(--w-s-color-background-warning-subtle)}.s-text{color:var(--w-s-color-text)}.s-icon-info{color:var(--w-s-color-icon-info)}.s-icon-negative{color:var(--w-s-color-icon-negative)}.s-icon-positive{color:var(--w-s-color-icon-positive)}.s-icon-warning{color:var(--w-s-color-icon-warning)}.s-border-info-subtle{border-color:var(--w-s-color-border-info-subtle)}.s-border-l-info{border-left-color:var(--w-s-color-border-info)}.s-border-l-negative{border-left-color:var(--w-s-color-border-negative)}.s-border-l-positive{border-left-color:var(--w-s-color-border-positive)}.s-border-l-warning{border-left-color:var(--w-s-color-border-warning)}.s-border-negative-subtle{border-color:var(--w-s-color-border-negative-subtle)}.s-border-positive-subtle{border-color:var(--w-s-color-border-positive-subtle)}.s-border-warning-subtle{border-color:var(--w-s-color-border-warning-subtle)}.min-w-16{min-width:1.6rem}.w-16{width:1.6rem}.last-child\\:mb-0>:last-child{margin-bottom:0}.mr-8{margin-right:.8rem}.p-16{padding:1.6rem}.text-s{font-size:var(--w-font-size-s);line-height:var(--w-line-height-s)}`;

package/dist/packages/attention/attention.stories.d.ts

@@ -1,6 +1,7 @@
 import type { Meta, StoryObj } from '@storybook/web-components-vite';
 import type { WarpAttention } from './index.js';
 import './index.js';
+import '../button/index.js';
 declare const args: Partial<WarpAttention> & {
     [key: string]: any;
 };

package/dist/packages/attention/attention.stories.js

@@ -3,18 +3,19 @@ import { getStorybookHelpers } from '@wc-toolkit/storybook-helpers';
 import { html } from 'lit';
 import { prespread } from '../../.storybook/utilities.js';
 import './index.js';
+import '../button/index.js';
 const { events, args, argTypes } = getStorybookHelpers('w-attention');
 const meta = {
     title: 'Overlays/Attention',
     render(args) {
         return html `
       <w-attention ${spread(prespread(args))}>
-        <button
+        <w-button
           ${spread({ id: args.buttonId })}
-          class="group block relative break-words last-child:mb-0 p-16 rounded-8 s-bg-subtle"
+          variant="secondary"
           slot="target">
           ${args.buttonText}
-        </button>
+        </w-button>
         <span slot="message">I'm a message</span>
       </w-attention>
     `;
@@ -37,7 +38,13 @@ export const Default = {
     render(args) {
         return html `
       <w-attention ${spread(prespread(args))}>
-        <w-button id="popoverTarget" slot="target" @click=${(e) => { const attention = e.currentTarget.closest('w-attention'); attention.show = !attention.show; }}> Click to toggle a popover </w-button>
+        <w-button 
+          id="popoverTarget" 
+          slot="target"
+          variant="secondary"
+          @click=${(e) => { const attention = e.currentTarget.closest('w-attention'); attention.show = !attention.show; }}>
+            Click to toggle a popover
+        </w-button>
         <span slot="message">I'm a popover</span>
       </w-attention>
     `;
@@ -148,13 +155,13 @@ export const AccessibleTooltip = {
           <p id="aria-content" role="tooltip">I'm a popover with ARIA "tooltip" role</p>
           <p>(this text is less relevant)</p>
         </div>
-        <button
+        <w-button
           aria-details="aria-content"
           id="accessible-target"
-          class="group block relative break-words last-child:mb-0 p-16 rounded-8 s-bg-subtle"
-          slot="target">
+          slot="target"
+          variant="secondary">
           Click to toggle a popover
-        </button>
+        </w-button>
       </w-attention>
     `;
     },

package/dist/packages/attention/index.js

@@ -3346,7 +3346,7 @@ Please compile your catalog first.
     padding-top: 4rem;
     padding-bottom: 4rem;
   }
-`;var Cr=JSON.parse('{"attention.aria.callout":["En gr\xF8n taleboble der introducerer noget nyt"],"attention.aria.close":["Luk"],"attention.aria.highlight":["En opm\xE6rksomhedsskabende taleboble med vigtig information"],"attention.aria.pointingDown":["peger nedad"],"attention.aria.pointingLeft":["peger til venstre"],"attention.aria.pointingRight":["peger til h\xF8jre"],"attention.aria.pointingUp":["peger opad"],"attention.aria.popover":["En hvid taleboble med mere information"],"attention.aria.tooltip":["En sort taleboble med flere oplysninger"]}');var Sr=JSON.parse('{"attention.aria.callout":["A green speech bubble introducing something new"],"attention.aria.close":["Close"],"attention.aria.highlight":["An attention speech bubble with important information"],"attention.aria.pointingDown":["pointing down"],"attention.aria.pointingLeft":["pointing left"],"attention.aria.pointingRight":["pointing right"],"attention.aria.pointingUp":["pointing up"],"attention.aria.popover":["A white speech bubble providing additional information"],"attention.aria.tooltip":["A black speech bubble providing complementary information"]}');var Er=JSON.parse('{"attention.aria.callout":["Vihre\xE4 puhekupla, joka esittelee jotain uutta"],"attention.aria.close":["Sulje"],"attention.aria.highlight":["Puhekupla, joka sis\xE4lt\xE4\xE4 t\xE4rke\xE4\xE4 tietoa"],"attention.aria.pointingDown":["osoittaa alas"],"attention.aria.pointingLeft":["osoittaa vasemmalle"],"attention.aria.pointingRight":["osoittaa oikealle"],"attention.aria.pointingUp":["osoittaa yl\xF6s"],"attention.aria.popover":["Valkoinen puhekupla, joka tarjoaa lis\xE4tietoa"],"attention.aria.tooltip":["Musta puhekupla, joka tarjoaa t\xE4ydent\xE4v\xE4\xE4 tietoa"]}');var Lr=JSON.parse('{"attention.aria.callout":["Gr\xF8nn taleboble som introduserer noe nytt"],"attention.aria.close":["Lukk"],"attention.aria.highlight":["En uthevet taleboble med viktig informasjon"],"attention.aria.pointingDown":["peker ned"],"attention.aria.pointingLeft":["peker til venstre"],"attention.aria.pointingRight":["peker til h\xF8yre"],"attention.aria.pointingUp":["peker opp"],"attention.aria.popover":["En hvit taleboble som gir tilleggsinformasjon"],"attention.aria.tooltip":["En svart taleboble som forklarer konteksten"]}');var Or=JSON.parse('{"attention.aria.callout":["En gr\xF6n pratbubbla som introducerar n\xE5got nytt"],"attention.aria.close":["St\xE4ng"],"attention.aria.highlight":["En pratbubbla med viktig information"],"attention.aria.pointingDown":["pekar ned"],"attention.aria.pointingLeft":["pekar v\xE4nster"],"attention.aria.pointingRight":["pekar h\xF6ger"],"attention.aria.pointingUp":["pekar upp"],"attention.aria.popover":["En vit pratbubbla som ger ytterligare information"],"attention.aria.tooltip":["En svart pratbubbla som ger kompletterande information"]}');import{css as ai}from"lit";var Ar=ai`*,: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}.hover\\:bg-clip-padding:hover{-webkit-background-clip:padding-box;background-clip:padding-box}.bg-transparent{background-color:#0000}.bg-\\[--w-color-button-primary-background\\]{background-color:var(--w-color-button-primary-background)}.bg-\\[--w-color-callout-background\\]{background-color:var(--w-color-callout-background)}.bg-\\[--w-s-color-surface-elevated-300\\]{background-color:var(--w-s-color-surface-elevated-300)}.hover\\:bg-\\[--w-color-button-pill-background-hover\\]:hover{background-color:var(--w-color-button-pill-background-hover)}.hover\\:bg-\\[--w-color-button-primary-background-hover\\]:hover{background-color:var(--w-color-button-primary-background-hover)}.active\\:bg-\\[--w-color-button-pill-background-active\\]:active{background-color:var(--w-color-button-pill-background-active)}.active\\:bg-\\[--w-color-button-primary-background-active\\]:active{background-color:var(--w-color-button-primary-background-active)}.border{border-width:1px}.border-0{border-width:0}.border-2{border-width:2px}.border-b-0{border-bottom-width:0}.border-r-0{border-right-width:0}.border-\\[--w-color-callout-border\\]{border-color:var(--w-color-callout-border)}.border-\\[--w-s-color-background-inverted\\]{border-color:var(--w-s-color-background-inverted)}.border-\\[--w-s-color-surface-elevated-300\\]{border-color:var(--w-s-color-surface-elevated-300)}.border-solid{border-style:solid}.rounded-4{border-radius:4px}.rounded-8{border-radius:8px}.rounded-full{border-radius:9999px}.rounded-tl-4{border-top-left-radius:4px}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.contents{display:contents}.hidden{display:none}.hover\\:underline:hover,.focus\\:underline:focus,.active\\:underline:active{text-decoration-line:underline}.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}.items-start{align-items:flex-start}.items-center{align-items:center}.-bottom-\\[8px\\]{bottom:-8px}.-left-\\[8px\\]{left:-8px}.-right-\\[8px\\]{right:-8px}.-top-\\[8px\\]{top:-8px}.justify-center{justify-content:center}.justify-self-end{justify-self:end}.absolute{position:absolute}.relative{position:relative}.static{position:static}.z-50{z-index:50}.s-bg{background-color:var(--w-s-color-background)}.s-bg-disabled{background-color:var(--w-s-color-background-disabled)}.s-bg-inverted{background-color:var(--w-s-color-background-inverted)}.s-bg-negative{background-color:var(--w-s-color-background-negative)}.s-bg-subtle{background-color:var(--w-s-color-background-subtle)}.hover\\:s-bg-hover:hover{background-color:var(--w-s-color-background-hover)}.hover\\:s-bg-negative-hover:hover{background-color:var(--w-s-color-background-negative-hover)}.hover\\:s-bg-negative-subtle-hover:hover{background-color:var(--w-s-color-background-negative-subtle-hover)}.active\\:s-bg-active:active{background-color:var(--w-s-color-background-active)}.active\\:s-bg-negative-active:active{background-color:var(--w-s-color-background-negative-active)}.active\\:s-bg-negative-subtle-active:active{background-color:var(--w-s-color-background-negative-subtle-active)}.s-text{color:var(--w-s-color-text)}.s-text-inverted{color:var(--w-s-color-text-inverted)}.s-text-inverted-static{color:var(--w-s-color-text-inverted-static)}.s-text-link{color:var(--w-s-color-text-link)}.s-text-negative{color:var(--w-s-color-text-negative)}.s-icon{color:var(--w-s-color-icon)}.hover\\:s-icon-hover:hover{color:var(--w-s-color-icon-hover)}.active\\:s-icon-active:active{color:var(--w-s-color-icon-active)}.s-border{border-color:var(--w-s-color-border)}.hover\\:s-border-hover:hover{border-color:var(--w-s-color-border-hover)}.active\\:s-border-active:active{border-color:var(--w-s-color-border-active)}.drop-shadow-m{filter:drop-shadow(0 3px 8px #4040403d)drop-shadow(0 3px 6px #40404029)}.shadow-m{box-shadow:var(--w-shadow-m)}.h-\\[14px\\]{height:14px}.w-\\[14px\\]{width:14px}.-mr-8{margin-right:-.8rem}.last-child\\:mb-0>:last-child{margin-bottom:0}.ml-8{margin-left:.8rem}.p-16{padding:1.6rem}.p-4{padding:.4rem}.px-16{padding-left:1.6rem;padding-right:1.6rem}.px-8{padding-left:.8rem;padding-right:.8rem}.py-6{padding-top:.6rem;padding-bottom:.6rem}.py-8{padding-top:.8rem;padding-bottom:.8rem}.font-bold{font-weight:700}.resize{resize:both}.translate-z-0{--w-translate-z:0rem;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))}.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)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.text-m{font-size:var(--w-font-size-m);line-height:var(--w-line-height-m)}.text-xs{font-size:var(--w-font-size-xs);line-height:var(--w-line-height-xs)}.leading-\\[24\\]{line-height:2.4rem}`;import{LitElement as si}from"lit";import{unsafeStatic as li,html as ci}from"lit/static-html.js";var di=JSON.parse('{"icon.title.close":["Kryss"]}'),ui=JSON.parse('{"icon.title.close":["Cross"]}'),gi=JSON.parse('{"icon.title.close":["Rasti"]}'),mi=JSON.parse('{"icon.title.close":["Kryds"]}'),pi=JSON.parse('{"icon.title.close":["Kryss"]}'),Dr=["en","nb","fi","da","sv"],zr="en",hi=()=>{var e;let t;switch((e=process==null?void 0:process.env)==null?void 0:e.NMP_BRAND){case"FINN":t="nb";break;case"TORI":t="fi";break;case"BLOCKET":t="sv";break;case"DBA":t="da";break;default:t="en"}return t},Tr=()=>{var e;let t=(e=document==null?void 0:document.location)==null?void 0:e.hostname;return t!=null&&t.includes("finn")?"nb":t.includes("tori")?"fi":t.includes("blocket")?"sv":t.includes("dba")?"da":zr},kt=e=>Dr.find(t=>e===t||e.toLowerCase().includes(t))||Tr();function bi(){var e;if(typeof window=="undefined"){let t=hi();return kt(t)}try{let t=(e=document==null?void 0:document.documentElement)==null?void 0:e.lang,r=Tr();return Dr.includes(t)?kt(t!=null?t:r):(console.warn("Unsupported locale set in html lang tag, falling back to detection by hostname"),kt(r))}catch(t){return console.warn("could not detect locale, falling back to source locale",t),zr}}var fi=(e,t,r,o,i,a)=>e==="nb"?r:e==="fi"?o:e==="da"?i:e==="sv"?a:t,vi=(e,t,r,o,i)=>{let a=bi(),n=fi(a,e,t,r,o,i);P.load(a,n),P.activate(a)};vi(ui,di,gi,mi,pi);var wi=class extends si{render(){let e=P.t({message:"Cross",id:"icon.title.close",comment:"Title for close icon"});return ci`<svg xmlns="http://www.w3.org/2000/svg"width="16"height="16"fill="none"viewBox="0 0 16 16" part="w-icon-close-16-part">${li(`<title>${e}</title>`)}<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m12.5 3.5-9 9m0-9 9 9"></path></svg>`}};customElements.get("w-icon-close-16")||customElements.define("w-icon-close-16",wi);var O=function(e,t,r,o){if(r==="a"&&!o)throw new TypeError("Private accessor was defined without a getter");if(typeof t=="function"?e!==t||!o:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return r==="m"?o:r==="a"?o.call(e):o?o.value:t.get(e)},R=function(e,t,r,o,i){if(o==="m")throw new TypeError("Private method is not writable");if(o==="a"&&!i)throw new TypeError("Private accessor was defined without a setter");if(typeof t=="function"?e!==t||!i:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return o==="a"?i.call(e,r):i?i.value=r:t.set(e,r),r};function lt(e){var t,r,o,i,a,n,s,l,d,c,g,f,u,b,x,v,_,C,E;class q extends e{constructor(...w){var y,L,A;super(...w),t.add(this),this.internals=this.attachInternals(),r.set(this,!1),o.set(this,!1),i.set(this,!1),a.set(this,void 0),n.set(this,void 0),s.set(this,!0),d.set(this,""),c.set(this,()=>{R(this,i,!0,"f"),R(this,r,!0,"f"),O(this,t,"m",v).call(this)}),g.set(this,()=>{R(this,r,!1,"f"),O(this,t,"m",_).call(this,this.shouldFormValueUpdate()?O(this,d,"f"):""),!this.validity.valid&&O(this,i,"f")&&R(this,o,!0,"f");let z=O(this,t,"m",v).call(this);this.validationMessageCallback&&this.validationMessageCallback(z?this.internals.validationMessage:"")}),f.set(this,()=>{var z;O(this,s,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),R(this,s,!1,"f")),R(this,i,!0,"f"),R(this,o,!0,"f"),O(this,t,"m",v).call(this),(z=this===null||this===void 0?void 0:this.validationMessageCallback)===null||z===void 0||z.call(this,this.showError?this.internals.validationMessage:"")}),u.set(this,void 0),b.set(this,!1),x.set(this,Promise.resolve()),(y=this.addEventListener)===null||y===void 0||y.call(this,"focus",O(this,c,"f")),(L=this.addEventListener)===null||L===void 0||L.call(this,"blur",O(this,g,"f")),(A=this.addEventListener)===null||A===void 0||A.call(this,"invalid",O(this,f,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let w=this.validators.map(A=>A.attribute).flat(),y=super.observedAttributes||[];return[...new Set([...y,...w])]}static getValidator(w){return this.validators.find(y=>y.attribute===w)||null}static getValidators(w){return this.validators.filter(y=>{var L;if(y.attribute===w||!((L=y.attribute)===null||L===void 0)&&L.includes(w))return!0})}get form(){return this.internals.form}get showError(){return O(this,t,"m",v).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(w,y,L){var A;(A=super.attributeChangedCallback)===null||A===void 0||A.call(this,w,y,L);let I=this.constructor.getValidators(w);I!=null&&I.length&&this.validationTarget&&this.setValue(O(this,d,"f"))}setValue(w){var y;R(this,o,!1,"f"),(y=this.validationMessageCallback)===null||y===void 0||y.call(this,""),R(this,d,w,"f");let A=this.shouldFormValueUpdate()?w:null;this.internals.setFormValue(A),O(this,t,"m",_).call(this,A),this.valueChangedCallback&&this.valueChangedCallback(A),O(this,t,"m",v).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(w=>w(O(this,x,"f")))}formResetCallback(){var w,y;R(this,i,!1,"f"),R(this,o,!1,"f"),O(this,t,"m",v).call(this),(w=this.resetFormControl)===null||w===void 0||w.call(this),(y=this.validationMessageCallback)===null||y===void 0||y.call(this,O(this,t,"m",v).call(this)?this.validationMessage:"")}}return r=new WeakMap,o=new WeakMap,i=new WeakMap,a=new WeakMap,n=new WeakMap,s=new WeakMap,d=new WeakMap,c=new WeakMap,g=new WeakMap,f=new WeakMap,u=new WeakMap,b=new WeakMap,x=new WeakMap,t=new WeakSet,l=function(){let w=this.getRootNode(),y=`${this.localName}[name="${this.getAttribute("name")}"]`;return w.querySelectorAll(y)},v=function(){if(this.hasAttribute("disabled"))return!1;let w=O(this,o,"f")||O(this,i,"f")&&!this.validity.valid&&!O(this,r,"f");return w&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),w},_=function(w){let y=this.constructor,L={},A=y.validators,z=[],I=A.some(M=>M.isValid instanceof Promise);O(this,b,"f")||(R(this,x,new Promise(M=>{R(this,u,M,"f")}),"f"),R(this,b,!0,"f")),O(this,a,"f")&&(O(this,a,"f").abort(),R(this,n,O(this,a,"f"),"f"));let B=new AbortController;R(this,a,B,"f");let U,j=!1;A.length&&(A.forEach(M=>{let Z=M.key||"customError",F=M.isValid(this,w,B.signal);F instanceof Promise?(z.push(F),F.then(K=>{K!=null&&(L[Z]=!K,U=O(this,t,"m",E).call(this,M,w),O(this,t,"m",C).call(this,L,U))})):(L[Z]=!F,this.validity[Z]!==!F&&(j=!0),!F&&!U&&(U=O(this,t,"m",E).call(this,M,w)))}),Promise.allSettled(z).then(()=>{var M;B!=null&&B.signal.aborted||(R(this,b,!1,"f"),(M=O(this,u,"f"))===null||M===void 0||M.call(this))}),(j||!I)&&O(this,t,"m",C).call(this,L,U))},C=function(w,y){if(this.validationTarget)this.internals.setValidity(w,y,this.validationTarget),R(this,s,!1,"f");else{if(this.internals.setValidity(w,y),this.internals.validity.valid)return;R(this,s,!0,"f")}},E=function(w,y){if(this.validityCallback){let L=this.validityCallback(w.key||"customError");if(L)return L}return w.message instanceof Function?w.message(this,y):w.message},q}import{html as ct,LitElement as Qr}from"lit";import{property as J}from"lit/decorators.js";import{html as yi,LitElement as Pr}from"lit";import{property as ie}from"lit/decorators.js";import{classMap as ki}from"lit/directives/class-map.js";import{css as xi}from"lit";var Mr=xi`.w-button,
+`;var Cr=JSON.parse('{"attention.aria.callout":["En gr\xF8n taleboble der introducerer noget nyt"],"attention.aria.close":["Luk"],"attention.aria.highlight":["En opm\xE6rksomhedsskabende taleboble med vigtig information"],"attention.aria.pointingDown":["peger nedad"],"attention.aria.pointingLeft":["peger til venstre"],"attention.aria.pointingRight":["peger til h\xF8jre"],"attention.aria.pointingUp":["peger opad"],"attention.aria.popover":["En hvid taleboble med mere information"],"attention.aria.tooltip":["En sort taleboble med flere oplysninger"]}');var Sr=JSON.parse('{"attention.aria.callout":["A green speech bubble introducing something new"],"attention.aria.close":["Close"],"attention.aria.highlight":["An attention speech bubble with important information"],"attention.aria.pointingDown":["pointing down"],"attention.aria.pointingLeft":["pointing left"],"attention.aria.pointingRight":["pointing right"],"attention.aria.pointingUp":["pointing up"],"attention.aria.popover":["A white speech bubble providing additional information"],"attention.aria.tooltip":["A black speech bubble providing complementary information"]}');var Er=JSON.parse('{"attention.aria.callout":["Vihre\xE4 puhekupla, joka esittelee jotain uutta"],"attention.aria.close":["Sulje"],"attention.aria.highlight":["Puhekupla, joka sis\xE4lt\xE4\xE4 t\xE4rke\xE4\xE4 tietoa"],"attention.aria.pointingDown":["osoittaa alas"],"attention.aria.pointingLeft":["osoittaa vasemmalle"],"attention.aria.pointingRight":["osoittaa oikealle"],"attention.aria.pointingUp":["osoittaa yl\xF6s"],"attention.aria.popover":["Valkoinen puhekupla, joka tarjoaa lis\xE4tietoa"],"attention.aria.tooltip":["Musta puhekupla, joka tarjoaa t\xE4ydent\xE4v\xE4\xE4 tietoa"]}');var Lr=JSON.parse('{"attention.aria.callout":["Gr\xF8nn taleboble som introduserer noe nytt"],"attention.aria.close":["Lukk"],"attention.aria.highlight":["En uthevet taleboble med viktig informasjon"],"attention.aria.pointingDown":["peker ned"],"attention.aria.pointingLeft":["peker til venstre"],"attention.aria.pointingRight":["peker til h\xF8yre"],"attention.aria.pointingUp":["peker opp"],"attention.aria.popover":["En hvit taleboble som gir tilleggsinformasjon"],"attention.aria.tooltip":["En svart taleboble som forklarer konteksten"]}');var Or=JSON.parse('{"attention.aria.callout":["En gr\xF6n pratbubbla som introducerar n\xE5got nytt"],"attention.aria.close":["St\xE4ng"],"attention.aria.highlight":["En pratbubbla med viktig information"],"attention.aria.pointingDown":["pekar ned"],"attention.aria.pointingLeft":["pekar v\xE4nster"],"attention.aria.pointingRight":["pekar h\xF6ger"],"attention.aria.pointingUp":["pekar upp"],"attention.aria.popover":["En vit pratbubbla som ger ytterligare information"],"attention.aria.tooltip":["En svart pratbubbla som ger kompletterande information"]}');import{css as ai}from"lit";var Ar=ai`*,: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}.hover\\:bg-clip-padding:hover{-webkit-background-clip:padding-box;background-clip:padding-box}.bg-transparent{background-color:#0000}.bg-\\[--w-color-button-primary-background\\]{background-color:var(--w-color-button-primary-background)}.bg-\\[--w-color-callout-background\\]{background-color:var(--w-color-callout-background)}.bg-\\[--w-s-color-surface-elevated-300\\]{background-color:var(--w-s-color-surface-elevated-300)}.hover\\:bg-\\[--w-color-button-pill-background-hover\\]:hover{background-color:var(--w-color-button-pill-background-hover)}.hover\\:bg-\\[--w-color-button-primary-background-hover\\]:hover{background-color:var(--w-color-button-primary-background-hover)}.active\\:bg-\\[--w-color-button-pill-background-active\\]:active{background-color:var(--w-color-button-pill-background-active)}.active\\:bg-\\[--w-color-button-primary-background-active\\]:active{background-color:var(--w-color-button-primary-background-active)}.border{border-width:1px}.border-0{border-width:0}.border-2{border-width:2px}.border-b-0{border-bottom-width:0}.border-r-0{border-right-width:0}.border-\\[--w-color-callout-border\\]{border-color:var(--w-color-callout-border)}.border-\\[--w-s-color-background-inverted\\]{border-color:var(--w-s-color-background-inverted)}.border-\\[--w-s-color-surface-elevated-300\\]{border-color:var(--w-s-color-surface-elevated-300)}.rounded-4{border-radius:4px}.rounded-8{border-radius:8px}.rounded-full{border-radius:9999px}.rounded-tl-4{border-top-left-radius:4px}.inline{display:inline}.flex{display:flex}.inline-flex{display:inline-flex}.contents{display:contents}.hidden{display:none}.hover\\:underline:hover,.focus\\:underline:focus,.active\\:underline:active{text-decoration-line:underline}.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}.items-start{align-items:flex-start}.items-center{align-items:center}.-bottom-\\[8px\\]{bottom:-8px}.-left-\\[8px\\]{left:-8px}.-right-\\[8px\\]{right:-8px}.-top-\\[8px\\]{top:-8px}.justify-center{justify-content:center}.justify-self-end{justify-self:end}.absolute{position:absolute}.relative{position:relative}.static{position:static}.z-50{z-index:50}.s-bg{background-color:var(--w-s-color-background)}.s-bg-disabled{background-color:var(--w-s-color-background-disabled)}.s-bg-inverted{background-color:var(--w-s-color-background-inverted)}.s-bg-negative{background-color:var(--w-s-color-background-negative)}.s-bg-subtle{background-color:var(--w-s-color-background-subtle)}.hover\\:s-bg-hover:hover{background-color:var(--w-s-color-background-hover)}.hover\\:s-bg-negative-hover:hover{background-color:var(--w-s-color-background-negative-hover)}.hover\\:s-bg-negative-subtle-hover:hover{background-color:var(--w-s-color-background-negative-subtle-hover)}.active\\:s-bg-active:active{background-color:var(--w-s-color-background-active)}.active\\:s-bg-negative-active:active{background-color:var(--w-s-color-background-negative-active)}.active\\:s-bg-negative-subtle-active:active{background-color:var(--w-s-color-background-negative-subtle-active)}.s-text{color:var(--w-s-color-text)}.s-text-inverted{color:var(--w-s-color-text-inverted)}.s-text-inverted-static{color:var(--w-s-color-text-inverted-static)}.s-text-link{color:var(--w-s-color-text-link)}.s-text-negative{color:var(--w-s-color-text-negative)}.s-icon{color:var(--w-s-color-icon)}.hover\\:s-icon-hover:hover{color:var(--w-s-color-icon-hover)}.active\\:s-icon-active:active{color:var(--w-s-color-icon-active)}.s-border{border-color:var(--w-s-color-border)}.hover\\:s-border-hover:hover{border-color:var(--w-s-color-border-hover)}.active\\:s-border-active:active{border-color:var(--w-s-color-border-active)}.drop-shadow-m{filter:drop-shadow(0 3px 8px #4040403d)drop-shadow(0 3px 6px #40404029)}.shadow-m{box-shadow:var(--w-shadow-m)}.h-\\[14px\\]{height:14px}.w-\\[14px\\]{width:14px}.-mr-8{margin-right:-.8rem}.last-child\\:mb-0>:last-child{margin-bottom:0}.ml-8{margin-left:.8rem}.p-16{padding:1.6rem}.p-4{padding:.4rem}.px-16{padding-left:1.6rem;padding-right:1.6rem}.px-8{padding-left:.8rem;padding-right:.8rem}.py-6{padding-top:.6rem;padding-bottom:.6rem}.py-8{padding-top:.8rem;padding-bottom:.8rem}.font-bold{font-weight:700}.resize{resize:both}.translate-z-0{--w-translate-z:0rem;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))}.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)}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.text-m{font-size:var(--w-font-size-m);line-height:var(--w-line-height-m)}.text-xs{font-size:var(--w-font-size-xs);line-height:var(--w-line-height-xs)}.leading-\\[24\\]{line-height:2.4rem}`;import{LitElement as si}from"lit";import{unsafeStatic as li,html as ci}from"lit/static-html.js";var di=JSON.parse('{"icon.title.close":["Kryss"]}'),ui=JSON.parse('{"icon.title.close":["Cross"]}'),gi=JSON.parse('{"icon.title.close":["Rasti"]}'),mi=JSON.parse('{"icon.title.close":["Kryds"]}'),pi=JSON.parse('{"icon.title.close":["Kryss"]}'),Dr=["en","nb","fi","da","sv"],zr="en",hi=()=>{var e;let t;switch((e=process==null?void 0:process.env)==null?void 0:e.NMP_BRAND){case"FINN":t="nb";break;case"TORI":t="fi";break;case"BLOCKET":t="sv";break;case"DBA":t="da";break;default:t="en"}return t},Tr=()=>{var e;let t=(e=document==null?void 0:document.location)==null?void 0:e.hostname;return t!=null&&t.includes("finn")?"nb":t.includes("tori")?"fi":t.includes("blocket")?"sv":t.includes("dba")?"da":zr},kt=e=>Dr.find(t=>e===t||e.toLowerCase().includes(t))||Tr();function bi(){var e;if(typeof window=="undefined"){let t=hi();return kt(t)}try{let t=(e=document==null?void 0:document.documentElement)==null?void 0:e.lang,r=Tr();return Dr.includes(t)?kt(t!=null?t:r):(console.warn("Unsupported locale set in html lang tag, falling back to detection by hostname"),kt(r))}catch(t){return console.warn("could not detect locale, falling back to source locale",t),zr}}var fi=(e,t,r,o,i,a)=>e==="nb"?r:e==="fi"?o:e==="da"?i:e==="sv"?a:t,vi=(e,t,r,o,i)=>{let a=bi(),n=fi(a,e,t,r,o,i);P.load(a,n),P.activate(a)};vi(ui,di,gi,mi,pi);var wi=class extends si{render(){let e=P.t({message:"Cross",id:"icon.title.close",comment:"Title for close icon"});return ci`<svg xmlns="http://www.w3.org/2000/svg"width="16"height="16"fill="none"viewBox="0 0 16 16" part="w-icon-close-16-part">${li(`<title>${e}</title>`)}<path stroke="currentColor" stroke-linecap="round" stroke-linejoin="round" stroke-width="1.5" d="m12.5 3.5-9 9m0-9 9 9"></path></svg>`}};customElements.get("w-icon-close-16")||customElements.define("w-icon-close-16",wi);var O=function(e,t,r,o){if(r==="a"&&!o)throw new TypeError("Private accessor was defined without a getter");if(typeof t=="function"?e!==t||!o:!t.has(e))throw new TypeError("Cannot read private member from an object whose class did not declare it");return r==="m"?o:r==="a"?o.call(e):o?o.value:t.get(e)},R=function(e,t,r,o,i){if(o==="m")throw new TypeError("Private method is not writable");if(o==="a"&&!i)throw new TypeError("Private accessor was defined without a setter");if(typeof t=="function"?e!==t||!i:!t.has(e))throw new TypeError("Cannot write private member to an object whose class did not declare it");return o==="a"?i.call(e,r):i?i.value=r:t.set(e,r),r};function lt(e){var t,r,o,i,a,n,s,l,d,c,g,f,u,b,x,v,_,C,E;class q extends e{constructor(...w){var y,L,A;super(...w),t.add(this),this.internals=this.attachInternals(),r.set(this,!1),o.set(this,!1),i.set(this,!1),a.set(this,void 0),n.set(this,void 0),s.set(this,!0),d.set(this,""),c.set(this,()=>{R(this,i,!0,"f"),R(this,r,!0,"f"),O(this,t,"m",v).call(this)}),g.set(this,()=>{R(this,r,!1,"f"),O(this,t,"m",_).call(this,this.shouldFormValueUpdate()?O(this,d,"f"):""),!this.validity.valid&&O(this,i,"f")&&R(this,o,!0,"f");let z=O(this,t,"m",v).call(this);this.validationMessageCallback&&this.validationMessageCallback(z?this.internals.validationMessage:"")}),f.set(this,()=>{var z;O(this,s,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),R(this,s,!1,"f")),R(this,i,!0,"f"),R(this,o,!0,"f"),O(this,t,"m",v).call(this),(z=this===null||this===void 0?void 0:this.validationMessageCallback)===null||z===void 0||z.call(this,this.showError?this.internals.validationMessage:"")}),u.set(this,void 0),b.set(this,!1),x.set(this,Promise.resolve()),(y=this.addEventListener)===null||y===void 0||y.call(this,"focus",O(this,c,"f")),(L=this.addEventListener)===null||L===void 0||L.call(this,"blur",O(this,g,"f")),(A=this.addEventListener)===null||A===void 0||A.call(this,"invalid",O(this,f,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let w=this.validators.map(A=>A.attribute).flat(),y=super.observedAttributes||[];return[...new Set([...y,...w])]}static getValidator(w){return this.validators.find(y=>y.attribute===w)||null}static getValidators(w){return this.validators.filter(y=>{var L;if(y.attribute===w||!((L=y.attribute)===null||L===void 0)&&L.includes(w))return!0})}get form(){return this.internals.form}get showError(){return O(this,t,"m",v).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(w,y,L){var A;(A=super.attributeChangedCallback)===null||A===void 0||A.call(this,w,y,L);let I=this.constructor.getValidators(w);I!=null&&I.length&&this.validationTarget&&this.setValue(O(this,d,"f"))}setValue(w){var y;R(this,o,!1,"f"),(y=this.validationMessageCallback)===null||y===void 0||y.call(this,""),R(this,d,w,"f");let A=this.shouldFormValueUpdate()?w:null;this.internals.setFormValue(A),O(this,t,"m",_).call(this,A),this.valueChangedCallback&&this.valueChangedCallback(A),O(this,t,"m",v).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(w=>w(O(this,x,"f")))}formResetCallback(){var w,y;R(this,i,!1,"f"),R(this,o,!1,"f"),O(this,t,"m",v).call(this),(w=this.resetFormControl)===null||w===void 0||w.call(this),(y=this.validationMessageCallback)===null||y===void 0||y.call(this,O(this,t,"m",v).call(this)?this.validationMessage:"")}}return r=new WeakMap,o=new WeakMap,i=new WeakMap,a=new WeakMap,n=new WeakMap,s=new WeakMap,d=new WeakMap,c=new WeakMap,g=new WeakMap,f=new WeakMap,u=new WeakMap,b=new WeakMap,x=new WeakMap,t=new WeakSet,l=function(){let w=this.getRootNode(),y=`${this.localName}[name="${this.getAttribute("name")}"]`;return w.querySelectorAll(y)},v=function(){if(this.hasAttribute("disabled"))return!1;let w=O(this,o,"f")||O(this,i,"f")&&!this.validity.valid&&!O(this,r,"f");return w&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),w},_=function(w){let y=this.constructor,L={},A=y.validators,z=[],I=A.some(M=>M.isValid instanceof Promise);O(this,b,"f")||(R(this,x,new Promise(M=>{R(this,u,M,"f")}),"f"),R(this,b,!0,"f")),O(this,a,"f")&&(O(this,a,"f").abort(),R(this,n,O(this,a,"f"),"f"));let B=new AbortController;R(this,a,B,"f");let U,j=!1;A.length&&(A.forEach(M=>{let Z=M.key||"customError",F=M.isValid(this,w,B.signal);F instanceof Promise?(z.push(F),F.then(K=>{K!=null&&(L[Z]=!K,U=O(this,t,"m",E).call(this,M,w),O(this,t,"m",C).call(this,L,U))})):(L[Z]=!F,this.validity[Z]!==!F&&(j=!0),!F&&!U&&(U=O(this,t,"m",E).call(this,M,w)))}),Promise.allSettled(z).then(()=>{var M;B!=null&&B.signal.aborted||(R(this,b,!1,"f"),(M=O(this,u,"f"))===null||M===void 0||M.call(this))}),(j||!I)&&O(this,t,"m",C).call(this,L,U))},C=function(w,y){if(this.validationTarget)this.internals.setValidity(w,y,this.validationTarget),R(this,s,!1,"f");else{if(this.internals.setValidity(w,y),this.internals.validity.valid)return;R(this,s,!0,"f")}},E=function(w,y){if(this.validityCallback){let L=this.validityCallback(w.key||"customError");if(L)return L}return w.message instanceof Function?w.message(this,y):w.message},q}import{html as ct,LitElement as Qr}from"lit";import{property as J}from"lit/decorators.js";import{html as yi,LitElement as Pr}from"lit";import{property as ie}from"lit/decorators.js";import{classMap as ki}from"lit/directives/class-map.js";import{css as xi}from"lit";var Mr=xi`.w-button,
 .w-button--secondary {
     /* Local scoped variables, given the default button (the secondary variant) as a default */
     --_background: var(--background, var(--w-s-color-background));