@warp-ds/elements 2.10.0-next.13 → 2.10.0-next.15
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 +384 -0
- package/dist/docs/attention/api.md +48 -0
- package/dist/docs/attention/attention.md +48 -0
- package/dist/docs/button/api.md +8 -0
- package/dist/docs/button/button.md +8 -0
- package/dist/docs/card/api.md +8 -0
- package/dist/docs/card/card.md +8 -0
- package/dist/docs/checkbox/api.md +48 -0
- package/dist/docs/checkbox/checkbox.md +48 -0
- package/dist/docs/checkbox-group/api.md +24 -0
- package/dist/docs/checkbox-group/checkbox-group.md +24 -0
- package/dist/docs/combobox/api.md +8 -0
- package/dist/docs/combobox/combobox.md +8 -0
- package/dist/docs/datepicker/api.md +8 -0
- package/dist/docs/datepicker/datepicker.md +8 -0
- package/dist/docs/index.md +2 -0
- package/dist/docs/modal/api.md +16 -0
- package/dist/docs/modal/modal.md +16 -0
- package/dist/docs/slider-thumb/api.md +16 -0
- package/dist/docs/slider-thumb/slider-thumb.md +16 -0
- package/dist/docs/snackbar/accessibility.md +20 -0
- package/dist/docs/snackbar/api.md +30 -0
- package/dist/docs/snackbar/examples.md +191 -0
- package/dist/docs/snackbar/snackbar.md +385 -0
- package/dist/docs/snackbar/styling.md +72 -0
- package/dist/docs/snackbar/usage.md +60 -0
- package/dist/docs/snackbar-item/api.md +41 -0
- package/dist/docs/snackbar-item/snackbar-item.md +49 -0
- package/dist/docs/step/api.md +16 -0
- package/dist/docs/step/step.md +16 -0
- package/dist/docs/switch/api.md +8 -0
- package/dist/docs/switch/switch.md +8 -0
- package/dist/docs/textarea/api.md +40 -0
- package/dist/docs/textarea/textarea.md +40 -0
- package/dist/docs/textfield/api.md +32 -0
- package/dist/docs/textfield/textfield.md +32 -0
- package/dist/index.d.ts +292 -1
- package/dist/packages/affix/affix.js +4 -4
- package/dist/packages/affix/affix.js.map +2 -2
- package/dist/packages/alert/alert.js +2 -2
- package/dist/packages/alert/alert.js.map +2 -2
- package/dist/packages/attention/attention.d.ts +5 -0
- package/dist/packages/attention/attention.js +14 -14
- package/dist/packages/attention/attention.js.map +2 -2
- package/dist/packages/button/button.d.ts +5 -0
- package/dist/packages/button/button.js +3 -3
- package/dist/packages/button/button.js.map +2 -2
- package/dist/packages/button/button.react.stories.d.ts +2 -2
- package/dist/packages/button/button.test.js +0 -1
- package/dist/packages/button/react.d.ts +1 -1
- package/dist/packages/datepicker/DatePicker.test.js +5 -3
- package/dist/packages/datepicker/datepicker.js +49 -48
- package/dist/packages/datepicker/datepicker.js.map +3 -3
- package/dist/packages/datepicker/datepicker.test.js +1 -1
- package/dist/packages/datepicker/utils.d.ts +3 -0
- package/dist/packages/datepicker/utils.js +33 -0
- package/dist/packages/datepicker/utils.test.d.ts +1 -0
- package/dist/packages/datepicker/utils.test.js +29 -0
- package/dist/packages/expandable/expandable.js +9 -9
- package/dist/packages/expandable/expandable.js.map +4 -4
- package/dist/packages/global.d.ts +1 -0
- package/dist/packages/global.js +5 -0
- package/dist/packages/icon/icon.d.ts +5 -0
- package/dist/packages/icon/icon.js +2 -2
- package/dist/packages/icon/icon.js.map +2 -2
- package/dist/packages/interaction-type-detection.d.ts +22 -0
- package/dist/packages/interaction-type-detection.js +38 -0
- package/dist/packages/modal/modal.js +1 -1
- package/dist/packages/modal/modal.js.map +2 -2
- package/dist/packages/modal-header/modal-header.js +3 -3
- package/dist/packages/modal-header/modal-header.js.map +2 -2
- package/dist/packages/pagination/pagination.js +1 -1
- package/dist/packages/pagination/pagination.js.map +2 -2
- package/dist/packages/pill/pill.js +4 -4
- package/dist/packages/pill/pill.js.map +2 -2
- package/dist/packages/select/select.js +3 -3
- package/dist/packages/select/select.js.map +2 -2
- package/dist/packages/snackbar/locales/da/messages.d.mts +1 -0
- package/dist/packages/snackbar/locales/da/messages.mjs +1 -0
- package/dist/packages/snackbar/locales/en/messages.d.mts +1 -0
- package/dist/packages/snackbar/locales/en/messages.mjs +1 -0
- package/dist/packages/snackbar/locales/fi/messages.d.mts +1 -0
- package/dist/packages/snackbar/locales/fi/messages.mjs +1 -0
- package/dist/packages/snackbar/locales/nb/messages.d.mts +1 -0
- package/dist/packages/snackbar/locales/nb/messages.mjs +1 -0
- package/dist/packages/snackbar/locales/sv/messages.d.mts +1 -0
- package/dist/packages/snackbar/locales/sv/messages.mjs +1 -0
- package/dist/packages/snackbar/react.d.ts +2 -0
- package/dist/packages/snackbar/react.js +11 -0
- package/dist/packages/snackbar/snackbar.d.ts +132 -0
- package/dist/packages/snackbar/snackbar.hydration.test.d.ts +1 -0
- package/dist/packages/snackbar/snackbar.hydration.test.js +13 -0
- package/dist/packages/snackbar/snackbar.js +2646 -0
- package/dist/packages/snackbar/snackbar.js.map +7 -0
- package/dist/packages/snackbar/snackbar.react.stories.d.ts +12 -0
- package/dist/packages/snackbar/snackbar.react.stories.js +160 -0
- package/dist/packages/snackbar/snackbar.stories.d.ts +20 -0
- package/dist/packages/snackbar/snackbar.stories.js +291 -0
- package/dist/packages/snackbar/snackbar.test.d.ts +4 -0
- package/dist/packages/snackbar/snackbar.test.js +17 -0
- package/dist/packages/snackbar/styles.d.ts +1 -0
- package/dist/packages/snackbar/styles.js +35 -0
- package/dist/packages/snackbar-item/react.d.ts +5 -0
- package/dist/packages/snackbar-item/react.js +15 -0
- package/dist/packages/snackbar-item/snackbar-item.d.ts +69 -0
- package/dist/packages/snackbar-item/snackbar-item.js +2601 -0
- package/dist/packages/snackbar-item/snackbar-item.js.map +7 -0
- package/dist/packages/snackbar-item/snackbar-item.react.test.d.ts +1 -0
- package/dist/packages/snackbar-item/snackbar-item.react.test.js +5 -0
- package/dist/packages/snackbar-item/styles.d.ts +1 -0
- package/dist/packages/snackbar-item/styles.js +111 -0
- package/dist/packages/step/step.js +9 -9
- package/dist/packages/step/step.js.map +2 -2
- package/dist/packages/tabs/tabs.react.stories.d.ts +4 -4
- package/dist/packages/tabs/tabs.react.stories.js +1 -1
- package/dist/packages/tabs/tabs.stories.d.ts +1 -1
- package/dist/packages/tabs/tabs.stories.js +1 -1
- package/dist/packages/toast/toast.js +6 -6
- package/dist/packages/toast/toast.js.map +4 -4
- package/dist/packages/utils/element-collapse.d.ts +12 -0
- package/dist/packages/utils/element-collapse.js +92 -0
- package/dist/packages/utils/expand-transition.js +1 -1
- package/dist/web-types.json +88 -3
- package/eik/index.js +12 -12
- package/package.json +1 -3
|
@@ -23,7 +23,7 @@ var ne=Object.defineProperty;var se=Object.getOwnPropertyDescriptor;var d=(t,e,r
|
|
|
23
23
|
--w-icon-size: 32px;
|
|
24
24
|
}
|
|
25
25
|
|
|
26
|
-
`;var M=new Map,ge='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function ue(t,e={}){let r=e.responseParser??(o=>o.text());return M.has(t)||M.set(t,fetch(t).then(r)),M.get(t)}var g=class extends de{constructor(){super(...arguments);this.locale=document.documentElement.lang||"en";this.svg=null}async fetchIcon(r){let o=`https://assets.finn.no/pkg/eikons
|
|
26
|
+
`;var M=new Map,ge='<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 32 32"></svg>';function ue(t,e={}){let r=e.responseParser??(o=>o.text());return M.has(t)||M.set(t,fetch(t).then(r)),M.get(t)}var g=class extends de{constructor(){super(...arguments);this.locale=document.documentElement.lang||"en";this.svg=null}async fetchIcon(r){let o=`https://assets.finn.no/pkg/eikons/~1/${this.locale}/${r}.svg`;try{let a=await ue(o);return new DOMParser().parseFromString(a,"text/html").body.querySelector("svg")}catch{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(ge,"text/html").body.firstElementChild),this.svg=r}render(){let r=this.size||"medium",o=this.name||"",a={"w-icon":!0,"w-icon--s":r==="small","w-icon--m":r==="medium","w-icon--l":r==="large"},s=typeof r=="string"&&r.endsWith("px")?`--w-icon-size: ${r};`:"";return ce`<div class="${pe(a)}" style="${s}" part="w-${o.toLowerCase()}">${this.svg}</div>`}};g.styles=[P],d([F({type:String,reflect:!0})],g.prototype,"name",2),d([F({type:String,reflect:!0})],g.prototype,"size",2),d([F({type:String,reflect:!0,useDefault:!0})],g.prototype,"locale",2),d([be()],g.prototype,"svg",2);customElements.get("w-icon")||customElements.define("w-icon",g);var y=function(){for(var t=[],e=arguments.length;e--;)t[e]=arguments[e];return t.reduce(function(r,o){return r.concat(typeof o=="string"?o:Array.isArray(o)?y.apply(void 0,o):typeof o=="object"&&o?Object.keys(o).map(function(a){return o[a]?a:""}):"")},[]).join(" ")};var u=t=>typeof t=="string",he=t=>typeof t=="function",I=new Map,X="en";function $(t){return[...Array.isArray(t)?t:[t],X]}function Y(t,e,r){let o=$(t);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 _(()=>z("date",o,r),()=>new Intl.DateTimeFormat(o,a)).format(u(e)?new Date(e):e)}function me(t,e,r){let o;if(r||(r="default"),typeof r=="string")switch(o={second:"numeric",minute:"numeric",hour:"numeric"},r){case"full":case"long":o.timeZoneName="short";break;case"short":delete o.second}else o=r;return Y(t,e,o)}function T(t,e,r){let o=$(t);return _(()=>z("number",o,r),()=>new Intl.NumberFormat(o,r)).format(e)}function R(t,e,r,{offset:o=0,...a}){let s=$(t),i=e?_(()=>z("plural-ordinal",s),()=>new Intl.PluralRules(s,{type:"ordinal"})):_(()=>z("plural-cardinal",s),()=>new Intl.PluralRules(s,{type:"cardinal"}));return a[r]??a[i.select(r-o)]??a.other}function _(t,e){let r=t(),o=I.get(r);return o||(o=e(),I.set(r,o)),o}function z(t,e,r){let o=e.join("-");return`${t}-${o}-${JSON.stringify(r)}`}var Z=/\\u[a-fA-F0-9]{4}|\\x[a-fA-F0-9]{2}/,V=t=>t.replace(/\\u([a-fA-F0-9]{4})|\\x([a-fA-F0-9]{2})/g,(e,r,o)=>{if(r){let a=parseInt(r,16);return String.fromCharCode(a)}else{let a=parseInt(o,16);return String.fromCharCode(a)}}),G="%__lingui_octothorpe__%",ve=(t,e,r={})=>{let o=e||t,a=i=>typeof i=="object"?i:r[i],s=(i,n)=>{let l=Object.keys(r).length?a("number"):void 0,h=T(o,i,l);return n.replace(new RegExp(G,"g"),h)};return{plural:(i,n)=>{let{offset:l=0}=n,h=R(o,!1,i,n);return s(i-l,h)},selectordinal:(i,n)=>{let{offset:l=0}=n,h=R(o,!0,i,n);return s(i-l,h)},select:we,number:(i,n)=>T(o,i,a(n)||{style:n}),date:(i,n)=>Y(o,i,a(n)||n),time:(i,n)=>me(o,i,a(n)||n)}},we=(t,e)=>e[t]??e.other;function fe(t,e,r){return(o={},a)=>{let s=ve(e,r,a),i=(l,h=!1)=>Array.isArray(l)?l.reduce((f,x)=>{if(x==="#"&&h)return f+G;if(u(x))return f+x;let[N,m,D]=x,S={};m==="plural"||m==="selectordinal"||m==="select"?Object.entries(D).forEach(([C,ie])=>{S[C]=i(ie,m==="plural"||m==="selectordinal")}):S=D;let k;if(m){let C=s[m];k=C(o[N],S)}else k=o[N];return k==null?f:f+k},""):l,n=i(t);return u(n)&&Z.test(n)?V(n):u(n)?n:n?String(n):""}}var xe=Object.defineProperty,ke=(t,e,r)=>e in t?xe(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,ye=(t,e,r)=>(ke(t,typeof e!="symbol"?e+"":e,r),r),j=class{constructor(){ye(this,"_events",{})}on(e,r){var o;return(o=this._events)[e]??(o[e]=[]),this._events[e].push(r),()=>this.removeListener(e,r)}removeListener(e,r){let o=this._getListeners(e);if(!o)return;let a=o.indexOf(r);~a&&o.splice(a,1)}emit(e,...r){let o=this._getListeners(e);o&&o.map(a=>a.apply(this,r))}_getListeners(e){let r=this._events[e];return Array.isArray(r)?r:!1}},_e=Object.defineProperty,ze=(t,e,r)=>e in t?_e(t,e,{enumerable:!0,configurable:!0,writable:!0,value:r}):t[e]=r,v=(t,e,r)=>(ze(t,typeof e!="symbol"?e+"":e,r),r),O=class extends j{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??X,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 o=this._localeData[e];o?Object.assign(o,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(o=>this._loadLocaleData(o,e[o])),this.emit("change")}_load(e,r){let o=this._messages[e];o?Object.assign(o,r):this._messages[e]=r}load(e,r){typeof e=="string"&&typeof r=="object"?this._load(e,r):Object.entries(e).forEach(([o,a])=>this._load(o,a)),this.emit("change")}loadAndActivate({locale:e,locales:r,messages:o}){this._locale=e,this._locales=r||void 0,this._messages[this._locale]=o,this.emit("change")}activate(e,r){this._locale=e,this._locales=r,this.emit("change")}_(e,r,o){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=o?.message;e||(e=""),u(e)||(r=e.values||r,a=e.message,e=e.id);let s=this.messages[e],i=s===void 0,n=this._missing;if(n&&i)return he(n)?n(this._locale,e):n;i&&this.emit("missing",{id:e,locale:this._locale});let l=s||a||e;return u(l)&&(this._messageCompiler?l=this._messageCompiler(l):console.warn(`Uncompiled message detected! Message:
|
|
27
27
|
|
|
28
28
|
> ${l}
|
|
29
29
|
|
|
@@ -31,7 +31,7 @@ That means you use raw catalog or your catalog doesn't have a translation for th
|
|
|
31
31
|
ICU features such as interpolation and plurals will not work properly for that message.
|
|
32
32
|
|
|
33
33
|
Please compile your catalog first.
|
|
34
|
-
`)),u(l)&&Z.test(l)?V(l):u(l)?l:fe(l,this._locale,this._locales)(r,o?.formats)}date(e,r){return Y(this._locales||this._locale,e,r)}number(e,r){return
|
|
34
|
+
`)),u(l)&&Z.test(l)?V(l):u(l)?l:fe(l,this._locale,this._locales)(r,o?.formats)}date(e,r){return Y(this._locales||this._locale,e,r)}number(e,r){return T(this._locales||this._locale,e,r)}};function Le(t={}){return new O(t)}var b=Le();import{property as w}from"lit/decorators.js";var Ee=["en","nb","fi","da","sv"],A="en",L=t=>Ee.find(e=>t===e||t.toLowerCase().includes(e))||A;function E(){if(typeof window>"u"){let t=process.env.NMP_LANGUAGE||Intl.DateTimeFormat().resolvedOptions().locale;return L(t)}try{let t=J(document);if(t)return L(t);let e=Me();if(e)return L(e);let r=J(B());return r?L(r):A}catch(t){return console.warn("could not detect locale, falling back to source locale",t),A}}var U=(t,e,r,o,a)=>{b.load("en",t),b.load("nb",e),b.load("fi",r),b.load("da",o),b.load("sv",a);let s=E();b.activate(s),q(),Ce()},Se="warp-i18n-change";function q(){typeof window>"u"||window.dispatchEvent(new Event(Se))}var H=!1;function Ce(){if(H||typeof window>"u"||!document?.documentElement)return;H=!0;let t=()=>{let a=E();b.locale!==a&&(b.activate(a),q())},e=new MutationObserver(a=>{for(let s of a)if(s.type==="attributes"&&s.attributeName==="lang"){t();break}});e.observe(document.documentElement,{attributes:!0,attributeFilter:["lang"]});let r=B();r&&r.documentElement&&r!==document&&e.observe(r.documentElement,{attributes:!0,attributeFilter:["lang"]});let o=Fe();o&&e.observe(o,{attributes:!0,attributeFilter:["lang"]})}function B(){try{return window.parent?.document??null}catch{return null}}function J(t){try{return t?.documentElement?.lang??""}catch{return""}}function Fe(){try{return window.frameElement??null}catch{return null}}function Me(){try{return window.frameElement?.getAttribute?.("lang")??""}catch{return""}}import{css as Te}from"lit";import{unsafeCSS as je}from"lit";var K=Te`
|
|
35
35
|
*,
|
|
36
36
|
:before,
|
|
37
37
|
:after {
|
|
@@ -304,7 +304,7 @@ Please compile your catalog first.
|
|
|
304
304
|
svg {
|
|
305
305
|
pointer-events: none;
|
|
306
306
|
}
|
|
307
|
-
`,Qe=
|
|
307
|
+
`,Qe=je(`*, :before, :after {
|
|
308
308
|
--w-rotate: 0;
|
|
309
309
|
--w-rotate-x: 0;
|
|
310
310
|
--w-rotate-y: 0;
|
|
@@ -2470,7 +2470,7 @@ Please compile your catalog first.
|
|
|
2470
2470
|
display: none
|
|
2471
2471
|
}
|
|
2472
2472
|
}
|
|
2473
|
-
`);var Q=JSON.parse('{"pill.aria.openFilter":["\xC5bn filter"],"pill.aria.removeFilter":["Fjern filter ",["label"]]}');var W=JSON.parse('{"pill.aria.openFilter":["Open filter"],"pill.aria.removeFilter":["Remove filter ",["label"]]}');var ee=JSON.parse('{"pill.aria.openFilter":["Avaa suodatin"],"pill.aria.removeFilter":["Tyhjenn\xE4 suodatin ",["label"]]}');var re=JSON.parse('{"pill.aria.openFilter":["\xC5pne filter"],"pill.aria.removeFilter":["Fjern filter ",["label"]]}');var oe=JSON.parse('{"pill.aria.openFilter":["\xD6ppna filter"],"pill.aria.removeFilter":["Ta bort filtret ",["label"]]}');import{unsafeCSS as
|
|
2473
|
+
`);var Q=JSON.parse('{"pill.aria.openFilter":["\xC5bn filter"],"pill.aria.removeFilter":["Fjern filter ",["label"]]}');var W=JSON.parse('{"pill.aria.openFilter":["Open filter"],"pill.aria.removeFilter":["Remove filter ",["label"]]}');var ee=JSON.parse('{"pill.aria.openFilter":["Avaa suodatin"],"pill.aria.removeFilter":["Tyhjenn\xE4 suodatin ",["label"]]}');var re=JSON.parse('{"pill.aria.openFilter":["\xC5pne filter"],"pill.aria.removeFilter":["Fjern filter ",["label"]]}');var oe=JSON.parse('{"pill.aria.openFilter":["\xD6ppna filter"],"pill.aria.removeFilter":["Ta bort filtret ",["label"]]}');import{unsafeCSS as Oe}from"lit";var te=Oe("*,: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}.bg-\\[--w-color-pill-suggestion-background\\]{background-color:var(--w-color-pill-suggestion-background)}.hover\\:bg-\\[--w-color-pill-suggestion-background-hover\\]:hover{background-color:var(--w-color-pill-suggestion-background-hover)}.active\\:bg-\\[--w-color-pill-suggestion-background-active\\]:active{background-color:var(--w-color-pill-suggestion-background-active)}.rounded{border-radius:4px}.rounded-l-full{border-top-left-radius:9999px;border-bottom-left-radius:9999px}.rounded-r-full{border-top-right-radius:9999px;border-bottom-right-radius:9999px}.flex{display:flex}.inline-flex{display:inline-flex}.focusable:focus{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:focus-visible{outline:2px solid var(--w-s-color-border-focus);outline-offset:var(--w-outline-offset,1px)}.focusable:not(:focus-visible){outline:none}.items-center{align-items:center}.static{position:static}.s-bg-primary{background-color:var(--w-s-color-background-primary)}.hover\\:s-bg-primary-hover:hover{background-color:var(--w-s-color-background-primary-hover)}.active\\:s-bg-primary-active:active{background-color:var(--w-s-color-background-primary-active)}.s-text{color:var(--w-s-color-text)}.s-text-inverted{color:var(--w-s-color-text-inverted)}.h-16{height:1.6rem}.py-8{padding-top:.8rem;padding-bottom:.8rem}.pl-12{padding-left:1.2rem}.pl-4{padding-left:.4rem}.pr-12{padding-right:1.2rem}.pr-2{padding-right:.2rem}.font-bold{font-weight:700}.sr-only{clip:rect(0,0,0,0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.transition-all{transition-property:all;transition-duration:.15s;transition-timing-function:cubic-bezier(.4,0,.2,1)}.text-xs{font-size:var(--w-font-size-xs);line-height:var(--w-line-height-xs)}");var c={wrapper:"flex items-center",button:"inline-flex items-center focusable text-xs transition-all",suggestion:"bg-[--w-color-pill-suggestion-background] hover:bg-[--w-color-pill-suggestion-background-hover] active:bg-[--w-color-pill-suggestion-background-active] s-text font-bold",filter:"s-bg-primary hover:s-bg-primary-hover active:s-bg-primary-active s-text-inverted",label:"pl-12 py-8 rounded-l-full",labelWithoutClose:"pr-12 rounded-r-full",labelWithClose:"pr-2",close:"pr-12 pl-4 py-8 rounded-r-full",closeIcon:"h-16",a11y:"sr-only"},p=class extends $e{constructor(){super();this.canClose=!1;this.suggestion=!1;U(W,re,ee,Q,oe),this.canClose=!1,this.suggestion=!1,this.openFilterSrText=b._({id:"pill.aria.openFilter",message:"Open filter",comment:"Fallback screen reader message for open filter"}),this.removeFilterSrText=b._({id:"pill.aria.removeFilter",message:"Remove filter {label}",comment:"Fallback screen reader message for removal of the filter"})}get _labelClasses(){return y([c.button,c.label,this.suggestion?c.suggestion:c.filter,this.canClose?c.labelWithClose:c.labelWithoutClose])}get _closeClasses(){return y([c.button,c.close,this.suggestion?c.suggestion:c.filter])}_onClick(){this.dispatchEvent(new CustomEvent("w-pill-click",{bubbles:!0,composed:!0}))}_onClose(){this.dispatchEvent(new CustomEvent("w-pill-close",{bubbles:!0,composed:!0}))}connectedCallback(){super.connectedCallback(),this.openSrLabel&&(this.openAriaLabel=this.openSrLabel),this.closeSrLabel&&(this.closeAriaLabel=this.closeSrLabel)}render(){return ae`
|
|
2474
2474
|
<div class="${c.wrapper}">
|
|
2475
2475
|
<button type="button" class="${this._labelClasses}" @click="${this._onClick}">
|
|
2476
2476
|
<span class="${c.a11y}">${this.openAriaLabel?this.openAriaLabel:this.openFilterSrText}</span>
|