@cupra/ui-kit 2.0.0-canary.62 → 2.0.0-canary.64

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.
Files changed (104) hide show
  1. package/dist/cjs/components/ds-accordion/ds-accordion.cjs +6 -6
  2. package/dist/cjs/components/ds-button/ds-button.cjs +43 -38
  3. package/dist/cjs/components/ds-button/styles/common.styles.cjs +41 -3
  4. package/dist/cjs/components/ds-chips/styles/common.styles.cjs +9 -2
  5. package/dist/cjs/components/ds-select/ds-select.cjs +4 -3
  6. package/dist/cjs/components/ds-slider/ds-slider.cjs +18 -18
  7. package/dist/cjs/components/ds-text-input/ds-text-input.cjs +3 -2
  8. package/dist/cjs/components/ds-textarea/ds-textarea.cjs +4 -3
  9. package/dist/cjs/components/ds-theme-provider/ds-theme-provider.cjs +1 -1
  10. package/dist/cjs/mixins/inputStatesMixin.cjs +1 -1
  11. package/dist/cjs/node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directive-helpers.cjs +2 -2
  12. package/dist/cjs/node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directive.cjs +1 -1
  13. package/dist/cjs/node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/live.cjs +5 -0
  14. package/dist/cjs/utils/IconsManager.cjs +1 -1
  15. package/dist/cjs/utils/PubSub.cjs +1 -1
  16. package/dist/cjs/utils/StylesRegistry/StylesRegistry.cjs +1 -1
  17. package/dist/cjs/utils/concurrencyLimit.cjs +1 -0
  18. package/dist/cjs/utils/cssWithTokens.cjs +1 -1
  19. package/dist/cjs/utils/htmlWithTokens.cjs +1 -1
  20. package/dist/esm/components/ds-accordion/ds-accordion.js +4 -4
  21. package/dist/esm/components/ds-button/ds-button.js +90 -79
  22. package/dist/esm/components/ds-button/styles/common.styles.js +42 -4
  23. package/dist/esm/components/ds-chips/styles/common.styles.js +7 -0
  24. package/dist/esm/components/ds-select/ds-select.js +38 -32
  25. package/dist/esm/components/ds-slider/ds-slider.js +84 -67
  26. package/dist/esm/components/ds-text-input/ds-text-input.js +38 -30
  27. package/dist/esm/components/ds-textarea/ds-textarea.js +45 -37
  28. package/dist/esm/components/ds-theme-provider/ds-theme-provider.js +1 -1
  29. package/dist/esm/mixins/inputStatesMixin.js +4 -3
  30. package/dist/esm/node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directive-helpers.js +17 -16
  31. package/dist/esm/node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directive.js +4 -4
  32. package/dist/esm/node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/live.js +30 -0
  33. package/dist/esm/utils/IconsManager.js +1 -1
  34. package/dist/esm/utils/PubSub.js +1 -1
  35. package/dist/esm/utils/StylesRegistry/StylesRegistry.js +8 -6
  36. package/dist/esm/utils/concurrencyLimit.js +32 -0
  37. package/dist/esm/utils/cssWithTokens.js +1 -1
  38. package/dist/esm/utils/htmlWithTokens.js +1 -1
  39. package/dist/types/components/ds-accordion/ds-accordion.d.ts +1 -1
  40. package/dist/types/components/ds-button/ds-button.d.ts +2 -0
  41. package/dist/types/components/ds-button/ds-button.types.d.ts +1 -0
  42. package/dist/types/components/ds-select/ds-select.d.ts +2 -0
  43. package/dist/types/components/ds-select/ds-select.types.d.ts +1 -0
  44. package/dist/types/components/ds-slider/ds-slider.d.ts +7 -2
  45. package/dist/types/components/ds-slider/ds-slider.types.d.ts +18 -3
  46. package/dist/types/components/ds-text-input/ds-text-input.d.ts +2 -0
  47. package/dist/types/components/ds-text-input/ds-text-input.types.d.ts +1 -0
  48. package/dist/types/components/ds-textarea/ds-textarea.d.ts +2 -0
  49. package/dist/types/components/ds-textarea/ds-textarea.types.d.ts +1 -0
  50. package/dist/types/mixins/inputStatesMixin.d.ts +1 -0
  51. package/dist/types/utils/concurrencyLimit.d.ts +4 -0
  52. package/dist/types/utils/concurrencyLimit.test.d.ts +1 -0
  53. package/dist-react/cjs/components/ds-accordion/ds-accordion.cjs +6 -6
  54. package/dist-react/cjs/components/ds-button/ds-button.cjs +43 -38
  55. package/dist-react/cjs/components/ds-button/styles/common.styles.cjs +41 -3
  56. package/dist-react/cjs/components/ds-chips/styles/common.styles.cjs +9 -2
  57. package/dist-react/cjs/components/ds-select/ds-select.cjs +4 -3
  58. package/dist-react/cjs/components/ds-slider/ds-slider.cjs +18 -18
  59. package/dist-react/cjs/components/ds-text-input/ds-text-input.cjs +3 -2
  60. package/dist-react/cjs/components/ds-textarea/ds-textarea.cjs +4 -3
  61. package/dist-react/cjs/components/ds-theme-provider/ds-theme-provider.cjs +1 -1
  62. package/dist-react/cjs/mixins/inputStatesMixin.cjs +1 -1
  63. package/dist-react/cjs/node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directive-helpers.cjs +2 -2
  64. package/dist-react/cjs/node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directive.cjs +1 -1
  65. package/dist-react/cjs/node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/live.cjs +5 -0
  66. package/dist-react/cjs/utils/IconsManager.cjs +1 -1
  67. package/dist-react/cjs/utils/PubSub.cjs +1 -1
  68. package/dist-react/cjs/utils/StylesRegistry/StylesRegistry.cjs +1 -1
  69. package/dist-react/cjs/utils/concurrencyLimit.cjs +1 -0
  70. package/dist-react/cjs/utils/cssWithTokens.cjs +1 -1
  71. package/dist-react/cjs/utils/htmlWithTokens.cjs +1 -1
  72. package/dist-react/esm/components/ds-accordion/ds-accordion.js +4 -4
  73. package/dist-react/esm/components/ds-button/ds-button.js +90 -79
  74. package/dist-react/esm/components/ds-button/styles/common.styles.js +42 -4
  75. package/dist-react/esm/components/ds-chips/styles/common.styles.js +7 -0
  76. package/dist-react/esm/components/ds-select/ds-select.js +38 -32
  77. package/dist-react/esm/components/ds-slider/ds-slider.js +84 -67
  78. package/dist-react/esm/components/ds-text-input/ds-text-input.js +38 -30
  79. package/dist-react/esm/components/ds-textarea/ds-textarea.js +45 -37
  80. package/dist-react/esm/components/ds-theme-provider/ds-theme-provider.js +1 -1
  81. package/dist-react/esm/mixins/inputStatesMixin.js +4 -3
  82. package/dist-react/esm/node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directive-helpers.js +17 -16
  83. package/dist-react/esm/node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directive.js +4 -4
  84. package/dist-react/esm/node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/live.js +30 -0
  85. package/dist-react/esm/utils/IconsManager.js +1 -1
  86. package/dist-react/esm/utils/PubSub.js +1 -1
  87. package/dist-react/esm/utils/StylesRegistry/StylesRegistry.js +8 -6
  88. package/dist-react/esm/utils/concurrencyLimit.js +32 -0
  89. package/dist-react/esm/utils/cssWithTokens.js +1 -1
  90. package/dist-react/esm/utils/htmlWithTokens.js +1 -1
  91. package/dist-react/types/components/ds-accordion/ds-accordion.d.ts +1 -1
  92. package/dist-react/types/components/ds-button/ds-button.d.ts +2 -0
  93. package/dist-react/types/components/ds-button/ds-button.types.d.ts +1 -0
  94. package/dist-react/types/components/ds-select/ds-select.d.ts +2 -0
  95. package/dist-react/types/components/ds-select/ds-select.types.d.ts +1 -0
  96. package/dist-react/types/components/ds-slider/ds-slider.d.ts +7 -2
  97. package/dist-react/types/components/ds-slider/ds-slider.types.d.ts +18 -3
  98. package/dist-react/types/components/ds-text-input/ds-text-input.d.ts +2 -0
  99. package/dist-react/types/components/ds-text-input/ds-text-input.types.d.ts +1 -0
  100. package/dist-react/types/components/ds-textarea/ds-textarea.d.ts +2 -0
  101. package/dist-react/types/components/ds-textarea/ds-textarea.types.d.ts +1 -0
  102. package/dist-react/types/mixins/inputStatesMixin.d.ts +1 -0
  103. package/dist-react/types/utils/concurrencyLimit.d.ts +4 -0
  104. package/package.json +1 -1
