@warp-ds/elements 2.10.0 → 2.11.0-next.1

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

@@ -3,30 +3,30 @@ import React from "react";
 import { Textarea } from "./react";
 declare const _default: {
     title: string;
-    render(args: Omit<Omit<Omit<React.HTMLAttributes<import("./textarea").WarpTextarea>, "value" | "form" | "label" | "name" | "disabled" | "invalid" | "helpText" | "optional" | "placeholder" | "readOnly" | "readonly" | "required" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onblur" | "onchange" | "onfocus" | "oninput" | "updated" | "firstUpdated" | "resetFormControl" | "_helptextstyles" | "_helpId" | "_id" | "_error" | "handler" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onFocus" | "onBlur" | "onChange" | "onInput" | "reportValidity" | "setCustomValidity" | "maxRows" | "minRows" | "_textareaStyles"> & {
-        onBlur?: ((e: Event) => void) | undefined;
-        onblur?: ((e: Event) => void) | undefined;
-        onChange?: ((e: Event) => void) | undefined;
-        onchange?: ((e: Event) => void) | undefined;
-        onInput?: ((e: Event) => void) | undefined;
-        oninput?: ((e: Event) => void) | undefined;
-        onFocus?: ((e: Event) => void) | undefined;
-        onfocus?: ((e: Event) => void) | undefined;
+    render(args: Omit<Omit<Omit<React.HTMLAttributes<import("./textarea").WarpTextarea>, "name" | "disabled" | "invalid" | "label" | "helpText" | "optional" | "placeholder" | "readOnly" | "readonly" | "required" | "value" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onblur" | "onchange" | "onfocus" | "oninput" | "updated" | "firstUpdated" | "resetFormControl" | "_helptextstyles" | "_helpId" | "_id" | "_error" | "handler" | "render" | "validationTarget" | "form" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onFocus" | "onBlur" | "onChange" | "onInput" | "reportValidity" | "maxRows" | "minRows" | "setCustomValidity" | "_textareaStyles"> & {
+        onBlur?: ((e: FocusEvent) => void) | undefined;
+        onblur?: ((e: FocusEvent) => void) | undefined;
+        onChange?: ((e: import("../types").ChangeEventWithTarget<HTMLTextAreaElement>) => void) | undefined;
+        onchange?: ((e: import("../types").ChangeEventWithTarget<HTMLTextAreaElement>) => void) | undefined;
+        onInput?: ((e: import("../types").InputEventWithTarget<HTMLTextAreaElement>) => void) | undefined;
+        oninput?: ((e: import("../types").InputEventWithTarget<HTMLTextAreaElement>) => void) | undefined;
+        onFocus?: ((e: FocusEvent) => void) | undefined;
+        onfocus?: ((e: FocusEvent) => void) | undefined;
     } & Partial<Omit<import("./textarea").WarpTextarea, keyof HTMLElement>> & React.RefAttributes<import("./textarea").WarpTextarea>, "ref">, "help-text" | "read-only" | "maximum-rows" | "minimum-rows"> & {
         helpText?: string;
         maxRows?: number;
         minRows?: number;
         readOnly?: boolean;
     } & React.RefAttributes<import("./textarea").WarpTextarea>): React.JSX.Element;
-    component: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<import("./textarea").WarpTextarea>, "value" | "form" | "label" | "name" | "disabled" | "invalid" | "helpText" | "optional" | "placeholder" | "readOnly" | "readonly" | "required" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onblur" | "onchange" | "onfocus" | "oninput" | "updated" | "firstUpdated" | "resetFormControl" | "_helptextstyles" | "_helpId" | "_id" | "_error" | "handler" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onFocus" | "onBlur" | "onChange" | "onInput" | "reportValidity" | "setCustomValidity" | "maxRows" | "minRows" | "_textareaStyles"> & {
-        onBlur?: ((e: Event) => void) | undefined;
-        onblur?: ((e: Event) => void) | undefined;
-        onChange?: ((e: Event) => void) | undefined;
-        onchange?: ((e: Event) => void) | undefined;
-        onInput?: ((e: Event) => void) | undefined;
-        oninput?: ((e: Event) => void) | undefined;
-        onFocus?: ((e: Event) => void) | undefined;
-        onfocus?: ((e: Event) => void) | undefined;
+    component: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<import("./textarea").WarpTextarea>, "name" | "disabled" | "invalid" | "label" | "helpText" | "optional" | "placeholder" | "readOnly" | "readonly" | "required" | "value" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onblur" | "onchange" | "onfocus" | "oninput" | "updated" | "firstUpdated" | "resetFormControl" | "_helptextstyles" | "_helpId" | "_id" | "_error" | "handler" | "render" | "validationTarget" | "form" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onFocus" | "onBlur" | "onChange" | "onInput" | "reportValidity" | "maxRows" | "minRows" | "setCustomValidity" | "_textareaStyles"> & {
+        onBlur?: ((e: FocusEvent) => void) | undefined;
+        onblur?: ((e: FocusEvent) => void) | undefined;
+        onChange?: ((e: import("../types").ChangeEventWithTarget<HTMLTextAreaElement>) => void) | undefined;
+        onchange?: ((e: import("../types").ChangeEventWithTarget<HTMLTextAreaElement>) => void) | undefined;
+        onInput?: ((e: import("../types").InputEventWithTarget<HTMLTextAreaElement>) => void) | undefined;
+        oninput?: ((e: import("../types").InputEventWithTarget<HTMLTextAreaElement>) => void) | undefined;
+        onFocus?: ((e: FocusEvent) => void) | undefined;
+        onfocus?: ((e: FocusEvent) => void) | undefined;
     } & Partial<Omit<import("./textarea").WarpTextarea, keyof HTMLElement>> & React.RefAttributes<import("./textarea").WarpTextarea>, "ref">, "help-text" | "read-only" | "maximum-rows" | "minimum-rows"> & {
         helpText?: string;
         maxRows?: number;

package/dist/packages/textfield/react.d.ts

@@ -1,14 +1,20 @@
 import React from "react";
-import { WarpTextField } from "./textfield.js";
-export declare const TextField: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpTextField>, "value" | "form" | "label" | "mask" | "pattern" | "autocomplete" | "name" | "type" | "disabled" | "invalid" | "helpText" | "optional" | "size" | "max" | "min" | "minLength" | "minlength" | "maxLength" | "maxlength" | "placeholder" | "readOnly" | "readonly" | "required" | "step" | "formatter" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onblur" | "onchange" | "onfocus" | "oninput" | "_hasPrefix" | "_hasSuffix" | "updated" | "firstUpdated" | "resetFormControl" | "_inputstyles" | "_helptextstyles" | "_label" | "_helpId" | "_id" | "_error" | "handler" | "prefixSlotChange" | "suffixSlotChange" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onFocus" | "onBlur" | "onChange" | "onInput"> & {
-    onBlur?: ((e: Event) => void) | undefined;
-    onblur?: ((e: Event) => void) | undefined;
-    onChange?: ((e: Event) => void) | undefined;
-    onchange?: ((e: Event) => void) | undefined;
-    onInput?: ((e: Event) => void) | undefined;
-    oninput?: ((e: Event) => void) | undefined;
-    onFocus?: ((e: Event) => void) | undefined;
-    onfocus?: ((e: Event) => void) | undefined;
+import type { ChangeEventWithTarget, InputEventWithTarget } from "../types.js";
+import type { WarpTextField } from "./textfield.js";
+/**
+ * A single-line input component used for entering and editing textual or numeric data.
+ *
+ * [Warp component reference](https://warp-ds.github.io/docs/components/text-area/frameworks/elements)
+ */
+export declare const TextField: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpTextField>, "autocomplete" | "name" | "type" | "disabled" | "invalid" | "label" | "helpText" | "optional" | "size" | "max" | "min" | "minLength" | "minlength" | "maxLength" | "maxlength" | "pattern" | "placeholder" | "readOnly" | "readonly" | "required" | "value" | "step" | "formatter" | "mask" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onblur" | "onchange" | "onfocus" | "oninput" | "_hasPrefix" | "_hasSuffix" | "updated" | "firstUpdated" | "resetFormControl" | "_inputstyles" | "_helptextstyles" | "_label" | "_helpId" | "_id" | "_error" | "handler" | "prefixSlotChange" | "suffixSlotChange" | "render" | "validationTarget" | "form" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onFocus" | "onBlur" | "onChange" | "onInput"> & {
+    onBlur?: ((e: FocusEvent) => void) | undefined;
+    onblur?: ((e: FocusEvent) => void) | undefined;
+    onChange?: ((e: ChangeEventWithTarget<HTMLInputElement>) => void) | undefined;
+    onchange?: ((e: ChangeEventWithTarget<HTMLInputElement>) => void) | undefined;
+    onInput?: ((e: InputEventWithTarget<HTMLInputElement>) => void) | undefined;
+    oninput?: ((e: InputEventWithTarget<HTMLInputElement>) => void) | undefined;
+    onFocus?: ((e: FocusEvent) => void) | undefined;
+    onfocus?: ((e: FocusEvent) => void) | undefined;
 } & Partial<Omit<WarpTextField, keyof HTMLElement>> & React.RefAttributes<WarpTextField>, "ref">, "help-text" | "min-length" | "max-length" | "read-only"> & {
     helpText?: string;
     minLength?: number;

package/dist/packages/textfield/react.js

@@ -19,6 +19,11 @@ const BaseTextField = createComponent({
         onfocus: "focus",
     },
 });
+/**
+ * A single-line input component used for entering and editing textual or numeric data.
+ *
+ * [Warp component reference](https://warp-ds.github.io/docs/components/text-area/frameworks/elements)
+ */
 export const TextField = React.forwardRef(({ helpText, minLength, maxLength, readOnly, ...props }, ref) => React.createElement(BaseTextField, {
     ...props,
     ...(helpText !== undefined ? { "help-text": helpText } : {}),

package/dist/packages/textfield/react.test.d.ts

@@ -0,0 +1 @@
+import "./textfield.js";

package/dist/packages/textfield/react.test.js

@@ -0,0 +1,20 @@
+import React from "react";
+import { userEvent } from "vitest/browser";
+import { render } from "vitest-browser-react";
+import { expect, test, vi } from "vitest";
+import { TextField } from "./react.js";
+import "./textfield.js";
+test("onChange and onInput have the expected types", async () => {
+    const onChange = vi.fn();
+    const onInput = vi.fn();
+    const page = await render(React.createElement(TextField, { name: "test", label: "React TextField", onChange: (e) => {
+            onChange(e.target.value);
+        }, onInput: (e) => {
+            onInput(e.target.value);
+        } }));
+    await page.getByLabelText("React TextField").fill("Hello, World");
+    expect(onInput).toHaveBeenCalled();
+    expect(onChange).not.toHaveBeenCalled();
+    await userEvent.tab(); // trigger a blur to fire the change event
+    expect(onChange).toHaveBeenCalledWith("Hello, World");
+});

package/dist/packages/textfield/textfield.d.ts

@@ -3,13 +3,10 @@ declare const WarpTextField_base: import("@open-wc/form-control").Constructor<im
 /**
  * A single-line input component used for entering and editing textual or numeric data.
  *
+ * [Warp component reference](https://warp-ds.github.io/docs/components/text-area/frameworks/elements)
+ *
  * @slot suffix - Use with `<w-affix>` to include a suffix, for example the unit for a number (e. g. km or sek).
  * @slot prefix - Use with `<w-affix>` to include a prefix, for example a search icon.
- *
- * ## Accessibility Note for Affixes
- * Due to shadow DOM boundaries, affix content cannot be connected to the input via ARIA references.
- * For non-interactive affixes (text labels like currency symbols), consider including that information
- * in the main label or placeholder text instead for better screen reader support.
  */
 declare class WarpTextField extends WarpTextField_base {
     #private;
@@ -168,4 +165,9 @@ declare class WarpTextField extends WarpTextField_base {
     suffixSlotChange(): void;
     render(): import("lit").TemplateResult<1>;
 }
+declare global {
+    interface HTMLElementTagNameMap {
+        "w-textfield": WarpTextField;
+    }
+}
 export { WarpTextField };

package/dist/packages/textfield/textfield.js

@@ -1,4 +1,4 @@
-var je=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var ie=o=>{throw TypeError(o)};var p=(o,e,r,t)=>{for(var a=t>1?void 0:t?Ie(e,r):e,l=o.length-1,s;l>=0;l--)(s=o[l])&&(a=(t?s(e,r,a):s(a))||a);return t&&a&&je(e,r,a),a};var G=(o,e,r)=>e.has(o)||ie("Cannot "+r);var ne=(o,e,r)=>(G(o,e,"read from private field"),r?r.call(o):e.get(o)),J=(o,e,r)=>e.has(o)?ie("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(o):e.set(o,r),se=(o,e,r,t)=>(G(o,e,"write to private field"),t?t.call(o,r):e.set(o,r),r),le=(o,e,r)=>(G(o,e,"access private method"),r);var K=function(){for(var o=[],e=arguments.length;e--;)o[e]=arguments[e];return o.reduce(function(r,t){return r.concat(typeof t=="string"?t:Array.isArray(t)?K.apply(void 0,t):typeof t=="object"&&t?Object.keys(t).map(function(a){return t[a]?a:""}):"")},[]).join(" ")};var L=o=>typeof o=="string",Ye=o=>typeof o=="function",de=new Map,he="en";function re(o){return[...Array.isArray(o)?o:[o],he]}function te(o,e,r){let t=re(o);r||(r="default");let a;if(typeof r=="string")switch(a={day:"numeric",month:"short",year:"numeric"},r){case"full":a.weekday="long";case"long":a.month="long";break;case"short":a.month="numeric";break}else a=r;return X(()=>Z("date",t,r),()=>new Intl.DateTimeFormat(t,a)).format(L(e)?new Date(e):e)}function De(o,e,r){let t;if(r||(r="default"),typeof r=="string")switch(t={second:"numeric",minute:"numeric",hour:"numeric"},r){case"full":case"long":t.timeZoneName="short";break;case"short":delete t.second}else t=r;return te(o,e,t)}function Q(o,e,r){let t=re(o);return X(()=>Z("number",t,r),()=>new Intl.NumberFormat(t,r)).format(e)}function ce(o,e,r,{offset:t=0,...a}){let l=re(o),s=e?X(()=>Z("plural-ordinal",l),()=>new Intl.PluralRules(l,{type:"ordinal"})):X(()=>Z("plural-cardinal",l),()=>new Intl.PluralRules(l,{type:"cardinal"}));return a[r]??a[s.select(r-t)]??a.other}function X(o,e){let r=o(),t=de.get(r);return t||(t=e(),de.set(r,t)),t}function Z(o,e,r){let t=e.join("-");return`${o}-${t}-${JSON.stringify(r)}`}var pe=/\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/,ue=o=>o.replace(/\\u([a-fA-F0-9]{4})|\\x([a-fA-F0-9]{2})/g,(e,r,t)=>{if(r){let a=parseInt(r,16);return String.fromCharCode(a)}else{let a=parseInt(t,16);return String.fromCharCode(a)}}),be="%__lingui_octothorpe__%",He=(o,e,r={})=>{let t=e||o,a=s=>typeof s=="object"?s:r[s],l=(s,n)=>{let b=Object.keys(r).length?a("number"):void 0,f=Q(t,s,b);return n.replace(new RegExp(be,"g"),f)};return{plural:(s,n)=>{let{offset:b=0}=n,f=ce(t,!1,s,n);return l(s-b,f)},selectordinal:(s,n)=>{let{offset:b=0}=n,f=ce(t,!0,s,n);return l(s-b,f)},select:Xe,number:(s,n)=>Q(t,s,a(n)||{style:n}),date:(s,n)=>te(t,s,a(n)||n),time:(s,n)=>De(t,s,a(n)||n)}},Xe=(o,e)=>e[o]??e.other;function Ze(o,e,r){return(t={},a)=>{let l=He(e,r,a),s=(b,f=!1)=>Array.isArray(b)?b.reduce((C,M)=>{if(M==="#"&&f)return C+be;if(L(M))return C+M;let[O,y,E]=M,S={};y==="plural"||y==="selectordinal"||y==="select"?Object.entries(E).forEach(([$,N])=>{S[$]=s(N,y==="plural"||y==="selectordinal")}):S=E;let w;if(y){let $=l[y];w=$(t[O],S)}else w=t[O];return w==null?C:C+w},""):b,n=s(o);return L(n)&&pe.test(n)?ue(n):L(n)?n:n?String(n):""}}var Re=Object.defineProperty,qe=(o,e,r)=>e in o?Re(o,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):o[e]=r,Ue=(o,e,r)=>(qe(o,typeof e!="symbol"?e+"":e,r),r),W=class{constructor(){Ue(this,"_events",{})}on(e,r){var t;return(t=this._events)[e]??(t[e]=[]),this._events[e].push(r),()=>this.removeListener(e,r)}removeListener(e,r){let t=this._getListeners(e);if(!t)return;let a=t.indexOf(r);~a&&t.splice(a,1)}emit(e,...r){let t=this._getListeners(e);t&&t.map(a=>a.apply(this,r))}_getListeners(e){let r=this._events[e];return Array.isArray(r)?r:!1}},Te=Object.defineProperty,Be=(o,e,r)=>e in o?Te(o,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):o[e]=r,V=(o,e,r)=>(Be(o,typeof e!="symbol"?e+"":e,r),r),ee=class extends W{constructor(e){super(),V(this,"_locale",""),V(this,"_locales"),V(this,"_localeData",{}),V(this,"_messages",{}),V(this,"_missing"),V(this,"_messageCompiler"),V(this,"t",this._.bind(this)),e.missing!=null&&(this._missing=e.missing),e.messages!=null&&this.load(e.messages),e.localeData!=null&&this.loadLocaleData(e.localeData),(typeof e.locale=="string"||e.locales)&&this.activate(e.locale??he,e.locales)}get locale(){return this._locale}get locales(){return this._locales}get messages(){return this._messages[this._locale]??{}}get localeData(){return this._localeData[this._locale]??{}}_loadLocaleData(e,r){let t=this._localeData[e];t?Object.assign(t,r):this._localeData[e]=r}setMessagesCompiler(e){return this._messageCompiler=e,this}loadLocaleData(e,r){typeof e=="string"?this._loadLocaleData(e,r):Object.keys(e).forEach(t=>this._loadLocaleData(t,e[t])),this.emit("change")}_load(e,r){let t=this._messages[e];t?Object.assign(t,r):this._messages[e]=r}load(e,r){typeof e=="string"&&typeof r=="object"?this._load(e,r):Object.entries(e).forEach(([t,a])=>this._load(t,a)),this.emit("change")}loadAndActivate({locale:e,locales:r,messages:t}){this._locale=e,this._locales=r||void 0,this._messages[this._locale]=t,this.emit("change")}activate(e,r){this._locale=e,this._locales=r,this.emit("change")}_(e,r,t){if(!this.locale)throw new Error("Lingui: Attempted to call a translation function without setting a locale.\nMake sure to call `i18n.activate(locale)` before using Lingui functions.\nThis issue may also occur due to a race condition in your initialization logic.");let a=t?.message;e||(e=""),L(e)||(r=e.values||r,a=e.message,e=e.id);let l=this.messages[e],s=l===void 0,n=this._missing;if(n&&s)return Ye(n)?n(this._locale,e):n;s&&this.emit("missing",{id:e,locale:this._locale});let b=l||a||e;return L(b)&&(this._messageCompiler?b=this._messageCompiler(b):console.warn(`Uncompiled message detected! Message:
+var je=Object.defineProperty;var Ie=Object.getOwnPropertyDescriptor;var ie=o=>{throw TypeError(o)};var p=(o,e,r,t)=>{for(var a=t>1?void 0:t?Ie(e,r):e,l=o.length-1,s;l>=0;l--)(s=o[l])&&(a=(t?s(e,r,a):s(a))||a);return t&&a&&je(e,r,a),a};var G=(o,e,r)=>e.has(o)||ie("Cannot "+r);var ne=(o,e,r)=>(G(o,e,"read from private field"),r?r.call(o):e.get(o)),J=(o,e,r)=>e.has(o)?ie("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(o):e.set(o,r),se=(o,e,r,t)=>(G(o,e,"write to private field"),t?t.call(o,r):e.set(o,r),r),le=(o,e,r)=>(G(o,e,"access private method"),r);var K=function(){for(var o=[],e=arguments.length;e--;)o[e]=arguments[e];return o.reduce(function(r,t){return r.concat(typeof t=="string"?t:Array.isArray(t)?K.apply(void 0,t):typeof t=="object"&&t?Object.keys(t).map(function(a){return t[a]?a:""}):"")},[]).join(" ")};var L=o=>typeof o=="string",Ye=o=>typeof o=="function",de=new Map,he="en";function re(o){return[...Array.isArray(o)?o:[o],he]}function te(o,e,r){let t=re(o);r||(r="default");let a;if(typeof r=="string")switch(a={day:"numeric",month:"short",year:"numeric"},r){case"full":a.weekday="long";case"long":a.month="long";break;case"short":a.month="numeric";break}else a=r;return X(()=>Z("date",t,r),()=>new Intl.DateTimeFormat(t,a)).format(L(e)?new Date(e):e)}function De(o,e,r){let t;if(r||(r="default"),typeof r=="string")switch(t={second:"numeric",minute:"numeric",hour:"numeric"},r){case"full":case"long":t.timeZoneName="short";break;case"short":delete t.second}else t=r;return te(o,e,t)}function Q(o,e,r){let t=re(o);return X(()=>Z("number",t,r),()=>new Intl.NumberFormat(t,r)).format(e)}function ce(o,e,r,{offset:t=0,...a}){let l=re(o),s=e?X(()=>Z("plural-ordinal",l),()=>new Intl.PluralRules(l,{type:"ordinal"})):X(()=>Z("plural-cardinal",l),()=>new Intl.PluralRules(l,{type:"cardinal"}));return a[r]??a[s.select(r-t)]??a.other}function X(o,e){let r=o(),t=de.get(r);return t||(t=e(),de.set(r,t)),t}function Z(o,e,r){let t=e.join("-");return`${o}-${t}-${JSON.stringify(r)}`}var pe=/\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/,ue=o=>o.replace(/\\u([a-fA-F0-9]{4})|\\x([a-fA-F0-9]{2})/g,(e,r,t)=>{if(r){let a=parseInt(r,16);return String.fromCharCode(a)}else{let a=parseInt(t,16);return String.fromCharCode(a)}}),be="%__lingui_octothorpe__%",He=(o,e,r={})=>{let t=e||o,a=s=>typeof s=="object"?s:r[s],l=(s,i)=>{let b=Object.keys(r).length?a("number"):void 0,f=Q(t,s,b);return i.replace(new RegExp(be,"g"),f)};return{plural:(s,i)=>{let{offset:b=0}=i,f=ce(t,!1,s,i);return l(s-b,f)},selectordinal:(s,i)=>{let{offset:b=0}=i,f=ce(t,!0,s,i);return l(s-b,f)},select:Xe,number:(s,i)=>Q(t,s,a(i)||{style:i}),date:(s,i)=>te(t,s,a(i)||i),time:(s,i)=>De(t,s,a(i)||i)}},Xe=(o,e)=>e[o]??e.other;function Ze(o,e,r){return(t={},a)=>{let l=He(e,r,a),s=(b,f=!1)=>Array.isArray(b)?b.reduce((C,M)=>{if(M==="#"&&f)return C+be;if(L(M))return C+M;let[F,y,E]=M,S={};y==="plural"||y==="selectordinal"||y==="select"?Object.entries(E).forEach(([$,N])=>{S[$]=s(N,y==="plural"||y==="selectordinal")}):S=E;let w;if(y){let $=l[y];w=$(t[F],S)}else w=t[F];return w==null?C:C+w},""):b,i=s(o);return L(i)&&pe.test(i)?ue(i):L(i)?i:i?String(i):""}}var Re=Object.defineProperty,Te=(o,e,r)=>e in o?Re(o,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):o[e]=r,qe=(o,e,r)=>(Te(o,typeof e!="symbol"?e+"":e,r),r),W=class{constructor(){qe(this,"_events",{})}on(e,r){var t;return(t=this._events)[e]??(t[e]=[]),this._events[e].push(r),()=>this.removeListener(e,r)}removeListener(e,r){let t=this._getListeners(e);if(!t)return;let a=t.indexOf(r);~a&&t.splice(a,1)}emit(e,...r){let t=this._getListeners(e);t&&t.map(a=>a.apply(this,r))}_getListeners(e){let r=this._events[e];return Array.isArray(r)?r:!1}},Ue=Object.defineProperty,Be=(o,e,r)=>e in o?Ue(o,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):o[e]=r,V=(o,e,r)=>(Be(o,typeof e!="symbol"?e+"":e,r),r),ee=class extends W{constructor(e){super(),V(this,"_locale",""),V(this,"_locales"),V(this,"_localeData",{}),V(this,"_messages",{}),V(this,"_missing"),V(this,"_messageCompiler"),V(this,"t",this._.bind(this)),e.missing!=null&&(this._missing=e.missing),e.messages!=null&&this.load(e.messages),e.localeData!=null&&this.loadLocaleData(e.localeData),(typeof e.locale=="string"||e.locales)&&this.activate(e.locale??he,e.locales)}get locale(){return this._locale}get locales(){return this._locales}get messages(){return this._messages[this._locale]??{}}get localeData(){return this._localeData[this._locale]??{}}_loadLocaleData(e,r){let t=this._localeData[e];t?Object.assign(t,r):this._localeData[e]=r}setMessagesCompiler(e){return this._messageCompiler=e,this}loadLocaleData(e,r){typeof e=="string"?this._loadLocaleData(e,r):Object.keys(e).forEach(t=>this._loadLocaleData(t,e[t])),this.emit("change")}_load(e,r){let t=this._messages[e];t?Object.assign(t,r):this._messages[e]=r}load(e,r){typeof e=="string"&&typeof r=="object"?this._load(e,r):Object.entries(e).forEach(([t,a])=>this._load(t,a)),this.emit("change")}loadAndActivate({locale:e,locales:r,messages:t}){this._locale=e,this._locales=r||void 0,this._messages[this._locale]=t,this.emit("change")}activate(e,r){this._locale=e,this._locales=r,this.emit("change")}_(e,r,t){if(!this.locale)throw new Error("Lingui: Attempted to call a translation function without setting a locale.\nMake sure to call `i18n.activate(locale)` before using Lingui functions.\nThis issue may also occur due to a race condition in your initialization logic.");let a=t?.message;e||(e=""),L(e)||(r=e.values||r,a=e.message,e=e.id);let l=this.messages[e],s=l===void 0,i=this._missing;if(i&&s)return Ye(i)?i(this._locale,e):i;s&&this.emit("missing",{id:e,locale:this._locale});let b=l||a||e;return L(b)&&(this._messageCompiler?b=this._messageCompiler(b):console.warn(`Uncompiled message detected! Message:
 
 > ${b}
 
@@ -6,7 +6,7 @@ That means you use raw catalog or your catalog doesn't have a translation for th
 ICU features such as interpolation and plurals will not work properly for that message. 
 
 Please compile your catalog first. 
-`)),L(b)&&pe.test(b)?ue(b):L(b)?b:Ze(b,this._locale,this._locales)(r,t?.formats)}date(e,r){return te(this._locales||this._locale,e,r)}number(e,r){return Q(this._locales||this._locale,e,r)}};function Ge(o={}){return new ee(o)}var _=Ge();var h=function(o,e,r,t){if(r==="a"&&!t)throw new TypeError("Private accessor was defined without a getter");if(typeof e=="function"?o!==e||!t:!e.has(o))throw new TypeError("Cannot read private member from an object whose class did not declare it");return r==="m"?t:r==="a"?t.call(o):t?t.value:e.get(o)},m=function(o,e,r,t,a){if(t==="m")throw new TypeError("Private method is not writable");if(t==="a"&&!a)throw new TypeError("Private accessor was defined without a setter");if(typeof e=="function"?o!==e||!a:!e.has(o))throw new TypeError("Cannot write private member to an object whose class did not declare it");return t==="a"?a.call(o,r):a?a.value=r:e.set(o,r),r};function ge(o){var e,r,t,a,l,s,n,b,f,C,M,O,y,E,S,w,$,N,U;class Ae extends o{constructor(...i){var c,g,v;super(...i),e.add(this),this.internals=this.attachInternals(),r.set(this,!1),t.set(this,!1),a.set(this,!1),l.set(this,void 0),s.set(this,void 0),n.set(this,!0),f.set(this,""),C.set(this,()=>{m(this,a,!0,"f"),m(this,r,!0,"f"),h(this,e,"m",w).call(this)}),M.set(this,()=>{m(this,r,!1,"f"),h(this,e,"m",$).call(this,this.shouldFormValueUpdate()?h(this,f,"f"):""),!this.validity.valid&&h(this,a,"f")&&m(this,t,!0,"f");let z=h(this,e,"m",w).call(this);this.validationMessageCallback&&this.validationMessageCallback(z?this.internals.validationMessage:"")}),O.set(this,()=>{var z;h(this,n,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),m(this,n,!1,"f")),m(this,a,!0,"f"),m(this,t,!0,"f"),h(this,e,"m",w).call(this),(z=this===null||this===void 0?void 0:this.validationMessageCallback)===null||z===void 0||z.call(this,this.showError?this.internals.validationMessage:"")}),y.set(this,void 0),E.set(this,!1),S.set(this,Promise.resolve()),(c=this.addEventListener)===null||c===void 0||c.call(this,"focus",h(this,C,"f")),(g=this.addEventListener)===null||g===void 0||g.call(this,"blur",h(this,M,"f")),(v=this.addEventListener)===null||v===void 0||v.call(this,"invalid",h(this,O,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let i=this.validators.map(v=>v.attribute).flat(),c=super.observedAttributes||[];return[...new Set([...c,...i])]}static getValidator(i){return this.validators.find(c=>c.attribute===i)||null}static getValidators(i){return this.validators.filter(c=>{var g;if(c.attribute===i||!((g=c.attribute)===null||g===void 0)&&g.includes(i))return!0})}get form(){return this.internals.form}get showError(){return h(this,e,"m",w).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(i,c,g){var v;(v=super.attributeChangedCallback)===null||v===void 0||v.call(this,i,c,g);let j=this.constructor.getValidators(i);j?.length&&this.validationTarget&&this.setValue(h(this,f,"f"))}setValue(i){var c;m(this,t,!1,"f"),(c=this.validationMessageCallback)===null||c===void 0||c.call(this,""),m(this,f,i,"f");let v=this.shouldFormValueUpdate()?i:null;this.internals.setFormValue(v),h(this,e,"m",$).call(this,v),this.valueChangedCallback&&this.valueChangedCallback(v),h(this,e,"m",w).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(i=>i(h(this,S,"f")))}formResetCallback(){var i,c;m(this,a,!1,"f"),m(this,t,!1,"f"),h(this,e,"m",w).call(this),(i=this.resetFormControl)===null||i===void 0||i.call(this),(c=this.validationMessageCallback)===null||c===void 0||c.call(this,h(this,e,"m",w).call(this)?this.validationMessage:"")}}return r=new WeakMap,t=new WeakMap,a=new WeakMap,l=new WeakMap,s=new WeakMap,n=new WeakMap,f=new WeakMap,C=new WeakMap,M=new WeakMap,O=new WeakMap,y=new WeakMap,E=new WeakMap,S=new WeakMap,e=new WeakSet,b=function(){let i=this.getRootNode(),c=`${this.localName}[name="${this.getAttribute("name")}"]`;return i.querySelectorAll(c)},w=function(){if(this.hasAttribute("disabled"))return!1;let i=h(this,t,"f")||h(this,a,"f")&&!this.validity.valid&&!h(this,r,"f");return i&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),i},$=function(i){let c=this.constructor,g={},v=c.validators,z=[],j=v.some(k=>k.isValid instanceof Promise);h(this,E,"f")||(m(this,S,new Promise(k=>{m(this,y,k,"f")}),"f"),m(this,E,!0,"f")),h(this,l,"f")&&(h(this,l,"f").abort(),m(this,s,h(this,l,"f"),"f"));let I=new AbortController;m(this,l,I,"f");let Y,ae=!1;v.length&&(v.forEach(k=>{let T=k.key||"customError",F=k.isValid(this,i,I.signal);F instanceof Promise?(z.push(F),F.then(B=>{B!=null&&(g[T]=!B,Y=h(this,e,"m",U).call(this,k,i),h(this,e,"m",N).call(this,g,Y))})):(g[T]=!F,this.validity[T]!==!F&&(ae=!0),!F&&!Y&&(Y=h(this,e,"m",U).call(this,k,i)))}),Promise.allSettled(z).then(()=>{var k;I?.signal.aborted||(m(this,E,!1,"f"),(k=h(this,y,"f"))===null||k===void 0||k.call(this))}),(ae||!j)&&h(this,e,"m",N).call(this,g,Y))},N=function(i,c){if(this.validationTarget)this.internals.setValidity(i,c,this.validationTarget),m(this,n,!1,"f");else{if(this.internals.setValidity(i,c),this.internals.validity.valid)return;m(this,n,!0,"f")}},U=function(i,c){if(this.validityCallback){let g=this.validityCallback(i.key||"customError");if(g)return g}return i.message instanceof Function?i.message(this,c):i.message},Ae}import{html as D,LitElement as Oe,nothing as Fe}from"lit";import{property as u,query as ir}from"lit/decorators.js";import{classMap as nr}from"lit/directives/class-map.js";import{ifDefined as x}from"lit/directives/if-defined.js";var Je=["en","nb","fi","da","sv"],oe="en",R=o=>Je.find(e=>o===e||o.toLowerCase().includes(e))||oe;function fe(){if(typeof window>"u"){let o=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return R(o)}try{let o=ve(document);if(o)return R(o);let e=er();if(e)return R(e);let r=ve(ye());return r?R(r):oe}catch(o){return console.warn("could not detect locale, falling back to source locale",o),oe}}var we=(o,e,r,t,a)=>{_.load("en",o),_.load("nb",e),_.load("fi",r),_.load("da",t),_.load("sv",a);let l=fe();_.activate(l),xe(),Qe()},Ke="warp-i18n-change";function xe(){typeof window>"u"||window.dispatchEvent(new Event(Ke))}var me=!1;function Qe(){if(me||typeof window>"u"||!document?.documentElement)return;me=!0;let o=()=>{let a=fe();_.locale!==a&&(_.activate(a),xe())},e=new MutationObserver(a=>{for(let l of a)if(l.type==="attributes"&&l.attributeName==="lang"){o();break}});e.observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});let r=ye();r&&r.documentElement&&r!==document&&e.observe(r.documentElement,{attributes:!0,attributeFilter:["lang"]});let t=We();t&&e.observe(t,{attributes:!0,attributeFilter:["lang"]})}function ye(){try{return window.parent?.document??null}catch{return null}}function ve(o){try{return o?.documentElement?.lang??""}catch{return""}}function We(){try{return window.frameElement??null}catch{return null}}function er(){try{return window.frameElement?.getAttribute?.("lang")??""}catch{return""}}import{css as rr}from"lit";import{unsafeCSS as tr}from"lit";var ke=rr`
+`)),L(b)&&pe.test(b)?ue(b):L(b)?b:Ze(b,this._locale,this._locales)(r,t?.formats)}date(e,r){return te(this._locales||this._locale,e,r)}number(e,r){return Q(this._locales||this._locale,e,r)}};function Ge(o={}){return new ee(o)}var _=Ge();var h=function(o,e,r,t){if(r==="a"&&!t)throw new TypeError("Private accessor was defined without a getter");if(typeof e=="function"?o!==e||!t:!e.has(o))throw new TypeError("Cannot read private member from an object whose class did not declare it");return r==="m"?t:r==="a"?t.call(o):t?t.value:e.get(o)},m=function(o,e,r,t,a){if(t==="m")throw new TypeError("Private method is not writable");if(t==="a"&&!a)throw new TypeError("Private accessor was defined without a setter");if(typeof e=="function"?o!==e||!a:!e.has(o))throw new TypeError("Cannot write private member to an object whose class did not declare it");return t==="a"?a.call(o,r):a?a.value=r:e.set(o,r),r};function ge(o){var e,r,t,a,l,s,i,b,f,C,M,F,y,E,S,w,$,N,q;class Ae extends o{constructor(...n){var c,g,v;super(...n),e.add(this),this.internals=this.attachInternals(),r.set(this,!1),t.set(this,!1),a.set(this,!1),l.set(this,void 0),s.set(this,void 0),i.set(this,!0),f.set(this,""),C.set(this,()=>{m(this,a,!0,"f"),m(this,r,!0,"f"),h(this,e,"m",w).call(this)}),M.set(this,()=>{m(this,r,!1,"f"),h(this,e,"m",$).call(this,this.shouldFormValueUpdate()?h(this,f,"f"):""),!this.validity.valid&&h(this,a,"f")&&m(this,t,!0,"f");let z=h(this,e,"m",w).call(this);this.validationMessageCallback&&this.validationMessageCallback(z?this.internals.validationMessage:"")}),F.set(this,()=>{var z;h(this,i,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),m(this,i,!1,"f")),m(this,a,!0,"f"),m(this,t,!0,"f"),h(this,e,"m",w).call(this),(z=this===null||this===void 0?void 0:this.validationMessageCallback)===null||z===void 0||z.call(this,this.showError?this.internals.validationMessage:"")}),y.set(this,void 0),E.set(this,!1),S.set(this,Promise.resolve()),(c=this.addEventListener)===null||c===void 0||c.call(this,"focus",h(this,C,"f")),(g=this.addEventListener)===null||g===void 0||g.call(this,"blur",h(this,M,"f")),(v=this.addEventListener)===null||v===void 0||v.call(this,"invalid",h(this,F,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let n=this.validators.map(v=>v.attribute).flat(),c=super.observedAttributes||[];return[...new Set([...c,...n])]}static getValidator(n){return this.validators.find(c=>c.attribute===n)||null}static getValidators(n){return this.validators.filter(c=>{var g;if(c.attribute===n||!((g=c.attribute)===null||g===void 0)&&g.includes(n))return!0})}get form(){return this.internals.form}get showError(){return h(this,e,"m",w).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(n,c,g){var v;(v=super.attributeChangedCallback)===null||v===void 0||v.call(this,n,c,g);let j=this.constructor.getValidators(n);j?.length&&this.validationTarget&&this.setValue(h(this,f,"f"))}setValue(n){var c;m(this,t,!1,"f"),(c=this.validationMessageCallback)===null||c===void 0||c.call(this,""),m(this,f,n,"f");let v=this.shouldFormValueUpdate()?n:null;this.internals.setFormValue(v),h(this,e,"m",$).call(this,v),this.valueChangedCallback&&this.valueChangedCallback(v),h(this,e,"m",w).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(n=>n(h(this,S,"f")))}formResetCallback(){var n,c;m(this,a,!1,"f"),m(this,t,!1,"f"),h(this,e,"m",w).call(this),(n=this.resetFormControl)===null||n===void 0||n.call(this),(c=this.validationMessageCallback)===null||c===void 0||c.call(this,h(this,e,"m",w).call(this)?this.validationMessage:"")}}return r=new WeakMap,t=new WeakMap,a=new WeakMap,l=new WeakMap,s=new WeakMap,i=new WeakMap,f=new WeakMap,C=new WeakMap,M=new WeakMap,F=new WeakMap,y=new WeakMap,E=new WeakMap,S=new WeakMap,e=new WeakSet,b=function(){let n=this.getRootNode(),c=`${this.localName}[name="${this.getAttribute("name")}"]`;return n.querySelectorAll(c)},w=function(){if(this.hasAttribute("disabled"))return!1;let n=h(this,t,"f")||h(this,a,"f")&&!this.validity.valid&&!h(this,r,"f");return n&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),n},$=function(n){let c=this.constructor,g={},v=c.validators,z=[],j=v.some(k=>k.isValid instanceof Promise);h(this,E,"f")||(m(this,S,new Promise(k=>{m(this,y,k,"f")}),"f"),m(this,E,!0,"f")),h(this,l,"f")&&(h(this,l,"f").abort(),m(this,s,h(this,l,"f"),"f"));let I=new AbortController;m(this,l,I,"f");let Y,ae=!1;v.length&&(v.forEach(k=>{let U=k.key||"customError",O=k.isValid(this,n,I.signal);O instanceof Promise?(z.push(O),O.then(B=>{B!=null&&(g[U]=!B,Y=h(this,e,"m",q).call(this,k,n),h(this,e,"m",N).call(this,g,Y))})):(g[U]=!O,this.validity[U]!==!O&&(ae=!0),!O&&!Y&&(Y=h(this,e,"m",q).call(this,k,n)))}),Promise.allSettled(z).then(()=>{var k;I?.signal.aborted||(m(this,E,!1,"f"),(k=h(this,y,"f"))===null||k===void 0||k.call(this))}),(ae||!j)&&h(this,e,"m",N).call(this,g,Y))},N=function(n,c){if(this.validationTarget)this.internals.setValidity(n,c,this.validationTarget),m(this,i,!1,"f");else{if(this.internals.setValidity(n,c),this.internals.validity.valid)return;m(this,i,!0,"f")}},q=function(n,c){if(this.validityCallback){let g=this.validityCallback(n.key||"customError");if(g)return g}return n.message instanceof Function?n.message(this,c):n.message},Ae}import{html as D,LitElement as Fe,nothing as Oe}from"lit";import{property as u,query as ir}from"lit/decorators.js";import{classMap as nr}from"lit/directives/class-map.js";import{ifDefined as x}from"lit/directives/if-defined.js";var Je=["en","nb","fi","da","sv"],oe="en",R=o=>Je.find(e=>o===e||o.toLowerCase().includes(e))||oe;function fe(){if(typeof window>"u"){let o=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return R(o)}try{let o=ve(document);if(o)return R(o);let e=er();if(e)return R(e);let r=ve(ye());return r?R(r):oe}catch(o){return console.warn("could not detect locale, falling back to source locale",o),oe}}var we=(o,e,r,t,a)=>{_.load("en",o),_.load("nb",e),_.load("fi",r),_.load("da",t),_.load("sv",a);let l=fe();_.activate(l),xe(),Qe()},Ke="warp-i18n-change";function xe(){typeof window>"u"||window.dispatchEvent(new Event(Ke))}var me=!1;function Qe(){if(me||typeof window>"u"||!document?.documentElement)return;me=!0;let o=()=>{let a=fe();_.locale!==a&&(_.activate(a),xe())},e=new MutationObserver(a=>{for(let l of a)if(l.type==="attributes"&&l.attributeName==="lang"){o();break}});e.observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});let r=ye();r&&r.documentElement&&r!==document&&e.observe(r.documentElement,{attributes:!0,attributeFilter:["lang"]});let t=We();t&&e.observe(t,{attributes:!0,attributeFilter:["lang"]})}function ye(){try{return window.parent?.document??null}catch{return null}}function ve(o){try{return o?.documentElement?.lang??""}catch{return""}}function We(){try{return window.frameElement??null}catch{return null}}function er(){try{return window.frameElement?.getAttribute?.("lang")??""}catch{return""}}import{css as rr}from"lit";import{unsafeCSS as tr}from"lit";var ke=rr`
 	*,
 	:before,
 	:after {
@@ -2581,17 +2581,17 @@ Please compile your catalog first.
 		display: var(--_help-text-display);
 		color: var(--_help-text-color);
 	}
-`;var P={base:"block text-m leading-m mb-0 px-8 py-12 rounded-4 w-full focusable focus:[--w-outline-offset:-2px] caret-current",default:"border-1 s-text s-bg s-border-strong hover:s-border-strong-hover active:s-border-selected",disabled:"border-1 s-text-disabled s-bg-disabled-subtle s-border-disabled pointer-events-none",invalid:"border-1 s-text-negative s-bg s-border-negative hover:s-border-negative-hover outline-[--w-s-color-border-negative]!",readOnly:"pl-0 bg-transparent pointer-events-none",placeholder:"placeholder:s-text-placeholder",suffix:"pr-40",prefix:"pl-[var(--w-prefix-width,_40px)]",textArea:"min-h-[42] sm:min-h-[45]"},q,Ne,H,d=class extends ge(Oe){constructor(){super();J(this,q);this.disabled=!1;this.invalid=!1;this.optional=!1;this.readOnly=!1;this.readonly=!1;this.required=!1;this._hasPrefix=!1;this._hasSuffix=!1;J(this,H);we(ze,Me,Ce,_e,Ee)}updated(r){r.has("value")&&typeof this.value<"u"&&(this.setValue(this.value),this.formatter&&this.mask&&(this.mask.innerText=this.formatter(this.value)))}firstUpdated(){se(this,H,this.value)}resetFormControl(){this.value=ne(this,H)}get _inputstyles(){return K([P.base,this._hasSuffix&&P.suffix,this._hasPrefix&&P.prefix,!this.invalid&&!this.disabled&&!(this.readonly||this.readOnly)&&P.default,this.invalid&&!this.disabled&&!(this.readonly||this.readOnly)&&P.invalid,!this.invalid&&this.disabled&&!(this.readonly||this.readOnly)&&P.disabled,!this.invalid&&!this.disabled&&(this.readonly||this.readOnly)&&P.readOnly])}get _helptextstyles(){return"help-text"}get _label(){if(this.label)return D`<label for="${this._id}"
+`;var P={base:"block text-m leading-m mb-0 px-8 py-12 rounded-4 w-full focusable focus:[--w-outline-offset:-2px] caret-current",default:"border-1 s-text s-bg s-border-strong hover:s-border-strong-hover active:s-border-selected",disabled:"border-1 s-text-disabled s-bg-disabled-subtle s-border-disabled pointer-events-none",invalid:"border-1 s-text-negative s-bg s-border-negative hover:s-border-negative-hover outline-[--w-s-color-border-negative]!",readOnly:"pl-0 bg-transparent pointer-events-none",placeholder:"placeholder:s-text-placeholder",suffix:"pr-40",prefix:"pl-[var(--w-prefix-width,_40px)]",textArea:"min-h-[42] sm:min-h-[45]"},T,Ne,H,d=class extends ge(Fe){constructor(){super();J(this,T);this.disabled=!1;this.invalid=!1;this.optional=!1;this.readOnly=!1;this.readonly=!1;this.required=!1;this._hasPrefix=!1;this._hasSuffix=!1;J(this,H);we(ze,Me,Ce,_e,Ee)}updated(r){r.has("value")&&typeof this.value<"u"&&(this.setValue(this.value),this.formatter&&this.mask&&(this.mask.innerText=this.formatter(this.value)))}firstUpdated(){se(this,H,this.value)}resetFormControl(){this.value=ne(this,H)}get _inputstyles(){return K([P.base,this._hasSuffix&&P.suffix,this._hasPrefix&&P.prefix,!this.invalid&&!this.disabled&&!(this.readonly||this.readOnly)&&P.default,this.invalid&&!this.disabled&&!(this.readonly||this.readOnly)&&P.invalid,!this.invalid&&this.disabled&&!(this.readonly||this.readOnly)&&P.disabled,!this.invalid&&!this.disabled&&(this.readonly||this.readOnly)&&P.readOnly])}get _helptextstyles(){return"help-text"}get _label(){if(this.label)return D`<label for="${this._id}"
 				>${this.label}${this.label.length&&this.optional&&!this.required?D` <span>
 							${_._({id:"textfield.label.optional",message:"Optional",comment:"Shown behind label when marked as optional"})}
-						</span>`:Fe}</label
-			>`}get _helpId(){if(this.helpText)return`${this._id}__hint`}get _id(){return"textfield"}get _error(){if(this.invalid&&this._helpId)return this._helpId}handler(r){let{name:t,value:a}=r.currentTarget;this.value=a;let l=new CustomEvent(r.type,{detail:{name:t,value:a,target:r.target}});this.dispatchEvent(l)}prefixSlotChange(){this.renderRoot.querySelector("slot[name=prefix]").assignedElements().length&&(this._hasPrefix=!0)}suffixSlotChange(){this.renderRoot.querySelector("slot[name=suffix]").assignedElements().length&&(this._hasSuffix=!0)}render(){return D`
+						</span>`:Oe}</label
+			>`}get _helpId(){if(this.helpText)return`${this._id}__hint`}get _id(){return"textfield"}get _error(){if(this.invalid&&this._helpId)return this._helpId}handler(r){let{name:t,value:a}=r.currentTarget;this.value=a;let l={name:t,value:a,target:r.target},s=new Proxy(l,{get(b,f){return typeof window<"u"&&(window.location.host.startsWith("www")||console.warn("w-textfield's CustomEvent is deprecated, please use the browser-native events instead (e.g. replace e.detail.value with e.target.value)")),b[f]}}),i=new CustomEvent(r.type,{detail:s});this.dispatchEvent(i)}prefixSlotChange(){this.renderRoot.querySelector("slot[name=prefix]").assignedElements().length&&(this._hasPrefix=!0)}suffixSlotChange(){this.renderRoot.querySelector("slot[name=suffix]").assignedElements().length&&(this._hasSuffix=!0)}render(){return D`
 			${this._label}
 			<div
 				class="${nr({"w-textfield":!0,"w-textfield--has-prefix":this._hasPrefix,"w-textfield--has-suffix":this._hasSuffix})}"
 			>
 				<div class="w-textfield__input-wrapper">
-					${this.formatter?D`<div class="w-textfield__mask"></div>`:Fe}
+					${this.formatter?D`<div class="w-textfield__mask"></div>`:Oe}
 					<input
 						part="input"
 						class="${this._inputstyles}"
@@ -2618,7 +2618,7 @@ Please compile your catalog first.
 						@change="${this.handler}"
 						@input="${this.handler}"
 						@focus="${this.handler}"
-						@keydown="${le(this,q,Ne)}"
+						@keydown="${le(this,T,Ne)}"
 					/>
 				</div>
 				<slot @slotchange="${this.prefixSlotChange}" name="prefix"></slot>
@@ -2628,5 +2628,5 @@ Please compile your catalog first.
 			${this.helpText&&D`<div class="${this._helptextstyles}" id="${this._helpId}">
 				${this.helpText}
 			</div>`}
-		`}};q=new WeakSet,Ne=function(r){r.key==="Enter"&&this.internals.form&&this.internals.form.requestSubmit()},H=new WeakMap,d.shadowRootOptions={...Oe.shadowRootOptions,delegatesFocus:!0},d.styles=[ke,Le,Se,Ve,Pe],p([u({type:Boolean,reflect:!0})],d.prototype,"disabled",2),p([u({type:Boolean,reflect:!0})],d.prototype,"invalid",2),p([u({type:String,reflect:!0})],d.prototype,"label",2),p([u({type:String,reflect:!0,attribute:"help-text"})],d.prototype,"helpText",2),p([u({type:Boolean,reflect:!0})],d.prototype,"optional",2),p([u({type:String,reflect:!0})],d.prototype,"size",2),p([u({type:Number,reflect:!0})],d.prototype,"max",2),p([u({type:Number,reflect:!0})],d.prototype,"min",2),p([u({type:Number,reflect:!0,attribute:"min-length"})],d.prototype,"minLength",2),p([u({type:Number,reflect:!0})],d.prototype,"minlength",2),p([u({type:Number,reflect:!0,attribute:"max-length"})],d.prototype,"maxLength",2),p([u({type:Number,reflect:!0})],d.prototype,"maxlength",2),p([u({type:String,reflect:!0})],d.prototype,"pattern",2),p([u({type:String,reflect:!0})],d.prototype,"placeholder",2),p([u({type:Boolean,reflect:!0,attribute:"read-only"})],d.prototype,"readOnly",2),p([u({type:Boolean,reflect:!0})],d.prototype,"readonly",2),p([u({type:Boolean,reflect:!0})],d.prototype,"required",2),p([u({type:String,reflect:!0})],d.prototype,"type",2),p([u({type:String,reflect:!0})],d.prototype,"value",2),p([u({type:String,reflect:!0})],d.prototype,"name",2),p([u({type:Number,reflect:!0})],d.prototype,"step",2),p([u({type:String,reflect:!0})],d.prototype,"autocomplete",2),p([u({attribute:!1})],d.prototype,"formatter",2),p([ir(".w-textfield__mask")],d.prototype,"mask",2),p([u({type:Boolean})],d.prototype,"_hasPrefix",2),p([u({type:Boolean})],d.prototype,"_hasSuffix",2);customElements.get("w-textfield")||customElements.define("w-textfield",d);export{d as WarpTextField};
+		`}};T=new WeakSet,Ne=function(r){r.key==="Enter"&&this.internals.form&&this.internals.form.requestSubmit()},H=new WeakMap,d.shadowRootOptions={...Fe.shadowRootOptions,delegatesFocus:!0},d.styles=[ke,Le,Se,Ve,Pe],p([u({type:Boolean,reflect:!0})],d.prototype,"disabled",2),p([u({type:Boolean,reflect:!0})],d.prototype,"invalid",2),p([u({type:String,reflect:!0})],d.prototype,"label",2),p([u({type:String,reflect:!0,attribute:"help-text"})],d.prototype,"helpText",2),p([u({type:Boolean,reflect:!0})],d.prototype,"optional",2),p([u({type:String,reflect:!0})],d.prototype,"size",2),p([u({type:Number,reflect:!0})],d.prototype,"max",2),p([u({type:Number,reflect:!0})],d.prototype,"min",2),p([u({type:Number,reflect:!0,attribute:"min-length"})],d.prototype,"minLength",2),p([u({type:Number,reflect:!0})],d.prototype,"minlength",2),p([u({type:Number,reflect:!0,attribute:"max-length"})],d.prototype,"maxLength",2),p([u({type:Number,reflect:!0})],d.prototype,"maxlength",2),p([u({type:String,reflect:!0})],d.prototype,"pattern",2),p([u({type:String,reflect:!0})],d.prototype,"placeholder",2),p([u({type:Boolean,reflect:!0,attribute:"read-only"})],d.prototype,"readOnly",2),p([u({type:Boolean,reflect:!0})],d.prototype,"readonly",2),p([u({type:Boolean,reflect:!0})],d.prototype,"required",2),p([u({type:String,reflect:!0})],d.prototype,"type",2),p([u({type:String,reflect:!0})],d.prototype,"value",2),p([u({type:String,reflect:!0})],d.prototype,"name",2),p([u({type:Number,reflect:!0})],d.prototype,"step",2),p([u({type:String,reflect:!0})],d.prototype,"autocomplete",2),p([u({attribute:!1})],d.prototype,"formatter",2),p([ir(".w-textfield__mask")],d.prototype,"mask",2),p([u({type:Boolean})],d.prototype,"_hasPrefix",2),p([u({type:Boolean})],d.prototype,"_hasSuffix",2);customElements.get("w-textfield")||customElements.define("w-textfield",d);export{d as WarpTextField};
 //# sourceMappingURL=textfield.js.map