@luzmo/lucero 1.0.3-alpha.2 → 1.0.3-alpha.20
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +16 -16
- package/README.md +0 -4
- package/components/accordion/index.cjs +17 -17
- package/components/accordion/index.js +18 -18
- package/components/{accordion-DC7cjb1c.js → accordion-BDchhAjE.js} +20 -20
- package/components/accordion-CW7xAsId.cjs +43 -0
- package/components/action-bar/index.cjs +17 -17
- package/components/action-bar/index.js +18 -18
- package/components/{action-bar-Dn4IDXEF.js → action-bar-Bg4e-l3a.js} +22 -22
- package/components/action-bar-DMwIDDPw.cjs +39 -0
- package/components/action-button/action-button.d.ts +12 -1
- package/components/action-button/index.cjs +17 -17
- package/components/action-button/index.d.ts +1 -1
- package/components/action-button/index.js +18 -18
- package/components/{action-button-BSofLc03.js → action-button-NzV0nn14.js} +25 -25
- package/components/action-button-fCvHkuEM.cjs +22 -0
- package/components/action-group/index.cjs +17 -17
- package/components/action-group/index.js +18 -18
- package/components/{action-group-DYKpp-mz.js → action-group-BQ-fyPYS.js} +19 -19
- package/components/action-group-D1G30Iir.cjs +20 -0
- package/components/action-menu/index.cjs +17 -17
- package/components/action-menu/index.js +18 -18
- package/components/{action-menu-C04EVpwz.js → action-menu-B4rFNFVf.js} +24 -24
- package/components/{action-menu-NSNMnYa0.cjs → action-menu-BBubpnCw.cjs} +18 -18
- package/components/avatar/avatar.d.ts +17 -1
- package/components/avatar/index.cjs +17 -17
- package/components/avatar/index.js +18 -18
- package/components/avatar-BA5FPKYf.cjs +34 -0
- package/components/avatar-Nb0368Wi.js +98 -0
- package/components/badge/badge.d.ts +1 -1
- package/components/badge/index.cjs +17 -17
- package/components/badge/index.js +18 -18
- package/components/badge-6_IAkej3.cjs +23 -0
- package/components/badge-CKqoYhAy.js +94 -0
- package/components/button/button-base.d.ts +1 -0
- package/components/button/button.d.ts +1 -2
- package/components/button/index.cjs +17 -17
- package/components/button/index.js +19 -19
- package/components/button-BeF6gpKm.cjs +20 -0
- package/components/{button-base-CzTYjZND.js → button-base-Cr7Ri4lG.js} +42 -28
- package/components/{button-base-Dj2qQqwO.cjs → button-base-DC6VHp5W.cjs} +19 -19
- package/components/button-group/index.cjs +17 -17
- package/components/button-group/index.js +18 -18
- package/components/button-group-6M8M-TUI.cjs +18 -0
- package/components/{button-group-BiQxYcQ2.js → button-group-DaANSInm.js} +18 -18
- package/components/{button-BQlc1FVG.js → button-yeMxaZCR.js} +23 -22
- package/components/calendar/index.cjs +17 -17
- package/components/calendar/index.js +18 -18
- package/components/{calendar-CFIH72Za.js → calendar-BPnO-Ai8.js} +20 -20
- package/components/calendar-CCY5YDpD.cjs +142 -0
- package/components/chat-message/index.cjs +17 -17
- package/components/chat-message/index.js +18 -18
- package/components/{chat-message-DJgocVNj.js → chat-message-BDTAV-Ph.js} +695 -517
- package/components/chat-message-SBnm0ITB.cjs +150 -0
- package/components/chat-message-group/index.cjs +17 -17
- package/components/chat-message-group/index.js +18 -18
- package/components/chat-message-group-CzCwyW7F.cjs +24 -0
- package/components/{chat-message-group-B4U2MzHx.js → chat-message-group-D7vdn2gG.js} +18 -18
- package/components/checkbox/checkbox.d.ts +8 -1
- package/components/checkbox/index.cjs +17 -17
- package/components/checkbox/index.js +18 -18
- package/components/{checkbox-CPS-tR_i.js → checkbox-6YzkdHR4.js} +25 -21
- package/components/checkbox-DdatW4xE.cjs +25 -0
- package/components/{checkbox-mixin-C5sLMo5L.js → checkbox-mixin-jqmrh48O.js} +18 -18
- package/components/{checkbox-mixin-D4HeLrMj.cjs → checkbox-mixin-rFRXqyrK.cjs} +19 -19
- package/components/{close-button-MgaJT7yO.js → close-button-LSSbv5ia.js} +20 -20
- package/components/close-button-hePosu7B.cjs +18 -0
- package/components/color-area/color-area.d.ts +7 -0
- package/components/color-area/index.cjs +17 -17
- package/components/color-area/index.js +18 -18
- package/components/color-area-B5OHLqtm.cjs +80 -0
- package/components/{color-area-DViRjuKo.js → color-area-CAM3uysY.js} +30 -28
- package/components/color-controller-DZe3_BMD.cjs +18 -0
- package/components/{color-controller-G2_v2xSl.js → color-controller-Rg_Zl0sT.js} +16 -16
- package/components/color-field/index.cjs +17 -17
- package/components/color-field/index.js +18 -18
- package/components/{color-field-CxdIoSq6.js → color-field-BBUgyihj.js} +19 -19
- package/components/{color-field-D7_7z2A2.cjs → color-field-BKBpEfot.cjs} +18 -18
- package/components/color-handle/index.cjs +17 -17
- package/components/color-handle/index.js +18 -18
- package/components/color-handle-BwV3Nia5.cjs +24 -0
- package/components/{color-handle-BOusOFFx.js → color-handle-DioEcX1V.js} +18 -18
- package/components/color-loupe/index.cjs +17 -17
- package/components/color-loupe/index.js +18 -18
- package/components/color-loupe-C_C2hy-m.cjs +56 -0
- package/components/{color-loupe-bEzi2P0y.js → color-loupe-ZcCecT0r.js} +17 -17
- package/components/color-menu/index.cjs +17 -17
- package/components/color-menu/index.js +18 -18
- package/components/{color-menu-Lxc9PTzl.js → color-menu-CZGDEdC4.js} +25 -25
- package/components/color-menu-etodAPbs.cjs +89 -0
- package/components/color-palette/index.cjs +17 -17
- package/components/color-palette/index.js +18 -18
- package/components/color-palette-C6G0Tdla.cjs +18 -0
- package/components/{color-palette-BAdaNySC.js → color-palette-FQyIMSwP.js} +19 -19
- package/components/color-palette-group/index.cjs +17 -17
- package/components/color-palette-group/index.js +18 -18
- package/components/color-palette-group-B4r4tPfY.cjs +28 -0
- package/components/{color-palette-group-D8Mavsd2.js → color-palette-group-o6bnF-Ir.js} +19 -19
- package/components/color-picker/index.cjs +17 -17
- package/components/color-picker/index.js +18 -18
- package/components/{color-picker-DqjfTvYf.js → color-picker-BPHkTsWA.js} +22 -22
- package/components/{color-picker-CSWiU-X5.cjs → color-picker-TV7ke61W.cjs} +18 -18
- package/components/color-slider/index.cjs +17 -17
- package/components/color-slider/index.js +18 -18
- package/components/{color-slider-ihAIFt5p.js → color-slider-BZ3G8Zgn.js} +22 -21
- package/components/color-slider-CVSEpLOP.cjs +57 -0
- package/components/{condition-attribute-with-id-Duo51HZ7.js → condition-attribute-with-id-BdnTdWKz.js} +16 -16
- package/components/{condition-attribute-with-id-DauPaLSS.cjs → condition-attribute-with-id-Cw92IbcP.cjs} +17 -17
- package/components/date-range-picker/index.cjs +17 -17
- package/components/date-range-picker/index.js +18 -18
- package/components/{date-range-picker-0s9hOMwi.js → date-range-picker-DJuCh24v.js} +34 -41
- package/components/date-range-picker-Z2Zu2Iji.cjs +180 -0
- package/components/date-time-picker/index.cjs +17 -17
- package/components/date-time-picker/index.js +18 -18
- package/components/date-time-picker-Ch8xgasP.cjs +105 -0
- package/components/{date-time-picker-6__gpQQK.js → date-time-picker-D_2YM-f1.js} +28 -28
- package/components/{decorate-aGxJUVxg.js → decorate-CkCg3wfh.js} +17 -17
- package/components/decorate-Dq34MBGe.cjs +18 -0
- package/components/{dependency-manger-CHy9t__e.cjs → dependency-manger-BSaHw9ju.cjs} +17 -17
- package/components/{dependency-manger-DMrulWcJ.js → dependency-manger-wHEXoU92.js} +16 -16
- package/components/divider/index.cjs +17 -17
- package/components/divider/index.js +18 -18
- package/components/{divider-cU0lVwOp.js → divider-CGbT-CL8.js} +19 -19
- package/components/divider-wana0uPI.cjs +18 -0
- package/components/{divider.module-CL60P_z8.cjs → divider.module-BV6tmpOY.cjs} +17 -17
- package/components/{divider.module-C65RfSUa.js → divider.module-CPEKsaqR.js} +16 -16
- package/components/{element-resolution-C0aiOB0Y.cjs → element-resolution-BjaAlqwX.cjs} +17 -17
- package/components/{element-resolution-Bs1x89vU.js → element-resolution-gap51AVo.js} +16 -16
- package/components/field-group/index.cjs +17 -17
- package/components/field-group/index.js +18 -18
- package/components/{field-group-C7ROsWq3.js → field-group-EZzkXa2e.js} +18 -18
- package/components/{field-group-OcI5Lgu7.cjs → field-group-aWhlzhoj.cjs} +18 -18
- package/components/field-label/index.cjs +17 -17
- package/components/field-label/index.js +18 -18
- package/components/{field-label-CtGCEmdp.js → field-label-B9S41b7c.js} +21 -21
- package/components/field-label-C5vdJ1ys.cjs +25 -0
- package/components/focus-group-C8lOjbi9.cjs +18 -0
- package/components/{focus-group-BshI1RpM.js → focus-group-DVPa1zxz.js} +17 -17
- package/components/{focus-visible-CrooVCUu.js → focus-visible-Bt2uDmuM.js} +18 -18
- package/components/focus-visible-eQdwUM9k.cjs +18 -0
- package/components/focusable-DTxxQ3yJ.cjs +18 -0
- package/components/{focusable-BmS8IzhH.js → focusable-DuP0-Kuy.js} +18 -18
- package/components/{focusable-selectors-Bg60_Kra.js → focusable-selectors-BWpiuXz5.js} +16 -16
- package/components/{focusable-selectors-5n5liBn0.cjs → focusable-selectors-DJqGLTJo.cjs} +17 -17
- package/components/{get-label-from-slot-5vVnfSgN.js → get-label-from-slot-Bo9mqYCZ.js} +16 -16
- package/components/{get-label-from-slot-LO_DZP60.cjs → get-label-from-slot-TV4APBYs.cjs} +17 -17
- package/components/icon/index.cjs +17 -17
- package/components/icon/index.js +18 -18
- package/components/icon-CSqR-OOO.cjs +18 -0
- package/components/{icon-CwBAE1eU.js → icon-DB1DRieA.js} +21 -18
- package/components/index.cjs +17 -17
- package/components/index.js +87 -85
- package/components/infield-button/index.cjs +17 -17
- package/components/infield-button/index.js +18 -18
- package/components/infield-button-BH9eZ-wh.cjs +22 -0
- package/components/{infield-button-BvKsbtKr.js → infield-button-Be8fAlwl.js} +19 -19
- package/components/label/index.cjs +17 -17
- package/components/label/index.js +18 -18
- package/components/{label-ClJE2esm.js → label-B1HYQ4Pp.js} +17 -17
- package/components/label-DPG13Ib0.cjs +18 -0
- package/components/{language-resolution-BYemISJC.cjs → language-resolution-BUeKpSce.cjs} +17 -17
- package/components/{language-resolution-BpfGTC29.js → language-resolution-DR30FsWE.js} +16 -16
- package/components/{like-anchor-BZJXts_H.cjs → like-anchor-BX4PSB3d.cjs} +18 -18
- package/components/{like-anchor-DeOXX-MX.js → like-anchor-DXCaEv7O.js} +17 -17
- package/components/{manage-help-text-D9VbYRf_.cjs → manage-help-text-D20THJ3U.cjs} +18 -18
- package/components/{manage-help-text-CF0xBh0F.js → manage-help-text-DwfUBgHK.js} +18 -18
- package/components/menu/index.cjs +17 -17
- package/components/menu/index.d.ts +6 -4
- package/components/menu/index.js +18 -18
- package/components/menu/menu-item.d.ts +15 -1
- package/components/menu/menu.d.ts +12 -1
- package/components/menu-CANwe_S_.cjs +108 -0
- package/components/{menu--ukVtSq7.js → menu-CFuHyNrJ.js} +112 -86
- package/components/multi-language-field/index.cjs +17 -17
- package/components/multi-language-field/index.js +18 -18
- package/components/{multi-language-field-DmoMyCBH.cjs → multi-language-field-CpDYvREK.cjs} +18 -18
- package/components/{multi-language-field-BzY75rOY.js → multi-language-field-ccoVXf52.js} +20 -20
- package/components/notice/index.cjs +18 -0
- package/components/notice/index.d.ts +8 -0
- package/components/notice/index.js +25 -0
- package/components/notice/notice.d.ts +121 -0
- package/components/notice-DM0t8OGE.cjs +60 -0
- package/components/notice-Dh4ZSFiD.js +218 -0
- package/components/number-field/index.cjs +17 -17
- package/components/number-field/index.js +18 -18
- package/components/{number-field-DrJURvoW.js → number-field-Bq5UYCe4.js} +23 -23
- package/components/number-field-CjqUSR4r.cjs +57 -0
- package/components/{observe-slot-presence-BCqd3VSd.js → observe-slot-presence-BKY6n06-.js} +16 -16
- package/components/observe-slot-presence-CS8pMePk.cjs +18 -0
- package/components/{observe-slot-text-Ddf1OC6F.js → observe-slot-text-97nX6NyX.js} +17 -17
- package/components/observe-slot-text-DzUSxLpj.cjs +18 -0
- package/components/options/index.cjs +17 -17
- package/components/options/index.d.ts +5 -3
- package/components/options/index.js +18 -18
- package/components/options/option.d.ts +0 -1
- package/components/{options-BPNAm4MW.cjs → options-B2n3Z0hu.cjs} +19 -19
- package/components/{options-Dz-ejkxF.js → options-Cz3bzQcl.js} +37 -27
- package/components/overlay/index.cjs +17 -17
- package/components/overlay/index.d.ts +3 -2
- package/components/overlay/index.js +20 -20
- package/components/overlay/overlay-trigger.d.ts +1 -1
- package/components/overlay/placement-controller.d.ts +8 -0
- package/components/{overlay-8tN0KPbR.js → overlay-CQGim3da.js} +150 -143
- package/components/overlay-CjpXF18_.cjs +47 -0
- package/components/{overlay-CMd2Dnpv.cjs → overlay-DPa_xLrt.cjs} +18 -18
- package/components/{overlay-CwR_36OV.js → overlay-D_W2gqGD.js} +19 -19
- package/components/{pending-state-DFcNf5rd.js → pending-state-BeG7qBDP.js} +17 -17
- package/components/{pending-state-DIeF18qg.cjs → pending-state-a527YMWV.cjs} +18 -18
- package/components/picker/index.cjs +17 -17
- package/components/picker/index.js +18 -18
- package/components/picker/picker.d.ts +8 -0
- package/components/{picker-agQW7YNo.js → picker-CsdtFxM2.js} +92 -91
- package/components/picker-Dlb6GY69.cjs +124 -0
- package/components/picker-button/index.cjs +17 -17
- package/components/picker-button/index.js +18 -18
- package/components/{picker-button-VAxzuhhg.js → picker-button-BJPlw2LD.js} +21 -21
- package/components/picker-button-d90ILvsN.cjs +37 -0
- package/components/platform-BAjeJp2W.cjs +18 -0
- package/components/{platform-D4V_cOJF.js → platform-Ce9pNsR9.js} +18 -18
- package/components/popover/index.cjs +17 -17
- package/components/popover/index.js +18 -18
- package/components/{popover-DyC9xGhX.js → popover-CFawf-z9.js} +19 -19
- package/components/popover-R-fdNBvR.cjs +30 -0
- package/components/progress-bar/index.cjs +17 -17
- package/components/progress-bar/index.js +18 -18
- package/components/{progress-bar-DHgFRml1.js → progress-bar-BU_h5i27.js} +19 -19
- package/components/progress-bar-DHmthnzp.cjs +31 -0
- package/components/progress-circle/index.cjs +17 -17
- package/components/progress-circle/index.js +18 -18
- package/components/{progress-circle-Cg_ua9Ff.js → progress-circle-BVToDWX8.js} +19 -19
- package/components/progress-circle-DyApSKdm.cjs +33 -0
- package/components/progress-steps/index.cjs +17 -17
- package/components/progress-steps/index.js +18 -18
- package/components/{progress-steps-Da8aZWx3.js → progress-steps-9unA0ptN.js} +18 -18
- package/components/progress-steps-BgRH7KAn.cjs +96 -0
- package/components/prompt-box/controllers/attachments-controller.d.ts +1 -0
- package/components/prompt-box/index.cjs +17 -17
- package/components/prompt-box/index.d.ts +2 -1
- package/components/prompt-box/index.js +19 -19
- package/components/prompt-box/prompt-box-templates.d.ts +4 -0
- package/components/prompt-box/prompt-box.d.ts +33 -4
- package/components/prompt-box/types.d.ts +8 -0
- package/components/{prompt-box-BeC7ug1f.js → prompt-box-B5D8JXC5.js} +254 -198
- package/components/prompt-box-C6zr6tsk.cjs +314 -0
- package/components/question-box/index.cjs +18 -0
- package/components/question-box/index.d.ts +11 -0
- package/components/question-box/index.js +25 -0
- package/components/question-box/question-box-elicitation.d.ts +58 -0
- package/components/question-box/question-box-model.d.ts +25 -0
- package/components/question-box/question-box-templates.d.ts +65 -0
- package/components/question-box/question-box.d.ts +182 -0
- package/components/question-box/types.d.ts +124 -0
- package/components/question-box-DH5MHYH8.js +1171 -0
- package/components/question-box-bSNyfRmw.cjs +401 -0
- package/components/radio/index.cjs +17 -17
- package/components/radio/index.js +18 -18
- package/components/radio/radio-group.d.ts +5 -1
- package/components/radio/radio.d.ts +7 -1
- package/components/{radio-BzEPGUmQ.js → radio-BRHNAlZa.js} +46 -42
- package/components/radio-B_K-hwKG.cjs +22 -0
- package/components/{random-id-B51lUxUB.cjs → random-id-BcUJAxUZ.cjs} +17 -17
- package/components/{random-id-Dd4boCPV.js → random-id-CiMDyX7v.js} +17 -17
- package/components/{chunk-D-qHiVGv.cjs → rolldown-runtime-DWNI8pZO.cjs} +17 -17
- package/components/{rolldown-runtime-CAFD8bLK.js → rolldown-runtime-Dy4uBu1J.js} +16 -16
- package/components/{roving-tabindex-B7x5ePUB.cjs → roving-tabindex-BoPao4td.cjs} +17 -17
- package/components/{roving-tabindex-BP6mQbXf.js → roving-tabindex-pomAn3z-.js} +17 -17
- package/components/{scaled-indicator-BoLeYSgL.js → scaled-indicator-C-TupV4L.js} +16 -16
- package/components/{scaled-indicator-DF45Sc3W.cjs → scaled-indicator-DLJIztx0.cjs} +18 -18
- package/components/search/index.cjs +17 -17
- package/components/search/index.js +18 -18
- package/components/search/search.d.ts +1 -0
- package/components/search-BBl2dsHy.cjs +47 -0
- package/components/{search-DUBf5t9V.js → search-DXscuR-a.js} +44 -38
- package/components/{segments-factory-D0IveW-q.js → segments-factory-BCRi1NKb.js} +16 -16
- package/components/segments-factory-DtPyN5sh.cjs +18 -0
- package/components/select/index.cjs +17 -17
- package/components/select/index.js +18 -18
- package/components/select/select.d.ts +10 -3
- package/components/{select-DPeI0jP9.js → select-DZFvhLsJ.js} +54 -40
- package/components/select-DuWhvQ-k.cjs +158 -0
- package/components/sized-mixin-BT7cv-fT.cjs +18 -0
- package/components/{sized-mixin-DaBoZkVS.js → sized-mixin-DzQTebN-.js} +17 -17
- package/components/skeleton-loader/index.cjs +17 -17
- package/components/skeleton-loader/index.js +18 -18
- package/components/{skeleton-loader-C1XG3m_u.js → skeleton-loader-C0LH3prK.js} +17 -17
- package/components/skeleton-loader-Cm50Ztzk.cjs +18 -0
- package/components/slider/index.cjs +17 -17
- package/components/slider/index.js +18 -18
- package/components/{slider-3QBnq0S8.js → slider-BLaYicz8.js} +18 -18
- package/components/slider-CfZ2IRgC.cjs +18 -0
- package/components/{slottable-request-event-gAcEQan2.cjs → slottable-request-event-C6eb7Ch3.cjs} +17 -17
- package/components/{slottable-request-event-DZ2Z_BLk.js → slottable-request-event-MRSZbgTu.js} +16 -16
- package/components/status-light/index.cjs +17 -17
- package/components/status-light/index.js +18 -18
- package/components/{status-light-Bf8jGu4G.js → status-light-BlfBJpqa.js} +18 -18
- package/components/status-light-Bu0G8-lH.cjs +21 -0
- package/components/strategies-BwNbUXYS.cjs +18 -0
- package/components/{strategies-DhxJGIZT.js → strategies-Cl59wdNZ.js} +37 -35
- package/components/streaming-listener-Bfyk6Fsx.cjs +18 -0
- package/components/{streaming-listener-2NcP7ys7.js → streaming-listener-CtcMpYfS.js} +16 -16
- package/components/swatch/index.cjs +17 -17
- package/components/swatch/index.js +18 -18
- package/components/{swatch-BLuV-hlF.js → swatch-C2ty27bJ.js} +20 -20
- package/components/{swatch-G70JUe6I.cjs → swatch-DcUK5qDv.cjs} +18 -18
- package/components/switch/index.cjs +17 -17
- package/components/switch/index.js +18 -18
- package/components/{switch-C5g5t5x2.js → switch-Dyl_B21d.js} +20 -20
- package/components/switch-NLIF9Tpk.cjs +22 -0
- package/components/tabs/index.cjs +17 -17
- package/components/tabs/index.js +18 -18
- package/components/{tabs-NAfmrkG9.cjs → tabs-D2VpPBQl.cjs} +18 -18
- package/components/{tabs-3Bw_PICo.js → tabs-iDDff0OX.js} +27 -27
- package/components/tags/index.cjs +17 -17
- package/components/tags/index.js +18 -18
- package/components/tags/tag.d.ts +4 -3
- package/components/tags-BkGjSc7D.cjs +47 -0
- package/components/{tags-DOH-sF2s.js → tags-FChVGpMh.js} +28 -25
- package/components/text-field/help-text.d.ts +4 -0
- package/components/text-field/index.cjs +17 -17
- package/components/text-field/index.js +19 -19
- package/components/text-field/text-field.d.ts +9 -0
- package/components/text-field-BzZ4jEr6.cjs +21 -0
- package/components/{text-field-Cs8HYRYL.js → text-field-C56-sBct.js} +21 -21
- package/components/{text-field-FJr8ZUhI.cjs → text-field-COHW36-x.cjs} +18 -18
- package/components/{text-field-BoGAvXvh.js → text-field-nBag7DTk.js} +19 -19
- package/components/{text-field.module-Btsve-VN.js → text-field.module-BHhBReKL.js} +17 -17
- package/components/{text-field.module-D5oDP7MB.cjs → text-field.module-l8CaTCwE.cjs} +17 -17
- package/components/toast/index.cjs +17 -17
- package/components/toast/index.js +18 -18
- package/components/{toast-Bd0fleYT.js → toast-3eJGRjSl.js} +20 -20
- package/components/toast-B5vlhIVK.cjs +51 -0
- package/components/tooltip/index.cjs +17 -17
- package/components/tooltip/index.js +18 -18
- package/components/tooltip/tooltip.d.ts +30 -2
- package/components/{tooltip-C3O4AQ1l.js → tooltip-Byl1h4nN.js} +43 -28
- package/components/tooltip-Sm0pruxL.cjs +45 -0
- package/components/top-nav/index.cjs +17 -17
- package/components/top-nav/index.js +18 -18
- package/components/{top-nav-CMVB3G_v.js → top-nav-D3Iqfth0.js} +22 -22
- package/components/top-nav-Dqa5pB4f.cjs +45 -0
- package/components/utils.cjs +17 -17
- package/components/utils.js +23 -23
- package/components/{voice-recorder-BUtmSvPO.cjs → voice-recorder-B1tBrGTV.cjs} +17 -17
- package/components/{voice-recorder-477xPHRU.js → voice-recorder-CTg3kRxx.js} +16 -16
- package/custom-elements.json +1 -1
- package/index.d.ts +2 -0
- package/package.json +14 -2
- package/utils/button-interaction-controllers/interaction-controller.d.ts +2 -0
- package/utils/reactive-controllers/match-media.d.ts +1 -0
- package/components/accordion-BHBIfsLU.cjs +0 -43
- package/components/action-bar-BSMX042X.cjs +0 -39
- package/components/action-button-Cajz7Hgr.cjs +0 -24
- package/components/action-group-CH8FTW0i.cjs +0 -20
- package/components/avatar-CyY_ZSD0.js +0 -65
- package/components/avatar-PulwjkMI.cjs +0 -24
- package/components/badge-D1Ry32wi.cjs +0 -23
- package/components/badge-D6p2hPj8.js +0 -94
- package/components/button-CpaSKGC_.cjs +0 -20
- package/components/button-group-DIz5TZvc.cjs +0 -18
- package/components/calendar-CY6JMJfi.cjs +0 -142
- package/components/chat-message-CNE-mGuP.cjs +0 -149
- package/components/chat-message-group-COmhCN-R.cjs +0 -24
- package/components/checkbox-DFwDrIdY.cjs +0 -25
- package/components/close-button-_EXjp6_m.cjs +0 -18
- package/components/color-area-DA3ps2-c.cjs +0 -80
- package/components/color-controller-DueaXfnX.cjs +0 -18
- package/components/color-handle-Cka48yPY.cjs +0 -24
- package/components/color-loupe-DMk8uWZW.cjs +0 -56
- package/components/color-menu-DwbTxeqv.cjs +0 -89
- package/components/color-palette-349EkPMg.cjs +0 -18
- package/components/color-palette-group-BvP09zmT.cjs +0 -28
- package/components/color-slider-DxjJ72ue.cjs +0 -57
- package/components/date-range-picker-D-jd-to9.cjs +0 -187
- package/components/date-time-picker-BMb1clUv.cjs +0 -105
- package/components/decorate-B2wePfNm.cjs +0 -18
- package/components/divider-Dn8XqbB6.cjs +0 -18
- package/components/field-label-BCl6R1uO.cjs +0 -25
- package/components/focus-group-SF8Kj7iB.cjs +0 -18
- package/components/focus-visible-B0NNezGc.cjs +0 -18
- package/components/focusable-CupEoHmn.cjs +0 -18
- package/components/icon-B7hKwn_q.cjs +0 -18
- package/components/infield-button-D5cuBWE5.cjs +0 -22
- package/components/label-CqolZbJo.cjs +0 -18
- package/components/menu-DAA51y45.cjs +0 -108
- package/components/number-field-BmWODnnR.cjs +0 -57
- package/components/observe-slot-presence-Dx8hzNzK.cjs +0 -18
- package/components/observe-slot-text-BhTcGuHY.cjs +0 -18
- package/components/overlay-DdrfkOry.cjs +0 -47
- package/components/picker-C4RVOxLq.cjs +0 -123
- package/components/picker-button-adl1JO5u.cjs +0 -37
- package/components/platform-B7Sk7Qon.cjs +0 -18
- package/components/popover-dgL04x6P.cjs +0 -30
- package/components/progress-bar-BR28tISC.cjs +0 -31
- package/components/progress-circle-DuzwUiGN.cjs +0 -33
- package/components/progress-steps-WriXaZpE.cjs +0 -96
- package/components/prompt-box-CfKZ5VQx.cjs +0 -299
- package/components/radio-d-2GUbYE.cjs +0 -22
- package/components/search-CJtgI88g.cjs +0 -45
- package/components/segments-factory-CHo9oQw7.cjs +0 -18
- package/components/select--vrG59GQ.cjs +0 -158
- package/components/sized-mixin-StFA4y0J.cjs +0 -18
- package/components/skeleton-loader-B8NgELvX.cjs +0 -18
- package/components/slider-uXRKcOz5.cjs +0 -18
- package/components/status-light-CBaAFRUc.cjs +0 -21
- package/components/strategies-kuvLVIKO.cjs +0 -18
- package/components/streaming-listener-BnDW38lt.cjs +0 -18
- package/components/switch-COhz9ka9.cjs +0 -22
- package/components/tags-CTs77FhK.cjs +0 -47
- package/components/text-field-A4Obzs4l.cjs +0 -21
- package/components/toast-NZ0Z1lz9.cjs +0 -51
- package/components/tooltip-DY1trLtg.cjs +0 -45
- package/components/top-nav-bekRXHUk.cjs +0 -45
|
@@ -0,0 +1,47 @@
|
|
|
1
|
+
/*! * Lucero - The design system for Luzmo.
|
|
2
|
+
*
|
|
3
|
+
* Copyright © 2025 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
|
+
const e=require("./decorate-Dq34MBGe.cjs"),t=require("./sized-mixin-BT7cv-fT.cjs"),n=require("./focus-visible-eQdwUM9k.cjs"),r=require("./roving-tabindex-BoPao4td.cjs");require("./tooltip-Sm0pruxL.cjs"),require("./button-BeF6gpKm.cjs");let i=require("lit"),a=require("lit/decorators.js");var o=`:host{font-family:var(--luzmo-font-family);background-color:var(--highcontrast-tag-background-color,var(--luzmo-tag-background-color,var(--tag-background-color)));color:var(--highcontrast-tag-content-color,var(--luzmo-tag-content-color,var(--tag-content-color)));border-radius:var(--luzmo-tag-border-radius,var(--tag-border-radius));block-size:var(--luzmo-tag-height,var(--tag-height));box-sizing:border-box;vertical-align:bottom;max-inline-size:var(--luzmo-tag-max-inline-size,var(--tag-max-inline-size));-webkit-user-select:none;user-select:none;transition:border-color var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out, color var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out, box-shadow var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out, background-color var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out;outline:none;justify-content:center;align-items:center;padding-inline-start:calc(var(--luzmo-tag-spacing-inline-start,var(--tag-spacing-inline-start)) - var(--luzmo-tag-border-width,var(--tag-border-width)));padding-inline-end:0;display:inline-flex;position:relative;border-color:var(--highcontrast-tag-border-color,var(--luzmo-tag-border-color,var(--tag-border-color)))!important;border-width:var(--luzmo-tag-border-width,var(--tag-border-width))!important;border-style:solid!important}::slotted([slot=icon]){block-size:var(--luzmo-tag-icon-size,var(--tag-icon-size));inline-size:var(--luzmo-tag-icon-size,var(--tag-icon-size));flex-shrink:0;margin-inline-end:var(--luzmo-tag-icon-spacing-inline-end,var(--tag-icon-spacing-inline-end))}::slotted([slot=avatar]){margin-inline-end:var(--luzmo-tag-avatar-spacing-inline-end,var(--tag-avatar-spacing-inline-end))}.clear-button{--luzmo-clear-button-width:fit-content;--clearbutton-fill-size:fit-content;--clearbutton-fill-background-color:transparent;box-sizing:border-box;color:currentColor;margin-inline-start:calc(var(--luzmo-tag-clear-button-spacing-inline-start,var(--tag-clear-button-spacing-inline-start)) + var(--luzmo-tag-label-spacing-inline-end,var(--tag-label-spacing-inline-end)) * -1);margin-inline-end:calc(var(--luzmo-tag-clear-button-spacing-inline-end,var(--tag-clear-button-spacing-inline-end)) - var(--luzmo-tag-border-width,var(--tag-border-width)))}.clear-button .luzmo-ClearButton-fill{background-color:var(--luzmo-clearbutton-fill-background-color,var(--clearbutton-fill-background-color));inline-size:var(--luzmo-clearbutton-fill-size,var(--clearbutton-fill-size));block-size:var(--luzmo-clearbutton-fill-size,var(--clearbutton-fill-size))}.label{box-sizing:border-box;block-size:100%;min-inline-size:0;line-height:var(--luzmo-tag-label-line-height,var(--tag-label-line-height));font-weight:var(--luzmo-tag-label-font-weight,var(--tag-label-font-weight));font-size:var(--luzmo-tag-font-size,var(--tag-font-size));cursor:default;white-space:nowrap;text-overflow:ellipsis;flex:auto;align-items:center;margin-inline-end:calc(var(--luzmo-tag-label-spacing-inline-end,var(--tag-label-spacing-inline-end)) - var(--luzmo-tag-border-width,var(--tag-border-width)));display:flex;overflow:hidden}.label-text{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-inline-size:0;display:block;overflow:hidden}.label-text slot{white-space:nowrap;text-overflow:ellipsis;display:block;overflow:hidden}:host(:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-active,var(--luzmo-tag-background-color-active,var(--tag-background-color-active)));color:var(--highcontrast-tag-content-color-active,var(--luzmo-tag-content-color-active,var(--tag-content-color-active)));border-color:var(--highcontrast-tag-border-color-active,var(--luzmo-tag-border-color-active,var(--tag-border-color-active)))!important}:host([focused]),:host(:focus-visible){background-color:var(--highcontrast-tag-background-color-focus,var(--luzmo-tag-background-color-focus,var(--tag-background-color-focus)));color:var(--highcontrast-tag-content-color-focus,var(--luzmo-tag-content-color-focus,var(--tag-content-color-focus)));border-color:var(--highcontrast-tag-border-color-focus,var(--luzmo-tag-border-color-focus,var(--tag-border-color-focus)))!important}:host([focused]):after,:host(:focus-visible):after{content:"";border-radius:calc(var(--luzmo-tag-border-radius,var(--tag-border-radius)) + var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) + var(--luzmo-tag-border-width,var(--tag-border-width)));pointer-events:none;display:inline-block;position:absolute;inset-block-start:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));inset-block-end:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));inset-inline-start:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));inset-inline-end:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));border-color:var(--highcontrast-tag-focus-ring-color,var(--luzmo-tag-focus-ring-color,var(--tag-focus-ring-color)))!important;border-width:var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness))!important;border-style:solid!important}:host([selected]){background-color:var(--highcontrast-tag-background-color-selected,var(--luzmo-tag-background-color-selected,var(--tag-background-color-selected)));color:var(--highcontrast-tag-content-color-selected,var(--luzmo-tag-content-color-selected,var(--tag-content-color-selected)));border-color:var(--highcontrast-tag-border-color-selected,var(--luzmo-tag-border-color-selected,var(--tag-border-color-selected)))!important}:host([selected]:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-selected-active,var(--luzmo-tag-background-color-selected-active,var(--tag-background-color-selected-active)));border-color:var(--highcontrast-tag-border-color-selected-active,var(--luzmo-tag-border-color-selected-active,var(--tag-border-color-selected-active)))!important}:host([selected][focused]),:host([selected]:focus-visible){background-color:var(--highcontrast-tag-background-color-selected-focus,var(--luzmo-tag-background-color-selected-focus,var(--tag-background-color-selected-focus)));border-color:var(--highcontrast-tag-border-color-selected-focus,var(--luzmo-tag-border-color-selected-focus,var(--tag-border-color-selected-focus)))!important}:host([invalid]){color:var(--highcontrast-tag-content-color-invalid,var(--luzmo-tag-content-color-invalid,var(--tag-content-color-invalid)));border-color:var(--highcontrast-tag-border-color-invalid,var(--luzmo-tag-border-color-invalid,var(--tag-border-color-invalid)))!important}:host([invalid]:is(:active,[active])){color:var(--highcontrast-tag-content-color-invalid-active,var(--luzmo-tag-content-color-invalid-active,var(--tag-content-color-invalid-active)));border-color:var(--highcontrast-tag-border-color-invalid-active,var(--luzmo-tag-border-color-invalid-active,var(--tag-border-color-invalid-active)))!important}:host([invalid][focused]),:host([invalid]:focus-visible){color:var(--highcontrast-tag-content-color-invalid-focus,var(--luzmo-tag-content-color-invalid-focus,var(--tag-content-color-invalid-focus)));border-color:var(--highcontrast-tag-border-color-invalid-focus,var(--luzmo-tag-border-color-invalid-focus,var(--tag-border-color-invalid-focus)))!important}:host([invalid][selected]){background-color:var(--highcontrast-tag-background-color-invalid-selected,var(--luzmo-tag-background-color-invalid-selected,var(--tag-background-color-invalid-selected)));color:var(--highcontrast-tag-content-color-invalid-selected,var(--luzmo-tag-content-color-invalid-selected,var(--tag-content-color-invalid-selected)));border-color:var(--highcontrast-tag-border-color-invalid-selected,var(--luzmo-tag-border-color-invalid-selected,var(--tag-border-color-invalid-selected)))!important}:host([invalid][selected]:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-invalid-selected-active,var(--luzmo-tag-background-color-invalid-selected-active,var(--tag-background-color-invalid-selected-active)));border-color:var(--highcontrast-tag-border-color-invalid-selected-active,var(--luzmo-tag-border-color-invalid-selected-active,var(--tag-border-color-invalid-selected-active)))!important}:host([invalid][selected][focused]),:host([invalid][selected]:focus-visible){background-color:var(--highcontrast-tag-background-color-invalid-selected-focus,var(--luzmo-tag-background-color-invalid-selected-focus,var(--tag-background-color-invalid-selected-focus)));border-color:var(--highcontrast-tag-border-color-invalid-selected-focus,var(--luzmo-tag-border-color-invalid-selected-focus,var(--tag-border-color-invalid-selected-focus)))!important}:host([emphasized]){background-color:var(--highcontrast-tag-background-color-emphasized,var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized)));color:var(--highcontrast-tag-content-color-emphasized,var(--luzmo-tag-content-color-emphasized,var(--tag-content-color-emphasized)));--luzmo-clear-button-background-color-hover:var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized));--luzmo-clear-button-background-color-focus:var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized));--luzmo-clear-button-background-color-down:var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized));border-color:var(--highcontrast-tag-border-color-emphasized,var(--luzmo-tag-border-color-emphasized,var(--tag-border-color-emphasized)))!important}@media (hover:hover){:host(:hover){background-color:var(--highcontrast-tag-background-color-hover,var(--luzmo-tag-background-color-hover,var(--tag-background-color-hover)));color:var(--highcontrast-tag-content-color-hover,var(--luzmo-tag-content-color-hover,var(--tag-content-color-hover)));border-color:var(--highcontrast-tag-border-color-hover,var(--luzmo-tag-border-color-hover,var(--tag-border-color-hover)))!important}:host([selected]:hover){background-color:var(--highcontrast-tag-background-color-selected-hover,var(--luzmo-tag-background-color-selected-hover,var(--tag-background-color-selected-hover)));color:var(--highcontrast-tag-content-color-selected,var(--luzmo-tag-content-color-selected,var(--tag-content-color-selected)));border-color:var(--highcontrast-tag-border-color-selected-hover,var(--luzmo-tag-border-color-selected-hover,var(--tag-border-color-selected-hover)))!important}:host([invalid]:hover){color:var(--highcontrast-tag-content-color-invalid-hover,var(--luzmo-tag-content-color-invalid-hover,var(--tag-content-color-invalid-hover)));border-color:var(--highcontrast-tag-border-color-invalid-hover,var(--luzmo-tag-border-color-invalid-hover,var(--tag-border-color-invalid-hover)))!important}:host([invalid][selected]:hover){background-color:var(--highcontrast-tag-background-color-invalid-selected-hover,var(--luzmo-tag-background-color-invalid-selected-hover,var(--tag-background-color-invalid-selected-hover)));color:var(--highcontrast-tag-content-color-invalid-selected,var(--luzmo-tag-content-color-invalid-selected,var(--tag-content-color-invalid-selected)));border-color:var(--highcontrast-tag-border-color-invalid-selected-hover,var(--luzmo-tag-border-color-invalid-selected-hover,var(--tag-border-color-invalid-selected-hover)))!important}:host([emphasized]:hover){background-color:var(--highcontrast-tag-background-color-emphasized-hover,var(--luzmo-tag-background-color-emphasized-hover,var(--tag-background-color-emphasized-hover)));color:var(--highcontrast-tag-content-color-emphasized,var(--luzmo-tag-content-color-emphasized,var(--tag-content-color-emphasized)));border-color:var(--highcontrast-tag-border-color-emphasized-hover,var(--luzmo-tag-border-color-emphasized-hover,var(--tag-border-color-emphasized-hover)))!important}}:host([emphasized]:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-emphasized-active,var(--luzmo-tag-background-color-emphasized-active,var(--tag-background-color-emphasized-active)));border-color:var(--highcontrast-tag-border-color-emphasized-active,var(--luzmo-tag-border-color-emphasized-active,var(--tag-border-color-emphasized-active)))!important}:host([emphasized][focused]),:host([emphasized]:focus-visible){background-color:var(--highcontrast-tag-background-color-emphasized-focus,var(--luzmo-tag-background-color-emphasized-focus,var(--tag-background-color-emphasized-focus)));border-color:var(--highcontrast-tag-border-color-emphasized-focus,var(--luzmo-tag-border-color-emphasized-focus,var(--tag-border-color-emphasized-focus)))!important}:host([disabled]){background-color:var(--highcontrast-tag-background-color-disabled,var(--luzmo-tag-background-color-disabled,var(--tag-background-color-disabled)));color:var(--highcontrast-tag-content-color-disabled,var(--luzmo-tag-content-color-disabled,var(--tag-content-color-disabled)));pointer-events:none;border-color:var(--highcontrast-tag-border-color-disabled,var(--luzmo-tag-border-color-disabled,var(--tag-border-color-disabled)))!important}:host([disabled]) ::slotted([slot=avatar]){opacity:var(--luzmo-avatar-opacity-disabled,var(--avatar-opacity-disabled))}@media (forced-colors:active){:host{--highcontrast-tag-border-color:ButtonText;--highcontrast-tag-border-color-hover:ButtonText;--highcontrast-tag-border-color-active:ButtonText;--highcontrast-tag-border-color-focus:Highlight;--highcontrast-tag-background-color:ButtonFace;--highcontrast-tag-background-color-hover:ButtonFace;--highcontrast-tag-background-color-active:ButtonFace;--highcontrast-tag-background-color-focus:ButtonFace;--highcontrast-tag-content-color:ButtonText;--highcontrast-tag-content-color-hover:ButtonText;--highcontrast-tag-content-color-active:ButtonText;--highcontrast-tag-content-color-focus:ButtonText;--highcontrast-tag-focus-ring-color:Highlight;forced-color-adjust:none}:host([selected]){--highcontrast-tag-border-color-selected:Highlight;--highcontrast-tag-border-color-selected-hover:Highlight;--highcontrast-tag-border-color-selected-active:Highlight;--highcontrast-tag-border-color-selected-focus:Highlight;--highcontrast-tag-background-color-selected:Highlight;--highcontrast-tag-background-color-selected-hover:Highlight;--highcontrast-tag-background-color-selected-active:Highlight;--highcontrast-tag-background-color-selected-focus:Highlight;--highcontrast-tag-content-color-selected:HighlightText}:host([disabled]){--highcontrast-tag-border-color-disabled:GrayText;--highcontrast-tag-background-color-disabled:ButtonFace;--highcontrast-tag-content-color-disabled:GrayText}:host([invalid]){--highcontrast-tag-border-color-invalid:Highlight;--highcontrast-tag-border-color-invalid-hover:Highlight;--highcontrast-tag-border-color-invalid-active:Highlight;--highcontrast-tag-border-color-invalid-focus:Highlight;--highcontrast-tag-content-color-invalid:CanvasText;--highcontrast-tag-content-color-invalid-hover:CanvasText;--highcontrast-tag-content-color-invalid-active:CanvasText;--highcontrast-tag-content-color-invalid-focus:CanvasText}:host([invalid][selected]){--highcontrast-tag-border-color-invalid-selected:Highlight;--highcontrast-tag-border-color-invalid-selected-hover:Highlight;--highcontrast-tag-border-color-invalid-selected-focus:Highlight;--highcontrast-tag-border-color-invalid-selected-active:Highlight;--highcontrast-tag-background-color-invalid-selected:Highlight;--highcontrast-tag-background-color-invalid-selected-hover:Highlight;--highcontrast-tag-background-color-invalid-selected-active:Highlight;--highcontrast-tag-background-color-invalid-selected-focus:Highlight;--highcontrast-tag-content-color-invalid-selected:HighlightText}:host([emphasized]){--highcontrast-tag-border-color-emphasized:Highlight;--highcontrast-tag-border-color-emphasized-hover:Highlight;--highcontrast-tag-border-color-emphasized-active:Highlight;--highcontrast-tag-border-color-emphasized-focus:Highlight;--highcontrast-tag-background-color-emphasized:ButtonFace;--highcontrast-tag-background-color-emphasized-hover:ButtonFace;--highcontrast-tag-background-color-emphasized-active:ButtonFace;--highcontrast-tag-background-color-emphasized-focus:ButtonFace;--highcontrast-tag-content-color-emphasized:CanvasText}:host([variant][treatment=fill]){--highcontrast-tag-border-color:Highlight;--highcontrast-tag-border-color-hover:Highlight;--highcontrast-tag-border-color-active:Highlight;--highcontrast-tag-border-color-focus:Highlight;--highcontrast-tag-background-color:Highlight;--highcontrast-tag-background-color-hover:Highlight;--highcontrast-tag-background-color-active:Highlight;--highcontrast-tag-background-color-focus:Highlight;--highcontrast-tag-content-color:HighlightText;--highcontrast-tag-content-color-hover:HighlightText;--highcontrast-tag-content-color-active:HighlightText;--highcontrast-tag-content-color-focus:HighlightText}}:host{--tag-border-color:var(--luzmo-border-color);--tag-border-color-hover:var(--luzmo-border-color-hover);--tag-border-color-active:var(--luzmo-border-color-active);--tag-border-color-focus:var(--luzmo-border-color-focus);--tag-size-small-border-radius:var(--luzmo-border-radius-s);--tag-size-medium-border-radius:var(--luzmo-border-radius);--tag-size-large-border-radius:var(--luzmo-border-radius);--tag-background-color:var(--luzmo-background-color);--tag-background-color-hover:var(--luzmo-background-color-hover);--tag-background-color-active:var(--luzmo-background-color-active);--tag-background-color-focus:var(--luzmo-background-color-focus);--tag-content-color:var(--luzmo-font-color);--tag-content-color-hover:var(--luzmo-font-color-hover);--tag-content-color-active:var(--luzmo-font-color-active);--tag-content-color-focus:var(--luzmo-font-color-focus);--tag-border-color-selected:var(--luzmo-border-color-down);--tag-border-color-selected-hover:var(--luzmo-border-color-down);--tag-border-color-selected-active:var(--luzmo-border-color-down);--tag-border-color-selected-focus:var(--luzmo-border-color-down);--tag-border-color-disabled:var(--luzmo-border-color-disabled);--tag-background-color-disabled:var(--luzmo-background-color-disabled);--avatar-opacity-disabled:.3;--tag-animation-duration:var(--luzmo-animation-duration);--tag-border-width:var(--luzmo-border-width);--tag-focus-ring-thickness:var(--luzmo-indicator-width);--tag-focus-ring-gap:var(--luzmo-indicator-gap);--tag-focus-ring-color:var(--luzmo-indicator-color);--tag-label-line-height:var(--luzmo-line-height);--tag-label-font-weight:var(--luzmo-font-weight);--tag-variant-color-hover:color-mix(in oklch, var(--tag-variant-color), black 8%);--tag-variant-color-down:color-mix(in oklch, var(--tag-variant-color), black 20%);--tag-variant-color-focus:var(--tag-variant-color-hover);--tag-variant-fill-color-hover:var(--tag-variant-color-hover);--tag-variant-fill-color-down:var(--tag-variant-color-down);--tag-variant-fill-color-focus:var(--tag-variant-color-focus);--tag-content-color-selected:var(--luzmo-font-color-down);--tag-background-color-selected:var(--luzmo-background-color-down);--tag-background-color-selected-hover:var(--luzmo-background-color-down);--tag-background-color-selected-active:var(--luzmo-background-color-down);--tag-background-color-selected-focus:var(--luzmo-background-color-down);--tag-border-color-invalid:var(--luzmo-negative-color);--tag-border-color-invalid-hover:var(--luzmo-negative-color-hover);--tag-border-color-invalid-active:var(--luzmo-negative-color-down);--tag-border-color-invalid-focus:var(--luzmo-negative-color-focus);--tag-content-color-invalid:var(--luzmo-negative-color);--tag-content-color-invalid-hover:var(--luzmo-negative-color-hover);--tag-content-color-invalid-active:var(--luzmo-negative-color-down);--tag-content-color-invalid-focus:var(--luzmo-negative-color-focus);--tag-border-color-invalid-selected:var(--luzmo-negative-color-down);--tag-border-color-invalid-selected-hover:var(--luzmo-negative-color-down);--tag-border-color-invalid-selected-focus:var(--luzmo-negative-color-down);--tag-border-color-invalid-selected-active:var(--luzmo-negative-color-down);--tag-background-color-invalid-selected:var(--luzmo-background-color-down);--tag-background-color-invalid-selected-hover:var(--luzmo-background-color-down);--tag-background-color-invalid-selected-active:var(--luzmo-background-color-down);--tag-background-color-invalid-selected-focus:var(--luzmo-background-color-down);--tag-content-color-invalid-selected:var(--luzmo-negative-color-down);--tag-border-color-emphasized:var(--luzmo-primary);--tag-border-color-emphasized-hover:var(--luzmo-primary-hover);--tag-border-color-emphasized-active:var(--luzmo-primary-down);--tag-border-color-emphasized-focus:var(--luzmo-primary-focus);--tag-background-color-emphasized:var(--luzmo-primary);--tag-background-color-emphasized-hover:var(--luzmo-primary-hover);--tag-background-color-emphasized-active:var(--luzmo-primary-down);--tag-background-color-emphasized-focus:var(--luzmo-primary-focus);--tag-content-color-emphasized:white;--tag-content-color-disabled:var(--luzmo-disabled-color);--tag-icon-spacing-inline-end:var(--luzmo-spacing-3);--tag-icon-size:var(--luzmo-font-icon-size-s);--tag-avatar-spacing-inline-end:var(--luzmo-spacing-3);--tag-font-size:var(--luzmo-font-size);--tag-max-inline-size:100%;--tag-subtle-background-opacity:10%;--tag-subtle-interaction-background-opacity:20%;--tag-subtle-content-mix:57%}:host([size=s]){--tag-height:var(--luzmo-component-height-xs);--tag-font-size:var(--luzmo-font-size-s);--tag-icon-size:var(--luzmo-icon-size-s);--tag-icon-spacing-inline-end:var(--luzmo-spacing-2);--tag-clear-button-spacing-inline-start:var(--luzmo-spacing-2);--tag-border-radius:var(--luzmo-border-radius);--tag-spacing-inline-start:var(--luzmo-spacing-3);--tag-label-spacing-inline-end:var(--luzmo-spacing-3);--tag-clear-button-spacing-inline-end:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1))}:host{--tag-height:var(--luzmo-component-height-s);--tag-font-size:var(--luzmo-font-size);--tag-icon-size:var(--luzmo-icon-size-m);--tag-clear-button-spacing-inline-start:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--tag-border-radius:var(--luzmo-border-radius);--tag-spacing-inline-start:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-label-spacing-inline-end:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-clear-button-spacing-inline-end:var(--luzmo-spacing-3)}:host([size=l]){--tag-height:var(--luzmo-component-height);--tag-font-size:var(--luzmo-font-size);--tag-icon-size:var(--luzmo-icon-size-l);--tag-icon-spacing-inline-end:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-clear-button-spacing-inline-start:var(--luzmo-spacing-3);--tag-border-radius:var(--luzmo-border-radius);--tag-spacing-inline-start:var(--luzmo-spacing-4);--tag-label-spacing-inline-end:var(--luzmo-spacing-4);--tag-clear-button-spacing-inline-end:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=xl]){--tag-height:var(--luzmo-component-height-l);--tag-font-size:var(--luzmo-font-size-l);--tag-icon-size:var(--luzmo-icon-size-xl);--tag-icon-spacing-inline-end:var(--luzmo-spacing-4);--tag-clear-button-spacing-inline-start:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-border-radius:var(--luzmo-border-radius-l);--tag-spacing-inline-start:var(--luzmo-spacing-5);--tag-label-spacing-inline-end:var(--luzmo-spacing-5);--tag-clear-button-spacing-inline-end:var(--luzmo-spacing-4)}:host([variant=accent]){--tag-variant-color:var(--luzmo-primary);--tag-variant-color-hover:var(--luzmo-primary-hover);--tag-variant-color-down:var(--luzmo-primary-down);--tag-variant-color-focus:var(--luzmo-primary-focus);--tag-variant-fill-content-color:var(--luzmo-primary-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-accent-on-subtle-color)}:host([variant=neutral]){--tag-variant-color:var(--luzmo-selected-color-hard);--tag-variant-color-hover:var(--luzmo-selected-color-hard-hover);--tag-variant-color-down:var(--luzmo-selected-color-hard-down);--tag-variant-color-focus:var(--luzmo-selected-color-hard-focus);--tag-variant-fill-content-color:var(--luzmo-background-color);--tag-variant-subtle-content-color:var(--luzmo-neutral-on-subtle-color)}:host([variant=informative]){--tag-variant-color:var(--luzmo-informative-color);--tag-variant-color-hover:var(--luzmo-informative-color-hover);--tag-variant-color-down:var(--luzmo-informative-color-down);--tag-variant-color-focus:var(--luzmo-informative-color-focus);--tag-variant-fill-content-color:var(--luzmo-informative-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-informative-on-subtle-color)}:host([variant=positive]){--tag-variant-color:var(--luzmo-positive-color);--tag-variant-color-hover:var(--luzmo-positive-color-hover);--tag-variant-color-down:var(--luzmo-positive-color-down);--tag-variant-color-focus:var(--luzmo-positive-color-focus);--tag-variant-fill-content-color:var(--luzmo-positive-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-positive-on-subtle-color)}:host([variant=negative]){--tag-variant-color:var(--luzmo-negative-color);--tag-variant-color-hover:var(--luzmo-negative-color-hover);--tag-variant-color-down:var(--luzmo-negative-color-down);--tag-variant-color-focus:var(--luzmo-negative-color-focus);--tag-variant-fill-content-color:var(--luzmo-negative-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-negative-on-subtle-color)}:host([variant=notice]){--tag-variant-color:var(--luzmo-notice-color);--tag-variant-color-hover:var(--luzmo-notice-color-hover);--tag-variant-color-down:var(--luzmo-notice-color-down);--tag-variant-color-focus:var(--luzmo-notice-color-focus);--tag-variant-fill-color-hover:color-mix(in oklch, var(--luzmo-notice-color), white 12%);--tag-variant-fill-color-down:color-mix(in oklch, var(--luzmo-notice-color), white 24%);--tag-variant-fill-color-focus:var(--tag-variant-fill-color-hover);--tag-variant-fill-content-color:var(--luzmo-notice-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-notice-on-subtle-color)}:host([variant=seafoam]){--tag-variant-color:var(--luzmo-seafoam-color);--tag-variant-fill-content-color:white}:host([variant=indigo]){--tag-variant-color:var(--luzmo-indigo-color);--tag-variant-fill-content-color:white}:host([variant=purple]){--tag-variant-color:var(--luzmo-purple-color);--tag-variant-fill-content-color:white}:host([variant=fuchsia]){--tag-variant-color:var(--luzmo-fuchsia-color);--tag-variant-fill-content-color:white}:host([variant=magenta]){--tag-variant-color:var(--luzmo-magenta-color);--tag-variant-fill-content-color:white}:host([variant=yellow]){--tag-variant-color:var(--luzmo-yellow-color);--tag-variant-fill-content-color:black}:host([variant=gray]){--tag-variant-color:var(--luzmo-gray-color);--tag-variant-fill-content-color:white}:host([variant=red]){--tag-variant-color:var(--luzmo-red-color);--tag-variant-fill-content-color:white}:host([variant=orange]){--tag-variant-color:var(--luzmo-orange-color);--tag-variant-fill-content-color:black}:host([variant=chartreuse]){--tag-variant-color:var(--luzmo-chartreuse-color);--tag-variant-fill-content-color:white}:host([variant=celery]){--tag-variant-color:var(--luzmo-celery-color);--tag-variant-fill-content-color:black}:host([variant=green]){--tag-variant-color:var(--luzmo-green-color);--tag-variant-fill-content-color:white}:host([variant=cyan]){--tag-variant-color:var(--luzmo-cyan-color);--tag-variant-fill-content-color:white}:host([variant=blue]){--tag-variant-color:var(--luzmo-blue-color);--tag-variant-fill-content-color:white}:host([variant]:not([treatment=fill])){--tag-border-color:var(--tag-variant-color);--tag-border-color-hover:var(--tag-variant-color-hover);--tag-border-color-active:var(--tag-variant-color-down);--tag-border-color-focus:var(--tag-variant-color-focus);--tag-content-color:var(--tag-variant-color);--tag-content-color-hover:var(--tag-variant-color-hover);--tag-content-color-active:var(--tag-variant-color-down);--tag-content-color-focus:var(--tag-variant-color-focus);--tag-background-color:transparent;--tag-background-color-hover:color-mix(in oklch, var(--tag-variant-color), transparent 90%);--tag-background-color-active:color-mix(in oklch, var(--tag-variant-color), transparent 82%);--tag-background-color-focus:color-mix(in oklch, var(--tag-variant-color), transparent 90%);--tag-border-color-selected:var(--tag-variant-color-down);--tag-border-color-selected-hover:var(--tag-variant-color-down);--tag-border-color-selected-active:var(--tag-variant-color-down);--tag-border-color-selected-focus:var(--tag-variant-color-down);--tag-content-color-selected:var(--tag-variant-color-down);--tag-background-color-selected:color-mix(in oklch, var(--tag-variant-color), transparent 80%);--tag-background-color-selected-hover:color-mix(in oklch, var(--tag-variant-color), transparent 72%);--tag-background-color-selected-active:color-mix(in oklch, var(--tag-variant-color), transparent 72%);--tag-background-color-selected-focus:color-mix(in oklch, var(--tag-variant-color), transparent 72%)}:host([variant][treatment=subtle]){--tag-subtle-background-color:color-mix(in srgb, var(--tag-variant-color) var(--tag-subtle-background-opacity), var(--luzmo-background-color));--tag-subtle-interaction-background-color:color-mix(in srgb, var(--tag-variant-color) var(--tag-subtle-interaction-background-opacity), var(--luzmo-background-color));--tag-subtle-content-color:var(--tag-variant-subtle-content-color,color-mix(in oklch, var(--tag-variant-color), var(--luzmo-font-color) var(--tag-subtle-content-mix)));--tag-subtle-interaction-content-color:color-mix(in oklch, var(--tag-variant-color), var(--luzmo-font-color) var(--tag-subtle-content-mix));--tag-background-color:var(--tag-subtle-background-color);--tag-background-color-hover:var(--tag-subtle-interaction-background-color);--tag-background-color-active:var(--tag-subtle-background-color);--tag-background-color-focus:var(--tag-subtle-interaction-background-color);--tag-background-color-selected:var(--tag-subtle-background-color);--tag-background-color-selected-hover:var(--tag-subtle-background-color);--tag-background-color-selected-active:var(--tag-subtle-background-color);--tag-background-color-selected-focus:var(--tag-subtle-background-color);--tag-content-color:var(--tag-subtle-content-color);--tag-content-color-hover:var(--tag-subtle-interaction-content-color);--tag-content-color-active:var(--tag-subtle-content-color);--tag-content-color-focus:var(--tag-subtle-interaction-content-color);--tag-content-color-selected:var(--tag-subtle-content-color);--luzmo-clear-button-background-color-hover:var(--tag-subtle-interaction-background-color);--luzmo-clear-button-background-color-focus:var(--tag-subtle-interaction-background-color);--luzmo-clear-button-background-color-down:var(--tag-subtle-background-color)}:host([variant][treatment=fill]){--tag-background-color:var(--tag-variant-color);--tag-background-color-hover:var(--tag-variant-fill-color-hover);--tag-background-color-active:var(--tag-variant-fill-color-down);--tag-background-color-focus:var(--tag-variant-fill-color-focus);--tag-content-color:var(--tag-variant-fill-content-color);--tag-content-color-hover:var(--tag-variant-fill-content-color);--tag-content-color-active:var(--tag-variant-fill-content-color);--tag-content-color-focus:var(--tag-variant-fill-content-color);--tag-border-color:transparent;--tag-border-color-hover:transparent;--tag-border-color-active:transparent;--tag-border-color-focus:transparent;--tag-background-color-selected:var(--tag-variant-fill-color-down);--tag-background-color-selected-hover:var(--tag-variant-fill-color-down);--tag-background-color-selected-active:var(--tag-variant-fill-color-down);--tag-background-color-selected-focus:var(--tag-variant-fill-color-down);--tag-content-color-selected:var(--tag-variant-fill-content-color);--tag-border-color-selected:transparent;--tag-border-color-selected-hover:transparent;--tag-border-color-selected-active:transparent;--tag-border-color-selected-focus:transparent;--luzmo-clear-button-background-color-hover:var(--tag-variant-fill-color-hover);--luzmo-clear-button-background-color-focus:var(--tag-variant-fill-color-focus);--luzmo-clear-button-background-color-down:var(--tag-variant-fill-color-down)}:host([variant]:is([treatment=subtle],[treatment=fill])[invalid]){--tag-background-color:var(--luzmo-background-color);--tag-background-color-hover:var(--luzmo-background-color-hover);--tag-background-color-active:var(--luzmo-background-color-down);--tag-background-color-focus:var(--luzmo-background-color-focus);--tag-content-color:var(--luzmo-negative-color);--tag-content-color-hover:var(--luzmo-negative-color-hover);--tag-content-color-active:var(--luzmo-negative-color-down);--tag-content-color-focus:var(--luzmo-negative-color-focus)}:host([invalid]) .clear-button{--clearbutton-medium-icon-color:var(--tag-icon-color-error-key-focus,var(--red-600));--clearbutton-medium-icon-color-hover:var(--clearbutton-medium-icon-color);--clearbutton-medium-icon-color-down:var(--tag-deletable-icon-color-error-down,var(--red-700))}:host([invalid]):hover .clear-button,:host([invalid]:is(:active,[active])) .clear-button{--clearbutton-medium-icon-color:var(--tag-icon-color-error-hover,var(--red-600));--clearbutton-medium-icon-color-hover:var(--clearbutton-medium-icon-color);--clearbutton-medium-icon-color-down:var(--tag-deletable-icon-color-error-down,var(--red-700))}:host([size=xs]){--icon-size:var(--workflow-icon-size-50)}:host([size=s]){--icon-size:var(--workflow-icon-size-75)}:host([size=m]){--icon-size:var(--workflow-icon-size)}:host([size=l]){--icon-size:var(--workflow-icon-size-200)}:host([size=xl]){--icon-size:var(--workflow-icon-size-300)}:host([size=xxl]){--icon-size:var(--workflow-icon-size-400)}`,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(e.n,{validSizes:[`s`,`m`,`l`,`xl`],noDefaultSize:!0}){static get styles(){return[(0,i.unsafeCSS)(o)]}get variant(){return this._variant}set variant(e){if(e===this._variant)return;let t=this._variant;e&&s.includes(e)?(this._variant=e,this.setAttribute(`variant`,e)):(this._variant=void 0,this.removeAttribute(`variant`)),this.requestUpdate(`variant`,t)}constructor(){super(),this.treatment=`outline`,this.deletable=!1,this.disabled=!1,this.readonly=!1,this._labelText=``,this.handleFocusin=()=>{this.addEventListener(`focusout`,this.handleFocusout),this.addEventListener(`keydown`,this.handleKeydown)},this.handleFocusout=()=>{this.removeEventListener(`keydown`,this.handleKeydown),this.removeEventListener(`focusout`,this.handleFocusout)},this.handleKeydown=e=>{if(!this.deletable||this.disabled)return;let{code:t}=e;switch(t){case`Backspace`:case`Space`:case`Delete`:e.preventDefault(),e.stopPropagation(),this.delete();break;default:return}},this.addEventListener(`focusin`,this.handleFocusin)}handleIconSlotChange(e){e.target.assignedElements().forEach(e=>{e.tagName.toLowerCase()===`luzmo-icon`&&e.setAttribute(`block`,``)})}handleLabelSlotChange(e){let t=e.target.assignedNodes({flatten:!0});this._labelText=t.map(e=>e.textContent).join(``).trim()}delete(){this.readonly||this.dispatchEvent(new Event(`delete`,{bubbles:!0,cancelable:!0,composed:!0}))&&(this.blur(),this.remove())}render(){return i.html`
|
|
19
|
+
<slot name="avatar"></slot>
|
|
20
|
+
<slot name="icon" @slotchange=${this.handleIconSlotChange}></slot>
|
|
21
|
+
<span class="label" focusable>
|
|
22
|
+
<span class="label-text">
|
|
23
|
+
<slot @slotchange=${this.handleLabelSlotChange}></slot>
|
|
24
|
+
</span>
|
|
25
|
+
${this._labelText?i.html`
|
|
26
|
+
<luzmo-tooltip
|
|
27
|
+
self-managed
|
|
28
|
+
show-only-if-truncated
|
|
29
|
+
truncated-element-selector="slot"
|
|
30
|
+
placement="top"
|
|
31
|
+
>
|
|
32
|
+
${this._labelText}
|
|
33
|
+
</luzmo-tooltip>
|
|
34
|
+
`:i.nothing}
|
|
35
|
+
</span>
|
|
36
|
+
${this.deletable?i.html`
|
|
37
|
+
<luzmo-clear-button
|
|
38
|
+
class="clear-button"
|
|
39
|
+
?disabled=${this.disabled}
|
|
40
|
+
label="Remove"
|
|
41
|
+
.size=${this.size}
|
|
42
|
+
tabindex="-1"
|
|
43
|
+
aria-hidden="true"
|
|
44
|
+
@click=${this.delete}
|
|
45
|
+
></luzmo-clear-button>
|
|
46
|
+
`:i.nothing}
|
|
47
|
+
`}firstUpdated(e){super.firstUpdated(e),this.hasAttribute(`role`)||this.setAttribute(`role`,`listitem`),this.hasAttribute(`treatment`)||this.setAttribute(`treatment`,this.treatment),this.deletable&&this.setAttribute(`tabindex`,`0`)}updated(e){super.updated(e),e.has(`disabled`)&&(this.disabled?this.setAttribute(`aria-disabled`,`true`):this.removeAttribute(`aria-disabled`))}};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)({type:Boolean,reflect:!0})],c.prototype,`deletable`,void 0),e.t([(0,a.property)({type:Boolean,reflect:!0})],c.prototype,`disabled`,void 0),e.t([(0,a.property)({type:Boolean,reflect:!0})],c.prototype,`readonly`,void 0),e.t([(0,a.state)()],c.prototype,`_labelText`,void 0);var l=`:host{flex-wrap:wrap;margin:0;padding:0;list-style:none;display:inline-flex}::slotted(*){margin-block:var(--luzmo-tag-group-item-margin-block,var(--tag-group-item-margin-block));margin-inline:var(--luzmo-tag-group-item-margin-inline,var(--tag-group-item-margin-inline))}::slotted(:first-child){margin-inline-start:0}::slotted(:last-child){margin-inline-end:0}:host{--luzmo-tag-group-item-margin-block:var(--luzmo-spacing-2);--luzmo-tag-group-item-margin-inline:var(--luzmo-spacing-2);--luzmo-clear-button-width:fit-content;margin:0;padding:0;list-style:none;display:inline-flex}:host([size=s]){--luzmo-tag-group-item-margin-block:var(--luzmo-spacing-2);--luzmo-tag-group-item-margin-inline:var(--luzmo-spacing-2)}:host([size=l]){--luzmo-tag-group-item-margin-block:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--luzmo-tag-group-item-margin-inline:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1))}:host([size=xl]){--luzmo-tag-group-item-margin-block:var(--luzmo-spacing-3);--luzmo-tag-group-item-margin-inline:var(--luzmo-spacing-3)}:host{--clear-button-width:fit-content;margin:0;padding:0;list-style:none;display:inline-flex}`,u=class extends n.t(t.n(e.n)){static get styles(){return[(0,i.unsafeCSS)(l)]}get tags(){return this.defaultNodes.filter(e=>e instanceof c)}constructor(){super(),this.rovingTabindexController=new r.t(this,{focusInIndex:e=>e.findIndex(e=>!e.disabled&&e.deletable),elements:()=>this.tags,isFocusableElement:e=>!e.disabled&&e.deletable}),this.handleFocusin=()=>{this.addEventListener(`focusout`,this.handleFocusout),this.addEventListener(`keydown`,this.handleKeydown)},this.handleKeydown=e=>{let{code:t}=e;if(t!==`PageUp`&&t!==`PageDown`)return;let n=(e,t)=>e[(e.length+t)%e.length],r=[...this.getRootNode().querySelectorAll(`luzmo-tags`)];if(r.length<2)return;e.preventDefault();let i=r.indexOf(this),a=t===`PageUp`?-1:1,o=i+a,s=n(r,o),c=0;for(;s.tags.length===0;){if(++c>=r.length)return;o+=a,s=n(r,o)}s.focus()},this.handleFocusout=()=>{this.removeEventListener(`keydown`,this.handleKeydown),this.removeEventListener(`focusout`,this.handleFocusout)},this.addEventListener(`focusin`,this.handleFocusin)}focus(){this.rovingTabindexController.focus()}handleSlotchange(){this.rovingTabindexController.clearElementCache(),this.updateTagSizes()}updateTagSizes(){this.tags.forEach(e=>{e.size=this.size})}render(){return i.html` <slot @slotchange=${this.handleSlotchange}></slot> `}firstUpdated(){this.hasAttribute(`role`)||this.setAttribute(`role`,`list`),this.hasAttribute(`aria-label`)||this.setAttribute(`aria-label`,`Tags`)}updated(e){super.updated(e),e.has(`size`)&&this.updateTagSizes()}};e.t([(0,a.queryAssignedNodes)()],u.prototype,`defaultNodes`,void 0),customElements.get(`luzmo-tag`)||customElements.define(`luzmo-tag`,c),customElements.get(`luzmo-tags`)||customElements.define(`luzmo-tags`,u),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return u}});
|
|
@@ -1,30 +1,30 @@
|
|
|
1
|
-
/*! * Lucero - The design system for Luzmo.
|
|
2
|
-
*
|
|
3
|
-
* Copyright © 2025 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.
|
|
1
|
+
/*! * Lucero - The design system for Luzmo.
|
|
2
|
+
*
|
|
3
|
+
* Copyright © 2025 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
17
|
* */
|
|
18
|
-
import { n as e, t } from "./decorate-
|
|
19
|
-
import { n } from "./sized-mixin-
|
|
20
|
-
import { t as r } from "./focus-visible-
|
|
21
|
-
import { t as i } from "./roving-tabindex-
|
|
22
|
-
import "./tooltip-
|
|
23
|
-
import "./button-
|
|
18
|
+
import { n as e, t } from "./decorate-CkCg3wfh.js";
|
|
19
|
+
import { n } from "./sized-mixin-DzQTebN-.js";
|
|
20
|
+
import { t as r } from "./focus-visible-Bt2uDmuM.js";
|
|
21
|
+
import { t as i } from "./roving-tabindex-pomAn3z-.js";
|
|
22
|
+
import "./tooltip-Byl1h4nN.js";
|
|
23
|
+
import "./button-yeMxaZCR.js";
|
|
24
24
|
import { html as a, nothing as o, unsafeCSS as s } from "lit";
|
|
25
25
|
import { property as c, queryAssignedNodes as l, state as u } from "lit/decorators.js";
|
|
26
26
|
//#region src/components/tags/tag.module.scss?inline
|
|
27
|
-
var d = ":host{font-family:var(--luzmo-font-family);background-color:var(--highcontrast-tag-background-color,var(--luzmo-tag-background-color,var(--tag-background-color)));color:var(--highcontrast-tag-content-color,var(--luzmo-tag-content-color,var(--tag-content-color)));border-radius:var(--luzmo-tag-border-radius,var(--tag-border-radius));block-size:var(--luzmo-tag-height,var(--tag-height));box-sizing:border-box;vertical-align:bottom;max-inline-size:var(--luzmo-tag-max-inline-size,var(--tag-max-inline-size));-webkit-user-select:none;user-select:none;transition:border-color var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out, color var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out, box-shadow var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out, background-color var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out;outline:none;justify-content:center;align-items:center;padding-inline-start:calc(var(--luzmo-tag-spacing-inline-start,var(--tag-spacing-inline-start)) - var(--luzmo-tag-border-width,var(--tag-border-width)));padding-inline-end:0;display:inline-flex;position:relative;border-color:var(--highcontrast-tag-border-color,var(--luzmo-tag-border-color,var(--tag-border-color)))!important;border-width:var(--luzmo-tag-border-width,var(--tag-border-width))!important;border-style:solid!important}::slotted([slot=icon]){block-size:var(--luzmo-tag-icon-size,var(--tag-icon-size));inline-size:var(--luzmo-tag-icon-size,var(--tag-icon-size));flex-shrink:0;margin-inline-end:var(--luzmo-tag-icon-spacing-inline-end,var(--tag-icon-spacing-inline-end))}::slotted([slot=avatar]){margin-inline-end:var(--luzmo-tag-avatar-spacing-inline-end,var(--tag-avatar-spacing-inline-end))}.clear-button{--luzmo-clear-button-width:fit-content;--clearbutton-fill-size:fit-content;--clearbutton-fill-background-color:transparent;box-sizing:border-box;color:currentColor;margin-inline-start:calc(var(--luzmo-tag-clear-button-spacing-inline-start,var(--tag-clear-button-spacing-inline-start)) + var(--luzmo-tag-label-spacing-inline-end,var(--tag-label-spacing-inline-end)) * -1);margin-inline-end:calc(var(--luzmo-tag-clear-button-spacing-inline-end,var(--tag-clear-button-spacing-inline-end)) - var(--luzmo-tag-border-width,var(--tag-border-width)))}.clear-button .luzmo-ClearButton-fill{background-color:var(--luzmo-clearbutton-fill-background-color,var(--clearbutton-fill-background-color));inline-size:var(--luzmo-clearbutton-fill-size,var(--clearbutton-fill-size));block-size:var(--luzmo-clearbutton-fill-size,var(--clearbutton-fill-size))}.label{box-sizing:border-box;block-size:100%;min-inline-size:0;line-height:var(--luzmo-tag-label-line-height,var(--tag-label-line-height));font-weight:var(--luzmo-tag-label-font-weight,var(--tag-label-font-weight));font-size:var(--luzmo-tag-font-size,var(--tag-font-size));cursor:default;white-space:nowrap;text-overflow:ellipsis;flex:auto;align-items:center;margin-inline-end:calc(var(--luzmo-tag-label-spacing-inline-end,var(--tag-label-spacing-inline-end)) - var(--luzmo-tag-border-width,var(--tag-border-width)));display:flex;overflow:hidden}.label-text{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-inline-size:0;display:block;overflow:hidden}.label-text slot{white-space:nowrap;text-overflow:ellipsis;display:block;overflow:hidden}:host(:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-active,var(--luzmo-tag-background-color-active,var(--tag-background-color-active)));color:var(--highcontrast-tag-content-color-active,var(--luzmo-tag-content-color-active,var(--tag-content-color-active)));border-color:var(--highcontrast-tag-border-color-active,var(--luzmo-tag-border-color-active,var(--tag-border-color-active)))!important}:host([focused]),:host(:focus-visible){background-color:var(--highcontrast-tag-background-color-focus,var(--luzmo-tag-background-color-focus,var(--tag-background-color-focus)));color:var(--highcontrast-tag-content-color-focus,var(--luzmo-tag-content-color-focus,var(--tag-content-color-focus)));border-color:var(--highcontrast-tag-border-color-focus,var(--luzmo-tag-border-color-focus,var(--tag-border-color-focus)))!important}:host([focused]):after,:host(:focus-visible):after{content:\"\";border-radius:calc(var(--luzmo-tag-border-radius,var(--tag-border-radius)) + var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) + var(--luzmo-tag-border-width,var(--tag-border-width)));pointer-events:none;display:inline-block;position:absolute;inset-block-start:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));inset-block-end:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));inset-inline-start:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));inset-inline-end:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));border-color:var(--highcontrast-tag-focus-ring-color,var(--luzmo-tag-focus-ring-color,var(--tag-focus-ring-color)))!important;border-width:var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness))!important;border-style:solid!important}:host([selected]){background-color:var(--highcontrast-tag-background-color-selected,var(--luzmo-tag-background-color-selected,var(--tag-background-color-selected)));color:var(--highcontrast-tag-content-color-selected,var(--luzmo-tag-content-color-selected,var(--tag-content-color-selected)));border-color:var(--highcontrast-tag-border-color-selected,var(--luzmo-tag-border-color-selected,var(--tag-border-color-selected)))!important}:host([selected]:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-selected-active,var(--luzmo-tag-background-color-selected-active,var(--tag-background-color-selected-active)));border-color:var(--highcontrast-tag-border-color-selected-active,var(--luzmo-tag-border-color-selected-active,var(--tag-border-color-selected-active)))!important}:host([selected][focused]),:host([selected]:focus-visible){background-color:var(--highcontrast-tag-background-color-selected-focus,var(--luzmo-tag-background-color-selected-focus,var(--tag-background-color-selected-focus)));border-color:var(--highcontrast-tag-border-color-selected-focus,var(--luzmo-tag-border-color-selected-focus,var(--tag-border-color-selected-focus)))!important}:host([invalid]){color:var(--highcontrast-tag-content-color-invalid,var(--luzmo-tag-content-color-invalid,var(--tag-content-color-invalid)));border-color:var(--highcontrast-tag-border-color-invalid,var(--luzmo-tag-border-color-invalid,var(--tag-border-color-invalid)))!important}:host([invalid]:is(:active,[active])){color:var(--highcontrast-tag-content-color-invalid-active,var(--luzmo-tag-content-color-invalid-active,var(--tag-content-color-invalid-active)));border-color:var(--highcontrast-tag-border-color-invalid-active,var(--luzmo-tag-border-color-invalid-active,var(--tag-border-color-invalid-active)))!important}:host([invalid][focused]),:host([invalid]:focus-visible){color:var(--highcontrast-tag-content-color-invalid-focus,var(--luzmo-tag-content-color-invalid-focus,var(--tag-content-color-invalid-focus)));border-color:var(--highcontrast-tag-border-color-invalid-focus,var(--luzmo-tag-border-color-invalid-focus,var(--tag-border-color-invalid-focus)))!important}:host([invalid][selected]){background-color:var(--highcontrast-tag-background-color-invalid-selected,var(--luzmo-tag-background-color-invalid-selected,var(--tag-background-color-invalid-selected)));color:var(--highcontrast-tag-content-color-invalid-selected,var(--luzmo-tag-content-color-invalid-selected,var(--tag-content-color-invalid-selected)));border-color:var(--highcontrast-tag-border-color-invalid-selected,var(--luzmo-tag-border-color-invalid-selected,var(--tag-border-color-invalid-selected)))!important}:host([invalid][selected]:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-invalid-selected-active,var(--luzmo-tag-background-color-invalid-selected-active,var(--tag-background-color-invalid-selected-active)));border-color:var(--highcontrast-tag-border-color-invalid-selected-active,var(--luzmo-tag-border-color-invalid-selected-active,var(--tag-border-color-invalid-selected-active)))!important}:host([invalid][selected][focused]),:host([invalid][selected]:focus-visible){background-color:var(--highcontrast-tag-background-color-invalid-selected-focus,var(--luzmo-tag-background-color-invalid-selected-focus,var(--tag-background-color-invalid-selected-focus)));border-color:var(--highcontrast-tag-border-color-invalid-selected-focus,var(--luzmo-tag-border-color-invalid-selected-focus,var(--tag-border-color-invalid-selected-focus)))!important}:host([emphasized]){background-color:var(--highcontrast-tag-background-color-emphasized,var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized)));color:var(--highcontrast-tag-content-color-emphasized,var(--luzmo-tag-content-color-emphasized,var(--tag-content-color-emphasized)));--luzmo-clear-button-background-color-hover:var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized));--luzmo-clear-button-background-color-focus:var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized));--luzmo-clear-button-background-color-down:var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized));border-color:var(--highcontrast-tag-border-color-emphasized,var(--luzmo-tag-border-color-emphasized,var(--tag-border-color-emphasized)))!important}@media (hover:hover){:host(:hover){background-color:var(--highcontrast-tag-background-color-hover,var(--luzmo-tag-background-color-hover,var(--tag-background-color-hover)));color:var(--highcontrast-tag-content-color-hover,var(--luzmo-tag-content-color-hover,var(--tag-content-color-hover)));border-color:var(--highcontrast-tag-border-color-hover,var(--luzmo-tag-border-color-hover,var(--tag-border-color-hover)))!important}:host([selected]:hover){background-color:var(--highcontrast-tag-background-color-selected-hover,var(--luzmo-tag-background-color-selected-hover,var(--tag-background-color-selected-hover)));color:var(--highcontrast-tag-content-color-selected,var(--luzmo-tag-content-color-selected,var(--tag-content-color-selected)));border-color:var(--highcontrast-tag-border-color-selected-hover,var(--luzmo-tag-border-color-selected-hover,var(--tag-border-color-selected-hover)))!important}:host([invalid]:hover){color:var(--highcontrast-tag-content-color-invalid-hover,var(--luzmo-tag-content-color-invalid-hover,var(--tag-content-color-invalid-hover)));border-color:var(--highcontrast-tag-border-color-invalid-hover,var(--luzmo-tag-border-color-invalid-hover,var(--tag-border-color-invalid-hover)))!important}:host([invalid][selected]:hover){background-color:var(--highcontrast-tag-background-color-invalid-selected-hover,var(--luzmo-tag-background-color-invalid-selected-hover,var(--tag-background-color-invalid-selected-hover)));color:var(--highcontrast-tag-content-color-invalid-selected,var(--luzmo-tag-content-color-invalid-selected,var(--tag-content-color-invalid-selected)));border-color:var(--highcontrast-tag-border-color-invalid-selected-hover,var(--luzmo-tag-border-color-invalid-selected-hover,var(--tag-border-color-invalid-selected-hover)))!important}:host([emphasized]:hover){background-color:var(--highcontrast-tag-background-color-emphasized-hover,var(--luzmo-tag-background-color-emphasized-hover,var(--tag-background-color-emphasized-hover)));color:var(--highcontrast-tag-content-color-emphasized,var(--luzmo-tag-content-color-emphasized,var(--tag-content-color-emphasized)));border-color:var(--highcontrast-tag-border-color-emphasized-hover,var(--luzmo-tag-border-color-emphasized-hover,var(--tag-border-color-emphasized-hover)))!important}}:host([emphasized]:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-emphasized-active,var(--luzmo-tag-background-color-emphasized-active,var(--tag-background-color-emphasized-active)));border-color:var(--highcontrast-tag-border-color-emphasized-active,var(--luzmo-tag-border-color-emphasized-active,var(--tag-border-color-emphasized-active)))!important}:host([emphasized][focused]),:host([emphasized]:focus-visible){background-color:var(--highcontrast-tag-background-color-emphasized-focus,var(--luzmo-tag-background-color-emphasized-focus,var(--tag-background-color-emphasized-focus)));border-color:var(--highcontrast-tag-border-color-emphasized-focus,var(--luzmo-tag-border-color-emphasized-focus,var(--tag-border-color-emphasized-focus)))!important}:host([disabled]){background-color:var(--highcontrast-tag-background-color-disabled,var(--luzmo-tag-background-color-disabled,var(--tag-background-color-disabled)));color:var(--highcontrast-tag-content-color-disabled,var(--luzmo-tag-content-color-disabled,var(--tag-content-color-disabled)));pointer-events:none;border-color:var(--highcontrast-tag-border-color-disabled,var(--luzmo-tag-border-color-disabled,var(--tag-border-color-disabled)))!important}:host([disabled]) ::slotted([slot=avatar]){opacity:var(--luzmo-avatar-opacity-disabled,var(--avatar-opacity-disabled))}@media (forced-colors:active){:host{--highcontrast-tag-border-color:ButtonText;--highcontrast-tag-border-color-hover:ButtonText;--highcontrast-tag-border-color-active:ButtonText;--highcontrast-tag-border-color-focus:Highlight;--highcontrast-tag-background-color:ButtonFace;--highcontrast-tag-background-color-hover:ButtonFace;--highcontrast-tag-background-color-active:ButtonFace;--highcontrast-tag-background-color-focus:ButtonFace;--highcontrast-tag-content-color:ButtonText;--highcontrast-tag-content-color-hover:ButtonText;--highcontrast-tag-content-color-active:ButtonText;--highcontrast-tag-content-color-focus:ButtonText;--highcontrast-tag-focus-ring-color:Highlight;forced-color-adjust:none}:host([selected]){--highcontrast-tag-border-color-selected:Highlight;--highcontrast-tag-border-color-selected-hover:Highlight;--highcontrast-tag-border-color-selected-active:Highlight;--highcontrast-tag-border-color-selected-focus:Highlight;--highcontrast-tag-background-color-selected:Highlight;--highcontrast-tag-background-color-selected-hover:Highlight;--highcontrast-tag-background-color-selected-active:Highlight;--highcontrast-tag-background-color-selected-focus:Highlight;--highcontrast-tag-content-color-selected:HighlightText}:host([disabled]){--highcontrast-tag-border-color-disabled:GrayText;--highcontrast-tag-background-color-disabled:ButtonFace;--highcontrast-tag-content-color-disabled:GrayText}:host([invalid]){--highcontrast-tag-border-color-invalid:Highlight;--highcontrast-tag-border-color-invalid-hover:Highlight;--highcontrast-tag-border-color-invalid-active:Highlight;--highcontrast-tag-border-color-invalid-focus:Highlight;--highcontrast-tag-content-color-invalid:CanvasText;--highcontrast-tag-content-color-invalid-hover:CanvasText;--highcontrast-tag-content-color-invalid-active:CanvasText;--highcontrast-tag-content-color-invalid-focus:CanvasText}:host([invalid][selected]){--highcontrast-tag-border-color-invalid-selected:Highlight;--highcontrast-tag-border-color-invalid-selected-hover:Highlight;--highcontrast-tag-border-color-invalid-selected-focus:Highlight;--highcontrast-tag-border-color-invalid-selected-active:Highlight;--highcontrast-tag-background-color-invalid-selected:Highlight;--highcontrast-tag-background-color-invalid-selected-hover:Highlight;--highcontrast-tag-background-color-invalid-selected-active:Highlight;--highcontrast-tag-background-color-invalid-selected-focus:Highlight;--highcontrast-tag-content-color-invalid-selected:HighlightText}:host([emphasized]){--highcontrast-tag-border-color-emphasized:Highlight;--highcontrast-tag-border-color-emphasized-hover:Highlight;--highcontrast-tag-border-color-emphasized-active:Highlight;--highcontrast-tag-border-color-emphasized-focus:Highlight;--highcontrast-tag-background-color-emphasized:ButtonFace;--highcontrast-tag-background-color-emphasized-hover:ButtonFace;--highcontrast-tag-background-color-emphasized-active:ButtonFace;--highcontrast-tag-background-color-emphasized-focus:ButtonFace;--highcontrast-tag-content-color-emphasized:CanvasText}:host([variant][treatment=fill]){--highcontrast-tag-border-color:Highlight;--highcontrast-tag-border-color-hover:Highlight;--highcontrast-tag-border-color-active:Highlight;--highcontrast-tag-border-color-focus:Highlight;--highcontrast-tag-background-color:Highlight;--highcontrast-tag-background-color-hover:Highlight;--highcontrast-tag-background-color-active:Highlight;--highcontrast-tag-background-color-focus:Highlight;--highcontrast-tag-content-color:HighlightText;--highcontrast-tag-content-color-hover:HighlightText;--highcontrast-tag-content-color-active:HighlightText;--highcontrast-tag-content-color-focus:HighlightText}}:host{--tag-border-color:var(--luzmo-border-color);--tag-border-color-hover:var(--luzmo-border-color-hover);--tag-border-color-active:var(--luzmo-border-color-active);--tag-border-color-focus:var(--luzmo-border-color-focus);--tag-size-small-border-radius:var(--luzmo-border-radius-s);--tag-size-medium-border-radius:var(--luzmo-border-radius);--tag-size-large-border-radius:var(--luzmo-border-radius);--tag-background-color:var(--luzmo-background-color);--tag-background-color-hover:var(--luzmo-background-color-hover);--tag-background-color-active:var(--luzmo-background-color-active);--tag-background-color-focus:var(--luzmo-background-color-focus);--tag-content-color:var(--luzmo-font-color);--tag-content-color-hover:var(--luzmo-font-color-hover);--tag-content-color-active:var(--luzmo-font-color-active);--tag-content-color-focus:var(--luzmo-font-color-focus);--tag-border-color-selected:var(--luzmo-border-color-down);--tag-border-color-selected-hover:var(--luzmo-border-color-down);--tag-border-color-selected-active:var(--luzmo-border-color-down);--tag-border-color-selected-focus:var(--luzmo-border-color-down);--tag-border-color-disabled:var(--luzmo-border-color-disabled);--tag-background-color-disabled:var(--luzmo-background-color-disabled);--avatar-opacity-disabled:.3;--tag-animation-duration:var(--luzmo-animation-duration);--tag-border-width:var(--luzmo-border-width);--tag-focus-ring-thickness:var(--luzmo-indicator-width);--tag-focus-ring-gap:var(--luzmo-indicator-gap);--tag-focus-ring-color:var(--luzmo-indicator-color);--tag-label-line-height:var(--luzmo-line-height);--tag-label-font-weight:var(--luzmo-font-weight);--tag-content-color-selected:var(--luzmo-font-color-down);--tag-background-color-selected:var(--luzmo-background-color-down);--tag-background-color-selected-hover:var(--luzmo-background-color-down);--tag-background-color-selected-active:var(--luzmo-background-color-down);--tag-background-color-selected-focus:var(--luzmo-background-color-down);--tag-border-color-invalid:var(--luzmo-negative-color);--tag-border-color-invalid-hover:var(--luzmo-negative-color-hover);--tag-border-color-invalid-active:var(--luzmo-negative-color-down);--tag-border-color-invalid-focus:var(--luzmo-negative-color-focus);--tag-content-color-invalid:var(--luzmo-negative-color);--tag-content-color-invalid-hover:var(--luzmo-negative-color-hover);--tag-content-color-invalid-active:var(--luzmo-negative-color-down);--tag-content-color-invalid-focus:var(--luzmo-negative-color-focus);--tag-border-color-invalid-selected:var(--luzmo-negative-color-down);--tag-border-color-invalid-selected-hover:var(--luzmo-negative-color-down);--tag-border-color-invalid-selected-focus:var(--luzmo-negative-color-down);--tag-border-color-invalid-selected-active:var(--luzmo-negative-color-down);--tag-background-color-invalid-selected:var(--luzmo-background-color-down);--tag-background-color-invalid-selected-hover:var(--luzmo-background-color-down);--tag-background-color-invalid-selected-active:var(--luzmo-background-color-down);--tag-background-color-invalid-selected-focus:var(--luzmo-background-color-down);--tag-content-color-invalid-selected:var(--luzmo-negative-color-down);--tag-border-color-emphasized:var(--luzmo-primary);--tag-border-color-emphasized-hover:var(--luzmo-primary-hover);--tag-border-color-emphasized-active:var(--luzmo-primary-down);--tag-border-color-emphasized-focus:var(--luzmo-primary-focus);--tag-background-color-emphasized:var(--luzmo-primary);--tag-background-color-emphasized-hover:var(--luzmo-primary-hover);--tag-background-color-emphasized-active:var(--luzmo-primary-down);--tag-background-color-emphasized-focus:var(--luzmo-primary-focus);--tag-content-color-emphasized:white;--tag-content-color-disabled:var(--luzmo-disabled-color);--tag-icon-spacing-inline-end:var(--luzmo-spacing-3);--tag-icon-size:var(--luzmo-font-icon-size-s);--tag-avatar-spacing-inline-end:var(--luzmo-spacing-3);--tag-font-size:var(--luzmo-font-size);--tag-max-inline-size:100%}:host([size=s]){--tag-height:var(--luzmo-component-height-xs);--tag-font-size:var(--luzmo-font-size-s);--tag-icon-size:var(--luzmo-icon-size-s);--tag-icon-spacing-inline-end:var(--luzmo-spacing-2);--tag-clear-button-spacing-inline-start:var(--luzmo-spacing-2);--tag-border-radius:var(--luzmo-border-radius);--tag-spacing-inline-start:var(--luzmo-spacing-3);--tag-label-spacing-inline-end:var(--luzmo-spacing-3);--tag-clear-button-spacing-inline-end:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1))}:host{--tag-height:var(--luzmo-component-height-s);--tag-font-size:var(--luzmo-font-size);--tag-icon-size:var(--luzmo-icon-size-m);--tag-clear-button-spacing-inline-start:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--tag-border-radius:var(--luzmo-border-radius);--tag-spacing-inline-start:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-label-spacing-inline-end:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-clear-button-spacing-inline-end:var(--luzmo-spacing-3)}:host([size=l]){--tag-height:var(--luzmo-component-height);--tag-font-size:var(--luzmo-font-size);--tag-icon-size:var(--luzmo-icon-size-l);--tag-icon-spacing-inline-end:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-clear-button-spacing-inline-start:var(--luzmo-spacing-3);--tag-border-radius:var(--luzmo-border-radius);--tag-spacing-inline-start:var(--luzmo-spacing-4);--tag-label-spacing-inline-end:var(--luzmo-spacing-4);--tag-clear-button-spacing-inline-end:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=xl]){--tag-height:var(--luzmo-component-height-l);--tag-font-size:var(--luzmo-font-size-l);--tag-icon-size:var(--luzmo-icon-size-xl);--tag-icon-spacing-inline-end:var(--luzmo-spacing-4);--tag-clear-button-spacing-inline-start:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-border-radius:var(--luzmo-border-radius-l);--tag-spacing-inline-start:var(--luzmo-spacing-5);--tag-label-spacing-inline-end:var(--luzmo-spacing-5);--tag-clear-button-spacing-inline-end:var(--luzmo-spacing-4)}:host([variant=accent]){--tag-variant-color:var(--luzmo-primary);--tag-variant-fill-content-color:white}:host([variant=neutral]){--tag-variant-color:var(--luzmo-selected-color-hard);--tag-variant-fill-content-color:white}:host([variant=informative]){--tag-variant-color:var(--luzmo-informative-color);--tag-variant-fill-content-color:white}:host([variant=positive]){--tag-variant-color:var(--luzmo-positive-color);--tag-variant-fill-content-color:white}:host([variant=negative]){--tag-variant-color:var(--luzmo-negative-color);--tag-variant-fill-content-color:white}:host([variant=notice]){--tag-variant-color:var(--luzmo-notice-color);--tag-variant-fill-content-color:white}:host([variant=seafoam]){--tag-variant-color:var(--luzmo-seafoam-color);--tag-variant-fill-content-color:white}:host([variant=indigo]){--tag-variant-color:var(--luzmo-indigo-color);--tag-variant-fill-content-color:white}:host([variant=purple]){--tag-variant-color:var(--luzmo-purple-color);--tag-variant-fill-content-color:white}:host([variant=fuchsia]){--tag-variant-color:var(--luzmo-fuchsia-color);--tag-variant-fill-content-color:white}:host([variant=magenta]){--tag-variant-color:var(--luzmo-magenta-color);--tag-variant-fill-content-color:white}:host([variant=yellow]){--tag-variant-color:var(--luzmo-yellow-color);--tag-variant-fill-content-color:black}:host([variant=gray]){--tag-variant-color:var(--luzmo-gray-color);--tag-variant-fill-content-color:white}:host([variant=red]){--tag-variant-color:var(--luzmo-red-color);--tag-variant-fill-content-color:white}:host([variant=orange]){--tag-variant-color:var(--luzmo-orange-color);--tag-variant-fill-content-color:black}:host([variant=chartreuse]){--tag-variant-color:var(--luzmo-chartreuse-color);--tag-variant-fill-content-color:white}:host([variant=celery]){--tag-variant-color:var(--luzmo-celery-color);--tag-variant-fill-content-color:black}:host([variant=green]){--tag-variant-color:var(--luzmo-green-color);--tag-variant-fill-content-color:white}:host([variant=cyan]){--tag-variant-color:var(--luzmo-cyan-color);--tag-variant-fill-content-color:white}:host([variant=blue]){--tag-variant-color:var(--luzmo-blue-color);--tag-variant-fill-content-color:white}:host([variant]:not([treatment=fill])){--tag-border-color:var(--tag-variant-color);--tag-border-color-hover:color-mix(in oklch, var(--tag-variant-color), black 8%);--tag-border-color-active:color-mix(in oklch, var(--tag-variant-color), black 20%);--tag-border-color-focus:color-mix(in oklch, var(--tag-variant-color), black 8%);--tag-content-color:var(--tag-variant-color);--tag-content-color-hover:color-mix(in oklch, var(--tag-variant-color), black 8%);--tag-content-color-active:color-mix(in oklch, var(--tag-variant-color), black 20%);--tag-content-color-focus:color-mix(in oklch, var(--tag-variant-color), black 8%);--tag-background-color:transparent;--tag-background-color-hover:color-mix(in oklch, var(--tag-variant-color), transparent 90%);--tag-background-color-active:color-mix(in oklch, var(--tag-variant-color), transparent 82%);--tag-background-color-focus:color-mix(in oklch, var(--tag-variant-color), transparent 90%);--tag-border-color-selected:color-mix(in oklch, var(--tag-variant-color), black 20%);--tag-border-color-selected-hover:color-mix(in oklch, var(--tag-variant-color), black 30%);--tag-border-color-selected-active:color-mix(in oklch, var(--tag-variant-color), black 30%);--tag-border-color-selected-focus:color-mix(in oklch, var(--tag-variant-color), black 30%);--tag-content-color-selected:color-mix(in oklch, var(--tag-variant-color), black 20%);--tag-background-color-selected:color-mix(in oklch, var(--tag-variant-color), transparent 80%);--tag-background-color-selected-hover:color-mix(in oklch, var(--tag-variant-color), transparent 72%);--tag-background-color-selected-active:color-mix(in oklch, var(--tag-variant-color), transparent 72%);--tag-background-color-selected-focus:color-mix(in oklch, var(--tag-variant-color), transparent 72%)}:host([variant][treatment=fill]){--tag-background-color:var(--tag-variant-color);--tag-background-color-hover:color-mix(in oklch, var(--tag-variant-color), black 8%);--tag-background-color-active:color-mix(in oklch, var(--tag-variant-color), black 20%);--tag-background-color-focus:color-mix(in oklch, var(--tag-variant-color), black 8%);--tag-content-color:var(--tag-variant-fill-content-color);--tag-content-color-hover:var(--tag-variant-fill-content-color);--tag-content-color-active:var(--tag-variant-fill-content-color);--tag-content-color-focus:var(--tag-variant-fill-content-color);--tag-border-color:transparent;--tag-border-color-hover:transparent;--tag-border-color-active:transparent;--tag-border-color-focus:transparent;--tag-background-color-selected:color-mix(in oklch, var(--tag-variant-color), black 20%);--tag-background-color-selected-hover:color-mix(in oklch, var(--tag-variant-color), black 30%);--tag-background-color-selected-active:color-mix(in oklch, var(--tag-variant-color), black 30%);--tag-background-color-selected-focus:color-mix(in oklch, var(--tag-variant-color), black 30%);--tag-content-color-selected:var(--tag-variant-fill-content-color);--tag-border-color-selected:transparent;--tag-border-color-selected-hover:transparent;--tag-border-color-selected-active:transparent;--tag-border-color-selected-focus:transparent;--luzmo-clear-button-background-color-hover:var(--tag-variant-color);--luzmo-clear-button-background-color-focus:var(--tag-variant-color);--luzmo-clear-button-background-color-down:var(--tag-variant-color)}:host([variant][treatment=fill][invalid]){--tag-background-color:var(--luzmo-background-color);--tag-background-color-hover:var(--luzmo-background-color-hover);--tag-background-color-active:var(--luzmo-background-color-active);--tag-background-color-focus:var(--luzmo-background-color-focus);--tag-content-color:var(--luzmo-negative-color);--tag-content-color-hover:var(--luzmo-negative-color-hover);--tag-content-color-active:var(--luzmo-negative-color-down);--tag-content-color-focus:var(--luzmo-negative-color-focus)}:host([invalid]) .clear-button{--clearbutton-medium-icon-color:var(--tag-icon-color-error-key-focus,var(--red-600));--clearbutton-medium-icon-color-hover:var(--clearbutton-medium-icon-color);--clearbutton-medium-icon-color-down:var(--tag-deletable-icon-color-error-down,var(--red-700))}:host([invalid]):hover .clear-button,:host([invalid]:is(:active,[active])) .clear-button{--clearbutton-medium-icon-color:var(--tag-icon-color-error-hover,var(--red-600));--clearbutton-medium-icon-color-hover:var(--clearbutton-medium-icon-color);--clearbutton-medium-icon-color-down:var(--tag-deletable-icon-color-error-down,var(--red-700))}:host([size=xs]){--icon-size:var(--workflow-icon-size-50)}:host([size=s]){--icon-size:var(--workflow-icon-size-75)}:host([size=m]){--icon-size:var(--workflow-icon-size)}:host([size=l]){--icon-size:var(--workflow-icon-size-200)}:host([size=xl]){--icon-size:var(--workflow-icon-size-300)}:host([size=xxl]){--icon-size:var(--workflow-icon-size-400)}", f = [
|
|
27
|
+
var d = ":host{font-family:var(--luzmo-font-family);background-color:var(--highcontrast-tag-background-color,var(--luzmo-tag-background-color,var(--tag-background-color)));color:var(--highcontrast-tag-content-color,var(--luzmo-tag-content-color,var(--tag-content-color)));border-radius:var(--luzmo-tag-border-radius,var(--tag-border-radius));block-size:var(--luzmo-tag-height,var(--tag-height));box-sizing:border-box;vertical-align:bottom;max-inline-size:var(--luzmo-tag-max-inline-size,var(--tag-max-inline-size));-webkit-user-select:none;user-select:none;transition:border-color var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out, color var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out, box-shadow var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out, background-color var(--luzmo-tag-animation-duration,var(--tag-animation-duration)) ease-in-out;outline:none;justify-content:center;align-items:center;padding-inline-start:calc(var(--luzmo-tag-spacing-inline-start,var(--tag-spacing-inline-start)) - var(--luzmo-tag-border-width,var(--tag-border-width)));padding-inline-end:0;display:inline-flex;position:relative;border-color:var(--highcontrast-tag-border-color,var(--luzmo-tag-border-color,var(--tag-border-color)))!important;border-width:var(--luzmo-tag-border-width,var(--tag-border-width))!important;border-style:solid!important}::slotted([slot=icon]){block-size:var(--luzmo-tag-icon-size,var(--tag-icon-size));inline-size:var(--luzmo-tag-icon-size,var(--tag-icon-size));flex-shrink:0;margin-inline-end:var(--luzmo-tag-icon-spacing-inline-end,var(--tag-icon-spacing-inline-end))}::slotted([slot=avatar]){margin-inline-end:var(--luzmo-tag-avatar-spacing-inline-end,var(--tag-avatar-spacing-inline-end))}.clear-button{--luzmo-clear-button-width:fit-content;--clearbutton-fill-size:fit-content;--clearbutton-fill-background-color:transparent;box-sizing:border-box;color:currentColor;margin-inline-start:calc(var(--luzmo-tag-clear-button-spacing-inline-start,var(--tag-clear-button-spacing-inline-start)) + var(--luzmo-tag-label-spacing-inline-end,var(--tag-label-spacing-inline-end)) * -1);margin-inline-end:calc(var(--luzmo-tag-clear-button-spacing-inline-end,var(--tag-clear-button-spacing-inline-end)) - var(--luzmo-tag-border-width,var(--tag-border-width)))}.clear-button .luzmo-ClearButton-fill{background-color:var(--luzmo-clearbutton-fill-background-color,var(--clearbutton-fill-background-color));inline-size:var(--luzmo-clearbutton-fill-size,var(--clearbutton-fill-size));block-size:var(--luzmo-clearbutton-fill-size,var(--clearbutton-fill-size))}.label{box-sizing:border-box;block-size:100%;min-inline-size:0;line-height:var(--luzmo-tag-label-line-height,var(--tag-label-line-height));font-weight:var(--luzmo-tag-label-font-weight,var(--tag-label-font-weight));font-size:var(--luzmo-tag-font-size,var(--tag-font-size));cursor:default;white-space:nowrap;text-overflow:ellipsis;flex:auto;align-items:center;margin-inline-end:calc(var(--luzmo-tag-label-spacing-inline-end,var(--tag-label-spacing-inline-end)) - var(--luzmo-tag-border-width,var(--tag-border-width)));display:flex;overflow:hidden}.label-text{white-space:nowrap;text-overflow:ellipsis;flex:auto;min-inline-size:0;display:block;overflow:hidden}.label-text slot{white-space:nowrap;text-overflow:ellipsis;display:block;overflow:hidden}:host(:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-active,var(--luzmo-tag-background-color-active,var(--tag-background-color-active)));color:var(--highcontrast-tag-content-color-active,var(--luzmo-tag-content-color-active,var(--tag-content-color-active)));border-color:var(--highcontrast-tag-border-color-active,var(--luzmo-tag-border-color-active,var(--tag-border-color-active)))!important}:host([focused]),:host(:focus-visible){background-color:var(--highcontrast-tag-background-color-focus,var(--luzmo-tag-background-color-focus,var(--tag-background-color-focus)));color:var(--highcontrast-tag-content-color-focus,var(--luzmo-tag-content-color-focus,var(--tag-content-color-focus)));border-color:var(--highcontrast-tag-border-color-focus,var(--luzmo-tag-border-color-focus,var(--tag-border-color-focus)))!important}:host([focused]):after,:host(:focus-visible):after{content:\"\";border-radius:calc(var(--luzmo-tag-border-radius,var(--tag-border-radius)) + var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) + var(--luzmo-tag-border-width,var(--tag-border-width)));pointer-events:none;display:inline-block;position:absolute;inset-block-start:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));inset-block-end:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));inset-inline-start:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));inset-inline-end:calc(var(--luzmo-tag-focus-ring-gap,var(--tag-focus-ring-gap)) * -1 - var(--luzmo-tag-border-width,var(--tag-border-width)) - var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness)));border-color:var(--highcontrast-tag-focus-ring-color,var(--luzmo-tag-focus-ring-color,var(--tag-focus-ring-color)))!important;border-width:var(--luzmo-tag-focus-ring-thickness,var(--tag-focus-ring-thickness))!important;border-style:solid!important}:host([selected]){background-color:var(--highcontrast-tag-background-color-selected,var(--luzmo-tag-background-color-selected,var(--tag-background-color-selected)));color:var(--highcontrast-tag-content-color-selected,var(--luzmo-tag-content-color-selected,var(--tag-content-color-selected)));border-color:var(--highcontrast-tag-border-color-selected,var(--luzmo-tag-border-color-selected,var(--tag-border-color-selected)))!important}:host([selected]:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-selected-active,var(--luzmo-tag-background-color-selected-active,var(--tag-background-color-selected-active)));border-color:var(--highcontrast-tag-border-color-selected-active,var(--luzmo-tag-border-color-selected-active,var(--tag-border-color-selected-active)))!important}:host([selected][focused]),:host([selected]:focus-visible){background-color:var(--highcontrast-tag-background-color-selected-focus,var(--luzmo-tag-background-color-selected-focus,var(--tag-background-color-selected-focus)));border-color:var(--highcontrast-tag-border-color-selected-focus,var(--luzmo-tag-border-color-selected-focus,var(--tag-border-color-selected-focus)))!important}:host([invalid]){color:var(--highcontrast-tag-content-color-invalid,var(--luzmo-tag-content-color-invalid,var(--tag-content-color-invalid)));border-color:var(--highcontrast-tag-border-color-invalid,var(--luzmo-tag-border-color-invalid,var(--tag-border-color-invalid)))!important}:host([invalid]:is(:active,[active])){color:var(--highcontrast-tag-content-color-invalid-active,var(--luzmo-tag-content-color-invalid-active,var(--tag-content-color-invalid-active)));border-color:var(--highcontrast-tag-border-color-invalid-active,var(--luzmo-tag-border-color-invalid-active,var(--tag-border-color-invalid-active)))!important}:host([invalid][focused]),:host([invalid]:focus-visible){color:var(--highcontrast-tag-content-color-invalid-focus,var(--luzmo-tag-content-color-invalid-focus,var(--tag-content-color-invalid-focus)));border-color:var(--highcontrast-tag-border-color-invalid-focus,var(--luzmo-tag-border-color-invalid-focus,var(--tag-border-color-invalid-focus)))!important}:host([invalid][selected]){background-color:var(--highcontrast-tag-background-color-invalid-selected,var(--luzmo-tag-background-color-invalid-selected,var(--tag-background-color-invalid-selected)));color:var(--highcontrast-tag-content-color-invalid-selected,var(--luzmo-tag-content-color-invalid-selected,var(--tag-content-color-invalid-selected)));border-color:var(--highcontrast-tag-border-color-invalid-selected,var(--luzmo-tag-border-color-invalid-selected,var(--tag-border-color-invalid-selected)))!important}:host([invalid][selected]:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-invalid-selected-active,var(--luzmo-tag-background-color-invalid-selected-active,var(--tag-background-color-invalid-selected-active)));border-color:var(--highcontrast-tag-border-color-invalid-selected-active,var(--luzmo-tag-border-color-invalid-selected-active,var(--tag-border-color-invalid-selected-active)))!important}:host([invalid][selected][focused]),:host([invalid][selected]:focus-visible){background-color:var(--highcontrast-tag-background-color-invalid-selected-focus,var(--luzmo-tag-background-color-invalid-selected-focus,var(--tag-background-color-invalid-selected-focus)));border-color:var(--highcontrast-tag-border-color-invalid-selected-focus,var(--luzmo-tag-border-color-invalid-selected-focus,var(--tag-border-color-invalid-selected-focus)))!important}:host([emphasized]){background-color:var(--highcontrast-tag-background-color-emphasized,var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized)));color:var(--highcontrast-tag-content-color-emphasized,var(--luzmo-tag-content-color-emphasized,var(--tag-content-color-emphasized)));--luzmo-clear-button-background-color-hover:var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized));--luzmo-clear-button-background-color-focus:var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized));--luzmo-clear-button-background-color-down:var(--luzmo-tag-background-color-emphasized,var(--tag-background-color-emphasized));border-color:var(--highcontrast-tag-border-color-emphasized,var(--luzmo-tag-border-color-emphasized,var(--tag-border-color-emphasized)))!important}@media (hover:hover){:host(:hover){background-color:var(--highcontrast-tag-background-color-hover,var(--luzmo-tag-background-color-hover,var(--tag-background-color-hover)));color:var(--highcontrast-tag-content-color-hover,var(--luzmo-tag-content-color-hover,var(--tag-content-color-hover)));border-color:var(--highcontrast-tag-border-color-hover,var(--luzmo-tag-border-color-hover,var(--tag-border-color-hover)))!important}:host([selected]:hover){background-color:var(--highcontrast-tag-background-color-selected-hover,var(--luzmo-tag-background-color-selected-hover,var(--tag-background-color-selected-hover)));color:var(--highcontrast-tag-content-color-selected,var(--luzmo-tag-content-color-selected,var(--tag-content-color-selected)));border-color:var(--highcontrast-tag-border-color-selected-hover,var(--luzmo-tag-border-color-selected-hover,var(--tag-border-color-selected-hover)))!important}:host([invalid]:hover){color:var(--highcontrast-tag-content-color-invalid-hover,var(--luzmo-tag-content-color-invalid-hover,var(--tag-content-color-invalid-hover)));border-color:var(--highcontrast-tag-border-color-invalid-hover,var(--luzmo-tag-border-color-invalid-hover,var(--tag-border-color-invalid-hover)))!important}:host([invalid][selected]:hover){background-color:var(--highcontrast-tag-background-color-invalid-selected-hover,var(--luzmo-tag-background-color-invalid-selected-hover,var(--tag-background-color-invalid-selected-hover)));color:var(--highcontrast-tag-content-color-invalid-selected,var(--luzmo-tag-content-color-invalid-selected,var(--tag-content-color-invalid-selected)));border-color:var(--highcontrast-tag-border-color-invalid-selected-hover,var(--luzmo-tag-border-color-invalid-selected-hover,var(--tag-border-color-invalid-selected-hover)))!important}:host([emphasized]:hover){background-color:var(--highcontrast-tag-background-color-emphasized-hover,var(--luzmo-tag-background-color-emphasized-hover,var(--tag-background-color-emphasized-hover)));color:var(--highcontrast-tag-content-color-emphasized,var(--luzmo-tag-content-color-emphasized,var(--tag-content-color-emphasized)));border-color:var(--highcontrast-tag-border-color-emphasized-hover,var(--luzmo-tag-border-color-emphasized-hover,var(--tag-border-color-emphasized-hover)))!important}}:host([emphasized]:is(:active,[active])){background-color:var(--highcontrast-tag-background-color-emphasized-active,var(--luzmo-tag-background-color-emphasized-active,var(--tag-background-color-emphasized-active)));border-color:var(--highcontrast-tag-border-color-emphasized-active,var(--luzmo-tag-border-color-emphasized-active,var(--tag-border-color-emphasized-active)))!important}:host([emphasized][focused]),:host([emphasized]:focus-visible){background-color:var(--highcontrast-tag-background-color-emphasized-focus,var(--luzmo-tag-background-color-emphasized-focus,var(--tag-background-color-emphasized-focus)));border-color:var(--highcontrast-tag-border-color-emphasized-focus,var(--luzmo-tag-border-color-emphasized-focus,var(--tag-border-color-emphasized-focus)))!important}:host([disabled]){background-color:var(--highcontrast-tag-background-color-disabled,var(--luzmo-tag-background-color-disabled,var(--tag-background-color-disabled)));color:var(--highcontrast-tag-content-color-disabled,var(--luzmo-tag-content-color-disabled,var(--tag-content-color-disabled)));pointer-events:none;border-color:var(--highcontrast-tag-border-color-disabled,var(--luzmo-tag-border-color-disabled,var(--tag-border-color-disabled)))!important}:host([disabled]) ::slotted([slot=avatar]){opacity:var(--luzmo-avatar-opacity-disabled,var(--avatar-opacity-disabled))}@media (forced-colors:active){:host{--highcontrast-tag-border-color:ButtonText;--highcontrast-tag-border-color-hover:ButtonText;--highcontrast-tag-border-color-active:ButtonText;--highcontrast-tag-border-color-focus:Highlight;--highcontrast-tag-background-color:ButtonFace;--highcontrast-tag-background-color-hover:ButtonFace;--highcontrast-tag-background-color-active:ButtonFace;--highcontrast-tag-background-color-focus:ButtonFace;--highcontrast-tag-content-color:ButtonText;--highcontrast-tag-content-color-hover:ButtonText;--highcontrast-tag-content-color-active:ButtonText;--highcontrast-tag-content-color-focus:ButtonText;--highcontrast-tag-focus-ring-color:Highlight;forced-color-adjust:none}:host([selected]){--highcontrast-tag-border-color-selected:Highlight;--highcontrast-tag-border-color-selected-hover:Highlight;--highcontrast-tag-border-color-selected-active:Highlight;--highcontrast-tag-border-color-selected-focus:Highlight;--highcontrast-tag-background-color-selected:Highlight;--highcontrast-tag-background-color-selected-hover:Highlight;--highcontrast-tag-background-color-selected-active:Highlight;--highcontrast-tag-background-color-selected-focus:Highlight;--highcontrast-tag-content-color-selected:HighlightText}:host([disabled]){--highcontrast-tag-border-color-disabled:GrayText;--highcontrast-tag-background-color-disabled:ButtonFace;--highcontrast-tag-content-color-disabled:GrayText}:host([invalid]){--highcontrast-tag-border-color-invalid:Highlight;--highcontrast-tag-border-color-invalid-hover:Highlight;--highcontrast-tag-border-color-invalid-active:Highlight;--highcontrast-tag-border-color-invalid-focus:Highlight;--highcontrast-tag-content-color-invalid:CanvasText;--highcontrast-tag-content-color-invalid-hover:CanvasText;--highcontrast-tag-content-color-invalid-active:CanvasText;--highcontrast-tag-content-color-invalid-focus:CanvasText}:host([invalid][selected]){--highcontrast-tag-border-color-invalid-selected:Highlight;--highcontrast-tag-border-color-invalid-selected-hover:Highlight;--highcontrast-tag-border-color-invalid-selected-focus:Highlight;--highcontrast-tag-border-color-invalid-selected-active:Highlight;--highcontrast-tag-background-color-invalid-selected:Highlight;--highcontrast-tag-background-color-invalid-selected-hover:Highlight;--highcontrast-tag-background-color-invalid-selected-active:Highlight;--highcontrast-tag-background-color-invalid-selected-focus:Highlight;--highcontrast-tag-content-color-invalid-selected:HighlightText}:host([emphasized]){--highcontrast-tag-border-color-emphasized:Highlight;--highcontrast-tag-border-color-emphasized-hover:Highlight;--highcontrast-tag-border-color-emphasized-active:Highlight;--highcontrast-tag-border-color-emphasized-focus:Highlight;--highcontrast-tag-background-color-emphasized:ButtonFace;--highcontrast-tag-background-color-emphasized-hover:ButtonFace;--highcontrast-tag-background-color-emphasized-active:ButtonFace;--highcontrast-tag-background-color-emphasized-focus:ButtonFace;--highcontrast-tag-content-color-emphasized:CanvasText}:host([variant][treatment=fill]){--highcontrast-tag-border-color:Highlight;--highcontrast-tag-border-color-hover:Highlight;--highcontrast-tag-border-color-active:Highlight;--highcontrast-tag-border-color-focus:Highlight;--highcontrast-tag-background-color:Highlight;--highcontrast-tag-background-color-hover:Highlight;--highcontrast-tag-background-color-active:Highlight;--highcontrast-tag-background-color-focus:Highlight;--highcontrast-tag-content-color:HighlightText;--highcontrast-tag-content-color-hover:HighlightText;--highcontrast-tag-content-color-active:HighlightText;--highcontrast-tag-content-color-focus:HighlightText}}:host{--tag-border-color:var(--luzmo-border-color);--tag-border-color-hover:var(--luzmo-border-color-hover);--tag-border-color-active:var(--luzmo-border-color-active);--tag-border-color-focus:var(--luzmo-border-color-focus);--tag-size-small-border-radius:var(--luzmo-border-radius-s);--tag-size-medium-border-radius:var(--luzmo-border-radius);--tag-size-large-border-radius:var(--luzmo-border-radius);--tag-background-color:var(--luzmo-background-color);--tag-background-color-hover:var(--luzmo-background-color-hover);--tag-background-color-active:var(--luzmo-background-color-active);--tag-background-color-focus:var(--luzmo-background-color-focus);--tag-content-color:var(--luzmo-font-color);--tag-content-color-hover:var(--luzmo-font-color-hover);--tag-content-color-active:var(--luzmo-font-color-active);--tag-content-color-focus:var(--luzmo-font-color-focus);--tag-border-color-selected:var(--luzmo-border-color-down);--tag-border-color-selected-hover:var(--luzmo-border-color-down);--tag-border-color-selected-active:var(--luzmo-border-color-down);--tag-border-color-selected-focus:var(--luzmo-border-color-down);--tag-border-color-disabled:var(--luzmo-border-color-disabled);--tag-background-color-disabled:var(--luzmo-background-color-disabled);--avatar-opacity-disabled:.3;--tag-animation-duration:var(--luzmo-animation-duration);--tag-border-width:var(--luzmo-border-width);--tag-focus-ring-thickness:var(--luzmo-indicator-width);--tag-focus-ring-gap:var(--luzmo-indicator-gap);--tag-focus-ring-color:var(--luzmo-indicator-color);--tag-label-line-height:var(--luzmo-line-height);--tag-label-font-weight:var(--luzmo-font-weight);--tag-variant-color-hover:color-mix(in oklch, var(--tag-variant-color), black 8%);--tag-variant-color-down:color-mix(in oklch, var(--tag-variant-color), black 20%);--tag-variant-color-focus:var(--tag-variant-color-hover);--tag-variant-fill-color-hover:var(--tag-variant-color-hover);--tag-variant-fill-color-down:var(--tag-variant-color-down);--tag-variant-fill-color-focus:var(--tag-variant-color-focus);--tag-content-color-selected:var(--luzmo-font-color-down);--tag-background-color-selected:var(--luzmo-background-color-down);--tag-background-color-selected-hover:var(--luzmo-background-color-down);--tag-background-color-selected-active:var(--luzmo-background-color-down);--tag-background-color-selected-focus:var(--luzmo-background-color-down);--tag-border-color-invalid:var(--luzmo-negative-color);--tag-border-color-invalid-hover:var(--luzmo-negative-color-hover);--tag-border-color-invalid-active:var(--luzmo-negative-color-down);--tag-border-color-invalid-focus:var(--luzmo-negative-color-focus);--tag-content-color-invalid:var(--luzmo-negative-color);--tag-content-color-invalid-hover:var(--luzmo-negative-color-hover);--tag-content-color-invalid-active:var(--luzmo-negative-color-down);--tag-content-color-invalid-focus:var(--luzmo-negative-color-focus);--tag-border-color-invalid-selected:var(--luzmo-negative-color-down);--tag-border-color-invalid-selected-hover:var(--luzmo-negative-color-down);--tag-border-color-invalid-selected-focus:var(--luzmo-negative-color-down);--tag-border-color-invalid-selected-active:var(--luzmo-negative-color-down);--tag-background-color-invalid-selected:var(--luzmo-background-color-down);--tag-background-color-invalid-selected-hover:var(--luzmo-background-color-down);--tag-background-color-invalid-selected-active:var(--luzmo-background-color-down);--tag-background-color-invalid-selected-focus:var(--luzmo-background-color-down);--tag-content-color-invalid-selected:var(--luzmo-negative-color-down);--tag-border-color-emphasized:var(--luzmo-primary);--tag-border-color-emphasized-hover:var(--luzmo-primary-hover);--tag-border-color-emphasized-active:var(--luzmo-primary-down);--tag-border-color-emphasized-focus:var(--luzmo-primary-focus);--tag-background-color-emphasized:var(--luzmo-primary);--tag-background-color-emphasized-hover:var(--luzmo-primary-hover);--tag-background-color-emphasized-active:var(--luzmo-primary-down);--tag-background-color-emphasized-focus:var(--luzmo-primary-focus);--tag-content-color-emphasized:white;--tag-content-color-disabled:var(--luzmo-disabled-color);--tag-icon-spacing-inline-end:var(--luzmo-spacing-3);--tag-icon-size:var(--luzmo-font-icon-size-s);--tag-avatar-spacing-inline-end:var(--luzmo-spacing-3);--tag-font-size:var(--luzmo-font-size);--tag-max-inline-size:100%;--tag-subtle-background-opacity:10%;--tag-subtle-interaction-background-opacity:20%;--tag-subtle-content-mix:57%}:host([size=s]){--tag-height:var(--luzmo-component-height-xs);--tag-font-size:var(--luzmo-font-size-s);--tag-icon-size:var(--luzmo-icon-size-s);--tag-icon-spacing-inline-end:var(--luzmo-spacing-2);--tag-clear-button-spacing-inline-start:var(--luzmo-spacing-2);--tag-border-radius:var(--luzmo-border-radius);--tag-spacing-inline-start:var(--luzmo-spacing-3);--tag-label-spacing-inline-end:var(--luzmo-spacing-3);--tag-clear-button-spacing-inline-end:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1))}:host{--tag-height:var(--luzmo-component-height-s);--tag-font-size:var(--luzmo-font-size);--tag-icon-size:var(--luzmo-icon-size-m);--tag-clear-button-spacing-inline-start:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--tag-border-radius:var(--luzmo-border-radius);--tag-spacing-inline-start:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-label-spacing-inline-end:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-clear-button-spacing-inline-end:var(--luzmo-spacing-3)}:host([size=l]){--tag-height:var(--luzmo-component-height);--tag-font-size:var(--luzmo-font-size);--tag-icon-size:var(--luzmo-icon-size-l);--tag-icon-spacing-inline-end:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-clear-button-spacing-inline-start:var(--luzmo-spacing-3);--tag-border-radius:var(--luzmo-border-radius);--tag-spacing-inline-start:var(--luzmo-spacing-4);--tag-label-spacing-inline-end:var(--luzmo-spacing-4);--tag-clear-button-spacing-inline-end:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1))}:host([size=xl]){--tag-height:var(--luzmo-component-height-l);--tag-font-size:var(--luzmo-font-size-l);--tag-icon-size:var(--luzmo-icon-size-xl);--tag-icon-spacing-inline-end:var(--luzmo-spacing-4);--tag-clear-button-spacing-inline-start:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--tag-border-radius:var(--luzmo-border-radius-l);--tag-spacing-inline-start:var(--luzmo-spacing-5);--tag-label-spacing-inline-end:var(--luzmo-spacing-5);--tag-clear-button-spacing-inline-end:var(--luzmo-spacing-4)}:host([variant=accent]){--tag-variant-color:var(--luzmo-primary);--tag-variant-color-hover:var(--luzmo-primary-hover);--tag-variant-color-down:var(--luzmo-primary-down);--tag-variant-color-focus:var(--luzmo-primary-focus);--tag-variant-fill-content-color:var(--luzmo-primary-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-accent-on-subtle-color)}:host([variant=neutral]){--tag-variant-color:var(--luzmo-selected-color-hard);--tag-variant-color-hover:var(--luzmo-selected-color-hard-hover);--tag-variant-color-down:var(--luzmo-selected-color-hard-down);--tag-variant-color-focus:var(--luzmo-selected-color-hard-focus);--tag-variant-fill-content-color:var(--luzmo-background-color);--tag-variant-subtle-content-color:var(--luzmo-neutral-on-subtle-color)}:host([variant=informative]){--tag-variant-color:var(--luzmo-informative-color);--tag-variant-color-hover:var(--luzmo-informative-color-hover);--tag-variant-color-down:var(--luzmo-informative-color-down);--tag-variant-color-focus:var(--luzmo-informative-color-focus);--tag-variant-fill-content-color:var(--luzmo-informative-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-informative-on-subtle-color)}:host([variant=positive]){--tag-variant-color:var(--luzmo-positive-color);--tag-variant-color-hover:var(--luzmo-positive-color-hover);--tag-variant-color-down:var(--luzmo-positive-color-down);--tag-variant-color-focus:var(--luzmo-positive-color-focus);--tag-variant-fill-content-color:var(--luzmo-positive-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-positive-on-subtle-color)}:host([variant=negative]){--tag-variant-color:var(--luzmo-negative-color);--tag-variant-color-hover:var(--luzmo-negative-color-hover);--tag-variant-color-down:var(--luzmo-negative-color-down);--tag-variant-color-focus:var(--luzmo-negative-color-focus);--tag-variant-fill-content-color:var(--luzmo-negative-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-negative-on-subtle-color)}:host([variant=notice]){--tag-variant-color:var(--luzmo-notice-color);--tag-variant-color-hover:var(--luzmo-notice-color-hover);--tag-variant-color-down:var(--luzmo-notice-color-down);--tag-variant-color-focus:var(--luzmo-notice-color-focus);--tag-variant-fill-color-hover:color-mix(in oklch, var(--luzmo-notice-color), white 12%);--tag-variant-fill-color-down:color-mix(in oklch, var(--luzmo-notice-color), white 24%);--tag-variant-fill-color-focus:var(--tag-variant-fill-color-hover);--tag-variant-fill-content-color:var(--luzmo-notice-inverse-color);--tag-variant-subtle-content-color:var(--luzmo-notice-on-subtle-color)}:host([variant=seafoam]){--tag-variant-color:var(--luzmo-seafoam-color);--tag-variant-fill-content-color:white}:host([variant=indigo]){--tag-variant-color:var(--luzmo-indigo-color);--tag-variant-fill-content-color:white}:host([variant=purple]){--tag-variant-color:var(--luzmo-purple-color);--tag-variant-fill-content-color:white}:host([variant=fuchsia]){--tag-variant-color:var(--luzmo-fuchsia-color);--tag-variant-fill-content-color:white}:host([variant=magenta]){--tag-variant-color:var(--luzmo-magenta-color);--tag-variant-fill-content-color:white}:host([variant=yellow]){--tag-variant-color:var(--luzmo-yellow-color);--tag-variant-fill-content-color:black}:host([variant=gray]){--tag-variant-color:var(--luzmo-gray-color);--tag-variant-fill-content-color:white}:host([variant=red]){--tag-variant-color:var(--luzmo-red-color);--tag-variant-fill-content-color:white}:host([variant=orange]){--tag-variant-color:var(--luzmo-orange-color);--tag-variant-fill-content-color:black}:host([variant=chartreuse]){--tag-variant-color:var(--luzmo-chartreuse-color);--tag-variant-fill-content-color:white}:host([variant=celery]){--tag-variant-color:var(--luzmo-celery-color);--tag-variant-fill-content-color:black}:host([variant=green]){--tag-variant-color:var(--luzmo-green-color);--tag-variant-fill-content-color:white}:host([variant=cyan]){--tag-variant-color:var(--luzmo-cyan-color);--tag-variant-fill-content-color:white}:host([variant=blue]){--tag-variant-color:var(--luzmo-blue-color);--tag-variant-fill-content-color:white}:host([variant]:not([treatment=fill])){--tag-border-color:var(--tag-variant-color);--tag-border-color-hover:var(--tag-variant-color-hover);--tag-border-color-active:var(--tag-variant-color-down);--tag-border-color-focus:var(--tag-variant-color-focus);--tag-content-color:var(--tag-variant-color);--tag-content-color-hover:var(--tag-variant-color-hover);--tag-content-color-active:var(--tag-variant-color-down);--tag-content-color-focus:var(--tag-variant-color-focus);--tag-background-color:transparent;--tag-background-color-hover:color-mix(in oklch, var(--tag-variant-color), transparent 90%);--tag-background-color-active:color-mix(in oklch, var(--tag-variant-color), transparent 82%);--tag-background-color-focus:color-mix(in oklch, var(--tag-variant-color), transparent 90%);--tag-border-color-selected:var(--tag-variant-color-down);--tag-border-color-selected-hover:var(--tag-variant-color-down);--tag-border-color-selected-active:var(--tag-variant-color-down);--tag-border-color-selected-focus:var(--tag-variant-color-down);--tag-content-color-selected:var(--tag-variant-color-down);--tag-background-color-selected:color-mix(in oklch, var(--tag-variant-color), transparent 80%);--tag-background-color-selected-hover:color-mix(in oklch, var(--tag-variant-color), transparent 72%);--tag-background-color-selected-active:color-mix(in oklch, var(--tag-variant-color), transparent 72%);--tag-background-color-selected-focus:color-mix(in oklch, var(--tag-variant-color), transparent 72%)}:host([variant][treatment=subtle]){--tag-subtle-background-color:color-mix(in srgb, var(--tag-variant-color) var(--tag-subtle-background-opacity), var(--luzmo-background-color));--tag-subtle-interaction-background-color:color-mix(in srgb, var(--tag-variant-color) var(--tag-subtle-interaction-background-opacity), var(--luzmo-background-color));--tag-subtle-content-color:var(--tag-variant-subtle-content-color,color-mix(in oklch, var(--tag-variant-color), var(--luzmo-font-color) var(--tag-subtle-content-mix)));--tag-subtle-interaction-content-color:color-mix(in oklch, var(--tag-variant-color), var(--luzmo-font-color) var(--tag-subtle-content-mix));--tag-background-color:var(--tag-subtle-background-color);--tag-background-color-hover:var(--tag-subtle-interaction-background-color);--tag-background-color-active:var(--tag-subtle-background-color);--tag-background-color-focus:var(--tag-subtle-interaction-background-color);--tag-background-color-selected:var(--tag-subtle-background-color);--tag-background-color-selected-hover:var(--tag-subtle-background-color);--tag-background-color-selected-active:var(--tag-subtle-background-color);--tag-background-color-selected-focus:var(--tag-subtle-background-color);--tag-content-color:var(--tag-subtle-content-color);--tag-content-color-hover:var(--tag-subtle-interaction-content-color);--tag-content-color-active:var(--tag-subtle-content-color);--tag-content-color-focus:var(--tag-subtle-interaction-content-color);--tag-content-color-selected:var(--tag-subtle-content-color);--luzmo-clear-button-background-color-hover:var(--tag-subtle-interaction-background-color);--luzmo-clear-button-background-color-focus:var(--tag-subtle-interaction-background-color);--luzmo-clear-button-background-color-down:var(--tag-subtle-background-color)}:host([variant][treatment=fill]){--tag-background-color:var(--tag-variant-color);--tag-background-color-hover:var(--tag-variant-fill-color-hover);--tag-background-color-active:var(--tag-variant-fill-color-down);--tag-background-color-focus:var(--tag-variant-fill-color-focus);--tag-content-color:var(--tag-variant-fill-content-color);--tag-content-color-hover:var(--tag-variant-fill-content-color);--tag-content-color-active:var(--tag-variant-fill-content-color);--tag-content-color-focus:var(--tag-variant-fill-content-color);--tag-border-color:transparent;--tag-border-color-hover:transparent;--tag-border-color-active:transparent;--tag-border-color-focus:transparent;--tag-background-color-selected:var(--tag-variant-fill-color-down);--tag-background-color-selected-hover:var(--tag-variant-fill-color-down);--tag-background-color-selected-active:var(--tag-variant-fill-color-down);--tag-background-color-selected-focus:var(--tag-variant-fill-color-down);--tag-content-color-selected:var(--tag-variant-fill-content-color);--tag-border-color-selected:transparent;--tag-border-color-selected-hover:transparent;--tag-border-color-selected-active:transparent;--tag-border-color-selected-focus:transparent;--luzmo-clear-button-background-color-hover:var(--tag-variant-fill-color-hover);--luzmo-clear-button-background-color-focus:var(--tag-variant-fill-color-focus);--luzmo-clear-button-background-color-down:var(--tag-variant-fill-color-down)}:host([variant]:is([treatment=subtle],[treatment=fill])[invalid]){--tag-background-color:var(--luzmo-background-color);--tag-background-color-hover:var(--luzmo-background-color-hover);--tag-background-color-active:var(--luzmo-background-color-down);--tag-background-color-focus:var(--luzmo-background-color-focus);--tag-content-color:var(--luzmo-negative-color);--tag-content-color-hover:var(--luzmo-negative-color-hover);--tag-content-color-active:var(--luzmo-negative-color-down);--tag-content-color-focus:var(--luzmo-negative-color-focus)}:host([invalid]) .clear-button{--clearbutton-medium-icon-color:var(--tag-icon-color-error-key-focus,var(--red-600));--clearbutton-medium-icon-color-hover:var(--clearbutton-medium-icon-color);--clearbutton-medium-icon-color-down:var(--tag-deletable-icon-color-error-down,var(--red-700))}:host([invalid]):hover .clear-button,:host([invalid]:is(:active,[active])) .clear-button{--clearbutton-medium-icon-color:var(--tag-icon-color-error-hover,var(--red-600));--clearbutton-medium-icon-color-hover:var(--clearbutton-medium-icon-color);--clearbutton-medium-icon-color-down:var(--tag-deletable-icon-color-error-down,var(--red-700))}:host([size=xs]){--icon-size:var(--workflow-icon-size-50)}:host([size=s]){--icon-size:var(--workflow-icon-size-75)}:host([size=m]){--icon-size:var(--workflow-icon-size)}:host([size=l]){--icon-size:var(--workflow-icon-size-200)}:host([size=xl]){--icon-size:var(--workflow-icon-size-300)}:host([size=xxl]){--icon-size:var(--workflow-icon-size-400)}", f = [
|
|
28
28
|
"accent",
|
|
29
29
|
"neutral",
|
|
30
30
|
"informative",
|
|
@@ -170,8 +170,11 @@ var m = ":host{flex-wrap:wrap;margin:0;padding:0;list-style:none;display:inline-
|
|
|
170
170
|
let n = (e, t) => e[(e.length + t) % e.length], r = [...this.getRootNode().querySelectorAll("luzmo-tags")];
|
|
171
171
|
if (r.length < 2) return;
|
|
172
172
|
e.preventDefault();
|
|
173
|
-
let i = r.indexOf(this), a = t === "PageUp" ? -1 : 1, o = i + a, s = n(r, o);
|
|
174
|
-
for (; s.tags.length === 0;)
|
|
173
|
+
let i = r.indexOf(this), a = t === "PageUp" ? -1 : 1, o = i + a, s = n(r, o), c = 0;
|
|
174
|
+
for (; s.tags.length === 0;) {
|
|
175
|
+
if (++c >= r.length) return;
|
|
176
|
+
o += a, s = n(r, o);
|
|
177
|
+
}
|
|
175
178
|
s.focus();
|
|
176
179
|
}, this.handleFocusout = () => {
|
|
177
180
|
this.removeEventListener("keydown", this.handleKeydown), this.removeEventListener("focusout", this.handleFocusout);
|
|
@@ -7,6 +7,10 @@ declare const LuzmoHelpText_base: typeof LuzmoElement & {
|
|
|
7
7
|
};
|
|
8
8
|
/**
|
|
9
9
|
* @element luzmo-help-text
|
|
10
|
+
* @cssprop --luzmo-helptext-font-size - Message text size.
|
|
11
|
+
* @cssprop --luzmo-helptext-min-height - Minimum block size of the message.
|
|
12
|
+
* @cssprop --luzmo-helptext-top-to-text - Space from the top of the control to the message.
|
|
13
|
+
* @cssprop --luzmo-helptext-bottom-to-text - Space from the message to the bottom of the control.
|
|
10
14
|
*/
|
|
11
15
|
export declare class LuzmoHelpText extends LuzmoHelpText_base {
|
|
12
16
|
static get styles(): CSSResultArray;
|
|
@@ -1,18 +1,18 @@
|
|
|
1
|
-
/*! * Lucero - The design system for Luzmo.
|
|
2
|
-
*
|
|
3
|
-
* Copyright © 2025 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.
|
|
1
|
+
/*! * Lucero - The design system for Luzmo.
|
|
2
|
+
*
|
|
3
|
+
* Copyright © 2025 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
17
|
* */
|
|
18
|
-
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require(
|
|
18
|
+
Object.defineProperty(exports,Symbol.toStringTag,{value:`Module`});const e=require("../text-field-COHW36-x.cjs"),t=require("../text-field-BzZ4jEr6.cjs");exports.LuzmoHelpText=t.t,exports.LuzmoTextField=e.t;
|
|
@@ -1,26 +1,26 @@
|
|
|
1
|
-
/*! * Lucero - The design system for Luzmo.
|
|
2
|
-
*
|
|
3
|
-
* Copyright © 2025 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.
|
|
1
|
+
/*! * Lucero - The design system for Luzmo.
|
|
2
|
+
*
|
|
3
|
+
* Copyright © 2025 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
17
|
* */
|
|
18
18
|
(() => {
|
|
19
19
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
20
20
|
let e = document.createElement("style");
|
|
21
|
-
e.setAttribute("data-luzmo-vars", ""), e.textContent = "html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: color-mix(in oklch, var(--luzmo-border-color-full), black 25%);--luzmo-border-color-full-down: color-mix(in oklch, var(--luzmo-border-color-full), black 45%);--luzmo-border-color-full-focus: color-mix(in oklch, var(--luzmo-border-color-full), black 25%);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Oxygen-Sans, Ubuntu, Cantarell, \"Helvetica Neue\", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-disabled: var(--luzmo-disabled-color);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: color-mix(in oklch, var(--luzmo-font-color), black 8%);--luzmo-font-color-down: color-mix(in oklch, var(--luzmo-font-color), black 20%);--luzmo-font-color-focus: color-mix(in oklch, var(--luzmo-font-color), black 8%);--luzmo-primary: #4434ff;--luzmo-primary-hover: color-mix(in oklch, var(--luzmo-primary), black 8%);--luzmo-primary-down: color-mix(in oklch, var(--luzmo-primary), black 20%);--luzmo-primary-focus: color-mix(in oklch, var(--luzmo-primary), black 8%);--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: color-mix(in oklch, color-mix(in oklch, var(--luzmo-background-color), var(--luzmo-primary) 5%), black 1.5%);--luzmo-background-color-down: color-mix(in oklch, color-mix(in oklch, var(--luzmo-background-color), var(--luzmo-primary) 7%), black 1%);--luzmo-background-color-focus: color-mix(in oklch, color-mix(in oklch, var(--luzmo-background-color), var(--luzmo-primary) 5%), black 1.5%);--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: color-mix(in oklch, var(--luzmo-background-color-highlight), black 25%);--luzmo-background-color-highlight-down: color-mix(in oklch, var(--luzmo-background-color-highlight), black 45%);--luzmo-background-color-highlight-focus: color-mix(in oklch, var(--luzmo-background-color-highlight), black 25%);--luzmo-secondary: #d000d0;--luzmo-secondary-hover: color-mix(in oklch, var(--luzmo-secondary), black 8%);--luzmo-secondary-down: color-mix(in oklch, var(--luzmo-secondary), black 20%);--luzmo-secondary-focus: color-mix(in oklch, var(--luzmo-secondary), black 8%);--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 208, 0, 208;--luzmo-scrollbar-size: 6px;--luzmo-scrollbar-thumb-background: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-scrollbar-thumb-border-radius: var(--luzmo-border-radius-s);--luzmo-scrollbar-thumb-hover-background: rgba( var(--luzmo-border-color-rgb), 0.4 );--luzmo-scrollbar-track-background: transparent;--luzmo-scrollbar-track-border-radius: var(--luzmo-border-radius-s);--luzmo-scrollbar-width: thin;--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: color-mix(in oklch, var(--luzmo-negative-color), black 8%);--luzmo-negative-color-down: color-mix(in oklch, var(--luzmo-negative-color), black 20%);--luzmo-negative-color-focus: color-mix(in oklch, var(--luzmo-negative-color), black 8%);--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-negative-inverse-color: #ffffff;--luzmo-positive-color: rgb(18, 133, 90);--luzmo-positive-color-hover: color-mix(in oklch, var(--luzmo-positive-color), black 8%);--luzmo-positive-color-down: color-mix(in oklch, var(--luzmo-positive-color), black 20%);--luzmo-positive-color-focus: color-mix(in oklch, var(--luzmo-positive-color), black 8%);--luzmo-positive-color-rgb: 18, 133, 90;--luzmo-positive-inverse-color: #ffffff;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: color-mix(in oklch, var(--luzmo-selected-color), black 25%);--luzmo-selected-color-down: color-mix(in oklch, var(--luzmo-selected-color), black 45%);--luzmo-selected-color-focus: color-mix(in oklch, var(--luzmo-selected-color), black 25%);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: color-mix(in oklch, var(--luzmo-selected-color-hard), black 25%);--luzmo-selected-color-hard-down: color-mix(in oklch, var(--luzmo-selected-color-hard), black 45%);--luzmo-selected-color-hard-focus: color-mix(in oklch, var(--luzmo-selected-color-hard), black 25%);--luzmo-informative-color: #1670dd;--luzmo-informative-color-rgb: 22, 112, 221;--luzmo-notice-color: rgb(229, 127, 0);--luzmo-seafoam-color: rgb(0, 140, 140);--luzmo-indigo-color: rgb(68, 52, 255);--luzmo-purple-color: rgb(112, 48, 210);--luzmo-fuchsia-color: rgb(205, 30, 170);--luzmo-magenta-color: rgb(203, 36, 98);--luzmo-yellow-color: rgb(228, 208, 0);--luzmo-gray-color: rgb(110, 110, 110);--luzmo-red-color: rgb(202, 34, 28);--luzmo-orange-color: rgb(218, 123, 17);--luzmo-chartreuse-color: rgb(85, 135, 0);--luzmo-celery-color: rgb(48, 134, 22);--luzmo-green-color: rgb(18, 133, 90);--luzmo-cyan-color: rgb(0, 134, 180);--luzmo-blue-color: rgb(22, 112, 221);--luzmo-disabled-color: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 10px;--luzmo-icon-size-xs: 12px;--luzmo-icon-size-s: 14px;--luzmo-icon-size-m: 16px;--luzmo-icon-size-l: 18px;--luzmo-icon-size-xl: 20px;--luzmo-icon-size-xxl: 32px}", document.head.appendChild(e);
|
|
21
|
+
e.setAttribute("data-luzmo-vars", ""), e.textContent = "html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: color-mix(in oklch, var(--luzmo-border-color-full), black 25%);--luzmo-border-color-full-down: color-mix(in oklch, var(--luzmo-border-color-full), black 45%);--luzmo-border-color-full-focus: color-mix(in oklch, var(--luzmo-border-color-full), black 25%);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Oxygen-Sans, Ubuntu, Cantarell, \"Helvetica Neue\", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-disabled: var(--luzmo-disabled-color);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: color-mix(in oklch, var(--luzmo-font-color), black 8%);--luzmo-font-color-down: color-mix(in oklch, var(--luzmo-font-color), black 20%);--luzmo-font-color-focus: color-mix(in oklch, var(--luzmo-font-color), black 8%);--luzmo-primary: #4434ff;--luzmo-primary-hover: color-mix(in oklch, var(--luzmo-primary), black 8%);--luzmo-primary-down: color-mix(in oklch, var(--luzmo-primary), black 20%);--luzmo-primary-focus: color-mix(in oklch, var(--luzmo-primary), black 8%);--luzmo-primary-inverse-color: #ffffff;--luzmo-accent-on-subtle-color: var(--luzmo-primary);--luzmo-primary-rgb: 68, 52, 255;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: color-mix(in oklch, color-mix(in oklch, var(--luzmo-background-color), var(--luzmo-primary) 5%), black 1.5%);--luzmo-background-color-down: color-mix(in oklch, color-mix(in oklch, var(--luzmo-background-color), var(--luzmo-primary) 7%), black 1%);--luzmo-background-color-focus: color-mix(in oklch, color-mix(in oklch, var(--luzmo-background-color), var(--luzmo-primary) 5%), black 1.5%);--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: color-mix(in oklch, var(--luzmo-background-color-highlight), black 10%);--luzmo-background-color-highlight-down: color-mix(in oklch, var(--luzmo-background-color-highlight), black 20%);--luzmo-background-color-highlight-focus: color-mix(in oklch, var(--luzmo-background-color-highlight), black 10%);--luzmo-secondary: #d000d0;--luzmo-secondary-hover: color-mix(in oklch, var(--luzmo-secondary), black 8%);--luzmo-secondary-down: color-mix(in oklch, var(--luzmo-secondary), black 20%);--luzmo-secondary-focus: color-mix(in oklch, var(--luzmo-secondary), black 8%);--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 208, 0, 208;--luzmo-scrollbar-size: 6px;--luzmo-scrollbar-thumb-background: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-scrollbar-thumb-border-radius: var(--luzmo-border-radius-s);--luzmo-scrollbar-thumb-hover-background: rgba( var(--luzmo-border-color-rgb), 0.4 );--luzmo-scrollbar-track-background: transparent;--luzmo-scrollbar-track-border-radius: var(--luzmo-border-radius-s);--luzmo-scrollbar-width: thin;--luzmo-negative-color: #ca221c;--luzmo-negative-color-hover: color-mix(in oklch, var(--luzmo-negative-color), black 8%);--luzmo-negative-color-down: color-mix(in oklch, var(--luzmo-negative-color), black 20%);--luzmo-negative-color-focus: color-mix(in oklch, var(--luzmo-negative-color), black 8%);--luzmo-negative-on-subtle-color: var(--luzmo-negative-color);--luzmo-negative-color-rgb: 202, 34, 28;--luzmo-negative-inverse-color: #ffffff;--luzmo-positive-color: rgb(18, 133, 90);--luzmo-positive-color-hover: color-mix(in oklch, var(--luzmo-positive-color), black 8%);--luzmo-positive-color-down: color-mix(in oklch, var(--luzmo-positive-color), black 20%);--luzmo-positive-color-focus: color-mix(in oklch, var(--luzmo-positive-color), black 8%);--luzmo-positive-on-subtle-color: color-mix( in oklch, var(--luzmo-positive-color), var(--luzmo-font-color) 11% );--luzmo-positive-color-rgb: 18, 133, 90;--luzmo-positive-inverse-color: #ffffff;--luzmo-selected-color: rgb(110, 110, 110);--luzmo-selected-color-hover: color-mix(in oklch, var(--luzmo-selected-color), black 25%);--luzmo-selected-color-down: color-mix(in oklch, var(--luzmo-selected-color), black 45%);--luzmo-selected-color-focus: color-mix(in oklch, var(--luzmo-selected-color), black 25%);--luzmo-selected-color-hard: #1e1e1e;--luzmo-selected-color-hard-hover: color-mix(in oklch, var(--luzmo-selected-color-hard), black 25%);--luzmo-selected-color-hard-down: color-mix(in oklch, var(--luzmo-selected-color-hard), black 45%);--luzmo-selected-color-hard-focus: color-mix(in oklch, var(--luzmo-selected-color-hard), black 25%);--luzmo-neutral-on-subtle-color: var(--luzmo-selected-color-hard);--luzmo-informative-color: #1670dd;--luzmo-informative-color-hover: color-mix(in oklch, var(--luzmo-informative-color), black 8%);--luzmo-informative-color-down: color-mix(in oklch, var(--luzmo-informative-color), black 20%);--luzmo-informative-color-focus: var(--luzmo-informative-color-hover);--luzmo-informative-on-subtle-color: color-mix( in oklch, var(--luzmo-informative-color), var(--luzmo-font-color) 9% );--luzmo-informative-color-rgb: 22, 112, 221;--luzmo-informative-inverse-color: #ffffff;--luzmo-notice-color: rgb(229, 127, 0);--luzmo-notice-color-hover: color-mix(in oklch, var(--luzmo-notice-color), black 8%);--luzmo-notice-color-down: color-mix(in oklch, var(--luzmo-notice-color), black 20%);--luzmo-notice-color-focus: var(--luzmo-notice-color-hover);--luzmo-notice-on-subtle-color: color-mix( in oklch, var(--luzmo-notice-color), var(--luzmo-font-color) 40% );--luzmo-notice-inverse-color: var(--luzmo-selected-color-hard);--luzmo-seafoam-color: rgb(0, 140, 140);--luzmo-indigo-color: rgb(68, 52, 255);--luzmo-purple-color: rgb(112, 48, 210);--luzmo-fuchsia-color: rgb(205, 30, 170);--luzmo-magenta-color: rgb(203, 36, 98);--luzmo-yellow-color: rgb(228, 208, 0);--luzmo-gray-color: rgb(110, 110, 110);--luzmo-red-color: rgb(202, 34, 28);--luzmo-orange-color: rgb(218, 123, 17);--luzmo-chartreuse-color: rgb(85, 135, 0);--luzmo-celery-color: rgb(48, 134, 22);--luzmo-green-color: rgb(18, 133, 90);--luzmo-cyan-color: rgb(0, 134, 180);--luzmo-blue-color: rgb(22, 112, 221);--luzmo-disabled-color: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 10px;--luzmo-icon-size-xs: 12px;--luzmo-icon-size-s: 14px;--luzmo-icon-size-m: 16px;--luzmo-icon-size-l: 18px;--luzmo-icon-size-xl: 20px;--luzmo-icon-size-xxl: 32px}html.dark,html.dark-theme,:where(.dark-theme){--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.2);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.35);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-rgb: 255, 255, 255;--luzmo-border-color-full: #4c4c57;--luzmo-border-color-full-hover: color-mix(in oklch, var(--luzmo-border-color-full), white 20%);--luzmo-border-color-full-down: color-mix(in oklch, var(--luzmo-border-color-full), white 35%);--luzmo-border-color-full-focus: color-mix(in oklch, var(--luzmo-border-color-full), white 20%);--luzmo-border-color-disabled: #333;--luzmo-font-color: #ced4da;--luzmo-font-color-extra-dimmed: #72787f;--luzmo-font-color-hover: color-mix(in oklch, var(--luzmo-font-color), white 8%);--luzmo-font-color-down: color-mix(in oklch, var(--luzmo-font-color), white 20%);--luzmo-font-color-focus: color-mix(in oklch, var(--luzmo-font-color), white 8%);--luzmo-primary: #7b90ff;--luzmo-primary-hover: color-mix(in oklch, var(--luzmo-primary), white 12%);--luzmo-primary-down: color-mix(in oklch, var(--luzmo-primary), white 24%);--luzmo-primary-focus: color-mix(in oklch, var(--luzmo-primary), white 12%);--luzmo-accent-on-subtle-color: color-mix( in oklch, var(--luzmo-primary), var(--luzmo-font-color) 1% );--luzmo-background-color: #262626;--luzmo-background-color-rgb: 0, 0, 0;--luzmo-background-color-disabled: #939ea8;--luzmo-background-color-hover: color-mix(in oklch, color-mix(in oklch, var(--luzmo-background-color), var(--luzmo-primary) 3%), white 14%);--luzmo-background-color-down: color-mix(in oklch, color-mix(in oklch, var(--luzmo-background-color), var(--luzmo-primary) 3%), white 25%);--luzmo-background-color-focus: color-mix(in oklch, color-mix(in oklch, var(--luzmo-background-color), var(--luzmo-primary) 3%), white 14%);--luzmo-background-color-highlight: rgb(72, 72, 72);--luzmo-background-color-highlight-disabled: #313131;--luzmo-background-color-highlight-hover: color-mix(in oklch, var(--luzmo-background-color-highlight), white 20%);--luzmo-background-color-highlight-down: color-mix(in oklch, var(--luzmo-background-color-highlight), white 35%);--luzmo-background-color-highlight-focus: color-mix(in oklch, var(--luzmo-background-color-highlight), white 20%);--luzmo-primary-inverse-color: var(--luzmo-background-color);--luzmo-indicator-color: var(--luzmo-primary);--luzmo-primary-rgb: 94, 113, 208;--luzmo-secondary: #ebff00;--luzmo-secondary-inverse-color: #333;--luzmo-secondary-rgb: 200, 219, 0;--luzmo-negative-color: #f76d74;--luzmo-negative-color-hover: color-mix(in oklch, var(--luzmo-negative-color), white 12%);--luzmo-negative-color-down: color-mix(in oklch, var(--luzmo-negative-color), white 24%);--luzmo-negative-color-focus: color-mix(in oklch, var(--luzmo-negative-color), white 12%);--luzmo-negative-on-subtle-color: color-mix( in oklch, var(--luzmo-negative-color), var(--luzmo-font-color) 40% );--luzmo-negative-color-rgb: 247, 109, 116;--luzmo-negative-inverse-color: var(--luzmo-background-color);--luzmo-positive-color: #39a875;--luzmo-positive-color-hover: color-mix(in oklch, var(--luzmo-positive-color), white 12%);--luzmo-positive-color-down: color-mix(in oklch, var(--luzmo-positive-color), white 24%);--luzmo-positive-color-focus: color-mix(in oklch, var(--luzmo-positive-color), white 12%);--luzmo-positive-on-subtle-color: color-mix( in oklch, var(--luzmo-positive-color), var(--luzmo-font-color) 35% );--luzmo-positive-color-rgb: 57, 168, 117;--luzmo-positive-inverse-color: var(--luzmo-background-color);--luzmo-selected-color: #afafaf;--luzmo-selected-color-hover: color-mix(in oklch, var(--luzmo-selected-color), white 20%);--luzmo-selected-color-down: color-mix(in oklch, var(--luzmo-selected-color), white 35%);--luzmo-selected-color-focus: color-mix(in oklch, var(--luzmo-selected-color), white 20%);--luzmo-selected-color-hard: #e9e9e9;--luzmo-selected-color-hard-hover: color-mix(in oklch, var(--luzmo-selected-color-hard), white 20%);--luzmo-selected-color-hard-down: color-mix(in oklch, var(--luzmo-selected-color-hard), white 35%);--luzmo-selected-color-hard-focus: color-mix(in oklch, var(--luzmo-selected-color-hard), white 20%);--luzmo-neutral-on-subtle-color: var(--luzmo-selected-color-hard);--luzmo-informative-color: #5c94ff;--luzmo-informative-color-hover: color-mix(in oklch, var(--luzmo-informative-color), white 12%);--luzmo-informative-color-down: color-mix(in oklch, var(--luzmo-informative-color), white 24%);--luzmo-informative-color-focus: var(--luzmo-informative-color-hover);--luzmo-informative-on-subtle-color: color-mix( in oklch, var(--luzmo-informative-color), var(--luzmo-font-color) 36% );--luzmo-informative-color-rgb: 92, 148, 255;--luzmo-informative-inverse-color: var(--luzmo-background-color);--luzmo-notice-color-hover: color-mix(in oklch, var(--luzmo-notice-color), white 12%);--luzmo-notice-color-down: color-mix(in oklch, var(--luzmo-notice-color), white 24%);--luzmo-notice-color-focus: var(--luzmo-notice-color-hover);--luzmo-notice-on-subtle-color: var(--luzmo-notice-color);--luzmo-notice-inverse-color: var(--luzmo-background-color);--luzmo-disabled-color: #75797b}", document.head.appendChild(e);
|
|
22
22
|
}
|
|
23
23
|
})();
|
|
24
|
-
import { t as e } from "../text-field-
|
|
25
|
-
import { t } from "../text-field-
|
|
24
|
+
import { t as e } from "../text-field-C56-sBct.js";
|
|
25
|
+
import { t } from "../text-field-nBag7DTk.js";
|
|
26
26
|
export { t as LuzmoHelpText, e as LuzmoTextField };
|
|
@@ -160,6 +160,15 @@ export declare class LuzmoTextFieldBase extends LuzmoTextFieldBase_base {
|
|
|
160
160
|
* @element luzmo-text-field
|
|
161
161
|
* @slot help-text - default or non-negative help text to associate to your form element
|
|
162
162
|
* @slot negative-help-text - negative help text to associate to your form element when `invalid`
|
|
163
|
+
* @cssprop --luzmo-text-field-width - Control width.
|
|
164
|
+
* @cssprop --luzmo-text-field-height - Control height.
|
|
165
|
+
* @cssprop --luzmo-text-field-background-color - Field background.
|
|
166
|
+
* @cssprop --luzmo-text-field-background-color-disabled - Field background when disabled.
|
|
167
|
+
* @cssprop --luzmo-text-field-placeholder-font-size - Placeholder text size.
|
|
168
|
+
* @cssprop --luzmo-text-field-border-width - Field border width.
|
|
169
|
+
* @cssprop --luzmo-text-field-spacing-inline - Inline padding inside the field.
|
|
170
|
+
* @cssprop --luzmo-text-field-spacing-block-start - Block-start padding inside the field.
|
|
171
|
+
* @cssprop --luzmo-text-field-spacing-block-end - Block-end padding inside the field.
|
|
163
172
|
*/
|
|
164
173
|
export declare class LuzmoTextField extends LuzmoTextFieldBase {
|
|
165
174
|
set value(value: string);
|
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
/*! * Lucero - The design system for Luzmo.
|
|
2
|
+
*
|
|
3
|
+
* Copyright © 2025 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
|
+
const e=require("./decorate-Dq34MBGe.cjs"),t=require("./sized-mixin-BT7cv-fT.cjs"),n=require("./text-field-COHW36-x.cjs");let r=require("lit"),i=require("lit/decorators.js"),a=require("@luzmo/icons");var o=`@media (forced-colors:active){:host{--highcontrast-helptext-content-color-default:CanvasText;--highcontrast-helptext-icon-color-default:CanvasText}:host,.text,.icon{forced-color-adjust:none}}:host{--helptext-bottom-to-workflow-icon:3px;color:var(--highcontrast-helptext-content-color-default,var(--luzmo-helptext-content-color-default,var(--helptext-content-color-default)));font-family:var(--luzmo-helptext-font-family,var(--luzmo-font-family));font-weight:var(--luzmo-helptext-font-weight,var(--luzmo-font-weight));font-size:var(--luzmo-helptext-font-size,var(--helptext-font-size,var(--luzmo-font-size-s)));min-block-size:var(--luzmo-helptext-min-height,var(--helptext-min-height,24px));display:flex}.icon{block-size:var(--luzmo-helptext-icon-size,var(--helptext-icon-size,18px));inline-size:var(--luzmo-helptext-icon-size,var(--helptext-icon-size,18px));flex-shrink:0;margin-inline-end:var(--luzmo-helptext-text-to-visual,var(--helptext-text-to-visual,7px));padding-block-start:var(--luzmo-helptext-top-to-workflow-icon,var(--helptext-top-to-workflow-icon,3px));padding-block-end:var(--luzmo-helptext-bottom-to-workflow-icon,var(--helptext-bottom-to-workflow-icon,3px))}.text{line-height:var(--luzmo-helptext-line-height,var(--helptext-line-height,1.3));padding-block-start:var(--luzmo-helptext-top-to-text,var(--helptext-top-to-text,4px));padding-block-end:var(--luzmo-helptext-bottom-to-text,var(--helptext-bottom-to-text,5px))}:host(:lang(ja)) .text,:host(:lang(ko)) .text,:host(:lang(zh)) .text{line-height:var(--luzmo-helptext-line-height-cjk,var(--helptext-line-height-cjk,1.4))}:host([variant=neutral]) .text{color:var(--highcontrast-helptext-content-color-default,var(--luzmo-helptext-content-color-default,var(--helptext-content-color-default)))}:host([variant=neutral]) .icon{color:var(--highcontrast-helptext-icon-color-default,var(--luzmo-helptext-icon-color-default,var(--helptext-icon-color-default)))}:host([variant=negative]) .text{color:var(--highcontrast-helptext-content-color-default,var(--luzmo-helptext-content-color-default,var(--luzmo-negative-color-down)))}:host([variant=negative]) .icon{color:var(--highcontrast-helptext-icon-color-default,var(--luzmo-helptext-icon-color-default,var(--helptext-icon-color-default)))}:host([disabled]) .text{color:var(--highcontrast-helptext-content-color-default,var(--luzmo-helptext-content-color-default,var(--luzmo-font-color)))}:host([disabled]) .icon{color:var(--highcontrast-helptext-icon-color-default,var(--luzmo-helptext-icon-color-default,var(--helptext-icon-color-default)))}:host{--helptext-line-height:1.3;--helptext-content-color-default:var(--luzmo-font-color);--helptext-icon-color-default:var(--luzmo-font-color);--helptext-disabled-content-color:var(--luzmo-font-color-disabled)}:host([variant=neutral]){--helptext-content-color-default:var(--luzmo-font-color);--helptext-icon-color-default:var(--luzmo-font-color)}:host([variant=negative]){--helptext-content-color-default:var(--luzmo-negative-color);--helptext-icon-color-default:var(--luzmo-negative-color)}:host([disabled]){--helptext-content-color-default:var(--luzmo-font-color-disabled);--helptext-icon-color-default:var(--luzmo-font-color-disabled)}:host(:lang(ja)),:host(:lang(zh)),:host(:lang(ko)){--helptext-line-height-cjk:1.4}:host([size=s]){--helptext-min-height:24px;--helptext-icon-size:16px;--helptext-font-size:12px;--helptext-text-to-visual:7px;--helptext-top-to-workflow-icon:4px;--helptext-top-to-text:4px;--helptext-bottom-to-text:5px}:host{--helptext-min-height:24px;--helptext-icon-size:18px;--helptext-font-size:12px;--helptext-text-to-visual:7px;--helptext-top-to-workflow-icon:3px;--helptext-top-to-text:4px;--helptext-bottom-to-text:5px}:host([size=l]){--helptext-min-height:32px;--helptext-icon-size:20px;--helptext-font-size:14px;--helptext-text-to-visual:8px;--helptext-top-to-workflow-icon:6px;--helptext-top-to-text:6px;--helptext-bottom-to-text:5px}:host([size=xl]){--helptext-min-height:40px;--helptext-icon-size:22px;--helptext-font-size:16px;--helptext-text-to-visual:9px;--helptext-top-to-workflow-icon:9px;--helptext-top-to-text:9px;--helptext-bottom-to-text:12px}`,s=class extends t.n(e.n,{noDefaultSize:!0}){constructor(...e){super(...e),this.icon=!1,this.variant=`neutral`}static get styles(){return[(0,r.unsafeCSS)(o)]}render(){return r.html`
|
|
19
|
+
${this.variant===`negative`&&this.icon?r.html` ${(0,a.luzmoIcon)(a.luzmoClose14)} `:r.nothing}
|
|
20
|
+
<div class="text"><slot></slot></div>
|
|
21
|
+
`}};e.t([(0,i.property)({type:Boolean,reflect:!0})],s.prototype,`icon`,void 0),e.t([(0,i.property)({reflect:!0})],s.prototype,`variant`,void 0),customElements.get(`luzmo-text-field`)||customElements.define(`luzmo-text-field`,n.t),customElements.get(`luzmo-help-text`)||customElements.define(`luzmo-help-text`,s),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return s}});
|
|
@@ -1,25 +1,25 @@
|
|
|
1
|
-
/*! * Lucero - The design system for Luzmo.
|
|
2
|
-
*
|
|
3
|
-
* Copyright © 2025 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.
|
|
1
|
+
/*! * Lucero - The design system for Luzmo.
|
|
2
|
+
*
|
|
3
|
+
* Copyright © 2025 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
17
|
* */
|
|
18
|
-
import { t as e } from "./decorate-
|
|
19
|
-
import { n as t } from "./sized-mixin-
|
|
20
|
-
import { t as n } from "./focusable-
|
|
21
|
-
import { t as r } from "./manage-help-text-
|
|
22
|
-
import { t as i } from "./text-field.module-
|
|
18
|
+
import { t as e } from "./decorate-CkCg3wfh.js";
|
|
19
|
+
import { n as t } from "./sized-mixin-DzQTebN-.js";
|
|
20
|
+
import { t as n } from "./focusable-DuP0-Kuy.js";
|
|
21
|
+
import { t as r } from "./manage-help-text-DwfUBgHK.js";
|
|
22
|
+
import { t as i } from "./text-field.module-BHhBReKL.js";
|
|
23
23
|
import { html as a, nothing as o, unsafeCSS as s } from "lit";
|
|
24
24
|
import { property as c, query as l, state as u } from "lit/decorators.js";
|
|
25
25
|
import { luzmoAlert as d, luzmoCheck as f, luzmoIcon as p } from "@luzmo/icons";
|