@@ -1,15 +1,15 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("../base/UiKitElement.cjs"),u=require("./styles/common.styles.cjs"),p=require("./theme-config.cjs"),y=require("../../decorators/customUiKitElement.cjs"),h=require("../../utils/booleanConverter.cjs"),g=require("../../utils/htmlWithTokens.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const a=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const i=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),f=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.cjs"),d=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs");var v=Object.defineProperty,b=Object.getOwnPropertyDescriptor,s=(n,e,t,r)=>{for(var o=r>1?void 0:r?b(e,t):e,c=n.length-1,l;c>=0;c--)(l=n[c])&&(o=(r?l(e,t,o):l(o))||o);return r&&o&&v(e,t,o),o};exports.DsAccordion=class extends m.UiKitElement{constructor(){super(...arguments),this.maxHeight=300,this.open=!1,this.mode="light",this.size="medium",this.disabled=!1,this._open=!1}async firstUpdated(e){super.firstUpdated(e),await this.updateComplete,this._open=this.open}get containerClasses(){return{container:!0,disabled:this.disabled,open:this._open,[this.size]:!0,[this.mode]:!!this.mode}}get dividerClasses(){return{divider:!0,[this.mode]:!!this.mode}}get openIconTemplate(){var t;if(!this.theme)return a.nothing;const e=(t=p.themeConfig[this.theme])==null?void 0:t["icon-names"];return this.componentFactory.createIcon({class:"icon open-icon",role:"image","aria-hidden":"true","icon-name":(e==null?void 0:e.open)||"minus"})}get closeIconTemplate(){var t;if(!this.theme)return a.nothing;const e=(t=p.themeConfig[this.theme])==null?void 0:t["icon-names"];return this.componentFactory.createIcon({class:"icon close-icon",role:"image","aria-hidden":"true","icon-name":(e==null?void 0:e.close)||"plus"})}get styleTokens(){return g.htmlWithTokens`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("../base/UiKitElement.cjs"),u=require("./styles/common.styles.cjs"),p=require("./theme-config.cjs"),y=require("../../decorators/customUiKitElement.cjs"),d=require("../../utils/booleanConverter.cjs"),g=require("../../utils/htmlWithTokens.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const a=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const i=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),f=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.cjs"),h=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs");var v=Object.defineProperty,b=Object.getOwnPropertyDescriptor,s=(n,e,t,r)=>{for(var o=r>1?void 0:r?b(e,t):e,c=n.length-1,l;c>=0;c--)(l=n[c])&&(o=(r?l(e,t,o):l(o))||o);return r&&o&&v(e,t,o),o};exports.DsAccordion=class extends m.UiKitElement{constructor(){super(...arguments),this.maxHeight=300,this.open=!1,this.mode="light",this.size="medium",this.disabled=!1,this._open=!1}willUpdate(e){super.willUpdate(e),e.has("open")&&(this._open=this.open)}get containerClasses(){return{container:!0,disabled:this.disabled,open:this._open,[this.size]:!0,[this.mode]:!!this.mode}}get dividerClasses(){return{divider:!0,[this.mode]:!!this.mode}}get openIconTemplate(){var t;if(!this.theme)return a.nothing;const e=(t=p.themeConfig[this.theme])==null?void 0:t["icon-names"];return this.componentFactory.createIcon({class:"icon open-icon",role:"image","aria-hidden":"true","icon-name":(e==null?void 0:e.open)||"minus"})}get closeIconTemplate(){var t;if(!this.theme)return a.nothing;const e=(t=p.themeConfig[this.theme])==null?void 0:t["icon-names"];return this.componentFactory.createIcon({class:"icon close-icon",role:"image","aria-hidden":"true","icon-name":(e==null?void 0:e.close)||"plus"})}get styleTokens(){return g.htmlWithTokens`
2
2
  <style>
3
3
  :host{
4
4
  color-scheme: ${this.mode};
5
- pointer-events: ${this.disabled?"none":"visible"};
5
+ pointer-events: ${this.disabled?"none":"auto"};
6
6
  }
7
7
  </style>
8
- `}handleKeyDown(e){this.disabled&&e.preventDefault()}handleToggle(e){this._open=e.newState==="open"}render(){return a.html`
8
+ `}handleKeyDown(e){this.disabled&&(e.preventDefault(),e.stopPropagation())}handleToggle(e){this._open=e.newState==="open"}render(){return a.html`
9
9
  ${this.styleTokens}
10
10
 
11
11
  <details
12
- class=${d.classMap(this.containerClasses)}
12
+ class=${h.classMap(this.containerClasses)}
13
13
  aria-disabled=${!!this.disabled}
14
14
  ?open=${this.open}
15
15
  @keydown=${this.handleKeyDown}
@@ -22,5 +22,5 @@
22
22
  </summary>
23
23
  <slot name="content"></slot>
24
24
  </details>
25
- <div class=${d.classMap(this.dividerClasses)}></div>
26
- `}};exports.DsAccordion.styles=[u.commonStyles];s([i.property({type:Number,attribute:"max-height"})],exports.DsAccordion.prototype,"maxHeight",2);s([i.property({type:Boolean,converter:h.booleanConverter,reflect:!0})],exports.DsAccordion.prototype,"open",2);s([i.property({type:String,reflect:!0})],exports.DsAccordion.prototype,"mode",2);s([i.property({type:String})],exports.DsAccordion.prototype,"size",2);s([i.property({type:Boolean,converter:h.booleanConverter})],exports.DsAccordion.prototype,"disabled",2);s([f.state()],exports.DsAccordion.prototype,"_open",2);exports.DsAccordion=s([y.customUiKitElement("ds-accordion")],exports.DsAccordion);
25
+ <div class=${h.classMap(this.dividerClasses)}></div>
26
+ `}};exports.DsAccordion.styles=[u.commonStyles];s([i.property({type:Number,attribute:"max-height"})],exports.DsAccordion.prototype,"maxHeight",2);s([i.property({type:Boolean,converter:d.booleanConverter,reflect:!0})],exports.DsAccordion.prototype,"open",2);s([i.property({type:String,reflect:!0})],exports.DsAccordion.prototype,"mode",2);s([i.property({type:String})],exports.DsAccordion.prototype,"size",2);s([i.property({type:Boolean,converter:d.booleanConverter})],exports.DsAccordion.prototype,"disabled",2);s([f.state()],exports.DsAccordion.prototype,"_open",2);exports.DsAccordion=s([y.customUiKitElement("ds-accordion")],exports.DsAccordion);
@@ -1,10 +1,10 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("../base/UiKitElement.cjs"),y=require("../../decorators/customUiKitElement.cjs"),b=require("../../mixins/ViewportMixin.cjs"),n=require("../../utils/booleanConverter.cjs"),g=require("../../utils/htmlWithTokens.cjs"),v=require("../../utils/objectConverter.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const o=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const s=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),f=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.cjs"),$=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/choose.cjs"),u=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),a=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/when.cjs"),d=require("./styles/common.styles.cjs");var B=Object.defineProperty,D=Object.getOwnPropertyDescriptor,t=(p,e,r,l)=>{for(var i=l>1?void 0:l?D(e,r):e,h=p.length-1,c;h>=0;h--)(c=p[h])&&(i=(l?c(e,r,i):c(i))||i);return l&&i&&B(e,r,i),i};exports.DsButton=class extends b.ViewportMixin(m.UiKitElement){constructor(){super(...arguments),this.variant="primary",this.mode="light",this.size="large",this.disabled=!1,this.destructive=!1,this.htmlTagName="button",this.type="button",this.iconPosition="left",this.rounded=!1,this.fullWidth=!1,this.loading=!1}firstUpdated(){this.closestForm=this.closest("form")}get classes(){const e=typeof this.size=="string"?this.size:this.size[this.viewport];return{button:!0,custom:this.htmlTagName==="custom",[e]:!!e,[this.mode]:!!this.mode,[this.variant]:!!this.variant,rounded:this.rounded,disabled:this.disabled||this.loading,destructive:this.destructive,"full-width":this.fullWidth}}handleClick(e){if(this.href||e.preventDefault(),this.closestForm&&this.type==="submit"){const r=new Event("submit",{bubbles:!0,composed:!0,cancelable:!0});this.closestForm.dispatchEvent(r)}}get iconTemplate(){return this.iconName?this.componentFactory.createIcon({class:"icon","icon-name":this.iconName}):o.nothing}get loadingTemplate(){return this.loading?o.html`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("../base/UiKitElement.cjs"),y=require("../../decorators/customUiKitElement.cjs"),g=require("../../mixins/ViewportMixin.cjs"),l=require("../../utils/booleanConverter.cjs"),b=require("../../utils/htmlWithTokens.cjs"),v=require("../../utils/objectConverter.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const e=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const s=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),$=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.cjs"),f=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/choose.cjs"),u=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),n=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/when.cjs"),m=require("./styles/common.styles.cjs");var B=Object.defineProperty,D=Object.getOwnPropertyDescriptor,t=(p,o,r,a)=>{for(var i=a>1?void 0:a?D(o,r):o,h=p.length-1,c;h>=0;h--)(c=p[h])&&(i=(a?c(o,r,i):c(i))||i);return a&&i&&B(o,r,i),i};exports.DsButton=class extends g.ViewportMixin(d.UiKitElement){constructor(){super(...arguments),this.variant="primary",this.mode="light",this.size="large",this.disabled=!1,this.destructive=!1,this.htmlTagName="button",this.type="button",this.iconPosition="left",this.rounded=!1,this.fullWidth=!1,this.loading=!1}firstUpdated(){this.closestForm=this.closest("form")}get classes(){const o=typeof this.size=="string"?this.size:this.size[this.viewport];return{button:!0,custom:this.htmlTagName==="custom",[o]:!!o,[this.mode]:!!this.mode,[this.variant]:!!this.variant,rounded:this.rounded,disabled:this.disabled||this.loading,destructive:this.destructive,"full-width":this.fullWidth}}handleClick(o){if(this.href||o.preventDefault(),this.closestForm&&this.type==="submit"){const r=new Event("submit",{bubbles:!0,composed:!0,cancelable:!0});this.closestForm.dispatchEvent(r)}}get iconTemplate(){return this.iconName?this.componentFactory.createIcon({class:"icon","icon-name":this.iconName}):e.nothing}get loadingTemplate(){return this.loading?e.html`
2
2
  <span class="loading-dots">
3
3
  <span>.</span>
4
4
  <span>.</span>
5
5
  <span>.</span>
6
6
  </span>
7
- `:o.nothing}get cssTokens(){return g.htmlWithTokens`
7
+ `:e.nothing}get contentTemplate(){return this.loading&&this.textLoading?e.html`${this.textLoading}`:e.html`<slot></slot>`}get cssTokens(){return b.htmlWithTokens`
8
8
  <style>
9
9
  :host{
10
10
  color-scheme: ${this.mode};
@@ -14,43 +14,48 @@
14
14
  :host:has(::slotted(*:disabled)){
15
15
  pointer-events: none;
16
16
  }
17
- </style>`}render(){return o.html`
17
+ </style>`}render(){return e.html`
18
18
  ${this.cssTokens}
19
- ${$.choose(this.htmlTagName||"button",[["button",()=>{var e;return o.html`
20
- <button
21
- aria-label=${(e=this.textContent)==null?void 0:e.replace(/^\s+|\s+$/g,"")}
22
- class=${u.classMap(this.classes)}
23
- type=${this.type}
24
- @click=${this.handleClick}
25
- ?disabled=${this.disabled}
26
- >
27
- ${a.when(this.iconPosition==="left",()=>o.html` ${this.iconTemplate} `)}
28
- <span class="container">
29
- <slot></slot>
30
- ${this.loadingTemplate}
31
- </span>
32
- ${a.when(this.iconPosition==="right",()=>o.html` ${this.iconTemplate} `)}
33
- </button>
34
- `}],["a",()=>{var e;return o.html`
35
- <a
36
- aria-label=${(e=this.textContent)==null?void 0:e.replace(/^\s+|\s+$/g,"")}
37
- class=${u.classMap(this.classes)}
38
- href=${this.href}
39
- rel=${this.rel}
40
- target=${this.target}
41
- @click=${this.handleClick}
42
- ?disabled=${this.disabled}
43
- >
44
- ${a.when(this.iconPosition==="left",()=>o.html`${this.iconTemplate}`)}
45
- <span class="container">
46
- <slot></slot>
47
- ${this.loadingTemplate}
48
- </span>
49
- ${a.when(this.iconPosition==="right",()=>o.html`${this.iconTemplate}`)}
50
- </a>
51
- `}],["custom",()=>o.html`
19
+ ${f.choose(this.htmlTagName||"button",[["button",()=>{var o;return e.html`
52
20
  <div class=${u.classMap(this.classes)}>
53
- <slot></slot>
21
+ <button
22
+ class="inner"
23
+ aria-label=${(o=this.textContent)==null?void 0:o.replace(/^\s+|\s+$/g,"")}
24
+ type=${this.type}
25
+ @click=${this.handleClick}
26
+ ?disabled=${this.disabled}
27
+ >
28
+ ${n.when(this.iconPosition==="left",()=>e.html` ${this.iconTemplate} `)}
29
+ <span class="container">
30
+ ${this.contentTemplate}
31
+ ${this.loadingTemplate}
32
+ </span>
33
+ ${n.when(this.iconPosition==="right",()=>e.html` ${this.iconTemplate} `)}
34
+ </button>
35
+ </div>
36
+ `}],["a",()=>{var o;return e.html`
37
+ <div class=${u.classMap(this.classes)}>
38
+ <a
39
+ class="inner"
40
+ aria-label=${(o=this.textContent)==null?void 0:o.replace(/^\s+|\s+$/g,"")}
41
+ href=${this.href}
42
+ rel=${this.rel}
43
+ target=${this.target}
44
+ @click=${this.handleClick}
45
+ >
46
+ ${n.when(this.iconPosition==="left",()=>e.html`${this.iconTemplate}`)}
47
+ <span class="container">
48
+ ${this.contentTemplate}
49
+ ${this.loadingTemplate}
50
+ </span>
51
+ ${n.when(this.iconPosition==="right",()=>e.html`${this.iconTemplate}`)}
52
+ </a>
53
+ </div>
54
+ `}],["custom",()=>e.html`
55
+ <div class=${u.classMap(this.classes)}>
56
+ ${n.when(this.iconPosition==="left",()=>e.html`${this.iconTemplate}`)}
57
+ ${this.loading&&this.textLoading?e.html`<span class="container">${this.textLoading}${this.loadingTemplate}</span>`:e.html`<slot></slot>${this.loadingTemplate}`}
58
+ ${n.when(this.iconPosition==="right",()=>e.html`${this.iconTemplate}`)}
54
59
  </div>
55
60
  `]])}
56
- `}};exports.DsButton.styles=[d.buttonStyles,d.textStyles,d.loadingDotsStyles];t([s.property({type:String})],exports.DsButton.prototype,"variant",2);t([s.property({type:String,reflect:!0})],exports.DsButton.prototype,"mode",2);t([s.property({type:String,converter:v.objectConverter})],exports.DsButton.prototype,"size",2);t([s.property({type:Boolean,converter:n.booleanConverter})],exports.DsButton.prototype,"disabled",2);t([s.property({type:Boolean,converter:n.booleanConverter})],exports.DsButton.prototype,"destructive",2);t([s.property({type:String,attribute:"icon-name"})],exports.DsButton.prototype,"iconName",2);t([s.property({type:String,attribute:"html-tag-name"})],exports.DsButton.prototype,"htmlTagName",2);t([s.property({type:String,reflect:!0})],exports.DsButton.prototype,"href",2);t([s.property({type:String,reflect:!0})],exports.DsButton.prototype,"rel",2);t([s.property({type:String,reflect:!0})],exports.DsButton.prototype,"target",2);t([s.property({type:String})],exports.DsButton.prototype,"type",2);t([s.property({type:String,attribute:"icon-position"})],exports.DsButton.prototype,"iconPosition",2);t([s.property({type:Boolean,converter:n.booleanConverter})],exports.DsButton.prototype,"rounded",2);t([s.property({type:Boolean,converter:n.booleanConverter,attribute:"full-width"})],exports.DsButton.prototype,"fullWidth",2);t([s.property({type:Boolean,converter:n.booleanConverter})],exports.DsButton.prototype,"loading",2);t([f.state()],exports.DsButton.prototype,"closestForm",2);exports.DsButton=t([y.customUiKitElement("ds-button")],exports.DsButton);
61
+ `}};exports.DsButton.styles=[m.buttonStyles,m.textStyles,m.loadingDotsStyles];t([s.property({type:String})],exports.DsButton.prototype,"variant",2);t([s.property({type:String,reflect:!0})],exports.DsButton.prototype,"mode",2);t([s.property({type:String,converter:v.objectConverter})],exports.DsButton.prototype,"size",2);t([s.property({type:Boolean,converter:l.booleanConverter})],exports.DsButton.prototype,"disabled",2);t([s.property({type:Boolean,converter:l.booleanConverter})],exports.DsButton.prototype,"destructive",2);t([s.property({type:String,attribute:"icon-name"})],exports.DsButton.prototype,"iconName",2);t([s.property({type:String,attribute:"html-tag-name"})],exports.DsButton.prototype,"htmlTagName",2);t([s.property({type:String,reflect:!0})],exports.DsButton.prototype,"href",2);t([s.property({type:String,reflect:!0})],exports.DsButton.prototype,"rel",2);t([s.property({type:String,reflect:!0})],exports.DsButton.prototype,"target",2);t([s.property({type:String})],exports.DsButton.prototype,"type",2);t([s.property({type:String,attribute:"icon-position"})],exports.DsButton.prototype,"iconPosition",2);t([s.property({type:Boolean,converter:l.booleanConverter})],exports.DsButton.prototype,"rounded",2);t([s.property({type:Boolean,converter:l.booleanConverter,attribute:"full-width"})],exports.DsButton.prototype,"fullWidth",2);t([s.property({type:Boolean,converter:l.booleanConverter})],exports.DsButton.prototype,"loading",2);t([s.property({type:String,attribute:"text-loading"})],exports.DsButton.prototype,"textLoading",2);t([$.state()],exports.DsButton.prototype,"closestForm",2);exports.DsButton=t([y.customUiKitElement("ds-button")],exports.DsButton);
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");require("../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const t=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs"),i=t.css`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");require("../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const t=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs"),e=t.css`
2
2
  :host {
3
3
  display: contents;
4
4
  }
@@ -18,7 +18,45 @@
18
18
  .button.full-width {
19
19
  width: 100%;
20
20
  }
21
- `,o=t.css`
21
+
22
+ .inner,
23
+ .custom ::slotted(*) {
24
+ display: inline-flex;
25
+ align-items: center;
26
+ justify-content: center;
27
+ width: 100%;
28
+ height: 100%;
29
+ gap: var(--ui-kit-button-gap, 0);
30
+ padding: 0;
31
+ margin: 0;
32
+ background: transparent;
33
+ border: none;
34
+ color: inherit;
35
+ font: inherit;
36
+ text-transform: inherit;
37
+ letter-spacing: inherit;
38
+ text-decoration: none;
39
+ cursor: inherit;
40
+ outline: none;
41
+ box-sizing: border-box;
42
+ }
43
+
44
+ .custom ::slotted(*) {
45
+ width: auto;
46
+ flex: 1;
47
+ min-width: 0;
48
+ }
49
+
50
+ .custom ::slotted(*:disabled),
51
+ .custom.disabled ::slotted(*) {
52
+ pointer-events: none;
53
+ cursor: default;
54
+ }
55
+
56
+ .custom ::slotted(*:focus-visible) {
57
+ outline: none;
58
+ }
59
+ `,i=t.css`
22
60
  .naked.container {
23
61
  display: inline-flex;
24
62
  }
@@ -104,4 +142,4 @@
104
142
  opacity: 1;
105
143
  }
106
144
  }
107
- `;exports.buttonStyles=i;exports.loadingDotsStyles=n;exports.textStyles=o;
145
+ `;exports.buttonStyles=e;exports.loadingDotsStyles=n;exports.textStyles=i;
@@ -1,4 +1,4 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");require("../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const t=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs"),e=t.css`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");require("../../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const o=require("../../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/css-tag.cjs"),t=o.css`
2
2
  .container {
3
3
  display: inline-flex;
4
4
  position: relative;
@@ -37,11 +37,18 @@
37
37
  }
38
38
 
39
39
  .scroll-button {
40
+ display: none;
40
41
  position: absolute;
41
42
  top: 0;
42
43
  z-index: 2;
43
44
  }
44
45
 
46
+ @media (min-width: 768px) {
47
+ .scroll-button {
48
+ display: block;
49
+ }
50
+ }
51
+
45
52
  .scroll-button.left {
46
53
  left: 0;
47
54
  }
@@ -49,4 +56,4 @@
49
56
  .scroll-button.right {
50
57
  right: 0;
51
58
  }
52
- `;exports.commonStyles=e;
59
+ `;exports.commonStyles=t;
@@ -1,13 +1,14 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const m=require("../base/UiKitElement.cjs"),y=require("../../decorators/customUiKitElement.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const r=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const h=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),o=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.cjs"),b=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/query.cjs"),p=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/query-assigned-elements.cjs"),u=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),S=require("./controllers/SelectKeyboardController.cjs"),O=require("./styles/common.styles.cjs");var f=Object.defineProperty,g=Object.getOwnPropertyDescriptor,n=(c,e,t,i)=>{for(var s=i>1?void 0:i?g(e,t):e,a=c.length-1,l;a>=0;a--)(l=c[a])&&(s=(i?l(e,t,s):l(s))||s);return i&&s&&f(e,t,s),s};exports.DsSelect=class extends m.UiKitElement{constructor(){super(...arguments),this.mode="light",this.size="medium",this.variant="primary",this._open=!1,this.nativeSelect=null,this.nativeLabel=null,this.nativeOptions=[],this.activeIndex=-1,this.hasForcedError=!1,this.handleMutations=e=>{e.forEach(t=>{t.type==="childList"&&this.syncNativeOptions()}),this.requestUpdate()},this.syncNativeOptions=()=>{this.nativeOptions=Array.from(this.nativeSelect.options)},this.handleOpen=()=>{this._open=!0,this.activeIndex=this.findSelectedOptionIndex(),this.focusDisplaySelect()},this.handleClose=()=>{this._open=!1},this.handleClickDisplaySelect=()=>{this._open?this.handleClose():this.handleOpen()},this.handleKeydown=e=>{this._open?S.SelectKeyboardController.handleKeydownWhenOpen(e,{commit:()=>this.commitSelection(),navigateNext:()=>this.advanceSelection(1),navigatePrev:()=>this.advanceSelection(-1),navigateFirst:()=>this.advanceToFirst(),navigateLast:()=>this.advanceToLast(),close:this.handleClose}):S.SelectKeyboardController.handleKeydownWhenClosed(e,{open:this.handleOpen})}}firstUpdated(){this.initializeNativeSelect()}disconnectedCallback(){super.disconnectedCallback(),this.cleanup()}initializeNativeSelect(){var e,t;this.nativeSelect=(e=this.nativeSelects)==null?void 0:e[0],this.nativeLabel=(t=this.nativeLabels)==null?void 0:t[0],this.nativeSelect&&(this.syncNativeOptions(),this.setupNativeElementsAttributes(),this.setupEventListeners())}handleChangeForcedError(){var e;this.hasForcedError=((e=this.forcedError)==null?void 0:e.length)>0}setupNativeElementsAttributes(){this.nativeSelect.setAttribute("aria-hidden","true"),this.nativeSelect.setAttribute("tabindex","-1")}setupEventListeners(){this.nativeSelect.addEventListener("change",this.syncNativeOptions),this.observer=new MutationObserver(this.handleMutations),this.observer.observe(this.nativeSelect,{childList:!0,subtree:!0,attributes:!0})}cleanup(){var e,t;(e=this.nativeSelect)==null||e.removeEventListener("change",this.syncNativeOptions),(t=this.observer)==null||t.disconnect()}findSelectedOptionIndex(){var t;const e=this.nativeOptions.findIndex(i=>i.value===this.nativeSelect.value);return(t=this.nativeOptions[e])!=null&&t.hidden?this.nativeOptions.findIndex(i=>!i.hidden):e}focusDisplaySelect(){this.updateComplete.then(()=>{var e;(e=this.displaySelect)==null||e.focus()})}advanceToFirst(){if(this.nativeOptions.length){const t=this.nativeOptions.findIndex(i=>!i.hidden);this.advanceSelection(t-this.activeIndex)}}advanceToLast(){if(this.nativeOptions.length){let t=-1;for(let i=this.nativeOptions.length-1;i>=0;i--)if(!this.nativeOptions[i].hidden){t=i;break}this.advanceSelection(t-this.activeIndex)}}advanceSelection(e){const t=this.nativeOptions.length;this.activeIndex=(this.activeIndex+e+t)%t,this.shouldSkipHiddenOption()?this.advanceSelection(Math.sign(e)):this.scrollToActive(this.nativeOptions[this.activeIndex])}shouldSkipHiddenOption(){return this.nativeOptions.some(t=>!t.hidden)&&this.nativeOptions[this.activeIndex].hidden}scrollToActive(e){var t;(t=e==null?void 0:e.scrollIntoView)==null||t.call(e,{block:"nearest"})}commitSelection(){this.handleClose();const e=this.nativeOptions[this.activeIndex];this.nativeSelect&&(e!=null&&e.value)&&this.updateNativeSelectValue(e.value)}updateNativeSelectValue(e){this.nativeSelect.value=e,["input","change"].forEach(t=>this.nativeSelect.dispatchEvent(new Event(t,{bubbles:!0,composed:!0})))}get containerClasses(){var e,t,i,s;return{container:!0,open:this._open,disabled:!!((e=this.nativeSelect)!=null&&e.disabled),filled:!!((i=(t=this.nativeOptions)==null?void 0:t.find(a=>a.selected&&!a.hidden))!=null&&i.selected),invalid:!((s=this.nativeSelect)!=null&&s.validity.valid),error:this.hasForcedError,[this.size]:!!this.size,[this.mode]:!!this.mode,[this.variant]:!!this.variant}}set open(e){this._open=e}get open(){return this._open}render(){return r.html`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const y=require("../base/UiKitElement.cjs"),m=require("../../decorators/customUiKitElement.cjs"),b=require("../../utils/booleanConverter.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const r=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const c=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),o=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.cjs"),O=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/query.cjs"),p=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/query-assigned-elements.cjs"),u=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),S=require("./controllers/SelectKeyboardController.cjs"),f=require("./styles/common.styles.cjs");var g=Object.defineProperty,C=Object.getOwnPropertyDescriptor,n=(d,e,t,i)=>{for(var s=i>1?void 0:i?C(e,t):e,a=d.length-1,l;a>=0;a--)(l=d[a])&&(s=(i?l(e,t,s):l(s))||s);return i&&s&&g(e,t,s),s};exports.DsSelect=class extends y.UiKitElement{constructor(){super(...arguments),this.mode="light",this.size="medium",this.variant="primary",this.readonly=!1,this._open=!1,this.nativeSelect=null,this.nativeLabel=null,this.nativeOptions=[],this.activeIndex=-1,this.hasForcedError=!1,this.handleMutations=e=>{e.forEach(t=>{t.type==="childList"&&this.syncNativeOptions()}),this.requestUpdate()},this.syncNativeOptions=()=>{this.nativeOptions=Array.from(this.nativeSelect.options)},this.handleOpen=()=>{this.readonly||(this._open=!0,this.activeIndex=this.findSelectedOptionIndex(),this.focusDisplaySelect())},this.handleClose=()=>{this._open=!1},this.handleClickDisplaySelect=()=>{this._open?this.handleClose():this.handleOpen()},this.handleKeydown=e=>{this._open?S.SelectKeyboardController.handleKeydownWhenOpen(e,{commit:()=>this.commitSelection(),navigateNext:()=>this.advanceSelection(1),navigatePrev:()=>this.advanceSelection(-1),navigateFirst:()=>this.advanceToFirst(),navigateLast:()=>this.advanceToLast(),close:this.handleClose}):S.SelectKeyboardController.handleKeydownWhenClosed(e,{open:this.handleOpen})}}firstUpdated(){this.initializeNativeSelect()}disconnectedCallback(){super.disconnectedCallback(),this.cleanup()}initializeNativeSelect(){var e,t;this.nativeSelect=(e=this.nativeSelects)==null?void 0:e[0],this.nativeLabel=(t=this.nativeLabels)==null?void 0:t[0],this.nativeSelect&&(this.syncNativeOptions(),this.setupNativeElementsAttributes(),this.setupEventListeners())}handleChangeForcedError(){var e;this.hasForcedError=((e=this.forcedError)==null?void 0:e.length)>0}setupNativeElementsAttributes(){this.nativeSelect.setAttribute("aria-hidden","true"),this.nativeSelect.setAttribute("tabindex","-1")}setupEventListeners(){this.nativeSelect.addEventListener("change",this.syncNativeOptions),this.observer=new MutationObserver(this.handleMutations),this.observer.observe(this.nativeSelect,{childList:!0,subtree:!0,attributes:!0})}cleanup(){var e,t;(e=this.nativeSelect)==null||e.removeEventListener("change",this.syncNativeOptions),(t=this.observer)==null||t.disconnect()}findSelectedOptionIndex(){var t;const e=this.nativeOptions.findIndex(i=>i.value===this.nativeSelect.value);return(t=this.nativeOptions[e])!=null&&t.hidden?this.nativeOptions.findIndex(i=>!i.hidden):e}focusDisplaySelect(){this.updateComplete.then(()=>{var e;(e=this.displaySelect)==null||e.focus()})}advanceToFirst(){if(this.nativeOptions.length){const t=this.nativeOptions.findIndex(i=>!i.hidden);this.advanceSelection(t-this.activeIndex)}}advanceToLast(){if(this.nativeOptions.length){let t=-1;for(let i=this.nativeOptions.length-1;i>=0;i--)if(!this.nativeOptions[i].hidden){t=i;break}this.advanceSelection(t-this.activeIndex)}}advanceSelection(e){const t=this.nativeOptions.length;this.activeIndex=(this.activeIndex+e+t)%t,this.shouldSkipHiddenOption()?this.advanceSelection(Math.sign(e)):this.scrollToActive(this.nativeOptions[this.activeIndex])}shouldSkipHiddenOption(){return this.nativeOptions.some(t=>!t.hidden)&&this.nativeOptions[this.activeIndex].hidden}scrollToActive(e){var t;(t=e==null?void 0:e.scrollIntoView)==null||t.call(e,{block:"nearest"})}commitSelection(){this.handleClose();const e=this.nativeOptions[this.activeIndex];this.nativeSelect&&(e!=null&&e.value)&&this.updateNativeSelectValue(e.value)}updateNativeSelectValue(e){this.nativeSelect.value=e,["input","change"].forEach(t=>this.nativeSelect.dispatchEvent(new Event(t,{bubbles:!0,composed:!0})))}get containerClasses(){var e,t,i,s;return{container:!0,open:this._open,disabled:!!((e=this.nativeSelect)!=null&&e.disabled),readonly:!!this.readonly,filled:!!((i=(t=this.nativeOptions)==null?void 0:t.find(a=>a.selected&&!a.hidden))!=null&&i.selected),invalid:!((s=this.nativeSelect)!=null&&s.validity.valid),error:this.hasForcedError,[this.size]:!!this.size,[this.mode]:!!this.mode,[this.variant]:!!this.variant}}set open(e){this._open=e}get open(){return this._open}render(){return r.html`
2
2
  <slot @slotchange=${this.initializeNativeSelect}></slot>
3
3
  <div class=${u.classMap(this.containerClasses)}>
4
4
  ${this.displaySelectTemplate}
5
5
  ${this.optionsContainerTemplate}
6
6
  <slot name="helper-text"></slot>
7
+ <slot name="readonly-text"></slot>
7
8
  <slot name="forced-error" @slotchange=${this.handleChangeForcedError}></slot>
8
9
  <slot name="invalid-error"></slot>
9
10
  </div>
10
- `}get iconTemplate(){return this.componentFactory.createIcon({class:"icon","icon-name":this._open?"arrow-up":"arrow-down"})}get displaySelectTemplate(){var i,s,a;const e=this.nativeOptions.find(l=>l.selected),t=(i=Array.from((e==null?void 0:e.childNodes)||[]))==null?void 0:i.map(l=>{const v=l.cloneNode(!0);if(l.nodeType!==3)return v;if(l.textContent.trim()==="")return"";const d=document.createElement("span");return d.classList.add("text"),d.appendChild(v),d});return r.html`
11
+ `}get iconTemplate(){return this.componentFactory.createIcon({class:"icon","icon-name":this._open?"arrow-up":"arrow-down"})}get displaySelectTemplate(){var i,s,a;const e=this.nativeOptions.find(l=>l.selected),t=(i=Array.from((e==null?void 0:e.childNodes)||[]))==null?void 0:i.map(l=>{const v=l.cloneNode(!0);if(l.nodeType!==3)return v;if(l.textContent.trim()==="")return"";const h=document.createElement("span");return h.classList.add("text"),h.appendChild(v),h});return r.html`
11
12
  <div class="select-outline">
12
13
  <div class="select-container">
13
14
  <label id="display-label" class="label">${(s=this.nativeLabel)==null?void 0:s.innerText}</label>
@@ -44,4 +45,4 @@
44
45
  >
45
46
  ${i}
46
47
  </div>
47
- `}};exports.DsSelect.styles=[O.commonStyles];exports.DsSelect.ARIA_OPTION_PREFIX="option-";n([h.property({type:String})],exports.DsSelect.prototype,"mode",2);n([h.property({type:String})],exports.DsSelect.prototype,"size",2);n([h.property({type:String})],exports.DsSelect.prototype,"variant",2);n([o.state()],exports.DsSelect.prototype,"_open",2);n([o.state()],exports.DsSelect.prototype,"nativeSelect",2);n([o.state()],exports.DsSelect.prototype,"nativeLabel",2);n([o.state()],exports.DsSelect.prototype,"nativeOptions",2);n([o.state()],exports.DsSelect.prototype,"activeIndex",2);n([o.state()],exports.DsSelect.prototype,"hasForcedError",2);n([p.queryAssignedElements({slot:"",selector:"select",flatten:!0})],exports.DsSelect.prototype,"nativeSelects",2);n([p.queryAssignedElements({slot:"",selector:"label",flatten:!0})],exports.DsSelect.prototype,"nativeLabels",2);n([p.queryAssignedElements({slot:"forced-error",flatten:!0})],exports.DsSelect.prototype,"forcedError",2);n([b.query(".select")],exports.DsSelect.prototype,"displaySelect",2);exports.DsSelect=n([y.customUiKitElement("ds-select")],exports.DsSelect);
48
+ `}};exports.DsSelect.styles=[f.commonStyles];exports.DsSelect.ARIA_OPTION_PREFIX="option-";n([c.property({type:String})],exports.DsSelect.prototype,"mode",2);n([c.property({type:String})],exports.DsSelect.prototype,"size",2);n([c.property({type:String})],exports.DsSelect.prototype,"variant",2);n([c.property({type:Boolean,converter:b.booleanConverter,reflect:!0})],exports.DsSelect.prototype,"readonly",2);n([o.state()],exports.DsSelect.prototype,"_open",2);n([o.state()],exports.DsSelect.prototype,"nativeSelect",2);n([o.state()],exports.DsSelect.prototype,"nativeLabel",2);n([o.state()],exports.DsSelect.prototype,"nativeOptions",2);n([o.state()],exports.DsSelect.prototype,"activeIndex",2);n([o.state()],exports.DsSelect.prototype,"hasForcedError",2);n([p.queryAssignedElements({slot:"",selector:"select",flatten:!0})],exports.DsSelect.prototype,"nativeSelects",2);n([p.queryAssignedElements({slot:"",selector:"label",flatten:!0})],exports.DsSelect.prototype,"nativeLabels",2);n([p.queryAssignedElements({slot:"forced-error",flatten:!0})],exports.DsSelect.prototype,"forcedError",2);n([O.query(".select")],exports.DsSelect.prototype,"displaySelect",2);exports.DsSelect=n([m.customUiKitElement("ds-select")],exports.DsSelect);
@@ -1,17 +1,17 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=require("../base/UiKitElement.cjs"),c=require("./utils/getStepValue/getStepValue.cjs"),D=require("./utils/roundToDecimals/roundToDecimals.cjs"),V=require("../../decorators/customUiKitElement.cjs"),$=require("../../mixins/ViewportMixin.cjs"),T=require("../../utils/booleanConverter.cjs"),L=require("../../utils/formatNumber/formatNumber.cjs"),P=require("../../utils/htmlWithTokens.cjs"),k=require("../../utils/objectConverter.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const o=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const a=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),m=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.cjs"),E=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/query.cjs"),q=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),d=require("./styles/common.styles.cjs");var F=Object.defineProperty,N=Object.getOwnPropertyDescriptor,n=(u,t,e,i)=>{for(var s=i>1?void 0:i?N(t,e):t,r=u.length-1,l;r>=0;r--)(l=u[r])&&(s=(i?l(t,e,s):l(s))||s);return i&&s&&F(t,e,s),s};exports.DsSlider=class extends $.ViewportMixin(w.UiKitElement){constructor(){super(...arguments),this.min=0,this.max=100,this.minLabel="",this.maxLabel="",this.step=1,this.initialValueMin=0,this.mode="light",this.locale=void 0,this.localeMatcher="lookup",this.useGrouping=!0,this.minimumIntegerDigits=1,this.minimumFractionDigits=0,this.maximumFractionDigits=3,this.size="medium",this.disabled=!1,this.keyboardMode=!1,this.getNewValue=t=>{const{width:e,left:i}=this.track.getBoundingClientRect(),s=t.type.indexOf("mouse")!==-1?t.clientX:t.touches[0].clientX,l=Math.min(Math.max(0,s-i),e)*100/e;return this.min+l*(this.max-this.min)/100},this.setActiveThumb=t=>{const e=this.getNewValue(t);typeof this.valueMax!="number"||e<=this.valueMin?this.activeThumb="min":e>=this.valueMax?this.activeThumb="max":e-this.valueMin<this.valueMax-e?this.activeThumb="min":this.activeThumb="max"},this.handleMouseMove=t=>{this.animationFrameRequest&&cancelAnimationFrame(this.animationFrameRequest),this.animationFrameRequest=requestAnimationFrame(()=>{const e=this.getNewValue(t),i=this.activeThumb??"min",{stepValue:s}=c.getStepValue({step:this.step,min:this.min,max:this.max,proposedValue:e,role:i,currentValues:{1:this.valueMin,...typeof this.valueMax=="number"?{2:this.valueMax}:{}}});this.handleChange({value:s,role:i})})},this.handleMouseDown=t=>{var e;this.disabled||((e=t==null?void 0:t.preventDefault)==null||e.call(t),this.setActiveThumb(t),this.handleMouseMove(t),window==null||window.addEventListener("mousemove",this.handleMouseMove),window==null||window.addEventListener("touchmove",this.handleMouseMove),window==null||window.addEventListener("pointerup",this.handlePointerUp))},this.handlePointerUp=()=>{window==null||window.removeEventListener("mousemove",this.handleMouseMove),window==null||window.removeEventListener("touchmove",this.handleMouseMove),window==null||window.removeEventListener("pointerup",this.handlePointerUp)},this.handleKeydown=()=>{this.keyboardMode=!0},this.handlePointerOrMouseDown=()=>{this.keyboardMode=!1},this.onInputFocus=(t,e)=>{const i=t.currentTarget,s=e===1?"min":"max";this.editingField=s,i.type="number",i.step=String(this.step??1);const r=s==="min"?this.valueMin:this.valueMax;i.value=String(r??""),this.keyboardMode&&i.classList.add("focus-visible")},this.commitInputValue=(t,e)=>{const i=t.currentTarget,s=e===1?"min":"max",{stepValue:r}=c.getStepValue({step:this.step,min:this.min,max:this.max,proposedValue:Number(i.value),role:s,currentValues:{1:this.valueMin,...typeof this.valueMax=="number"?{2:this.valueMax}:{}}});this.handleChange({value:r,role:s}),i.value=String(r)},this.onInputBlur=t=>{var i;this.editingField=void 0;const e=t.currentTarget;(i=e==null?void 0:e.classList)==null||i.remove("focus-visible")},this.onInputKeyDown=(t,e)=>{t.key==="Enter"&&(t.preventDefault(),this.commitInputValue(t,e))},this.onThumbKeyDown=(t,e)=>{if(!this.disabled&&(t.key==="ArrowLeft"||t.key==="ArrowRight")){t.preventDefault();const i=this.step??1,s=t.key==="ArrowLeft"?-i:i,r=e===1?"min":"max",p=(r==="min"?this.valueMin:this.valueMax)+s,{stepValue:y}=c.getStepValue({step:this.step,min:this.min,max:this.max,proposedValue:p,role:r,currentValues:{1:this.valueMin,...typeof this.valueMax=="number"?{2:this.valueMax}:{}}});this.handleChange({value:y,role:r})}}}disconnectedCallback(){super.disconnectedCallback(),window==null||window.removeEventListener("mousemove",this.handleMouseMove),window==null||window.removeEventListener("touchmove",this.handleMouseMove),window==null||window.removeEventListener("pointerup",this.handlePointerUp),window==null||window.removeEventListener("keydown",this.handleKeydown),window==null||window.removeEventListener("mousedown",this.handlePointerOrMouseDown),window==null||window.removeEventListener("pointerdown",this.handlePointerOrMouseDown)}firstUpdated(t){super.firstUpdated(t),window==null||window.addEventListener("keydown",this.handleKeydown),window==null||window.addEventListener("mousedown",this.handlePointerOrMouseDown),window==null||window.addEventListener("pointerdown",this.handlePointerOrMouseDown),["min","max"].forEach(i=>{const r=this[i==="min"?"initialValueMin":"initialValueMax"];if(typeof r!="number")return;const{stepValue:l}=c.getStepValue({step:this.step,min:this.min,max:this.max,proposedValue:r,role:i,currentValues:{1:this.valueMin,...typeof this.valueMax=="number"?{2:this.valueMax}:{}}});this[i==="min"?"valueMin":"valueMax"]!==l&&this.handleChange({value:l,role:i})})}getTrackPct(t){const e=this.max-this.min;return e===0?0:(t-this.min)/e*100}handleChange({value:t,role:e}){const i=D.roundToDecimals({value:t,fractionDigits:this.maximumFractionDigits}),s=e==="min"?"valueMin":"valueMax";this[s]!==i&&(this[s]=i,this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:{role:e,value:i}})))}formatNumber(t){const e={value:t,locale:this.locale,...this.unitStyle&&{style:this.unitStyle},...this.currency&&{currency:this.currency},...this.unit&&{unit:this.unit},localeMatcher:this.localeMatcher,minimumIntegerDigits:this.minimumIntegerDigits,minimumFractionDigits:this.minimumFractionDigits,maximumFractionDigits:this.maximumFractionDigits,thousandSeparator:this.thousandSeparator,fractionSeparator:this.fractionSeparator,useGrouping:this.useGrouping};return L.formatNumber(e)}get rangeValuesTemplates(){const{formattedValue:t,unitSymbol:e,unitSymbolPosition:i}=this.formatNumber(this.min),s=this.unitSymbol??e,r=this.unitSymbolPosition??i,{formattedValue:l}=this.formatNumber(this.max);return o.html`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const w=require("../base/UiKitElement.cjs"),c=require("./utils/getStepValue/getStepValue.cjs"),D=require("./utils/roundToDecimals/roundToDecimals.cjs"),$=require("../../decorators/customUiKitElement.cjs"),V=require("../../mixins/ViewportMixin.cjs"),_=require("../../utils/booleanConverter.cjs"),T=require("../../utils/formatNumber/formatNumber.cjs"),L=require("../../utils/htmlWithTokens.cjs"),P=require("../../utils/objectConverter.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const o=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const a=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),h=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.cjs"),k=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/query.cjs"),q=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),E=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/live.cjs"),d=require("./styles/common.styles.cjs");var F=Object.defineProperty,C=Object.getOwnPropertyDescriptor,s=(u,t,e,i)=>{for(var n=i>1?void 0:i?C(t,e):t,r=u.length-1,l;r>=0;r--)(l=u[r])&&(n=(i?l(t,e,n):l(n))||n);return i&&n&&F(t,e,n),n};exports.DsSlider=class extends V.ViewportMixin(w.UiKitElement){constructor(){super(...arguments),this.min=0,this.max=100,this.minLabel="",this.maxLabel="",this.step=1,this.initialValueMin=0,this.mode="light",this.locale=void 0,this.localeMatcher="lookup",this.useGrouping=!0,this.minimumIntegerDigits=1,this.minimumFractionDigits=0,this.maximumFractionDigits=3,this.size="medium",this.disabled=!1,this.keyboardMode=!1,this.getNewValue=t=>{const{width:e,left:i}=this.track.getBoundingClientRect(),n=t.type.indexOf("mouse")!==-1?t.clientX:t.touches[0].clientX,l=Math.min(Math.max(0,n-i),e)*100/e;return this.min+l*(this.max-this.min)/100},this.setActiveThumb=t=>{const e=this.getNewValue(t);typeof this._valueMax!="number"||e<=this._valueMin?this.activeThumb="min":e>=this._valueMax?this.activeThumb="max":e-this._valueMin<this._valueMax-e?this.activeThumb="min":this.activeThumb="max"},this.handleMouseMove=t=>{this.animationFrameRequest&&cancelAnimationFrame(this.animationFrameRequest),this.animationFrameRequest=requestAnimationFrame(()=>{const e=this.getNewValue(t),i=this.activeThumb??"min",{stepValue:n}=c.getStepValue({step:this.step,min:this.min,max:this.max,proposedValue:e,role:i,currentValues:{1:this._valueMin,...typeof this._valueMax=="number"?{2:this._valueMax}:{}}});this.handleChange({value:n,role:i})})},this.handleMouseDown=t=>{var e;this.disabled||((e=t==null?void 0:t.preventDefault)==null||e.call(t),this.setActiveThumb(t),this.handleMouseMove(t),window==null||window.addEventListener("mousemove",this.handleMouseMove),window==null||window.addEventListener("touchmove",this.handleMouseMove),window==null||window.addEventListener("pointerup",this.handlePointerUp))},this.handlePointerUp=()=>{window==null||window.removeEventListener("mousemove",this.handleMouseMove),window==null||window.removeEventListener("touchmove",this.handleMouseMove),window==null||window.removeEventListener("pointerup",this.handlePointerUp)},this.handleKeydown=()=>{this.keyboardMode=!0},this.handlePointerOrMouseDown=()=>{this.keyboardMode=!1},this.onInputFocus=(t,e)=>{const i=t.currentTarget,n=e===1?"min":"max";this.editingField=n,i.type="number",i.step=String(this.step??1);const r=n==="min"?this._valueMin:this._valueMax;i.value=String(r??""),this.keyboardMode&&i.classList.add("focus-visible")},this.commitInputValue=(t,e)=>{const i=t.currentTarget,n=e===1?"min":"max",{stepValue:r}=c.getStepValue({step:this.step,min:this.min,max:this.max,proposedValue:Number(i.value),role:n,currentValues:{1:this._valueMin,...typeof this._valueMax=="number"?{2:this._valueMax}:{}}});this.handleChange({value:r,role:n}),this.isControlled(n)||(i.value=String(r))},this.onInputBlur=t=>{var i;this.editingField=void 0;const e=t.currentTarget;(i=e==null?void 0:e.classList)==null||i.remove("focus-visible")},this.onInputKeyDown=(t,e)=>{t.key==="Enter"&&(t.preventDefault(),this.commitInputValue(t,e))},this.onThumbKeyDown=(t,e)=>{if(!this.disabled&&(t.key==="ArrowLeft"||t.key==="ArrowRight")){t.preventDefault();const i=this.step??1,n=t.key==="ArrowLeft"?-i:i,r=e===1?"min":"max",p=(r==="min"?this._valueMin:this._valueMax)+n,{stepValue:y}=c.getStepValue({step:this.step,min:this.min,max:this.max,proposedValue:p,role:r,currentValues:{1:this._valueMin,...typeof this._valueMax=="number"?{2:this._valueMax}:{}}});this.handleChange({value:y,role:r})}}}get isRange(){return typeof this.initialValueMax=="number"||typeof this.valueMax=="number"}isControlled(t){return typeof(t==="min"?this.valueMin:this.valueMax)=="number"}willUpdate(t){super.willUpdate(t),typeof this.valueMin=="number"&&(this._valueMin=this.valueMin),typeof this.valueMax=="number"&&(this._valueMax=this.valueMax)}disconnectedCallback(){super.disconnectedCallback(),window==null||window.removeEventListener("mousemove",this.handleMouseMove),window==null||window.removeEventListener("touchmove",this.handleMouseMove),window==null||window.removeEventListener("pointerup",this.handlePointerUp),window==null||window.removeEventListener("keydown",this.handleKeydown),window==null||window.removeEventListener("mousedown",this.handlePointerOrMouseDown),window==null||window.removeEventListener("pointerdown",this.handlePointerOrMouseDown)}firstUpdated(t){super.firstUpdated(t),window==null||window.addEventListener("keydown",this.handleKeydown),window==null||window.addEventListener("mousedown",this.handlePointerOrMouseDown),window==null||window.addEventListener("pointerdown",this.handlePointerOrMouseDown),["min","max"].forEach(i=>{if(this.isControlled(i))return;const r=this[i==="min"?"initialValueMin":"initialValueMax"];if(typeof r!="number")return;const{stepValue:l}=c.getStepValue({step:this.step,min:this.min,max:this.max,proposedValue:r,role:i,currentValues:{1:this._valueMin,...typeof this._valueMax=="number"?{2:this._valueMax}:{}}});this[i==="min"?"_valueMin":"_valueMax"]!==l&&this.handleChange({value:l,role:i})})}getTrackPct(t){const e=this.max-this.min;return e===0?0:(t-this.min)/e*100}handleChange({value:t,role:e}){const i=D.roundToDecimals({value:t,fractionDigits:this.maximumFractionDigits}),n=e==="min"?"_valueMin":"_valueMax";this[n]!==i&&(this.isControlled(e)||(this[n]=i),this.dispatchEvent(new CustomEvent("change",{bubbles:!0,composed:!0,detail:{role:e,value:i}})))}formatNumber(t){const e={value:t,locale:this.locale,...this.unitStyle&&{style:this.unitStyle},...this.currency&&{currency:this.currency},...this.unit&&{unit:this.unit},localeMatcher:this.localeMatcher,minimumIntegerDigits:this.minimumIntegerDigits,minimumFractionDigits:this.minimumFractionDigits,maximumFractionDigits:this.maximumFractionDigits,thousandSeparator:this.thousandSeparator,fractionSeparator:this.fractionSeparator,useGrouping:this.useGrouping};return T.formatNumber(e)}get rangeValuesTemplates(){const{formattedValue:t,unitSymbol:e,unitSymbolPosition:i}=this.formatNumber(this.min),n=this.unitSymbol??e,r=this.unitSymbolPosition??i,{formattedValue:l}=this.formatNumber(this.max);return o.html`
2
2
  <div class="range-value-text">
3
3
  ${this.minLabel?o.html`<span class="range-value-label">${this.minLabel}</span>`:o.nothing}
4
- ${r==="left"?o.html`<span>${s}</span>`:o.nothing}
4
+ ${r==="left"?o.html`<span>${n}</span>`:o.nothing}
5
5
  <span>${t}</span>
6
- ${r==="right"?o.html`<span>${s}</span>`:o.nothing}
6
+ ${r==="right"?o.html`<span>${n}</span>`:o.nothing}
7
7
  </div>
8
8
  <div class="range-value-text">
9
9
  ${this.maxLabel?o.html` <span class="range-value-label">${this.maxLabel}</span>`:o.nothing}
10
- ${r==="left"?o.html`<span>${s}</span>`:o.nothing}
10
+ ${r==="left"?o.html`<span>${n}</span>`:o.nothing}
11
11
  <span>${l}</span>
12
- ${r==="right"?o.html`<span>${s}</span>`:o.nothing}
12
+ ${r==="right"?o.html`<span>${n}</span>`:o.nothing}
13
13
  </div>
14
- `}getThumbTemplate(t){const e=t===1?"min":"max",i=e==="min"?this.valueMin:this.valueMax,{minLimit:s,maxLimit:r}=c.getStepValue({step:this.step,min:this.min,max:this.max,proposedValue:i,role:e,currentValues:{1:this.valueMin,...typeof this.valueMax=="number"?{2:this.valueMax}:{}}}),l=this.getTrackPct(i);return o.html`
14
+ `}getThumbTemplate(t){const e=t===1?"min":"max",i=e==="min"?this._valueMin:this._valueMax,{minLimit:n,maxLimit:r}=c.getStepValue({step:this.step,min:this.min,max:this.max,proposedValue:i,role:e,currentValues:{1:this._valueMin,...typeof this._valueMax=="number"?{2:this._valueMax}:{}}}),l=this.getTrackPct(i);return o.html`
15
15
  <style>
16
16
  .thumb${t} {
17
17
  left: ${l}%;
@@ -25,7 +25,7 @@
25
25
  tabindex=${this.disabled?-1:0}
26
26
  aria-disabled=${String(!!this.disabled)}
27
27
  aria-label=${t===1?"Minumum value":"Maximum Value"}
28
- aria-valuemin=${s}
28
+ aria-valuemin=${n}
29
29
  aria-valuemax=${r}
30
30
  aria-valuenow=${i}
31
31
  >
@@ -40,8 +40,8 @@
40
40
  </div>
41
41
  `}get thumbTemplates(){return o.html`
42
42
  ${this.getThumbTemplate(1)}
43
- ${typeof this.initialValueMax=="number"?this.getThumbTemplate(2):o.nothing}
44
- `}get trackRangeTemplate(){let t,e;return typeof this.initialValueMax!="number"?(t=0,e=this.getTrackPct(this.valueMin)):(t=this.getTrackPct(this.valueMin),e=this.getTrackPct(this.valueMax)-t),o.html`
43
+ ${this.isRange?this.getThumbTemplate(2):o.nothing}
44
+ `}get trackRangeTemplate(){let t,e;return this.isRange?(t=this.getTrackPct(this._valueMin),e=this.getTrackPct(this._valueMax)-t):(t=0,e=this.getTrackPct(this._valueMin)),o.html`
45
45
  <style>
46
46
  .track-range {
47
47
  left: ${t}%;
@@ -49,31 +49,31 @@
49
49
  }
50
50
  </style>
51
51
  <div class="track-range" role="presentation"></div>
52
- `}getInputTemplate(t){const e=t===1?"min":"max",i=this.editingField===e,s=e==="min"?this.valueMin:this.valueMax,{formattedValue:r,unitSymbol:l,unitSymbolPosition:p}=this.formatNumber(s),y=this.unitSymbolPosition??p,b=this.unitSymbol??l,g=b?y==="left"?`${b} ${r}`:`${r} ${b}`:`${r}`,S=i?"number":"text",v=i?String(s??""):g,M=t===1?this.inputMinAriaLabel:this.inputMaxAriaLabel,x=typeof this.initialValueMax=="number"?t===1?"Start value":"End value":"Value",f=M??x;return o.html`
52
+ `}getInputTemplate(t){const e=t===1?"min":"max",i=this.editingField===e,n=e==="min"?this._valueMin:this._valueMax,{formattedValue:r,unitSymbol:l,unitSymbolPosition:p}=this.formatNumber(n),y=this.unitSymbolPosition??p,b=this.unitSymbol??l,g=b?y==="left"?`${b} ${r}`:`${r} ${b}`:`${r}`,S=i?"number":"text",v=i?String(n??""):g,M=t===1?this.inputMinAriaLabel:this.inputMaxAriaLabel,f=this.isRange?t===1?"Start value":"End value":"Value",x=M??f;return o.html`
53
53
  <div class="input-wrapper">
54
54
  <input
55
55
  class="input-value input-value-${t}"
56
56
  type=${S}
57
- .value=${v}
57
+ .value=${E.live(v)}
58
58
  step=${String(this.step??1)}
59
59
  ?disabled=${this.disabled}
60
60
  tabindex=${this.disabled?-1:0}
61
61
  aria-disabled=${String(!!this.disabled)}
62
- aria-label=${f}
62
+ aria-label=${x}
63
63
  ?readonly=${this.disabled}
64
- @focus=${h=>this.onInputFocus(h,t)}
64
+ @focus=${m=>this.onInputFocus(m,t)}
65
65
  @blur=${this.onInputBlur}
66
- @change=${h=>this.commitInputValue(h,t)}
67
- @keydown=${h=>this.onInputKeyDown(h,t)}
66
+ @change=${m=>this.commitInputValue(m,t)}
67
+ @keydown=${m=>this.onInputKeyDown(m,t)}
68
68
  title=${v}
69
69
  />
70
70
  </div>
71
71
  `}get inputsTemplate(){return o.html`
72
72
  <div class="inputs-container">
73
73
  ${this.getInputTemplate(1)}
74
- ${typeof this.initialValueMax=="number"?this.getInputTemplate(2):o.nothing}
74
+ ${this.isRange?this.getInputTemplate(2):o.nothing}
75
75
  </div>
76
- `}get containerClasses(){var e;const t=typeof this.size=="string"?this.size:(e=this.size)==null?void 0:e[this.viewport];return{container:!0,[this.mode]:!!this.mode,[t]:!!t,disabled:!!this.disabled}}get styleTokens(){return P.htmlWithTokens`
76
+ `}get containerClasses(){var e;const t=typeof this.size=="string"?this.size:(e=this.size)==null?void 0:e[this.viewport];return{container:!0,[this.mode]:!!this.mode,[t]:!!t,disabled:!!this.disabled}}get styleTokens(){return L.htmlWithTokens`
77
77
  <style>
78
78
  :host{
79
79
  color-scheme: ${this.mode};
@@ -89,4 +89,4 @@
89
89
  <div class="range-value-container">${this.rangeValuesTemplates}</div>
90
90
  ${this.inputsTemplate}
91
91
  </div>
92
- `}};exports.DsSlider.styles=[d.commonStyles,d.trackStyles,d.thumbStyles,d.currentValueStyles,d.rangeValueStyles];n([a.property({type:Number})],exports.DsSlider.prototype,"min",2);n([a.property({type:Number})],exports.DsSlider.prototype,"max",2);n([a.property({type:String,attribute:"min-label"})],exports.DsSlider.prototype,"minLabel",2);n([a.property({type:String,attribute:"max-label"})],exports.DsSlider.prototype,"maxLabel",2);n([a.property({type:Number})],exports.DsSlider.prototype,"step",2);n([a.property({type:Number,attribute:"initial-value-min"})],exports.DsSlider.prototype,"initialValueMin",2);n([a.property({type:Number,attribute:"initial-value-max"})],exports.DsSlider.prototype,"initialValueMax",2);n([a.property({type:String,reflect:!0})],exports.DsSlider.prototype,"mode",2);n([a.property({type:String,attribute:"locale"})],exports.DsSlider.prototype,"locale",2);n([a.property({type:String,attribute:"locale-matcher"})],exports.DsSlider.prototype,"localeMatcher",2);n([a.property({type:String,attribute:"unit-symbol"})],exports.DsSlider.prototype,"unitSymbol",2);n([a.property({type:String,attribute:"unit-symbol-position"})],exports.DsSlider.prototype,"unitSymbolPosition",2);n([a.property({type:String,attribute:"unit-style"})],exports.DsSlider.prototype,"unitStyle",2);n([a.property({type:String,attribute:"currency"})],exports.DsSlider.prototype,"currency",2);n([a.property({type:String,attribute:"unit"})],exports.DsSlider.prototype,"unit",2);n([a.property({type:String,attribute:"use-grouping",converter:u=>u==="auto"?"auto":typeof u=="boolean"?u:u==="true"||u===""?!0:u!=="false"})],exports.DsSlider.prototype,"useGrouping",2);n([a.property({type:Number,attribute:"minimum-integer-digits"})],exports.DsSlider.prototype,"minimumIntegerDigits",2);n([a.property({type:Number,attribute:"minimum-fraction-digits"})],exports.DsSlider.prototype,"minimumFractionDigits",2);n([a.property({type:Number,attribute:"maximum-fraction-digits"})],exports.DsSlider.prototype,"maximumFractionDigits",2);n([a.property({type:String,attribute:"thousand-separator"})],exports.DsSlider.prototype,"thousandSeparator",2);n([a.property({type:String,attribute:"fraction-separator"})],exports.DsSlider.prototype,"fractionSeparator",2);n([a.property({type:String,converter:k.objectConverter})],exports.DsSlider.prototype,"size",2);n([a.property({type:Boolean,converter:T.booleanConverter})],exports.DsSlider.prototype,"disabled",2);n([a.property({type:String,attribute:"input-min-aria-label"})],exports.DsSlider.prototype,"inputMinAriaLabel",2);n([a.property({type:String,attribute:"input-max-aria-label"})],exports.DsSlider.prototype,"inputMaxAriaLabel",2);n([E.query(".track")],exports.DsSlider.prototype,"track",2);n([m.state()],exports.DsSlider.prototype,"valueMin",2);n([m.state()],exports.DsSlider.prototype,"valueMax",2);n([m.state()],exports.DsSlider.prototype,"activeThumb",2);n([m.state()],exports.DsSlider.prototype,"animationFrameRequest",2);n([m.state()],exports.DsSlider.prototype,"editingField",2);n([m.state()],exports.DsSlider.prototype,"keyboardMode",2);exports.DsSlider=n([V.customUiKitElement("ds-slider")],exports.DsSlider);
92
+ `}};exports.DsSlider.styles=[d.commonStyles,d.trackStyles,d.thumbStyles,d.currentValueStyles,d.rangeValueStyles];s([a.property({type:Number})],exports.DsSlider.prototype,"min",2);s([a.property({type:Number})],exports.DsSlider.prototype,"max",2);s([a.property({type:String,attribute:"min-label"})],exports.DsSlider.prototype,"minLabel",2);s([a.property({type:String,attribute:"max-label"})],exports.DsSlider.prototype,"maxLabel",2);s([a.property({type:Number})],exports.DsSlider.prototype,"step",2);s([a.property({type:Number,attribute:"initial-value-min"})],exports.DsSlider.prototype,"initialValueMin",2);s([a.property({type:Number,attribute:"initial-value-max"})],exports.DsSlider.prototype,"initialValueMax",2);s([a.property({type:Number,attribute:"value-min"})],exports.DsSlider.prototype,"valueMin",2);s([a.property({type:Number,attribute:"value-max"})],exports.DsSlider.prototype,"valueMax",2);s([a.property({type:String,reflect:!0})],exports.DsSlider.prototype,"mode",2);s([a.property({type:String,attribute:"locale"})],exports.DsSlider.prototype,"locale",2);s([a.property({type:String,attribute:"locale-matcher"})],exports.DsSlider.prototype,"localeMatcher",2);s([a.property({type:String,attribute:"unit-symbol"})],exports.DsSlider.prototype,"unitSymbol",2);s([a.property({type:String,attribute:"unit-symbol-position"})],exports.DsSlider.prototype,"unitSymbolPosition",2);s([a.property({type:String,attribute:"unit-style"})],exports.DsSlider.prototype,"unitStyle",2);s([a.property({type:String,attribute:"currency"})],exports.DsSlider.prototype,"currency",2);s([a.property({type:String,attribute:"unit"})],exports.DsSlider.prototype,"unit",2);s([a.property({type:String,attribute:"use-grouping",converter:u=>u==="auto"?"auto":typeof u=="boolean"?u:u==="true"||u===""?!0:u!=="false"})],exports.DsSlider.prototype,"useGrouping",2);s([a.property({type:Number,attribute:"minimum-integer-digits"})],exports.DsSlider.prototype,"minimumIntegerDigits",2);s([a.property({type:Number,attribute:"minimum-fraction-digits"})],exports.DsSlider.prototype,"minimumFractionDigits",2);s([a.property({type:Number,attribute:"maximum-fraction-digits"})],exports.DsSlider.prototype,"maximumFractionDigits",2);s([a.property({type:String,attribute:"thousand-separator"})],exports.DsSlider.prototype,"thousandSeparator",2);s([a.property({type:String,attribute:"fraction-separator"})],exports.DsSlider.prototype,"fractionSeparator",2);s([a.property({type:String,converter:P.objectConverter})],exports.DsSlider.prototype,"size",2);s([a.property({type:Boolean,converter:_.booleanConverter})],exports.DsSlider.prototype,"disabled",2);s([a.property({type:String,attribute:"input-min-aria-label"})],exports.DsSlider.prototype,"inputMinAriaLabel",2);s([a.property({type:String,attribute:"input-max-aria-label"})],exports.DsSlider.prototype,"inputMaxAriaLabel",2);s([k.query(".track")],exports.DsSlider.prototype,"track",2);s([h.state()],exports.DsSlider.prototype,"_valueMin",2);s([h.state()],exports.DsSlider.prototype,"_valueMax",2);s([h.state()],exports.DsSlider.prototype,"activeThumb",2);s([h.state()],exports.DsSlider.prototype,"animationFrameRequest",2);s([h.state()],exports.DsSlider.prototype,"editingField",2);s([h.state()],exports.DsSlider.prototype,"keyboardMode",2);exports.DsSlider=s([$.customUiKitElement("ds-slider")],exports.DsSlider);
@@ -1,14 +1,15 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../base/UiKitElement.cjs"),h=require("../../decorators/customUiKitElement.cjs"),c=require("../../mixins/inputStatesMixin.cjs"),d=require("../../utils/validateMaxLength.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const i=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const a=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),v=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),m=require("./styles/common.styles.cjs");var f=Object.defineProperty,x=Object.getOwnPropertyDescriptor,n=(o,t,s,e)=>{for(var r=e>1?void 0:e?x(t,s):t,p=o.length-1,l;p>=0;p--)(l=o[p])&&(r=(e?l(t,s,r):l(r))||r);return e&&r&&f(t,s,r),r};exports.DsTextInput=class extends c.inputStatesMixin(u.UiKitElement){constructor(){super(...arguments),this.keyboardMode=!1,this.size="medium",this.helperText="",this.forcedError="",this.invalidError="",this.dataAriaLabelRemoveButton="",this.handleClickIcon=()=>{this.nativeInput.value="",this.nativeInput.focus(),["input","change"].forEach(t=>this.nativeInput.dispatchEvent(new Event(t,{bubbles:!0,composed:!0})))}}get classes(){return{container:!0,error:!!this.forcedError,[this.size]:!!this.size,disabled:this.inputStates.disabled,filled:this.inputStates.filled,invalid:this.inputStates.invalid,focus:this.inputStates.focus,"focus-visible":this.inputStates.focusVisible}}render(){return i.html`
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../base/UiKitElement.cjs"),h=require("../../decorators/customUiKitElement.cjs"),d=require("../../mixins/inputStatesMixin.cjs"),c=require("../../utils/validateMaxLength.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const e=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const a=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),v=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),m=require("./styles/common.styles.cjs");var y=Object.defineProperty,x=Object.getOwnPropertyDescriptor,s=(o,t,n,r)=>{for(var i=r>1?void 0:r?x(t,n):t,l=o.length-1,p;l>=0;l--)(p=o[l])&&(i=(r?p(t,n,i):p(i))||i);return r&&i&&y(t,n,i),i};exports.DsTextInput=class extends d.inputStatesMixin(u.UiKitElement){constructor(){super(...arguments),this.keyboardMode=!1,this.size="medium",this.helperText="",this.forcedError="",this.invalidError="",this.readonlyText="",this.dataAriaLabelRemoveButton="",this.handleClickIcon=()=>{this.nativeInput.value="",this.nativeInput.focus(),["input","change"].forEach(t=>this.nativeInput.dispatchEvent(new Event(t,{bubbles:!0,composed:!0})))}}get classes(){return{container:!0,error:!!this.forcedError,[this.size]:!!this.size,disabled:this.inputStates.disabled,readonly:this.inputStates.readonly,filled:this.inputStates.filled,invalid:this.inputStates.invalid,focus:this.inputStates.focus,"focus-visible":this.inputStates.focusVisible}}render(){return e.html`
2
2
  <div class=${v.classMap(this.classes)}>
3
3
  <div class="input-container">
4
4
  <div><slot></slot></div>
5
5
  ${this.iconTemplate}
6
6
  </div>
7
7
  <div class="footer">
8
+ ${this.readonlyTextTemplate}
8
9
  ${this.helperTextTemplate}
9
10
  ${this.forcedErrorTemplate}
10
11
  ${this.invalidErrorTemplate}
11
12
  ${this.lengthTemplate}
12
13
  </div>
13
14
  </div>
14
- `}get iconTemplate(){var t,s,e;return(s=(t=this.nativeInput)==null?void 0:t.value)!=null&&s.length?this.componentFactory.createIconButton({class:"icon-button","icon-name":"cross",size:this.size,disabled:!!((e=this.nativeInput)!=null&&e.disabled),variant:"naked","@click":this.handleClickIcon,"data-aria-label":this.dataAriaLabelRemoveButton||"remove button"}):i.nothing}get lengthTemplate(){var s,e,r;const t=(e=(s=this.nativeInput)==null?void 0:s.maxLength)==null?void 0:e.toString();return d.validateMaxLength(t)?i.html`<span class="char-counter">${((r=this.inputStates.currentValue)==null?void 0:r.length)||0}/${t}</span>`:i.nothing}get helperTextTemplate(){return this.forcedError||this.inputStates.invalid&&this.invalidError?i.nothing:i.html`<span class="support-text helper-text">${this.helperText}</span>`}get forcedErrorTemplate(){return this.forcedError?i.html`<span class="support-text error-text forced-error">${this.forcedError}</span>`:i.nothing}get invalidErrorTemplate(){return this.forcedError||!this.inputStates.invalid||!this.invalidError?i.nothing:i.html`<span class="support-text error-text invalid-error">${this.invalidError}</span>`}};exports.DsTextInput.styles=[m.commonStyles];n([a.property({type:String})],exports.DsTextInput.prototype,"size",2);n([a.property({type:String,attribute:"helper-text"})],exports.DsTextInput.prototype,"helperText",2);n([a.property({type:String,attribute:"forced-error"})],exports.DsTextInput.prototype,"forcedError",2);n([a.property({type:String,attribute:"invalid-error"})],exports.DsTextInput.prototype,"invalidError",2);n([a.property({type:String,attribute:"data-aria-label-remove-button"})],exports.DsTextInput.prototype,"dataAriaLabelRemoveButton",2);exports.DsTextInput=n([h.customUiKitElement("ds-text-input")],exports.DsTextInput);
15
+ `}get iconTemplate(){var t,n,r;return!((n=(t=this.nativeInput)==null?void 0:t.value)!=null&&n.length)||this.inputStates.readonly?e.nothing:this.componentFactory.createIconButton({class:"icon-button","icon-name":"cross",size:this.size,disabled:!!((r=this.nativeInput)!=null&&r.disabled),variant:"naked","@click":this.handleClickIcon,"data-aria-label":this.dataAriaLabelRemoveButton||"remove button"})}get lengthTemplate(){var n,r,i;const t=(r=(n=this.nativeInput)==null?void 0:n.maxLength)==null?void 0:r.toString();return c.validateMaxLength(t)?e.html`<span class="char-counter">${((i=this.inputStates.currentValue)==null?void 0:i.length)||0}/${t}</span>`:e.nothing}get helperTextTemplate(){return this.inputStates.readonly||this.forcedError||this.inputStates.invalid&&this.invalidError?e.nothing:e.html`<span class="support-text helper-text">${this.helperText}</span>`}get forcedErrorTemplate(){return this.inputStates.readonly||!this.forcedError?e.nothing:e.html`<span class="support-text error-text forced-error">${this.forcedError}</span>`}get readonlyTextTemplate(){return!this.inputStates.readonly||!this.readonlyText?e.nothing:e.html`<span class="support-text readonly-text">${this.readonlyText}</span>`}get invalidErrorTemplate(){return this.inputStates.readonly||this.forcedError||!this.inputStates.invalid||!this.invalidError?e.nothing:e.html`<span class="support-text error-text invalid-error">${this.invalidError}</span>`}};exports.DsTextInput.styles=[m.commonStyles];s([a.property({type:String})],exports.DsTextInput.prototype,"size",2);s([a.property({type:String,attribute:"helper-text"})],exports.DsTextInput.prototype,"helperText",2);s([a.property({type:String,attribute:"forced-error"})],exports.DsTextInput.prototype,"forcedError",2);s([a.property({type:String,attribute:"invalid-error"})],exports.DsTextInput.prototype,"invalidError",2);s([a.property({type:String,attribute:"readonly-text"})],exports.DsTextInput.prototype,"readonlyText",2);s([a.property({type:String,attribute:"data-aria-label-remove-button"})],exports.DsTextInput.prototype,"dataAriaLabelRemoveButton",2);exports.DsTextInput=s([h.customUiKitElement("ds-text-input")],exports.DsTextInput);
@@ -1,13 +1,14 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("../base/UiKitElement.cjs"),u=require("../../decorators/customUiKitElement.cjs"),c=require("../../mixins/ViewportMixin.cjs"),d=require("../../mixins/inputStatesMixin.cjs"),m=require("../../utils/objectConverter.cjs"),v=require("../../utils/validateMaxLength.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const r=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const n=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),x=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),f=require("./styles/common.styles.cjs");var g=Object.defineProperty,y=Object.getOwnPropertyDescriptor,o=(a,t,s,i)=>{for(var e=i>1?void 0:i?y(t,s):t,l=a.length-1,p;l>=0;l--)(p=a[l])&&(e=(i?p(t,s,e):p(e))||e);return i&&e&&g(t,s,e),e};exports.DsTextarea=class extends d.inputStatesMixin(c.ViewportMixin(h.UiKitElement)){constructor(){super(...arguments),this.keyboardMode=!1,this.size="medium",this.helperText="",this.forcedError="",this.invalidError="",this.mode="light"}onInputReady(t){t.classList.add("ds-scroll")}get classes(){const t=typeof this.size=="string"?this.size:this.size[this.viewport];return{container:!0,error:!!this.forcedError,[t]:!!t,[this.mode]:!!this.mode,disabled:this.inputStates.disabled,filled:this.inputStates.filled,invalid:this.inputStates.invalid,focus:this.inputStates.focus,"focus-visible":this.inputStates.focusVisible}}render(){return r.html`
2
- <div class=${x.classMap(this.classes)}>
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("../base/UiKitElement.cjs"),u=require("../../decorators/customUiKitElement.cjs"),d=require("../../mixins/ViewportMixin.cjs"),c=require("../../mixins/inputStatesMixin.cjs"),x=require("../../utils/objectConverter.cjs"),y=require("../../utils/validateMaxLength.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const e=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs");require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs");const o=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),m=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/directives/class-map.cjs"),v=require("./styles/common.styles.cjs");var T=Object.defineProperty,f=Object.getOwnPropertyDescriptor,s=(a,t,n,i)=>{for(var r=i>1?void 0:i?f(t,n):t,l=a.length-1,p;l>=0;l--)(p=a[l])&&(r=(i?p(t,n,r):p(r))||r);return i&&r&&T(t,n,r),r};exports.DsTextarea=class extends c.inputStatesMixin(d.ViewportMixin(h.UiKitElement)){constructor(){super(...arguments),this.keyboardMode=!1,this.size="medium",this.helperText="",this.forcedError="",this.invalidError="",this.readonlyText="",this.mode="light"}onInputReady(t){t.classList.add("ds-scroll")}get classes(){const t=typeof this.size=="string"?this.size:this.size[this.viewport];return{container:!0,error:!!this.forcedError,[t]:!!t,[this.mode]:!!this.mode,disabled:this.inputStates.disabled,readonly:this.inputStates.readonly,filled:this.inputStates.filled,invalid:this.inputStates.invalid,focus:this.inputStates.focus,"focus-visible":this.inputStates.focusVisible}}render(){return e.html`
2
+ <div class=${m.classMap(this.classes)}>
3
3
  <div class="input-container">
4
4
  <slot></slot>
5
5
  </div>
6
6
  <div class="footer">
7
+ ${this.readonlyTextTemplate}
7
8
  ${this.helperTextTemplate}
8
9
  ${this.forcedErrorTemplate}
9
10
  ${this.invalidErrorTemplate}
10
11
  ${this.lengthTemplate}
11
12
  </div>
12
13
  </div>
13
- `}get lengthTemplate(){var s,i,e;const t=(i=(s=this.nativeInput)==null?void 0:s.maxLength)==null?void 0:i.toString();return v.validateMaxLength(t)?r.html`<span class="char-counter">${((e=this.inputStates.currentValue)==null?void 0:e.length)||0}/${t}</span>`:r.nothing}get helperTextTemplate(){return this.forcedError||this.inputStates.invalid&&this.invalidError?r.nothing:r.html`<span class="support-text helper-text">${this.helperText}</span>`}get forcedErrorTemplate(){return this.forcedError?r.html`<span class="support-text error-text forced-error">${this.forcedError}</span>`:r.nothing}get invalidErrorTemplate(){return this.forcedError||!this.inputStates.invalid||!this.invalidError?r.nothing:r.html`<span class="support-text error-text invalid-error">${this.invalidError}</span>`}};exports.DsTextarea.styles=[f.commonStyles];o([n.property({type:String,converter:m.objectConverter})],exports.DsTextarea.prototype,"size",2);o([n.property({type:String,attribute:"helper-text"})],exports.DsTextarea.prototype,"helperText",2);o([n.property({type:String,attribute:"forced-error"})],exports.DsTextarea.prototype,"forcedError",2);o([n.property({type:String,attribute:"invalid-error"})],exports.DsTextarea.prototype,"invalidError",2);o([n.property({type:String})],exports.DsTextarea.prototype,"mode",2);exports.DsTextarea=o([u.customUiKitElement("ds-textarea")],exports.DsTextarea);
14
+ `}get lengthTemplate(){var n,i,r;const t=(i=(n=this.nativeInput)==null?void 0:n.maxLength)==null?void 0:i.toString();return y.validateMaxLength(t)?e.html`<span class="char-counter">${((r=this.inputStates.currentValue)==null?void 0:r.length)||0}/${t}</span>`:e.nothing}get helperTextTemplate(){return this.inputStates.readonly||this.forcedError||this.inputStates.invalid&&this.invalidError?e.nothing:e.html`<span class="support-text helper-text">${this.helperText}</span>`}get forcedErrorTemplate(){return this.inputStates.readonly||!this.forcedError?e.nothing:e.html`<span class="support-text error-text forced-error">${this.forcedError}</span>`}get readonlyTextTemplate(){return!this.inputStates.readonly||!this.readonlyText?e.nothing:e.html`<span class="support-text readonly-text">${this.readonlyText}</span>`}get invalidErrorTemplate(){return this.inputStates.readonly||this.forcedError||!this.inputStates.invalid||!this.invalidError?e.nothing:e.html`<span class="support-text error-text invalid-error">${this.invalidError}</span>`}};exports.DsTextarea.styles=[v.commonStyles];s([o.property({type:String,converter:x.objectConverter})],exports.DsTextarea.prototype,"size",2);s([o.property({type:String,attribute:"helper-text"})],exports.DsTextarea.prototype,"helperText",2);s([o.property({type:String,attribute:"forced-error"})],exports.DsTextarea.prototype,"forcedError",2);s([o.property({type:String,attribute:"invalid-error"})],exports.DsTextarea.prototype,"invalidError",2);s([o.property({type:String,attribute:"readonly-text"})],exports.DsTextarea.prototype,"readonlyText",2);s([o.property({type:String})],exports.DsTextarea.prototype,"mode",2);exports.DsTextarea=s([u.customUiKitElement("ds-textarea")],exports.DsTextarea);
@@ -1,4 +1,4 @@
1
1
  "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("../../core/theme.constants.cjs"),p=require("../../decorators/customUiKitElement.cjs"),f=require("../../node_modules/.pnpm/@lit_context@1.1.6/node_modules/@lit/context/lib/decorators/provide.cjs"),y=require("../../utils/PubSub.cjs"),m=require("../../utils/booleanConverter.cjs");require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/reactive-element.cjs");const l=require("../../node_modules/.pnpm/lit-html@3.3.1/node_modules/lit-html/lit-html.cjs"),v=require("../../node_modules/.pnpm/lit-element@4.2.1/node_modules/lit-element/lit-element.cjs"),h=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/property.cjs"),u=require("../../node_modules/.pnpm/@lit_reactive-element@2.1.1/node_modules/@lit/reactive-element/decorators/state.cjs"),$=require("../../styles/source/shared/fonts-config.cjs"),T=require("./themeContext.cjs");var b=Object.defineProperty,P=Object.getOwnPropertyDescriptor,d=(a,e,s,o)=>{for(var t=o>1?void 0:o?P(e,s):e,r=a.length-1,n;r>=0;r--)(n=a[r])&&(t=(o?n(e,s,t):n(t))||t);return o&&t&&b(e,s,t),t};exports.DsThemeProvider=class extends v.LitElement{constructor(){super(...arguments),this.loadFonts=!0,this.loadStyles=!0,this.cssLoaded=!1,this.loadedFonts=new Set}updated(e){super.updated(e),e.has("theme")&&(y.pubSub.publish("theme",this.theme),sessionStorage==null||sessionStorage.setItem(c.THEME_STORAGE_KEY,this.theme),typeof FontFace<"u"&&(document!=null&&document.fonts)&&this.loadThemeFonts(),this.loadThemeStyles().then(()=>{this.cssLoaded=!0,this.dispatchEvent(new CustomEvent("ui-kit:ready",{bubbles:!0,composed:!0}))}))}loadThemeFonts(){var e;(e=$.fontsConfig[this.theme])==null||e.fonts.forEach(s=>{this.loadThemeFont(s)})}async loadThemeFont({weight:e,name:s,file:o}){if(!this.loadFonts)return Promise.resolve();const t=`${s}-${e}`;if(this.loadedFonts.has(t))return;const r=new FontFace(s,`url('https://ds-assets.cupra.com/fonts/${this.theme}/${o}.woff2') format('woff2'),
