@luzmo/lucero 2.4.2 → 2.5.1

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 (197) hide show
  1. package/components/action-button/action-button.d.ts +3 -2
  2. package/components/action-button/index.cjs +1 -1
  3. package/components/action-button/index.js +1 -1
  4. package/components/action-button-B4_uvHiN.cjs +22 -0
  5. package/components/action-button-DU95RNNi.js +138 -0
  6. package/components/action-menu/action-menu.d.ts +16 -1
  7. package/components/action-menu/index.cjs +1 -1
  8. package/components/action-menu/index.d.ts +1 -0
  9. package/components/action-menu/index.js +1 -1
  10. package/components/{action-menu-C0sHNsjG.js → action-menu-B6nNYwlL.js} +40 -22
  11. package/components/action-menu-C_vyFNJt.cjs +58 -0
  12. package/components/badge/index.cjs +1 -1
  13. package/components/badge/index.js +1 -1
  14. package/components/badge-Bp-1d70q.js +96 -0
  15. package/components/badge-CNeUkS4b.cjs +23 -0
  16. package/components/button/index.cjs +1 -1
  17. package/components/button/index.js +1 -1
  18. package/components/button-B1V_2tHk.cjs +20 -0
  19. package/components/button-QXavBh1X.js +126 -0
  20. package/components/calendar/index.cjs +1 -1
  21. package/components/calendar/index.js +1 -1
  22. package/components/{calendar-D1UtHvpY.js → calendar-BNGwCJsG.js} +1 -1
  23. package/components/{calendar-pQxEWdYC.cjs → calendar-CLGqcox8.cjs} +1 -1
  24. package/components/checkbox/index.cjs +1 -1
  25. package/components/checkbox/index.js +1 -1
  26. package/components/{checkbox-BEjvkjfc.js → checkbox-CydI9yXG.js} +1 -1
  27. package/components/{checkbox-ClVrkeLp.cjs → checkbox-JCvBro0K.cjs} +1 -1
  28. package/components/date-range-picker/index.cjs +1 -1
  29. package/components/date-range-picker/index.js +1 -1
  30. package/components/{date-range-picker-DKVmGpUC.js → date-range-picker-5SDPe2fQ.js} +1 -1
  31. package/components/{date-range-picker-D149LIGC.cjs → date-range-picker-CLfEEYkE.cjs} +1 -1
  32. package/components/date-time-picker/index.cjs +1 -1
  33. package/components/date-time-picker/index.js +1 -1
  34. package/components/{date-time-picker-CRpvRk9T.cjs → date-time-picker-DXTksnPd.cjs} +1 -1
  35. package/components/{date-time-picker-6c19YzwF.js → date-time-picker-s3xujamC.js} +1 -1
  36. package/components/index.cjs +1 -1
  37. package/components/index.js +23 -21
  38. package/components/match-media-B_0cVVtk.cjs +18 -0
  39. package/components/match-media-C5X2OZiD.js +34 -0
  40. package/components/notice/index.cjs +1 -1
  41. package/components/notice/index.js +1 -1
  42. package/components/{notice-CsWaqcq3.cjs → notice-CQFyo6OE.cjs} +1 -1
  43. package/components/{notice-N0-lxEf_.js → notice-CQI5kFRd.js} +1 -1
  44. package/components/picker/index.cjs +1 -1
  45. package/components/picker/index.js +1 -1
  46. package/components/picker-C1tD-4ac.cjs +124 -0
  47. package/components/{picker-D0fMBZLb.js → picker-Czkf6auL.js} +7 -6
  48. package/components/progress-steps/index.cjs +1 -1
  49. package/components/progress-steps/index.js +1 -1
  50. package/components/progress-steps/progress-steps.d.ts +0 -5
  51. package/components/{progress-steps-BvCzsq9Z.js → progress-steps-CXJEaaUg.js} +2 -5
  52. package/components/{progress-steps-CvdQQwHc.cjs → progress-steps-Dqh53oC1.cjs} +2 -2
  53. package/components/prompt-box/index.cjs +1 -1
  54. package/components/prompt-box/index.js +1 -1
  55. package/components/{prompt-box-Cz_m2wso.js → prompt-box-CA8bsoZP.js} +2 -2
  56. package/components/{prompt-box-sp9_-Hnx.cjs → prompt-box-DyODaKXV.cjs} +1 -1
  57. package/components/question-box/index.cjs +1 -1
  58. package/components/question-box/index.js +1 -1
  59. package/components/{question-box-D7YSi_6c.js → question-box-DSwTpxAW.js} +4 -4
  60. package/components/{question-box-Bdtsgv1k.cjs → question-box-cBeVshAq.cjs} +1 -1
  61. package/components/search/index.cjs +1 -1
  62. package/components/search/index.js +1 -1
  63. package/components/{search-DEjLSJ96.js → search-CFTOvmWA.js} +1 -1
  64. package/components/{search-PxJEuwHt.cjs → search-DJ6KwOam.cjs} +1 -1
  65. package/components/select/index.cjs +1 -1
  66. package/components/select/index.js +1 -1
  67. package/components/{select-BUgHi69P.js → select-B86uAHme.js} +5 -4
  68. package/components/select-CKMCEJf7.cjs +158 -0
  69. package/components/status-light/index.cjs +1 -1
  70. package/components/status-light/index.js +1 -1
  71. package/components/{status-light-DwUnjE3t.js → status-light-B1T3aGJs.js} +1 -1
  72. package/components/status-light-COApWq-B.cjs +21 -0
  73. package/components/strategies-Bb7zEjrU.cjs +18 -0
  74. package/components/{strategies-Cl59wdNZ.js → strategies-COS7mShJ.js} +11 -24
  75. package/components/table/controllers/table-announcer.d.ts +12 -0
  76. package/components/table/controllers/table-column-resize.d.ts +41 -0
  77. package/components/table/controllers/table-grid-navigation.d.ts +28 -0
  78. package/components/table/controllers/table-layout.d.ts +55 -0
  79. package/components/table/controllers/table-row-expansion.d.ts +45 -0
  80. package/components/table/controllers/table-virtualizer.d.ts +42 -0
  81. package/components/table/index.cjs +18 -0
  82. package/components/table/index.d.ts +32 -0
  83. package/components/table/index.js +20 -0
  84. package/components/table/table-body.d.ts +24 -0
  85. package/components/table/table-cell.d.ts +27 -0
  86. package/components/table/table-checkbox-cell.d.ts +41 -0
  87. package/components/table/table-columns.d.ts +45 -0
  88. package/components/table/table-disclosure-cell.d.ts +21 -0
  89. package/components/table/table-head-cell.d.ts +77 -0
  90. package/components/table/table-head.d.ts +34 -0
  91. package/components/table/table-model.d.ts +56 -0
  92. package/components/table/table-row-details.d.ts +29 -0
  93. package/components/table/table-row.d.ts +64 -0
  94. package/components/table/table-styles.d.ts +9 -0
  95. package/components/table/table-templates.d.ts +41 -0
  96. package/components/table/table.d.ts +197 -0
  97. package/components/table/types.d.ts +81 -0
  98. package/components/table-BckZkgeh.js +1601 -0
  99. package/components/table-Bcq2K21l.cjs +180 -0
  100. package/components/tabs/index.cjs +1 -1
  101. package/components/tabs/index.js +1 -1
  102. package/components/{tabs-DxOD4QNt.cjs → tabs-CMU8X4ho.cjs} +1 -1
  103. package/components/{tabs-BD_ATrBg.js → tabs-D8U2PxcE.js} +1 -1
  104. package/components/tags/index.cjs +1 -1
  105. package/components/tags/index.js +1 -1
  106. package/components/tags-D8F1o4UZ.cjs +47 -0
  107. package/components/tags-ZzY_q4TH.js +208 -0
  108. package/components/template-property-DNDi7lQv.js +47 -0
  109. package/components/template-property-yhcAmPXk.cjs +18 -0
  110. package/components/utils.cjs +1 -1
  111. package/components/utils.js +2 -1
  112. package/custom-elements.json +1 -1
  113. package/index.d.ts +1 -0
  114. package/package.json +9 -1
  115. package/standalone/accordion.js +1 -1
  116. package/standalone/action-bar.js +1 -1
  117. package/standalone/action-button.js +1 -1
  118. package/standalone/action-menu.js +5 -3
  119. package/standalone/avatar.js +1 -1
  120. package/standalone/badge.js +1 -1
  121. package/standalone/button.js +1 -1
  122. package/standalone/calendar.js +1 -1
  123. package/standalone/checkbox.js +1 -1
  124. package/standalone/chunks/action-button-BJGE_BDu.js +6 -0
  125. package/standalone/chunks/badge-SNXdnyCZ.js +7 -0
  126. package/standalone/chunks/button-DHan4NJY.js +4 -0
  127. package/standalone/chunks/{button-Dykw3TSO.js → button-DTL9dD2r.js} +1 -1
  128. package/standalone/chunks/{calendar-ZwUYkzVq.js → calendar-BOzu003d.js} +1 -1
  129. package/standalone/chunks/{checkbox-OQtakoP8.js → checkbox-DQ4wPgG_.js} +2 -2
  130. package/standalone/chunks/{clear-button-pVGfwye8.js → clear-button-3zpCVxG5.js} +1 -1
  131. package/standalone/chunks/{close-button-RpPiwBdf.js → close-button-C96dazyi.js} +1 -1
  132. package/standalone/chunks/{color-field-CrCF4kqZ.js → color-field-BFvUGE4L.js} +1 -1
  133. package/standalone/chunks/{color-menu-B5UOMYmX.js → color-menu-BIKuitbH.js} +2 -2
  134. package/standalone/chunks/{icon-Dy6J1QeX.js → icon-BypO7M7G.js} +1 -1
  135. package/standalone/chunks/luzmo-icons-B-pCv-xg.js +13 -0
  136. package/standalone/chunks/match-media-BMi7j6hf.js +2 -0
  137. package/standalone/chunks/{menu-nolJetlp.js → menu-DSMoQt1w.js} +1 -1
  138. package/standalone/chunks/{number-field-C3DYfl1s.js → number-field-B6BDXkL7.js} +3 -3
  139. package/standalone/chunks/{options-BjRSj630.js → options-CkmITqgV.js} +5 -5
  140. package/standalone/chunks/{picker-button-BeXTIgUt.js → picker-button-BZWqDoNQ.js} +1 -1
  141. package/{components/picker-BliQJlY_.cjs → standalone/chunks/picker-jZI5AjVJ.js} +31 -47
  142. package/standalone/chunks/{segments-factory-Ch3AAizU.js → segments-factory-Da9ojsLC.js} +1 -1
  143. package/standalone/chunks/strategies-C-vW4MlK.js +2 -0
  144. package/standalone/chunks/{swatch-m_4GcO2_.js → swatch-CGR_GWqO.js} +1 -1
  145. package/standalone/chunks/template-property-Dn64faHO.js +2 -0
  146. package/standalone/chunks/{text-field-BnZtyodU.js → text-field-4OKvLOXG.js} +1 -1
  147. package/standalone/chunks/{text-field-BrlDeJsx.js → text-field-C2oROxum.js} +1 -1
  148. package/standalone/clear-button.js +1 -1
  149. package/standalone/close-button.js +1 -1
  150. package/standalone/color-field.js +1 -1
  151. package/standalone/color-menu.js +1 -1
  152. package/standalone/color-picker.js +1 -1
  153. package/standalone/date-range-picker.js +1 -1
  154. package/standalone/date-time-picker.js +1 -1
  155. package/standalone/icon.js +1 -1
  156. package/standalone/manifest.json +25 -22
  157. package/standalone/menu.js +1 -1
  158. package/standalone/multi-language-field.js +1 -1
  159. package/standalone/notice.js +1 -1
  160. package/standalone/number-field.js +1 -1
  161. package/standalone/options.js +1 -1
  162. package/standalone/picker-button.js +1 -1
  163. package/standalone/picker.js +1 -1
  164. package/standalone/progress-steps.js +2 -2
  165. package/standalone/prompt-box.js +9 -9
  166. package/standalone/question-box.js +1 -1
  167. package/standalone/search.js +1 -1
  168. package/standalone/select.js +2 -2
  169. package/standalone/slider.js +1 -1
  170. package/standalone/status-light.js +1 -1
  171. package/standalone/swatch.js +1 -1
  172. package/standalone/table.js +185 -0
  173. package/standalone/tabs.js +1 -1
  174. package/standalone/tags.js +1 -1
  175. package/standalone/text-field.js +1 -1
  176. package/standalone/toast.js +1 -1
  177. package/standalone/utils.js +1 -1
  178. package/utils/index.d.ts +1 -0
  179. package/utils/template-property.d.ts +13 -0
  180. package/components/action-button-BRijXjEz.js +0 -138
  181. package/components/action-button-CX1uYbQp.cjs +0 -22
  182. package/components/action-menu-CwzRbF61.cjs +0 -56
  183. package/components/badge-D2Hjf-Ww.js +0 -96
  184. package/components/badge-D8pIDEoq.cjs +0 -23
  185. package/components/button-Bvnidb4x.cjs +0 -20
  186. package/components/button-DIV_j_U3.js +0 -126
  187. package/components/select-DsGVB01K.cjs +0 -158
  188. package/components/status-light-D3hdx8Pd.cjs +0 -21
  189. package/components/strategies-BwNbUXYS.cjs +0 -18
  190. package/components/tags-BIpFgOYy.js +0 -208
  191. package/components/tags-fLCGajv_.cjs +0 -47
  192. package/standalone/chunks/action-button-BzzPBqt5.js +0 -6
  193. package/standalone/chunks/badge-DD-tMgzi.js +0 -7
  194. package/standalone/chunks/button-Bv3v7VbN.js +0 -4
  195. package/standalone/chunks/luzmo-icons-CJa-aByT.js +0 -13
  196. package/standalone/chunks/picker-hbMQOkUX.js +0 -108
  197. package/standalone/chunks/strategies-kad_0dTB.js +0 -2
