@warp-ds/elements 2.10.0-next.17 → 2.10.0-next.19
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/custom-elements.json +285 -159
- package/dist/docs/affix/affix.md +117 -0
- package/dist/docs/affix/styling.md +107 -0
- package/dist/docs/breadcrumb-item/api.md +27 -0
- package/dist/docs/breadcrumb-item/breadcrumb-item.md +34 -0
- package/dist/docs/breadcrumbs/accessibility.md +8 -18
- package/dist/docs/breadcrumbs/breadcrumbs.md +120 -34
- package/dist/docs/breadcrumbs/examples.md +8 -8
- package/dist/docs/breadcrumbs/styling.md +96 -0
- package/dist/docs/breadcrumbs/usage.md +8 -8
- package/dist/docs/index.md +2 -1
- package/dist/docs/select/select.md +91 -0
- package/dist/docs/select/styling.md +91 -0
- package/dist/docs/textarea/styling.md +91 -0
- package/dist/docs/textarea/textarea.md +91 -0
- package/dist/docs/textfield/api.md +8 -0
- package/dist/docs/textfield/styling.md +95 -0
- package/dist/docs/textfield/textfield.md +103 -0
- package/dist/index.d.ts +175 -64
- package/dist/packages/affix/affix-styles.d.ts +8 -0
- package/dist/packages/affix/affix-styles.js +108 -0
- package/dist/packages/affix/affix.d.ts +11 -8
- package/dist/packages/affix/affix.js +118 -17
- package/dist/packages/affix/affix.js.map +4 -4
- package/dist/packages/affix/affix.react.stories.d.ts +1 -1
- package/dist/packages/affix/react.d.ts +1 -1
- package/dist/packages/alert/alert.js.map +1 -1
- package/dist/packages/attention/attention.js.map +1 -1
- package/dist/packages/breadcrumb-item/breadcrumb-item.d.ts +29 -0
- package/dist/packages/breadcrumb-item/breadcrumb-item.js +2529 -0
- package/dist/packages/breadcrumb-item/breadcrumb-item.js.map +7 -0
- package/dist/packages/breadcrumb-item/react.d.ts +2 -0
- package/dist/packages/breadcrumb-item/react.js +11 -0
- package/dist/packages/breadcrumb-item/styles.d.ts +4 -0
- package/dist/packages/breadcrumb-item/styles.js +81 -0
- package/dist/packages/breadcrumbs/breadcrumbs.d.ts +2 -0
- package/dist/packages/breadcrumbs/breadcrumbs.js +11 -13
- package/dist/packages/breadcrumbs/breadcrumbs.js.map +3 -3
- package/dist/packages/breadcrumbs/breadcrumbs.react.stories.js +11 -10
- package/dist/packages/breadcrumbs/breadcrumbs.stories.d.ts +4 -5
- package/dist/packages/breadcrumbs/breadcrumbs.stories.js +14 -11
- package/dist/packages/button/button.react.stories.d.ts +2 -2
- package/dist/packages/button/react.d.ts +1 -1
- package/dist/packages/checkbox-group/react.d.ts +1 -1
- package/dist/packages/combobox/combobox.react.stories.d.ts +2 -2
- package/dist/packages/combobox/react.d.ts +1 -1
- package/dist/packages/datepicker/datepicker.js.map +1 -1
- package/dist/packages/datepicker/datepicker.react.stories.d.ts +2 -2
- package/dist/packages/datepicker/react.d.ts +1 -1
- package/dist/packages/expandable/expandable.js.map +1 -1
- package/dist/packages/icon/icon.js +2 -2
- package/dist/packages/icon/icon.js.map +1 -1
- package/dist/packages/icon/icon.react.stories.d.ts +2 -1
- package/dist/packages/icon/icon.react.stories.js +1 -1
- package/dist/packages/modal-header/modal-header.js.map +1 -1
- package/dist/packages/pagination/pagination.js.map +1 -1
- package/dist/packages/pagination/pagination.react.stories.d.ts +2 -2
- package/dist/packages/pagination/react.d.ts +1 -1
- package/dist/packages/pill/pill.js.map +1 -1
- package/dist/packages/radio-group/react.d.ts +1 -1
- package/dist/packages/select/input-styles.d.ts +11 -0
- package/dist/packages/select/input-styles.js +88 -0
- package/dist/packages/select/react.d.ts +1 -1
- package/dist/packages/select/select.js +96 -19
- package/dist/packages/select/select.js.map +4 -4
- package/dist/packages/select/select.react.stories.d.ts +2 -2
- package/dist/packages/slider/react.d.ts +1 -1
- package/dist/packages/slider/slider.react.stories.d.ts +1 -1
- package/dist/packages/slider-thumb/react.d.ts +1 -1
- package/dist/packages/snackbar/snackbar.d.ts +2 -2
- package/dist/packages/snackbar/snackbar.js +1 -1
- package/dist/packages/snackbar/snackbar.js.map +2 -2
- package/dist/packages/step/step.js.map +1 -1
- package/dist/packages/textarea/input-styles.d.ts +11 -0
- package/dist/packages/textarea/input-styles.js +88 -0
- package/dist/packages/textarea/react.d.ts +1 -1
- package/dist/packages/textarea/textarea.js +99 -20
- package/dist/packages/textarea/textarea.js.map +4 -4
- package/dist/packages/textarea/textarea.react.stories.d.ts +2 -2
- package/dist/packages/textfield/input-styles.d.ts +11 -0
- package/dist/packages/textfield/input-styles.js +88 -0
- package/dist/packages/textfield/locales/da/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/da/messages.mjs +1 -0
- package/dist/packages/textfield/locales/en/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/en/messages.mjs +1 -0
- package/dist/packages/textfield/locales/fi/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/fi/messages.mjs +1 -0
- package/dist/packages/textfield/locales/nb/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/nb/messages.mjs +1 -0
- package/dist/packages/textfield/locales/sv/messages.d.mts +1 -0
- package/dist/packages/textfield/locales/sv/messages.mjs +1 -0
- package/dist/packages/textfield/react.d.ts +1 -1
- package/dist/packages/textfield/textfield.d.ts +11 -1
- package/dist/packages/textfield/textfield.js +111 -24
- package/dist/packages/textfield/textfield.js.map +4 -4
- package/dist/packages/textfield/textfield.react.stories.d.ts +2 -2
- package/dist/packages/toast/styles.js +1 -1
- package/dist/packages/toast/toast.js +7 -7
- package/dist/packages/toast/toast.js.map +2 -2
- package/dist/packages/toast-container/toast-container.js +8 -8
- package/dist/packages/toast-container/toast-container.js.map +3 -3
- package/dist/web-types.json +96 -50
- package/eik/index.js +20 -20
- package/package.json +8 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { WarpRadioGroup } from "./radio-group.js";
|
|
3
|
-
export declare const RadioGroup: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpRadioGroup>, "form" | "label" | "name" | "disabled" | "invalid" | "helpText" | "required" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "oninput" | "updated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onChange" | "onInput" | "reportValidity" | "
|
|
3
|
+
export declare const RadioGroup: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpRadioGroup>, "form" | "label" | "name" | "disabled" | "invalid" | "helpText" | "optional" | "required" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "oninput" | "updated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "onChange" | "onInput" | "reportValidity" | "hasInteracted"> & {
|
|
4
4
|
onInput?: ((e: Event) => void) | undefined;
|
|
5
5
|
oninput?: ((e: Event) => void) | undefined;
|
|
6
6
|
onChange?: ((e: Event) => void) | undefined;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* Shared styles for input components (textfield, textarea, select)
|
|
3
|
+
* using the internal token pattern with a public styling API.
|
|
4
|
+
*
|
|
5
|
+
* Public API tokens (customizable):
|
|
6
|
+
* - Label: --w-c-input-label-*
|
|
7
|
+
* - Help text: --w-c-input-help-text-*
|
|
8
|
+
* - Optional indicator: --w-c-input-optional-*
|
|
9
|
+
*/
|
|
10
|
+
export declare const inputLabelStyles: import("lit").CSSResult;
|
|
11
|
+
export declare const inputHelpTextStyles: import("lit").CSSResult;
|
|
@@ -0,0 +1,88 @@
|
|
|
1
|
+
import { css } from "lit";
|
|
2
|
+
/**
|
|
3
|
+
* Shared styles for input components (textfield, textarea, select)
|
|
4
|
+
* using the internal token pattern with a public styling API.
|
|
5
|
+
*
|
|
6
|
+
* Public API tokens (customizable):
|
|
7
|
+
* - Label: --w-c-input-label-*
|
|
8
|
+
* - Help text: --w-c-input-help-text-*
|
|
9
|
+
* - Optional indicator: --w-c-input-optional-*
|
|
10
|
+
*/
|
|
11
|
+
export const inputLabelStyles = css `
|
|
12
|
+
/* Label component tokens with semantic fallbacks */
|
|
13
|
+
label {
|
|
14
|
+
/* Internal tokens - not part of public API */
|
|
15
|
+
--_color: var(--w-c-input-label-color, var(--w-s-color-text));
|
|
16
|
+
--_font-size: var(--w-c-input-label-font-size, var(--w-font-size-s));
|
|
17
|
+
--_line-height: var(--w-c-input-label-line-height, var(--w-line-height-s));
|
|
18
|
+
--_font-weight: var(--w-c-input-label-font-weight, 700);
|
|
19
|
+
--_padding-bottom: var(--w-c-input-label-padding-bottom, 0.4rem);
|
|
20
|
+
--_cursor: var(--w-c-input-label-cursor, pointer);
|
|
21
|
+
--_display: var(--w-c-input-label-display, block);
|
|
22
|
+
|
|
23
|
+
/* Apply styles */
|
|
24
|
+
display: var(--_display);
|
|
25
|
+
position: relative;
|
|
26
|
+
font-size: var(--_font-size);
|
|
27
|
+
line-height: var(--_line-height);
|
|
28
|
+
font-weight: var(--_font-weight);
|
|
29
|
+
padding-bottom: var(--_padding-bottom);
|
|
30
|
+
cursor: var(--_cursor);
|
|
31
|
+
color: var(--_color);
|
|
32
|
+
-webkit-font-smoothing: antialiased;
|
|
33
|
+
-moz-osx-font-smoothing: grayscale;
|
|
34
|
+
}
|
|
35
|
+
|
|
36
|
+
/* Optional text styling */
|
|
37
|
+
label span {
|
|
38
|
+
--_padding-left: var(--w-c-input-optional-padding-left, 0.8rem);
|
|
39
|
+
--_font-weight: var(--w-c-input-optional-font-weight, 400);
|
|
40
|
+
--_font-size: var(--w-c-input-optional-font-size, var(--w-font-size-s));
|
|
41
|
+
--_line-height: var(
|
|
42
|
+
--w-c-input-optional-line-height,
|
|
43
|
+
var(--w-line-height-s)
|
|
44
|
+
);
|
|
45
|
+
--_color: var(--w-c-input-optional-color, var(--w-s-color-text-subtle));
|
|
46
|
+
|
|
47
|
+
padding-left: var(--_padding-left);
|
|
48
|
+
font-weight: var(--_font-weight);
|
|
49
|
+
font-size: var(--_font-size);
|
|
50
|
+
line-height: var(--_line-height);
|
|
51
|
+
color: var(--_color);
|
|
52
|
+
}
|
|
53
|
+
`;
|
|
54
|
+
export const inputHelpTextStyles = css `
|
|
55
|
+
/* Help text component tokens with semantic fallbacks */
|
|
56
|
+
:host {
|
|
57
|
+
--_help-text-color: var(
|
|
58
|
+
--w-c-input-help-text-color,
|
|
59
|
+
var(--w-s-color-text-subtle)
|
|
60
|
+
);
|
|
61
|
+
--_help-text-font-size: var(
|
|
62
|
+
--w-c-input-help-text-font-size,
|
|
63
|
+
var(--w-font-size-xs)
|
|
64
|
+
);
|
|
65
|
+
--_help-text-line-height: var(
|
|
66
|
+
--w-c-input-help-text-line-height,
|
|
67
|
+
var(--w-line-height-xs)
|
|
68
|
+
);
|
|
69
|
+
--_help-text-margin-top: var(--w-c-input-help-text-margin-top, 0.4rem);
|
|
70
|
+
--_help-text-display: var(--w-c-input-help-text-display, block);
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
/* Invalid state overrides color */
|
|
74
|
+
:host([invalid]) {
|
|
75
|
+
--_help-text-color: var(
|
|
76
|
+
--w-c-input-help-text-color-invalid,
|
|
77
|
+
var(--w-s-color-text-negative)
|
|
78
|
+
);
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
.help-text {
|
|
82
|
+
font-size: var(--_help-text-font-size);
|
|
83
|
+
line-height: var(--_help-text-line-height);
|
|
84
|
+
margin-top: var(--_help-text-margin-top);
|
|
85
|
+
display: var(--_help-text-display);
|
|
86
|
+
color: var(--_help-text-color);
|
|
87
|
+
}
|
|
88
|
+
`;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { WarpSelect } from "./select.js";
|
|
3
|
-
export declare const Select: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpSelect>, "value" | "form" | "label" | "name" | "disabled" | "invalid" | "helpText" | "readOnly" | "readonly" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "autoFocus" | "onChange" | "hint" | "
|
|
3
|
+
export declare const Select: React.ForwardRefExoticComponent<Omit<Omit<Omit<React.HTMLAttributes<WarpSelect>, "value" | "form" | "label" | "name" | "disabled" | "invalid" | "helpText" | "optional" | "readOnly" | "readonly" | "renderRoot" | "isUpdatePending" | "hasUpdated" | "addController" | "removeController" | "connectedCallback" | "disconnectedCallback" | "attributeChangedCallback" | "requestUpdate" | "updateComplete" | "onchange" | "updated" | "firstUpdated" | "resetFormControl" | "render" | "validationTarget" | "internals" | "showError" | "validationMessage" | "validity" | "validationComplete" | "checkValidity" | "formResetCallback" | "valueChangedCallback" | "validityCallback" | "validationMessageCallback" | "setValue" | "shouldFormValueUpdate" | "renderOptions" | "autoFocus" | "onChange" | "hint" | "willUpdate" | "formStateRestoreCallback" | "always" | "_setValue" | "handleKeyDown"> & {
|
|
4
4
|
onChange?: ((e: CustomEvent<any>) => void) | undefined;
|
|
5
5
|
onchange?: ((e: CustomEvent<any>) => void) | undefined;
|
|
6
6
|
} & Partial<Omit<WarpSelect, keyof HTMLElement>> & React.RefAttributes<WarpSelect>, "ref">, "help-text" | "read-only" | "auto-focus"> & {
|
|
@@ -1,12 +1,12 @@
|
|
|
1
|
-
var
|
|
1
|
+
var Ke=Object.defineProperty;var Qe=Object.getOwnPropertyDescriptor;var ke=o=>{throw TypeError(o)};var p=(o,r,e,t)=>{for(var a=t>1?void 0:t?Qe(r,e):r,s=o.length-1,i;s>=0;s--)(i=o[s])&&(a=(t?i(r,e,a):i(a))||a);return t&&a&&Ke(r,e,a),a};var ne=(o,r,e)=>r.has(o)||ke("Cannot "+e);var x=(o,r,e)=>(ne(o,r,"read from private field"),e?e.call(o):r.get(o)),U=(o,r,e)=>r.has(o)?ke("Cannot add the same private member more than once"):r instanceof WeakSet?r.add(o):r.set(o,e),le=(o,r,e,t)=>(ne(o,r,"write to private field"),t?t.call(o,e):r.set(o,e),e),f=(o,r,e)=>(ne(o,r,"access private method"),e);var q=function(){for(var o=[],r=arguments.length;r--;)o[r]=arguments[r];return o.reduce(function(e,t){return e.concat(typeof t=="string"?t:Array.isArray(t)?q.apply(void 0,t):typeof t=="object"&&t?Object.keys(t).map(function(a){return t[a]?a:""}):"")},[]).join(" ")};var T=o=>typeof o=="string",We=o=>typeof o=="function",_e=new Map,Ce="en";function be(o){return[...Array.isArray(o)?o:[o],Ce]}function pe(o,r,e){let t=be(o);e||(e="default");let a;if(typeof e=="string")switch(a={day:"numeric",month:"short",year:"numeric"},e){case"full":a.weekday="long";case"long":a.month="long";break;case"short":a.month="numeric";break}else a=e;return J(()=>K("date",t,e),()=>new Intl.DateTimeFormat(t,a)).format(T(r)?new Date(r):r)}function er(o,r,e){let t;if(e||(e="default"),typeof e=="string")switch(t={second:"numeric",minute:"numeric",hour:"numeric"},e){case"full":case"long":t.timeZoneName="short";break;case"short":delete t.second}else t=e;return pe(o,r,t)}function ce(o,r,e){let t=be(o);return J(()=>K("number",t,e),()=>new Intl.NumberFormat(t,e)).format(r)}function ze(o,r,e,{offset:t=0,...a}){let s=be(o),i=r?J(()=>K("plural-ordinal",s),()=>new Intl.PluralRules(s,{type:"ordinal"})):J(()=>K("plural-cardinal",s),()=>new Intl.PluralRules(s,{type:"cardinal"}));return a[e]??a[i.select(e-t)]??a.other}function J(o,r){let e=o(),t=_e.get(e);return t||(t=r(),_e.set(e,t)),t}function K(o,r,e){let t=r.join("-");return`${o}-${t}-${JSON.stringify(e)}`}var Fe=/\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/,Ee=o=>o.replace(/\\u([a-fA-F0-9]{4})|\\x([a-fA-F0-9]{2})/g,(r,e,t)=>{if(e){let a=parseInt(e,16);return String.fromCharCode(a)}else{let a=parseInt(t,16);return String.fromCharCode(a)}}),Me="%__lingui_octothorpe__%",rr=(o,r,e={})=>{let t=r||o,a=i=>typeof i=="object"?i:e[i],s=(i,n)=>{let b=Object.keys(e).length?a("number"):void 0,w=ce(t,i,b);return n.replace(new RegExp(Me,"g"),w)};return{plural:(i,n)=>{let{offset:b=0}=n,w=ze(t,!1,i,n);return s(i-b,w)},selectordinal:(i,n)=>{let{offset:b=0}=n,w=ze(t,!0,i,n);return s(i-b,w)},select:tr,number:(i,n)=>ce(t,i,a(n)||{style:n}),date:(i,n)=>pe(t,i,a(n)||n),time:(i,n)=>er(t,i,a(n)||n)}},tr=(o,r)=>r[o]??r.other;function or(o,r,e){return(t={},a)=>{let s=rr(r,e,a),i=(b,w=!1)=>Array.isArray(b)?b.reduce((F,L)=>{if(L==="#"&&w)return F+Me;if(T(L))return F+L;let[D,_,V]=L,S={};_==="plural"||_==="selectordinal"||_==="select"?Object.entries(V).forEach(([$,Y])=>{S[$]=i(Y,_==="plural"||_==="selectordinal")}):S=V;let k;if(_){let $=s[_];k=$(t[D],S)}else k=t[D];return k==null?F:F+k},""):b,n=i(o);return T(n)&&Fe.test(n)?Ee(n):T(n)?n:n?String(n):""}}var ar=Object.defineProperty,ir=(o,r,e)=>r in o?ar(o,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[r]=e,sr=(o,r,e)=>(ir(o,typeof r!="symbol"?r+"":r,e),e),de=class{constructor(){sr(this,"_events",{})}on(r,e){var t;return(t=this._events)[r]??(t[r]=[]),this._events[r].push(e),()=>this.removeListener(r,e)}removeListener(r,e){let t=this._getListeners(r);if(!t)return;let a=t.indexOf(e);~a&&t.splice(a,1)}emit(r,...e){let t=this._getListeners(r);t&&t.map(a=>a.apply(this,e))}_getListeners(r){let e=this._events[r];return Array.isArray(e)?e:!1}},nr=Object.defineProperty,lr=(o,r,e)=>r in o?nr(o,r,{enumerable:!0,configurable:!0,writable:!0,value:e}):o[r]=e,O=(o,r,e)=>(lr(o,typeof r!="symbol"?r+"":r,e),e),he=class extends de{constructor(r){super(),O(this,"_locale",""),O(this,"_locales"),O(this,"_localeData",{}),O(this,"_messages",{}),O(this,"_missing"),O(this,"_messageCompiler"),O(this,"t",this._.bind(this)),r.missing!=null&&(this._missing=r.missing),r.messages!=null&&this.load(r.messages),r.localeData!=null&&this.loadLocaleData(r.localeData),(typeof r.locale=="string"||r.locales)&&this.activate(r.locale??Ce,r.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(r,e){let t=this._localeData[r];t?Object.assign(t,e):this._localeData[r]=e}setMessagesCompiler(r){return this._messageCompiler=r,this}loadLocaleData(r,e){typeof r=="string"?this._loadLocaleData(r,e):Object.keys(r).forEach(t=>this._loadLocaleData(t,r[t])),this.emit("change")}_load(r,e){let t=this._messages[r];t?Object.assign(t,e):this._messages[r]=e}load(r,e){typeof r=="string"&&typeof e=="object"?this._load(r,e):Object.entries(r).forEach(([t,a])=>this._load(t,a)),this.emit("change")}loadAndActivate({locale:r,locales:e,messages:t}){this._locale=r,this._locales=e||void 0,this._messages[this._locale]=t,this.emit("change")}activate(r,e){this._locale=r,this._locales=e,this.emit("change")}_(r,e,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;r||(r=""),T(r)||(e=r.values||e,a=r.message,r=r.id);let s=this.messages[r],i=s===void 0,n=this._missing;if(n&&i)return We(n)?n(this._locale,r):n;i&&this.emit("missing",{id:r,locale:this._locale});let b=s||a||r;return T(b)&&(this._messageCompiler?b=this._messageCompiler(b):console.warn(`Uncompiled message detected! Message:
|
|
2
2
|
|
|
3
|
-
> ${
|
|
3
|
+
> ${b}
|
|
4
4
|
|
|
5
5
|
That means you use raw catalog or your catalog doesn't have a translation for the message and fallback was used.
|
|
6
6
|
ICU features such as interpolation and plurals will not work properly for that message.
|
|
7
7
|
|
|
8
8
|
Please compile your catalog first.
|
|
9
|
-
`)),T(
|
|
9
|
+
`)),T(b)&&Fe.test(b)?Ee(b):T(b)?b:or(b,this._locale,this._locales)(e,t?.formats)}date(r,e){return pe(this._locales||this._locale,r,e)}number(r,e){return ce(this._locales||this._locale,r,e)}};function cr(o={}){return new he(o)}var C=cr();var h=function(o,r,e,t){if(e==="a"&&!t)throw new TypeError("Private accessor was defined without a getter");if(typeof r=="function"?o!==r||!t:!r.has(o))throw new TypeError("Cannot read private member from an object whose class did not declare it");return e==="m"?t:e==="a"?t.call(o):t?t.value:r.get(o)},g=function(o,r,e,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 r=="function"?o!==r||!a:!r.has(o))throw new TypeError("Cannot write private member to an object whose class did not declare it");return t==="a"?a.call(o,e):a?a.value=e:r.set(o,e),e};function Le(o){var r,e,t,a,s,i,n,b,w,F,L,D,_,V,S,k,$,Y,ae;class Je extends o{constructor(...c){var d,u,m;super(...c),r.add(this),this.internals=this.attachInternals(),e.set(this,!1),t.set(this,!1),a.set(this,!1),s.set(this,void 0),i.set(this,void 0),n.set(this,!0),w.set(this,""),F.set(this,()=>{g(this,a,!0,"f"),g(this,e,!0,"f"),h(this,r,"m",k).call(this)}),L.set(this,()=>{g(this,e,!1,"f"),h(this,r,"m",$).call(this,this.shouldFormValueUpdate()?h(this,w,"f"):""),!this.validity.valid&&h(this,a,"f")&&g(this,t,!0,"f");let E=h(this,r,"m",k).call(this);this.validationMessageCallback&&this.validationMessageCallback(E?this.internals.validationMessage:"")}),D.set(this,()=>{var E;h(this,n,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),g(this,n,!1,"f")),g(this,a,!0,"f"),g(this,t,!0,"f"),h(this,r,"m",k).call(this),(E=this===null||this===void 0?void 0:this.validationMessageCallback)===null||E===void 0||E.call(this,this.showError?this.internals.validationMessage:"")}),_.set(this,void 0),V.set(this,!1),S.set(this,Promise.resolve()),(d=this.addEventListener)===null||d===void 0||d.call(this,"focus",h(this,F,"f")),(u=this.addEventListener)===null||u===void 0||u.call(this,"blur",h(this,L,"f")),(m=this.addEventListener)===null||m===void 0||m.call(this,"invalid",h(this,D,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let c=this.validators.map(m=>m.attribute).flat(),d=super.observedAttributes||[];return[...new Set([...d,...c])]}static getValidator(c){return this.validators.find(d=>d.attribute===c)||null}static getValidators(c){return this.validators.filter(d=>{var u;if(d.attribute===c||!((u=d.attribute)===null||u===void 0)&&u.includes(c))return!0})}get form(){return this.internals.form}get showError(){return h(this,r,"m",k).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(c,d,u){var m;(m=super.attributeChangedCallback)===null||m===void 0||m.call(this,c,d,u);let I=this.constructor.getValidators(c);I?.length&&this.validationTarget&&this.setValue(h(this,w,"f"))}setValue(c){var d;g(this,t,!1,"f"),(d=this.validationMessageCallback)===null||d===void 0||d.call(this,""),g(this,w,c,"f");let m=this.shouldFormValueUpdate()?c:null;this.internals.setFormValue(m),h(this,r,"m",$).call(this,m),this.valueChangedCallback&&this.valueChangedCallback(m),h(this,r,"m",k).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(c=>c(h(this,S,"f")))}formResetCallback(){var c,d;g(this,a,!1,"f"),g(this,t,!1,"f"),h(this,r,"m",k).call(this),(c=this.resetFormControl)===null||c===void 0||c.call(this),(d=this.validationMessageCallback)===null||d===void 0||d.call(this,h(this,r,"m",k).call(this)?this.validationMessage:"")}}return e=new WeakMap,t=new WeakMap,a=new WeakMap,s=new WeakMap,i=new WeakMap,n=new WeakMap,w=new WeakMap,F=new WeakMap,L=new WeakMap,D=new WeakMap,_=new WeakMap,V=new WeakMap,S=new WeakMap,r=new WeakSet,b=function(){let c=this.getRootNode(),d=`${this.localName}[name="${this.getAttribute("name")}"]`;return c.querySelectorAll(d)},k=function(){if(this.hasAttribute("disabled"))return!1;let c=h(this,t,"f")||h(this,a,"f")&&!this.validity.valid&&!h(this,e,"f");return c&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),c},$=function(c){let d=this.constructor,u={},m=d.validators,E=[],I=m.some(z=>z.isValid instanceof Promise);h(this,V,"f")||(g(this,S,new Promise(z=>{g(this,_,z,"f")}),"f"),g(this,V,!0,"f")),h(this,s,"f")&&(h(this,s,"f").abort(),g(this,i,h(this,s,"f"),"f"));let X=new AbortController;g(this,s,X,"f");let H,ye=!1;m.length&&(m.forEach(z=>{let ie=z.key||"customError",A=z.isValid(this,c,X.signal);A instanceof Promise?(E.push(A),A.then(se=>{se!=null&&(u[ie]=!se,H=h(this,r,"m",ae).call(this,z,c),h(this,r,"m",Y).call(this,u,H))})):(u[ie]=!A,this.validity[ie]!==!A&&(ye=!0),!A&&!H&&(H=h(this,r,"m",ae).call(this,z,c)))}),Promise.allSettled(E).then(()=>{var z;X?.signal.aborted||(g(this,V,!1,"f"),(z=h(this,_,"f"))===null||z===void 0||z.call(this))}),(ye||!I)&&h(this,r,"m",Y).call(this,u,H))},Y=function(c,d){if(this.validationTarget)this.internals.setValidity(c,d,this.validationTarget),g(this,n,!1,"f");else{if(this.internals.setValidity(c,d),this.internals.validity.valid)return;g(this,n,!0,"f")}},ae=function(c,d){if(this.validityCallback){let u=this.validityCallback(c.key||"customError");if(u)return u}return c.message instanceof Function?c.message(this,d):c.message},Je}import{css as Cr,html as Z,LitElement as Fr}from"lit";import{property as y}from"lit/decorators.js";import{ifDefined as me}from"lit/directives/if-defined.js";import{when as fe}from"lit/directives/when.js";var dr=["en","nb","fi","da","sv"],ue="en",Q=o=>dr.find(r=>o===r||o.toLowerCase().includes(r))||ue;function W(){if(typeof window>"u"){let o=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return Q(o)}try{let o=Se(document);if(o)return Q(o);let r=ur();if(r)return Q(r);let e=Se($e());return e?Q(e):ue}catch(o){return console.warn("could not detect locale, falling back to source locale",o),ue}}var Te=(o,r,e,t,a)=>{C.load("en",o),C.load("nb",r),C.load("fi",e),C.load("da",t),C.load("sv",a);let s=W();C.activate(s),Pe(),br()},hr="warp-i18n-change";function Pe(){typeof window>"u"||window.dispatchEvent(new Event(hr))}var Ve=!1;function br(){if(Ve||typeof window>"u"||!document?.documentElement)return;Ve=!0;let o=()=>{let a=W();C.locale!==a&&(C.activate(a),Pe())},r=new MutationObserver(a=>{for(let s of a)if(s.type==="attributes"&&s.attributeName==="lang"){o();break}});r.observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});let e=$e();e&&e.documentElement&&e!==document&&r.observe(e.documentElement,{attributes:!0,attributeFilter:["lang"]});let t=pr();t&&r.observe(t,{attributes:!0,attributeFilter:["lang"]})}function $e(){try{return window.parent?.document??null}catch{return null}}function Se(o){try{return o?.documentElement?.lang??""}catch{return""}}function pr(){try{return window.frameElement??null}catch{return null}}function ur(){try{return window.frameElement?.getAttribute?.("lang")??""}catch{return""}}import{css as gr}from"lit";import{unsafeCSS as vr}from"lit";var Oe=gr`
|
|
10
10
|
*,
|
|
11
11
|
:before,
|
|
12
12
|
:after {
|
|
@@ -279,7 +279,7 @@ Please compile your catalog first.
|
|
|
279
279
|
svg {
|
|
280
280
|
pointer-events: none;
|
|
281
281
|
}
|
|
282
|
-
`,
|
|
282
|
+
`,Ar=vr(`*, :before, :after {
|
|
283
283
|
--w-rotate: 0;
|
|
284
284
|
--w-rotate-x: 0;
|
|
285
285
|
--w-rotate-y: 0;
|
|
@@ -2445,7 +2445,83 @@ Please compile your catalog first.
|
|
|
2445
2445
|
display: none
|
|
2446
2446
|
}
|
|
2447
2447
|
}
|
|
2448
|
-
`);var
|
|
2448
|
+
`);var De=JSON.parse('{"select.label.optional":["(valgfrit)"]}');var Ae=JSON.parse('{"select.label.optional":["(optional)"]}');var Ne=JSON.parse('{"select.label.optional":["(vapaaehtoinen)"]}');var je=JSON.parse('{"select.label.optional":["(valgfritt)"]}');var Ye=JSON.parse('{"select.label.optional":["(valfritt)"]}');import{unsafeCSS as mr}from"lit";var Re=mr("*,: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}.focus\\:\\[--w-outline-offset\\:-2px\\]:focus{--w-outline-offset:-2px}.bg-transparent{background-color:#0000}.appearance-none{-webkit-appearance:none;appearance:none}.border-0{border-width:0}.border-1{border-width:1px}.rounded-4{border-radius:4px}.caret-current{caret-color:currentColor}.opacity-25{opacity:.25}.block,.before\\:block:before{display:block}.flex{display:flex}.before\\:hidden:before{display:none}.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}.outline-\\[--w-s-color-border-negative\\]\\!{outline-color:var(--w-s-color-border-negative)!important}.bottom-0{bottom:0}.right-0{right:0}.before\\:bottom-0:before{bottom:0}.before\\:right-0:before{right:0}.top-\\[30\\%\\]{top:30%}.absolute{position:absolute}.relative{position:relative}.static{position:static}.before\\:absolute:before{position:absolute}.s-bg{background-color:var(--w-s-color-background)}.s-bg-disabled-subtle{background-color:var(--w-s-color-background-disabled-subtle)}.s-text{color:var(--w-s-color-text)}.s-text-disabled{color:var(--w-s-color-text-disabled)}.s-text-negative{color:var(--w-s-color-text-negative)}.s-text-subtle{color:var(--w-s-color-text-subtle)}.s-icon{color:var(--w-s-color-icon)}.s-border-disabled{border-color:var(--w-s-color-border-disabled)}.s-border-negative{border-color:var(--w-s-color-border-negative)}.s-border-strong{border-color:var(--w-s-color-border-strong)}.hover\\:s-border-disabled:hover{border-color:var(--w-s-color-border-disabled)}.hover\\:s-border-negative-hover:hover{border-color:var(--w-s-color-border-negative-hover)}.hover\\:s-border-strong-hover:hover{border-color:var(--w-s-color-border-strong-hover)}.active\\:s-border-active:active{border-color:var(--w-s-color-border-active)}.active\\:s-border-disabled:active{border-color:var(--w-s-color-border-disabled)}.h-full{height:100%}.w-32{width:3.2rem}.w-full{width:100%}.before\\:h-full:before{height:100%}.before\\:w-32:before{width:3.2rem}.mb-0{margin-bottom:0}.mt-4{margin-top:.4rem}.py-12{padding-top:1.2rem;padding-bottom:1.2rem}.pb-4{padding-bottom:.4rem}.pl-0{padding-left:0}.pl-8{padding-left:.8rem}.pr-32{padding-right:3.2rem}.cursor-pointer{cursor:pointer}.antialiased{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-smoothing:grayscale}.font-bold{font-weight:700}.font-normal{font-weight:400}.pointer-events-none,.before\\:pointer-events-none:before{pointer-events:none}.text-m{font-size:var(--w-font-size-m);line-height:var(--w-line-height-m)}.text-s{font-size:var(--w-font-size-s);line-height:var(--w-line-height-s)}.text-xs{font-size:var(--w-font-size-xs);line-height:var(--w-line-height-xs)}");import{css as Ie}from"lit";var Xe=Ie`
|
|
2449
|
+
/* Label component tokens with semantic fallbacks */
|
|
2450
|
+
label {
|
|
2451
|
+
/* Internal tokens - not part of public API */
|
|
2452
|
+
--_color: var(--w-c-input-label-color, var(--w-s-color-text));
|
|
2453
|
+
--_font-size: var(--w-c-input-label-font-size, var(--w-font-size-s));
|
|
2454
|
+
--_line-height: var(--w-c-input-label-line-height, var(--w-line-height-s));
|
|
2455
|
+
--_font-weight: var(--w-c-input-label-font-weight, 700);
|
|
2456
|
+
--_padding-bottom: var(--w-c-input-label-padding-bottom, 0.4rem);
|
|
2457
|
+
--_cursor: var(--w-c-input-label-cursor, pointer);
|
|
2458
|
+
--_display: var(--w-c-input-label-display, block);
|
|
2459
|
+
|
|
2460
|
+
/* Apply styles */
|
|
2461
|
+
display: var(--_display);
|
|
2462
|
+
position: relative;
|
|
2463
|
+
font-size: var(--_font-size);
|
|
2464
|
+
line-height: var(--_line-height);
|
|
2465
|
+
font-weight: var(--_font-weight);
|
|
2466
|
+
padding-bottom: var(--_padding-bottom);
|
|
2467
|
+
cursor: var(--_cursor);
|
|
2468
|
+
color: var(--_color);
|
|
2469
|
+
-webkit-font-smoothing: antialiased;
|
|
2470
|
+
-moz-osx-font-smoothing: grayscale;
|
|
2471
|
+
}
|
|
2472
|
+
|
|
2473
|
+
/* Optional text styling */
|
|
2474
|
+
label span {
|
|
2475
|
+
--_padding-left: var(--w-c-input-optional-padding-left, 0.8rem);
|
|
2476
|
+
--_font-weight: var(--w-c-input-optional-font-weight, 400);
|
|
2477
|
+
--_font-size: var(--w-c-input-optional-font-size, var(--w-font-size-s));
|
|
2478
|
+
--_line-height: var(
|
|
2479
|
+
--w-c-input-optional-line-height,
|
|
2480
|
+
var(--w-line-height-s)
|
|
2481
|
+
);
|
|
2482
|
+
--_color: var(--w-c-input-optional-color, var(--w-s-color-text-subtle));
|
|
2483
|
+
|
|
2484
|
+
padding-left: var(--_padding-left);
|
|
2485
|
+
font-weight: var(--_font-weight);
|
|
2486
|
+
font-size: var(--_font-size);
|
|
2487
|
+
line-height: var(--_line-height);
|
|
2488
|
+
color: var(--_color);
|
|
2489
|
+
}
|
|
2490
|
+
`,He=Ie`
|
|
2491
|
+
/* Help text component tokens with semantic fallbacks */
|
|
2492
|
+
:host {
|
|
2493
|
+
--_help-text-color: var(
|
|
2494
|
+
--w-c-input-help-text-color,
|
|
2495
|
+
var(--w-s-color-text-subtle)
|
|
2496
|
+
);
|
|
2497
|
+
--_help-text-font-size: var(
|
|
2498
|
+
--w-c-input-help-text-font-size,
|
|
2499
|
+
var(--w-font-size-xs)
|
|
2500
|
+
);
|
|
2501
|
+
--_help-text-line-height: var(
|
|
2502
|
+
--w-c-input-help-text-line-height,
|
|
2503
|
+
var(--w-line-height-xs)
|
|
2504
|
+
);
|
|
2505
|
+
--_help-text-margin-top: var(--w-c-input-help-text-margin-top, 0.4rem);
|
|
2506
|
+
--_help-text-display: var(--w-c-input-help-text-display, block);
|
|
2507
|
+
}
|
|
2508
|
+
|
|
2509
|
+
/* Invalid state overrides color */
|
|
2510
|
+
:host([invalid]) {
|
|
2511
|
+
--_help-text-color: var(
|
|
2512
|
+
--w-c-input-help-text-color-invalid,
|
|
2513
|
+
var(--w-s-color-text-negative)
|
|
2514
|
+
);
|
|
2515
|
+
}
|
|
2516
|
+
|
|
2517
|
+
.help-text {
|
|
2518
|
+
font-size: var(--_help-text-font-size);
|
|
2519
|
+
line-height: var(--_help-text-line-height);
|
|
2520
|
+
margin-top: var(--_help-text-margin-top);
|
|
2521
|
+
display: var(--_help-text-display);
|
|
2522
|
+
color: var(--_help-text-color);
|
|
2523
|
+
}
|
|
2524
|
+
`;import{html as wr,LitElement as xr}from"lit";import{property as ge,state as yr}from"lit/decorators.js";import{classMap as kr}from"lit/directives/class-map.js";import{css as fr}from"lit";var Ue=fr`
|
|
2449
2525
|
:host {
|
|
2450
2526
|
display: inline-block;
|
|
2451
2527
|
}
|
|
@@ -2469,34 +2545,35 @@ Please compile your catalog first.
|
|
|
2469
2545
|
.w-icon--l {
|
|
2470
2546
|
--w-icon-size: 32px;
|
|
2471
2547
|
}
|
|
2472
|
-
`;var ve=new Map,
|
|
2548
|
+
`;var ve=new Map,_r='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function zr(o,r={}){let e=r.responseParser??(t=>t.text());return ve.has(o)||ve.set(o,fetch(o).then(e)),ve.get(o)}var P=class extends xr{constructor(){super(...arguments);this.locale=document.documentElement.lang||"en";this.svg=null}async fetchIcon(e){let t=`https://assets.finn.no/pkg/eikons/~1/${this.locale}/${e}.svg`;try{let a=await zr(t);return new DOMParser().parseFromString(a,"text/html").body.querySelector("svg")}catch{return null}}firstUpdated(){this.loadIcon()}updated(e){(e.has("name")||e.has("locale"))&&this.loadIcon()}async loadIcon(){if(!this.name){this.svg=null;return}let e=await this.fetchIcon(this.name);e||(e=new DOMParser().parseFromString(_r,"text/html").body.firstElementChild),this.svg=e}render(){let e=this.size||"medium",t=this.name||"",a={"w-icon":!0,"w-icon--s":e==="small","w-icon--m":e==="medium","w-icon--l":e==="large"},s=typeof e=="string"&&e.endsWith("px")?`--w-icon-size: ${e};`:"";return wr`<div
|
|
2473
2549
|
class="${kr(a)}"
|
|
2474
2550
|
style="${s}"
|
|
2475
|
-
part="w-${
|
|
2551
|
+
part="w-${t.toLowerCase()}"
|
|
2476
2552
|
>
|
|
2477
2553
|
${this.svg}
|
|
2478
|
-
</div>`}};P.styles=[
|
|
2479
|
-
${fe(this.label,()=>
|
|
2554
|
+
</div>`}};P.styles=[Ue],p([ge({type:String,reflect:!0})],P.prototype,"name",2),p([ge({type:String,reflect:!0})],P.prototype,"size",2),p([ge({type:String,reflect:!0,useDefault:!0})],P.prototype,"locale",2),p([yr()],P.prototype,"svg",2);customElements.get("w-icon")||customElements.define("w-icon",P);var M={base:"block text-m mb-0 py-12 pr-32 rounded-4 w-full focusable focus:[--w-outline-offset:-2px] appearance-none cursor-pointer caret-current",default:"s-text s-bg pl-8 border-1 s-border-strong hover:s-border-strong-hover active:s-border-active",disabled:"s-text-disabled s-bg-disabled-subtle pl-8 border-1 s-border-disabled hover:s-border-disabled active:s-border-disabled pointer-events-none",invalid:"s-text s-bg pl-8 border-1 s-border-negative hover:s-border-negative-hover active:s-border-active outline-[--w-s-color-border-negative]!",readOnly:"s-text bg-transparent pl-0 border-0 pointer-events-none before:hidden",wrapper:"relative",selectWrapper:"relative before:block before:absolute before:right-0 before:bottom-0 before:w-32 before:h-full before:pointer-events-none ",chevron:"block absolute top-[30%] right-0 bottom-0 w-32 h-full s-icon pointer-events-none cursor-pointer",chevronDisabled:"opacity-25"},B,G,j,l,we,ee,Ze,N,re,xe,Be,Ge,qe,te,oe,v=class extends Le(Fr){constructor(){super();U(this,l);this.autoFocus=!1;this.autofocus=!1;this.invalid=!1;this.always=!1;this.optional=!1;this.disabled=!1;this.readOnly=!1;this.readonly=!1;this._options=[];U(this,B);U(this,G,()=>f(this,l,re).call(this));U(this,j);this._setValue=e=>{this.value=e,this.setValue(e)};Te(Ae,je,Ne,De,Ye)}resetFormControl(){this.value=x(this,B)}connectedCallback(){super.connectedCallback(),le(this,B,this.value),(this.autofocus||this.autoFocus)&&this.shadowRoot.querySelector("select").focus(),f(this,l,xe).call(this,{syncValueFromSelected:!0}),this.ownerDocument?.defaultView?.addEventListener("pageshow",x(this,G)),le(this,j,new MutationObserver(()=>{f(this,l,xe).call(this,{syncValueFromSelected:!0})})),x(this,j).observe(this,{childList:!0,subtree:!0,characterData:!0,attributes:!0,attributeFilter:["selected","disabled","value"]})}disconnectedCallback(){super.disconnectedCallback(),this.ownerDocument?.defaultView?.removeEventListener("pageshow",x(this,G)),x(this,j)?.disconnect()}firstUpdated(){this.value&&f(this,l,N).call(this,this.value),f(this,l,re).call(this,{allowDefaultFirstOption:!1})}formStateRestoreCallback(e,t){if(typeof e=="string"&&e){this._setValue(e),f(this,l,N).call(this,e);return}f(this,l,re).call(this,{allowDefaultFirstOption:!0})}willUpdate(e){e.has("value")&&this.setValue(this.value)}updated(e){if(e.has("value")){let t=f(this,l,ee).call(this);t&&t.value!==this.value&&(t.value=this.value??""),f(this,l,N).call(this,this.value??"")}}handleKeyDown(e){if((this.readonly||this.readOnly)&&(e.key===" "||e.key==="ArrowDown"||e.key==="ArrowUp")&&e.preventDefault(),e.key==="Enter"&&this.internals.form){this.internals.form.requestSubmit();return}}onChange(e){let a=e.currentTarget.value;e.stopPropagation(),this._setValue(a),f(this,l,N).call(this,a),this.dispatchEvent(new CustomEvent("change",{detail:a,bubbles:!0,composed:!0}))}render(){return Z`<div class="${M.wrapper}">
|
|
2555
|
+
${fe(this.label,()=>Z`<label for="${x(this,l,te)}">
|
|
2480
2556
|
${this.label}
|
|
2481
|
-
${fe(this.optional,()=>
|
|
2557
|
+
${fe(this.optional,()=>Z`<span
|
|
2482
2558
|
>${C._({id:"select.label.optional",message:"(optional)",comment:"Shown behind label when marked as optional"})}</span
|
|
2483
2559
|
>`)}</label
|
|
2484
2560
|
>`)}
|
|
2485
2561
|
<div class="${M.selectWrapper}">
|
|
2486
2562
|
<select
|
|
2563
|
+
part="input"
|
|
2487
2564
|
class="${x(this,l,Be)}"
|
|
2488
|
-
id="${x(this,l,
|
|
2565
|
+
id="${x(this,l,te)}"
|
|
2489
2566
|
?disabled=${this.disabled}
|
|
2490
2567
|
aria-readonly="${this.readonly}"
|
|
2491
|
-
aria-describedby="${me(x(this,l,
|
|
2568
|
+
aria-describedby="${me(x(this,l,oe))}"
|
|
2492
2569
|
aria-invalid="${me(this.invalid)}"
|
|
2493
|
-
aria-errormessage="${me(this.invalid&&x(this,l,
|
|
2570
|
+
aria-errormessage="${me(this.invalid&&x(this,l,oe))}"
|
|
2494
2571
|
@keydown=${this.handleKeyDown}
|
|
2495
2572
|
@change=${this.onChange}
|
|
2496
2573
|
>
|
|
2497
2574
|
${this._options}
|
|
2498
2575
|
</select>
|
|
2499
|
-
<div class="${x(this,l,
|
|
2576
|
+
<div class="${x(this,l,qe)}">
|
|
2500
2577
|
<w-icon
|
|
2501
2578
|
name="ChevronDown"
|
|
2502
2579
|
size="small"
|
|
@@ -2505,21 +2582,21 @@ Please compile your catalog first.
|
|
|
2505
2582
|
></w-icon>
|
|
2506
2583
|
</div>
|
|
2507
2584
|
</div>
|
|
2508
|
-
${fe(this.helpText||this.always||this.invalid,()=>
|
|
2585
|
+
${fe(this.helpText||this.always||this.invalid,()=>Z`<div id="${x(this,l,oe)}" class="${x(this,l,Ge)}">
|
|
2509
2586
|
${this.helpText||this.hint}
|
|
2510
2587
|
</div>`)}
|
|
2511
|
-
</div>`}};
|
|
2588
|
+
</div>`}};B=new WeakMap,G=new WeakMap,j=new WeakMap,l=new WeakSet,we=function(){return[...this.children].filter(e=>e.tagName.toLowerCase()==="option"||e.tagName.toLowerCase()==="w-option")},ee=function(){return this.shadowRoot?.querySelector("select")},Ze=function(){return f(this,l,we).call(this).some(e=>e.hasAttribute("selected"))},N=function(e){let t=f(this,l,ee).call(this);if(!t)return;let a=!1;for(let s of[...t.options]){let i=!a&&s.value===e;s.selected=i,s.toggleAttribute("selected",i),i&&(a=!0)}},re=function({allowDefaultFirstOption:e=!1}={}){let t=f(this,l,ee).call(this);if(!t)return;let a=t.value;!a||a===this.value||!e&&!this.value&&!f(this,l,Ze).call(this)&&t.selectedIndex===0||(this._setValue(a),f(this,l,N).call(this,a))},xe=function({syncValueFromSelected:e=!1}={}){let t=f(this,l,we).call(this),a,s=t.map(i=>{let n=i.getAttribute("value")??"",b=i.textContent??"",w=i.hasAttribute("selected"),F=i.hasAttribute("disabled");return e&&a===void 0&&w&&(a=n),Z`<option
|
|
2512
2589
|
value="${n}"
|
|
2513
2590
|
?selected=${w}
|
|
2514
2591
|
?disabled=${F}
|
|
2515
2592
|
>
|
|
2516
|
-
${
|
|
2517
|
-
</option>`});this._options=s,e&&a!==void 0&&a!==this.value&&this._setValue(a)},Be=function(){return
|
|
2593
|
+
${b}
|
|
2594
|
+
</option>`});this._options=s,e&&a!==void 0&&a!==this.value&&this._setValue(a)},Be=function(){return q([M.base,!this.invalid&&!this.disabled&&!(this.readonly||this.readOnly)&&M.default,this.invalid&&M.invalid,this.disabled&&M.disabled,(this.readonly||this.readOnly)&&M.readOnly])},Ge=function(){return"help-text"},qe=function(){return q([M.chevron,this.disabled&&M.chevronDisabled])},te=function(){return"select_id"},oe=function(){return this.helpText||this.hint?`${x(this,l,te)}__hint`:void 0},v.styles=[Oe,Re,Xe,He,Cr`
|
|
2518
2595
|
/* if there is an option with an empty value and it is selected */
|
|
2519
2596
|
select:has(option[value=""][selected]),
|
|
2520
2597
|
/* if there is an option with an empty value, and no other options are selected */
|
|
2521
2598
|
select:has(option[value=""]):not(:has(option[selected])) {
|
|
2522
2599
|
color: var(--w-s-color-text-placeholder);
|
|
2523
2600
|
}
|
|
2524
|
-
`],
|
|
2601
|
+
`],p([y({attribute:"auto-focus",type:Boolean,reflect:!0})],v.prototype,"autoFocus",2),p([y({type:Boolean,reflect:!0})],v.prototype,"autofocus",2),p([y({attribute:"help-text",reflect:!0})],v.prototype,"helpText",2),p([y({type:Boolean,reflect:!0})],v.prototype,"invalid",2),p([y({type:Boolean,reflect:!0})],v.prototype,"always",2),p([y({reflect:!0})],v.prototype,"hint",2),p([y({reflect:!0})],v.prototype,"label",2),p([y({type:Boolean,reflect:!0})],v.prototype,"optional",2),p([y({type:Boolean,reflect:!0})],v.prototype,"disabled",2),p([y({attribute:"read-only",type:Boolean,reflect:!0})],v.prototype,"readOnly",2),p([y({type:Boolean,reflect:!0})],v.prototype,"readonly",2),p([y({attribute:!1,state:!0})],v.prototype,"_options",2),p([y({reflect:!0})],v.prototype,"name",2),p([y({reflect:!0})],v.prototype,"value",2);customElements.get("w-select")||customElements.define("w-select",v);export{v as WarpSelect};
|
|
2525
2602
|
//# sourceMappingURL=select.js.map
|