2
2
  url('https://ds-assets.cupra.com/fonts/${this.theme}/${o}.woff') format('woff'),
3
3
  url('https://ds-assets.cupra.com/fonts/${this.theme}/${o}.ttf') format('truetype'),
4
- url('https://ds-assets.cupra.com/fonts/${this.theme}/${o}.otf') format('opentype')`,{style:"normal",weight:e,display:"swap"});try{await r.load(),document.fonts.add(r),this.loadedFonts.add(t)}catch(n){console.error(`Error loading "${s}" font with "${e}" weight:`,n)}}loadThemeStyles(){return this.loadStyles?new Promise((e,s)=>{const o="/2.0.0-canary.62",t=`https://ds-assets.cupra.com${o}/styles/${this.theme}/theme.css`;if(document.head.querySelector(`link[href="${t}"]`))e();else{const r=`ui-kit-theme-${o}`,n=document.getElementById(r),i=document.createElement("link");i.id=r,i.rel="stylesheet",i.href=t,i.onload=()=>e(),i.onerror=()=>s(new Error(`Failed to load theme CSS: ${t}`)),document.head.appendChild(i),n==null||n.remove()}}):Promise.resolve()}render(){return this.cssLoaded?l.html`<slot></slot>`:l.nothing}};d([h.property({type:Boolean,converter:m.booleanConverter,attribute:"load-fonts"})],exports.DsThemeProvider.prototype,"loadFonts",2);d([h.property({type:Boolean,converter:m.booleanConverter,attribute:"load-styles"})],exports.DsThemeProvider.prototype,"loadStyles",2);d([f.provide({context:T.themeContext}),h.property({type:String})],exports.DsThemeProvider.prototype,"theme",2);d([u.state()],exports.DsThemeProvider.prototype,"cssLoaded",2);d([u.state()],exports.DsThemeProvider.prototype,"loadedFonts",2);exports.DsThemeProvider=d([p.customUiKitElement("ds-theme-provider")],exports.DsThemeProvider);
4
+ url('https://ds-assets.cupra.com/fonts/${this.theme}/${o}.otf') format('opentype')`,{style:"normal",weight:e,display:"swap"});try{await r.load(),document.fonts.add(r),this.loadedFonts.add(t)}catch(n){console.error(`Error loading "${s}" font with "${e}" weight:`,n)}}loadThemeStyles(){return this.loadStyles?new Promise((e,s)=>{const o="/2.0.0-canary.64",t=`https://ds-assets.cupra.com${o}/styles/${this.theme}/theme.css`;if(document.head.querySelector(`link[href="${t}"]`))e();else{const r=`ui-kit-theme-${o}`,n=document.getElementById(r),i=document.createElement("link");i.id=r,i.rel="stylesheet",i.href=t,i.onload=()=>e(),i.onerror=()=>s(new Error(`Failed to load theme CSS: ${t}`)),document.head.appendChild(i),n==null||n.remove()}}):Promise.resolve()}render(){return this.cssLoaded?l.html`<slot></slot>`:l.nothing}};d([h.property({type:Boolean,converter:m.booleanConverter,attribute:"load-fonts"})],exports.DsThemeProvider.prototype,"loadFonts",2);d([h.property({type:Boolean,converter:m.booleanConverter,attribute:"load-styles"})],exports.DsThemeProvider.prototype,"loadStyles",2);d([f.provide({context:T.themeContext}),h.property({type:String})],exports.DsThemeProvider.prototype,"theme",2);d([u.state()],exports.DsThemeProvider.prototype,"cssLoaded",2);d([u.state()],exports.DsThemeProvider.prototype,"loadedFonts",2);exports.DsThemeProvider=d([p.customUiKitElement("ds-theme-provider")],exports.DsThemeProvider);
@@ -1 +1 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=u=>class extends u{constructor(){super(...arguments),this.inputStates={currentValue:"",focus:!1,focusVisible:!1,invalid:!1,filled:!1,disabled:!1},this.keyboardMode=!1,this._updateStates=()=>{var t,e,s,i,n;this.inputStates.currentValue=(t=this.nativeInput)==null?void 0:t.value,this.inputStates.invalid=!((e=this.nativeInput)!=null&&e.validity.valid),this.inputStates.focus=document.activeElement===this.nativeInput,this.inputStates.disabled=(s=this.nativeInput)==null?void 0:s.disabled,this.inputStates.filled=((n=(i=this.nativeInput)==null?void 0:i.value)==null?void 0:n.length)>0,this.requestUpdate()},this._handleKeydown=()=>{this.keyboardMode=!0},this._handleMousedown=()=>{this.keyboardMode=!1},this._handlePointerdown=()=>{this.keyboardMode=!1},this._handleFocusIn=t=>{t.target===this.nativeInput&&(this.inputStates.focus=!0,this.inputStates.focusVisible=!!this.keyboardMode,this.requestUpdate())},this._handleFocusOut=()=>{this.inputStates.focus=!1,this.inputStates.focusVisible=!1,this.requestUpdate()}}onInputReady(t){}firstUpdated(t){super.firstUpdated(t),window==null||window.addEventListener("keydown",this._handleKeydown),window==null||window.addEventListener("mousedown",this._handleMousedown),window==null||window.addEventListener("pointerdown",this._handlePointerdown);const e=()=>{var i,n,a;const s=this.querySelector("input")||this.querySelector("textarea")||((i=this.shadowRoot)==null?void 0:i.querySelector("input"))||((n=this.shadowRoot)==null?void 0:n.querySelector("textarea"));s&&(this.nativeInput=s,this._setupInputObservers(),this.onInputReady(s),(a=this.hostMutationObserver)==null||a.disconnect())};e(),this.hostMutationObserver=new MutationObserver(e),this.hostMutationObserver.observe(this,{childList:!0,subtree:!0,attributes:!0})}_setupInputObservers(){this.nativeInput.addEventListener("input",this._updateStates),this.nativeInput.addEventListener("focusin",this._handleFocusIn),this.nativeInput.addEventListener("focusout",this._handleFocusOut),this.inputMutationObserver=new MutationObserver(this._updateStates),this.inputMutationObserver.observe(this.nativeInput,{attributes:!0}),this._updateStates()}disconnectedCallback(){var t,e;super.disconnectedCallback(),window==null||window.removeEventListener("keydown",this._handleKeydown),window==null||window.removeEventListener("mousedown",this._handleMousedown),window==null||window.removeEventListener("pointerdown",this._handlePointerdown),(t=this.hostMutationObserver)==null||t.disconnect(),(e=this.inputMutationObserver)==null||e.disconnect(),this.nativeInput&&(this.nativeInput.removeEventListener("input",this._updateStates),this.nativeInput.removeEventListener("focusin",this._handleFocusIn),this.nativeInput.removeEventListener("focusout",this._handleFocusOut))}};exports.inputStatesMixin=o;
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=u=>class extends u{constructor(){super(...arguments),this.inputStates={currentValue:"",focus:!1,focusVisible:!1,invalid:!1,filled:!1,disabled:!1,readonly:!1},this.keyboardMode=!1,this._updateStates=()=>{var t,e,s,i,n,a;this.inputStates.currentValue=(t=this.nativeInput)==null?void 0:t.value,this.inputStates.invalid=!((e=this.nativeInput)!=null&&e.validity.valid),this.inputStates.focus=document.activeElement===this.nativeInput,this.inputStates.disabled=(s=this.nativeInput)==null?void 0:s.disabled,this.inputStates.readonly=((i=this.nativeInput)==null?void 0:i.readOnly)??!1,this.inputStates.filled=((a=(n=this.nativeInput)==null?void 0:n.value)==null?void 0:a.length)>0,this.requestUpdate()},this._handleKeydown=()=>{this.keyboardMode=!0},this._handleMousedown=()=>{this.keyboardMode=!1},this._handlePointerdown=()=>{this.keyboardMode=!1},this._handleFocusIn=t=>{t.target===this.nativeInput&&(this.inputStates.focus=!0,this.inputStates.focusVisible=!!this.keyboardMode,this.requestUpdate())},this._handleFocusOut=()=>{this.inputStates.focus=!1,this.inputStates.focusVisible=!1,this.requestUpdate()}}onInputReady(t){}firstUpdated(t){super.firstUpdated(t),window==null||window.addEventListener("keydown",this._handleKeydown),window==null||window.addEventListener("mousedown",this._handleMousedown),window==null||window.addEventListener("pointerdown",this._handlePointerdown);const e=()=>{var i,n,a;const s=this.querySelector("input")||this.querySelector("textarea")||((i=this.shadowRoot)==null?void 0:i.querySelector("input"))||((n=this.shadowRoot)==null?void 0:n.querySelector("textarea"));s&&(this.nativeInput=s,this._setupInputObservers(),this.onInputReady(s),(a=this.hostMutationObserver)==null||a.disconnect())};e(),this.hostMutationObserver=new MutationObserver(e),this.hostMutationObserver.observe(this,{childList:!0,subtree:!0,attributes:!0})}_setupInputObservers(){this.nativeInput.addEventListener("input",this._updateStates),this.nativeInput.addEventListener("focusin",this._handleFocusIn),this.nativeInput.addEventListener("focusout",this._handleFocusOut),this.inputMutationObserver=new MutationObserver(this._updateStates),this.inputMutationObserver.observe(this.nativeInput,{attributes:!0}),this._updateStates()}disconnectedCallback(){var t,e;super.disconnectedCallback(),window==null||window.removeEventListener("keydown",this._handleKeydown),window==null||window.removeEventListener("mousedown",this._handleMousedown),window==null||window.removeEventListener("pointerdown",this._handlePointerdown),(t=this.hostMutationObserver)==null||t.disconnect(),(e=this.inputMutationObserver)==null||e.disconnect(),this.nativeInput&&(this.nativeInput.removeEventListener("input",this._updateStates),this.nativeInput.removeEventListener("focusin",this._handleFocusIn),this.nativeInput.removeEventListener("focusout",this._handleFocusOut))}};exports.inputStatesMixin=o;
@@ -1,5 +1,5 @@
1
- "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("./lit-html.cjs");/**
1
+ "use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("./lit-html.cjs");/**
2
2
  * @license