@@ -1,56 +0,0 @@
1
- /*! * Lucero - The design system for Luzmo.
2
- *
3
- * Copyright © 2026 Luzmo
4
- * All rights reserved.
5
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
6
- * This license allows users with a current active Luzmo account to use Lucero.
7
- * This license terminates automatically if a user no longer has an active Luzmo account.
8
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
9
- *
10
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
11
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
12
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
13
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
14
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
15
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
16
- * SOFTWARE.
17
- * */
18
- require("./tokens.cjs");const e=require("./decorate-Dq34MBGe.cjs");require("./icon-zOPAWCdx.cjs");const t=require("./observe-slot-text-CvL-2ey3.cjs");require("./popover-BsdqkvKI.cjs"),require("./action-button-CX1uYbQp.cjs");const n=require("./observe-slot-presence-CS8pMePk.cjs"),r=require("./slottable-request-event-C6eb7Ch3.cjs");require("./overlay-Dn7EbA_W.cjs");const i=require("./picker-BliQJlY_.cjs");let a=require("lit"),o=require("lit/decorators.js"),s=require("@luzmo/icons"),c=require("lit/directives/if-defined.js");var l=`:host{display:inline-flex}:host([quiet]){min-width:0}:host>luzmo-menu{display:none}::slotted([slot=icon]),.icon{flex-shrink:0}#popover{max-width:none}:host([dir=ltr]) ::slotted([slot=icon]),:host([dir=ltr]) .icon{margin-left:calc(-1 * (var(--luzmo-action-button-textonly-padding-left-adjusted) - var(--luzmo-action-button-padding-left-adjusted)))}:host([dir=rtl]) ::slotted([slot=icon]),:host([dir=rtl]) .icon{margin-right:calc(-1 * (var(--luzmo-action-button-textonly-padding-left-adjusted) - var(--luzmo-action-button-padding-left-adjusted)))}:host([dir]) slot[icon-only]::slotted([slot=icon]),:host([dir]) slot[icon-only] .icon{margin-inline:calc((var(--luzmo-action-button-edge-to-text,var(--action-button-edge-to-text)) - var(--luzmo-action-button-edge-to-visual-only,var(--action-button-edge-to-visual-only))) * -1)}luzmo-overlay:not(:defined){display:none}`,u=class extends n.t(t.t(i.r,`label`),`[slot="label-only"]`){constructor(...e){super(...e),this.selects=void 0,this.listRole=`menu`,this.itemRole=`menuitem`,this.handleSlottableRequest=e=>{this.dispatchEvent(new r.t(e.name,e.data))}}static get styles(){return[(0,a.unsafeCSS)(l)]}get hasLabel(){return this.slotHasContent}get labelOnly(){return this.slotContentIsPresent}get buttonContent(){return[a.html`
19
- ${this.labelOnly?a.html``:a.html`
20
- <slot
21
- name="icon"
22
- slot="icon"
23
- ?icon-only=${!this.hasLabel}
24
- ?hidden=${this.labelOnly}
25
- >
26
- <luzmo-icon
27
- class="icon"
28
- .icon=${s.luzmoEllipsisHorizontal}
29
- size=${this.size}
30
- ></luzmo-icon>
31
- </slot>
32
- `}
33
- <slot name="label" ?hidden=${!this.hasLabel}></slot>
34
- <slot name="label-only"></slot>
35
- <slot name="tooltip" @slotchange=${this.handleTooltipSlotchange}></slot>
36
- `]}render(){return this.tooltipEl&&(this.tooltipEl.disabled=this.open),a.html`
37
- <luzmo-action-button
38
- aria-describedby=${i.t}
39
- ?quiet=${this.quiet}
40
- static-color=${(0,c.ifDefined)(this.staticColor)}
41
- aria-haspopup="true"
42
- aria-controls=${(0,c.ifDefined)(this.open?`menu`:void 0)}
43
- aria-expanded=${this.open?`true`:`false`}
44
- aria-label=${(0,c.ifDefined)(this.label||void 0)}
45
- id="button"
46
- class="button"
47
- size=${this.size}
48
- @blur=${this.handleButtonBlur}
49
- @focus=${this.handleButtonFocus}
50
- @keydown=${{handleEvent:this.handleEnterKeydown,capture:!0}}
51
- ?disabled=${this.disabled}
52
- >
53
- ${this.buttonContent}
54
- </luzmo-action-button>
55
- ${this.renderMenu} ${this.renderDescriptionSlot}
56
- `}update(e){e.has(`invalid`)&&(this.invalid=!1),super.update(e)}};e.t([(0,o.property)({type:String})],u.prototype,`selects`,void 0),e.t([(0,o.property)({reflect:!0,attribute:`static-color`})],u.prototype,`staticColor`,void 0),e.t([(0,o.state)()],u.prototype,`labelOnly`,null),customElements.get(`luzmo-action-menu`)||customElements.define(`luzmo-action-menu`,u),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return u}});
@@ -1,96 +0,0 @@
1
- /*! * Lucero - The design system for Luzmo.
2
- *
3
- * Copyright © 2026 Luzmo
4
- * All rights reserved.
5
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
6
- * This license allows users with a current active Luzmo account to use Lucero.
7
- * This license terminates automatically if a user no longer has an active Luzmo account.
8
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
9
- *
10
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
11
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
12
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
13
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
14
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
15
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
16
- * SOFTWARE.
17
- * */
18
- import "./tokens.js";
19
- import { n as e, t } from "./decorate-CkCg3wfh.js";
20
- import { n } from "./sized-mixin-DzQTebN-.js";
21
- import { t as r } from "./observe-slot-text-Db8Kx3P-.js";
22
- import { n as i } from "./language-resolution-BaKYDD1a.js";
23
- import { html as a, unsafeCSS as o } from "lit";
24
- import { property as s } from "lit/decorators.js";
25
- //#region src/components/badge/badge.module.scss?inline
26
- var c = ":host{font-family:var(--luzmo-badge-font-family,var(--luzmo-font-family));background-color:var(--highcontrast-badge-background-color,var(--luzmo-badge-background-color,var(--badge-background-color)));color:var(--highcontrast-badge-content-color,var(--luzmo-badge-content-color,var(--badge-content-color)));border-radius:var(--luzmo-badge-border-radius,var(--badge-border-radius));min-block-size:var(--luzmo-badge-height,var(--badge-height));box-sizing:border-box;vertical-align:bottom;max-inline-size:var(--luzmo-badge-max-inline-size,none);-webkit-user-select:none;user-select:none;transition:border-color var(--luzmo-badge-animation-duration,var(--badge-animation-duration)) ease-in-out, color var(--luzmo-badge-animation-duration,var(--badge-animation-duration)) ease-in-out, background-color var(--luzmo-badge-animation-duration,var(--badge-animation-duration)) ease-in-out;padding-inline:calc(var(--luzmo-badge-spacing-inline,var(--badge-spacing-inline)) - var(--luzmo-badge-border-width,var(--badge-border-width)));padding-block:var(--luzmo-spacing-1);justify-content:center;align-items:center;gap:var(--luzmo-badge-icon-spacing-inline-end,var(--badge-icon-spacing-inline-end));outline:none;display:inline-flex;position:relative;border-color:var(--highcontrast-badge-border-color,var(--luzmo-badge-border-color,var(--badge-border-color)))!important;border-width:var(--luzmo-badge-border-width,var(--badge-border-width))!important;border-style:solid!important}::slotted([slot=icon]){--icon-size:var(--luzmo-badge-icon-size,var(--badge-icon-size,calc(var(--luzmo-badge-height,var(--badge-height)) - var(--luzmo-badge-border-width,var(--badge-border-width)) * 2 - var(--luzmo-badge-icon-padding,4px) * 2)));flex-shrink:0;align-self:center}.label{box-sizing:border-box;line-height:1.3;font-weight:var(--luzmo-badge-font-weight,var(--badge-font-weight));font-size:var(--luzmo-badge-font-size,var(--badge-font-size));cursor:default;display:block}:host([data-luzmo-language-script=Latn]) .label{text-box:trim-both cap alphabetic;margin-block:-.35em;padding-block:.35em}@supports (text-box-trim:trim-both){:host([data-luzmo-language-script=Latn]) .label{padding-block:calc(.35em + .5lh - .5cap)}}.label[hidden]{display:none!important}:host([icon-only]){padding-block:0;padding-inline:calc(var(--luzmo-badge-spacing-inline,var(--badge-spacing-inline)) * 1.25 - var(--luzmo-badge-border-width,var(--badge-border-width)));gap:0}:host([icon-only]) ::slotted([slot=icon]){align-self:center}:host([fixed]){border-radius:var(--luzmo-border-radius)}:host([fixed=block-start]){border-start-start-radius:0;border-start-end-radius:0}:host([fixed=block-end]){border-end-end-radius:0;border-end-start-radius:0}:host([fixed=inline-start]){border-start-start-radius:0;border-end-start-radius:0}:host([fixed=inline-end]){border-start-end-radius:0;border-end-end-radius:0}@media (forced-colors:active){:host{--highcontrast-badge-border-color:ButtonText;--highcontrast-badge-background-color:ButtonFace;--highcontrast-badge-content-color:ButtonText;forced-color-adjust:none}:host([treatment=fill]){--highcontrast-badge-background-color:Highlight;--highcontrast-badge-content-color:HighlightText;--highcontrast-badge-border-color:Highlight}}:host{--badge-border-color:var(--luzmo-border-color-full);--badge-background-color:transparent;--badge-content-color:var(--luzmo-font-color);--badge-border-width:var(--luzmo-border-width);--badge-border-radius:calc(var(--badge-height) / 2);--badge-animation-duration:var(--luzmo-animation-duration);--badge-font-weight:var(--luzmo-font-weight);--badge-label-line-height:var(--luzmo-line-height);--badge-icon-spacing-inline-end:var(--luzmo-spacing-2);--badge-subtle-background-opacity:10%;--badge-subtle-content-mix:57%}:host([size=xs]){--badge-height:var(--luzmo-component-height-xxs);--badge-font-size:var(--luzmo-font-size-xs);--badge-icon-size:var(--luzmo-icon-size-xxs);--badge-spacing-inline:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--badge-icon-spacing-inline-end:var(--luzmo-spacing-2)}:host([size=s]){--badge-height:var(--luzmo-component-height-xs);--badge-font-size:var(--luzmo-font-size-s);--badge-icon-size:var(--luzmo-icon-size-s);--badge-spacing-inline:var(--luzmo-spacing-3);--badge-icon-spacing-inline-end:var(--luzmo-spacing-2)}:host{--badge-height:var(--luzmo-component-height-s);--badge-font-size:var(--luzmo-font-size);--badge-icon-size:var(--luzmo-icon-size-m);--badge-spacing-inline:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=l]){--badge-height:var(--luzmo-component-height);--badge-font-size:var(--luzmo-font-size);--badge-icon-size:var(--luzmo-icon-size-l);--badge-spacing-inline:var(--luzmo-spacing-4);--badge-icon-spacing-inline-end:var(--luzmo-spacing-3)}:host([size=xl]){--badge-height:var(--luzmo-component-height-l);--badge-font-size:var(--luzmo-font-size-l);--badge-icon-size:var(--luzmo-icon-size-xl);--badge-spacing-inline:var(--luzmo-spacing-5);--badge-icon-spacing-inline-end:var(--luzmo-spacing-3)}:host([size=xs]:not([icon-only])){--badge-icon-size:var(--luzmo-icon-size-xxs)}:host([size=s]:not([icon-only])){--badge-icon-size:var(--luzmo-icon-size-xs)}:host(:not([icon-only])){--badge-icon-size:var(--luzmo-icon-size-s)}:host([size=l]:not([icon-only])){--badge-icon-size:var(--luzmo-icon-size-m)}:host([size=xl]:not([icon-only])){--badge-icon-size:var(--luzmo-icon-size-l)}:host([variant=neutral]){--badge-border-color:var(--luzmo-border-color-full);--badge-content-color:var(--luzmo-font-color);--badge-fill-background-color:var(--luzmo-selected-color-hard);--badge-fill-content-color:var(--luzmo-background-color);--badge-subtle-content-color:var(--luzmo-neutral-on-subtle-color)}:host([variant=accent]){--badge-border-color:var(--luzmo-primary);--badge-content-color:var(--luzmo-primary);--badge-fill-background-color:var(--luzmo-primary);--badge-fill-content-color:var(--luzmo-primary-inverse-color);--badge-subtle-content-color:var(--luzmo-accent-on-subtle-color)}:host([variant=informative]){--badge-border-color:var(--luzmo-informative-color);--badge-content-color:var(--luzmo-informative-color);--badge-fill-background-color:var(--luzmo-informative-color);--badge-fill-content-color:var(--luzmo-informative-inverse-color);--badge-subtle-content-color:var(--luzmo-informative-on-subtle-color)}:host([variant=positive]){--badge-border-color:var(--luzmo-positive-color);--badge-content-color:var(--luzmo-positive-color);--badge-fill-background-color:var(--luzmo-positive-color);--badge-fill-content-color:var(--luzmo-positive-inverse-color);--badge-subtle-content-color:var(--luzmo-positive-on-subtle-color)}:host([variant=negative]){--badge-border-color:var(--luzmo-negative-color);--badge-content-color:var(--luzmo-negative-color);--badge-fill-background-color:var(--luzmo-negative-color);--badge-fill-content-color:var(--luzmo-negative-inverse-color);--badge-subtle-content-color:var(--luzmo-negative-on-subtle-color)}:host([variant=notice]){--badge-border-color:var(--luzmo-notice-color);--badge-content-color:var(--luzmo-notice-color);--badge-fill-background-color:var(--luzmo-notice-color);--badge-fill-content-color:var(--luzmo-notice-inverse-color);--badge-subtle-content-color:var(--luzmo-notice-on-subtle-color)}:host([variant=seafoam]){--badge-border-color:var(--luzmo-seafoam-color);--badge-content-color:var(--luzmo-seafoam-color);--badge-fill-background-color:var(--luzmo-seafoam-color);--badge-fill-content-color:white}:host([variant=indigo]){--badge-border-color:var(--luzmo-indigo-color);--badge-content-color:var(--luzmo-indigo-color);--badge-fill-background-color:var(--luzmo-indigo-color);--badge-fill-content-color:white}:host([variant=purple]){--badge-border-color:var(--luzmo-purple-color);--badge-content-color:var(--luzmo-purple-color);--badge-fill-background-color:var(--luzmo-purple-color);--badge-fill-content-color:white}:host([variant=fuchsia]){--badge-border-color:var(--luzmo-fuchsia-color);--badge-content-color:var(--luzmo-fuchsia-color);--badge-fill-background-color:var(--luzmo-fuchsia-color);--badge-fill-content-color:white}:host([variant=magenta]){--badge-border-color:var(--luzmo-magenta-color);--badge-content-color:var(--luzmo-magenta-color);--badge-fill-background-color:var(--luzmo-magenta-color);--badge-fill-content-color:white}:host([variant=yellow]){--badge-border-color:var(--luzmo-yellow-color);--badge-content-color:var(--luzmo-yellow-color);--badge-fill-background-color:var(--luzmo-yellow-color);--badge-fill-content-color:black}:host([variant=gray]){--badge-border-color:var(--luzmo-gray-color);--badge-content-color:var(--luzmo-gray-color);--badge-fill-background-color:var(--luzmo-gray-color);--badge-fill-content-color:white}:host([variant=red]){--badge-border-color:var(--luzmo-red-color);--badge-content-color:var(--luzmo-red-color);--badge-fill-background-color:var(--luzmo-red-color);--badge-fill-content-color:white}:host([variant=orange]){--badge-border-color:var(--luzmo-orange-color);--badge-content-color:var(--luzmo-orange-color);--badge-fill-background-color:var(--luzmo-orange-color);--badge-fill-content-color:black}:host([variant=chartreuse]){--badge-border-color:var(--luzmo-chartreuse-color);--badge-content-color:var(--luzmo-chartreuse-color);--badge-fill-background-color:var(--luzmo-chartreuse-color);--badge-fill-content-color:white}:host([variant=celery]){--badge-border-color:var(--luzmo-celery-color);--badge-content-color:var(--luzmo-celery-color);--badge-fill-background-color:var(--luzmo-celery-color);--badge-fill-content-color:black}:host([variant=green]){--badge-border-color:var(--luzmo-green-color);--badge-content-color:var(--luzmo-green-color);--badge-fill-background-color:var(--luzmo-green-color);--badge-fill-content-color:white}:host([variant=cyan]){--badge-border-color:var(--luzmo-cyan-color);--badge-content-color:var(--luzmo-cyan-color);--badge-fill-background-color:var(--luzmo-cyan-color);--badge-fill-content-color:white}:host([variant=blue]){--badge-border-color:var(--luzmo-blue-color);--badge-content-color:var(--luzmo-blue-color);--badge-fill-background-color:var(--luzmo-blue-color);--badge-fill-content-color:white}:host([treatment=outline]){--badge-background-color:transparent}:host([treatment=subtle]){--badge-subtle-color:var(--badge-fill-background-color,var(--luzmo-selected-color-hard));--badge-background-color:color-mix(in srgb, var(--badge-subtle-color) var(--badge-subtle-background-opacity), var(--luzmo-background-color));--badge-content-color:var(--badge-subtle-content-color,color-mix(in oklch, var(--badge-subtle-color), var(--luzmo-font-color) var(--badge-subtle-content-mix)))}:host([treatment=fill]){--badge-background-color:var(--badge-fill-background-color,var(--luzmo-selected-color-hard));--badge-content-color:var(--badge-fill-content-color,white);--badge-border-color:transparent}", l = [
27
- "accent",
28
- "neutral",
29
- "informative",
30
- "positive",
31
- "negative",
32
- "notice",
33
- "seafoam",
34
- "indigo",
35
- "purple",
36
- "fuchsia",
37
- "magenta",
38
- "yellow",
39
- "gray",
40
- "red",
41
- "orange",
42
- "chartreuse",
43
- "celery",
44
- "green",
45
- "cyan",
46
- "blue"
47
- ], u = class extends n(r(e), {
48
- validSizes: [
49
- "xs",
50
- "s",
51
- "m",
52
- "l",
53
- "xl"
54
- ],
55
- noDefaultSize: !0
56
- }) {
57
- constructor(...e) {
58
- super(...e), this._languageScript = new i(this), this._variant = "neutral", this.treatment = "outline";
59
- }
60
- static get styles() {
61
- return [o(c)];
62
- }
63
- get variant() {
64
- return this._variant;
65
- }
66
- set variant(e) {
67
- e !== this._variant && (l.includes(e) ? (this._variant = e, this.setAttribute("variant", e)) : (this._variant = "neutral", this.setAttribute("variant", "neutral")));
68
- }
69
- handleIconSlotChange(e) {
70
- e.target.assignedElements().forEach((e) => {
71
- e.tagName.toLowerCase() === "luzmo-icon" && e.setAttribute("block", "");
72
- });
73
- }
74
- get hasLabel() {
75
- return this.slotHasContent;
76
- }
77
- render() {
78
- return a`
79
- <slot name="icon" @slotchange=${this.handleIconSlotChange}></slot>
80
- <span class="label" ?hidden=${!this.hasLabel}>
81
- <slot @slotchange=${this.manageTextObservedSlot}></slot>
82
- </span>
83
- `;
84
- }
85
- updated(e) {
86
- super.updated(e), this.toggleAttribute("icon-only", !this.slotHasContent);
87
- }
88
- firstUpdated(e) {
89
- super.firstUpdated(e), this.hasAttribute("role") || this.setAttribute("role", "status"), this.hasAttribute("variant") || this.setAttribute("variant", this.variant), this.hasAttribute("treatment") || this.setAttribute("treatment", this.treatment);
90
- }
91
- };
92
- //#endregion
93
- //#region src/components/badge/index.ts
94
- t([s({ reflect: !0 })], u.prototype, "variant", null), t([s({ reflect: !0 })], u.prototype, "treatment", void 0), t([s({ reflect: !0 })], u.prototype, "fixed", void 0), customElements.get("luzmo-badge") || customElements.define("luzmo-badge", u);
95
- //#endregion
96
- export { u as t };
@@ -1,23 +0,0 @@
1
- /*! * Lucero - The design system for Luzmo.
2
- *
3
- * Copyright © 2026 Luzmo
4
- * All rights reserved.
5
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
6
- * This license allows users with a current active Luzmo account to use Lucero.
7
- * This license terminates automatically if a user no longer has an active Luzmo account.
8
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
9
- *
10
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
11
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
12
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
13
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
14
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
15
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
16
- * SOFTWARE.
17
- * */
18
- require("./tokens.cjs");const e=require("./decorate-Dq34MBGe.cjs"),t=require("./sized-mixin-BT7cv-fT.cjs"),n=require("./observe-slot-text-CvL-2ey3.cjs"),r=require("./language-resolution-CSjktYg5.cjs");let i=require("lit"),a=require("lit/decorators.js");var o=`:host{font-family:var(--luzmo-badge-font-family,var(--luzmo-font-family));background-color:var(--highcontrast-badge-background-color,var(--luzmo-badge-background-color,var(--badge-background-color)));color:var(--highcontrast-badge-content-color,var(--luzmo-badge-content-color,var(--badge-content-color)));border-radius:var(--luzmo-badge-border-radius,var(--badge-border-radius));min-block-size:var(--luzmo-badge-height,var(--badge-height));box-sizing:border-box;vertical-align:bottom;max-inline-size:var(--luzmo-badge-max-inline-size,none);-webkit-user-select:none;user-select:none;transition:border-color var(--luzmo-badge-animation-duration,var(--badge-animation-duration)) ease-in-out, color var(--luzmo-badge-animation-duration,var(--badge-animation-duration)) ease-in-out, background-color var(--luzmo-badge-animation-duration,var(--badge-animation-duration)) ease-in-out;padding-inline:calc(var(--luzmo-badge-spacing-inline,var(--badge-spacing-inline)) - var(--luzmo-badge-border-width,var(--badge-border-width)));padding-block:var(--luzmo-spacing-1);justify-content:center;align-items:center;gap:var(--luzmo-badge-icon-spacing-inline-end,var(--badge-icon-spacing-inline-end));outline:none;display:inline-flex;position:relative;border-color:var(--highcontrast-badge-border-color,var(--luzmo-badge-border-color,var(--badge-border-color)))!important;border-width:var(--luzmo-badge-border-width,var(--badge-border-width))!important;border-style:solid!important}::slotted([slot=icon]){--icon-size:var(--luzmo-badge-icon-size,var(--badge-icon-size,calc(var(--luzmo-badge-height,var(--badge-height)) - var(--luzmo-badge-border-width,var(--badge-border-width)) * 2 - var(--luzmo-badge-icon-padding,4px) * 2)));flex-shrink:0;align-self:center}.label{box-sizing:border-box;line-height:1.3;font-weight:var(--luzmo-badge-font-weight,var(--badge-font-weight));font-size:var(--luzmo-badge-font-size,var(--badge-font-size));cursor:default;display:block}:host([data-luzmo-language-script=Latn]) .label{text-box:trim-both cap alphabetic;margin-block:-.35em;padding-block:.35em}@supports (text-box-trim:trim-both){:host([data-luzmo-language-script=Latn]) .label{padding-block:calc(.35em + .5lh - .5cap)}}.label[hidden]{display:none!important}:host([icon-only]){padding-block:0;padding-inline:calc(var(--luzmo-badge-spacing-inline,var(--badge-spacing-inline)) * 1.25 - var(--luzmo-badge-border-width,var(--badge-border-width)));gap:0}:host([icon-only]) ::slotted([slot=icon]){align-self:center}:host([fixed]){border-radius:var(--luzmo-border-radius)}:host([fixed=block-start]){border-start-start-radius:0;border-start-end-radius:0}:host([fixed=block-end]){border-end-end-radius:0;border-end-start-radius:0}:host([fixed=inline-start]){border-start-start-radius:0;border-end-start-radius:0}:host([fixed=inline-end]){border-start-end-radius:0;border-end-end-radius:0}@media (forced-colors:active){:host{--highcontrast-badge-border-color:ButtonText;--highcontrast-badge-background-color:ButtonFace;--highcontrast-badge-content-color:ButtonText;forced-color-adjust:none}:host([treatment=fill]){--highcontrast-badge-background-color:Highlight;--highcontrast-badge-content-color:HighlightText;--highcontrast-badge-border-color:Highlight}}:host{--badge-border-color:var(--luzmo-border-color-full);--badge-background-color:transparent;--badge-content-color:var(--luzmo-font-color);--badge-border-width:var(--luzmo-border-width);--badge-border-radius:calc(var(--badge-height) / 2);--badge-animation-duration:var(--luzmo-animation-duration);--badge-font-weight:var(--luzmo-font-weight);--badge-label-line-height:var(--luzmo-line-height);--badge-icon-spacing-inline-end:var(--luzmo-spacing-2);--badge-subtle-background-opacity:10%;--badge-subtle-content-mix:57%}:host([size=xs]){--badge-height:var(--luzmo-component-height-xxs);--badge-font-size:var(--luzmo-font-size-xs);--badge-icon-size:var(--luzmo-icon-size-xxs);--badge-spacing-inline:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--badge-icon-spacing-inline-end:var(--luzmo-spacing-2)}:host([size=s]){--badge-height:var(--luzmo-component-height-xs);--badge-font-size:var(--luzmo-font-size-s);--badge-icon-size:var(--luzmo-icon-size-s);--badge-spacing-inline:var(--luzmo-spacing-3);--badge-icon-spacing-inline-end:var(--luzmo-spacing-2)}:host{--badge-height:var(--luzmo-component-height-s);--badge-font-size:var(--luzmo-font-size);--badge-icon-size:var(--luzmo-icon-size-m);--badge-spacing-inline:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=l]){--badge-height:var(--luzmo-component-height);--badge-font-size:var(--luzmo-font-size);--badge-icon-size:var(--luzmo-icon-size-l);--badge-spacing-inline:var(--luzmo-spacing-4);--badge-icon-spacing-inline-end:var(--luzmo-spacing-3)}:host([size=xl]){--badge-height:var(--luzmo-component-height-l);--badge-font-size:var(--luzmo-font-size-l);--badge-icon-size:var(--luzmo-icon-size-xl);--badge-spacing-inline:var(--luzmo-spacing-5);--badge-icon-spacing-inline-end:var(--luzmo-spacing-3)}:host([size=xs]:not([icon-only])){--badge-icon-size:var(--luzmo-icon-size-xxs)}:host([size=s]:not([icon-only])){--badge-icon-size:var(--luzmo-icon-size-xs)}:host(:not([icon-only])){--badge-icon-size:var(--luzmo-icon-size-s)}:host([size=l]:not([icon-only])){--badge-icon-size:var(--luzmo-icon-size-m)}:host([size=xl]:not([icon-only])){--badge-icon-size:var(--luzmo-icon-size-l)}:host([variant=neutral]){--badge-border-color:var(--luzmo-border-color-full);--badge-content-color:var(--luzmo-font-color);--badge-fill-background-color:var(--luzmo-selected-color-hard);--badge-fill-content-color:var(--luzmo-background-color);--badge-subtle-content-color:var(--luzmo-neutral-on-subtle-color)}:host([variant=accent]){--badge-border-color:var(--luzmo-primary);--badge-content-color:var(--luzmo-primary);--badge-fill-background-color:var(--luzmo-primary);--badge-fill-content-color:var(--luzmo-primary-inverse-color);--badge-subtle-content-color:var(--luzmo-accent-on-subtle-color)}:host([variant=informative]){--badge-border-color:var(--luzmo-informative-color);--badge-content-color:var(--luzmo-informative-color);--badge-fill-background-color:var(--luzmo-informative-color);--badge-fill-content-color:var(--luzmo-informative-inverse-color);--badge-subtle-content-color:var(--luzmo-informative-on-subtle-color)}:host([variant=positive]){--badge-border-color:var(--luzmo-positive-color);--badge-content-color:var(--luzmo-positive-color);--badge-fill-background-color:var(--luzmo-positive-color);--badge-fill-content-color:var(--luzmo-positive-inverse-color);--badge-subtle-content-color:var(--luzmo-positive-on-subtle-color)}:host([variant=negative]){--badge-border-color:var(--luzmo-negative-color);--badge-content-color:var(--luzmo-negative-color);--badge-fill-background-color:var(--luzmo-negative-color);--badge-fill-content-color:var(--luzmo-negative-inverse-color);--badge-subtle-content-color:var(--luzmo-negative-on-subtle-color)}:host([variant=notice]){--badge-border-color:var(--luzmo-notice-color);--badge-content-color:var(--luzmo-notice-color);--badge-fill-background-color:var(--luzmo-notice-color);--badge-fill-content-color:var(--luzmo-notice-inverse-color);--badge-subtle-content-color:var(--luzmo-notice-on-subtle-color)}:host([variant=seafoam]){--badge-border-color:var(--luzmo-seafoam-color);--badge-content-color:var(--luzmo-seafoam-color);--badge-fill-background-color:var(--luzmo-seafoam-color);--badge-fill-content-color:white}:host([variant=indigo]){--badge-border-color:var(--luzmo-indigo-color);--badge-content-color:var(--luzmo-indigo-color);--badge-fill-background-color:var(--luzmo-indigo-color);--badge-fill-content-color:white}:host([variant=purple]){--badge-border-color:var(--luzmo-purple-color);--badge-content-color:var(--luzmo-purple-color);--badge-fill-background-color:var(--luzmo-purple-color);--badge-fill-content-color:white}:host([variant=fuchsia]){--badge-border-color:var(--luzmo-fuchsia-color);--badge-content-color:var(--luzmo-fuchsia-color);--badge-fill-background-color:var(--luzmo-fuchsia-color);--badge-fill-content-color:white}:host([variant=magenta]){--badge-border-color:var(--luzmo-magenta-color);--badge-content-color:var(--luzmo-magenta-color);--badge-fill-background-color:var(--luzmo-magenta-color);--badge-fill-content-color:white}:host([variant=yellow]){--badge-border-color:var(--luzmo-yellow-color);--badge-content-color:var(--luzmo-yellow-color);--badge-fill-background-color:var(--luzmo-yellow-color);--badge-fill-content-color:black}:host([variant=gray]){--badge-border-color:var(--luzmo-gray-color);--badge-content-color:var(--luzmo-gray-color);--badge-fill-background-color:var(--luzmo-gray-color);--badge-fill-content-color:white}:host([variant=red]){--badge-border-color:var(--luzmo-red-color);--badge-content-color:var(--luzmo-red-color);--badge-fill-background-color:var(--luzmo-red-color);--badge-fill-content-color:white}:host([variant=orange]){--badge-border-color:var(--luzmo-orange-color);--badge-content-color:var(--luzmo-orange-color);--badge-fill-background-color:var(--luzmo-orange-color);--badge-fill-content-color:black}:host([variant=chartreuse]){--badge-border-color:var(--luzmo-chartreuse-color);--badge-content-color:var(--luzmo-chartreuse-color);--badge-fill-background-color:var(--luzmo-chartreuse-color);--badge-fill-content-color:white}:host([variant=celery]){--badge-border-color:var(--luzmo-celery-color);--badge-content-color:var(--luzmo-celery-color);--badge-fill-background-color:var(--luzmo-celery-color);--badge-fill-content-color:black}:host([variant=green]){--badge-border-color:var(--luzmo-green-color);--badge-content-color:var(--luzmo-green-color);--badge-fill-background-color:var(--luzmo-green-color);--badge-fill-content-color:white}:host([variant=cyan]){--badge-border-color:var(--luzmo-cyan-color);--badge-content-color:var(--luzmo-cyan-color);--badge-fill-background-color:var(--luzmo-cyan-color);--badge-fill-content-color:white}:host([variant=blue]){--badge-border-color:var(--luzmo-blue-color);--badge-content-color:var(--luzmo-blue-color);--badge-fill-background-color:var(--luzmo-blue-color);--badge-fill-content-color:white}:host([treatment=outline]){--badge-background-color:transparent}:host([treatment=subtle]){--badge-subtle-color:var(--badge-fill-background-color,var(--luzmo-selected-color-hard));--badge-background-color:color-mix(in srgb, var(--badge-subtle-color) var(--badge-subtle-background-opacity), var(--luzmo-background-color));--badge-content-color:var(--badge-subtle-content-color,color-mix(in oklch, var(--badge-subtle-color), var(--luzmo-font-color) var(--badge-subtle-content-mix)))}:host([treatment=fill]){--badge-background-color:var(--badge-fill-background-color,var(--luzmo-selected-color-hard));--badge-content-color:var(--badge-fill-content-color,white);--badge-border-color:transparent}`,s=[`accent`,`neutral`,`informative`,`positive`,`negative`,`notice`,`seafoam`,`indigo`,`purple`,`fuchsia`,`magenta`,`yellow`,`gray`,`red`,`orange`,`chartreuse`,`celery`,`green`,`cyan`,`blue`],c=class extends t.n(n.t(e.n),{validSizes:[`xs`,`s`,`m`,`l`,`xl`],noDefaultSize:!0}){constructor(...e){super(...e),this._languageScript=new r.n(this),this._variant=`neutral`,this.treatment=`outline`}static get styles(){return[(0,i.unsafeCSS)(o)]}get variant(){return this._variant}set variant(e){e!==this._variant&&(s.includes(e)?(this._variant=e,this.setAttribute(`variant`,e)):(this._variant=`neutral`,this.setAttribute(`variant`,`neutral`)))}handleIconSlotChange(e){e.target.assignedElements().forEach(e=>{e.tagName.toLowerCase()===`luzmo-icon`&&e.setAttribute(`block`,``)})}get hasLabel(){return this.slotHasContent}render(){return i.html`
19
- <slot name="icon" @slotchange=${this.handleIconSlotChange}></slot>
20
- <span class="label" ?hidden=${!this.hasLabel}>
21
- <slot @slotchange=${this.manageTextObservedSlot}></slot>
22
- </span>
23
- `}updated(e){super.updated(e),this.toggleAttribute(`icon-only`,!this.slotHasContent)}firstUpdated(e){super.firstUpdated(e),this.hasAttribute(`role`)||this.setAttribute(`role`,`status`),this.hasAttribute(`variant`)||this.setAttribute(`variant`,this.variant),this.hasAttribute(`treatment`)||this.setAttribute(`treatment`,this.treatment)}};e.t([(0,a.property)({reflect:!0})],c.prototype,`variant`,null),e.t([(0,a.property)({reflect:!0})],c.prototype,`treatment`,void 0),e.t([(0,a.property)({reflect:!0})],c.prototype,`fixed`,void 0),customElements.get(`luzmo-badge`)||customElements.define(`luzmo-badge`,c),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return c}});
@@ -1,20 +0,0 @@
1
- /*! * Lucero - The design system for Luzmo.
2
- *
3
- * Copyright © 2026 Luzmo
4
- * All rights reserved.
5
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
6
- * This license allows users with a current active Luzmo account to use Lucero.
7
- * This license terminates automatically if a user no longer has an active Luzmo account.
8
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
9
- *
10
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
11
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
12
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
13
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
14
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
15
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
16
- * SOFTWARE.
17
- * */
18
- require("./tokens.cjs");const e=require("./decorate-Dq34MBGe.cjs"),t=require("./sized-mixin-BT7cv-fT.cjs"),n=require("./button-base-DiNxrttk.cjs"),r=require("./close-button-BAELImQY.cjs"),i=require("./pending-state-CGHvTtKR.cjs");let a=require("lit"),o=require("lit/decorators.js"),s=require("@luzmo/icons");var c=`:host{cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;font-family:var(--luzmo-button-font-family,var(--luzmo-font-family));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height,1.3);text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration,var(--luzmo-animation-duration)) ease-out, border-color var(--luzmo-button-animation-duration,var(--luzmo-animation-duration)) ease-out, color var(--luzmo-button-animation-duration,var(--luzmo-animation-duration)) ease-out, box-shadow var(--luzmo-button-animation-duration,var(--luzmo-animation-duration)) ease-out;justify-content:center;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;overflow:visible}:host(:focus){outline:none}:host .is-disabled,:host([disabled]){cursor:default}:host:after{margin:calc(-1 * var(--luzmo-button-focus-indicator-gap,var(--luzmo-focus-indicator-gap,2px)));transition:opacity var(--luzmo-button-animation-duration,var(--luzmo-button-animation-duration,var(--luzmo-animation-duration))) ease-out, margin var(--luzmo-button-animation-duration,var(--luzmo-button-animation-duration,var(--luzmo-animation-duration))) ease-out;display:block;inset-block:0;inset-inline:0}:host(:focus-visible):after{margin:calc(var(--luzmo-focus-indicator-gap,2px) * -2)}#label{place-self:center}#label[hidden]{display:none}:host{--luzmo-progress-circle-position:absolute;border-radius:var(--luzmo-button-border-radius,var(--button-border-radius));font-size:var(--luzmo-button-font-size,var(--button-font-size));font-weight:var(--luzmo-button-font-weight,var(--luzmo-font-weight));gap:var(--luzmo-button-padding-label-to-icon,var(--button-padding-label-to-icon));max-inline-size:none;max-inline-size:var(--luzmo-button-max-inline-size,none);min-inline-size:var(--luzmo-button-min-width,var(--button-min-width));min-block-size:var(--luzmo-button-height,var(--button-height));padding-block:0;padding-inline:var(--luzmo-button-edge-to-text,var(--button-edge-to-text));color:inherit;margin-block:0;margin-block:var(--luzmo-button-margin-block,0);margin-inline-start:var(--luzmo-button-margin-left,0);margin-inline-end:var(--luzmo-button-margin-right,0);position:relative;border-width:var(--luzmo-button-border-width,var(--button-border-width))!important;border-style:var(--luzmo-button-border-style,solid)!important}:host(:is(:active,[active])){box-shadow:none}::slotted([slot=icon]){--_icon-size-difference:max(0px, var(--button-intended-icon-size) - var(--icon-size,var(--button-intended-icon-size)));color:inherit;flex-shrink:0;align-self:flex-start;margin-block-start:var(--luzmo-button-icon-margin-block-start,max(0px, var(--luzmo-button-top-to-icon,var(--button-top-to-icon)) - var(--luzmo-button-border-width,var(--button-border-width)) + var(--_icon-size-difference,0px) / 2));margin-inline-start:calc(var(--luzmo-button-edge-to-visual,var(--button-edge-to-visual)) - var(--luzmo-button-edge-to-text,var(--button-edge-to-text)))}:host([icon-only]){min-inline-size:var(--luzmo-button-icon-only-min-inline-size,var(--button-height));padding:calc(var(--luzmo-button-edge-to-visual-only,var(--button-edge-to-visual-only)) - var(--luzmo-button-border-width,var(--button-border-width)));border-radius:var(--luzmo-button-border-radius,var(--button-border-radius))}:host([icon-only]) ::slotted([slot=icon]){align-self:center;margin-block-start:0;margin-inline-start:0}#label{line-height:var(--luzmo-button-line-height,var(--button-line-height));text-align:center;text-align:var(--luzmo-button-text-align,center);align-self:start;padding-block-start:calc(var(--luzmo-button-top-to-text,var(--button-top-to-text)) - var(--luzmo-button-border-width,var(--button-border-width)));padding-block-end:calc(var(--luzmo-button-bottom-to-text,var(--button-bottom-to-text)) - var(--luzmo-button-border-width,var(--button-border-width)))}:host([data-luzmo-language-script=Latn]) #label{text-box:trim-both cap alphabetic;align-self:center;margin-block:-.35em;padding-block:.35em}[name=icon]+#label{text-align:start;text-align:var(--luzmo-button-text-align-with-icon,start)}:host([focused]):after,:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-button-focus-ring-thickness,var(--button-focus-ring-thickness)) var(--luzmo-button-focus-ring-color,var(--button-focus-indicator-color))}:host{transition:border-color var(--luzmo-button-animation-duration,var(--button-animation-duration)) ease-in-out}:host:after{margin:calc((var(--luzmo-button-focus-ring-gap,var(--button-focus-ring-gap)) + var(--luzmo-button-border-width,var(--button-border-width))) * -1);border-radius:var(--luzmo-button-focus-ring-border-radius,calc(var(--luzmo-button-border-radius,var(--button-border-radius)) + var(--luzmo-focus-indicator-gap,2px)));transition:box-shadow var(--luzmo-button-animation-duration,var(--button-animation-duration)) ease-in-out;pointer-events:none;content:"";position:absolute;inset:0}:host(:focus-visible){box-shadow:none;outline:none}:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-button-focus-ring-thickness,var(--button-focus-ring-thickness)) var(--highcontrast-button-focus-ring-color,var(--luzmo-button-focus-ring-color,var(--luzmo-button-focus-ring-color,var(--button-focus-indicator-color))))}:host{background-color:var(--highcontrast-button-background-color-default,var(--luzmo-button-background-color-default,var(--button-background-color-default)));color:var(--highcontrast-button-content-color-default,var(--luzmo-button-content-color-default,var(--button-content-color-default)));transition:border .13s linear,color .13s linear,background-color .13s linear;transition:border var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s)) linear, color var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s)) linear, background-color var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s)) linear;border-color:var(--highcontrast-button-border-color-default,var(--luzmo-button-border-color-default,var(--button-border-color-default)))!important}@media (hover:hover){:host(:hover){box-shadow:none;background-color:var(--highcontrast-button-background-color-hover,var(--luzmo-button-background-color-hover,var(--button-background-color-hover)));color:var(--highcontrast-button-content-color-hover,var(--luzmo-button-content-color-hover,var(--button-content-color-hover)));border-color:var(--highcontrast-button-border-color-hover,var(--luzmo-button-border-color-hover,var(--button-border-color-hover)))!important}}:host(:focus-visible){background-color:var(--highcontrast-button-background-color-focus,var(--luzmo-button-background-color-focus,var(--button-background-color-focus)));color:var(--highcontrast-button-content-color-focus,var(--luzmo-button-content-color-focus,var(--button-content-color-focus)));border-color:var(--highcontrast-button-border-color-focus,var(--luzmo-button-border-color-focus,var(--button-border-color-focus)))!important}:host(:is(:active,[active])){background-color:var(--highcontrast-button-background-color-down,var(--luzmo-button-background-color-down,var(--button-background-color-down)));color:var(--highcontrast-button-content-color-down,var(--luzmo-button-content-color-down,var(--button-content-color-down)));border-color:var(--highcontrast-button-border-color-down,var(--luzmo-button-border-color-down,var(--button-border-color-down)))!important}:host .is-disabled,:host([pending]),:host([disabled]),:host([pending]){background-color:var(--highcontrast-button-background-color-disabled,var(--luzmo-button-background-color-disabled,var(--button-background-color-disabled)));color:var(--highcontrast-button-content-color-disabled,var(--luzmo-button-content-color-disabled,var(--button-content-color-disabled)));border-color:var(--highcontrast-button-border-color-disabled,var(--luzmo-button-border-color-disabled,var(--button-border-color-disabled)))!important}#label,::slotted([slot=icon]){visibility:visible;opacity:1;transition:opacity .13s ease-in-out;transition:opacity var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s)) ease-in-out}.luzmo-progress-circle{visibility:hidden;opacity:0;transition:opacity .13s ease-in-out,visibility 0s linear .13s;transition:opacity var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s)) ease-in-out, visibility 0s linear var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s))}:host([pending]),:host([pending]){cursor:default}:host([pending]) .luzmo-progress-circle,:host([pending]) .luzmo-progress-circle{visibility:visible;opacity:1;transition:opacity .13s ease-in-out;transition:opacity var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s)) ease-in-out}:host([no-wrap]) #label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host([static-color=white]){--button-focus-indicator-color:var(--luzmo-static-black-focus-indicator-color,#000)}:host([static-color=white][selected]){--button-content-color-default:var(--luzmo-button-static-content-color,#ffffffe6);--button-content-color-hover:var(--luzmo-button-static-content-color,#fff);--button-content-color-down:var(--luzmo-button-static-content-color,#fff);--button-content-color-focus:var(--luzmo-button-static-content-color,#fff)}:host([static-color=black]){--button-focus-indicator-color:var(--luzmo-static-black-focus-indicator-color,#000)}@media (forced-colors:active){:host{--highcontrast-button-content-color-default:ButtonText;--highcontrast-button-content-color-hover:ButtonText;--highcontrast-button-content-color-focus:ButtonText;--highcontrast-button-content-color-down:ButtonText;--highcontrast-button-border-color-default:ButtonBorder;--highcontrast-button-border-color-hover:ButtonBorder;--highcontrast-button-border-color-focus:ButtonBorder;--highcontrast-button-border-color-down:ButtonBorder;--highcontrast-button-background-color-default:ButtonFace;--highcontrast-button-background-color-hover:ButtonFace;--highcontrast-button-background-color-down:ButtonFace;--highcontrast-button-background-color-focus:ButtonFace;--highcontrast-button-background-color-disabled:ButtonFace;--highcontrast-button-content-color-disabled:GrayText;--highcontrast-button-border-color-disabled:GrayText;--luzmo-progress-circle-track-border-color:ButtonText;--luzmo-progress-circle-track-border-color-over-background:ButtonText;--luzmo-progress-circle-thickness:3px;--luzmo-button-animation-duration:0s}#label{forced-color-adjust:none}:host(:focus-visible):after{forced-color-adjust:none;box-shadow:0 0 0 var(--luzmo-button-focus-ring-thickness,var(--button-focus-ring-thickness)) ButtonText}}:host{--button-animation-duration:var(--luzmo-animation-duration);--button-border-radius:var(--luzmo-border-radius);--button-border-width:var(--luzmo-border-width);--button-line-height:1.2;--button-focus-ring-gap:var(--luzmo-indicator-gap);--button-focus-ring-thickness:var(--luzmo-indicator-width);--button-focus-indicator-color:var(--luzmo-primary);--button-intended-icon-size:calc(var(--luzmo-button-icon-size,var(--icon-size)) + 2px);--button-top-to-text:calc(( var(--luzmo-button-height,var(--button-height)) - var(--luzmo-button-font-size,var(--button-font-size)) * var(--luzmo-button-line-height,var(--button-line-height)) ) / 2);--button-bottom-to-text:var(--button-top-to-text);--button-top-to-icon:calc(( var(--luzmo-button-height,var(--button-height)) - var(--button-intended-icon-size) ) / 2);--button-edge-to-visual-only:var(--button-top-to-icon);--button-background-color-default:var(--luzmo-background-color);--button-background-color-hover:var(--luzmo-background-color-hover);--button-background-color-down:var(--luzmo-background-color-active);--button-background-color-focus:var(--luzmo-primary);--button-border-color-default:var(--luzmlo-border-color-full);--button-border-color-hover:var(--luzmo-border-color-full-hover);--button-border-color-down:var(--luzmo-border-color-full-down);--button-border-color-focus:var(--luzmo-border-color-full-focus);--button-content-color-default:var(--luzmo-font-color);--button-content-color-hover:var(--luzmo-font-color-hover);--button-content-color-down:var(--luzmo-font-color-down);--button-content-color-focus:var(--luzmo-font-color-focus);--button-background-color-disabled:transparent;--button-border-color-disabled:var(--luzmo-disabled-color);--button-content-color-disabled:var(--luzmo-disabled-color)}:host([variant=negative]){--button-background-color-default:var(--luzmo-negative-color);--button-background-color-hover:var(--luzmo-negative-color-hover);--button-background-color-down:var(--luzmo-negative-color-down);--button-background-color-focus:var(--luzmo-negative-color-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:var(--luzmo-negative-inverse-color,white);--button-content-color-hover:var(--luzmo-negative-inverse-color,white);--button-content-color-down:var(--luzmo-negative-inverse-color,white);--button-content-color-focus:var(--luzmo-negative-inverse-color,white);--button-background-color-disabled:var(--luzmo-background-color-disabled);--button-border-color-disabled:transparent;--button-content-color-disabled:var(--luzmo-disabled-color)}:host([variant=negative][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:rgba(var(--luzmo-negative-color-rgb), .1);--button-background-color-down:rgba(var(--luzmo-negative-color-rgb), .16);--button-background-color-focus:rgba(var(--luzmo-negative-color-rgb), .1);--button-border-color-default:var(--luzmo-negative-color);--button-border-color-hover:var(--luzmo-negative-color-hover);--button-border-color-down:var(--luzmo-negative-color-down);--button-border-color-focus:var(--luzmo-negative-color-focus);--button-content-color-default:var(--luzmo-negative-color);--button-content-color-hover:var(--luzmo-negative-color-down);--button-content-color-down:var(--luzmo-negative-color-down);--button-content-color-focus:var(--luzmo-negative-color-focus);--button-background-color-disabled:transparent;--button-border-color-disabled:var(--luzmo-border-color-disabled);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([variant=positive]){--button-background-color-default:var(--luzmo-positive-color);--button-background-color-hover:var(--luzmo-positive-color-hover);--button-background-color-down:var(--luzmo-positive-color-down);--button-background-color-focus:var(--luzmo-positive-color-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:var(--luzmo-positive-inverse-color,white);--button-content-color-hover:var(--luzmo-positive-inverse-color,white);--button-content-color-down:var(--luzmo-positive-inverse-color,white);--button-content-color-focus:var(--luzmo-positive-inverse-color,white);--button-background-color-disabled:var(--luzmo-background-color-disabled);--button-border-color-disabled:transparent;--button-content-color-disabled:var(--luzmo-disabled-color)}:host([variant=positive][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:rgba(var(--luzmo-positive-color-rgb), .1);--button-background-color-down:rgba(var(--luzmo-positive-color-rgb), .16);--button-background-color-focus:rgba(var(--luzmo-positive-color-rgb), .1);--button-border-color-default:var(--luzmo-positive-color);--button-border-color-hover:var(--luzmo-positive-color-hover);--button-border-color-down:var(--luzmo-positive-color-down);--button-border-color-focus:var(--luzmo-positive-color-focus);--button-content-color-default:var(--luzmo-positive-color);--button-content-color-hover:var(--luzmo-positive-color-down);--button-content-color-down:var(--luzmo-positive-color-down);--button-content-color-focus:var(--luzmo-positive-color-focus);--button-background-color-disabled:transparent;--button-border-color-disabled:var(--luzmo-border-color-disabled);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([variant=primary]){--button-background-color-default:var(--luzmo-primary);--button-background-color-hover:var(--luzmo-primary-hover);--button-background-color-down:var(--luzmo-primary-down);--button-background-color-focus:var(--luzmo-primary-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:var(--luzmo-primary-inverse-color);--button-content-color-hover:var(--luzmo-primary-inverse-color);--button-content-color-down:var(--luzmo-primary-inverse-color);--button-content-color-focus:var(--luzmo-primary-inverse-color);--button-background-color-disabled:var(--luzmo-background-color-disabled);--button-border-color-disabled:transparent;--button-content-color-disabled:var(--luzmo-disabled-color)}:host([variant=primary][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:var(--luzmo-background-color-hover);--button-background-color-down:var(--luzmo-background-color-down);--button-background-color-focus:var(--luzmo-background-color-focus);--button-border-color-default:var(--luzmo-primary);--button-border-color-hover:var(--luzmo-primary-hover);--button-border-color-down:var(--luzmo-primary-down);--button-border-color-focus:var(--luzmo-primary-focus);--button-content-color-default:var(--luzmo-primary);--button-content-color-hover:var(--luzmo-primary-down);--button-content-color-down:var(--luzmo-primary-down);--button-content-color-focus:var(--luzmo-primary-focus);--button-background-color-disabled:transparent;--button-border-color-disabled:var(--luzmo-border-color-disabled);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([variant=secondary]){--button-background-color-default:var(--luzmo-secondary);--button-background-color-hover:var(--luzmo-secondary-hover);--button-background-color-down:var(--luzmo-secondary-down);--button-background-color-focus:var(--luzmo-secondary-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:var(--luzmo-secondary-inverse-color);--button-content-color-hover:var(--luzmo-secondary-inverse-color);--button-content-color-down:var(--luzmo-secondary-inverse-color);--button-content-color-focus:var(--luzmo-secondary-inverse-color);--button-background-color-disabled:var(--luzmo-background-color-disabled);--button-border-color-disabled:transparent;--button-content-color-disabled:var(--luzmo-disabled-color)}:host([variant=secondary][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:var(--luzmo-background-color-hover);--button-background-color-down:var(--luzmo-background-color-down);--button-background-color-focus:var(--luzmo-background-color-focus);--button-border-color-default:var(--luzmo-secondary);--button-border-color-hover:var(--luzmo-secondary-hover);--button-border-color-down:var(--luzmo-secondary-down);--button-border-color-focus:var(--luzmo-secondary-focus);--button-content-color-default:var(--luzmo-secondary);--button-content-color-hover:var(--luzmo-secondary-down);--button-content-color-down:var(--luzmo-secondary-down);--button-content-color-focus:var(--luzmo-secondary-focus);--button-background-color-disabled:transparent;--button-border-color-disabled:var(--luzmo-border-color-disabled);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([variant=neutral]){--button-background-color-default:var(--luzmo-background-color-highlight);--button-background-color-hover:var(--luzmo-background-color-highlight-hover);--button-background-color-down:var(--luzmo-background-color-highlight-down);--button-background-color-focus:var(--luzmo-background-color-highlight-focus);--button-border-color-default:var(--luzmo-border-color);--button-border-color-hover:var(--luzmo-border-color);--button-border-color-down:var(--luzmo-border-color-down);--button-border-color-focus:var(--luzmo-border-color-focus);--button-content-color-default:var(--luzmo-font-color);--button-content-color-hover:var(--luzmo-font-color-hover);--button-content-color-down:var(--luzmo-font-color-down);--button-content-color-focus:var(--luzmo-font-color-focus);--button-background-color-disabled:var(--luzmo-background-color-disabled);--button-border-color-disabled:var(--luzmo-border-color-disabled);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([variant=neutral][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:rgba(var(--luzmo-border-color-rgb), .1);--button-background-color-down:rgba(var(--luzmo-border-color-rgb), .16);--button-background-color-focus:rgba(var(--luzmo-border-color-rgb), .1);--button-border-color-default:var(--luzmo-border-color);--button-border-color-hover:var(--luzmo-border-color-hover);--button-border-color-down:var(--luzmo-border-color-down);--button-border-color-focus:var(--luzmo-border-color-focus);--button-content-color-default:var(--luzmo-font-color);--button-content-color-hover:var(--luzmo-font-color-hover);--button-content-color-down:var(--luzmo-font-color-down);--button-content-color-focus:var(--luzmo-font-color-focus);--button-background-color-disabled:transparent;--button-border-color-disabled:var(--luzmo-border-color-disabled);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([quiet]){--button-background-color-default:transparent;--button-background-color-hover:var(--luzmo-background-color-hover);--button-background-color-down:var(--luzmo-background-color-down);--button-background-color-focus:var(--luzmo-background-color-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-background-color-disabled:transparent;--button-border-color-disabled:transparent}:host([variant=primary][quiet]),:host([variant=secondary][quiet]),:host([variant=negative][quiet]),:host([variant=positive][quiet]){--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-border-color-disabled:transparent;--button-content-color-default:var(--luzmo-font-color);--button-content-color-hover:var(--luzmo-font-color-hover);--button-content-color-down:var(--luzmo-font-color-down);--button-content-color-focus:var(--luzmo-font-color-focus);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([variant=neutral][quiet]){--button-background-color-default:transparent;--button-background-color-hover:var(--luzmo-background-color-hover);--button-background-color-down:var(--luzmo-background-color-down);--button-background-color-focus:var(--luzmo-background-color-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-border-color-disabled:transparent;--button-content-color-default:var(--luzmo-font-color);--button-content-color-hover:var(--luzmo-font-color-hover);--button-content-color-down:var(--luzmo-font-color-down);--button-content-color-focus:var(--luzmo-font-color-focus);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([selected]){--button-background-color-default:var(--luzmo-selected-color);--button-background-color-hover:var(--luzmo-selected-color-hover);--button-background-color-down:var(--luzmo-selected-color-down);--button-background-color-focus:var(--luzmo-selected-color-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:white;--button-content-color-hover:white;--button-content-color-down:white;--button-content-color-focus:white;--button-background-color-disabled:var(--luzmo-background-color-disabled);--button-border-color-disabled:transparent}:host([selected][emphasized]){--button-background-color-default:transparent;--button-background-color-hover:var(--luzmo-background-color-hover);--button-background-color-down:var(--luzmo-background-color-down);--button-background-color-focus:var(--luzmo-background-color-focus)}:host([static-color=black][quiet]),:host([static-color=white][quiet]){--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-border-color-disabled:transparent}:host([static-color=white]){--button-background-color-default:rgba(255, 255, 255 .9);--button-background-color-hover:#fff;--button-background-color-down:#fff;--button-background-color-focus:#fff;--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:#000;--button-content-color-hover:#000;--button-content-color-down:#000;--button-content-color-focus:#000;--button-focus-indicator-color:#fff;--button-background-color-disabled:#ffffff1a;--button-border-color-disabled:transparent;--button-content-color-disabled:#ffffff8c}:host([static-color=white][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:#ffffff40;--button-background-color-down:#fff6;--button-background-color-focus:#ffffff40;--button-border-color-default:#ffffffe6;--button-border-color-hover:#fff;--button-border-color-down:#fff;--button-border-color-focus:#fff;--button-content-color-default:#fff;--button-content-color-hover:#fff;--button-content-color-down:#fff;--button-content-color-focus:#fff;--button-focus-indicator-color:#fff;--button-background-color-disabled:transparent;--button-border-color-disabled:#ffffff40;--button-content-color-disabled:#ffffff8c}:host([static-color=white][selected]){--button-background-color-default:#ffffffe6;--button-background-color-hover:#fff;--button-background-color-down:#fff;--button-background-color-focus:#fff;--button-static-white-content-color-default:#000;--button-static-white-content-color-hover:#000;--button-static-white-content-color-down:#000;--button-static-white-content-color-focus:#000;--button-background-color-disabled:#ffffff1a;--button-border-color-disabled:transparent}:host([static-color=white][variant=secondary]){--button-background-color-default:#ffffff1a;--button-background-color-hover:#ffffff40;--button-background-color-down:#fff6;--button-background-color-focus:#ffffff40;--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:#fff;--button-content-color-hover:#fff;--button-content-color-down:#fff;--button-content-color-focus:#fff;--button-focus-indicator-color:#fff;--button-background-color-disabled:#ffffff1a;--button-border-color-disabled:transparent;--button-content-color-disabled:#ffffff8c}:host([static-color=white][variant=secondary][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:#ffffff40;--button-background-color-down:#fff6;--button-background-color-focus:#ffffff40;--button-border-color-default:#ffffff40;--button-border-color-hover:#fff6;--button-border-color-down:#ffffff8c;--button-border-color-focus:#fff6;--button-content-color-default:#fff;--button-content-color-hover:#fff;--button-content-color-down:#fff;--button-content-color-focus:#fff;--button-focus-indicator-color:#fff;--button-background-color-disabled:transparent;--button-border-color-disabled:#ffffff40;--button-content-color-disabled:#ffffff8c}:host([static-color=black]){--button-background-color-default:#000000e6;--button-background-color-hover:#000;--button-background-color-down:#000;--button-background-color-focus:#000;--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:#fff;--button-content-color-hover:#fff;--button-content-color-down:#fff;--button-content-color-focus:#fff;--button-focus-indicator-color:#000;--button-background-color-disabled:#0000001a;--button-border-color-disabled:transparent;--button-content-color-disabled:#0000008c}:host([static-color=black][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:#00000040;--button-background-color-down:#0006;--button-background-color-focus:#00000040;--button-border-color-default:#0006;--button-border-color-hover:#0000008c;--button-border-color-down:#000000b3;--button-border-color-focus:#0000008c;--button-content-color-default:#000;--button-content-color-hover:#000;--button-content-color-down:#000;--button-content-color-focus:#000;--button-focus-indicator-color:#000;--button-background-color-disabled:transparent;--button-border-color-disabled:#00000040;--button-content-color-disabled:#0000008c}:host([static-color=black][variant=secondary]){--button-background-color-default:#0000001a;--button-background-color-hover:#00000040;--button-background-color-down:#0006;--button-background-color-focus:#00000040;--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:#000;--button-content-color-hover:#000;--button-content-color-down:#000;--button-content-color-focus:#000;--button-focus-indicator-color:#000;--button-background-color-disabled:#0000001a;--button-border-color-disabled:transparent;--button-content-color-disabled:#0000008c}:host([static-color=black][variant=secondary][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:#00000040;--button-background-color-down:#0006;--button-background-color-focus:#00000040;--button-border-color-default:#00000040;--button-border-color-hover:#0006;--button-border-color-down:#0000008c;--button-border-color-focus:#0006;--button-content-color-default:#000;--button-content-color-hover:#000;--button-content-color-down:#000;--button-content-color-focus:#000;--button-focus-indicator-color:#000;--button-background-color-disabled:transparent;--button-border-color-disabled:#00000040;--button-content-color-disabled:#0000008c}:host([size=xs]){--button-min-width:44px;--button-border-radius:var(--luzmo-border-radius-s);--button-height:var(--luzmo-component-height-xs);--button-font-size:11px;--button-edge-to-visual:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--button-edge-to-text:var(--luzmo-spacing-3);--button-padding-label-to-icon:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1))}:host([size=s]){--button-min-width:64px;--button-border-radius:var(--luzmo-border-radius-s);--button-height:var(--luzmo-component-height-s);--button-font-size:var(--luzmo-font-size-s);--button-edge-to-visual:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--button-edge-to-text:var(--luzmo-spacing-4);--button-padding-label-to-icon:var(--luzmo-spacing-3)}:host{--button-min-width:72px;--button-border-radius:var(--luzmo-border-radius);--button-height:var(--luzmo-component-height);--button-font-size:var(--luzmo-font-size-m);--button-edge-to-visual:var(--luzmo-spacing-4);--button-edge-to-text:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--button-padding-label-to-icon:var(--luzmo-spacing-3)}:host([size=l]){--button-min-width:90px;--button-border-radius:var(--luzmo-border-radius);--button-height:var(--luzmo-component-height-l);--button-font-size:var(--luzmo-font-size-l);--button-edge-to-visual:var(--luzmo-spacing-5);--button-edge-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--button-padding-label-to-icon:var(--luzmo-spacing-3)}:host([size=xl]){--button-min-width:108px;--button-border-radius:var(--luzmo-border-radius);--button-height:var(--luzmo-component-height-xl);--button-font-size:var(--luzmo-font-size-xl);--button-edge-to-visual:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-2));--button-edge-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--button-padding-label-to-icon:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}@media (forced-colors:active){:host([treatment][disabled]){border-color:graytext!important}:host([treatment]:not([disabled]):hover){border-color:highlight!important}:host(.remove-focus-ring-safari-hack:focus-visible):after{forced-color-adjust:none;box-shadow:none}}@keyframes show-progress-circle{0%{visibility:hidden}to{visibility:visible}}@keyframes hide-icons-label{0%{visibility:visible}to{visibility:hidden}}@keyframes update-pending-button-styles{to{background-color:var(--highcontrast-button-background-color-disabled,var(--luzmo-button-background-color-disabled,var(--button-background-color-disabled)));color:var(--highcontrast-button-content-color-disabled,var(--luzmo-button-content-color-disabled,var(--button-content-color-disabled)));border-color:var(--highcontrast-button-border-color-disabled,var(--luzmo-button-border-color-disabled,var(--button-border-color-disabled)))!important}}:host([pending]:not([disabled])){cursor:default;pointer-events:none;animation:update-pending-button-styles 0s var(--pending-delay,1s) forwards}::slotted([slot=icon]){visibility:revert-layer;--luzmo-progress-circle-position:relative;--icon-size:inherit}luzmo-progress-circle{visibility:hidden;display:block;position:absolute;left:50%;transform:translate(-50%)}:host([pending]:not([disabled])) luzmo-progress-circle{animation:show-progress-circle 0s var(--pending-delay,1s) forwards}:host([pending]:not([disabled])) slot[name=icon],:host([pending]:not([disabled])) #label{animation:hide-icons-label 0s var(--pending-delay,1s) forwards}:host(.remove-focus-ring-safari-hack:focus-visible):after{margin:calc(-1 * var(--luzmo-button-focus-indicator-gap,var(--luzmo-focus-indicator-gap,var(--focus-indicator-gap))));box-shadow:none}:host(.remove-focus-ring-safari-hack:focus-visible){box-shadow:none;outline:none}:host(.remove-focus-ring-safari-hack:focus-visible:not(:hover)){background-color:var(--highcontrast-button-background-color-default,var(--luzmo-button-background-color-default,var(--button-background-color-default)));color:var(--highcontrast-button-content-color-default,var(--luzmo-button-content-color-default,var(--button-content-color-default)));border-color:var(--highcontrast-button-border-color-default,var(--luzmo-button-border-color-default,var(--button-border-color-default)))!important}`,l=[`primary`,`secondary`,`neutral`,`negative`,`positive`,`white`,`black`],u=class extends t.n(n.t,{validSizes:[`xs`,`s`,`m`,`l`,`xl`],noDefaultSize:!0}){static get styles(){return[...super.styles,(0,a.unsafeCSS)(c)]}constructor(){super(),this.pendingLabel=`Pending`,this.pending=!1,this._variant=`primary`,this.treatment=`fill`,this._quiet=!1,this.noWrap=!1,this.pendingStateController=new i.t(this)}click(){this.pending||super.click()}get variant(){return this._variant}set variant(e){if(e!==this.variant){switch(this.requestUpdate(`variant`,this.variant),e){case`white`:this.staticColor=e,this.removeAttribute(`variant`);return;case`black`:this.staticColor=e,this.removeAttribute(`variant`);return;case null:return;default:this._variant=l.includes(e)?e:`primary`;break}this.setAttribute(`variant`,this.variant)}}set quiet(e){this._quiet=e,this.treatment=e?`outline`:`fill`}get quiet(){return this._quiet}firstUpdated(e){super.firstUpdated(e),this.hasAttribute(`variant`)||this.setAttribute(`variant`,this.variant),this.pending&&this.pendingStateController.hostUpdated()}renderButton(){return a.html`
19
- ${this.buttonContent} ${this.pendingStateController.renderPendingState()}
20
- `}};e.t([(0,o.property)({type:String,attribute:`pending-label`})],u.prototype,`pendingLabel`,void 0),e.t([(0,o.property)({type:Boolean,reflect:!0,attribute:!0})],u.prototype,`pending`,void 0),e.t([(0,o.property)()],u.prototype,`variant`,null),e.t([(0,o.property)({reflect:!0,attribute:`static-color`})],u.prototype,`staticColor`,void 0),e.t([(0,o.property)({reflect:!0})],u.prototype,`treatment`,void 0),e.t([(0,o.property)({type:Boolean,reflect:!0})],u.prototype,`quiet`,null),e.t([(0,o.property)({type:Boolean,attribute:`no-wrap`,reflect:!0})],u.prototype,`noWrap`,void 0);var d=`:host{font-size:var(--luzmo-clear-button-icon-size,var(--clear-button-icon-size));cursor:pointer;background-color:initial;background-color:var(--luzmo-clear-button-background-color,transparent);padding:var(--luzmo-clear-button-padding,var(--clear-button-padding));color:var(--luzmo-clear-button-icon-color,var(--clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover:hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover,var(--luzmo-clear-button-icon-color-hover,var(--clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--luzmo-clear-button-background-color-hover,var(--clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--luzmo-clear-button-icon-color-down,var(--clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--luzmo-clear-button-background-color-down,var(--clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within,:host([focus-within]) .js-focus-within{color:var(--luzmo-clear-button-icon-color-key-focus,var(--clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill,:host([focus-within]) .js-focus-within .fill{background-color:var(--luzmo-clear-button-background-color-key-focus,var(--clear-button-background-color-key-focus))}:host([disabled]),:host([disabled]){--clear-button-icon-color:var(--luzmo-clear-button-icon-color-disabled,var(--disabled-content-color));--clear-button-background-color:var(--luzmo-clear-button-background-color-disabled,transparent)}.fill{background-color:var(--luzmo-clear-button-background-color,var(--clear-button-background-color));border-radius:100%;justify-content:center;align-items:center;block-size:100%;inline-size:100%;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors:active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover:Highlight}}:host{--clear-button-background-color:transparent;--clear-button-background-color-hover:transparent;--clear-button-background-color-down:transparent;--clear-button-background-color-key-focus:transparent;--clear-button-icon-size:var(--luzmo-font-size);--clear-button-padding:0px;--clear-button-icon-color:var(--luzmo-font-color);--clear-button-icon-color-hover:var(--luzmo-font-color-hover);--clear-button-icon-color-down:var(--luzmo-font-color-down);--clear-button-icon-color-key-focus:var(--luzmo-font-color-focus)}:host([size=s]){--clear-button-icon-size:var(--luzmo-font-size-s)}:host([size=l]){--clear-button-icon-size:var(--luzmo-font-size-l)}:host([size=xl]){--clear-button-icon-size:var(--luzmo-font-size-xl)}:host .luzmo-ClearButton--quiet{--clear-button-background-color:transparent;--clear-button-background-color-hover:transparent;--clear-button-background-color-down:transparent;--clear-button-background-color-key-focus:transparent}:host([variant=overBackground]){--clear-button-icon-color:#fff;--clear-button-icon-color-hover:#fff;--clear-button-icon-color-down:#fff;--clear-button-icon-color-key-focus:#fff;--clear-button-background-color:transparent;--clear-button-background-color-hover:#ffffff40;--clear-button-background-color-down:#fff6;--clear-button-background-color-key-focus:#ffffff40}:host([disabled]),:host([disabled]){--clear-button-icon-color:var(--luzmo-disabled-color);--clear-button-icon-color-hover:var(--luzmo-disabled-color);--clear-button-icon-color-down:var(--luzmo-disabled-color);--clear-button-background-color:transparent}:host{box-sizing:border-box}`,f=e=>a.html` <div class="icon" slot="icon">${(0,s.luzmoIcon)(e===`s`?s.luzmoClear12:[`xl`,`l`].includes(e)?s.luzmoClear:s.luzmoClear14)}</div> `,p=class extends t.n(n.t,{noDefaultSize:!0}){constructor(...e){super(...e),this.variant=``}static get styles(){return[...super.styles,(0,a.unsafeCSS)(d)]}get buttonContent(){return[f(this.size)]}render(){return a.html` <div class="fill">${super.render()}</div> `}};e.t([(0,o.property)({reflect:!0})],p.prototype,`variant`,void 0),typeof customElements<`u`&&!customElements.get(`luzmo-button`)&&customElements.define(`luzmo-button`,u),typeof customElements<`u`&&!customElements.get(`luzmo-clear-button`)&&customElements.define(`luzmo-clear-button`,p),typeof customElements<`u`&&!customElements.get(`luzmo-close-button`)&&customElements.define(`luzmo-close-button`,r.t),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return p}});
@@ -1,126 +0,0 @@
1
- /*! * Lucero - The design system for Luzmo.
2
- *
3
- * Copyright © 2026 Luzmo
4
- * All rights reserved.
5
- * Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
6
- * This license allows users with a current active Luzmo account to use Lucero.
7
- * This license terminates automatically if a user no longer has an active Luzmo account.
8
- * Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
9
- *
10
- * THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
11
- * IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
12
- * FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
13
- * AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
14
- * LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
15
- * OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
16
- * SOFTWARE.
17
- * */
18
- import "./tokens.js";
19
- import { t as e } from "./decorate-CkCg3wfh.js";
20
- import { n as t } from "./sized-mixin-DzQTebN-.js";
21
- import { t as n } from "./button-base-DiPzVpp4.js";
22
- import { t as r } from "./close-button-Dlvtf9lB.js";
23
- import { t as i } from "./pending-state-D_b45qvi.js";
24
- import { html as a, unsafeCSS as o } from "lit";
25
- import { property as s } from "lit/decorators.js";
26
- import { luzmoClear as c, luzmoClear12 as l, luzmoClear14 as u, luzmoIcon as d } from "@luzmo/icons";
27
- //#region src/components/button/button.module.scss?inline
28
- var f = ":host{cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;font-family:var(--luzmo-button-font-family,var(--luzmo-font-family));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height,1.3);text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration,var(--luzmo-animation-duration)) ease-out, border-color var(--luzmo-button-animation-duration,var(--luzmo-animation-duration)) ease-out, color var(--luzmo-button-animation-duration,var(--luzmo-animation-duration)) ease-out, box-shadow var(--luzmo-button-animation-duration,var(--luzmo-animation-duration)) ease-out;justify-content:center;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;overflow:visible}:host(:focus){outline:none}:host .is-disabled,:host([disabled]){cursor:default}:host:after{margin:calc(-1 * var(--luzmo-button-focus-indicator-gap,var(--luzmo-focus-indicator-gap,2px)));transition:opacity var(--luzmo-button-animation-duration,var(--luzmo-button-animation-duration,var(--luzmo-animation-duration))) ease-out, margin var(--luzmo-button-animation-duration,var(--luzmo-button-animation-duration,var(--luzmo-animation-duration))) ease-out;display:block;inset-block:0;inset-inline:0}:host(:focus-visible):after{margin:calc(var(--luzmo-focus-indicator-gap,2px) * -2)}#label{place-self:center}#label[hidden]{display:none}:host{--luzmo-progress-circle-position:absolute;border-radius:var(--luzmo-button-border-radius,var(--button-border-radius));font-size:var(--luzmo-button-font-size,var(--button-font-size));font-weight:var(--luzmo-button-font-weight,var(--luzmo-font-weight));gap:var(--luzmo-button-padding-label-to-icon,var(--button-padding-label-to-icon));max-inline-size:none;max-inline-size:var(--luzmo-button-max-inline-size,none);min-inline-size:var(--luzmo-button-min-width,var(--button-min-width));min-block-size:var(--luzmo-button-height,var(--button-height));padding-block:0;padding-inline:var(--luzmo-button-edge-to-text,var(--button-edge-to-text));color:inherit;margin-block:0;margin-block:var(--luzmo-button-margin-block,0);margin-inline-start:var(--luzmo-button-margin-left,0);margin-inline-end:var(--luzmo-button-margin-right,0);position:relative;border-width:var(--luzmo-button-border-width,var(--button-border-width))!important;border-style:var(--luzmo-button-border-style,solid)!important}:host(:is(:active,[active])){box-shadow:none}::slotted([slot=icon]){--_icon-size-difference:max(0px, var(--button-intended-icon-size) - var(--icon-size,var(--button-intended-icon-size)));color:inherit;flex-shrink:0;align-self:flex-start;margin-block-start:var(--luzmo-button-icon-margin-block-start,max(0px, var(--luzmo-button-top-to-icon,var(--button-top-to-icon)) - var(--luzmo-button-border-width,var(--button-border-width)) + var(--_icon-size-difference,0px) / 2));margin-inline-start:calc(var(--luzmo-button-edge-to-visual,var(--button-edge-to-visual)) - var(--luzmo-button-edge-to-text,var(--button-edge-to-text)))}:host([icon-only]){min-inline-size:var(--luzmo-button-icon-only-min-inline-size,var(--button-height));padding:calc(var(--luzmo-button-edge-to-visual-only,var(--button-edge-to-visual-only)) - var(--luzmo-button-border-width,var(--button-border-width)));border-radius:var(--luzmo-button-border-radius,var(--button-border-radius))}:host([icon-only]) ::slotted([slot=icon]){align-self:center;margin-block-start:0;margin-inline-start:0}#label{line-height:var(--luzmo-button-line-height,var(--button-line-height));text-align:center;text-align:var(--luzmo-button-text-align,center);align-self:start;padding-block-start:calc(var(--luzmo-button-top-to-text,var(--button-top-to-text)) - var(--luzmo-button-border-width,var(--button-border-width)));padding-block-end:calc(var(--luzmo-button-bottom-to-text,var(--button-bottom-to-text)) - var(--luzmo-button-border-width,var(--button-border-width)))}:host([data-luzmo-language-script=Latn]) #label{text-box:trim-both cap alphabetic;align-self:center;margin-block:-.35em;padding-block:.35em}[name=icon]+#label{text-align:start;text-align:var(--luzmo-button-text-align-with-icon,start)}:host([focused]):after,:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-button-focus-ring-thickness,var(--button-focus-ring-thickness)) var(--luzmo-button-focus-ring-color,var(--button-focus-indicator-color))}:host{transition:border-color var(--luzmo-button-animation-duration,var(--button-animation-duration)) ease-in-out}:host:after{margin:calc((var(--luzmo-button-focus-ring-gap,var(--button-focus-ring-gap)) + var(--luzmo-button-border-width,var(--button-border-width))) * -1);border-radius:var(--luzmo-button-focus-ring-border-radius,calc(var(--luzmo-button-border-radius,var(--button-border-radius)) + var(--luzmo-focus-indicator-gap,2px)));transition:box-shadow var(--luzmo-button-animation-duration,var(--button-animation-duration)) ease-in-out;pointer-events:none;content:\"\";position:absolute;inset:0}:host(:focus-visible){box-shadow:none;outline:none}:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-button-focus-ring-thickness,var(--button-focus-ring-thickness)) var(--highcontrast-button-focus-ring-color,var(--luzmo-button-focus-ring-color,var(--luzmo-button-focus-ring-color,var(--button-focus-indicator-color))))}:host{background-color:var(--highcontrast-button-background-color-default,var(--luzmo-button-background-color-default,var(--button-background-color-default)));color:var(--highcontrast-button-content-color-default,var(--luzmo-button-content-color-default,var(--button-content-color-default)));transition:border .13s linear,color .13s linear,background-color .13s linear;transition:border var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s)) linear, color var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s)) linear, background-color var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s)) linear;border-color:var(--highcontrast-button-border-color-default,var(--luzmo-button-border-color-default,var(--button-border-color-default)))!important}@media (hover:hover){:host(:hover){box-shadow:none;background-color:var(--highcontrast-button-background-color-hover,var(--luzmo-button-background-color-hover,var(--button-background-color-hover)));color:var(--highcontrast-button-content-color-hover,var(--luzmo-button-content-color-hover,var(--button-content-color-hover)));border-color:var(--highcontrast-button-border-color-hover,var(--luzmo-button-border-color-hover,var(--button-border-color-hover)))!important}}:host(:focus-visible){background-color:var(--highcontrast-button-background-color-focus,var(--luzmo-button-background-color-focus,var(--button-background-color-focus)));color:var(--highcontrast-button-content-color-focus,var(--luzmo-button-content-color-focus,var(--button-content-color-focus)));border-color:var(--highcontrast-button-border-color-focus,var(--luzmo-button-border-color-focus,var(--button-border-color-focus)))!important}:host(:is(:active,[active])){background-color:var(--highcontrast-button-background-color-down,var(--luzmo-button-background-color-down,var(--button-background-color-down)));color:var(--highcontrast-button-content-color-down,var(--luzmo-button-content-color-down,var(--button-content-color-down)));border-color:var(--highcontrast-button-border-color-down,var(--luzmo-button-border-color-down,var(--button-border-color-down)))!important}:host .is-disabled,:host([pending]),:host([disabled]),:host([pending]){background-color:var(--highcontrast-button-background-color-disabled,var(--luzmo-button-background-color-disabled,var(--button-background-color-disabled)));color:var(--highcontrast-button-content-color-disabled,var(--luzmo-button-content-color-disabled,var(--button-content-color-disabled)));border-color:var(--highcontrast-button-border-color-disabled,var(--luzmo-button-border-color-disabled,var(--button-border-color-disabled)))!important}#label,::slotted([slot=icon]){visibility:visible;opacity:1;transition:opacity .13s ease-in-out;transition:opacity var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s)) ease-in-out}.luzmo-progress-circle{visibility:hidden;opacity:0;transition:opacity .13s ease-in-out,visibility 0s linear .13s;transition:opacity var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s)) ease-in-out, visibility 0s linear var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s))}:host([pending]),:host([pending]){cursor:default}:host([pending]) .luzmo-progress-circle,:host([pending]) .luzmo-progress-circle{visibility:visible;opacity:1;transition:opacity .13s ease-in-out;transition:opacity var(--luzmo-button-animation-duration,var(--luzmo-animation-duration,.15s)) ease-in-out}:host([no-wrap]) #label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host([static-color=white]){--button-focus-indicator-color:var(--luzmo-static-black-focus-indicator-color,#000)}:host([static-color=white][selected]){--button-content-color-default:var(--luzmo-button-static-content-color,#ffffffe6);--button-content-color-hover:var(--luzmo-button-static-content-color,#fff);--button-content-color-down:var(--luzmo-button-static-content-color,#fff);--button-content-color-focus:var(--luzmo-button-static-content-color,#fff)}:host([static-color=black]){--button-focus-indicator-color:var(--luzmo-static-black-focus-indicator-color,#000)}@media (forced-colors:active){:host{--highcontrast-button-content-color-default:ButtonText;--highcontrast-button-content-color-hover:ButtonText;--highcontrast-button-content-color-focus:ButtonText;--highcontrast-button-content-color-down:ButtonText;--highcontrast-button-border-color-default:ButtonBorder;--highcontrast-button-border-color-hover:ButtonBorder;--highcontrast-button-border-color-focus:ButtonBorder;--highcontrast-button-border-color-down:ButtonBorder;--highcontrast-button-background-color-default:ButtonFace;--highcontrast-button-background-color-hover:ButtonFace;--highcontrast-button-background-color-down:ButtonFace;--highcontrast-button-background-color-focus:ButtonFace;--highcontrast-button-background-color-disabled:ButtonFace;--highcontrast-button-content-color-disabled:GrayText;--highcontrast-button-border-color-disabled:GrayText;--luzmo-progress-circle-track-border-color:ButtonText;--luzmo-progress-circle-track-border-color-over-background:ButtonText;--luzmo-progress-circle-thickness:3px;--luzmo-button-animation-duration:0s}#label{forced-color-adjust:none}:host(:focus-visible):after{forced-color-adjust:none;box-shadow:0 0 0 var(--luzmo-button-focus-ring-thickness,var(--button-focus-ring-thickness)) ButtonText}}:host{--button-animation-duration:var(--luzmo-animation-duration);--button-border-radius:var(--luzmo-border-radius);--button-border-width:var(--luzmo-border-width);--button-line-height:1.2;--button-focus-ring-gap:var(--luzmo-indicator-gap);--button-focus-ring-thickness:var(--luzmo-indicator-width);--button-focus-indicator-color:var(--luzmo-primary);--button-intended-icon-size:calc(var(--luzmo-button-icon-size,var(--icon-size)) + 2px);--button-top-to-text:calc(( var(--luzmo-button-height,var(--button-height)) - var(--luzmo-button-font-size,var(--button-font-size)) * var(--luzmo-button-line-height,var(--button-line-height)) ) / 2);--button-bottom-to-text:var(--button-top-to-text);--button-top-to-icon:calc(( var(--luzmo-button-height,var(--button-height)) - var(--button-intended-icon-size) ) / 2);--button-edge-to-visual-only:var(--button-top-to-icon);--button-background-color-default:var(--luzmo-background-color);--button-background-color-hover:var(--luzmo-background-color-hover);--button-background-color-down:var(--luzmo-background-color-active);--button-background-color-focus:var(--luzmo-primary);--button-border-color-default:var(--luzmlo-border-color-full);--button-border-color-hover:var(--luzmo-border-color-full-hover);--button-border-color-down:var(--luzmo-border-color-full-down);--button-border-color-focus:var(--luzmo-border-color-full-focus);--button-content-color-default:var(--luzmo-font-color);--button-content-color-hover:var(--luzmo-font-color-hover);--button-content-color-down:var(--luzmo-font-color-down);--button-content-color-focus:var(--luzmo-font-color-focus);--button-background-color-disabled:transparent;--button-border-color-disabled:var(--luzmo-disabled-color);--button-content-color-disabled:var(--luzmo-disabled-color)}:host([variant=negative]){--button-background-color-default:var(--luzmo-negative-color);--button-background-color-hover:var(--luzmo-negative-color-hover);--button-background-color-down:var(--luzmo-negative-color-down);--button-background-color-focus:var(--luzmo-negative-color-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:var(--luzmo-negative-inverse-color,white);--button-content-color-hover:var(--luzmo-negative-inverse-color,white);--button-content-color-down:var(--luzmo-negative-inverse-color,white);--button-content-color-focus:var(--luzmo-negative-inverse-color,white);--button-background-color-disabled:var(--luzmo-background-color-disabled);--button-border-color-disabled:transparent;--button-content-color-disabled:var(--luzmo-disabled-color)}:host([variant=negative][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:rgba(var(--luzmo-negative-color-rgb), .1);--button-background-color-down:rgba(var(--luzmo-negative-color-rgb), .16);--button-background-color-focus:rgba(var(--luzmo-negative-color-rgb), .1);--button-border-color-default:var(--luzmo-negative-color);--button-border-color-hover:var(--luzmo-negative-color-hover);--button-border-color-down:var(--luzmo-negative-color-down);--button-border-color-focus:var(--luzmo-negative-color-focus);--button-content-color-default:var(--luzmo-negative-color);--button-content-color-hover:var(--luzmo-negative-color-down);--button-content-color-down:var(--luzmo-negative-color-down);--button-content-color-focus:var(--luzmo-negative-color-focus);--button-background-color-disabled:transparent;--button-border-color-disabled:var(--luzmo-border-color-disabled);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([variant=positive]){--button-background-color-default:var(--luzmo-positive-color);--button-background-color-hover:var(--luzmo-positive-color-hover);--button-background-color-down:var(--luzmo-positive-color-down);--button-background-color-focus:var(--luzmo-positive-color-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:var(--luzmo-positive-inverse-color,white);--button-content-color-hover:var(--luzmo-positive-inverse-color,white);--button-content-color-down:var(--luzmo-positive-inverse-color,white);--button-content-color-focus:var(--luzmo-positive-inverse-color,white);--button-background-color-disabled:var(--luzmo-background-color-disabled);--button-border-color-disabled:transparent;--button-content-color-disabled:var(--luzmo-disabled-color)}:host([variant=positive][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:rgba(var(--luzmo-positive-color-rgb), .1);--button-background-color-down:rgba(var(--luzmo-positive-color-rgb), .16);--button-background-color-focus:rgba(var(--luzmo-positive-color-rgb), .1);--button-border-color-default:var(--luzmo-positive-color);--button-border-color-hover:var(--luzmo-positive-color-hover);--button-border-color-down:var(--luzmo-positive-color-down);--button-border-color-focus:var(--luzmo-positive-color-focus);--button-content-color-default:var(--luzmo-positive-color);--button-content-color-hover:var(--luzmo-positive-color-down);--button-content-color-down:var(--luzmo-positive-color-down);--button-content-color-focus:var(--luzmo-positive-color-focus);--button-background-color-disabled:transparent;--button-border-color-disabled:var(--luzmo-border-color-disabled);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([variant=primary]){--button-background-color-default:var(--luzmo-primary);--button-background-color-hover:var(--luzmo-primary-hover);--button-background-color-down:var(--luzmo-primary-down);--button-background-color-focus:var(--luzmo-primary-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:var(--luzmo-primary-inverse-color);--button-content-color-hover:var(--luzmo-primary-inverse-color);--button-content-color-down:var(--luzmo-primary-inverse-color);--button-content-color-focus:var(--luzmo-primary-inverse-color);--button-background-color-disabled:var(--luzmo-background-color-disabled);--button-border-color-disabled:transparent;--button-content-color-disabled:var(--luzmo-disabled-color)}:host([variant=primary][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:var(--luzmo-background-color-hover);--button-background-color-down:var(--luzmo-background-color-down);--button-background-color-focus:var(--luzmo-background-color-focus);--button-border-color-default:var(--luzmo-primary);--button-border-color-hover:var(--luzmo-primary-hover);--button-border-color-down:var(--luzmo-primary-down);--button-border-color-focus:var(--luzmo-primary-focus);--button-content-color-default:var(--luzmo-primary);--button-content-color-hover:var(--luzmo-primary-down);--button-content-color-down:var(--luzmo-primary-down);--button-content-color-focus:var(--luzmo-primary-focus);--button-background-color-disabled:transparent;--button-border-color-disabled:var(--luzmo-border-color-disabled);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([variant=secondary]){--button-background-color-default:var(--luzmo-secondary);--button-background-color-hover:var(--luzmo-secondary-hover);--button-background-color-down:var(--luzmo-secondary-down);--button-background-color-focus:var(--luzmo-secondary-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:var(--luzmo-secondary-inverse-color);--button-content-color-hover:var(--luzmo-secondary-inverse-color);--button-content-color-down:var(--luzmo-secondary-inverse-color);--button-content-color-focus:var(--luzmo-secondary-inverse-color);--button-background-color-disabled:var(--luzmo-background-color-disabled);--button-border-color-disabled:transparent;--button-content-color-disabled:var(--luzmo-disabled-color)}:host([variant=secondary][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:var(--luzmo-background-color-hover);--button-background-color-down:var(--luzmo-background-color-down);--button-background-color-focus:var(--luzmo-background-color-focus);--button-border-color-default:var(--luzmo-secondary);--button-border-color-hover:var(--luzmo-secondary-hover);--button-border-color-down:var(--luzmo-secondary-down);--button-border-color-focus:var(--luzmo-secondary-focus);--button-content-color-default:var(--luzmo-secondary);--button-content-color-hover:var(--luzmo-secondary-down);--button-content-color-down:var(--luzmo-secondary-down);--button-content-color-focus:var(--luzmo-secondary-focus);--button-background-color-disabled:transparent;--button-border-color-disabled:var(--luzmo-border-color-disabled);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([variant=neutral]){--button-background-color-default:var(--luzmo-background-color-highlight);--button-background-color-hover:var(--luzmo-background-color-highlight-hover);--button-background-color-down:var(--luzmo-background-color-highlight-down);--button-background-color-focus:var(--luzmo-background-color-highlight-focus);--button-border-color-default:var(--luzmo-border-color);--button-border-color-hover:var(--luzmo-border-color);--button-border-color-down:var(--luzmo-border-color-down);--button-border-color-focus:var(--luzmo-border-color-focus);--button-content-color-default:var(--luzmo-font-color);--button-content-color-hover:var(--luzmo-font-color-hover);--button-content-color-down:var(--luzmo-font-color-down);--button-content-color-focus:var(--luzmo-font-color-focus);--button-background-color-disabled:var(--luzmo-background-color-disabled);--button-border-color-disabled:var(--luzmo-border-color-disabled);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([variant=neutral][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:rgba(var(--luzmo-border-color-rgb), .1);--button-background-color-down:rgba(var(--luzmo-border-color-rgb), .16);--button-background-color-focus:rgba(var(--luzmo-border-color-rgb), .1);--button-border-color-default:var(--luzmo-border-color);--button-border-color-hover:var(--luzmo-border-color-hover);--button-border-color-down:var(--luzmo-border-color-down);--button-border-color-focus:var(--luzmo-border-color-focus);--button-content-color-default:var(--luzmo-font-color);--button-content-color-hover:var(--luzmo-font-color-hover);--button-content-color-down:var(--luzmo-font-color-down);--button-content-color-focus:var(--luzmo-font-color-focus);--button-background-color-disabled:transparent;--button-border-color-disabled:var(--luzmo-border-color-disabled);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([quiet]){--button-background-color-default:transparent;--button-background-color-hover:var(--luzmo-background-color-hover);--button-background-color-down:var(--luzmo-background-color-down);--button-background-color-focus:var(--luzmo-background-color-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-background-color-disabled:transparent;--button-border-color-disabled:transparent}:host([variant=primary][quiet]),:host([variant=secondary][quiet]),:host([variant=negative][quiet]),:host([variant=positive][quiet]){--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-border-color-disabled:transparent;--button-content-color-default:var(--luzmo-font-color);--button-content-color-hover:var(--luzmo-font-color-hover);--button-content-color-down:var(--luzmo-font-color-down);--button-content-color-focus:var(--luzmo-font-color-focus);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([variant=neutral][quiet]){--button-background-color-default:transparent;--button-background-color-hover:var(--luzmo-background-color-hover);--button-background-color-down:var(--luzmo-background-color-down);--button-background-color-focus:var(--luzmo-background-color-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-border-color-disabled:transparent;--button-content-color-default:var(--luzmo-font-color);--button-content-color-hover:var(--luzmo-font-color-hover);--button-content-color-down:var(--luzmo-font-color-down);--button-content-color-focus:var(--luzmo-font-color-focus);--button-content-color-disabled:var(--luzmo-font-color-disabled)}:host([selected]){--button-background-color-default:var(--luzmo-selected-color);--button-background-color-hover:var(--luzmo-selected-color-hover);--button-background-color-down:var(--luzmo-selected-color-down);--button-background-color-focus:var(--luzmo-selected-color-focus);--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:white;--button-content-color-hover:white;--button-content-color-down:white;--button-content-color-focus:white;--button-background-color-disabled:var(--luzmo-background-color-disabled);--button-border-color-disabled:transparent}:host([selected][emphasized]){--button-background-color-default:transparent;--button-background-color-hover:var(--luzmo-background-color-hover);--button-background-color-down:var(--luzmo-background-color-down);--button-background-color-focus:var(--luzmo-background-color-focus)}:host([static-color=black][quiet]),:host([static-color=white][quiet]){--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-border-color-disabled:transparent}:host([static-color=white]){--button-background-color-default:rgba(255, 255, 255 .9);--button-background-color-hover:#fff;--button-background-color-down:#fff;--button-background-color-focus:#fff;--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:#000;--button-content-color-hover:#000;--button-content-color-down:#000;--button-content-color-focus:#000;--button-focus-indicator-color:#fff;--button-background-color-disabled:#ffffff1a;--button-border-color-disabled:transparent;--button-content-color-disabled:#ffffff8c}:host([static-color=white][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:#ffffff40;--button-background-color-down:#fff6;--button-background-color-focus:#ffffff40;--button-border-color-default:#ffffffe6;--button-border-color-hover:#fff;--button-border-color-down:#fff;--button-border-color-focus:#fff;--button-content-color-default:#fff;--button-content-color-hover:#fff;--button-content-color-down:#fff;--button-content-color-focus:#fff;--button-focus-indicator-color:#fff;--button-background-color-disabled:transparent;--button-border-color-disabled:#ffffff40;--button-content-color-disabled:#ffffff8c}:host([static-color=white][selected]){--button-background-color-default:#ffffffe6;--button-background-color-hover:#fff;--button-background-color-down:#fff;--button-background-color-focus:#fff;--button-static-white-content-color-default:#000;--button-static-white-content-color-hover:#000;--button-static-white-content-color-down:#000;--button-static-white-content-color-focus:#000;--button-background-color-disabled:#ffffff1a;--button-border-color-disabled:transparent}:host([static-color=white][variant=secondary]){--button-background-color-default:#ffffff1a;--button-background-color-hover:#ffffff40;--button-background-color-down:#fff6;--button-background-color-focus:#ffffff40;--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:#fff;--button-content-color-hover:#fff;--button-content-color-down:#fff;--button-content-color-focus:#fff;--button-focus-indicator-color:#fff;--button-background-color-disabled:#ffffff1a;--button-border-color-disabled:transparent;--button-content-color-disabled:#ffffff8c}:host([static-color=white][variant=secondary][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:#ffffff40;--button-background-color-down:#fff6;--button-background-color-focus:#ffffff40;--button-border-color-default:#ffffff40;--button-border-color-hover:#fff6;--button-border-color-down:#ffffff8c;--button-border-color-focus:#fff6;--button-content-color-default:#fff;--button-content-color-hover:#fff;--button-content-color-down:#fff;--button-content-color-focus:#fff;--button-focus-indicator-color:#fff;--button-background-color-disabled:transparent;--button-border-color-disabled:#ffffff40;--button-content-color-disabled:#ffffff8c}:host([static-color=black]){--button-background-color-default:#000000e6;--button-background-color-hover:#000;--button-background-color-down:#000;--button-background-color-focus:#000;--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:#fff;--button-content-color-hover:#fff;--button-content-color-down:#fff;--button-content-color-focus:#fff;--button-focus-indicator-color:#000;--button-background-color-disabled:#0000001a;--button-border-color-disabled:transparent;--button-content-color-disabled:#0000008c}:host([static-color=black][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:#00000040;--button-background-color-down:#0006;--button-background-color-focus:#00000040;--button-border-color-default:#0006;--button-border-color-hover:#0000008c;--button-border-color-down:#000000b3;--button-border-color-focus:#0000008c;--button-content-color-default:#000;--button-content-color-hover:#000;--button-content-color-down:#000;--button-content-color-focus:#000;--button-focus-indicator-color:#000;--button-background-color-disabled:transparent;--button-border-color-disabled:#00000040;--button-content-color-disabled:#0000008c}:host([static-color=black][variant=secondary]){--button-background-color-default:#0000001a;--button-background-color-hover:#00000040;--button-background-color-down:#0006;--button-background-color-focus:#00000040;--button-border-color-default:transparent;--button-border-color-hover:transparent;--button-border-color-down:transparent;--button-border-color-focus:transparent;--button-content-color-default:#000;--button-content-color-hover:#000;--button-content-color-down:#000;--button-content-color-focus:#000;--button-focus-indicator-color:#000;--button-background-color-disabled:#0000001a;--button-border-color-disabled:transparent;--button-content-color-disabled:#0000008c}:host([static-color=black][variant=secondary][treatment=outline]){--button-background-color-default:transparent;--button-background-color-hover:#00000040;--button-background-color-down:#0006;--button-background-color-focus:#00000040;--button-border-color-default:#00000040;--button-border-color-hover:#0006;--button-border-color-down:#0000008c;--button-border-color-focus:#0006;--button-content-color-default:#000;--button-content-color-hover:#000;--button-content-color-down:#000;--button-content-color-focus:#000;--button-focus-indicator-color:#000;--button-background-color-disabled:transparent;--button-border-color-disabled:#00000040;--button-content-color-disabled:#0000008c}:host([size=xs]){--button-min-width:44px;--button-border-radius:var(--luzmo-border-radius-s);--button-height:var(--luzmo-component-height-xs);--button-font-size:11px;--button-edge-to-visual:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--button-edge-to-text:var(--luzmo-spacing-3);--button-padding-label-to-icon:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1))}:host([size=s]){--button-min-width:64px;--button-border-radius:var(--luzmo-border-radius-s);--button-height:var(--luzmo-component-height-s);--button-font-size:var(--luzmo-font-size-s);--button-edge-to-visual:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--button-edge-to-text:var(--luzmo-spacing-4);--button-padding-label-to-icon:var(--luzmo-spacing-3)}:host{--button-min-width:72px;--button-border-radius:var(--luzmo-border-radius);--button-height:var(--luzmo-component-height);--button-font-size:var(--luzmo-font-size-m);--button-edge-to-visual:var(--luzmo-spacing-4);--button-edge-to-text:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--button-padding-label-to-icon:var(--luzmo-spacing-3)}:host([size=l]){--button-min-width:90px;--button-border-radius:var(--luzmo-border-radius);--button-height:var(--luzmo-component-height-l);--button-font-size:var(--luzmo-font-size-l);--button-edge-to-visual:var(--luzmo-spacing-5);--button-edge-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-1));--button-padding-label-to-icon:var(--luzmo-spacing-3)}:host([size=xl]){--button-min-width:108px;--button-border-radius:var(--luzmo-border-radius);--button-height:var(--luzmo-component-height-xl);--button-font-size:var(--luzmo-font-size-xl);--button-edge-to-visual:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-2));--button-edge-to-text:calc(var(--luzmo-spacing-5) + var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--button-padding-label-to-icon:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}@media (forced-colors:active){:host([treatment][disabled]){border-color:graytext!important}:host([treatment]:not([disabled]):hover){border-color:highlight!important}:host(.remove-focus-ring-safari-hack:focus-visible):after{forced-color-adjust:none;box-shadow:none}}@keyframes show-progress-circle{0%{visibility:hidden}to{visibility:visible}}@keyframes hide-icons-label{0%{visibility:visible}to{visibility:hidden}}@keyframes update-pending-button-styles{to{background-color:var(--highcontrast-button-background-color-disabled,var(--luzmo-button-background-color-disabled,var(--button-background-color-disabled)));color:var(--highcontrast-button-content-color-disabled,var(--luzmo-button-content-color-disabled,var(--button-content-color-disabled)));border-color:var(--highcontrast-button-border-color-disabled,var(--luzmo-button-border-color-disabled,var(--button-border-color-disabled)))!important}}:host([pending]:not([disabled])){cursor:default;pointer-events:none;animation:update-pending-button-styles 0s var(--pending-delay,1s) forwards}::slotted([slot=icon]){visibility:revert-layer;--luzmo-progress-circle-position:relative;--icon-size:inherit}luzmo-progress-circle{visibility:hidden;display:block;position:absolute;left:50%;transform:translate(-50%)}:host([pending]:not([disabled])) luzmo-progress-circle{animation:show-progress-circle 0s var(--pending-delay,1s) forwards}:host([pending]:not([disabled])) slot[name=icon],:host([pending]:not([disabled])) #label{animation:hide-icons-label 0s var(--pending-delay,1s) forwards}:host(.remove-focus-ring-safari-hack:focus-visible):after{margin:calc(-1 * var(--luzmo-button-focus-indicator-gap,var(--luzmo-focus-indicator-gap,var(--focus-indicator-gap))));box-shadow:none}:host(.remove-focus-ring-safari-hack:focus-visible){box-shadow:none;outline:none}:host(.remove-focus-ring-safari-hack:focus-visible:not(:hover)){background-color:var(--highcontrast-button-background-color-default,var(--luzmo-button-background-color-default,var(--button-background-color-default)));color:var(--highcontrast-button-content-color-default,var(--luzmo-button-content-color-default,var(--button-content-color-default)));border-color:var(--highcontrast-button-border-color-default,var(--luzmo-button-border-color-default,var(--button-border-color-default)))!important}", p = [
29
- "primary",
30
- "secondary",
31
- "neutral",
32
- "negative",
33
- "positive",
34
- "white",
35
- "black"
36
- ], m = class extends t(n, {
37
- validSizes: [
38
- "xs",
39
- "s",
40
- "m",
41
- "l",
42
- "xl"
43
- ],
44
- noDefaultSize: !0
45
- }) {
46
- static get styles() {
47
- return [...super.styles, o(f)];
48
- }
49
- constructor() {
50
- super(), this.pendingLabel = "Pending", this.pending = !1, this._variant = "primary", this.treatment = "fill", this._quiet = !1, this.noWrap = !1, this.pendingStateController = new i(this);
51
- }
52
- click() {
53
- this.pending || super.click();
54
- }
55
- get variant() {
56
- return this._variant;
57
- }
58
- set variant(e) {
59
- if (e !== this.variant) {
60
- switch (this.requestUpdate("variant", this.variant), e) {
61
- case "white":
62
- this.staticColor = e, this.removeAttribute("variant");
63
- return;
64
- case "black":
65
- this.staticColor = e, this.removeAttribute("variant");
66
- return;
67
- case null: return;
68
- default:
69
- this._variant = p.includes(e) ? e : "primary";
70
- break;
71
- }
72
- this.setAttribute("variant", this.variant);
73
- }
74
- }
75
- set quiet(e) {
76
- this._quiet = e, this.treatment = e ? "outline" : "fill";
77
- }
78
- get quiet() {
79
- return this._quiet;
80
- }
81
- firstUpdated(e) {
82
- super.firstUpdated(e), this.hasAttribute("variant") || this.setAttribute("variant", this.variant), this.pending && this.pendingStateController.hostUpdated();
83
- }
84
- renderButton() {
85
- return a`
86
- ${this.buttonContent} ${this.pendingStateController.renderPendingState()}
87
- `;
88
- }
89
- };
90
- e([s({
91
- type: String,
92
- attribute: "pending-label"
93
- })], m.prototype, "pendingLabel", void 0), e([s({
94
- type: Boolean,
95
- reflect: !0,
96
- attribute: !0
97
- })], m.prototype, "pending", void 0), e([s()], m.prototype, "variant", null), e([s({
98
- reflect: !0,
99
- attribute: "static-color"
100
- })], m.prototype, "staticColor", void 0), e([s({ reflect: !0 })], m.prototype, "treatment", void 0), e([s({
101
- type: Boolean,
102
- reflect: !0
103
- })], m.prototype, "quiet", null), e([s({
104
- type: Boolean,
105
- attribute: "no-wrap",
106
- reflect: !0
107
- })], m.prototype, "noWrap", void 0);
108
- //#endregion
109
- //#region src/components/button/clear-button.module.scss?inline
110
- var h = ":host{font-size:var(--luzmo-clear-button-icon-size,var(--clear-button-icon-size));cursor:pointer;background-color:initial;background-color:var(--luzmo-clear-button-background-color,transparent);padding:var(--luzmo-clear-button-padding,var(--clear-button-padding));color:var(--luzmo-clear-button-icon-color,var(--clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover:hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover,var(--luzmo-clear-button-icon-color-hover,var(--clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--luzmo-clear-button-background-color-hover,var(--clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--luzmo-clear-button-icon-color-down,var(--clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--luzmo-clear-button-background-color-down,var(--clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within,:host([focus-within]) .js-focus-within{color:var(--luzmo-clear-button-icon-color-key-focus,var(--clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill,:host([focus-within]) .js-focus-within .fill{background-color:var(--luzmo-clear-button-background-color-key-focus,var(--clear-button-background-color-key-focus))}:host([disabled]),:host([disabled]){--clear-button-icon-color:var(--luzmo-clear-button-icon-color-disabled,var(--disabled-content-color));--clear-button-background-color:var(--luzmo-clear-button-background-color-disabled,transparent)}.fill{background-color:var(--luzmo-clear-button-background-color,var(--clear-button-background-color));border-radius:100%;justify-content:center;align-items:center;block-size:100%;inline-size:100%;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors:active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover:Highlight}}:host{--clear-button-background-color:transparent;--clear-button-background-color-hover:transparent;--clear-button-background-color-down:transparent;--clear-button-background-color-key-focus:transparent;--clear-button-icon-size:var(--luzmo-font-size);--clear-button-padding:0px;--clear-button-icon-color:var(--luzmo-font-color);--clear-button-icon-color-hover:var(--luzmo-font-color-hover);--clear-button-icon-color-down:var(--luzmo-font-color-down);--clear-button-icon-color-key-focus:var(--luzmo-font-color-focus)}:host([size=s]){--clear-button-icon-size:var(--luzmo-font-size-s)}:host([size=l]){--clear-button-icon-size:var(--luzmo-font-size-l)}:host([size=xl]){--clear-button-icon-size:var(--luzmo-font-size-xl)}:host .luzmo-ClearButton--quiet{--clear-button-background-color:transparent;--clear-button-background-color-hover:transparent;--clear-button-background-color-down:transparent;--clear-button-background-color-key-focus:transparent}:host([variant=overBackground]){--clear-button-icon-color:#fff;--clear-button-icon-color-hover:#fff;--clear-button-icon-color-down:#fff;--clear-button-icon-color-key-focus:#fff;--clear-button-background-color:transparent;--clear-button-background-color-hover:#ffffff40;--clear-button-background-color-down:#fff6;--clear-button-background-color-key-focus:#ffffff40}:host([disabled]),:host([disabled]){--clear-button-icon-color:var(--luzmo-disabled-color);--clear-button-icon-color-hover:var(--luzmo-disabled-color);--clear-button-icon-color-down:var(--luzmo-disabled-color);--clear-button-background-color:transparent}:host{box-sizing:border-box}", g = (e) => a` <div class="icon" slot="icon">${d(e === "s" ? l : ["xl", "l"].includes(e) ? c : u)}</div> `, _ = class extends t(n, { noDefaultSize: !0 }) {
111
- constructor(...e) {
112
- super(...e), this.variant = "";
113
- }
114
- static get styles() {
115
- return [...super.styles, o(h)];
116
- }
117
- get buttonContent() {
118
- return [g(this.size)];
119
- }
120
- render() {
121
- return a` <div class="fill">${super.render()}</div> `;
122
- }
123
- };
124
- e([s({ reflect: !0 })], _.prototype, "variant", void 0), typeof customElements < "u" && !customElements.get("luzmo-button") && customElements.define("luzmo-button", m), typeof customElements < "u" && !customElements.get("luzmo-clear-button") && customElements.define("luzmo-clear-button", _), typeof customElements < "u" && !customElements.get("luzmo-close-button") && customElements.define("luzmo-close-button", r);
125
- //#endregion
126
- export { m as n, _ as t };