@luzmo/lucero 2.2.1 → 2.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/LICENSE +1 -1
- package/README.md +34 -1
- package/components/accordion/index.cjs +2 -2
- package/components/accordion/index.js +3 -8
- package/components/{accordion-DpsYMoeb.cjs → accordion-BK0LfhmL.cjs} +2 -2
- package/components/{accordion-BDchhAjE.js → accordion-ciplqKwM.js} +2 -1
- package/components/action-bar/action-bar.d.ts +3 -3
- package/components/action-bar/index.cjs +2 -2
- package/components/action-bar/index.js +3 -8
- package/components/{action-bar-2FGCCKMW.js → action-bar-BZBIeGo7.js} +6 -5
- package/components/action-bar-DAqG_7VG.cjs +39 -0
- package/components/action-button/index.cjs +2 -2
- package/components/action-button/index.js +3 -8
- package/components/{action-button-OB5MM04X.js → action-button-BRijXjEz.js} +2 -1
- package/components/action-button-CX1uYbQp.cjs +22 -0
- package/components/action-group/index.cjs +2 -2
- package/components/action-group/index.js +3 -11
- package/components/{action-group-BQ-fyPYS.js → action-group-DSiruuF0.js} +5 -2
- package/components/action-group-oo7YV0EW.cjs +20 -0
- package/components/action-menu/index.cjs +2 -2
- package/components/action-menu/index.js +3 -8
- package/components/{action-menu-Diehg1Kc.js → action-menu-C0sHNsjG.js} +7 -6
- package/components/{action-menu-CtMswuyc.cjs → action-menu-CwzRbF61.cjs} +2 -2
- package/components/avatar/index.cjs +2 -2
- package/components/avatar/index.js +3 -8
- package/components/{avatar-Nb0368Wi.js → avatar-CwSyYAKV.js} +2 -1
- package/components/avatar-DHS5UGTJ.cjs +34 -0
- package/components/badge/index.cjs +2 -2
- package/components/badge/index.js +3 -8
- package/components/{badge-DP1uxXaZ.js → badge-D2Hjf-Ww.js} +2 -1
- package/components/badge-D8pIDEoq.cjs +23 -0
- package/components/button/index.cjs +2 -2
- package/components/button/index.js +4 -9
- package/components/button-Bvnidb4x.cjs +20 -0
- package/components/{button-DXWWEbir.js → button-DIV_j_U3.js} +4 -3
- package/components/button-base-DiNxrttk.cjs +1 -1
- package/components/button-base-DiPzVpp4.js +1 -1
- package/components/button-group/index.cjs +2 -2
- package/components/button-group/index.js +3 -8
- package/components/button-group-Du7R4SxZ.cjs +18 -0
- package/components/{button-group-DaANSInm.js → button-group-Duf-Igst.js} +2 -1
- package/components/calendar/index.cjs +2 -2
- package/components/calendar/index.js +3 -8
- package/components/{calendar-C8u_88jX.js → calendar-D1UtHvpY.js} +4 -3
- package/components/calendar-pQxEWdYC.cjs +138 -0
- package/components/chat-message/index.cjs +2 -2
- package/components/chat-message/index.js +3 -8
- package/components/chat-message-Dgo6h0rD.cjs +148 -0
- package/components/{chat-message-CXq0Trjx.js → chat-message-T6QIK2Bl.js} +528 -563
- package/components/chat-message-group/index.cjs +2 -2
- package/components/chat-message-group/index.js +3 -8
- package/components/chat-message-group-CvxdX3jt.cjs +24 -0
- package/components/{chat-message-group-D7vdn2gG.js → chat-message-group-k9lo-ZqD.js} +2 -1
- package/components/checkbox/index.cjs +2 -2
- package/components/checkbox/index.js +3 -8
- package/components/{checkbox-6YzkdHR4.js → checkbox-BEjvkjfc.js} +2 -1
- package/components/checkbox-ClVrkeLp.cjs +25 -0
- package/components/checkbox-mixin-jqmrh48O.js +1 -1
- package/components/checkbox-mixin-rFRXqyrK.cjs +1 -1
- package/components/{close-button-BntGLAcp.cjs → close-button-BAELImQY.cjs} +2 -2
- package/components/{close-button-D12zZ9zC.js → close-button-Dlvtf9lB.js} +3 -3
- package/components/color-area/index.cjs +2 -2
- package/components/color-area/index.js +3 -8
- package/components/color-area-CmKlQG1i.cjs +80 -0
- package/components/{color-area-DMpXKgPY.js → color-area-lbg8wwZG.js} +3 -2
- package/components/color-controller-DbyPc33Y.cjs +1 -1
- package/components/color-controller-Rg_Zl0sT.js +1 -1
- package/components/color-field/index.cjs +2 -2
- package/components/color-field/index.js +3 -8
- package/components/{color-field-BNGnBRSO.cjs → color-field-BH9x46k_.cjs} +2 -2
- package/components/{color-field-CUdHxonc.js → color-field-C9S-Fv46.js} +2 -1
- package/components/color-handle/color-handle.d.ts +1 -1
- package/components/color-handle/index.cjs +2 -2
- package/components/color-handle/index.js +3 -8
- package/components/color-handle-2iFLp9FN.cjs +24 -0
- package/components/{color-handle-TKbLs1ax.js → color-handle-BEDQ1RcS.js} +3 -2
- package/components/color-loupe/index.cjs +2 -2
- package/components/color-loupe/index.js +3 -11
- package/components/color-loupe-6NcLbFco.cjs +56 -0
- package/components/{color-loupe-DAxrNPJz.js → color-loupe-CqHyyvjQ.js} +5 -2
- package/components/color-menu/index.cjs +2 -2
- package/components/color-menu/index.js +3 -8
- package/components/color-menu-BYTgxLQG.cjs +89 -0
- package/components/{color-menu-jkdcr5ir.js → color-menu-qJK_clDq.js} +9 -8
- package/components/color-palette/index.cjs +2 -2
- package/components/color-palette/index.js +3 -8
- package/components/{color-palette-FQyIMSwP.js → color-palette-CqiO5ohz.js} +2 -1
- package/components/color-palette-group/index.cjs +2 -2
- package/components/color-palette-group/index.js +3 -8
- package/components/color-palette-group-D4k_7pW6.cjs +28 -0
- package/components/{color-palette-group-o6bnF-Ir.js → color-palette-group-zByrO_qb.js} +2 -1
- package/components/color-palette-x6W09EBL.cjs +18 -0
- package/components/color-picker/index.cjs +2 -2
- package/components/color-picker/index.js +3 -8
- package/components/{color-picker-C4pvkA2k.cjs → color-picker-BAikpqUT.cjs} +2 -2
- package/components/{color-picker-DF3gBQvH.js → color-picker-CSuAPo5X.js} +6 -5
- package/components/color-slider/index.cjs +2 -2
- package/components/color-slider/index.js +3 -8
- package/components/{color-slider-DejvUYrW.js → color-slider-0JzdSRTy.js} +3 -2
- package/components/color-slider-CMW8gJ0Z.cjs +57 -0
- package/components/condition-attribute-with-id-BdnTdWKz.js +1 -1
- package/components/condition-attribute-with-id-Cw92IbcP.cjs +1 -1
- package/components/date-range-picker/index.cjs +2 -2
- package/components/date-range-picker/index.js +3 -8
- package/components/date-range-picker-D149LIGC.cjs +180 -0
- package/components/{date-range-picker-DCOv5PYH.js → date-range-picker-DKVmGpUC.js} +7 -6
- package/components/date-time-picker/index.cjs +2 -2
- package/components/date-time-picker/index.js +3 -8
- package/components/{date-time-picker-ClgATXBy.js → date-time-picker-6c19YzwF.js} +7 -6
- package/components/date-time-picker-CRpvRk9T.cjs +105 -0
- package/components/decorate-CkCg3wfh.js +1 -1
- package/components/decorate-Dq34MBGe.cjs +1 -1
- package/components/dependency-manger-BSaHw9ju.cjs +1 -1
- package/components/dependency-manger-wHEXoU92.js +1 -1
- package/components/divider/index.cjs +2 -2
- package/components/divider/index.js +3 -8
- package/components/divider-BcE8D-pH.cjs +18 -0
- package/components/{divider-CGbT-CL8.js → divider-Cz5nyvP9.js} +2 -1
- package/components/divider.module-BV6tmpOY.cjs +1 -1
- package/components/divider.module-CPEKsaqR.js +1 -1
- package/components/element-resolution-BjaAlqwX.cjs +1 -1
- package/components/element-resolution-gap51AVo.js +1 -1
- package/components/field-group/index.cjs +2 -2
- package/components/field-group/index.js +2 -7
- package/components/field-group-C_kRq7pJ.js +1 -1
- package/components/field-group-Dd5xYczm.cjs +1 -1
- package/components/field-label/index.cjs +2 -2
- package/components/field-label/index.js +3 -11
- package/components/field-label-C0vfY1b6.cjs +25 -0
- package/components/{field-label-B9S41b7c.js → field-label-C28wWqC5.js} +5 -2
- package/components/focus-group-C8lOjbi9.cjs +1 -1
- package/components/focus-group-DVPa1zxz.js +1 -1
- package/components/focus-visible-Bt2uDmuM.js +1 -1
- package/components/focus-visible-DNHNlrty.cjs +1 -1
- package/components/focusable-B6h03pAe.cjs +1 -1
- package/components/focusable-DuP0-Kuy.js +1 -1
- package/components/focusable-selectors-BWpiuXz5.js +1 -1
- package/components/focusable-selectors-DJqGLTJo.cjs +1 -1
- package/components/get-label-from-slot-Bo9mqYCZ.js +1 -1
- package/components/get-label-from-slot-TV4APBYs.cjs +1 -1
- package/components/icon/index.cjs +2 -2
- package/components/icon/index.js +3 -8
- package/components/{icon-DB1DRieA.js → icon-CsJZMhIm.js} +2 -1
- package/components/icon-zOPAWCdx.cjs +18 -0
- package/components/index.cjs +2 -2
- package/components/index.js +64 -75
- package/components/infield-button/index.cjs +2 -2
- package/components/infield-button/index.js +3 -8
- package/components/{infield-button-C1mz69Qf.js → infield-button-DiE8R6ol.js} +2 -1
- package/components/infield-button-kilVRjwB.cjs +22 -0
- package/components/label/index.cjs +2 -2
- package/components/label/index.js +3 -8
- package/components/{label-DPG13Ib0.cjs → label-B3zs6OX0.cjs} +2 -2
- package/components/{label-B1HYQ4Pp.js → label-e6Y13vrS.js} +2 -1
- package/components/language-resolution-BaKYDD1a.js +1 -1
- package/components/language-resolution-CSjktYg5.cjs +1 -1
- package/components/like-anchor-BX4PSB3d.cjs +1 -1
- package/components/like-anchor-DXCaEv7O.js +1 -1
- package/components/manage-help-text-ByLb0QYX.js +1 -1
- package/components/manage-help-text-DtFJsl0k.cjs +1 -1
- package/components/menu/index.cjs +2 -2
- package/components/menu/index.js +3 -8
- package/components/{menu-Cq7BEv5Y.cjs → menu-CrhA2iPZ.cjs} +3 -3
- package/components/{menu-DY8q8qyn.js → menu-fdJseu1y.js} +3 -2
- package/components/multi-language-field/index.cjs +2 -2
- package/components/multi-language-field/index.js +3 -8
- package/components/{multi-language-field-Cfy3M_ZS.cjs → multi-language-field-BndVikur.cjs} +2 -2
- package/components/{multi-language-field-DhQ98r2D.js → multi-language-field-vJMK-osi.js} +3 -2
- package/components/notice/index.cjs +2 -2
- package/components/notice/index.js +3 -8
- package/components/notice-CsWaqcq3.cjs +60 -0
- package/components/{notice-s6QHF_tq.js → notice-N0-lxEf_.js} +4 -3
- package/components/number-field/index.cjs +2 -2
- package/components/number-field/index.js +3 -8
- package/components/{number-field-BqnZS9Gx.js → number-field-DAOy_AvQ.js} +3 -2
- package/components/number-field-xxXgR70l.cjs +57 -0
- package/components/observe-slot-presence-BKY6n06-.js +1 -1
- package/components/observe-slot-presence-CS8pMePk.cjs +1 -1
- package/components/observe-slot-text-CvL-2ey3.cjs +1 -1
- package/components/observe-slot-text-Db8Kx3P-.js +1 -1
- package/components/options/index.cjs +2 -2
- package/components/options/index.js +3 -8
- package/components/options/options.d.ts +1 -0
- package/components/{options-Bd6Uly5_.cjs → options-CP9V2CSJ.cjs} +2 -2
- package/components/{options-CpaaBaxn.js → options-D_ifU0DH.js} +4 -2
- package/components/overlay/index.cjs +2 -2
- package/components/overlay/index.js +4 -10
- package/components/overlay/placement-controller.d.ts +2 -1
- package/components/overlay-Dn7EbA_W.cjs +102 -0
- package/components/{overlay-CyBsHuOL.js → overlay-DpHIYJtd.js} +282 -77
- package/components/{pending-state-a527YMWV.cjs → pending-state-CGHvTtKR.cjs} +2 -2
- package/components/{pending-state-BeG7qBDP.js → pending-state-D_b45qvi.js} +2 -2
- package/components/picker/index.cjs +2 -2
- package/components/picker/index.js +3 -8
- package/components/picker-BliQJlY_.cjs +124 -0
- package/components/{picker-f4fSGZX8.js → picker-D0fMBZLb.js} +6 -6
- package/components/picker-button/index.cjs +2 -2
- package/components/picker-button/index.js +3 -8
- package/components/picker-button-B8Jbf9jK.cjs +37 -0
- package/components/{picker-button-DVzLeTq8.js → picker-button-CJQJshbo.js} +3 -2
- package/components/platform-BAjeJp2W.cjs +1 -1
- package/components/platform-Ce9pNsR9.js +1 -1
- package/components/popover/index.cjs +2 -2
- package/components/popover/index.js +3 -11
- package/components/popover-BsdqkvKI.cjs +30 -0
- package/components/{popover-DTsrgH-f.js → popover-DC8tkee-.js} +17 -15
- package/components/progress-bar/index.cjs +2 -2
- package/components/progress-bar/index.js +3 -8
- package/components/progress-bar-CrodWzcc.cjs +34 -0
- package/components/{progress-bar-BJO8j1aX.js → progress-bar-D4iFHkp7.js} +2 -1
- package/components/progress-circle/index.cjs +2 -2
- package/components/progress-circle/index.js +3 -11
- package/components/{progress-circle-BVToDWX8.js → progress-circle-By6qUQYe.js} +5 -2
- package/components/progress-circle-bO_VAX3N.cjs +33 -0
- package/components/progress-steps/index.cjs +2 -2
- package/components/progress-steps/index.d.ts +2 -1
- package/components/progress-steps/index.js +4 -9
- package/components/progress-steps/progress-steps-model.d.ts +23 -0
- package/components/progress-steps/progress-steps.d.ts +82 -109
- package/components/progress-steps/types.d.ts +18 -3
- package/components/progress-steps-Y-Tgh_fQ.cjs +98 -0
- package/components/progress-steps-ohguJaPa.js +368 -0
- package/components/prompt-box/index.cjs +2 -2
- package/components/prompt-box/index.js +3 -8
- package/components/{prompt-box-BY1xKFZO.js → prompt-box-Cz_m2wso.js} +8 -8
- package/components/{prompt-box-Dg9S0C5x.cjs → prompt-box-sp9_-Hnx.cjs} +3 -3
- package/components/question-box/index.cjs +2 -2
- package/components/question-box/index.js +3 -8
- package/components/{question-box-CZxQTeS9.cjs → question-box-Bdtsgv1k.cjs} +2 -2
- package/components/{question-box-CyojSIop.js → question-box-D7YSi_6c.js} +9 -8
- package/components/radio/index.cjs +2 -2
- package/components/radio/index.js +3 -8
- package/components/{radio-DRI4on-W.js → radio-B6hX9Klr.js} +2 -1
- package/components/radio-CRTfoEX_.cjs +22 -0
- package/components/random-id-BcUJAxUZ.cjs +1 -1
- package/components/random-id-CiMDyX7v.js +1 -1
- package/components/rolldown-runtime-Dy4uBu1J.js +1 -1
- package/components/roving-tabindex-BoPao4td.cjs +1 -1
- package/components/roving-tabindex-pomAn3z-.js +1 -1
- package/components/scaled-indicator-C-TupV4L.js +1 -1
- package/components/scaled-indicator-DLJIztx0.cjs +1 -1
- package/components/search/index.cjs +2 -2
- package/components/search/index.js +3 -8
- package/components/{search-C-EPZmTG.js → search-DEjLSJ96.js} +4 -3
- package/components/search-PxJEuwHt.cjs +47 -0
- package/components/segments-factory-BCRi1NKb.js +1 -1
- package/components/segments-factory-DtPyN5sh.cjs +1 -1
- package/components/select/index.cjs +2 -2
- package/components/select/index.js +3 -8
- package/components/{select-BbFG38ag.js → select-BUgHi69P.js} +9 -8
- package/components/select-DsGVB01K.cjs +158 -0
- package/components/sized-mixin-BT7cv-fT.cjs +1 -1
- package/components/sized-mixin-DzQTebN-.js +1 -1
- package/components/skeleton-loader/index.cjs +2 -2
- package/components/skeleton-loader/index.js +3 -8
- package/components/{skeleton-loader-C0LH3prK.js → skeleton-loader-BeCsYADg.js} +2 -1
- package/components/skeleton-loader-CNcwCh4V.cjs +18 -0
- package/components/slider/index.cjs +2 -2
- package/components/slider/index.js +3 -8
- package/components/{slider-B7QAhDTM.js → slider-Bsl8Xrme.js} +3 -2
- package/components/{slider-DxliwjT6.cjs → slider-C_8pSK4N.cjs} +2 -2
- package/components/slottable-request-event-C6eb7Ch3.cjs +1 -1
- package/components/slottable-request-event-MRSZbgTu.js +1 -1
- package/components/split-view/index.cjs +2 -2
- package/components/split-view/index.js +3 -8
- package/components/split-view-BwCFYey6.cjs +43 -0
- package/components/{split-view-FxpiSCem.js → split-view-CDwHDmII.js} +2 -1
- package/components/status-light/index.cjs +2 -2
- package/components/status-light/index.js +3 -8
- package/components/status-light-D3hdx8Pd.cjs +21 -0
- package/components/{status-light-DC8qqO8q.js → status-light-DwUnjE3t.js} +2 -1
- package/components/strategies-BwNbUXYS.cjs +1 -1
- package/components/strategies-Cl59wdNZ.js +1 -1
- package/components/streaming-listener-Bfyk6Fsx.cjs +1 -1
- package/components/streaming-listener-CtcMpYfS.js +1 -1
- package/components/swatch/index.cjs +2 -2
- package/components/swatch/index.js +3 -8
- package/components/{swatch-C2ty27bJ.js → swatch-Bj2FARl1.js} +2 -1
- package/components/{swatch-DUmBmg4S.cjs → swatch-CQ0inIHK.cjs} +2 -2
- package/components/switch/index.cjs +2 -2
- package/components/switch/index.js +3 -8
- package/components/{switch-DOuXlFwI.js → switch-CpG-hSWY.js} +2 -1
- package/components/switch-qwpYXVnO.cjs +22 -0
- package/components/tabs/index.cjs +2 -2
- package/components/tabs/index.js +3 -8
- package/components/{tabs-CjY4eX9W.js → tabs-BD_ATrBg.js} +4 -3
- package/components/{tabs-ZwcVrVub.cjs → tabs-DxOD4QNt.cjs} +2 -2
- package/components/tags/index.cjs +2 -2
- package/components/tags/index.js +3 -8
- package/components/{tags-BCKNzEaH.js → tags-BIpFgOYy.js} +4 -3
- package/components/tags-fLCGajv_.cjs +47 -0
- package/components/text-field/index.cjs +2 -2
- package/components/text-field/index.js +3 -8
- package/components/text-field-3fDtTQkR.cjs +1 -1
- package/components/text-field-CbN4nydd.cjs +21 -0
- package/components/text-field-CmSym2QK.js +1 -1
- package/components/{text-field-C2MHZbTp.js → text-field-CmyqQxq0.js} +2 -1
- package/components/text-field.module-BHhBReKL.js +1 -1
- package/components/text-field.module-l8CaTCwE.cjs +1 -1
- package/components/toast/index.cjs +2 -2
- package/components/toast/index.js +3 -8
- package/components/toast-DRrGgznK.cjs +51 -0
- package/components/{toast-DlOeMDCI.js → toast-KwHx-agn.js} +3 -2
- package/components/tokens.cjs +18 -0
- package/components/tokens.css +18 -0
- package/components/tokens.js +23 -0
- package/components/tooltip/index.cjs +2 -2
- package/components/tooltip/index.js +3 -8
- package/components/tooltip-DjOW52n2.cjs +45 -0
- package/components/{tooltip-Byl1h4nN.js → tooltip-xTa9Q5JW.js} +2 -1
- package/components/top-nav/index.cjs +2 -2
- package/components/top-nav/index.js +3 -8
- package/components/top-nav-81IKEGjR.cjs +41 -0
- package/components/{top-nav-B9YKdtFB.js → top-nav-CXjnpdFR.js} +2 -1
- package/components/utils.cjs +1 -1
- package/components/utils.js +1 -1
- package/components/voice-recorder-B1tBrGTV.cjs +1 -1
- package/components/voice-recorder-CTg3kRxx.js +1 -1
- package/custom-elements.json +1 -1
- package/package.json +11 -2
- package/standalone/accordion.js +45 -0
- package/standalone/action-bar.js +41 -0
- package/standalone/action-button.js +20 -0
- package/standalone/action-group.js +20 -0
- package/standalone/action-menu.js +58 -0
- package/standalone/avatar.js +36 -0
- package/standalone/badge.js +20 -0
- package/standalone/button-group.js +20 -0
- package/standalone/button.js +20 -0
- package/standalone/calendar.js +20 -0
- package/standalone/chat-message-group.js +26 -0
- package/standalone/chat-message.js +150 -0
- package/standalone/checkbox.js +20 -0
- package/standalone/chunks/NumberFormatter-DMCfW685.js +2 -0
- package/standalone/chunks/NumberParser-r_jv94LA.js +2 -0
- package/standalone/chunks/action-button-BzzPBqt5.js +6 -0
- package/standalone/chunks/action-group-DTxf-0tP.js +4 -0
- package/standalone/chunks/async-directive-BA2_dM-5.js +2 -0
- package/standalone/chunks/async-directive-CPdA0BOw.js +2 -0
- package/standalone/chunks/badge-DD-tMgzi.js +7 -0
- package/standalone/chunks/button-Bv3v7VbN.js +4 -0
- package/standalone/chunks/button-Dykw3TSO.js +2 -0
- package/standalone/chunks/button-base-C7jeeyLp.js +9 -0
- package/standalone/chunks/calendar-ZwUYkzVq.js +122 -0
- package/standalone/chunks/checkbox-OQtakoP8.js +9 -0
- package/standalone/chunks/checkbox-mixin-BAQWmwps.js +11 -0
- package/standalone/chunks/class-map-CxQ0PcQP.js +2 -0
- package/standalone/chunks/clear-button-pVGfwye8.js +2 -0
- package/standalone/chunks/close-button-RpPiwBdf.js +2 -0
- package/standalone/chunks/color-area-Cj8oPsIF.js +64 -0
- package/standalone/chunks/color-controller-fJNWRHVI.js +2 -0
- package/standalone/chunks/color-field-CrCF4kqZ.js +7 -0
- package/standalone/chunks/color-handle-BHrAxEG2.js +8 -0
- package/standalone/chunks/color-loupe-C34cms5t.js +40 -0
- package/standalone/chunks/color-menu-B5UOMYmX.js +73 -0
- package/standalone/chunks/color-slider-CAqvxsgS.js +41 -0
- package/standalone/chunks/condition-attribute-with-id-Dv8Yd-N1.js +2 -0
- package/standalone/chunks/dependency-manger-BPrqqTnJ.js +2 -0
- package/standalone/chunks/directive-Du_3lDov.js +2 -0
- package/standalone/chunks/directive-helpers-Bu8icI7Y.js +2 -0
- package/standalone/chunks/divider-Bf9Drp2z.js +2 -0
- package/standalone/chunks/divider.module-sYekRHno.js +2 -0
- package/standalone/chunks/element-resolution-DX0ea-Cd.js +2 -0
- package/standalone/chunks/field-group-D8EjgC6F.js +7 -0
- package/standalone/chunks/field-label-VWHDlW9_.js +9 -0
- package/standalone/chunks/flow-aCcJ5kgi.js +2 -0
- package/standalone/chunks/focus-group-Cl6MLy-C.js +2 -0
- package/standalone/chunks/focusable-selectors-D5e0OxNL.js +2 -0
- package/standalone/chunks/get-label-from-slot-Dfoiptqo.js +2 -0
- package/standalone/chunks/icon-Dy6J1QeX.js +2 -0
- package/{components/infield-button-CYO9V1eX.cjs → standalone/chunks/infield-button-D03MpU_s.js} +3 -19
- package/standalone/chunks/keyed-CNWmQd2J.js +2 -0
- package/standalone/chunks/language-resolution-BWHk9A73.js +2 -0
- package/standalone/chunks/lit-BN_lRQbJ.js +3 -0
- package/standalone/chunks/lucero-runtime-DGJ9-isg.js +16 -0
- package/standalone/chunks/luzmo-icons-CJa-aByT.js +13 -0
- package/standalone/chunks/manage-help-text-Cl9OJ2xf.js +14 -0
- package/standalone/chunks/menu-nolJetlp.js +92 -0
- package/standalone/chunks/number-field-C3DYfl1s.js +41 -0
- package/standalone/chunks/observe-slot-presence-DWPtw22K.js +2 -0
- package/standalone/chunks/options-BjRSj630.js +89 -0
- package/standalone/chunks/overlay-C4ir0iyC.js +31 -0
- package/standalone/chunks/overlay-C_XW8yry.js +57 -0
- package/standalone/chunks/pending-state-DxeRqe6Q.js +11 -0
- package/standalone/chunks/picker-button-BeXTIgUt.js +21 -0
- package/standalone/chunks/picker-hbMQOkUX.js +108 -0
- package/standalone/chunks/platform-BfrBbd97.js +2 -0
- package/standalone/chunks/popover-BsB3dmQe.js +14 -0
- package/standalone/chunks/progress-circle-CEx1b5Sv.js +17 -0
- package/standalone/chunks/property-CLXrnTGx.js +2 -0
- package/standalone/chunks/radio-2vHhfmHw.js +6 -0
- package/standalone/chunks/random-id-CeLe5NEk.js +2 -0
- package/standalone/chunks/repeat-CZdNcszA.js +2 -0
- package/standalone/chunks/rolldown-runtime-DWK5is8u.js +2 -0
- package/standalone/chunks/roving-tabindex-CB4xC55P.js +2 -0
- package/standalone/chunks/scaled-indicator-k-1JmS0b.js +10 -0
- package/standalone/chunks/segments-factory-Ch3AAizU.js +2 -0
- package/standalone/chunks/skeleton-loader-BxYcRRJr.js +2 -0
- package/standalone/chunks/slottable-request-event-D9FhiqH1.js +2 -0
- package/standalone/chunks/strategies-kad_0dTB.js +2 -0
- package/standalone/chunks/streaming-listener-DFczLm8I.js +2 -0
- package/standalone/chunks/style-map-D4QeV3m0.js +2 -0
- package/standalone/chunks/swatch-m_4GcO2_.js +33 -0
- package/standalone/chunks/text-field-BnZtyodU.js +5 -0
- package/standalone/chunks/text-field-BrlDeJsx.js +65 -0
- package/standalone/chunks/text-field.module-ClDE7laI.js +2 -0
- package/standalone/chunks/tooltip-DB6jRVyB.js +29 -0
- package/standalone/chunks/unsafe-html-BPQaWy0v.js +2 -0
- package/standalone/chunks/voice-recorder--d34tYNu.js +2 -0
- package/standalone/chunks/when-BWvpqCBs.js +2 -0
- package/standalone/clear-button.js +20 -0
- package/standalone/close-button.js +20 -0
- package/standalone/color-area.js +20 -0
- package/standalone/color-field.js +20 -0
- package/standalone/color-handle.js +20 -0
- package/standalone/color-loupe.js +20 -0
- package/standalone/color-menu.js +20 -0
- package/standalone/color-palette-group.js +30 -0
- package/standalone/color-palette.js +20 -0
- package/standalone/color-picker.js +50 -0
- package/standalone/color-slider.js +20 -0
- package/standalone/date-range-picker.js +182 -0
- package/standalone/date-time-picker.js +107 -0
- package/standalone/divider.js +20 -0
- package/standalone/field-group.js +20 -0
- package/standalone/field-label.js +20 -0
- package/standalone/icon.js +20 -0
- package/standalone/infield-button.js +20 -0
- package/standalone/label.js +20 -0
- package/standalone/lit.js +20 -0
- package/standalone/manifest.json +152 -0
- package/standalone/menu.js +20 -0
- package/standalone/multi-language-field.js +42 -0
- package/standalone/notice.js +62 -0
- package/standalone/number-field.js +20 -0
- package/standalone/options.js +20 -0
- package/standalone/overlay.js +20 -0
- package/standalone/picker-button.js +20 -0
- package/standalone/picker.js +20 -0
- package/standalone/popover.js +20 -0
- package/standalone/progress-bar.js +36 -0
- package/standalone/progress-circle.js +20 -0
- package/standalone/progress-steps.js +100 -0
- package/standalone/prompt-box.js +316 -0
- package/standalone/question-box.js +403 -0
- package/standalone/radio.js +20 -0
- package/standalone/search.js +49 -0
- package/standalone/select.js +160 -0
- package/standalone/skeleton-loader.js +20 -0
- package/standalone/slider.js +137 -0
- package/standalone/split-view.js +45 -0
- package/standalone/status-light.js +23 -0
- package/standalone/swatch.js +20 -0
- package/standalone/switch.js +24 -0
- package/standalone/tabs.js +78 -0
- package/standalone/tags.js +49 -0
- package/standalone/text-field.js +20 -0
- package/standalone/toast.js +53 -0
- package/standalone/tokens.css +1 -0
- package/standalone/tokens.js +20 -0
- package/standalone/tooltip.js +20 -0
- package/standalone/top-nav.js +43 -0
- package/standalone/utils.js +20 -0
- package/styles/tokens.d.ts +1 -0
- package/utils/reactive-controllers/pending-state.d.ts +1 -1
- package/components/action-bar-CXT4lT30.cjs +0 -39
- package/components/action-button-BKnzGQR6.cjs +0 -22
- package/components/action-group-D1G30Iir.cjs +0 -20
- package/components/avatar-Cu9c0sCS.cjs +0 -34
- package/components/badge-XJP3sZhB.cjs +0 -23
- package/components/button-group-6M8M-TUI.cjs +0 -18
- package/components/button-l0fRopSN.cjs +0 -20
- package/components/calendar-DZkKMs2L.cjs +0 -138
- package/components/chat-message-group-CzCwyW7F.cjs +0 -24
- package/components/chat-message-t4a0r3R6.cjs +0 -148
- package/components/checkbox-DdatW4xE.cjs +0 -25
- package/components/color-area-B_pRu9Vf.cjs +0 -80
- package/components/color-handle-DIoVrLRF.cjs +0 -24
- package/components/color-loupe-sY1wOisV.cjs +0 -56
- package/components/color-menu-CdETqhbP.cjs +0 -89
- package/components/color-palette-CidHsmE0.cjs +0 -18
- package/components/color-palette-group-B4r4tPfY.cjs +0 -28
- package/components/color-slider-DLEM1nGA.cjs +0 -57
- package/components/date-range-picker-9ioTuDZq.cjs +0 -180
- package/components/date-time-picker-DRjQTyGS.cjs +0 -105
- package/components/divider-wana0uPI.cjs +0 -18
- package/components/field-label-C5vdJ1ys.cjs +0 -25
- package/components/icon-CSqR-OOO.cjs +0 -18
- package/components/notice-xgrLOiC0.cjs +0 -60
- package/components/number-field-04RFqrUa.cjs +0 -57
- package/components/overlay-B-gaxspw.cjs +0 -47
- package/components/overlay-CPZvL0Ic.cjs +0 -73
- package/components/overlay-DdIs4w5M.js +0 -227
- package/components/picker-D225VAbx.cjs +0 -124
- package/components/picker-button-BR7oM7_M.cjs +0 -37
- package/components/popover-DWWYpY-k.cjs +0 -30
- package/components/progress-bar-C7wJ5bxS.cjs +0 -34
- package/components/progress-circle-DyApSKdm.cjs +0 -33
- package/components/progress-steps-Ba4VbAKR.cjs +0 -96
- package/components/progress-steps-nJ8Xw-nG.js +0 -262
- package/components/radio-O3a1rmCe.cjs +0 -22
- package/components/search-BhMhfCBh.cjs +0 -47
- package/components/select-D5fQgPPj.cjs +0 -158
- package/components/skeleton-loader-Cm50Ztzk.cjs +0 -18
- package/components/split-view-5uMSU_b7.cjs +0 -43
- package/components/status-light-BYBYorYy.cjs +0 -21
- package/components/switch-B-gu-War.cjs +0 -22
- package/components/tags-B28zWEic.cjs +0 -47
- package/components/text-field-wJK2bzMT.cjs +0 -21
- package/components/toast-COQ7Xl5T.cjs +0 -51
- package/components/tooltip-Sm0pruxL.cjs +0 -45
- package/components/top-nav-BcZLCBP_.cjs +0 -41
|
@@ -1,34 +0,0 @@
|
|
|
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("./get-label-from-slot-TV4APBYs.cjs");let r=require("lit"),i=require("lit/decorators.js");var a=`:host{--progress-bar-size:240px;--progress-bar-animation-duration:1.5s;inline-size:var(--luzmo-progress-bar-size,var(--progress-bar-size));min-inline-size:var(--luzmo-progress-bar-min-size,var(--progress-bar-min-size));vertical-align:top;flex-flow:wrap;justify-content:space-between;align-items:center;display:inline-flex;position:relative}slot:not([name]){display:none}.label,.percentage{font-family:var(--luzmo-progress-bar-font-family,var(--progress-bar-font-family));font-size:var(--luzmo-progress-bar-font-size,var(--progress-bar-font-size));line-height:var(--luzmo-progress-bar-line-height,var(--progress-bar-line-height));color:var(--luzmo-progress-bar-text-color,var(--progress-bar-text-color));margin-block-end:var(--luzmo-progress-bar-label-spacing,var(--progress-bar-label-spacing))}.label{text-align:start;flex:1}.percentage{text-align:end;align-self:flex-start;margin-inline-start:var(--luzmo-progress-bar-label-spacing,var(--progress-bar-label-spacing))}::slotted([slot=value]){font-family:var(--luzmo-progress-bar-font-family,var(--progress-bar-font-family));font-size:var(--luzmo-progress-bar-font-size,var(--progress-bar-font-size));line-height:var(--luzmo-progress-bar-line-height,var(--progress-bar-line-height));color:var(--luzmo-progress-bar-text-color,var(--progress-bar-text-color))}.track{inline-size:100%;block-size:var(--luzmo-progress-bar-thickness,var(--progress-bar-thickness));background:var(--highcontrast-progress-bar-track-border-color,var(--luzmo-progress-bar-track-color,var(--progress-bar-track-color)));border-radius:var(--luzmo-progress-bar-border-radius,var(--progress-bar-border-radius));overflow:hidden}.fill{block-size:var(--luzmo-progress-bar-thickness,var(--progress-bar-thickness));background:var(--highcontrast-progress-bar-fill-color,var(--luzmo-progress-bar-fill-color,var(--progress-bar-fill-color)));border-radius:var(--luzmo-progress-bar-border-radius,var(--progress-bar-border-radius));transition:width var(--luzmo-progress-bar-fill-transition-duration,var(--progress-bar-fill-transition-duration));border:none}:host([indeterminate]) .fill{inline-size:33%;animation-name:indeterminate-loop-ltr;animation-duration:var(--luzmo-progress-bar-animation-duration,var(--progress-bar-animation-duration));will-change:transform;transition:none;animation-timing-function:cubic-bezier(.65,0,.35,1);animation-iteration-count:infinite;position:relative}@keyframes indeterminate-loop-ltr{0%{transform:translate(-100%)}to{transform:translateX(calc(var(--luzmo-progress-bar-size,var(--progress-bar-size))))}}:host([side-label]){flex-flow:row;align-items:center}:host([side-label]) .track{flex:1 1 var(--luzmo-progress-bar-size,var(--progress-bar-size))}:host([side-label]) .label{flex-grow:0;margin-block-end:0;margin-inline-end:var(--luzmo-progress-bar-label-spacing,var(--progress-bar-label-spacing))}:host([side-label]) .percentage{text-align:end;order:3;margin-block-end:0;margin-inline-start:var(--luzmo-progress-bar-label-spacing,var(--progress-bar-label-spacing))}:host([side-label]:not([hide-value])) .percentage{order:3;margin-block-end:0;margin-inline-start:var(--luzmo-progress-bar-label-spacing,var(--progress-bar-label-spacing))}:host([static-color=white]) .fill{background:var(--luzmo-progress-bar-fill-color-over-background,#fff)}:host([static-color=white]) .track{background:var(--luzmo-progress-bar-track-color-over-background,#ffffff26)}:host([static-color=white]) .label,:host([static-color=white]) .percentage{color:var(--luzmo-progress-bar-text-color-over-background,#fff)}:host([static-color=black]) .fill{background:var(--luzmo-progress-bar-fill-color-over-background,#000)}:host([static-color=black]) .track{background:var(--luzmo-progress-bar-track-color-over-background,#00000040)}:host([static-color=black]) .label,:host([static-color=black]) .percentage{color:var(--luzmo-progress-bar-text-color-over-background,#000)}@media (forced-colors:active){.track{--highcontrast-progress-bar-track-border-color:ButtonFace;--highcontrast-progress-bar-fill-color:Highlight;forced-color-adjust:none;border:1px solid buttontext}}:host{--progress-bar-min-size:var(--luzmo-component-height-xl);--progress-bar-thickness:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--progress-bar-border-radius:var(--luzmo-spacing-1);--progress-bar-font-family:var(--luzmo-font-family);--progress-bar-font-size:var(--luzmo-font-size-m);--progress-bar-line-height:var(--luzmo-line-height);--progress-bar-label-spacing:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--progress-bar-text-color:var(--luzmo-font-color);--progress-bar-track-color:var(--luzmo-border-color);--progress-bar-fill-color:var(--luzmo-primary);--progress-bar-fill-transition-duration:var(--luzmo-animation-duration)}:host([size=xs]){--progress-bar-thickness:var(--luzmo-spacing-1);--progress-bar-font-size:var(--luzmo-font-size-xs)}:host([size=s]){--progress-bar-thickness:var(--luzmo-spacing-2);--progress-bar-font-size:var(--luzmo-font-size-s)}:host([size=l]){--progress-bar-thickness:var(--luzmo-spacing-3);--progress-bar-font-size:var(--luzmo-font-size-l)}:host([size=xl]){--progress-bar-thickness:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-2));--progress-bar-font-size:var(--luzmo-font-size-xl)}:host([variant=positive]){--progress-bar-fill-color:var(--luzmo-positive-color)}:host([variant=notice]){--progress-bar-fill-color:var(--luzmo-notice-color)}:host([variant=negative]){--progress-bar-fill-color:var(--luzmo-negative-color)}`,o=class extends t.n(e.n,{validSizes:[`xs`,`s`,`m`,`l`,`xl`]}){constructor(...e){super(...e),this.indeterminate=!1,this.label=``,this.progress=0,this.sideLabel=!1,this.hideValue=!1,this.valueLabel=``,this._variant=``,this._hasValueSlotContent=!1}static get styles(){return[(0,r.unsafeCSS)(a)]}get variant(){return this._variant}set variant(e){if(e!==this.variant){if([`positive`,`notice`,`negative`].includes(e)){this.setAttribute(`variant`,e),this._variant=e;return}this.removeAttribute(`variant`),this._variant=``}}get _valueText(){let e=Math.max(0,Math.min(100,this.progress));return this.valueLabel||`${e}%`}render(){let e=Math.max(0,Math.min(100,this.progress));return r.html`
|
|
19
|
-
<slot @slotchange=${this.handleSlotchange}></slot>
|
|
20
|
-
${this.label?r.html`<span class="label">${this.label}</span>`:r.nothing}
|
|
21
|
-
${!this.indeterminate&&!this.hideValue?r.html`<span class="percentage">
|
|
22
|
-
<slot
|
|
23
|
-
name="value"
|
|
24
|
-
@slotchange=${this.handleValueSlotchange}
|
|
25
|
-
></slot>
|
|
26
|
-
${this._hasValueSlotContent?r.nothing:this._valueText}
|
|
27
|
-
</span>`:r.nothing}
|
|
28
|
-
<div class="track">
|
|
29
|
-
<div
|
|
30
|
-
class="fill"
|
|
31
|
-
style=${this.indeterminate?``:`width: ${e}%;`}
|
|
32
|
-
></div>
|
|
33
|
-
</div>
|
|
34
|
-
`}handleSlotchange(){let e=n.t(this.label,this.slotEl);e&&(this.label=e)}handleValueSlotchange(e){let t=e.target;this._hasValueSlotContent=t.assignedNodes().length>0,this.requestUpdate()}firstUpdated(e){super.firstUpdated(e),this.hasAttribute(`role`)||this.setAttribute(`role`,`progressbar`)}updated(e){if(super.updated(e),e.has(`indeterminate`))if(this.indeterminate)this.removeAttribute(`aria-valuemin`),this.removeAttribute(`aria-valuemax`),this.removeAttribute(`aria-valuenow`),this.removeAttribute(`aria-valuetext`);else{let e=Math.max(0,Math.min(100,this.progress));this.setAttribute(`aria-valuemin`,`0`),this.setAttribute(`aria-valuemax`,`100`),this.setAttribute(`aria-valuenow`,``+e),this.valueLabel&&this.setAttribute(`aria-valuetext`,this.valueLabel)}if(!this.indeterminate&&e.has(`progress`)){let e=Math.max(0,Math.min(100,this.progress));this.setAttribute(`aria-valuenow`,``+e)}!this.indeterminate&&e.has(`valueLabel`)&&(this.valueLabel?this.setAttribute(`aria-valuetext`,this.valueLabel):this.removeAttribute(`aria-valuetext`)),(e.has(`label`)||e.has(`progress`)||e.has(`valueLabel`))&&(this.label.length>0?this.setAttribute(`aria-label`,this.label):(!this.getAttribute(`aria-label`)||e.has(`label`))&&this.setAttribute(`aria-label`,this._valueText))}};e.t([(0,i.property)({type:Boolean,reflect:!0})],o.prototype,`indeterminate`,void 0),e.t([(0,i.property)({type:String})],o.prototype,`label`,void 0),e.t([(0,i.property)({type:Number})],o.prototype,`progress`,void 0),e.t([(0,i.property)({reflect:!0,attribute:`static-color`})],o.prototype,`staticColor`,void 0),e.t([(0,i.property)({type:Boolean,reflect:!0,attribute:`side-label`})],o.prototype,`sideLabel`,void 0),e.t([(0,i.property)({type:Boolean,reflect:!0,attribute:`hide-value`})],o.prototype,`hideValue`,void 0),e.t([(0,i.property)({type:String,attribute:`value-label`})],o.prototype,`valueLabel`,void 0),e.t([(0,i.property)({type:String})],o.prototype,`variant`,null),e.t([(0,i.query)(`slot:not([name])`)],o.prototype,`slotEl`,void 0),customElements.get(`luzmo-progress-bar`)||customElements.define(`luzmo-progress-bar`,o),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return o}});
|
|
@@ -1,33 +0,0 @@
|
|
|
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("./get-label-from-slot-TV4APBYs.cjs");let r=require("lit"),i=require("lit/decorators.js"),a=require("lit/directives/if-defined.js");var o=`@media (forced-colors:active){:host{--highcontrast-progress-circle-fill-border-color:Highlight;--highcontrast-progress-circle-fill-border-color-over-background:Highlight}.track{--progress-circle-track-border-style:double}}:host{position:var(--luzmo-progress-circle-position,relative);direction:ltr;display:inline-block;position:relative;transform:translateZ(0)}:host,.track{inline-size:var(--luzmo-progress-circle-size,var(--progress-circle-size,32px));block-size:var(--luzmo-progress-circle-size,var(--progress-circle-size,32px))}.track{box-sizing:border-box;border-style:var(--highcontrast-progress-circle-track-border-style,var(--luzmo-progress-circle-track-border-style,var(--progress-circle-track-border-style,solid)));border-width:var(--luzmo-progress-circle-thickness,var(--progress-circle-thickness,2px));border-radius:var(--luzmo-progress-circle-size,var(--progress-circle-size,32px));border-color:var(--luzmo-progress-circle-track-border-color,var(--luzmo-border-color))}.fills{block-size:100%;inline-size:100%;position:absolute;inset-block-start:0;inset-inline-start:0}.fill{box-sizing:border-box;inline-size:var(--luzmo-progress-circle-size,var(--progress-circle-size,32px));block-size:var(--luzmo-progress-circle-size,var(--progress-circle-size,32px));border-style:solid;border-width:var(--luzmo-progress-circle-thickness,var(--progress-circle-thickness,3px));border-radius:var(--luzmo-progress-circle-size,var(--progress-circle-size,32px));border-color:var(--highcontrast-progress-circle-fill-border-color,var(--luzmo-progress-circle-fill-border-color,var(--luzmo-primary)))}:host([static-color=black]) .track{border-color:var(--luzmo-progress-circle-track-border-color-over-background,#00000040)}:host([static-color=black]) .fill{border-color:var(--highcontrast-progress-circle-fill-border-color-over-background,var(--luzmo-progress-circle-fill-border-color-over-background,#000))}:host([static-color=white]) .track{border-color:var(--luzmo-progress-circle-track-border-color-over-background,#ffffff26)}:host([static-color=white]) .fill{border-color:var(--highcontrast-progress-circle-fill-border-color-over-background,var(--luzmo-progress-circle-fill-border-color-over-background,#fff))}.fill-mask1,.fill-mask2{transform-origin:100%;block-size:100%;inline-size:50%;position:absolute;overflow:hidden;transform:rotate(180deg)}.fill-sub-mask1,.fill-sub-mask2{transform-origin:100%;block-size:100%;inline-size:100%;overflow:hidden;transform:rotate(-180deg)}.fill-mask2{transform:rotate(0)}:host([indeterminate]) .fills{will-change:transform;transform-origin:50%;animation:1s cubic-bezier(.25,.78,.48,.89) infinite luzmo-fills-rotate;transform:translateZ(0)}:host([indeterminate]) .fill-sub-mask1{will-change:transform;animation:1s linear infinite luzmo-fill-mask-1;transform:translateZ(0)}:host([indeterminate]) .fill-sub-mask2{will-change:transform;animation:1s linear infinite luzmo-fill-mask-2;transform:translateZ(0)}.fill-submask-2{animation:1s linear infinite luzmo-fill-mask-2}@keyframes luzmo-fill-mask-1{0%{transform:rotate(90deg)}1.69%{transform:rotate(72.3deg)}3.39%{transform:rotate(55.5deg)}5.08%{transform:rotate(40.3deg)}6.78%{transform:rotate(25deg)}8.47%{transform:rotate(10.6deg)}10.17%{transform:rotate(0)}11.86%{transform:rotate(0)}13.56%{transform:rotate(0)}15.25%{transform:rotate(0)}16.95%{transform:rotate(0)}18.64%{transform:rotate(0)}20.34%{transform:rotate(0)}22.03%{transform:rotate(0)}23.73%{transform:rotate(0)}25.42%{transform:rotate(0)}27.12%{transform:rotate(0)}28.81%{transform:rotate(0)}30.51%{transform:rotate(0)}32.2%{transform:rotate(0)}33.9%{transform:rotate(0)}35.59%{transform:rotate(0)}37.29%{transform:rotate(0)}38.98%{transform:rotate(0)}40.68%{transform:rotate(0)}42.37%{transform:rotate(5.3deg)}44.07%{transform:rotate(13.4deg)}45.76%{transform:rotate(20.6deg)}47.46%{transform:rotate(29deg)}49.15%{transform:rotate(36.5deg)}50.85%{transform:rotate(42.6deg)}52.54%{transform:rotate(48.8deg)}54.24%{transform:rotate(54.2deg)}55.93%{transform:rotate(59.4deg)}57.63%{transform:rotate(63.2deg)}59.32%{transform:rotate(67.2deg)}61.02%{transform:rotate(70.8deg)}62.71%{transform:rotate(73.8deg)}64.41%{transform:rotate(76.2deg)}66.1%{transform:rotate(78.7deg)}67.8%{transform:rotate(80.6deg)}69.49%{transform:rotate(82.6deg)}71.19%{transform:rotate(83.7deg)}72.88%{transform:rotate(85deg)}74.58%{transform:rotate(86.3deg)}76.27%{transform:rotate(87deg)}77.97%{transform:rotate(87.7deg)}79.66%{transform:rotate(88.3deg)}81.36%{transform:rotate(88.6deg)}83.05%{transform:rotate(89.2deg)}84.75%{transform:rotate(89.2deg)}86.44%{transform:rotate(89.5deg)}88.14%{transform:rotate(89.9deg)}89.83%{transform:rotate(89.7deg)}91.53%{transform:rotate(90.1deg)}93.22%{transform:rotate(90.2deg)}94.92%{transform:rotate(90.1deg)}96.61%{transform:rotate(90deg)}98.31%{transform:rotate(89.8deg)}to{transform:rotate(90deg)}}@keyframes luzmo-fill-mask-2{0%{transform:rotate(180deg)}1.69%{transform:rotate(180deg)}3.39%{transform:rotate(180deg)}5.08%{transform:rotate(180deg)}6.78%{transform:rotate(180deg)}8.47%{transform:rotate(180deg)}10.17%{transform:rotate(179.2deg)}11.86%{transform:rotate(164deg)}13.56%{transform:rotate(151.8deg)}15.25%{transform:rotate(140.8deg)}16.95%{transform:rotate(130.3deg)}18.64%{transform:rotate(120.4deg)}20.34%{transform:rotate(110.8deg)}22.03%{transform:rotate(101.6deg)}23.73%{transform:rotate(93.5deg)}25.42%{transform:rotate(85.4deg)}27.12%{transform:rotate(78.1deg)}28.81%{transform:rotate(71.2deg)}30.51%{transform:rotate(89.1deg)}32.2%{transform:rotate(105.5deg)}33.9%{transform:rotate(121.3deg)}35.59%{transform:rotate(135.5deg)}37.29%{transform:rotate(148.4deg)}38.98%{transform:rotate(161deg)}40.68%{transform:rotate(173.5deg)}42.37%{transform:rotate(180deg)}44.07%{transform:rotate(180deg)}45.76%{transform:rotate(180deg)}47.46%{transform:rotate(180deg)}49.15%{transform:rotate(180deg)}50.85%{transform:rotate(180deg)}52.54%{transform:rotate(180deg)}54.24%{transform:rotate(180deg)}55.93%{transform:rotate(180deg)}57.63%{transform:rotate(180deg)}59.32%{transform:rotate(180deg)}61.02%{transform:rotate(180deg)}62.71%{transform:rotate(180deg)}64.41%{transform:rotate(180deg)}66.1%{transform:rotate(180deg)}67.8%{transform:rotate(180deg)}69.49%{transform:rotate(180deg)}71.19%{transform:rotate(180deg)}72.88%{transform:rotate(180deg)}74.58%{transform:rotate(180deg)}76.27%{transform:rotate(180deg)}77.97%{transform:rotate(180deg)}79.66%{transform:rotate(180deg)}81.36%{transform:rotate(180deg)}83.05%{transform:rotate(180deg)}84.75%{transform:rotate(180deg)}86.44%{transform:rotate(180deg)}88.14%{transform:rotate(180deg)}89.83%{transform:rotate(180deg)}91.53%{transform:rotate(180deg)}93.22%{transform:rotate(180deg)}94.92%{transform:rotate(180deg)}96.61%{transform:rotate(180deg)}98.31%{transform:rotate(180deg)}to{transform:rotate(180deg)}}@keyframes luzmo-fills-rotate{0%{transform:rotate(-90deg)}to{transform:rotate(270deg)}}:host([size=s]){--progress-circle-size:16px;--progress-circle-thickness:2px}:host([size=l]){--progress-circle-size:48px;--progress-circle-thickness:3px}:host([size=xl]){--progress-circle-size:64px;--progress-circle-thickness:4px}:host{block-size:var(--luzmo-progress-circle-size,var(--parent-element-progress-circle-size));inline-size:var(--luzmo-progress-circle-size,var(--parent-element-progress-circle-size));--progress-circle-size:inherit;--parent-element-progress-circle-size:var(--progress-circle-size,32px)}:host([size=s]){--parent-element-progress-circle-size:var(--progress-circle-size,16px)}:host([size=l]){--parent-element-progress-circle-size:var(--progress-circle-size,48px)}:host([size=xl]){--parent-element-progress-circle-size:var(--progress-circle-size,64px)}slot{display:none}.track,.fill{block-size:var(--luzmo-progress-circle-size,var(--parent-element-progress-circle-size));border-radius:var(--luzmo-progress-circle-size,var(--parent-element-progress-circle-size));inline-size:var(--luzmo-progress-circle-size,var(--parent-element-progress-circle-size))}:host([indeterminate]) .fills,:host([indeterminate]) .fill-sub-mask1,:host([indeterminate]) .fill-sub-mask2{animation-duration:var(--luzmo-progress-circle-animation-duration,1s)}`,s=class extends t.n(e.n,{validSizes:[`s`,`m`,`l`,`xl`]}){constructor(...e){super(...e),this.indeterminate=!1,this.label=``,this.progress=0}static get styles(){return[(0,r.unsafeCSS)(o)]}makeRotation(e){return this.indeterminate?void 0:`transform: rotate(${e}deg);`}render(){let e=[this.makeRotation(-180+180/50*Math.min(this.progress,50)),this.makeRotation(-180+180/50*Math.max(this.progress-50,0))];return r.html`
|
|
19
|
-
<slot @slotchange=${this.handleSlotchange}></slot>
|
|
20
|
-
<div class="track"></div>
|
|
21
|
-
<div class="fills">
|
|
22
|
-
${[`mask1`,`mask2`].map((t,n)=>r.html`
|
|
23
|
-
<div class="fill-${t}">
|
|
24
|
-
<div
|
|
25
|
-
class="fill-sub-${t}"
|
|
26
|
-
style=${(0,a.ifDefined)(e[n])}
|
|
27
|
-
>
|
|
28
|
-
<div class="fill"></div>
|
|
29
|
-
</div>
|
|
30
|
-
</div>
|
|
31
|
-
`)}
|
|
32
|
-
</div>
|
|
33
|
-
`}handleSlotchange(){let e=n.t(this.label,this.slotEl);e&&(this.label=e)}firstUpdated(e){super.firstUpdated(e),this.hasAttribute(`role`)||this.setAttribute(`role`,`progressbar`)}updated(e){super.updated(e),!this.indeterminate&&e.has(`progress`)?this.setAttribute(`aria-valuenow`,``+this.progress):this.hasAttribute(`aria-valuenow`)&&this.removeAttribute(`aria-valuenow`),e.has(`label`)&&(this.label.length>0?this.setAttribute(`aria-label`,this.label):e.get(`label`)===this.getAttribute(`aria-label`)&&this.removeAttribute(`aria-label`))}};e.t([(0,i.property)({type:Boolean,reflect:!0})],s.prototype,`indeterminate`,void 0),e.t([(0,i.property)({type:String})],s.prototype,`label`,void 0),e.t([(0,i.property)({reflect:!0,attribute:`static-color`})],s.prototype,`staticColor`,void 0),e.t([(0,i.property)({type:Number})],s.prototype,`progress`,void 0),e.t([(0,i.query)(`slot`)],s.prototype,`slotEl`,void 0),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return s}});
|
|
@@ -1,96 +0,0 @@
|
|
|
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");let n=require("lit"),r=require("lit/decorators.js"),i=require("@luzmo/icons");var a=`:host{font-family:var(--luzmo-font-family);font-size:var(--luzmo-progress-steps-font-size,var(--progress-steps-font-size));color:var(--luzmo-progress-steps-font-color,var(--progress-steps-font-color));display:block}.progress-steps-container{gap:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));flex-direction:column;display:flex}.step{grid-template-columns:var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) auto;column-gap:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));animation:.3s ease-out forwards stepFadeIn;display:grid;position:relative}.step:not(:last-child):after{content:"";left:calc(var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) / 2);top:var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size));bottom:calc(-1 * var(--luzmo-progress-steps-gap,var(--progress-steps-gap)));background-color:var(--luzmo-progress-steps-substep-connector-color,var(--progress-steps-substep-connector-color));z-index:0;pointer-events:none;width:1px;position:absolute;transform:translate(-.5px)}.step:not(:last-child):has(.substeps-container.expanded):after{height:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));top:auto}.step-header{-webkit-user-select:none;user-select:none;display:contents}.step-header.has-substeps{cursor:pointer}.step-icon{width:var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size));height:var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size));border-radius:var(--luzmo-progress-steps-icon-radius,var(--progress-steps-icon-radius,var(--luzmo-border-radius-l)));flex-shrink:0;grid-column:1;justify-content:center;align-self:center;align-items:center;display:flex;position:relative}.step-icon svg{width:100%;height:100%}.step-header.has-substeps .step-icon{cursor:pointer}.step-icon-pending{color:var(--luzmo-progress-steps-font-color-dimmed,var(--progress-steps-font-color-dimmed))}.step-icon-in-progress{position:relative}.step-dot{width:calc(var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) * .4);height:calc(var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) * .4);background-color:var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color));border-radius:var(--luzmo-progress-steps-icon-radius,var(--progress-steps-icon-radius,var(--luzmo-border-radius-l)));position:relative}.step-dot:after{--progress-steps-pulse-offset-calc:var(--luzmo-progress-steps-pulse-offset,var(--progress-steps-pulse-offset,6px));content:"";top:calc(-1 * var(--progress-steps-pulse-offset-calc));left:calc(-1 * var(--progress-steps-pulse-offset-calc));right:calc(-1 * var(--progress-steps-pulse-offset-calc));bottom:calc(-1 * var(--progress-steps-pulse-offset-calc));border-radius:var(--luzmo-progress-steps-icon-radius,var(--progress-steps-icon-radius,var(--luzmo-border-radius-l)));background-color:var(--luzmo-progress-steps-pulse-color,var(--progress-steps-pulse-color));opacity:0;animation:2s cubic-bezier(.4,0,.6,1) infinite mainStepPulse;position:absolute}.step-icon-completed{color:var(--luzmo-progress-steps-completed-color,var(--progress-steps-completed-color))}.step-icon-error{color:var(--luzmo-progress-steps-error-color,var(--progress-steps-error-color))}.step-content{align-items:center;gap:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));border-radius:var(--luzmo-progress-steps-border-radius,var(--progress-steps-border-radius));flex-direction:row;grid-column:2;align-self:center;min-width:0;display:flex}.step-header.has-substeps .step-content{cursor:pointer}.step-name{font-weight:var(--luzmo-font-weight-semibold);color:var(--luzmo-progress-steps-font-color,var(--progress-steps-font-color))}.step-chevron{width:var(--luzmo-progress-steps-chevron-size,var(--progress-steps-chevron-size));height:var(--luzmo-progress-steps-chevron-size,var(--progress-steps-chevron-size));color:var(--luzmo-progress-steps-font-color-dimmed,var(--progress-steps-font-color-dimmed));flex-shrink:0;justify-content:center;align-items:end;display:flex}.step-chevron svg{width:100%;height:100%}.step-chevron.hidden{visibility:hidden;cursor:default}.substeps-container{grid-column:1/-1;grid-template-columns:var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) 1fr;column-gap:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));max-height:0;transition:none;display:grid;position:relative;overflow:clip}.substeps-container.expanded{max-height:var(--luzmo-progress-steps-substeps-max-height,var(--progress-steps-substeps-max-height,1000px));transition:max-height .3s cubic-bezier(.4,0,.2,1)}.substeps{gap:var(--luzmo-progress-steps-substep-gap,var(--progress-steps-substep-gap));padding-top:var(--luzmo-progress-steps-substep-gap,var(--progress-steps-substep-gap));flex-direction:column;grid-column:2;display:flex;position:relative}.substep{font-size:var(--luzmo-progress-steps-font-size-small,var(--progress-steps-font-size-small));--progress-steps-substep-line-height:1.4;--progress-steps-substep-bullet-center-offset:calc(var(--progress-steps-substep-line-height) * .5em);line-height:var(--progress-steps-substep-line-height);opacity:0;animation:.25s ease-out forwards substepFadeIn;position:relative}.substep:first-child{animation-delay:50ms}.substep:nth-child(2){animation-delay:.1s}.substep:nth-child(3){animation-delay:.15s}.substep:nth-child(4){animation-delay:.2s}.substep:nth-child(5){animation-delay:.25s}.substep:nth-child(6){animation-delay:.3s}.substep:nth-child(n+7){animation-delay:.35s}.substep-bullet{left:calc(-1 * var(--luzmo-progress-steps-gap,var(--progress-steps-gap)) - var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) / 2 - var(--luzmo-progress-steps-substep-bullet-size,var(--progress-steps-substep-bullet-size)) / 2);top:calc(var(--progress-steps-substep-bullet-center-offset) - var(--luzmo-progress-steps-substep-bullet-size,var(--progress-steps-substep-bullet-size)) / 2);width:var(--luzmo-progress-steps-substep-bullet-size,var(--progress-steps-substep-bullet-size));height:var(--luzmo-progress-steps-substep-bullet-size,var(--progress-steps-substep-bullet-size));z-index:2;background-color:var(--luzmo-background-color,#fff);--progress-steps-substep-bullet-base:var(--luzmo-progress-steps-substep-bullet-color,var(--progress-steps-substep-bullet-color));--progress-steps-substep-bullet-fill:var(--luzmo-progress-steps-substep-bullet-color,var(--progress-steps-substep-bullet-color));border-radius:50%;position:absolute}.substep-bullet:before,.substep-bullet:after{content:"";border-radius:50%;position:absolute}.substep-bullet:before{background-color:var(--progress-steps-substep-bullet-base);z-index:0;inset:0}.substep-bullet:after{background-color:var(--progress-steps-substep-bullet-fill);z-index:1;inset:0}.substep:before,.substep:after{content:"";left:calc(-1 * var(--luzmo-progress-steps-gap,var(--progress-steps-gap)) - var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) / 2);background-color:var(--luzmo-progress-steps-substep-connector-color,var(--progress-steps-substep-connector-color));z-index:0;width:1px;position:absolute;transform:translate(-.5px)}.substep.is-first:before{top:calc(-1 * var(--luzmo-progress-steps-substep-gap,var(--progress-steps-substep-gap)));height:calc(var(--progress-steps-substep-bullet-center-offset) + var(--luzmo-progress-steps-substep-gap,var(--progress-steps-substep-gap)))}.substep:not(.is-last):after{top:var(--progress-steps-substep-bullet-center-offset);height:calc(100% + var(--luzmo-progress-steps-substep-gap,var(--progress-steps-substep-gap)))}.substep.is-last:after{display:none}.step:not(:last-child) .substep.is-last:after{top:var(--progress-steps-substep-bullet-center-offset);height:calc(100% - var(--progress-steps-substep-bullet-center-offset));display:block}.substep.is-first:has(.substep-bullet-in-progress):before{background:linear-gradient(to bottom, var(--luzmo-progress-steps-substep-connector-color,var(--progress-steps-substep-connector-color)), var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color)))}.substep:has(+.substep .substep-bullet-in-progress):after{background:linear-gradient(to bottom, var(--luzmo-progress-steps-substep-connector-color,var(--progress-steps-substep-connector-color)), var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color)))}.substep-bullet-pending,.substep-bullet-completed,.substep-bullet-error{--progress-steps-substep-bullet-base:var(--luzmo-progress-steps-substep-bullet-color,var(--progress-steps-substep-bullet-color));--progress-steps-substep-bullet-fill:var(--luzmo-progress-steps-substep-bullet-color,var(--progress-steps-substep-bullet-color))}.substep-bullet-in-progress{--progress-steps-substep-bullet-base:var(--luzmo-progress-steps-font-color-dimmed,var(--progress-steps-font-color-dimmed));--progress-steps-substep-bullet-fill:var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color));box-shadow:0 0 5px 0 color-mix(in srgb, var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color)) 30%, transparent);animation:2s cubic-bezier(.4,0,.6,1) infinite substepBulletGlow}.substep-bullet-in-progress:after{animation:2s cubic-bezier(.4,0,.6,1) infinite substepBulletPulse}.substep-text,.substep-text-pending,.substep-text-completed,.substep-text-error{color:var(--luzmo-progress-steps-font-color-dimmed,var(--progress-steps-font-color-dimmed))}.substep-text-completed{color:var(--luzmo-progress-steps-font-color,var(--progress-steps-font-color))}.substep-text-error{color:var(--luzmo-progress-steps-error-color,var(--progress-steps-error-color))}.condensed-toggle{align-items:center;gap:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--luzmo-progress-steps-font-color-dimmed,var(--progress-steps-font-color-dimmed));transition:color .2s;display:flex}.condensed-toggle:hover{color:var(--luzmo-progress-steps-font-color,var(--progress-steps-font-color))}.condensed-toggle-text{font-weight:var(--luzmo-font-weight-semibold)}.condensed-toggle-chevron{width:var(--luzmo-progress-steps-chevron-size,var(--progress-steps-chevron-size));height:var(--luzmo-progress-steps-chevron-size,var(--progress-steps-chevron-size));flex-shrink:0;justify-content:center;align-items:center;transition:transform .2s;display:flex}.condensed-toggle-chevron svg{width:100%;height:100%}.condensed-toggle-chevron.expanded{transform:rotate(180deg)}.condensed-steps{gap:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));margin-top:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));flex-direction:column;display:flex}@keyframes mainStepPulse{0%{opacity:.6;transform:scale(.8)}50%{opacity:.3;transform:scale(1.25)}to{opacity:.6;transform:scale(.8)}}@keyframes substepBulletPulse{0%,to{opacity:.55;transform:scale(.95)}50%{opacity:.4;transform:scale(1.05)}}@keyframes substepBulletGlow{0%,to{box-shadow:0 0 4px 0 color-mix(in srgb, var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color)) 25%, transparent)}50%{box-shadow:0 0 6px 1px color-mix(in srgb, var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color)) 35%, transparent)}}@keyframes stepFadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes substepFadeIn{0%{opacity:0;transform:translate(-4px)}to{opacity:1;transform:translate(0)}}:host([no-animate]) .step{animation:none}:host([no-animate]) .substep{opacity:1;animation:none}:host([no-animate]) .substep-bullet-in-progress,:host([no-animate]) .substep-bullet-in-progress:after{animation:none}:host([no-animate]) .condensed-toggle-chevron{transition:none}:host{--progress-steps-primary-color:var(--luzmo-primary);--progress-steps-pulse-color:rgba(var(--luzmo-primary-rgb), .4);--progress-steps-font-color:var(--luzmo-font-color);--progress-steps-font-color-dimmed:var(--luzmo-font-color-extra-dimmed);--progress-steps-completed-color:var(--luzmo-positive-color);--progress-steps-error-color:var(--luzmo-negative-color);--progress-steps-gap:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--progress-steps-substep-gap:var(--luzmo-spacing-3);--progress-steps-border-radius:var(--luzmo-border-radius);--progress-steps-font-size:var(--luzmo-font-size);--progress-steps-font-size-small:var(--luzmo-font-size-s);--progress-steps-icon-size:var(--luzmo-icon-size-xl);--progress-steps-icon-radius:var(--luzmo-border-radius-s);--progress-steps-chevron-size:var(--luzmo-icon-size-m);--progress-steps-substep-bullet-size:6px;--progress-steps-pulse-offset:6px;--progress-steps-substeps-max-height:1000px;--progress-steps-substep-connector-color:var(--luzmo-border-color);--progress-steps-substep-bullet-color:var(--luzmo-border-color)}:host([size=s]){--progress-steps-font-size:var(--luzmo-font-size-s);--progress-steps-font-size-small:var(--luzmo-font-size-xs);--progress-steps-gap:var(--luzmo-spacing-3);--progress-steps-substep-gap:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--progress-steps-icon-size:var(--luzmo-icon-size-m);--progress-steps-chevron-size:var(--luzmo-icon-size-s);--progress-steps-substep-bullet-size:5px}:host([size=l]){--progress-steps-font-size:var(--luzmo-font-size-l);--progress-steps-font-size-small:var(--luzmo-font-size);--progress-steps-gap:var(--luzmo-spacing-4);--progress-steps-substep-gap:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--progress-steps-icon-size:calc(var(--luzmo-icon-size-xl) + var(--luzmo-spacing-1));--progress-steps-chevron-size:var(--luzmo-icon-size-l);--progress-steps-substep-bullet-size:6px}:host([size=xl]){--progress-steps-font-size:var(--luzmo-font-size-xl);--progress-steps-font-size-small:var(--luzmo-font-size-l);--progress-steps-gap:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--progress-steps-substep-gap:var(--luzmo-spacing-4);--progress-steps-icon-size:calc(var(--luzmo-icon-size-xl) + var(--luzmo-spacing-2));--progress-steps-chevron-size:var(--luzmo-icon-size-xl);--progress-steps-substep-bullet-size:7px}:host{box-sizing:border-box}`,o={condensedSingular:`{{count}} step completed`,condensedPlural:`{{count}} steps completed`,stepInProgress:`Step in progress`,stepPending:`Step pending`,stepCompleted:`Step completed`,stepFailed:`Step failed`},s=class extends t.n(e.n,{defaultSize:`m`,validSizes:[`s`,`m`,`l`,`xl`]}){constructor(...e){super(...e),this.progress=null,this.locale=`en`,this.collapsed=!1,this.displayMode=`detailed`,this.condensed=!1,this.labels={...o},this.noAnimate=!1,this._condensedExpanded=!1,this._expandedNodes=new Set,this._autoExpandedNodes=new Set,this._manuallyExpandedNodes=new Set}static{this.styles=[(0,n.unsafeCSS)(a)]}willUpdate(e){if(super.willUpdate(e),e.has(`progress`)){let t=e.get(`progress`);this._handleProgressChange(t),(!this.progress||!t||this.progress.id!==t.id)&&(this._condensedExpanded=!1)}e.has(`condensed`)&&(this._condensedExpanded=!1),e.has(`collapsed`)&&(this.collapsed?this._collapseAutoExpandedNodes():this._reExpandInProgressNodes())}_handleProgressChange(e){(!this.progress||!e||this.progress.id!==e.id)&&this._clearExpansionState(),this.progress?.children&&(this._handleAutoExpandCollapse(this.progress.children),this.collapsed&&this._collapseAutoExpandedNodes())}_clearExpansionState(){this._expandedNodes.clear(),this._autoExpandedNodes.clear(),this._manuallyExpandedNodes.clear()}_handleAutoExpandCollapse(e){for(let t of e){let e=t.id;t.status===`inProgress`&&!this._autoExpandedNodes.has(e)&&(this._autoExpandedNodes.add(e),this._expandedNodes.add(e)),t.children&&this._handleAutoExpandCollapse(t.children)}}_collapseAutoExpandedNodes(){for(let e of this._autoExpandedNodes)this._manuallyExpandedNodes.has(e)||this._expandedNodes.delete(e)}_reExpandInProgressNodes(){this.progress?.children&&this._reExpandInProgressNodesRecursive(this.progress.children)}_reExpandInProgressNodesRecursive(e){for(let t of e)t.status===`inProgress`&&this._autoExpandedNodes.has(t.id)&&this._expandedNodes.add(t.id),t.children&&this._reExpandInProgressNodesRecursive(t.children)}_mapStatus(e){switch(e){case`inProgress`:return`in-progress`;case`success`:return`completed`;case`pending`:return`pending`;case`error`:return`error`;default:return`pending`}}_resolveLocalizedString(e){return e[this.locale]??e.en??Object.values(e)[0]??``}_interpolateDescription(e){return e.description?e.descriptionMetadata?e.description.replaceAll(/\{\{(\w+)\}\}/g,(t,n)=>{let r=e.descriptionMetadata?.[n];return r==null?`{{${n}}}`:Array.isArray(r)?r.map(e=>typeof e==`object`&&e?this._resolveLocalizedString(e):String(e)).join(`, `):typeof r==`object`?this._resolveLocalizedString(r):String(r)}):e.description:``}_toggleNodeExpansion(e){this._expandedNodes.has(e)?(this._expandedNodes.delete(e),this._manuallyExpandedNodes.delete(e),this.dispatchEvent(new CustomEvent(`luzmo-step-collapsed`,{bubbles:!0,composed:!0,detail:{nodeId:e}}))):(this._expandedNodes.add(e),this._manuallyExpandedNodes.add(e),this.dispatchEvent(new CustomEvent(`luzmo-step-expanded`,{bubbles:!0,composed:!0,detail:{nodeId:e}}))),this.requestUpdate()}_isNodeExpanded(e){return this._expandedNodes.has(e)}_renderStepIcon(e){let t;switch(e){case`in-progress`:t=this.labels.stepInProgress;break;case`pending`:t=this.labels.stepPending;break;case`completed`:t=this.labels.stepCompleted;break;case`error`:t=this.labels.stepFailed;break;default:t=this.labels.stepPending}if(e===`in-progress`)return n.html`
|
|
19
|
-
<div
|
|
20
|
-
class="step-icon step-icon-in-progress"
|
|
21
|
-
aria-label=${t}
|
|
22
|
-
role="img"
|
|
23
|
-
>
|
|
24
|
-
<div class="step-dot"></div>
|
|
25
|
-
</div>
|
|
26
|
-
`;let r;switch(e){case`pending`:r=i.luzmoCircle;break;case`completed`:r=i.luzmoCheckCircleOutline;break;case`error`:r=i.luzmoClose14;break;default:r=i.luzmoCircle}return n.html`
|
|
27
|
-
<div
|
|
28
|
-
class="step-icon step-icon-${e}"
|
|
29
|
-
aria-label=${t}
|
|
30
|
-
role="img"
|
|
31
|
-
>
|
|
32
|
-
${(0,i.luzmoIcon)(r)}
|
|
33
|
-
</div>
|
|
34
|
-
`}_renderChevron(e,t){return n.html`<div class="step-chevron ${t?``:`hidden`}">
|
|
35
|
-
${(0,i.luzmoIcon)(e?i.luzmoAngleUp:i.luzmoAngleDown)}
|
|
36
|
-
</div>`}_renderSubsteps(e){let t=e.length-1;return e.map((e,n)=>this._renderSubstep(e,n===0,n===t))}_renderSubstep(e,t,r){let i=this._mapStatus(e.status),a=this._interpolateDescription(e),o=[`substep`];return t&&o.push(`is-first`),r&&o.push(`is-last`),n.html`
|
|
37
|
-
<div class=${o.join(` `)}>
|
|
38
|
-
<div class="substep-bullet substep-bullet-${i}"></div>
|
|
39
|
-
<div class="substep-text substep-text-${i}">${a}</div>
|
|
40
|
-
</div>
|
|
41
|
-
`}_renderStep(e){let t=this._mapStatus(e.status),r=this.displayMode===`compact`,i=this._interpolateDescription(e)||e.step,a=!r&&e.children&&e.children.length>0,o=this._isNodeExpanded(e.id),s=`substeps-${e.id}`;return n.html`
|
|
42
|
-
<div class="step">
|
|
43
|
-
<div
|
|
44
|
-
class="step-header ${a?`has-substeps`:``}"
|
|
45
|
-
role=${a?`button`:`status`}
|
|
46
|
-
aria-expanded=${a?o:n.nothing}
|
|
47
|
-
aria-controls=${a?s:n.nothing}
|
|
48
|
-
tabindex=${a?0:n.nothing}
|
|
49
|
-
@click=${a?()=>this._toggleNodeExpansion(e.id):n.nothing}
|
|
50
|
-
@keydown=${a?t=>{(t.key===`Enter`||t.key===` `)&&(t.preventDefault(),this._toggleNodeExpansion(e.id))}:n.nothing}
|
|
51
|
-
>
|
|
52
|
-
${this._renderStepIcon(t)}
|
|
53
|
-
<div class="step-content">
|
|
54
|
-
<div class="step-name">${i}</div>
|
|
55
|
-
${r?n.nothing:this._renderChevron(o,!!a)}
|
|
56
|
-
</div>
|
|
57
|
-
</div>
|
|
58
|
-
${a?n.html`
|
|
59
|
-
<div
|
|
60
|
-
id=${s}
|
|
61
|
-
class="substeps-container ${o?`expanded`:``}"
|
|
62
|
-
>
|
|
63
|
-
<div class="substeps">
|
|
64
|
-
${this._renderSubsteps(e.children??[])}
|
|
65
|
-
</div>
|
|
66
|
-
</div>
|
|
67
|
-
`:n.nothing}
|
|
68
|
-
</div>
|
|
69
|
-
`}_toggleCondensed(){this._condensedExpanded=!this._condensedExpanded,this.requestUpdate()}_handleCondensedKeydown(e){(e.key===`Enter`||e.key===` `)&&(e.preventDefault(),this._toggleCondensed())}_renderCondensed(){let e=this.progress?.children?.filter(e=>e.status===`success`).length??0,t=(e===1?this.labels.condensedSingular:this.labels.condensedPlural).replace(`{{count}}`,String(e));return n.html`
|
|
70
|
-
<div class="condensed-container">
|
|
71
|
-
<div
|
|
72
|
-
class="condensed-toggle"
|
|
73
|
-
role="button"
|
|
74
|
-
tabindex="0"
|
|
75
|
-
aria-expanded=${this._condensedExpanded}
|
|
76
|
-
@click=${this._toggleCondensed}
|
|
77
|
-
@keydown=${this._handleCondensedKeydown}
|
|
78
|
-
>
|
|
79
|
-
<span class="condensed-toggle-text">${t}</span>
|
|
80
|
-
<span
|
|
81
|
-
class="condensed-toggle-chevron ${this._condensedExpanded?`expanded`:``}"
|
|
82
|
-
>
|
|
83
|
-
${(0,i.luzmoIcon)(i.luzmoAngleDown)}
|
|
84
|
-
</span>
|
|
85
|
-
</div>
|
|
86
|
-
${this._condensedExpanded?n.html`<div class="condensed-steps">${this._renderSteps()}</div>`:n.nothing}
|
|
87
|
-
</div>
|
|
88
|
-
`}_renderSteps(){return(this.progress?.children??[]).map(e=>this._renderStep(e))}render(){return this.condensed?n.html`
|
|
89
|
-
<div class="progress-steps-container" role="status" aria-live="polite">
|
|
90
|
-
${this._renderCondensed()}
|
|
91
|
-
</div>
|
|
92
|
-
`:n.html`
|
|
93
|
-
<div class="progress-steps-container" role="status" aria-live="polite">
|
|
94
|
-
${this._renderSteps()}
|
|
95
|
-
</div>
|
|
96
|
-
`}};e.t([(0,r.property)({type:Object})],s.prototype,`progress`,void 0),e.t([(0,r.property)({type:String})],s.prototype,`locale`,void 0),e.t([(0,r.property)({type:Boolean})],s.prototype,`collapsed`,void 0),e.t([(0,r.property)({type:String,attribute:`display-mode`})],s.prototype,`displayMode`,void 0),e.t([(0,r.property)({type:Boolean})],s.prototype,`condensed`,void 0),e.t([(0,r.property)({type:Object})],s.prototype,`labels`,void 0),e.t([(0,r.property)({type:Boolean,attribute:`no-animate`,reflect:!0})],s.prototype,`noAnimate`,void 0),e.t([(0,r.state)()],s.prototype,`_condensedExpanded`,void 0),e.t([(0,r.state)()],s.prototype,`_expandedNodes`,void 0),e.t([(0,r.state)()],s.prototype,`_autoExpandedNodes`,void 0),e.t([(0,r.state)()],s.prototype,`_manuallyExpandedNodes`,void 0),customElements.get(`luzmo-progress-steps`)||customElements.define(`luzmo-progress-steps`,s),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return s}});
|
|
@@ -1,262 +0,0 @@
|
|
|
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
|
-
import { n as e, t } from "./decorate-CkCg3wfh.js";
|
|
19
|
-
import { n } from "./sized-mixin-DzQTebN-.js";
|
|
20
|
-
import { html as r, nothing as i, unsafeCSS as a } from "lit";
|
|
21
|
-
import { property as o, state as s } from "lit/decorators.js";
|
|
22
|
-
import { luzmoAngleDown as c, luzmoAngleUp as l, luzmoCheckCircleOutline as u, luzmoCircle as d, luzmoClose14 as f, luzmoIcon as p } from "@luzmo/icons";
|
|
23
|
-
//#region src/components/progress-steps/progress-steps.module.scss?inline
|
|
24
|
-
var m = ":host{font-family:var(--luzmo-font-family);font-size:var(--luzmo-progress-steps-font-size,var(--progress-steps-font-size));color:var(--luzmo-progress-steps-font-color,var(--progress-steps-font-color));display:block}.progress-steps-container{gap:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));flex-direction:column;display:flex}.step{grid-template-columns:var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) auto;column-gap:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));animation:.3s ease-out forwards stepFadeIn;display:grid;position:relative}.step:not(:last-child):after{content:\"\";left:calc(var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) / 2);top:var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size));bottom:calc(-1 * var(--luzmo-progress-steps-gap,var(--progress-steps-gap)));background-color:var(--luzmo-progress-steps-substep-connector-color,var(--progress-steps-substep-connector-color));z-index:0;pointer-events:none;width:1px;position:absolute;transform:translate(-.5px)}.step:not(:last-child):has(.substeps-container.expanded):after{height:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));top:auto}.step-header{-webkit-user-select:none;user-select:none;display:contents}.step-header.has-substeps{cursor:pointer}.step-icon{width:var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size));height:var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size));border-radius:var(--luzmo-progress-steps-icon-radius,var(--progress-steps-icon-radius,var(--luzmo-border-radius-l)));flex-shrink:0;grid-column:1;justify-content:center;align-self:center;align-items:center;display:flex;position:relative}.step-icon svg{width:100%;height:100%}.step-header.has-substeps .step-icon{cursor:pointer}.step-icon-pending{color:var(--luzmo-progress-steps-font-color-dimmed,var(--progress-steps-font-color-dimmed))}.step-icon-in-progress{position:relative}.step-dot{width:calc(var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) * .4);height:calc(var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) * .4);background-color:var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color));border-radius:var(--luzmo-progress-steps-icon-radius,var(--progress-steps-icon-radius,var(--luzmo-border-radius-l)));position:relative}.step-dot:after{--progress-steps-pulse-offset-calc:var(--luzmo-progress-steps-pulse-offset,var(--progress-steps-pulse-offset,6px));content:\"\";top:calc(-1 * var(--progress-steps-pulse-offset-calc));left:calc(-1 * var(--progress-steps-pulse-offset-calc));right:calc(-1 * var(--progress-steps-pulse-offset-calc));bottom:calc(-1 * var(--progress-steps-pulse-offset-calc));border-radius:var(--luzmo-progress-steps-icon-radius,var(--progress-steps-icon-radius,var(--luzmo-border-radius-l)));background-color:var(--luzmo-progress-steps-pulse-color,var(--progress-steps-pulse-color));opacity:0;animation:2s cubic-bezier(.4,0,.6,1) infinite mainStepPulse;position:absolute}.step-icon-completed{color:var(--luzmo-progress-steps-completed-color,var(--progress-steps-completed-color))}.step-icon-error{color:var(--luzmo-progress-steps-error-color,var(--progress-steps-error-color))}.step-content{align-items:center;gap:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));border-radius:var(--luzmo-progress-steps-border-radius,var(--progress-steps-border-radius));flex-direction:row;grid-column:2;align-self:center;min-width:0;display:flex}.step-header.has-substeps .step-content{cursor:pointer}.step-name{font-weight:var(--luzmo-font-weight-semibold);color:var(--luzmo-progress-steps-font-color,var(--progress-steps-font-color))}.step-chevron{width:var(--luzmo-progress-steps-chevron-size,var(--progress-steps-chevron-size));height:var(--luzmo-progress-steps-chevron-size,var(--progress-steps-chevron-size));color:var(--luzmo-progress-steps-font-color-dimmed,var(--progress-steps-font-color-dimmed));flex-shrink:0;justify-content:center;align-items:end;display:flex}.step-chevron svg{width:100%;height:100%}.step-chevron.hidden{visibility:hidden;cursor:default}.substeps-container{grid-column:1/-1;grid-template-columns:var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) 1fr;column-gap:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));max-height:0;transition:none;display:grid;position:relative;overflow:clip}.substeps-container.expanded{max-height:var(--luzmo-progress-steps-substeps-max-height,var(--progress-steps-substeps-max-height,1000px));transition:max-height .3s cubic-bezier(.4,0,.2,1)}.substeps{gap:var(--luzmo-progress-steps-substep-gap,var(--progress-steps-substep-gap));padding-top:var(--luzmo-progress-steps-substep-gap,var(--progress-steps-substep-gap));flex-direction:column;grid-column:2;display:flex;position:relative}.substep{font-size:var(--luzmo-progress-steps-font-size-small,var(--progress-steps-font-size-small));--progress-steps-substep-line-height:1.4;--progress-steps-substep-bullet-center-offset:calc(var(--progress-steps-substep-line-height) * .5em);line-height:var(--progress-steps-substep-line-height);opacity:0;animation:.25s ease-out forwards substepFadeIn;position:relative}.substep:first-child{animation-delay:50ms}.substep:nth-child(2){animation-delay:.1s}.substep:nth-child(3){animation-delay:.15s}.substep:nth-child(4){animation-delay:.2s}.substep:nth-child(5){animation-delay:.25s}.substep:nth-child(6){animation-delay:.3s}.substep:nth-child(n+7){animation-delay:.35s}.substep-bullet{left:calc(-1 * var(--luzmo-progress-steps-gap,var(--progress-steps-gap)) - var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) / 2 - var(--luzmo-progress-steps-substep-bullet-size,var(--progress-steps-substep-bullet-size)) / 2);top:calc(var(--progress-steps-substep-bullet-center-offset) - var(--luzmo-progress-steps-substep-bullet-size,var(--progress-steps-substep-bullet-size)) / 2);width:var(--luzmo-progress-steps-substep-bullet-size,var(--progress-steps-substep-bullet-size));height:var(--luzmo-progress-steps-substep-bullet-size,var(--progress-steps-substep-bullet-size));z-index:2;background-color:var(--luzmo-background-color,#fff);--progress-steps-substep-bullet-base:var(--luzmo-progress-steps-substep-bullet-color,var(--progress-steps-substep-bullet-color));--progress-steps-substep-bullet-fill:var(--luzmo-progress-steps-substep-bullet-color,var(--progress-steps-substep-bullet-color));border-radius:50%;position:absolute}.substep-bullet:before,.substep-bullet:after{content:\"\";border-radius:50%;position:absolute}.substep-bullet:before{background-color:var(--progress-steps-substep-bullet-base);z-index:0;inset:0}.substep-bullet:after{background-color:var(--progress-steps-substep-bullet-fill);z-index:1;inset:0}.substep:before,.substep:after{content:\"\";left:calc(-1 * var(--luzmo-progress-steps-gap,var(--progress-steps-gap)) - var(--luzmo-progress-steps-icon-size,var(--progress-steps-icon-size)) / 2);background-color:var(--luzmo-progress-steps-substep-connector-color,var(--progress-steps-substep-connector-color));z-index:0;width:1px;position:absolute;transform:translate(-.5px)}.substep.is-first:before{top:calc(-1 * var(--luzmo-progress-steps-substep-gap,var(--progress-steps-substep-gap)));height:calc(var(--progress-steps-substep-bullet-center-offset) + var(--luzmo-progress-steps-substep-gap,var(--progress-steps-substep-gap)))}.substep:not(.is-last):after{top:var(--progress-steps-substep-bullet-center-offset);height:calc(100% + var(--luzmo-progress-steps-substep-gap,var(--progress-steps-substep-gap)))}.substep.is-last:after{display:none}.step:not(:last-child) .substep.is-last:after{top:var(--progress-steps-substep-bullet-center-offset);height:calc(100% - var(--progress-steps-substep-bullet-center-offset));display:block}.substep.is-first:has(.substep-bullet-in-progress):before{background:linear-gradient(to bottom, var(--luzmo-progress-steps-substep-connector-color,var(--progress-steps-substep-connector-color)), var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color)))}.substep:has(+.substep .substep-bullet-in-progress):after{background:linear-gradient(to bottom, var(--luzmo-progress-steps-substep-connector-color,var(--progress-steps-substep-connector-color)), var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color)))}.substep-bullet-pending,.substep-bullet-completed,.substep-bullet-error{--progress-steps-substep-bullet-base:var(--luzmo-progress-steps-substep-bullet-color,var(--progress-steps-substep-bullet-color));--progress-steps-substep-bullet-fill:var(--luzmo-progress-steps-substep-bullet-color,var(--progress-steps-substep-bullet-color))}.substep-bullet-in-progress{--progress-steps-substep-bullet-base:var(--luzmo-progress-steps-font-color-dimmed,var(--progress-steps-font-color-dimmed));--progress-steps-substep-bullet-fill:var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color));box-shadow:0 0 5px 0 color-mix(in srgb, var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color)) 30%, transparent);animation:2s cubic-bezier(.4,0,.6,1) infinite substepBulletGlow}.substep-bullet-in-progress:after{animation:2s cubic-bezier(.4,0,.6,1) infinite substepBulletPulse}.substep-text,.substep-text-pending,.substep-text-completed,.substep-text-error{color:var(--luzmo-progress-steps-font-color-dimmed,var(--progress-steps-font-color-dimmed))}.substep-text-completed{color:var(--luzmo-progress-steps-font-color,var(--progress-steps-font-color))}.substep-text-error{color:var(--luzmo-progress-steps-error-color,var(--progress-steps-error-color))}.condensed-toggle{align-items:center;gap:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));cursor:pointer;-webkit-user-select:none;user-select:none;color:var(--luzmo-progress-steps-font-color-dimmed,var(--progress-steps-font-color-dimmed));transition:color .2s;display:flex}.condensed-toggle:hover{color:var(--luzmo-progress-steps-font-color,var(--progress-steps-font-color))}.condensed-toggle-text{font-weight:var(--luzmo-font-weight-semibold)}.condensed-toggle-chevron{width:var(--luzmo-progress-steps-chevron-size,var(--progress-steps-chevron-size));height:var(--luzmo-progress-steps-chevron-size,var(--progress-steps-chevron-size));flex-shrink:0;justify-content:center;align-items:center;transition:transform .2s;display:flex}.condensed-toggle-chevron svg{width:100%;height:100%}.condensed-toggle-chevron.expanded{transform:rotate(180deg)}.condensed-steps{gap:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));margin-top:var(--luzmo-progress-steps-gap,var(--progress-steps-gap));flex-direction:column;display:flex}@keyframes mainStepPulse{0%{opacity:.6;transform:scale(.8)}50%{opacity:.3;transform:scale(1.25)}to{opacity:.6;transform:scale(.8)}}@keyframes substepBulletPulse{0%,to{opacity:.55;transform:scale(.95)}50%{opacity:.4;transform:scale(1.05)}}@keyframes substepBulletGlow{0%,to{box-shadow:0 0 4px 0 color-mix(in srgb, var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color)) 25%, transparent)}50%{box-shadow:0 0 6px 1px color-mix(in srgb, var(--luzmo-progress-steps-primary-color,var(--progress-steps-primary-color)) 35%, transparent)}}@keyframes stepFadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes substepFadeIn{0%{opacity:0;transform:translate(-4px)}to{opacity:1;transform:translate(0)}}:host([no-animate]) .step{animation:none}:host([no-animate]) .substep{opacity:1;animation:none}:host([no-animate]) .substep-bullet-in-progress,:host([no-animate]) .substep-bullet-in-progress:after{animation:none}:host([no-animate]) .condensed-toggle-chevron{transition:none}:host{--progress-steps-primary-color:var(--luzmo-primary);--progress-steps-pulse-color:rgba(var(--luzmo-primary-rgb), .4);--progress-steps-font-color:var(--luzmo-font-color);--progress-steps-font-color-dimmed:var(--luzmo-font-color-extra-dimmed);--progress-steps-completed-color:var(--luzmo-positive-color);--progress-steps-error-color:var(--luzmo-negative-color);--progress-steps-gap:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--progress-steps-substep-gap:var(--luzmo-spacing-3);--progress-steps-border-radius:var(--luzmo-border-radius);--progress-steps-font-size:var(--luzmo-font-size);--progress-steps-font-size-small:var(--luzmo-font-size-s);--progress-steps-icon-size:var(--luzmo-icon-size-xl);--progress-steps-icon-radius:var(--luzmo-border-radius-s);--progress-steps-chevron-size:var(--luzmo-icon-size-m);--progress-steps-substep-bullet-size:6px;--progress-steps-pulse-offset:6px;--progress-steps-substeps-max-height:1000px;--progress-steps-substep-connector-color:var(--luzmo-border-color);--progress-steps-substep-bullet-color:var(--luzmo-border-color)}:host([size=s]){--progress-steps-font-size:var(--luzmo-font-size-s);--progress-steps-font-size-small:var(--luzmo-font-size-xs);--progress-steps-gap:var(--luzmo-spacing-3);--progress-steps-substep-gap:calc(var(--luzmo-spacing-2) + var(--luzmo-spacing-1));--progress-steps-icon-size:var(--luzmo-icon-size-m);--progress-steps-chevron-size:var(--luzmo-icon-size-s);--progress-steps-substep-bullet-size:5px}:host([size=l]){--progress-steps-font-size:var(--luzmo-font-size-l);--progress-steps-font-size-small:var(--luzmo-font-size);--progress-steps-gap:var(--luzmo-spacing-4);--progress-steps-substep-gap:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--progress-steps-icon-size:calc(var(--luzmo-icon-size-xl) + var(--luzmo-spacing-1));--progress-steps-chevron-size:var(--luzmo-icon-size-l);--progress-steps-substep-bullet-size:6px}:host([size=xl]){--progress-steps-font-size:var(--luzmo-font-size-xl);--progress-steps-font-size-small:var(--luzmo-font-size-l);--progress-steps-gap:calc(var(--luzmo-spacing-4) + var(--luzmo-spacing-1));--progress-steps-substep-gap:var(--luzmo-spacing-4);--progress-steps-icon-size:calc(var(--luzmo-icon-size-xl) + var(--luzmo-spacing-2));--progress-steps-chevron-size:var(--luzmo-icon-size-xl);--progress-steps-substep-bullet-size:7px}:host{box-sizing:border-box}", h = {
|
|
25
|
-
condensedSingular: "{{count}} step completed",
|
|
26
|
-
condensedPlural: "{{count}} steps completed",
|
|
27
|
-
stepInProgress: "Step in progress",
|
|
28
|
-
stepPending: "Step pending",
|
|
29
|
-
stepCompleted: "Step completed",
|
|
30
|
-
stepFailed: "Step failed"
|
|
31
|
-
}, g = class extends n(e, {
|
|
32
|
-
defaultSize: "m",
|
|
33
|
-
validSizes: [
|
|
34
|
-
"s",
|
|
35
|
-
"m",
|
|
36
|
-
"l",
|
|
37
|
-
"xl"
|
|
38
|
-
]
|
|
39
|
-
}) {
|
|
40
|
-
constructor(...e) {
|
|
41
|
-
super(...e), this.progress = null, this.locale = "en", this.collapsed = !1, this.displayMode = "detailed", this.condensed = !1, this.labels = { ...h }, this.noAnimate = !1, this._condensedExpanded = !1, this._expandedNodes = /* @__PURE__ */ new Set(), this._autoExpandedNodes = /* @__PURE__ */ new Set(), this._manuallyExpandedNodes = /* @__PURE__ */ new Set();
|
|
42
|
-
}
|
|
43
|
-
static {
|
|
44
|
-
this.styles = [a(m)];
|
|
45
|
-
}
|
|
46
|
-
willUpdate(e) {
|
|
47
|
-
if (super.willUpdate(e), e.has("progress")) {
|
|
48
|
-
let t = e.get("progress");
|
|
49
|
-
this._handleProgressChange(t), (!this.progress || !t || this.progress.id !== t.id) && (this._condensedExpanded = !1);
|
|
50
|
-
}
|
|
51
|
-
e.has("condensed") && (this._condensedExpanded = !1), e.has("collapsed") && (this.collapsed ? this._collapseAutoExpandedNodes() : this._reExpandInProgressNodes());
|
|
52
|
-
}
|
|
53
|
-
_handleProgressChange(e) {
|
|
54
|
-
(!this.progress || !e || this.progress.id !== e.id) && this._clearExpansionState(), this.progress?.children && (this._handleAutoExpandCollapse(this.progress.children), this.collapsed && this._collapseAutoExpandedNodes());
|
|
55
|
-
}
|
|
56
|
-
_clearExpansionState() {
|
|
57
|
-
this._expandedNodes.clear(), this._autoExpandedNodes.clear(), this._manuallyExpandedNodes.clear();
|
|
58
|
-
}
|
|
59
|
-
_handleAutoExpandCollapse(e) {
|
|
60
|
-
for (let t of e) {
|
|
61
|
-
let e = t.id;
|
|
62
|
-
t.status === "inProgress" && !this._autoExpandedNodes.has(e) && (this._autoExpandedNodes.add(e), this._expandedNodes.add(e)), t.children && this._handleAutoExpandCollapse(t.children);
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
_collapseAutoExpandedNodes() {
|
|
66
|
-
for (let e of this._autoExpandedNodes) this._manuallyExpandedNodes.has(e) || this._expandedNodes.delete(e);
|
|
67
|
-
}
|
|
68
|
-
_reExpandInProgressNodes() {
|
|
69
|
-
this.progress?.children && this._reExpandInProgressNodesRecursive(this.progress.children);
|
|
70
|
-
}
|
|
71
|
-
_reExpandInProgressNodesRecursive(e) {
|
|
72
|
-
for (let t of e) t.status === "inProgress" && this._autoExpandedNodes.has(t.id) && this._expandedNodes.add(t.id), t.children && this._reExpandInProgressNodesRecursive(t.children);
|
|
73
|
-
}
|
|
74
|
-
_mapStatus(e) {
|
|
75
|
-
switch (e) {
|
|
76
|
-
case "inProgress": return "in-progress";
|
|
77
|
-
case "success": return "completed";
|
|
78
|
-
case "pending": return "pending";
|
|
79
|
-
case "error": return "error";
|
|
80
|
-
default: return "pending";
|
|
81
|
-
}
|
|
82
|
-
}
|
|
83
|
-
_resolveLocalizedString(e) {
|
|
84
|
-
return e[this.locale] ?? e.en ?? Object.values(e)[0] ?? "";
|
|
85
|
-
}
|
|
86
|
-
_interpolateDescription(e) {
|
|
87
|
-
return e.description ? e.descriptionMetadata ? e.description.replaceAll(/\{\{(\w+)\}\}/g, (t, n) => {
|
|
88
|
-
let r = e.descriptionMetadata?.[n];
|
|
89
|
-
return r == null ? `{{${n}}}` : Array.isArray(r) ? r.map((e) => typeof e == "object" && e ? this._resolveLocalizedString(e) : String(e)).join(", ") : typeof r == "object" ? this._resolveLocalizedString(r) : String(r);
|
|
90
|
-
}) : e.description : "";
|
|
91
|
-
}
|
|
92
|
-
_toggleNodeExpansion(e) {
|
|
93
|
-
this._expandedNodes.has(e) ? (this._expandedNodes.delete(e), this._manuallyExpandedNodes.delete(e), this.dispatchEvent(new CustomEvent("luzmo-step-collapsed", {
|
|
94
|
-
bubbles: !0,
|
|
95
|
-
composed: !0,
|
|
96
|
-
detail: { nodeId: e }
|
|
97
|
-
}))) : (this._expandedNodes.add(e), this._manuallyExpandedNodes.add(e), this.dispatchEvent(new CustomEvent("luzmo-step-expanded", {
|
|
98
|
-
bubbles: !0,
|
|
99
|
-
composed: !0,
|
|
100
|
-
detail: { nodeId: e }
|
|
101
|
-
}))), this.requestUpdate();
|
|
102
|
-
}
|
|
103
|
-
_isNodeExpanded(e) {
|
|
104
|
-
return this._expandedNodes.has(e);
|
|
105
|
-
}
|
|
106
|
-
_renderStepIcon(e) {
|
|
107
|
-
let t;
|
|
108
|
-
switch (e) {
|
|
109
|
-
case "in-progress":
|
|
110
|
-
t = this.labels.stepInProgress;
|
|
111
|
-
break;
|
|
112
|
-
case "pending":
|
|
113
|
-
t = this.labels.stepPending;
|
|
114
|
-
break;
|
|
115
|
-
case "completed":
|
|
116
|
-
t = this.labels.stepCompleted;
|
|
117
|
-
break;
|
|
118
|
-
case "error":
|
|
119
|
-
t = this.labels.stepFailed;
|
|
120
|
-
break;
|
|
121
|
-
default: t = this.labels.stepPending;
|
|
122
|
-
}
|
|
123
|
-
if (e === "in-progress") return r`
|
|
124
|
-
<div
|
|
125
|
-
class="step-icon step-icon-in-progress"
|
|
126
|
-
aria-label=${t}
|
|
127
|
-
role="img"
|
|
128
|
-
>
|
|
129
|
-
<div class="step-dot"></div>
|
|
130
|
-
</div>
|
|
131
|
-
`;
|
|
132
|
-
let n;
|
|
133
|
-
switch (e) {
|
|
134
|
-
case "pending":
|
|
135
|
-
n = d;
|
|
136
|
-
break;
|
|
137
|
-
case "completed":
|
|
138
|
-
n = u;
|
|
139
|
-
break;
|
|
140
|
-
case "error":
|
|
141
|
-
n = f;
|
|
142
|
-
break;
|
|
143
|
-
default: n = d;
|
|
144
|
-
}
|
|
145
|
-
return r`
|
|
146
|
-
<div
|
|
147
|
-
class="step-icon step-icon-${e}"
|
|
148
|
-
aria-label=${t}
|
|
149
|
-
role="img"
|
|
150
|
-
>
|
|
151
|
-
${p(n)}
|
|
152
|
-
</div>
|
|
153
|
-
`;
|
|
154
|
-
}
|
|
155
|
-
_renderChevron(e, t) {
|
|
156
|
-
return r`<div class="step-chevron ${t ? "" : "hidden"}">
|
|
157
|
-
${p(e ? l : c)}
|
|
158
|
-
</div>`;
|
|
159
|
-
}
|
|
160
|
-
_renderSubsteps(e) {
|
|
161
|
-
let t = e.length - 1;
|
|
162
|
-
return e.map((e, n) => this._renderSubstep(e, n === 0, n === t));
|
|
163
|
-
}
|
|
164
|
-
_renderSubstep(e, t, n) {
|
|
165
|
-
let i = this._mapStatus(e.status), a = this._interpolateDescription(e), o = ["substep"];
|
|
166
|
-
return t && o.push("is-first"), n && o.push("is-last"), r`
|
|
167
|
-
<div class=${o.join(" ")}>
|
|
168
|
-
<div class="substep-bullet substep-bullet-${i}"></div>
|
|
169
|
-
<div class="substep-text substep-text-${i}">${a}</div>
|
|
170
|
-
</div>
|
|
171
|
-
`;
|
|
172
|
-
}
|
|
173
|
-
_renderStep(e) {
|
|
174
|
-
let t = this._mapStatus(e.status), n = this.displayMode === "compact", a = this._interpolateDescription(e) || e.step, o = !n && e.children && e.children.length > 0, s = this._isNodeExpanded(e.id), c = `substeps-${e.id}`;
|
|
175
|
-
return r`
|
|
176
|
-
<div class="step">
|
|
177
|
-
<div
|
|
178
|
-
class="step-header ${o ? "has-substeps" : ""}"
|
|
179
|
-
role=${o ? "button" : "status"}
|
|
180
|
-
aria-expanded=${o ? s : i}
|
|
181
|
-
aria-controls=${o ? c : i}
|
|
182
|
-
tabindex=${o ? 0 : i}
|
|
183
|
-
@click=${o ? () => this._toggleNodeExpansion(e.id) : i}
|
|
184
|
-
@keydown=${o ? (t) => {
|
|
185
|
-
(t.key === "Enter" || t.key === " ") && (t.preventDefault(), this._toggleNodeExpansion(e.id));
|
|
186
|
-
} : i}
|
|
187
|
-
>
|
|
188
|
-
${this._renderStepIcon(t)}
|
|
189
|
-
<div class="step-content">
|
|
190
|
-
<div class="step-name">${a}</div>
|
|
191
|
-
${n ? i : this._renderChevron(s, !!o)}
|
|
192
|
-
</div>
|
|
193
|
-
</div>
|
|
194
|
-
${o ? r`
|
|
195
|
-
<div
|
|
196
|
-
id=${c}
|
|
197
|
-
class="substeps-container ${s ? "expanded" : ""}"
|
|
198
|
-
>
|
|
199
|
-
<div class="substeps">
|
|
200
|
-
${this._renderSubsteps(e.children ?? [])}
|
|
201
|
-
</div>
|
|
202
|
-
</div>
|
|
203
|
-
` : i}
|
|
204
|
-
</div>
|
|
205
|
-
`;
|
|
206
|
-
}
|
|
207
|
-
_toggleCondensed() {
|
|
208
|
-
this._condensedExpanded = !this._condensedExpanded, this.requestUpdate();
|
|
209
|
-
}
|
|
210
|
-
_handleCondensedKeydown(e) {
|
|
211
|
-
(e.key === "Enter" || e.key === " ") && (e.preventDefault(), this._toggleCondensed());
|
|
212
|
-
}
|
|
213
|
-
_renderCondensed() {
|
|
214
|
-
let e = this.progress?.children?.filter((e) => e.status === "success").length ?? 0, t = (e === 1 ? this.labels.condensedSingular : this.labels.condensedPlural).replace("{{count}}", String(e));
|
|
215
|
-
return r`
|
|
216
|
-
<div class="condensed-container">
|
|
217
|
-
<div
|
|
218
|
-
class="condensed-toggle"
|
|
219
|
-
role="button"
|
|
220
|
-
tabindex="0"
|
|
221
|
-
aria-expanded=${this._condensedExpanded}
|
|
222
|
-
@click=${this._toggleCondensed}
|
|
223
|
-
@keydown=${this._handleCondensedKeydown}
|
|
224
|
-
>
|
|
225
|
-
<span class="condensed-toggle-text">${t}</span>
|
|
226
|
-
<span
|
|
227
|
-
class="condensed-toggle-chevron ${this._condensedExpanded ? "expanded" : ""}"
|
|
228
|
-
>
|
|
229
|
-
${p(c)}
|
|
230
|
-
</span>
|
|
231
|
-
</div>
|
|
232
|
-
${this._condensedExpanded ? r`<div class="condensed-steps">${this._renderSteps()}</div>` : i}
|
|
233
|
-
</div>
|
|
234
|
-
`;
|
|
235
|
-
}
|
|
236
|
-
_renderSteps() {
|
|
237
|
-
return (this.progress?.children ?? []).map((e) => this._renderStep(e));
|
|
238
|
-
}
|
|
239
|
-
render() {
|
|
240
|
-
return this.condensed ? r`
|
|
241
|
-
<div class="progress-steps-container" role="status" aria-live="polite">
|
|
242
|
-
${this._renderCondensed()}
|
|
243
|
-
</div>
|
|
244
|
-
` : r`
|
|
245
|
-
<div class="progress-steps-container" role="status" aria-live="polite">
|
|
246
|
-
${this._renderSteps()}
|
|
247
|
-
</div>
|
|
248
|
-
`;
|
|
249
|
-
}
|
|
250
|
-
};
|
|
251
|
-
//#endregion
|
|
252
|
-
//#region src/components/progress-steps/index.ts
|
|
253
|
-
t([o({ type: Object })], g.prototype, "progress", void 0), t([o({ type: String })], g.prototype, "locale", void 0), t([o({ type: Boolean })], g.prototype, "collapsed", void 0), t([o({
|
|
254
|
-
type: String,
|
|
255
|
-
attribute: "display-mode"
|
|
256
|
-
})], g.prototype, "displayMode", void 0), t([o({ type: Boolean })], g.prototype, "condensed", void 0), t([o({ type: Object })], g.prototype, "labels", void 0), t([o({
|
|
257
|
-
type: Boolean,
|
|
258
|
-
attribute: "no-animate",
|
|
259
|
-
reflect: !0
|
|
260
|
-
})], g.prototype, "noAnimate", void 0), t([s()], g.prototype, "_condensedExpanded", void 0), t([s()], g.prototype, "_expandedNodes", void 0), t([s()], g.prototype, "_autoExpandedNodes", void 0), t([s()], g.prototype, "_manuallyExpandedNodes", void 0), customElements.get("luzmo-progress-steps") || customElements.define("luzmo-progress-steps", g);
|
|
261
|
-
//#endregion
|
|
262
|
-
export { g as t };
|
|
@@ -1,22 +0,0 @@
|
|
|
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-DNHNlrty.cjs"),r=require("./roving-tabindex-BoPao4td.cjs"),i=require("./field-group-Dd5xYczm.cjs");let a=require("lit"),o=require("lit/decorators.js");var s=`@media (forced-colors:active){:host{--highcontrast-radio-neutral-content-color:CanvasText;--highcontrast-radio-neutral-content-color-hover:CanvasText;--highcontrast-radio-neutral-content-color-down:CanvasText;--highcontrast-radio-neutral-content-color-focus:CanvasText;--highcontrast-radio-button-border-color-default:ButtonText;--highcontrast-radio-button-border-color-hover:Highlight;--highcontrast-radio-button-border-color-down:ButtonText;--highcontrast-radio-button-border-color-focus:Highlight;--highcontrast-radio-emphasized-accent-color:ButtonText;--highcontrast-radio-emphasized-accent-color-hover:Highlight;--highcontrast-radio-emphasized-accent-color-down:ButtonText;--highcontrast-radio-emphasized-accent-color-focus:Highlight;--highcontrast-radio-button-checked-border-color-default:Highlight;--highcontrast-radio-button-checked-border-color-hover:Highlight;--highcontrast-radio-button-checked-border-color-down:Highlight;--highcontrast-radio-button-checked-border-color-focus:Highlight;--highcontrast-radio-disabled-content-color:GrayText;--highcontrast-radio-disabled-border-color:GrayText;--highcontrast-radio-focus-indicator-color:CanvasText}#button:after{forced-color-adjust:none}}:host{vertical-align:top;min-block-size:var(--luzmo-radio-height,var(--radio-height));max-inline-size:100%;font-family:var(--luzmo-radio-font-family,var(--luzmo-font-family));align-items:flex-start;display:inline-flex;position:relative}:host(:active) #button:before{border-color:var(--highcontrast-radio-button-border-color-down,var(--luzmo-radio-button-border-color-down,var(--radio-button-border-color-down)))}:host(:active[checked]) #input+#button:before{border-color:var(--highcontrast-radio-button-checked-border-color-down,var(--luzmo-radio-button-checked-border-color-down,var(--radio-button-checked-border-color-down)))}:host(:active) #label{color:var(--highcontrast-radio-neutral-content-color-down,var(--luzmo-radio-neutral-content-color-down,var(--radio-neutral-content-color-down)))}:host(:focus-visible) #button:before{border-color:var(--highcontrast-radio-button-border-color-focus,var(--luzmo-radio-button-border-color-focus,var(--radio-button-border-color-focus)))}:host(:focus-visible) #button:after{border-style:solid;border-color:var(--highcontrast-radio-focus-indicator-color,var(--luzmo-radio-focus-indicator-color,var(--radio-focus-indicator-color)));border-width:var(--luzmo-radio-focus-indicator-width,var(--radio-focus-indicator-width));inline-size:calc(var(--radio-button-control-size) + var(--radio-focus-indicator-gap) * 2);block-size:calc(var(--radio-button-control-size) + var(--radio-focus-indicator-gap) * 2)}:host(:focus-visible[checked]) #input+#button:before{border-color:var(--highcontrast-radio-button-checked-border-color-focus,var(--luzmo-radio-button-checked-border-color-focus,var(--radio-button-checked-border-color-focus)))}:host(:focus-visible) #label{color:var(--highcontrast-radio-neutral-content-color-focus,var(--luzmo-radio-neutral-content-color-focus,var(--radio-neutral-content-color-focus)))}:host([readonly]) #input:read-only{cursor:auto}:host([readonly]) #button{clip:rect(1px, 1px, 1px, 1px);clip-path:inset(50%);position:fixed;inset-block-end:100%;inset-inline-end:100%}:host([readonly][checked][disabled]) #input~#label,:host([readonly][disabled]) #input~#label,:host([readonly]) #label{color:var(--highcontrast-radio-neutral-content-color,var(--luzmo-radio-neutral-content-color,var(--radio-neutral-content-color)));margin-inline-start:0}:host([emphasized][checked]) #input+#button:before{border-color:var(--highcontrast-radio-emphasized-accent-color,var(--luzmo-radio-emphasized-accent-color,var(--radio-emphasized-accent-color)))}@media (hover:hover){:host(:hover) #button:before{border-color:var(--highcontrast-radio-button-border-color-hover,var(--luzmo-radio-button-border-color-hover,var(--radio-button-border-color-hover)))}:host([checked]:hover) #input+#button:before{border-color:var(--highcontrast-radio-button-checked-border-color-hover,var(--luzmo-radio-button-checked-border-color-hover,var(--radio-button-checked-border-color-hover)))}:host(:hover) #label{color:var(--highcontrast-radio-neutral-content-color-hover,var(--luzmo-radio-neutral-content-color-hover,var(--radio-neutral-content-color-hover)))}:host([emphasized][checked]:hover) #input+#button:before{border-color:var(--highcontrast-radio-emphasized-accent-color-hover,var(--luzmo-radio-emphasized-accent-color-hover,var(--radio-emphasized-accent-color-hover)))}}:host([emphasized]:active[checked]) #input+#button:before{border-color:var(--highcontrast-radio-emphasized-accent-color-down,var(--luzmo-radio-emphasized-accent-color-down,var(--radio-emphasized-accent-color-down)))}:host([emphasized]:focus-visible[checked]) #input+#button:before{border-color:var(--highcontrast-radio-emphasized-accent-color-focus,var(--luzmo-radio-emphasized-accent-color-focus,var(--radio-emphasized-accent-color-focus)))}:host([checked][disabled]) #input+#button:before,:host([disabled]) #input+#button:before{border-color:var(--highcontrast-radio-disabled-border-color,var(--luzmo-radio-disabled-border-color,var(--radio-disabled-border-color)))}:host([checked][disabled]) #input~#label,:host([disabled]) #input~#label{color:var(--highcontrast-radio-disabled-content-color,var(--luzmo-radio-disabled-content-color,var(--radio-disabled-content-color)))}#input{font-family:inherit;font-size:100%;line-height:var(--luzmo-radio-line-height,var(--radio-line-height));box-sizing:border-box;opacity:0;z-index:1;cursor:pointer;block-size:100%;inline-size:100%;margin:0;padding:0;position:absolute;overflow:visible}:host([disabled]) #input{cursor:default}:host([checked]) #input+#button:before{border-width:calc(var(--radio-button-control-size) / 2 - var(--radio-button-selection-indicator) / 2);border-color:var(--highcontrast-radio-button-checked-border-color-default,var(--luzmo-radio-button-checked-border-color-default,var(--radio-button-checked-border-color-default)))}#input:focus-visible+#button:after{border-width:var(--luzmo-radio-focus-indicator-width,var(--radio-focus-indicator-width));border-color:var(--highcontrast-radio-focus-indicator-color,var(--luzmo-radio-focus-indicator-color,var(--radio-focus-indicator-color)));inline-size:calc(var(--radio-button-control-size) + var(--radio-focus-indicator-gap) * 2);block-size:calc(var(--radio-button-control-size) + var(--radio-focus-indicator-gap) * 2);border-style:solid}#label{text-align:start;font-size:var(--luzmo-radio-font-size,var(--radio-font-size));color:var(--highcontrast-radio-neutral-content-color,var(--luzmo-radio-neutral-content-color,var(--radio-neutral-content-color)));line-height:var(--luzmo-radio-line-height,var(--radio-line-height));transition:color var(--luzmo-radio-animation-duration,var(--radio-animation-duration)) ease-in-out;margin-block-start:var(--radio-label-top-to-text);margin-block-end:var(--radio-label-bottom-to-text);margin-inline-start:var(--luzmo-radio-text-to-control,var(--radio-text-to-control))}#label:lang(ja),#label:lang(ko),#label:lang(zh){line-height:var(--luzmo-radio-line-height-cjk,var(--radio-line-height-cjk))}#button{box-sizing:border-box;inline-size:var(--luzmo-radio-button-control-size,var(--radio-button-control-size));block-size:var(--luzmo-radio-button-control-size,var(--radio-button-control-size));flex-grow:0;flex-shrink:0;margin-block-start:var(--luzmo-radio-button-top-to-control,var(--radio-button-top-to-control));position:relative}#button:before{z-index:0;content:"";box-sizing:border-box;inline-size:var(--luzmo-radio-button-control-size,var(--radio-button-control-size));block-size:var(--luzmo-radio-button-control-size,var(--radio-button-control-size));background-color:var(--highcontrast-radio-button-background-color,var(--luzmo-radio-button-background-color,var(--radio-button-background-color)));border-width:var(--luzmo-radio-border-width,var(--radio-border-width));border-color:var(--highcontrast-radio-button-border-color-default,var(--luzmo-radio-button-border-color-default,var(--radio-button-border-color-default)));transition:border var(--luzmo-radio-animation-duration,var(--radio-animation-duration)) ease-in-out, box-shadow var(--luzmo-radio-animation-duration,var(--radio-animation-duration)) ease-in-out;border-style:solid;border-radius:50%;display:block;position:absolute}#button:after{content:"";transition:opacity var(--luzmo-radio-animation-duration,var(--radio-animation-duration)) ease-out, margin var(--luzmo-radio-animation-duration,var(--radio-animation-duration)) ease-out;border-radius:50%;display:block;position:absolute;inset-block-start:50%;inset-inline-start:50%;transform:translate(-50%)translateY(-50%)}:host:is(:lang(ae),:lang(ar),:lang(arc),:lang(bcc),:lang(bqi),:lang(ckb),:lang(dv),:lang(fa),:lang(glk),:lang(he),:lang(ku),:lang(mzn),:lang(nqo),:lang(pnb),:lang(ps),:lang(sd),:lang(ug),:lang(ur),:lang(yi)) #button:after{transform:translate(50%)translateY(-50%)}:host{--radio-button-border-color-default:var(--luzmo-border-color-full);--radio-button-border-color-hover:var(--luzmo-border-color-full-hover);--radio-button-border-color-down:var(--luzmo-border-color-full-hover);--radio-button-border-color-focus:var(--luzmo-border-color-full-hover);--radio-neutral-content-color:var(--luzmo-selected-color-hard);--radio-neutral-content-color-hover:var(--luzmo-selected-color-hard-hover);--radio-neutral-content-color-down:var(--luzmo-selected-color-hard-down);--radio-neutral-content-color-focus:var(--luzmo-selected-color-hard-focus);--radio-button-selection-indicator:var(--luzmo-spacing-2);--radio-focus-indicator-width:var(--luzmo-indicator-width);--radio-focus-indicator-gap:var(--luzmo-indicator-gap);--radio-focus-indicator-color:var(--luzmo-primary);--radio-disabled-content-color:var(--luzmo-disabled-color);--radio-disabled-border-color:var(--luzmo-border-color-disabled);--radio-emphasized-accent-color:var(--luzmo-primary);--radio-emphasized-accent-color-hover:var(--luzmo-primary-hover);--radio-emphasized-accent-color-down:var(--luzmo-primary-down);--radio-emphasized-accent-color-focus:var(--luzmo-primary-focus);--radio-border-width:calc(var(--luzmo-border-width) * 2);--radio-button-background-color:var(--luzmo-background-color);--radio-button-checked-border-color-default:var(--luzmo-selected-color-hard);--radio-button-checked-border-color-hover:var(--luzmo-selected-color-hard-hover);--radio-button-checked-border-color-down:var(--luzmo-selected-color-hard-down);--radio-button-checked-border-color-focus:var(--luzmo-selected-color-hard-focus);--radio-line-height:1.3;--radio-animation-duration:var(--luzmo-animation-duration);--radio-height:32px;--radio-button-control-size:14px;--radio-text-to-control:10px;--radio-label-top-to-text:6px;--radio-label-bottom-to-text:9px;--radio-button-top-to-control:9px;--radio-font-size:14px}:host(:lang(ja)),:host(:lang(zh)),:host(:lang(ko)){--radio-line-height-cjk:1.5}:host{--radio-height:var(--luzmo-component-height);--radio-button-control-size:14px;--radio-text-to-control:10px;--radio-label-top-to-text:7px;--radio-label-bottom-to-text:9px;--radio-button-top-to-control:9px;--radio-font-size:14px}:host([size=s]){--radio-height:var(--luzmo-component-height-s);--radio-button-control-size:var(--luzmo-spacing-4);--radio-text-to-control:9px;--radio-label-top-to-text:var(--luzmo-spacing-2);--radio-label-bottom-to-text:5px;--radio-button-top-to-control:6px;--radio-font-size:var(--luzmo-spacing-4)}:host([size=l]){--radio-height:var(--luzmo-component-height-l);--radio-button-control-size:16px;--radio-text-to-control:11px;--radio-label-top-to-text:calc(var(--luzmo-spacing-3) + var(--luzmo-spacing-1));--radio-label-bottom-to-text:11px;--radio-button-top-to-control:var(--luzmo-spacing-4);--radio-font-size:16px}:host([size=xl]){--radio-height:var(--luzmo-component-height-xl);--radio-button-control-size:18px;--radio-text-to-control:13px;--radio-label-top-to-text:var(--luzmo-spacing-4);--radio-label-bottom-to-text:14px;--radio-button-top-to-control:15px;--radio-font-size:18px}:host([emphasized]){--radio-button-checked-border-color-default:var(--luzmo-primary);--radio-button-checked-border-color-hover:var(--luzmo-primary-hover);--radio-button-checked-border-color-down:var(--luzmo-primary-down);--radio-button-checked-border-color-focus:var(--luzmo-primary-focus)}:host(:focus){outline:none}:host([disabled]){pointer-events:none}:host([dir=rtl]) #button:after{transform:translate(50%)translateY(-50%)}`,c=class extends t.n(n.t(e.n),{noDefaultSize:!0}){constructor(...e){super(...e),this.autofocus=!1,this.value=``,this.checked=!1,this.disabled=!1,this.emphasized=!1,this.invalid=!1,this.readonly=!1}static get styles(){return[(0,a.unsafeCSS)(s)]}click(){this.disabled||this.readonly||this.activate()}manageAutoFocus(){this.autofocus&&(this.dispatchEvent(new KeyboardEvent(`keydown`,{code:`Tab`})),this.focus())}activate(){this.disabled||this.readonly||this.checked||(this.checked=!0,this.dispatchEvent(new Event(`change`,{bubbles:!0,composed:!0})))}handleKeyup(e){e.code===`Space`&&this.activate()}render(){return a.html`
|
|
19
|
-
<div id="input"></div>
|
|
20
|
-
<span id="button" part="control"></span>
|
|
21
|
-
<span id="label" role="presentation"><slot></slot></span>
|
|
22
|
-
`}firstUpdated(e){super.firstUpdated(e),this.setAttribute(`role`,`radio`),this.hasAttribute(`tabindex`)||(this.tabIndex=0),this.manageAutoFocus(),this.addEventListener(`click`,this.activate),this.addEventListener(`keyup`,this.handleKeyup)}updated(e){super.updated(e),e.has(`invalid`)&&(this.invalid?this.setAttribute(`aria-invalid`,`true`):this.removeAttribute(`aria-invalid`)),e.has(`checked`)&&(this.checked?this.setAttribute(`aria-checked`,`true`):this.setAttribute(`aria-checked`,`false`)),e.has(`disabled`)&&(this.disabled?this.setAttribute(`aria-disabled`,`true`):this.removeAttribute(`aria-disabled`))}};e.t([(0,o.property)({type:Boolean})],c.prototype,`autofocus`,void 0),e.t([(0,o.property)({type:String,reflect:!0})],c.prototype,`value`,void 0),e.t([(0,o.property)({type:Boolean,reflect:!0})],c.prototype,`checked`,void 0),e.t([(0,o.property)({type:Boolean,reflect:!0})],c.prototype,`disabled`,void 0),e.t([(0,o.property)({type:Boolean,reflect:!0})],c.prototype,`emphasized`,void 0),e.t([(0,o.property)({type:Boolean,reflect:!0})],c.prototype,`invalid`,void 0),e.t([(0,o.property)({type:Boolean,reflect:!0})],c.prototype,`readonly`,void 0);var l=class extends n.t(i.t){constructor(...e){super(...e),this.name=``,this.manualSelection=!1,this.rovingTabindexController=new r.t(this,{focusInIndex:e=>e.findIndex(e=>this.selected?!e.disabled&&e.value===this.selected:!e.disabled),elementEnterAction:e=>{!this.manualSelection&&!e.readonly&&this._setSelected(e.value)},elements:()=>this.buttons,isFocusableElement:e=>!e.disabled}),this.selected=``}get buttons(){return[...this.querySelectorAll(`luzmo-radio`)]}focus(){this.rovingTabindexController.focus()}_setSelected(e){if(e===this.selected)return;let t=this.selected,n=e?this.querySelector(`luzmo-radio[value="${CSS.escape(e)}"]`):void 0;if(this.selected=n?e:``,!this.dispatchEvent(new Event(`change`,{cancelable:!0,bubbles:!0,composed:!0}))){this.selected=t;return}this.validateRadios()}willUpdate(e){if(!this.hasUpdated){this.setAttribute(`role`,`radiogroup`);let e=this.querySelector(`luzmo-radio[checked]`),t=e?e.value:``;if(this.selected=t||this.selected,this.selected&&this.selected!==t){let e=this.querySelector(`luzmo-radio[value="${CSS.escape(this.selected)}"]`);e&&(e.checked=!0)}this.shadowRoot.addEventListener(`change`,e=>{e.stopPropagation();let t=e.target;this._setSelected(t.value)})}e.has(`selected`)&&this.validateRadios()}async validateRadios(){let e=!1;this.hasUpdated||await this.updateComplete,this.buttons.map(t=>{t.checked=this.selected===t.value,e||=t.checked}),e||(this.selected=``)}handleSlotchange(){this.rovingTabindexController.clearElementCache()}};e.t([(0,o.property)({type:String})],l.prototype,`name`,void 0),e.t([(0,o.property)({type:Boolean,reflect:!0,attribute:`manual-selection`})],l.prototype,`manualSelection`,void 0),e.t([(0,o.property)({reflect:!0})],l.prototype,`selected`,void 0),customElements.get(`luzmo-radio`)||customElements.define(`luzmo-radio`,c),customElements.get(`luzmo-radio-group`)||customElements.define(`luzmo-radio-group`,l),Object.defineProperty(exports,"n",{enumerable:!0,get:function(){return c}}),Object.defineProperty(exports,"t",{enumerable:!0,get:function(){return l}});
|