@warp-ds/elements 2.6.0-next.4 → 2.6.0
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 +145 -143
- package/dist/index.d.ts +52 -52
- package/dist/packages/affix/affix.d.ts +1 -2
- package/dist/packages/affix/affix.js +35 -19
- package/dist/packages/affix/affix.js.map +4 -4
- package/dist/packages/alert/alert.d.ts +2 -5
- package/dist/packages/alert/alert.js +32 -16
- package/dist/packages/alert/alert.js.map +4 -4
- package/dist/packages/alert/alert.test.js +1 -3
- package/dist/packages/attention/attention.d.ts +2 -2
- package/dist/packages/attention/attention.js +53 -26
- package/dist/packages/attention/attention.js.map +4 -4
- package/dist/packages/button/button.react.stories.d.ts +1 -1
- package/dist/packages/button/button.stories.d.ts +1 -4
- package/dist/packages/button/button.stories.js +11 -16
- package/dist/packages/card/card.d.ts +1 -1
- package/dist/packages/combobox/combobox.react.stories.d.ts +1 -1
- package/dist/packages/datepicker/datepicker.d.ts +1 -3
- package/dist/packages/datepicker/datepicker.js +66 -41
- package/dist/packages/datepicker/datepicker.js.map +4 -4
- package/dist/packages/datepicker/datepicker.react.stories.d.ts +1 -1
- package/dist/packages/expandable/expandable.d.ts +1 -2
- package/dist/packages/expandable/expandable.js +39 -23
- package/dist/packages/expandable/expandable.js.map +4 -4
- package/dist/packages/icon/icon.js +2 -2
- package/dist/packages/icon/icon.js.map +4 -4
- package/dist/packages/icon/icon.react.stories.js +274 -2
- package/dist/packages/icon/icon.stories.js +273 -1
- package/dist/packages/link/link.react.stories.d.ts +1 -1
- package/dist/packages/modal-header/modal-header.d.ts +1 -2
- package/dist/packages/modal-header/modal-header.js +39 -14
- package/dist/packages/modal-header/modal-header.js.map +4 -4
- package/dist/packages/page-indicator/page-indicator.test.js +40 -20
- package/dist/packages/pagination/pagination.a11y.test.d.ts +1 -0
- package/dist/packages/pagination/pagination.a11y.test.js +36 -0
- package/dist/packages/pagination/pagination.d.ts +1 -3
- package/dist/packages/pagination/pagination.js +57 -34
- package/dist/packages/pagination/pagination.js.map +4 -4
- package/dist/packages/pill/pill.d.ts +1 -1
- package/dist/packages/pill/pill.js +38 -13
- package/dist/packages/pill/pill.js.map +4 -4
- package/dist/packages/pill/pill.test.js +1 -3
- package/dist/packages/select/select.d.ts +1 -1
- package/dist/packages/select/select.js +44 -19
- package/dist/packages/select/select.js.map +4 -4
- package/dist/packages/select/select.react.stories.d.ts +1 -1
- package/dist/packages/step/step.d.ts +1 -1
- package/dist/packages/step/step.js +38 -13
- package/dist/packages/step/step.js.map +4 -4
- package/dist/packages/step-indicator/step-indicator.a11y.test.d.ts +2 -0
- package/dist/packages/step-indicator/step-indicator.a11y.test.js +66 -0
- package/dist/packages/textarea/textarea.a11y.test.d.ts +1 -0
- package/dist/packages/textarea/textarea.a11y.test.js +115 -0
- package/dist/packages/textarea/textarea.js +6 -6
- package/dist/packages/textarea/textarea.js.map +4 -4
- package/dist/packages/textarea/textarea.react.stories.d.ts +1 -1
- package/dist/packages/textarea/textarea.test.js +3 -1
- package/dist/packages/textfield/textfield.react.stories.d.ts +1 -1
- package/dist/packages/toast/toast.d.ts +1 -4
- package/dist/packages/toast/toast.js +38 -13
- package/dist/packages/toast/toast.js.map +4 -4
- package/dist/setup-tests.d.ts +10 -0
- package/dist/setup-tests.js +61 -0
- package/dist/web-types.json +47 -47
- package/package.json +2 -2
|
@@ -9,9 +9,7 @@ test('renders a pill', async () => {
|
|
|
9
9
|
test('renders a pill with a close icon', async () => {
|
|
10
10
|
const page = render(html ` <w-pill can-close>Close me</w-pill>`);
|
|
11
11
|
await expect.element(page.getByText('Close me')).toBeVisible();
|
|
12
|
-
await expect
|
|
13
|
-
.poll(() => page.getByText('Close me').element().shadowRoot.querySelector('w-icon-close-16'))
|
|
14
|
-
.toBeVisible();
|
|
12
|
+
await expect.poll(() => page.getByText('Close me').element().shadowRoot.querySelector('w-icon')).toBeVisible();
|
|
15
13
|
});
|
|
16
14
|
test('renders screen reader label on the pill', async () => {
|
|
17
15
|
const page = render(html ` <w-pill open-sr-label="Open me please">Close me</w-pill>`);
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { LitElement, TemplateResult } from 'lit';
|
|
2
|
-
import '
|
|
2
|
+
import '../icon/icon.js';
|
|
3
3
|
declare const WarpSelect_base: import("@open-wc/form-control").Constructor<import("@open-wc/form-control").FormControlInterface> & typeof LitElement;
|
|
4
4
|
/**
|
|
5
5
|
* A dropdown component for selecting a single value.
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
var
|
|
2
|
-
`],["r","\r"],["t"," "],["v","\v"],["0","\0"]]);function
|
|
1
|
+
var Je=Object.create;var te=Object.defineProperty;var me=Object.getOwnPropertyDescriptor;var Ke=Object.getOwnPropertyNames;var Qe=Object.getPrototypeOf,We=Object.prototype.hasOwnProperty;var fe=o=>{throw TypeError(o)};var we=(o,e)=>()=>(e||o((e={exports:{}}).exports,e),e.exports);var er=(o,e,r,t)=>{if(e&&typeof e=="object"||typeof e=="function")for(let a of Ke(e))!We.call(o,a)&&a!==r&&te(o,a,{get:()=>e[a],enumerable:!(t=me(e,a))||t.enumerable});return o};var rr=(o,e,r)=>(r=o!=null?Je(Qe(o)):{},er(e||!o||!o.__esModule?te(r,"default",{value:o,enumerable:!0}):r,o));var p=(o,e,r,t)=>{for(var a=t>1?void 0:t?me(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&&te(e,r,a),a};var xe=(o,e,r)=>e.has(o)||fe("Cannot "+r);var M=(o,e,r)=>(xe(o,e,"read from private field"),r?r.call(o):e.get(o)),ae=(o,e,r)=>e.has(o)?fe("Cannot add the same private member more than once"):e instanceof WeakSet?e.add(o):e.set(o,r),ye=(o,e,r,t)=>(xe(o,e,"write to private field"),t?t.call(o,r):e.set(o,r),r);var ke=we(V=>{"use strict";Object.defineProperty(V,"__esModule",{value:!0});V.errorMessages=V.ErrorType=void 0;var Y;(function(o){o.MalformedUnicode="MALFORMED_UNICODE",o.MalformedHexadecimal="MALFORMED_HEXADECIMAL",o.CodePointLimit="CODE_POINT_LIMIT",o.OctalDeprecation="OCTAL_DEPRECATION",o.EndOfString="END_OF_STRING"})(Y=V.ErrorType||(V.ErrorType={}));V.errorMessages=new Map([[Y.MalformedUnicode,"malformed Unicode character escape sequence"],[Y.MalformedHexadecimal,"malformed hexadecimal character escape sequence"],[Y.CodePointLimit,"Unicode codepoint must not be greater than 0x10FFFF in escape sequence"],[Y.OctalDeprecation,'"0"-prefixed octal literals and octal escape sequences are deprecated; for octal literals use the "0o" prefix instead'],[Y.EndOfString,"malformed escape sequence at end of string"]])});var ze=we(T=>{"use strict";Object.defineProperty(T,"__esModule",{value:!0});T.unraw=T.errorMessages=T.ErrorType=void 0;var x=ke();Object.defineProperty(T,"ErrorType",{enumerable:!0,get:function(){return x.ErrorType}});Object.defineProperty(T,"errorMessages",{enumerable:!0,get:function(){return x.errorMessages}});function or(o){return!o.match(/[^a-f0-9]/i)?parseInt(o,16):NaN}function q(o,e,r){let t=or(o);if(Number.isNaN(t)||r!==void 0&&r!==o.length)throw new SyntaxError(x.errorMessages.get(e));return t}function tr(o){let e=q(o,x.ErrorType.MalformedHexadecimal,2);return String.fromCharCode(e)}function _e(o,e){let r=q(o,x.ErrorType.MalformedUnicode,4);if(e!==void 0){let t=q(e,x.ErrorType.MalformedUnicode,4);return String.fromCharCode(r,t)}return String.fromCharCode(r)}function ar(o){return o.charAt(0)==="{"&&o.charAt(o.length-1)==="}"}function ir(o){if(!ar(o))throw new SyntaxError(x.errorMessages.get(x.ErrorType.MalformedUnicode));let e=o.slice(1,-1),r=q(e,x.ErrorType.MalformedUnicode);try{return String.fromCodePoint(r)}catch(t){throw t instanceof RangeError?new SyntaxError(x.errorMessages.get(x.ErrorType.CodePointLimit)):t}}function sr(o,e=!1){if(e)throw new SyntaxError(x.errorMessages.get(x.ErrorType.OctalDeprecation));let r=parseInt(o,8);return String.fromCharCode(r)}var nr=new Map([["b","\b"],["f","\f"],["n",`
|
|
2
|
+
`],["r","\r"],["t"," "],["v","\v"],["0","\0"]]);function lr(o){return nr.get(o)||o}var cr=/\\(?:(\\)|x([\s\S]{0,2})|u(\{[^}]*\}?)|u([\s\S]{4})\\u([^{][\s\S]{0,3})|u([\s\S]{0,4})|([0-3]?[0-7]{1,2})|([\s\S])|$)/g;function Ce(o,e=!1){return o.replace(cr,function(r,t,a,l,s,i,c,h,f){if(t!==void 0)return"\\";if(a!==void 0)return tr(a);if(l!==void 0)return ir(l);if(s!==void 0)return _e(s,i);if(c!==void 0)return _e(c);if(h==="0")return"\0";if(h!==void 0)return sr(h,!e);if(f!==void 0)return lr(f);throw new SyntaxError(x.errorMessages.get(x.ErrorType.EndOfString))})}T.unraw=Ce;T.default=Ce});var B=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)?B.apply(void 0,t):typeof t=="object"&&t?Object.keys(t).map(function(a){return t[a]?a:""}):"")},[]).join(" ")};var Fe=rr(ze(),1);var S=o=>typeof o=="string",dr=o=>typeof o=="function",Me=new Map,Te="en";function le(o){return[...Array.isArray(o)?o:[o],Te]}function ce(o,e,r){let t=le(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 J(()=>K("date",t,r),()=>new Intl.DateTimeFormat(t,a)).format(S(e)?new Date(e):e)}function br(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 ce(o,e,t)}function ie(o,e,r){let t=le(o);return J(()=>K("number",t,r),()=>new Intl.NumberFormat(t,r)).format(e)}function Ee(o,e,r,{offset:t=0,...a}){var i,c;let l=le(o),s=e?J(()=>K("plural-ordinal",l),()=>new Intl.PluralRules(l,{type:"ordinal"})):J(()=>K("plural-cardinal",l),()=>new Intl.PluralRules(l,{type:"cardinal"}));return(c=(i=a[r])!=null?i:a[s.select(r-t)])!=null?c:a.other}function J(o,e){let r=o(),t=Me.get(r);return t||(t=e(),Me.set(r,t)),t}function K(o,e,r){let t=e.join("-");return`${o}-${t}-${JSON.stringify(r)}`}var Oe=/\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/,$e="%__lingui_octothorpe__%",hr=(o,e,r={})=>{let t=e||o,a=s=>typeof s=="object"?s:r[s],l=(s,i)=>{let c=Object.keys(r).length?a("number"):void 0,h=ie(t,s,c);return i.replace(new RegExp($e,"g"),h)};return{plural:(s,i)=>{let{offset:c=0}=i,h=Ee(t,!1,s,i);return l(s-c,h)},selectordinal:(s,i)=>{let{offset:c=0}=i,h=Ee(t,!0,s,i);return l(s-c,h)},select:pr,number:(s,i)=>ie(t,s,a(i)||{style:i}),date:(s,i)=>ce(t,s,a(i)||i),time:(s,i)=>br(t,s,a(i)||i)}},pr=(o,e)=>{var r;return(r=e[o])!=null?r:e.other};function ur(o,e,r){return(t={},a)=>{let l=hr(e,r,a),s=(c,h=!1)=>Array.isArray(c)?c.reduce((f,z)=>{if(z==="#"&&h)return f+$e;if(S(z))return f+z;let[E,_,L]=z,P={};_==="plural"||_==="selectordinal"||_==="select"?Object.entries(L).forEach(([N,I])=>{P[N]=s(I,_==="plural"||_==="selectordinal")}):P=L;let k;if(_){let N=l[_];k=N(t[E],P)}else k=t[E];return k==null?f:f+k},""):c,i=s(o);return S(i)&&Oe.test(i)?(0,Fe.unraw)(i):S(i)?i:i?String(i):""}}var gr=Object.defineProperty,vr=(o,e,r)=>e in o?gr(o,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):o[e]=r,mr=(o,e,r)=>(vr(o,typeof e!="symbol"?e+"":e,r),r),se=class{constructor(){mr(this,"_events",{})}on(e,r){var a;var t;return(a=(t=this._events)[e])!=null||(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}},fr=Object.defineProperty,wr=(o,e,r)=>e in o?fr(o,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):o[e]=r,D=(o,e,r)=>(wr(o,typeof e!="symbol"?e+"":e,r),r),ne=class extends se{constructor(e){var r;super(),D(this,"_locale",""),D(this,"_locales"),D(this,"_localeData",{}),D(this,"_messages",{}),D(this,"_missing"),D(this,"_messageCompiler"),D(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((r=e.locale)!=null?r:Te,e.locales)}get locale(){return this._locale}get locales(){return this._locales}get messages(){var e;return(e=this._messages[this._locale])!=null?e:{}}get localeData(){var e;return(e=this._localeData[this._locale])!=null?e:{}}_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==null?void 0:t.message;e||(e=""),S(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 dr(i)?i(this._locale,e):i;s&&this.emit("missing",{id:e,locale:this._locale});let c=l||a||e;return S(c)&&(this._messageCompiler?c=this._messageCompiler(c):console.warn(`Uncompiled message detected! Message:
|
|
3
3
|
|
|
4
4
|
> ${c}
|
|
5
5
|
|
|
@@ -7,7 +7,7 @@ That means you use raw catalog or your catalog doesn't have a translation for th
|
|
|
7
7
|
ICU features such as interpolation and plurals will not work properly for that message.
|
|
8
8
|
|
|
9
9
|
Please compile your catalog first.
|
|
10
|
-
`)),
|
|
10
|
+
`)),S(c)&&Oe.test(c)?JSON.parse(`"${c}"`):S(c)?c:ur(c,this._locale,this._locales)(r,t==null?void 0:t.formats)}date(e,r){return ce(this._locales||this._locale,e,r)}number(e,r){return ie(this._locales||this._locale,e,r)}};function xr(o={}){return new ne(o)}var O=xr();var b=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)},g=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 Le(o){var e,r,t,a,l,s,i,c,h,f,z,E,_,L,P,k,N,I,ee;class qe extends o{constructor(...n){var d,u,m;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),h.set(this,""),f.set(this,()=>{g(this,a,!0,"f"),g(this,r,!0,"f"),b(this,e,"m",k).call(this)}),z.set(this,()=>{g(this,r,!1,"f"),b(this,e,"m",N).call(this,this.shouldFormValueUpdate()?b(this,h,"f"):""),!this.validity.valid&&b(this,a,"f")&&g(this,t,!0,"f");let F=b(this,e,"m",k).call(this);this.validationMessageCallback&&this.validationMessageCallback(F?this.internals.validationMessage:"")}),E.set(this,()=>{var F;b(this,i,"f")&&this.validationTarget&&(this.internals.setValidity(this.validity,this.validationMessage,this.validationTarget),g(this,i,!1,"f")),g(this,a,!0,"f"),g(this,t,!0,"f"),b(this,e,"m",k).call(this),(F=this===null||this===void 0?void 0:this.validationMessageCallback)===null||F===void 0||F.call(this,this.showError?this.internals.validationMessage:"")}),_.set(this,void 0),L.set(this,!1),P.set(this,Promise.resolve()),(d=this.addEventListener)===null||d===void 0||d.call(this,"focus",b(this,f,"f")),(u=this.addEventListener)===null||u===void 0||u.call(this,"blur",b(this,z,"f")),(m=this.addEventListener)===null||m===void 0||m.call(this,"invalid",b(this,E,"f")),this.setValue(null)}static get formAssociated(){return!0}static get validators(){return this.formControlValidators||[]}static get observedAttributes(){let n=this.validators.map(m=>m.attribute).flat(),d=super.observedAttributes||[];return[...new Set([...d,...n])]}static getValidator(n){return this.validators.find(d=>d.attribute===n)||null}static getValidators(n){return this.validators.filter(d=>{var u;if(d.attribute===n||!((u=d.attribute)===null||u===void 0)&&u.includes(n))return!0})}get form(){return this.internals.form}get showError(){return b(this,e,"m",k).call(this)}checkValidity(){return this.internals.checkValidity()}get validity(){return this.internals.validity}get validationMessage(){return this.internals.validationMessage}attributeChangedCallback(n,d,u){var m;(m=super.attributeChangedCallback)===null||m===void 0||m.call(this,n,d,u);let X=this.constructor.getValidators(n);X!=null&&X.length&&this.validationTarget&&this.setValue(b(this,h,"f"))}setValue(n){var d;g(this,t,!1,"f"),(d=this.validationMessageCallback)===null||d===void 0||d.call(this,""),g(this,h,n,"f");let m=this.shouldFormValueUpdate()?n:null;this.internals.setFormValue(m),b(this,e,"m",N).call(this,m),this.valueChangedCallback&&this.valueChangedCallback(m),b(this,e,"m",k).call(this)}shouldFormValueUpdate(){return!0}get validationComplete(){return new Promise(n=>n(b(this,P,"f")))}formResetCallback(){var n,d;g(this,a,!1,"f"),g(this,t,!1,"f"),b(this,e,"m",k).call(this),(n=this.resetFormControl)===null||n===void 0||n.call(this),(d=this.validationMessageCallback)===null||d===void 0||d.call(this,b(this,e,"m",k).call(this)?this.validationMessage:"")}}return r=new WeakMap,t=new WeakMap,a=new WeakMap,l=new WeakMap,s=new WeakMap,i=new WeakMap,h=new WeakMap,f=new WeakMap,z=new WeakMap,E=new WeakMap,_=new WeakMap,L=new WeakMap,P=new WeakMap,e=new WeakSet,c=function(){let n=this.getRootNode(),d=`${this.localName}[name="${this.getAttribute("name")}"]`;return n.querySelectorAll(d)},k=function(){if(this.hasAttribute("disabled"))return!1;let n=b(this,t,"f")||b(this,a,"f")&&!this.validity.valid&&!b(this,r,"f");return n&&this.internals.states?this.internals.states.add("--show-error"):this.internals.states&&this.internals.states.delete("--show-error"),n},N=function(n){let d=this.constructor,u={},m=d.validators,F=[],X=m.some(C=>C.isValid instanceof Promise);b(this,L,"f")||(g(this,P,new Promise(C=>{g(this,_,C,"f")}),"f"),g(this,L,!0,"f")),b(this,l,"f")&&(b(this,l,"f").abort(),g(this,s,b(this,l,"f"),"f"));let H=new AbortController;g(this,l,H,"f");let Z,ve=!1;m.length&&(m.forEach(C=>{let re=C.key||"customError",j=C.isValid(this,n,H.signal);j instanceof Promise?(F.push(j),j.then(oe=>{oe!=null&&(u[re]=!oe,Z=b(this,e,"m",ee).call(this,C,n),b(this,e,"m",I).call(this,u,Z))})):(u[re]=!j,this.validity[re]!==!j&&(ve=!0),!j&&!Z&&(Z=b(this,e,"m",ee).call(this,C,n)))}),Promise.allSettled(F).then(()=>{var C;H!=null&&H.signal.aborted||(g(this,L,!1,"f"),(C=b(this,_,"f"))===null||C===void 0||C.call(this))}),(ve||!X)&&b(this,e,"m",I).call(this,u,Z))},I=function(n,d){if(this.validationTarget)this.internals.setValidity(n,d,this.validationTarget),g(this,i,!1,"f");else{if(this.internals.setValidity(n,d),this.internals.validity.valid)return;g(this,i,!0,"f")}},ee=function(n,d){if(this.validityCallback){let u=this.validityCallback(n.key||"customError");if(u)return u}return n.message instanceof Function?n.message(this,d):n.message},qe}import{css as Or,html as R,LitElement as $r}from"lit";import{property as y}from"lit/decorators.js";import{ifDefined as pe}from"lit/directives/if-defined.js";import{when as ue}from"lit/directives/when.js";var yr=["en","nb","fi","da","sv"],Se="en",Pe=o=>yr.find(e=>o===e||o.toLowerCase().includes(e))||Se;function de(){if(typeof window=="undefined"){let o=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return Pe(o)}try{let o=document.documentElement.lang;return Pe(o)}catch(o){return console.warn("could not detect locale, falling back to source locale",o),Se}}var Ae=(o,e,r,t,a)=>{O.load("en",o),O.load("nb",e),O.load("fi",r),O.load("da",t),O.load("sv",a);let l=de();O.activate(l)};import{css as Ne}from"lit";var Ve=Ne`
|
|
11
11
|
*,
|
|
12
12
|
:before,
|
|
13
13
|
:after {
|
|
@@ -280,7 +280,7 @@ Please compile your catalog first.
|
|
|
280
280
|
svg {
|
|
281
281
|
pointer-events: none;
|
|
282
282
|
}
|
|
283
|
-
`,
|
|
283
|
+
`,Ur=Ne`*, :before, :after {
|
|
284
284
|
--w-rotate: 0;
|
|
285
285
|
--w-rotate-x: 0;
|
|
286
286
|
--w-rotate-y: 0;
|
|
@@ -2446,37 +2446,62 @@ Please compile your catalog first.
|
|
|
2446
2446
|
display: none
|
|
2447
2447
|
}
|
|
2448
2448
|
}
|
|
2449
|
-
`;var
|
|
2450
|
-
|
|
2449
|
+
`;var De=JSON.parse('{"select.label.optional":["(valgfrit)"]}');var je=JSON.parse('{"select.label.optional":["(optional)"]}');var Ye=JSON.parse('{"select.label.optional":["(vapaaehtoinen)"]}');var Re=JSON.parse('{"select.label.optional":["(valgfritt)"]}');var Ie=JSON.parse('{"select.label.optional":["(valfritt)"]}');import{css as kr}from"lit";var Ue=kr`*,: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}.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{html as Cr,LitElement as zr}from"lit";import{property as be,state as Mr}from"lit/decorators.js";import{classMap as Er}from"lit/directives/class-map.js";import{css as _r}from"lit";var Xe=_r`
|
|
2450
|
+
:host {
|
|
2451
|
+
display: inline-block;
|
|
2452
|
+
}
|
|
2453
|
+
.w-icon {
|
|
2454
|
+
--_w-icon-size: var(--w-icon-size, 24px);
|
|
2455
|
+
height: var(--_w-icon-size);
|
|
2456
|
+
width: var(--_w-icon-size);
|
|
2457
|
+
display: flex;
|
|
2458
|
+
}
|
|
2459
|
+
.w-icon svg {
|
|
2460
|
+
pointer-events: none;
|
|
2461
|
+
height: var(--_w-icon-size);
|
|
2462
|
+
width: var(--_w-icon-size);
|
|
2463
|
+
}
|
|
2464
|
+
.w-icon--s {
|
|
2465
|
+
--w-icon-size: 16px;
|
|
2466
|
+
}
|
|
2467
|
+
.w-icon--m {
|
|
2468
|
+
--w-icon-size: 24px;
|
|
2469
|
+
}
|
|
2470
|
+
.w-icon--l {
|
|
2471
|
+
--w-icon-size: 32px;
|
|
2472
|
+
}
|
|
2473
|
+
|
|
2474
|
+
`;var he=new Map,Fr='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function Tr(o,e={}){var t;let r=(t=e.responseParser)!=null?t:(a=>a.text());return he.has(o)||he.set(o,fetch(o).then(r)),he.get(o)}var A=class extends zr{constructor(){super(...arguments);this.name="";this.size="medium";this.locale="en";this.svg=null}async fetchIcon(r){let t=`https://assets.finn.no/pkg/eikons/v1/${this.locale}/${r}.svg`;try{let a=await Tr(t);return new DOMParser().parseFromString(a,"text/html").body.querySelector("svg")}catch(a){return null}}firstUpdated(){this.loadIcon()}updated(r){(r.has("name")||r.has("locale"))&&this.loadIcon()}async loadIcon(){if(!this.name){this.svg=null;return}let r=await this.fetchIcon(this.name);r||(r=new DOMParser().parseFromString(Fr,"text/html").body.firstElementChild),this.svg=r}render(){let r={"w-icon":!0,"w-icon--s":this.size==="small","w-icon--m":this.size==="medium","w-icon--l":this.size==="large"},t=typeof this.size=="string"&&this.size.endsWith("px")?`--w-icon-size: ${this.size};`:"";return Cr`<div class="${Er(r)}" style="${t}" part="w-${this.name.toLowerCase()}">${this.svg}</div>`}};A.styles=[Xe],p([be({type:String,reflect:!0})],A.prototype,"name",2),p([be({type:String,reflect:!0})],A.prototype,"size",2),p([be({type:String,reflect:!0})],A.prototype,"locale",2),p([Mr()],A.prototype,"svg",2);customElements.get("w-icon")||customElements.define("w-icon",A);var $={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"},He={base:"antialiased block relative text-s font-bold pb-4 cursor-pointer s-text",optional:"pl-8 font-normal text-s s-text-subtle"},ge={base:"text-xs mt-4 block",color:"s-text-subtle",colorInvalid:"s-text-negative"},G,w,Ze,Be,Ge,Q,W,v=class extends Le($r){constructor(){super();ae(this,w);ae(this,G,null);this._setValue=r=>{this.value=r,this.setValue(r)};Ae(je,Re,Ye,De,Ie)}resetFormControl(){this.value=M(this,G)}connectedCallback(){super.connectedCallback(),ye(this,G,this.value),(this.autofocus||this.autoFocus)&&this.shadowRoot.querySelector("select").focus();let t=Array.from(this.children).filter(a=>a.tagName.toLowerCase()==="option"||a.tagName.toLowerCase()==="w-option").map(a=>{var h,f;let l=(h=a.getAttribute("value"))!=null?h:"",s=(f=a.textContent)!=null?f:"",i=a.hasAttribute("selected"),c=a.hasAttribute("disabled");return i&&this._setValue(l),R`<option value="${l}" ?selected=${i} ?disabled=${c}>${s}</option>`});this._options=t}handleKeyDown(r){(this.readonly||this.readOnly)&&(r.key===" "||r.key==="ArrowDown"||r.key==="ArrowUp")&&r.preventDefault()}onChange({target:r}){this._setValue(r.value);let t=new CustomEvent("change",{detail:r.value}),l=Array.from(this.children).filter(s=>s.tagName.toLowerCase()==="option"||s.tagName.toLowerCase()==="w-option").map(s=>{var z,E;let i=(z=s.getAttribute("value"))!=null?z:"",c=i===r.value,h=(E=s.textContent)!=null?E:"",f=s.hasAttribute("disabled");return R`<option value="${i}" ?selected=${c} ?disabled=${f}>${h}</option>`});this._options=l,this.dispatchEvent(t)}render(){return R`<div class="${$.wrapper}">
|
|
2475
|
+
${ue(this.label,()=>R`<label class="${He.base}" for="${M(this,w,Q)}">
|
|
2451
2476
|
${this.label}
|
|
2452
|
-
${
|
|
2453
|
-
>${
|
|
2477
|
+
${ue(this.optional,()=>R`<span class="${He.optional}"
|
|
2478
|
+
>${O._({id:"select.label.optional",message:"(optional)",comment:"Shown behind label when marked as optional"})}</span
|
|
2454
2479
|
>`)}</label
|
|
2455
2480
|
>`)}
|
|
2456
|
-
<div class="${
|
|
2481
|
+
<div class="${$.selectWrapper}">
|
|
2457
2482
|
<select
|
|
2458
|
-
class="${
|
|
2459
|
-
id="${
|
|
2483
|
+
class="${M(this,w,Ze)}"
|
|
2484
|
+
id="${M(this,w,Q)}"
|
|
2460
2485
|
?disabled=${this.disabled}
|
|
2461
2486
|
aria-readonly="${this.readonly}"
|
|
2462
|
-
aria-describedby="${
|
|
2463
|
-
aria-invalid="${
|
|
2464
|
-
aria-errormessage="${
|
|
2487
|
+
aria-describedby="${pe(M(this,w,W))}"
|
|
2488
|
+
aria-invalid="${pe(this.invalid)}"
|
|
2489
|
+
aria-errormessage="${pe(this.invalid&&M(this,w,W))}"
|
|
2465
2490
|
@keydown=${this.handleKeyDown}
|
|
2466
2491
|
@change=${this.onChange}>
|
|
2467
2492
|
${this._options}
|
|
2468
2493
|
</select>
|
|
2469
|
-
<div class="${
|
|
2470
|
-
<w-icon
|
|
2494
|
+
<div class="${M(this,w,Ge)}">
|
|
2495
|
+
<w-icon name="ChevronDown" size="small" locale="${de()}" class="flex"></w-icon>
|
|
2471
2496
|
</div>
|
|
2472
2497
|
</div>
|
|
2473
|
-
${
|
|
2474
|
-
</div>`}};
|
|
2498
|
+
${ue(this.helpText||this.always||this.invalid,()=>R`<div id="${M(this,w,W)}" class="${M(this,w,Be)}">${this.helpText||this.hint}</div>`)}
|
|
2499
|
+
</div>`}};G=new WeakMap,w=new WeakSet,Ze=function(){return B([$.base,!this.invalid&&!this.disabled&&!(this.readonly||this.readOnly)&&$.default,this.invalid&&$.invalid,this.disabled&&$.disabled,(this.readonly||this.readOnly)&&$.readOnly])},Be=function(){return B([ge.base,this.invalid?ge.colorInvalid:ge.color])},Ge=function(){return B([$.chevron,this.disabled&&$.chevronDisabled])},Q=function(){return"select_id"},W=function(){return this.hint?`${M(this,w,Q)}__hint`:void 0},v.styles=[Ve,Ue,Or`
|
|
2475
2500
|
/* if there is an option with an empty value and it is selected */
|
|
2476
2501
|
select:has(option[value=""][selected]),
|
|
2477
2502
|
/* if there is an option with an empty value, and no other options are selected */
|
|
2478
2503
|
select:has(option[value=""]):not(:has(option[selected])) {
|
|
2479
2504
|
color: var(--w-s-color-text-placeholder);
|
|
2480
2505
|
}
|
|
2481
|
-
`],
|
|
2506
|
+
`],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};
|
|
2482
2507
|
//# sourceMappingURL=select.js.map
|