3
3
  * Copyright 2020 Google LLC
4
4
  * SPDX-License-Identifier: BSD-3-Clause
5
- */const{I:c}=a._$LH,d=()=>document.createComment(""),u=(e,r,t)=>{var s;const o=e._$AA.parentNode,A=r===void 0?e._$AB:r._$AA;if(t===void 0){const _=o.insertBefore(d(),A),$=o.insertBefore(d(),A);t=new c(_,$,e,e.options)}else{const _=t._$AB.nextSibling,$=t._$AM,l=$!==e;if(l){let i;(s=t._$AQ)==null||s.call(t,e),t._$AM=e,t._$AP!==void 0&&(i=e._$AU)!==$._$AU&&t._$AP(i)}if(_!==A||l){let i=t._$AA;for(;i!==_;){const m=i.nextSibling;o.insertBefore(i,A),i=m}}}return t},n=(e,r,t=e)=>(e._$AI(r,t),e),f={},v=(e,r=f)=>e._$AH=r,P=e=>e._$AH,g=e=>{e._$AR(),e._$AA.remove()};exports.getCommittedValue=P;exports.insertPart=u;exports.removePart=g;exports.setChildPartValue=n;exports.setCommittedValue=v;
5
+ */const{I:a}=n._$LH,c=e=>e.strings===void 0,d=()=>document.createComment(""),u=(e,r,t)=>{var $;const _=e._$AA.parentNode,s=r===void 0?e._$AB:r._$AA;if(t===void 0){const A=_.insertBefore(d(),s),o=_.insertBefore(d(),s);t=new a(A,o,e,e.options)}else{const A=t._$AB.nextSibling,o=t._$AM,l=o!==e;if(l){let i;($=t._$AQ)==null||$.call(t,e),t._$AM=e,t._$AP!==void 0&&(i=e._$AU)!==o._$AU&&t._$AP(i)}if(A!==s||l){let i=t._$AA;for(;i!==A;){const m=i.nextSibling;_.insertBefore(i,s),i=m}}}return t},f=(e,r,t=e)=>(e._$AI(r,t),e),v={},g=(e,r=v)=>e._$AH=r,P=e=>e._$AH,p=e=>{e._$AR(),e._$AA.remove()};exports.getCommittedValue=P;exports.insertPart=u;exports.isSingleExpression=c;exports.removePart=p;exports.setChildPartValue=f;exports.setCommittedValue=g;
@@ -2,4 +2,4 @@
2
2
  * @license
3
3
  * Copyright 2017 Google LLC
4
4
  * SPDX-License-Identifier: BSD-3-Clause
5
- */const s={ATTRIBUTE:1,CHILD:2},u=i=>(...t)=>({_$litDirective$:i,values:t});class ${constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,r){this._$Ct=t,this._$AM=e,this._$Ci=r}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}exports.Directive=$;exports.PartType=s;exports.directive=u;
5
+ */const s={ATTRIBUTE:1,CHILD:2,PROPERTY:3,BOOLEAN_ATTRIBUTE:4},u=i=>(...t)=>({_$litDirective$:i,values:t});class T{constructor(t){}get _$AU(){return this._$AM._$AU}_$AT(t,e,r){this._$Ct=t,this._$AM=e,this._$Ci=r}_$AS(t,e){return this.update(t,e)}update(t,e){return this.render(...e)}}exports.Directive=T;exports.PartType=s;exports.directive=u;