@luzmo/lucero 0.0.26 → 0.0.29
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/components/accordion/index.cjs +4 -4
- package/components/accordion/index.js +4 -4
- package/components/action-bar/index.cjs +1 -1
- package/components/action-bar/index.js +6 -6
- package/components/action-button/index.cjs +2 -2
- package/components/action-button/index.js +5 -5
- package/components/action-group/index.cjs +1 -1
- package/components/action-group/index.js +1 -1
- package/components/{action-group-DngGfcr_.js → action-group-DBImibFn.js} +2 -2
- package/components/{action-group-hy1HZxOi.cjs → action-group-DJGMcRHb.cjs} +1 -1
- package/components/action-menu/index.cjs +2 -2
- package/components/action-menu/index.js +6 -6
- package/components/{async-directive-B0s_zDWg.cjs → async-directive-BX1T1e1_.cjs} +1 -1
- package/components/{async-directive-C0KryStG.js → async-directive-BfcqVjDp.js} +1 -1
- package/components/avatar/index.cjs +3 -3
- package/components/avatar/index.js +10 -10
- package/components/base-CBCg3yyw.cjs +40 -0
- package/components/{base-DroC2Znx.js → base-WsynuqaS.js} +54 -51
- package/components/button/index.cjs +1 -1
- package/components/button/index.js +6 -6
- package/components/{button-base-BRZtaOk8.js → button-base-DbkDzb71.js} +4 -4
- package/components/{button-base-CJc7kjJK.cjs → button-base-XgPLmwP-.cjs} +1 -1
- package/components/button-group/index.cjs +1 -1
- package/components/button-group/index.js +2 -2
- package/components/calendar/index.cjs +1 -1
- package/components/calendar/index.js +1 -1
- package/components/checkbox/index.cjs +1 -1
- package/components/checkbox/index.js +4 -4
- package/components/{checkbox-mixin-CcPwhZst.cjs → checkbox-mixin-BDN0dBtS.cjs} +1 -1
- package/components/{checkbox-mixin-DbcpHFBw.js → checkbox-mixin-Do7EgtpQ.js} +2 -2
- package/components/{class-map-DuvNig0r.cjs → class-map-Di1D_rCm.cjs} +1 -1
- package/components/{class-map-CjcRhurN.js → class-map-NbVXqBU0.js} +1 -1
- package/components/{clear-button-Nwq4REOv.js → clear-button-DoeRUWQ3.js} +16 -16
- package/components/clear-button-Qi1pMA5S.cjs +18 -0
- package/components/close-button-BFMBEw3q.cjs +18 -0
- package/components/{close-button-9l1TxW7Y.cjs → close-button-BWXdHSx3.js} +34 -1
- package/components/color-area/index.cjs +1 -1
- package/components/color-area/index.js +3 -3
- package/components/color-field/index.cjs +1 -1
- package/components/color-field/index.js +2 -2
- package/components/color-handle/index.cjs +1 -1
- package/components/color-handle/index.js +2 -2
- package/components/color-loupe/index.cjs +1 -1
- package/components/color-loupe/index.js +1 -1
- package/components/{color-loupe-Ck2IRn4K.cjs → color-loupe-CaA_Lfkk.cjs} +1 -1
- package/components/{color-loupe-B0mH9Jyx.js → color-loupe-CmMsXbjT.js} +1 -1
- package/components/color-menu/index.cjs +4 -4
- package/components/color-menu/index.js +4 -4
- package/components/color-picker/index.cjs +1 -1
- package/components/color-picker/index.js +3 -3
- package/components/color-slider/index.cjs +1 -1
- package/components/color-slider/index.js +5 -5
- package/components/date-time-picker/index.cjs +3 -3
- package/components/date-time-picker/index.js +10 -10
- package/components/directive-helpers-Cm6gitnu.js +62 -0
- package/components/{directive-helpers-OG6wWKJt.js → directive-helpers-DyIRTWwA.cjs} +2 -8
- package/components/divider/index.cjs +1 -1
- package/components/divider/index.js +5 -5
- package/components/{divider.module-CXMNveQc.cjs → divider.module-DDvBo9zo.cjs} +1 -1
- package/components/{divider.module-DwOuLGU3.js → divider.module-DoQWQEIJ.js} +1 -1
- package/components/field-group/index.cjs +1 -1
- package/components/field-group/index.js +1 -1
- package/components/{field-group-ClxYbp6Z.js → field-group-DXfBWrkO.js} +2 -2
- package/components/{field-group-CIach2C_.cjs → field-group-DkGst3r5.cjs} +1 -1
- package/components/field-label/index.cjs +1 -1
- package/components/field-label/index.js +1 -1
- package/components/{field-label-BaOJ2i-l.js → field-label-CZ2zzChK.js} +2 -2
- package/components/{field-label-CkZCXvyb.cjs → field-label-mO1AkUgR.cjs} +1 -1
- package/components/flow-D-0MTYCm.js +527 -0
- package/components/flow-DM3dNAKs.cjs +30 -0
- package/components/{focusable-Dy9nRVST.js → focusable-BxtpnzWp.js} +1 -1
- package/components/{focusable-BW4I5ppi.cjs → focusable-EbipgXRh.cjs} +1 -1
- package/components/icon/index.cjs +1 -1
- package/components/icon/index.js +3 -3
- package/components/{if-defined-D7nbLM5n.cjs → if-defined-C9YGdo33.cjs} +1 -1
- package/components/{if-defined-CUCu7LSf.js → if-defined-DOaE2coe.js} +1 -1
- package/components/{index-C6wHQ74z.js → index-A-yOTB_d.js} +20 -20
- package/components/index-BLWuwZXx.cjs +113 -0
- package/components/index.cjs +1 -1
- package/components/index.js +132 -127
- package/components/infield-button/index.cjs +1 -1
- package/components/infield-button/index.js +3 -3
- package/components/label/index.cjs +1 -1
- package/components/label/index.js +1 -1
- package/components/{like-anchor-CkIPVvtI.js → like-anchor-Bvn_vLQ8.js} +2 -2
- package/components/{like-anchor-s-5FEzRQ.cjs → like-anchor-sod1C1fR.cjs} +1 -1
- package/components/luzmo-icons-DbwDQtuO.js +229 -0
- package/components/luzmo-icons-DletXGWU.cjs +29 -0
- package/components/{manage-help-text-DGwDhPtP.cjs → manage-help-text-DhgARkZX.cjs} +1 -1
- package/components/{manage-help-text-BzyCpgqN.js → manage-help-text-syYnjKGL.js} +2 -2
- package/components/menu/index.cjs +8 -8
- package/components/menu/index.js +19 -19
- package/components/multi-language-field/index.cjs +1 -1
- package/components/multi-language-field/index.js +3 -3
- package/components/number-field/index.cjs +3 -3
- package/components/number-field/index.js +10 -10
- package/components/{observe-slot-text-BMloiRX5.js → observe-slot-text-BPfIQQtz.js} +1 -1
- package/components/{observe-slot-text-BzdHQBH3.cjs → observe-slot-text-Ceb7SvYT.cjs} +1 -1
- package/components/options/index.cjs +104 -0
- package/components/options/index.d.ts +13 -0
- package/components/options/index.js +1172 -0
- package/components/options/option.d.ts +70 -0
- package/components/options/options-divider.d.ts +14 -0
- package/components/options/options.d.ts +85 -0
- package/components/overlay/index.cjs +4 -4
- package/components/overlay/index.js +8 -8
- package/components/{overlay-D4oZnKKd.js → overlay-BBNyvs8F.js} +4 -4
- package/components/{overlay-DAVu8dy8.cjs → overlay-o0tLxsk-.cjs} +1 -1
- package/components/{pending-state-xRhujC3J.js → pending-state-C5OtdXCm.js} +2 -2
- package/components/{pending-state-CkibRs0D.cjs → pending-state-gs6IxYtB.cjs} +1 -1
- package/components/picker/index.cjs +1 -1
- package/components/picker/index.js +2 -2
- package/components/picker/picker.d.ts +2 -2
- package/components/picker-CM3kN655.js +461 -0
- package/components/picker-C__p3kzA.cjs +123 -0
- package/components/picker-button/index.cjs +2 -2
- package/components/picker-button/index.js +6 -6
- package/components/popover/index.cjs +1 -1
- package/components/popover/index.js +1 -1
- package/components/{popover-Cx4MhaoE.js → popover-DjX0aAnY.js} +2 -2
- package/components/{popover-DBQ1YYW6.cjs → popover-KFfO0IYL.cjs} +1 -1
- package/components/progress-circle/index.cjs +1 -1
- package/components/progress-circle/index.js +1 -1
- package/components/{progress-circle-BGubjTvj.cjs → progress-circle-B12-2Gww.cjs} +1 -1
- package/components/{progress-circle-B25wyiBi.js → progress-circle-CWGsfHnp.js} +3 -3
- package/components/radio/index.cjs +1 -1
- package/components/radio/index.js +3 -3
- package/components/search/index.cjs +4 -4
- package/components/search/index.js +5 -5
- package/components/select/index.cjs +156 -0
- package/components/select/index.d.ts +7 -0
- package/components/select/index.js +580 -0
- package/components/{multi-picker/multi-picker.d.ts → select/select.d.ts} +83 -59
- package/components/{sized-mixin-CDhX3fJn.cjs → sized-mixin-CPxE5C96.cjs} +1 -1
- package/components/{sized-mixin-Y_QuYtjJ.js → sized-mixin-D4ACoVUr.js} +1 -1
- package/components/slider/index.cjs +1 -1
- package/components/slider/index.js +2 -2
- package/components/{state-Bq6oXknJ.cjs → state-D8JEtYqe.cjs} +1 -1
- package/components/{state-BF7jO1DT.js → state-Deh-vKYE.js} +1 -1
- package/components/strategies-Bc3hG-HA.js +195 -0
- package/components/strategies-DGwsR7Xf.cjs +18 -0
- package/components/{streaming-listener-Cm6s-WvF.cjs → streaming-listener-B00MvALi.cjs} +1 -1
- package/components/{streaming-listener-Dxbr_Jiv.js → streaming-listener-CP-JE6Fa.js} +2 -2
- package/components/{style-map-Cp3I-AN3.cjs → style-map-CeilmSgs.cjs} +1 -1
- package/components/{style-map-DqptyE0A.js → style-map-IgqIKvlE.js} +1 -1
- package/components/swatch/index.cjs +2 -2
- package/components/swatch/index.js +11 -11
- package/components/switch/index.cjs +1 -1
- package/components/switch/index.js +4 -4
- package/components/tabs/index.cjs +5 -5
- package/components/tabs/index.js +10 -10
- package/components/tags/index.cjs +1 -1
- package/components/tags/index.js +3 -3
- package/components/text-field/index.cjs +2 -2
- package/components/text-field/index.js +8 -8
- package/components/{text-field-DWC0tpq4.js → text-field-BIADXoLC.js} +11 -11
- package/components/{text-field-CThL0T_y.cjs → text-field-D5d_Gt0t.cjs} +5 -5
- package/components/toast/index.cjs +4 -4
- package/components/toast/index.js +5 -5
- package/components/tooltip/index.cjs +1 -1
- package/components/tooltip/index.js +3 -3
- package/components/unit-input/index.cjs +3 -3
- package/components/unit-input/index.js +4 -4
- package/components/utils.cjs +1 -1
- package/components/utils.js +4 -4
- package/custom-elements.json +1 -1
- package/index.d.ts +2 -1
- package/package.json +11 -6
- package/{components/picker → utils/button-interaction-controllers}/interaction-controller.d.ts +6 -5
- package/{components/picker → utils/button-interaction-controllers}/mobile-controller.d.ts +2 -2
- package/components/base-CTSOJw6c.cjs +0 -40
- package/components/clear-button-BkQsOIoW.cjs +0 -18
- package/components/close-button-7ut4xT4f.js +0 -51
- package/components/directive-helpers-BQRjDUVe.cjs +0 -22
- package/components/index-CbaDCtQl.cjs +0 -113
- package/components/multi-picker/index.cjs +0 -127
- package/components/multi-picker/index.d.ts +0 -7
- package/components/multi-picker/index.js +0 -502
- package/components/picker-D0wr8mRN.js +0 -460
- package/components/picker-PMfW3n8Z.cjs +0 -123
- package/components/strategies-CzfvQU_H.js +0 -192
- package/components/strategies-D_cIzAJE.cjs +0 -18
- /package/{components/picker → utils/button-interaction-controllers}/desktop-controller.d.ts +0 -0
- /package/{components/picker → utils/button-interaction-controllers}/strategies.d.ts +0 -0
|
@@ -15,6 +15,6 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../base-CTSOJw6c.cjs"),s=require("../pending-state-CkibRs0D.cjs"),g=require("../sized-mixin-CDhX3fJn.cjs"),v=require("../button-base-CJc7kjJK.cjs"),d=require("../clear-button-BkQsOIoW.cjs"),i=require("../close-button-9l1TxW7Y.cjs"),h=':host{cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;font-family:var(--luzmo-button-font-family, var(--luzmo-font-family));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, 1.3);text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out;justify-content:center;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;overflow:visible}:host(:focus){outline:none}:host .is-disabled,:host([disabled]){cursor:default}:host:after{margin:calc(-1 * var(--luzmo-button-focus-indicator-gap, var(--luzmo-focus-indicator-gap, 2px)));transition:opacity var(--luzmo-button-animation-duration, var(--luzmo-button-animation-duration, var(--luzmo-animation-duration))) ease-out,margin var(--luzmo-button-animation-duration, var(--luzmo-button-animation-duration, var(--luzmo-animation-duration))) ease-out;display:block;inset-block:0;inset-inline:0}:host(:focus-visible):after{margin:calc(var(--luzmo-focus-indicator-gap, 2px) * -2)}#label{place-self:center}#label[hidden]{display:none}:host{--luzmo-progress-circle-position: absolute;border-radius:var(--luzmo-button-border-radius, var(--button-border-radius));border-width:var(--luzmo-button-border-width, var(--button-border-width));font-size:var(--luzmo-button-font-size, var(--button-font-size));font-weight:var(--luzmo-button-font-weight, 600);gap:var(--luzmo-button-padding-label-to-icon, var(--button-padding-label-to-icon));max-inline-size:none;max-inline-size:var(--luzmo-button-max-inline-size, none);min-inline-size:var(--luzmo-button-min-width, var(--button-min-width));min-block-size:var(--luzmo-button-height, var(--button-height));padding-block:0;padding-inline:var(--luzmo-button-edge-to-text, var(--button-edge-to-text));color:inherit;margin-block:0;margin-block:var(--luzmo-button-margin-block, 0);border-style:solid;margin-inline-start:var(--luzmo-button-margin-left, 0);margin-inline-end:var(--luzmo-button-margin-right, 0);position:relative}:host(:is(:active,[active])){box-shadow:none}::slotted([slot=icon]){--_icon-size-difference: max( 0px, var(--button-intended-icon-size) - var( --icon-size, var(--button-intended-icon-size) ) );color:inherit;flex-shrink:0;align-self:flex-start;margin-block-start:var(--luzmo-button-icon-margin-block-start, max(0px, var(--luzmo-button-top-to-icon, var(--button-top-to-icon)) - var(--luzmo-button-border-width, var(--button-border-width)) + var(--_icon-size-difference, 0px) / 2));margin-inline-start:calc(var(--luzmo-button-edge-to-visual, var(--button-edge-to-visual)) - var(--luzmo-button-edge-to-text, var(--button-edge-to-text)))}:host([icon-only]){min-inline-size:unset;padding:calc(var(--luzmo-button-edge-to-visual-only, var(--button-edge-to-visual-only)) - var(--luzmo-button-border-width, var(--button-border-width)));border-radius:50%}:host([icon-only]) ::slotted([slot=icon]){align-self:center;margin-block-start:0;margin-inline-start:0}:host([icon-only]):after{border-radius:50%}#label{line-height:var(--luzmo-button-line-height, var(--button-line-height));text-align:center;text-align:var(--luzmo-button-text-align, center);align-self:start;padding-block-start:calc(var(--luzmo-button-top-to-text, var(--button-top-to-text)) - var(--luzmo-button-border-width, var(--button-border-width)));padding-block-end:calc(var(--luzmo-button-bottom-to-text, var(--button-bottom-to-text)) - var(--luzmo-button-border-width, var(--button-border-width)))}[name=icon]+#label{text-align:start;text-align:var(--luzmo-button-text-align-with-icon, start)}:host([focused]):after,:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-button-focus-ring-thickness, var(--button-focus-ring-thickness)) var(--luzmo-button-focus-ring-color, var(--button-focus-indicator-color))}:host{transition:border-color var(--luzmo-button-animation-duration, var(--button-animation-duration)) ease-in-out}:host:after{margin:calc((var(--luzmo-button-focus-ring-gap, var(--button-focus-ring-gap)) + var(--luzmo-button-border-width, var(--button-border-width))) * -1);border-radius:var(--luzmo-button-focus-ring-border-radius, calc(var(--luzmo-button-border-radius, var(--button-border-radius)) + var(--luzmo-focus-indicator-gap, 2px)));transition:box-shadow var(--luzmo-button-animation-duration, var(--button-animation-duration)) ease-in-out;pointer-events:none;content:"";position:absolute;top:0;right:0;bottom:0;left:0}:host(:focus-visible){box-shadow:none;outline:none}:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-button-focus-ring-thickness, var(--button-focus-ring-thickness)) var(--highcontrast-button-focus-ring-color, var(--luzmo-button-focus-ring-color, var(--luzmo-button-focus-ring-color, var(--button-focus-indicator-color))))}:host{background-color:var(--highcontrast-button-background-color-default, var(--luzmo-button-background-color-default, var(--button-background-color-default)));border-color:var(--highcontrast-button-border-color-default, var(--luzmo-button-border-color-default, var(--button-border-color-default)));color:var(--highcontrast-button-content-color-default, var(--luzmo-button-content-color-default, var(--button-content-color-default)));transition:border .13s linear,color .13s linear,background-color .13s linear;transition:border var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s)) linear,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s)) linear,background-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s)) linear}@media (hover: hover){:host(:hover){box-shadow:none;background-color:var(--highcontrast-button-background-color-hover, var(--luzmo-button-background-color-hover, var(--button-background-color-hover)));border-color:var(--highcontrast-button-border-color-hover, var(--luzmo-button-border-color-hover, var(--button-border-color-hover)));color:var(--highcontrast-button-content-color-hover, var(--luzmo-button-content-color-hover, var(--button-content-color-hover)))}}:host(:focus-visible){background-color:var(--highcontrast-button-background-color-focus, var(--luzmo-button-background-color-focus, var(--button-background-color-focus)));border-color:var(--highcontrast-button-border-color-focus, var(--luzmo-button-border-color-focus, var(--button-border-color-focus)));color:var(--highcontrast-button-content-color-focus, var(--luzmo-button-content-color-focus, var(--button-content-color-focus)))}:host(:is(:active,[active])){background-color:var(--highcontrast-button-background-color-down, var(--luzmo-button-background-color-down, var(--button-background-color-down)));border-color:var(--highcontrast-button-border-color-down, var(--luzmo-button-border-color-down, var(--button-border-color-down)));color:var(--highcontrast-button-content-color-down, var(--luzmo-button-content-color-down, var(--button-content-color-down)))}:host .is-disabled,:host([pending]),:host([disabled]){background-color:var(--highcontrast-button-background-color-disabled, var(--luzmo-button-background-color-disabled, var(--button-background-color-disabled)));border-color:var(--highcontrast-button-border-color-disabled, var(--luzmo-button-border-color-disabled, var(--button-border-color-disabled)));color:var(--highcontrast-button-content-color-disabled, var(--luzmo-button-content-color-disabled, var(--button-content-color-disabled)))}#label,::slotted([slot=icon]){visibility:visible;opacity:1;transition:opacity .13s ease-in-out;transition:opacity var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s)) ease-in-out}.luzmo-progress-circle{visibility:hidden;opacity:0;transition:opacity .13s ease-in-out,visibility 0s linear .13s;transition:opacity var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s)) ease-in-out,visibility 0s linear var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s))}:host([pending]){cursor:default}:host([pending]) .luzmo-progress-circle{visibility:visible;opacity:1;transition:opacity .13s ease-in-out;transition:opacity var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s)) ease-in-out}:host([no-wrap]) #label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host([static-color=white]){--button-focus-indicator-color: var( --luzmo-static-black-focus-indicator-color, rgb(0, 0, 0) )}:host([static-color=white][selected]){--button-content-color-default: var( --luzmo-button-static-content-color, rgba(255, 255, 255, .9) );--button-content-color-hover: var( --luzmo-button-static-content-color, rgb(255, 255, 255) );--button-content-color-down: var( --luzmo-button-static-content-color, rgb(255, 255, 255) );--button-content-color-focus: var( --luzmo-button-static-content-color, rgb(255, 255, 255) )}:host([static-color=black]){--button-focus-indicator-color: var( --luzmo-static-black-focus-indicator-color, rgb(0, 0, 0) )}@media (forced-colors: active){:host{--highcontrast-button-content-color-default: ButtonText;--highcontrast-button-content-color-hover: ButtonText;--highcontrast-button-content-color-focus: ButtonText;--highcontrast-button-content-color-down: ButtonText;--highcontrast-button-border-color-default: ButtonBorder;--highcontrast-button-border-color-hover: ButtonBorder;--highcontrast-button-border-color-focus: ButtonBorder;--highcontrast-button-border-color-down: ButtonBorder;--highcontrast-button-background-color-default: ButtonFace;--highcontrast-button-background-color-hover: ButtonFace;--highcontrast-button-background-color-down: ButtonFace;--highcontrast-button-background-color-focus: ButtonFace;--highcontrast-button-background-color-disabled: ButtonFace;--highcontrast-button-content-color-disabled: GrayText;--highcontrast-button-border-color-disabled: GrayText;--luzmo-progress-circle-track-border-color: ButtonText;--luzmo-progress-circle-track-border-color-over-background: ButtonText;--luzmo-progress-circle-thickness: 3px;--luzmo-button-animation-duration: 0s}#label{forced-color-adjust:none}:host(:focus-visible):after{forced-color-adjust:none;box-shadow:0 0 0 var(--luzmo-button-focus-ring-thickness, var(--button-focus-ring-thickness)) ButtonText}:host([variant=accent][treatment=fill]){--highcontrast-button-background-color-default: ButtonText;--highcontrast-button-content-color-default: ButtonFace;--highcontrast-button-content-color-hover: HighlightText;--highcontrast-button-content-color-down: HighlightText;--highcontrast-button-content-color-focus: HighlightText;--highcontrast-button-background-color-disabled: ButtonFace;--highcontrast-button-background-color-hover: Highlight;--highcontrast-button-background-color-down: Highlight;--highcontrast-button-background-color-focus: Highlight;--highcontrast-button-border-color-default: ButtonText;--highcontrast-button-border-color-hover: Highlight;--highcontrast-button-border-color-focus: Highlight;--highcontrast-button-border-color-down: Highlight}}:host{--button-animation-duration: var(--luzmo-animation-duration);--button-border-radius: var(--luzmo-border-radius);--button-border-width: var(--luzmo-border-width);--button-line-height: 1.2;--button-focus-ring-gap: 2px;--button-focus-ring-thickness: 2px;--button-focus-indicator-color: var(--luzmo-primary);--button-intended-icon-size: 18px;--button-background-color-default: var(--luzmo-background-color);--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-active);--button-background-color-focus: var(--luzmo-primary);--button-border-color-default: var(--luzmlo-border-color-full);--button-border-color-hover: var(--luzmo-border-color-full-hover);--button-border-color-down: var(--luzmo-border-color-full-down);--button-border-color-focus: var(--luzmo-border-color-full-focus);--button-content-color-default: var(--luzmo-font-color);--button-content-color-hover: var(--luzmo-font-color-hard);--button-content-color-down: var(--luzmo-font-color-hard);--button-content-color-focus: var(--luzmo-font-color-hard);--button-background-color-disabled: transparent;--button-border-color-disabled: var(--luzmo-disabled-color);--button-content-color-disabled: var(--luzmo-disabled-color)}:host([variant=accent]){--button-background-color-default: var(--luzmo-primary);--button-background-color-hover: var(--luzmo-primary-hover);--button-background-color-down: var(--luzmo-primary-down);--button-background-color-focus: var(--luzmo-primary-focus);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: white;--button-content-color-hover: white;--button-content-color-down: white;--button-content-color-focus: white;--button-background-color-disabled: var(--luzmo-background-color-disabled);--button-border-color-disabled: transparent;--button-content-color-disabled: var(--luzmo-disabled-color)}:host([variant=accent][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-down);--button-background-color-focus: var(--luzmo-background-color-focus);--button-border-color-default: var(--luzmo-primary);--button-border-color-hover: var(--luzmo-primary-hover);--button-border-color-down: var(--luzmo-primary-down);--button-border-color-focus: var(--luzmo-primary-focus);--button-content-color-default: var(--luzmo-primary);--button-content-color-hover: var(--luzmo-primary-down);--button-content-color-down: var(--luzmo-primary-down);--button-content-color-focus: var(--luzmo-primary-focus);--button-background-color-disabled: transparent;--button-border-color-disabled: var(--luzmo-border-color-disabled);--button-content-color-disabled: var(--luzmo-font-color-disabled)}:host([variant=negative]){--button-background-color-default: var(--luzmo-negative-color);--button-background-color-hover: var(--luzmo-negative-color-hover);--button-background-color-down: var(--luzmo-negative-color-down);--button-background-color-focus: var(--luzmo-negative-color-focus);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: white;--button-content-color-hover: white;--button-content-color-down: white;--button-content-color-focus: white;--button-background-color-disabled: var(--luzmo-background-color-disabled);--button-border-color-disabled: transparent;--button-content-color-disabled: var(--luzmo-disabled-color)}:host([variant=negative][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-down);--button-background-color-focus: var(--luzmo-background-color-focus);--button-border-color-default: var(--luzmo-negative-color);--button-border-color-hover: var(--luzmo-negative-color-hover);--button-border-color-down: var(--luzmo-negative-color-down);--button-border-color-focus: var(--luzmo-negative-color-focus);--button-content-color-default: var(--luzmo-negative-color);--button-content-color-hover: var(--luzmo-negative-color-down);--button-content-color-down: var(--luzmo-negative-color-down);--button-content-color-focus: var(--luzmo-negative-color-focus);--button-background-color-disabled: transparent;--button-border-color-disabled: var(--luzmo-border-color-disabled);--button-content-color-disabled: var(--luzmo-font-color-disabled)}:host([variant=primary]){--button-background-color-default: var(--luzmo-primary);--button-background-color-hover: var(--luzmo-primary-hover);--button-background-color-down: var(--luzmo-primary-down);--button-background-color-focus: var(--luzmo-primary-focus);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: white;--button-content-color-hover: white;--button-content-color-down: white;--button-content-color-focus: white;--button-background-color-disabled: var(--luzmo-background-color-disabled);--button-border-color-disabled: transparent;--button-content-color-disabled: var(--luzmo-disabled-color)}:host([variant=primary][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-down);--button-background-color-focus: var(--luzmo-background-color-focus);--button-border-color-default: var(--luzmo-primary);--button-border-color-hover: var(--luzmo-primary-hover);--button-border-color-down: var(--luzmo-primary-down);--button-border-color-focus: var(--luzmo-primary-focus);--button-content-color-default: var(--luzmo-primary);--button-content-color-hover: var(--luzmo-primary-down);--button-content-color-down: var(--luzmo-primary-down);--button-content-color-focus: var(--luzmo-primary-focus);--button-background-color-disabled: transparent;--button-border-color-disabled: var(--luzmo-border-color-disabled);--button-content-color-disabled: var(--luzmo-font-color-disabled)}:host([variant=secondary]){--button-background-color-default: var(--luzmo-secondary);--button-background-color-hover: var(--luzmo-secondary-hover);--button-background-color-down: var(--luzmo-secondary-down);--button-background-color-focus: var(--luzmo-secondary-focus);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: white;--button-content-color-hover: white;--button-content-color-down: white;--button-content-color-focus: white;--button-background-color-disabled: var(--luzmo-background-color-disabled);--button-border-color-disabled: transparent;--button-content-color-disabled: var(--luzmo-disabled-color)}:host([variant=secondary][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-down);--button-background-color-focus: var(--luzmo-background-color-focus);--button-border-color-default: var(--luzmo-secondary);--button-border-color-hover: var(--luzmo-secondary-hover);--button-border-color-down: var(--luzmo-secondary-down);--button-border-color-focus: var(--luzmo-secondary-focus);--button-content-color-default: var(--luzmo-secondary);--button-content-color-hover: var(--luzmo-secondary-down);--button-content-color-down: var(--luzmo-secondary-down);--button-content-color-focus: var(--luzmo-secondary-focus);--button-background-color-disabled: transparent;--button-border-color-disabled: var(--luzmo-border-color-disabled);--button-content-color-disabled: var(--luzmo-font-color-disabled)}:host([quiet]){--button-background-color-default: transparent;--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-down);--button-background-color-focus: var(--luzmo-background-color-focus);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-background-color-disabled: transparent;--button-border-color-disabled: transparent}:host([selected]){--button-background-color-default: var(--luzmo-selected-color);--button-background-color-hover: var(--luzmo-selected-color-hover);--button-background-color-down: var(--luzmo-selected-color-down);--button-background-color-focus: var(--luzmo-selected-color-focus);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: white;--button-content-color-hover: white;--button-content-color-down: white;--button-content-color-focus: white;--button-background-color-disabled: var(--luzmo-background-color-disabled);--button-border-color-disabled: transparent}:host([selected][emphasized]){--button-background-color-default: transparent;--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-down);--button-background-color-focus: var(--luzmo-background-color-focus)}:host([static-color=black][quiet]){--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-border-color-disabled: transparent}:host([static-color=white][quiet]){--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-border-color-disabled: transparent}:host([static-color=white]){--button-background-color-default: rgba(255, 255, 255 .9);--button-background-color-hover: rgb(255, 255, 255);--button-background-color-down: rgb(255, 255, 255);--button-background-color-focus: rgb(255, 255, 255);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: rgb(0, 0, 0);--button-content-color-hover: rgb(0, 0, 0);--button-content-color-down: rgb(0, 0, 0);--button-content-color-focus: rgb(0, 0, 0);--button-focus-indicator-color: rgb(255, 255, 255);--button-background-color-disabled: rgba(255, 255, 255, .1);--button-border-color-disabled: transparent;--button-content-color-disabled: rgba(255, 255, 255, .55)}:host([static-color=white][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: rgba(255, 255, 255, .25);--button-background-color-down: rgba(255, 255, 255, .4);--button-background-color-focus: rgba(255, 255, 255, .25);--button-border-color-default: rgba(255, 255, 255, .9);--button-border-color-hover: rgb(255, 255, 255);--button-border-color-down: rgb(255, 255, 255);--button-border-color-focus: rgb(255, 255, 255);--button-content-color-default: rgb(255, 255, 255);--button-content-color-hover: rgb(255, 255, 255);--button-content-color-down: rgb(255, 255, 255);--button-content-color-focus: rgb(255, 255, 255);--button-focus-indicator-color: rgb(255, 255, 255);--button-background-color-disabled: transparent;--button-border-color-disabled: rgba(255, 255, 255, .25);--button-content-color-disabled: rgba(255, 255, 255, .55)}:host([static-color=white][selected]){--button-background-color-default: rgba(255, 255, 255, .9);--button-background-color-hover: rgb(255, 255, 255);--button-background-color-down: rgb(255, 255, 255);--button-background-color-focus: rgb(255, 255, 255);--button-static-white-content-color-default: rgb(0, 0, 0);--button-static-white-content-color-hover: rgb(0, 0, 0);--button-static-white-content-color-down: rgb(0, 0, 0);--button-static-white-content-color-focus: rgb(0, 0, 0);--button-background-color-disabled: rgba(255, 255, 255, .1);--button-border-color-disabled: transparent}:host([static-color=white][variant=secondary]){--button-background-color-default: rgba(255, 255, 255, .1);--button-background-color-hover: rgba(255, 255, 255, .25);--button-background-color-down: rgba(255, 255, 255, .4);--button-background-color-focus: rgba(255, 255, 255, .25);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: rgb(255, 255, 255);--button-content-color-hover: rgb(255, 255, 255);--button-content-color-down: rgb(255, 255, 255);--button-content-color-focus: rgb(255, 255, 255);--button-focus-indicator-color: rgb(255, 255, 255);--button-background-color-disabled: rgba(255, 255, 255, .1);--button-border-color-disabled: transparent;--button-content-color-disabled: rgba(255, 255, 255, .55)}:host([static-color=white][variant=secondary][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: rgba(255, 255, 255, .25);--button-background-color-down: rgba(255, 255, 255, .4);--button-background-color-focus: rgba(255, 255, 255, .25);--button-border-color-default: rgba(255, 255, 255, .25);--button-border-color-hover: rgba(255, 255, 255, .4);--button-border-color-down: rgba(255, 255, 255, .55);--button-border-color-focus: rgba(255, 255, 255, .4);--button-content-color-default: rgb(255, 255, 255);--button-content-color-hover: rgb(255, 255, 255);--button-content-color-down: rgb(255, 255, 255);--button-content-color-focus: rgb(255, 255, 255);--button-focus-indicator-color: rgb(255, 255, 255);--button-background-color-disabled: transparent;--button-border-color-disabled: rgba(255, 255, 255, .25);--button-content-color-disabled: rgba(255, 255, 255, .55)}:host([static-color=black]){--button-background-color-default: rgba(0, 0, 0, .9);--button-background-color-hover: rgb(0, 0, 0);--button-background-color-down: rgb(0, 0, 0);--button-background-color-focus: rgb(0, 0, 0);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: rgb(255, 255, 255);--button-content-color-hover: rgb(255, 255, 255);--button-content-color-down: rgb(255, 255, 255);--button-content-color-focus: rgb(255, 255, 255);--button-focus-indicator-color: rgb(0, 0, 0);--button-background-color-disabled: rgba(0, 0, 0, .1);--button-border-color-disabled: transparent;--button-content-color-disabled: rgba(0, 0, 0, .55)}:host([static-color=black][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: rgba(0, 0, 0, .25);--button-background-color-down: rgba(0, 0, 0, .4);--button-background-color-focus: rgba(0, 0, 0, .25);--button-border-color-default: rgba(0, 0, 0, .4);--button-border-color-hover: rgba(0, 0, 0, .55);--button-border-color-down: rgba(0, 0, 0, .7);--button-border-color-focus: rgba(0, 0, 0, .55);--button-content-color-default: rgb(0, 0, 0);--button-content-color-hover: rgb(0, 0, 0);--button-content-color-down: rgb(0, 0, 0);--button-content-color-focus: rgb(0, 0, 0);--button-focus-indicator-color: rgb(0, 0, 0);--button-background-color-disabled: transparent;--button-border-color-disabled: rgba(0, 0, 0, .25);--button-content-color-disabled: rgba(0, 0, 0, .55)}:host([static-color=black][variant=secondary]){--button-background-color-default: rgba(0, 0, 0, .1);--button-background-color-hover: rgba(0, 0, 0, .25);--button-background-color-down: rgba(0, 0, 0, .4);--button-background-color-focus: rgba(0, 0, 0, .25);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: rgb(0, 0, 0);--button-content-color-hover: rgb(0, 0, 0);--button-content-color-down: rgb(0, 0, 0);--button-content-color-focus: rgb(0, 0, 0);--button-focus-indicator-color: rgb(0, 0, 0);--button-background-color-disabled: rgba(0, 0, 0, .1);--button-border-color-disabled: transparent;--button-content-color-disabled: rgba(0, 0, 0, .55)}:host([static-color=black][variant=secondary][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: rgba(0, 0, 0, .25);--button-background-color-down: rgba(0, 0, 0, .4);--button-background-color-focus: rgba(0, 0, 0, .25);--button-border-color-default: rgba(0, 0, 0, .25);--button-border-color-hover: rgba(0, 0, 0, .4);--button-border-color-down: rgba(0, 0, 0, .55);--button-border-color-focus: rgba(0, 0, 0, .4);--button-content-color-default: rgb(0, 0, 0);--button-content-color-hover: rgb(0, 0, 0);--button-content-color-down: rgb(0, 0, 0);--button-content-color-focus: rgb(0, 0, 0);--button-focus-indicator-color: rgb(0, 0, 0);--button-background-color-disabled: transparent;--button-border-color-disabled: rgba(0, 0, 0, .25);--button-content-color-disabled: rgba(0, 0, 0, .55)}:host([size=s]){--button-min-width: 54px;--button-border-radius: var(--luzmo-border-radius-s);--button-height: 24px;--button-font-size: 12px;--button-edge-to-visual: 8px;--button-edge-to-visual-only: 4px;--button-edge-to-text: 10px;--button-padding-label-to-icon: 7px;--button-top-to-text: 5px;--button-bottom-to-text: 4px;--button-top-to-icon: 4px;--button-intended-icon-size: 16px}:host{--button-min-width: 72px;--button-border-radius: var(--luzmo-border-radius);--button-height: 32px;--button-font-size: 14px;--button-edge-to-visual: 12px;--button-edge-to-visual-only: 7px;--button-edge-to-text: 14px;--button-padding-label-to-icon: 8px;--button-top-to-text: 7px;--button-bottom-to-text: 8px;--button-top-to-icon: 7px;--button-intended-icon-size: 18px}:host([size=l]){--button-min-width: 90px;--button-border-radius: var(--luzmo-border-radius);--button-height: 40px;--button-font-size: 16px;--button-edge-to-visual: 16px;--button-edge-to-visual-only: 10px;--button-edge-to-text: 18px;--button-padding-label-to-icon: 9px;--button-top-to-text: 10px;--button-bottom-to-text: 10px;--button-top-to-icon: 10px;--button-intended-icon-size: 20px}:host([size=xl]){--button-min-width: 108px;--button-border-radius: var(--luzmo-border-radius);--button-height: 48px;--button-font-size: 18px;--button-edge-to-visual: 19px;--button-edge-to-visual-only: 13px;--button-edge-to-text: 22px;--button-padding-label-to-icon: 10px;--button-top-to-text: 13px;--button-bottom-to-text: 13px;--button-top-to-icon: 13px;--button-intended-icon-size: 22px}@media (forced-colors: active){:host([treatment][disabled]){border-color:graytext}:host([treatment]:not([disabled]):hover){border-color:highlight}}@keyframes show-progress-circle{0%{visibility:hidden}to{visibility:visible}}@keyframes hide-icons-label{0%{visibility:visible}to{visibility:hidden}}@keyframes update-pending-button-styles{to{background-color:var(--highcontrast-button-background-color-disabled, var(--luzmo-button-background-color-disabled, var(--button-background-color-disabled)));border-color:var(--highcontrast-button-border-color-disabled, var(--luzmo-button-border-color-disabled, var(--button-border-color-disabled)));color:var(--highcontrast-button-content-color-disabled, var(--luzmo-button-content-color-disabled, var(--button-content-color-disabled)))}}:host([pending]:not([disabled])){cursor:default;pointer-events:none;animation:update-pending-button-styles 0s var(--pending-delay, 1s) forwards}::slotted([slot=icon]){visibility:revert-layer;--luzmo-progress-circle-position: relative;--icon-size: inherit}luzmo-progress-circle{display:block;visibility:hidden;position:absolute;left:50%;transform:translate(-50%)}:host([pending]:not([disabled])) luzmo-progress-circle{animation:show-progress-circle 0s var(--pending-delay, 1s) forwards}:host([pending]:not([disabled])) slot[name=icon],:host([pending]:not([disabled])) #label{animation:hide-icons-label 0s var(--pending-delay, 1s) forwards}';var m=Object.defineProperty,f=Object.getOwnPropertyDescriptor,a=(u,o,c,e)=>{for(var n=e>1?void 0:e?f(o,c):o,l=u.length-1,b;l>=0;l--)(b=u[l])&&(n=(e?b(o,c,n):b(n))||n);return e&&n&&m(o,c,n),n};const p=["primary","secondary","negative","white","black"];class r extends g.SizedMixin(v.LuzmoButtonBase,{noDefaultSize:!0}){constructor(){super(),this.pendingLabel="Pending",this.pending=!1,this._variant="primary",this.treatment="fill",this.noWrap=!1,this.pendingStateController=new s.PendingStateController(this)}static get styles(){return[...super.styles,t.r(h)]}click(){this.pending||super.click()}get variant(){return this._variant}set variant(o){if(o!==this.variant){switch(this.requestUpdate("variant",this.variant),o){case"white":{this.staticColor=o,this.removeAttribute("variant");return}case"black":{this.staticColor=o,this.removeAttribute("variant");return}case null:return;default:{this._variant=p.includes(o)?o:"primary";break}}this.setAttribute("variant",this.variant)}}set quiet(o){this.treatment=o?"outline":"fill"}get quiet(){return this.treatment==="outline"}firstUpdated(o){super.firstUpdated(o),this.hasAttribute("variant")||this.setAttribute("variant",this.variant),this.pending&&this.pendingStateController.hostUpdated()}renderButton(){return t.x`
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../base-CBCg3yyw.cjs"),s=require("../pending-state-gs6IxYtB.cjs"),g=require("../sized-mixin-CPxE5C96.cjs"),v=require("../button-base-XgPLmwP-.cjs"),d=require("../clear-button-Qi1pMA5S.cjs"),i=require("../close-button-BFMBEw3q.cjs"),h=':host{cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;font-family:var(--luzmo-button-font-family, var(--luzmo-font-family));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, 1.3);text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out;justify-content:center;align-items:center;margin:0;-webkit-text-decoration:none;text-decoration:none;display:inline-flex;overflow:visible}:host(:focus){outline:none}:host .is-disabled,:host([disabled]){cursor:default}:host:after{margin:calc(-1 * var(--luzmo-button-focus-indicator-gap, var(--luzmo-focus-indicator-gap, 2px)));transition:opacity var(--luzmo-button-animation-duration, var(--luzmo-button-animation-duration, var(--luzmo-animation-duration))) ease-out,margin var(--luzmo-button-animation-duration, var(--luzmo-button-animation-duration, var(--luzmo-animation-duration))) ease-out;display:block;inset-block:0;inset-inline:0}:host(:focus-visible):after{margin:calc(var(--luzmo-focus-indicator-gap, 2px) * -2)}#label{place-self:center}#label[hidden]{display:none}:host{--luzmo-progress-circle-position: absolute;border-radius:var(--luzmo-button-border-radius, var(--button-border-radius));border-width:var(--luzmo-button-border-width, var(--button-border-width));font-size:var(--luzmo-button-font-size, var(--button-font-size));font-weight:var(--luzmo-button-font-weight, 600);gap:var(--luzmo-button-padding-label-to-icon, var(--button-padding-label-to-icon));max-inline-size:none;max-inline-size:var(--luzmo-button-max-inline-size, none);min-inline-size:var(--luzmo-button-min-width, var(--button-min-width));min-block-size:var(--luzmo-button-height, var(--button-height));padding-block:0;padding-inline:var(--luzmo-button-edge-to-text, var(--button-edge-to-text));color:inherit;margin-block:0;margin-block:var(--luzmo-button-margin-block, 0);border-style:solid;margin-inline-start:var(--luzmo-button-margin-left, 0);margin-inline-end:var(--luzmo-button-margin-right, 0);position:relative}:host(:is(:active,[active])){box-shadow:none}::slotted([slot=icon]){--_icon-size-difference: max( 0px, var(--button-intended-icon-size) - var( --icon-size, var(--button-intended-icon-size) ) );color:inherit;flex-shrink:0;align-self:flex-start;margin-block-start:var(--luzmo-button-icon-margin-block-start, max(0px, var(--luzmo-button-top-to-icon, var(--button-top-to-icon)) - var(--luzmo-button-border-width, var(--button-border-width)) + var(--_icon-size-difference, 0px) / 2));margin-inline-start:calc(var(--luzmo-button-edge-to-visual, var(--button-edge-to-visual)) - var(--luzmo-button-edge-to-text, var(--button-edge-to-text)))}:host([icon-only]){min-inline-size:unset;padding:calc(var(--luzmo-button-edge-to-visual-only, var(--button-edge-to-visual-only)) - var(--luzmo-button-border-width, var(--button-border-width)));border-radius:50%}:host([icon-only]) ::slotted([slot=icon]){align-self:center;margin-block-start:0;margin-inline-start:0}:host([icon-only]):after{border-radius:50%}#label{line-height:var(--luzmo-button-line-height, var(--button-line-height));text-align:center;text-align:var(--luzmo-button-text-align, center);align-self:start;padding-block-start:calc(var(--luzmo-button-top-to-text, var(--button-top-to-text)) - var(--luzmo-button-border-width, var(--button-border-width)));padding-block-end:calc(var(--luzmo-button-bottom-to-text, var(--button-bottom-to-text)) - var(--luzmo-button-border-width, var(--button-border-width)))}[name=icon]+#label{text-align:start;text-align:var(--luzmo-button-text-align-with-icon, start)}:host([focused]):after,:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-button-focus-ring-thickness, var(--button-focus-ring-thickness)) var(--luzmo-button-focus-ring-color, var(--button-focus-indicator-color))}:host{transition:border-color var(--luzmo-button-animation-duration, var(--button-animation-duration)) ease-in-out}:host:after{margin:calc((var(--luzmo-button-focus-ring-gap, var(--button-focus-ring-gap)) + var(--luzmo-button-border-width, var(--button-border-width))) * -1);border-radius:var(--luzmo-button-focus-ring-border-radius, calc(var(--luzmo-button-border-radius, var(--button-border-radius)) + var(--luzmo-focus-indicator-gap, 2px)));transition:box-shadow var(--luzmo-button-animation-duration, var(--button-animation-duration)) ease-in-out;pointer-events:none;content:"";position:absolute;top:0;right:0;bottom:0;left:0}:host(:focus-visible){box-shadow:none;outline:none}:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-button-focus-ring-thickness, var(--button-focus-ring-thickness)) var(--highcontrast-button-focus-ring-color, var(--luzmo-button-focus-ring-color, var(--luzmo-button-focus-ring-color, var(--button-focus-indicator-color))))}:host{background-color:var(--highcontrast-button-background-color-default, var(--luzmo-button-background-color-default, var(--button-background-color-default)));border-color:var(--highcontrast-button-border-color-default, var(--luzmo-button-border-color-default, var(--button-border-color-default)));color:var(--highcontrast-button-content-color-default, var(--luzmo-button-content-color-default, var(--button-content-color-default)));transition:border .13s linear,color .13s linear,background-color .13s linear;transition:border var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s)) linear,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s)) linear,background-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s)) linear}@media (hover: hover){:host(:hover){box-shadow:none;background-color:var(--highcontrast-button-background-color-hover, var(--luzmo-button-background-color-hover, var(--button-background-color-hover)));border-color:var(--highcontrast-button-border-color-hover, var(--luzmo-button-border-color-hover, var(--button-border-color-hover)));color:var(--highcontrast-button-content-color-hover, var(--luzmo-button-content-color-hover, var(--button-content-color-hover)))}}:host(:focus-visible){background-color:var(--highcontrast-button-background-color-focus, var(--luzmo-button-background-color-focus, var(--button-background-color-focus)));border-color:var(--highcontrast-button-border-color-focus, var(--luzmo-button-border-color-focus, var(--button-border-color-focus)));color:var(--highcontrast-button-content-color-focus, var(--luzmo-button-content-color-focus, var(--button-content-color-focus)))}:host(:is(:active,[active])){background-color:var(--highcontrast-button-background-color-down, var(--luzmo-button-background-color-down, var(--button-background-color-down)));border-color:var(--highcontrast-button-border-color-down, var(--luzmo-button-border-color-down, var(--button-border-color-down)));color:var(--highcontrast-button-content-color-down, var(--luzmo-button-content-color-down, var(--button-content-color-down)))}:host .is-disabled,:host([pending]),:host([disabled]){background-color:var(--highcontrast-button-background-color-disabled, var(--luzmo-button-background-color-disabled, var(--button-background-color-disabled)));border-color:var(--highcontrast-button-border-color-disabled, var(--luzmo-button-border-color-disabled, var(--button-border-color-disabled)));color:var(--highcontrast-button-content-color-disabled, var(--luzmo-button-content-color-disabled, var(--button-content-color-disabled)))}#label,::slotted([slot=icon]){visibility:visible;opacity:1;transition:opacity .13s ease-in-out;transition:opacity var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s)) ease-in-out}.luzmo-progress-circle{visibility:hidden;opacity:0;transition:opacity .13s ease-in-out,visibility 0s linear .13s;transition:opacity var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s)) ease-in-out,visibility 0s linear var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s))}:host([pending]){cursor:default}:host([pending]) .luzmo-progress-circle{visibility:visible;opacity:1;transition:opacity .13s ease-in-out;transition:opacity var(--luzmo-button-animation-duration, var(--luzmo-animation-duration, .15s)) ease-in-out}:host([no-wrap]) #label{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}:host([static-color=white]){--button-focus-indicator-color: var( --luzmo-static-black-focus-indicator-color, rgb(0, 0, 0) )}:host([static-color=white][selected]){--button-content-color-default: var( --luzmo-button-static-content-color, rgba(255, 255, 255, .9) );--button-content-color-hover: var( --luzmo-button-static-content-color, rgb(255, 255, 255) );--button-content-color-down: var( --luzmo-button-static-content-color, rgb(255, 255, 255) );--button-content-color-focus: var( --luzmo-button-static-content-color, rgb(255, 255, 255) )}:host([static-color=black]){--button-focus-indicator-color: var( --luzmo-static-black-focus-indicator-color, rgb(0, 0, 0) )}@media (forced-colors: active){:host{--highcontrast-button-content-color-default: ButtonText;--highcontrast-button-content-color-hover: ButtonText;--highcontrast-button-content-color-focus: ButtonText;--highcontrast-button-content-color-down: ButtonText;--highcontrast-button-border-color-default: ButtonBorder;--highcontrast-button-border-color-hover: ButtonBorder;--highcontrast-button-border-color-focus: ButtonBorder;--highcontrast-button-border-color-down: ButtonBorder;--highcontrast-button-background-color-default: ButtonFace;--highcontrast-button-background-color-hover: ButtonFace;--highcontrast-button-background-color-down: ButtonFace;--highcontrast-button-background-color-focus: ButtonFace;--highcontrast-button-background-color-disabled: ButtonFace;--highcontrast-button-content-color-disabled: GrayText;--highcontrast-button-border-color-disabled: GrayText;--luzmo-progress-circle-track-border-color: ButtonText;--luzmo-progress-circle-track-border-color-over-background: ButtonText;--luzmo-progress-circle-thickness: 3px;--luzmo-button-animation-duration: 0s}#label{forced-color-adjust:none}:host(:focus-visible):after{forced-color-adjust:none;box-shadow:0 0 0 var(--luzmo-button-focus-ring-thickness, var(--button-focus-ring-thickness)) ButtonText}:host([variant=accent][treatment=fill]){--highcontrast-button-background-color-default: ButtonText;--highcontrast-button-content-color-default: ButtonFace;--highcontrast-button-content-color-hover: HighlightText;--highcontrast-button-content-color-down: HighlightText;--highcontrast-button-content-color-focus: HighlightText;--highcontrast-button-background-color-disabled: ButtonFace;--highcontrast-button-background-color-hover: Highlight;--highcontrast-button-background-color-down: Highlight;--highcontrast-button-background-color-focus: Highlight;--highcontrast-button-border-color-default: ButtonText;--highcontrast-button-border-color-hover: Highlight;--highcontrast-button-border-color-focus: Highlight;--highcontrast-button-border-color-down: Highlight}}:host{--button-animation-duration: var(--luzmo-animation-duration);--button-border-radius: var(--luzmo-border-radius);--button-border-width: var(--luzmo-border-width);--button-line-height: 1.2;--button-focus-ring-gap: 2px;--button-focus-ring-thickness: 2px;--button-focus-indicator-color: var(--luzmo-primary);--button-intended-icon-size: 18px;--button-background-color-default: var(--luzmo-background-color);--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-active);--button-background-color-focus: var(--luzmo-primary);--button-border-color-default: var(--luzmlo-border-color-full);--button-border-color-hover: var(--luzmo-border-color-full-hover);--button-border-color-down: var(--luzmo-border-color-full-down);--button-border-color-focus: var(--luzmo-border-color-full-focus);--button-content-color-default: var(--luzmo-font-color);--button-content-color-hover: var(--luzmo-font-color-hard);--button-content-color-down: var(--luzmo-font-color-hard);--button-content-color-focus: var(--luzmo-font-color-hard);--button-background-color-disabled: transparent;--button-border-color-disabled: var(--luzmo-disabled-color);--button-content-color-disabled: var(--luzmo-disabled-color)}:host([variant=accent]){--button-background-color-default: var(--luzmo-primary);--button-background-color-hover: var(--luzmo-primary-hover);--button-background-color-down: var(--luzmo-primary-down);--button-background-color-focus: var(--luzmo-primary-focus);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: white;--button-content-color-hover: white;--button-content-color-down: white;--button-content-color-focus: white;--button-background-color-disabled: var(--luzmo-background-color-disabled);--button-border-color-disabled: transparent;--button-content-color-disabled: var(--luzmo-disabled-color)}:host([variant=accent][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-down);--button-background-color-focus: var(--luzmo-background-color-focus);--button-border-color-default: var(--luzmo-primary);--button-border-color-hover: var(--luzmo-primary-hover);--button-border-color-down: var(--luzmo-primary-down);--button-border-color-focus: var(--luzmo-primary-focus);--button-content-color-default: var(--luzmo-primary);--button-content-color-hover: var(--luzmo-primary-down);--button-content-color-down: var(--luzmo-primary-down);--button-content-color-focus: var(--luzmo-primary-focus);--button-background-color-disabled: transparent;--button-border-color-disabled: var(--luzmo-border-color-disabled);--button-content-color-disabled: var(--luzmo-font-color-disabled)}:host([variant=negative]){--button-background-color-default: var(--luzmo-negative-color);--button-background-color-hover: var(--luzmo-negative-color-hover);--button-background-color-down: var(--luzmo-negative-color-down);--button-background-color-focus: var(--luzmo-negative-color-focus);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: white;--button-content-color-hover: white;--button-content-color-down: white;--button-content-color-focus: white;--button-background-color-disabled: var(--luzmo-background-color-disabled);--button-border-color-disabled: transparent;--button-content-color-disabled: var(--luzmo-disabled-color)}:host([variant=negative][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-down);--button-background-color-focus: var(--luzmo-background-color-focus);--button-border-color-default: var(--luzmo-negative-color);--button-border-color-hover: var(--luzmo-negative-color-hover);--button-border-color-down: var(--luzmo-negative-color-down);--button-border-color-focus: var(--luzmo-negative-color-focus);--button-content-color-default: var(--luzmo-negative-color);--button-content-color-hover: var(--luzmo-negative-color-down);--button-content-color-down: var(--luzmo-negative-color-down);--button-content-color-focus: var(--luzmo-negative-color-focus);--button-background-color-disabled: transparent;--button-border-color-disabled: var(--luzmo-border-color-disabled);--button-content-color-disabled: var(--luzmo-font-color-disabled)}:host([variant=primary]){--button-background-color-default: var(--luzmo-primary);--button-background-color-hover: var(--luzmo-primary-hover);--button-background-color-down: var(--luzmo-primary-down);--button-background-color-focus: var(--luzmo-primary-focus);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: white;--button-content-color-hover: white;--button-content-color-down: white;--button-content-color-focus: white;--button-background-color-disabled: var(--luzmo-background-color-disabled);--button-border-color-disabled: transparent;--button-content-color-disabled: var(--luzmo-disabled-color)}:host([variant=primary][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-down);--button-background-color-focus: var(--luzmo-background-color-focus);--button-border-color-default: var(--luzmo-primary);--button-border-color-hover: var(--luzmo-primary-hover);--button-border-color-down: var(--luzmo-primary-down);--button-border-color-focus: var(--luzmo-primary-focus);--button-content-color-default: var(--luzmo-primary);--button-content-color-hover: var(--luzmo-primary-down);--button-content-color-down: var(--luzmo-primary-down);--button-content-color-focus: var(--luzmo-primary-focus);--button-background-color-disabled: transparent;--button-border-color-disabled: var(--luzmo-border-color-disabled);--button-content-color-disabled: var(--luzmo-font-color-disabled)}:host([variant=secondary]){--button-background-color-default: var(--luzmo-secondary);--button-background-color-hover: var(--luzmo-secondary-hover);--button-background-color-down: var(--luzmo-secondary-down);--button-background-color-focus: var(--luzmo-secondary-focus);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: white;--button-content-color-hover: white;--button-content-color-down: white;--button-content-color-focus: white;--button-background-color-disabled: var(--luzmo-background-color-disabled);--button-border-color-disabled: transparent;--button-content-color-disabled: var(--luzmo-disabled-color)}:host([variant=secondary][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-down);--button-background-color-focus: var(--luzmo-background-color-focus);--button-border-color-default: var(--luzmo-secondary);--button-border-color-hover: var(--luzmo-secondary-hover);--button-border-color-down: var(--luzmo-secondary-down);--button-border-color-focus: var(--luzmo-secondary-focus);--button-content-color-default: var(--luzmo-secondary);--button-content-color-hover: var(--luzmo-secondary-down);--button-content-color-down: var(--luzmo-secondary-down);--button-content-color-focus: var(--luzmo-secondary-focus);--button-background-color-disabled: transparent;--button-border-color-disabled: var(--luzmo-border-color-disabled);--button-content-color-disabled: var(--luzmo-font-color-disabled)}:host([quiet]){--button-background-color-default: transparent;--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-down);--button-background-color-focus: var(--luzmo-background-color-focus);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-background-color-disabled: transparent;--button-border-color-disabled: transparent}:host([selected]){--button-background-color-default: var(--luzmo-selected-color);--button-background-color-hover: var(--luzmo-selected-color-hover);--button-background-color-down: var(--luzmo-selected-color-down);--button-background-color-focus: var(--luzmo-selected-color-focus);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: white;--button-content-color-hover: white;--button-content-color-down: white;--button-content-color-focus: white;--button-background-color-disabled: var(--luzmo-background-color-disabled);--button-border-color-disabled: transparent}:host([selected][emphasized]){--button-background-color-default: transparent;--button-background-color-hover: var(--luzmo-background-color-hover);--button-background-color-down: var(--luzmo-background-color-down);--button-background-color-focus: var(--luzmo-background-color-focus)}:host([static-color=black][quiet]){--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-border-color-disabled: transparent}:host([static-color=white][quiet]){--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-border-color-disabled: transparent}:host([static-color=white]){--button-background-color-default: rgba(255, 255, 255 .9);--button-background-color-hover: rgb(255, 255, 255);--button-background-color-down: rgb(255, 255, 255);--button-background-color-focus: rgb(255, 255, 255);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: rgb(0, 0, 0);--button-content-color-hover: rgb(0, 0, 0);--button-content-color-down: rgb(0, 0, 0);--button-content-color-focus: rgb(0, 0, 0);--button-focus-indicator-color: rgb(255, 255, 255);--button-background-color-disabled: rgba(255, 255, 255, .1);--button-border-color-disabled: transparent;--button-content-color-disabled: rgba(255, 255, 255, .55)}:host([static-color=white][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: rgba(255, 255, 255, .25);--button-background-color-down: rgba(255, 255, 255, .4);--button-background-color-focus: rgba(255, 255, 255, .25);--button-border-color-default: rgba(255, 255, 255, .9);--button-border-color-hover: rgb(255, 255, 255);--button-border-color-down: rgb(255, 255, 255);--button-border-color-focus: rgb(255, 255, 255);--button-content-color-default: rgb(255, 255, 255);--button-content-color-hover: rgb(255, 255, 255);--button-content-color-down: rgb(255, 255, 255);--button-content-color-focus: rgb(255, 255, 255);--button-focus-indicator-color: rgb(255, 255, 255);--button-background-color-disabled: transparent;--button-border-color-disabled: rgba(255, 255, 255, .25);--button-content-color-disabled: rgba(255, 255, 255, .55)}:host([static-color=white][selected]){--button-background-color-default: rgba(255, 255, 255, .9);--button-background-color-hover: rgb(255, 255, 255);--button-background-color-down: rgb(255, 255, 255);--button-background-color-focus: rgb(255, 255, 255);--button-static-white-content-color-default: rgb(0, 0, 0);--button-static-white-content-color-hover: rgb(0, 0, 0);--button-static-white-content-color-down: rgb(0, 0, 0);--button-static-white-content-color-focus: rgb(0, 0, 0);--button-background-color-disabled: rgba(255, 255, 255, .1);--button-border-color-disabled: transparent}:host([static-color=white][variant=secondary]){--button-background-color-default: rgba(255, 255, 255, .1);--button-background-color-hover: rgba(255, 255, 255, .25);--button-background-color-down: rgba(255, 255, 255, .4);--button-background-color-focus: rgba(255, 255, 255, .25);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: rgb(255, 255, 255);--button-content-color-hover: rgb(255, 255, 255);--button-content-color-down: rgb(255, 255, 255);--button-content-color-focus: rgb(255, 255, 255);--button-focus-indicator-color: rgb(255, 255, 255);--button-background-color-disabled: rgba(255, 255, 255, .1);--button-border-color-disabled: transparent;--button-content-color-disabled: rgba(255, 255, 255, .55)}:host([static-color=white][variant=secondary][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: rgba(255, 255, 255, .25);--button-background-color-down: rgba(255, 255, 255, .4);--button-background-color-focus: rgba(255, 255, 255, .25);--button-border-color-default: rgba(255, 255, 255, .25);--button-border-color-hover: rgba(255, 255, 255, .4);--button-border-color-down: rgba(255, 255, 255, .55);--button-border-color-focus: rgba(255, 255, 255, .4);--button-content-color-default: rgb(255, 255, 255);--button-content-color-hover: rgb(255, 255, 255);--button-content-color-down: rgb(255, 255, 255);--button-content-color-focus: rgb(255, 255, 255);--button-focus-indicator-color: rgb(255, 255, 255);--button-background-color-disabled: transparent;--button-border-color-disabled: rgba(255, 255, 255, .25);--button-content-color-disabled: rgba(255, 255, 255, .55)}:host([static-color=black]){--button-background-color-default: rgba(0, 0, 0, .9);--button-background-color-hover: rgb(0, 0, 0);--button-background-color-down: rgb(0, 0, 0);--button-background-color-focus: rgb(0, 0, 0);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: rgb(255, 255, 255);--button-content-color-hover: rgb(255, 255, 255);--button-content-color-down: rgb(255, 255, 255);--button-content-color-focus: rgb(255, 255, 255);--button-focus-indicator-color: rgb(0, 0, 0);--button-background-color-disabled: rgba(0, 0, 0, .1);--button-border-color-disabled: transparent;--button-content-color-disabled: rgba(0, 0, 0, .55)}:host([static-color=black][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: rgba(0, 0, 0, .25);--button-background-color-down: rgba(0, 0, 0, .4);--button-background-color-focus: rgba(0, 0, 0, .25);--button-border-color-default: rgba(0, 0, 0, .4);--button-border-color-hover: rgba(0, 0, 0, .55);--button-border-color-down: rgba(0, 0, 0, .7);--button-border-color-focus: rgba(0, 0, 0, .55);--button-content-color-default: rgb(0, 0, 0);--button-content-color-hover: rgb(0, 0, 0);--button-content-color-down: rgb(0, 0, 0);--button-content-color-focus: rgb(0, 0, 0);--button-focus-indicator-color: rgb(0, 0, 0);--button-background-color-disabled: transparent;--button-border-color-disabled: rgba(0, 0, 0, .25);--button-content-color-disabled: rgba(0, 0, 0, .55)}:host([static-color=black][variant=secondary]){--button-background-color-default: rgba(0, 0, 0, .1);--button-background-color-hover: rgba(0, 0, 0, .25);--button-background-color-down: rgba(0, 0, 0, .4);--button-background-color-focus: rgba(0, 0, 0, .25);--button-border-color-default: transparent;--button-border-color-hover: transparent;--button-border-color-down: transparent;--button-border-color-focus: transparent;--button-content-color-default: rgb(0, 0, 0);--button-content-color-hover: rgb(0, 0, 0);--button-content-color-down: rgb(0, 0, 0);--button-content-color-focus: rgb(0, 0, 0);--button-focus-indicator-color: rgb(0, 0, 0);--button-background-color-disabled: rgba(0, 0, 0, .1);--button-border-color-disabled: transparent;--button-content-color-disabled: rgba(0, 0, 0, .55)}:host([static-color=black][variant=secondary][treatment=outline]){--button-background-color-default: transparent;--button-background-color-hover: rgba(0, 0, 0, .25);--button-background-color-down: rgba(0, 0, 0, .4);--button-background-color-focus: rgba(0, 0, 0, .25);--button-border-color-default: rgba(0, 0, 0, .25);--button-border-color-hover: rgba(0, 0, 0, .4);--button-border-color-down: rgba(0, 0, 0, .55);--button-border-color-focus: rgba(0, 0, 0, .4);--button-content-color-default: rgb(0, 0, 0);--button-content-color-hover: rgb(0, 0, 0);--button-content-color-down: rgb(0, 0, 0);--button-content-color-focus: rgb(0, 0, 0);--button-focus-indicator-color: rgb(0, 0, 0);--button-background-color-disabled: transparent;--button-border-color-disabled: rgba(0, 0, 0, .25);--button-content-color-disabled: rgba(0, 0, 0, .55)}:host([size=s]){--button-min-width: 54px;--button-border-radius: var(--luzmo-border-radius-s);--button-height: 24px;--button-font-size: 12px;--button-edge-to-visual: 8px;--button-edge-to-visual-only: 4px;--button-edge-to-text: 10px;--button-padding-label-to-icon: 7px;--button-top-to-text: 5px;--button-bottom-to-text: 4px;--button-top-to-icon: 4px;--button-intended-icon-size: 16px}:host{--button-min-width: 72px;--button-border-radius: var(--luzmo-border-radius);--button-height: 32px;--button-font-size: 14px;--button-edge-to-visual: 12px;--button-edge-to-visual-only: 7px;--button-edge-to-text: 14px;--button-padding-label-to-icon: 8px;--button-top-to-text: 7px;--button-bottom-to-text: 8px;--button-top-to-icon: 7px;--button-intended-icon-size: 18px}:host([size=l]){--button-min-width: 90px;--button-border-radius: var(--luzmo-border-radius);--button-height: 40px;--button-font-size: 16px;--button-edge-to-visual: 16px;--button-edge-to-visual-only: 10px;--button-edge-to-text: 18px;--button-padding-label-to-icon: 9px;--button-top-to-text: 10px;--button-bottom-to-text: 10px;--button-top-to-icon: 10px;--button-intended-icon-size: 20px}:host([size=xl]){--button-min-width: 108px;--button-border-radius: var(--luzmo-border-radius);--button-height: 48px;--button-font-size: 18px;--button-edge-to-visual: 19px;--button-edge-to-visual-only: 13px;--button-edge-to-text: 22px;--button-padding-label-to-icon: 10px;--button-top-to-text: 13px;--button-bottom-to-text: 13px;--button-top-to-icon: 13px;--button-intended-icon-size: 22px}@media (forced-colors: active){:host([treatment][disabled]){border-color:graytext}:host([treatment]:not([disabled]):hover){border-color:highlight}}@keyframes show-progress-circle{0%{visibility:hidden}to{visibility:visible}}@keyframes hide-icons-label{0%{visibility:visible}to{visibility:hidden}}@keyframes update-pending-button-styles{to{background-color:var(--highcontrast-button-background-color-disabled, var(--luzmo-button-background-color-disabled, var(--button-background-color-disabled)));border-color:var(--highcontrast-button-border-color-disabled, var(--luzmo-button-border-color-disabled, var(--button-border-color-disabled)));color:var(--highcontrast-button-content-color-disabled, var(--luzmo-button-content-color-disabled, var(--button-content-color-disabled)))}}:host([pending]:not([disabled])){cursor:default;pointer-events:none;animation:update-pending-button-styles 0s var(--pending-delay, 1s) forwards}::slotted([slot=icon]){visibility:revert-layer;--luzmo-progress-circle-position: relative;--icon-size: inherit}luzmo-progress-circle{display:block;visibility:hidden;position:absolute;left:50%;transform:translate(-50%)}:host([pending]:not([disabled])) luzmo-progress-circle{animation:show-progress-circle 0s var(--pending-delay, 1s) forwards}:host([pending]:not([disabled])) slot[name=icon],:host([pending]:not([disabled])) #label{animation:hide-icons-label 0s var(--pending-delay, 1s) forwards}';var m=Object.defineProperty,f=Object.getOwnPropertyDescriptor,a=(u,o,c,e)=>{for(var n=e>1?void 0:e?f(o,c):o,l=u.length-1,b;l>=0;l--)(b=u[l])&&(n=(e?b(o,c,n):b(n))||n);return e&&n&&m(o,c,n),n};const p=["primary","secondary","negative","white","black"];class r extends g.SizedMixin(v.LuzmoButtonBase,{noDefaultSize:!0}){constructor(){super(),this.pendingLabel="Pending",this.pending=!1,this._variant="primary",this.treatment="fill",this.noWrap=!1,this.pendingStateController=new s.PendingStateController(this)}static get styles(){return[...super.styles,t.r(h)]}click(){this.pending||super.click()}get variant(){return this._variant}set variant(o){if(o!==this.variant){switch(this.requestUpdate("variant",this.variant),o){case"white":{this.staticColor=o,this.removeAttribute("variant");return}case"black":{this.staticColor=o,this.removeAttribute("variant");return}case null:return;default:{this._variant=p.includes(o)?o:"primary";break}}this.setAttribute("variant",this.variant)}}set quiet(o){this.treatment=o?"outline":"fill"}get quiet(){return this.treatment==="outline"}firstUpdated(o){super.firstUpdated(o),this.hasAttribute("variant")||this.setAttribute("variant",this.variant),this.pending&&this.pendingStateController.hostUpdated()}renderButton(){return t.x`
|
|
19
19
|
${this.buttonContent} ${this.pendingStateController.renderPendingState()}
|
|
20
20
|
`}}a([t.n({type:String,attribute:"pending-label"})],r.prototype,"pendingLabel",2);a([t.n({type:Boolean,reflect:!0,attribute:!0})],r.prototype,"pending",2);a([t.n()],r.prototype,"variant",1);a([t.n({reflect:!0,attribute:"static-color"})],r.prototype,"staticColor",2);a([t.n({reflect:!0})],r.prototype,"treatment",2);a([t.n({type:Boolean})],r.prototype,"quiet",1);a([t.n({type:Boolean,attribute:"no-wrap",reflect:!0})],r.prototype,"noWrap",2);customElements.get("luzmo-button")||customElements.define("luzmo-button",r);customElements.get("luzmo-clear-button")||customElements.define("luzmo-clear-button",d.LuzmoClearButton);customElements.get("luzmo-close-button")||customElements.define("luzmo-close-button",i.LuzmoCloseButton);exports.LuzmoClearButton=d.LuzmoClearButton;exports.LuzmoCloseButton=i.LuzmoCloseButton;exports.LuzmoButton=r;
|
|
@@ -15,12 +15,12 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { r as i, x as s, n as e } from "../base-
|
|
19
|
-
import { P as g } from "../pending-state-
|
|
20
|
-
import { S as m } from "../sized-mixin-
|
|
21
|
-
import { L as v } from "../button-base-
|
|
22
|
-
import { L as h } from "../clear-button-
|
|
23
|
-
import { L as f } from "../close-button-
|
|
18
|
+
import { r as i, x as s, n as e } from "../base-WsynuqaS.js";
|
|
19
|
+
import { P as g } from "../pending-state-C5OtdXCm.js";
|
|
20
|
+
import { S as m } from "../sized-mixin-D4ACoVUr.js";
|
|
21
|
+
import { L as v } from "../button-base-DbkDzb71.js";
|
|
22
|
+
import { L as h } from "../clear-button-DoeRUWQ3.js";
|
|
23
|
+
import { L as f } from "../close-button-BWXdHSx3.js";
|
|
24
24
|
const d = () => {
|
|
25
25
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
26
26
|
const r = document.createElement("style");
|
|
@@ -15,11 +15,11 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { r as c, x as i, n as h } from "./base-
|
|
18
|
+
import { r as c, x as i, n as h } from "./base-WsynuqaS.js";
|
|
19
19
|
import { e as u } from "./query-D_KR_GUc.js";
|
|
20
|
-
import { F as p } from "./focusable-
|
|
21
|
-
import { L as d } from "./like-anchor-
|
|
22
|
-
import { O as b } from "./observe-slot-text-
|
|
20
|
+
import { F as p } from "./focusable-BxtpnzWp.js";
|
|
21
|
+
import { L as d } from "./like-anchor-Bvn_vLQ8.js";
|
|
22
|
+
import { O as b } from "./observe-slot-text-BPfIQQtz.js";
|
|
23
23
|
const m = ":host{display:inline-flex;vertical-align:top;--parent-element-progress-circle-size: 18px;--icon-size: 18px}:host([dir]){-webkit-appearance:none}:host([disabled]){pointer-events:none;cursor:auto}#button{position:absolute;top:0;right:0;bottom:0;left:0}::slotted(luzmo-overlay),::slotted(luzmo-tooltip){position:absolute}:host:after{pointer-events:none}::slotted(*){pointer-events:none}::slotted([slot=icon]){--luzmo-icon-vertical-align: 0}slot[name=icon]::slotted(svg),slot[name=icon]::slotted(img){fill:currentcolor;stroke:currentcolor;block-size:var(--luzmo-button-icon-size, var(--icon-size));inline-size:var(--luzmo-button-icon-size, var(--icon-size))}[icon-only]+#label{display:contents}:host([size=s]){--parent-element-progress-circle-size: 16px;--icon-size: 16px}:host([size=l]){--parent-element-progress-circle-size: 20px;--icon-size: 20px}:host([size=xl]){--parent-element-progress-circle-size: 22px;--icon-size: 22px}";
|
|
24
24
|
var f = Object.defineProperty, n = (r, t, e, y) => {
|
|
25
25
|
for (var s = void 0, o = r.length - 1, l; o >= 0; o--)
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";const s=require("./base-
|
|
18
|
+
"use strict";const s=require("./base-CBCg3yyw.cjs"),h=require("./query-BL-TJj7K.cjs"),c=require("./focusable-EbipgXRh.cjs"),u=require("./like-anchor-sod1C1fR.cjs"),p=require("./observe-slot-text-Ceb7SvYT.cjs"),d=":host{display:inline-flex;vertical-align:top;--parent-element-progress-circle-size: 18px;--icon-size: 18px}:host([dir]){-webkit-appearance:none}:host([disabled]){pointer-events:none;cursor:auto}#button{position:absolute;top:0;right:0;bottom:0;left:0}::slotted(luzmo-overlay),::slotted(luzmo-tooltip){position:absolute}:host:after{pointer-events:none}::slotted(*){pointer-events:none}::slotted([slot=icon]){--luzmo-icon-vertical-align: 0}slot[name=icon]::slotted(svg),slot[name=icon]::slotted(img){fill:currentcolor;stroke:currentcolor;block-size:var(--luzmo-button-icon-size, var(--icon-size));inline-size:var(--luzmo-button-icon-size, var(--icon-size))}[icon-only]+#label{display:contents}:host([size=s]){--parent-element-progress-circle-size: 16px;--icon-size: 16px}:host([size=l]){--parent-element-progress-circle-size: 20px;--icon-size: 20px}:host([size=xl]){--parent-element-progress-circle-size: 22px;--icon-size: 22px}";var b=Object.defineProperty,l=(n,e,t,f)=>{for(var i=void 0,o=n.length-1,a;o>=0;o--)(a=n[o])&&(i=a(e,t,i)||i);return i&&b(e,t,i),i};class r extends p.ObserveSlotText(u.LikeAnchor(c.Focusable),"",["luzmo-overlay,luzmo-tooltip"]){constructor(){super(),this.active=!1,this.type="button",this.proxyFocus=this.proxyFocus.bind(this),this.addEventListener("click",this.handleClickCapture,{capture:!0})}static get styles(){return[s.r(d)]}get focusElement(){return this}get hasLabel(){return this.slotHasContent}get buttonContent(){return[s.x` <slot name="icon" ?icon-only=${!this.hasLabel}></slot> `,s.x`
|
|
19
19
|
<span id="label">
|
|
20
20
|
<slot @slotchange=${this.manageTextObservedSlot}></slot>
|
|
21
21
|
</span>
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../base-
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const o=require("../base-CBCg3yyw.cjs"),u=require("../sized-mixin-CPxE5C96.cjs"),c=":host{gap:var(--luzmo-button-group-spacing-horizontal, var(--button-group-spacing-horizontal));justify-content:normal;justify-content:var(--luzmo-button-group-justify-content, normal);flex-wrap:wrap;display:flex}::slotted(*){flex-shrink:0}:host([vertical]){gap:var(--luzmo-button-group-spacing-vertical, var(--button-group-spacing-vertical));flex-direction:column;display:inline-flex}:host,:host([size=l]),:host([size=xl]){--button-group-spacing-horizontal: 16px;--button-group-spacing-vertical: 16px}:host([size=s]){--button-group-spacing-horizontal: 12px;--button-group-spacing-vertical: 12px}:host([vertical]) ::slotted(luzmo-action-button){--parent-element-action-button-label-flex-grow: 1}:host([dir=ltr][vertical]) ::slotted(luzmo-action-button){--parent-element-action-button-label-text-align: left}:host([dir=rtl][vertical]) ::slotted(luzmo-action-button){--parent-element-action-button-label-text-align: right}";var p=Object.defineProperty,g=(n,e,l,i)=>{for(var t=void 0,r=n.length-1,a;r>=0;r--)(a=n[r])&&(t=a(e,l,t)||t);return t&&p(e,l,t),t};class s extends u.SizedMixin(o.LuzmoElement,{noDefaultSize:!0}){constructor(){super(...arguments),this.vertical=!1}static get styles(){return[o.r(c)]}handleSlotchange({target:e}){e.assignedElements().forEach(i=>{i.size=this.size})}render(){return o.x` <slot @slotchange=${this.handleSlotchange}></slot> `}}g([o.n({type:Boolean,reflect:!0})],s.prototype,"vertical");customElements.get("luzmo-button-group")||customElements.define("luzmo-button-group",s);exports.LuzmoButtonGroup=s;
|
|
@@ -15,8 +15,8 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { a as m, r as a, x as s, n as z } from "../base-
|
|
19
|
-
import { S as d } from "../sized-mixin-
|
|
18
|
+
import { a as m, r as a, x as s, n as z } from "../base-WsynuqaS.js";
|
|
19
|
+
import { S as d } from "../sized-mixin-D4ACoVUr.js";
|
|
20
20
|
const c = () => {
|
|
21
21
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
22
22
|
const o = document.createElement("style");
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../index-BLWuwZXx.cjs");exports.LuzmoCalendar=e.LuzmoCalendar;
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { L as u } from "../index-
|
|
18
|
+
import { L as u } from "../index-A-yOTB_d.js";
|
|
19
19
|
const l = () => {
|
|
20
20
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
21
21
|
const o = document.createElement("style");
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("@luzmo/icons"),o=require("../base-CTSOJw6c.cjs"),b=require("../sized-mixin-CDhX3fJn.cjs"),d=require("../checkbox-mixin-CcPwhZst.cjs"),u=':host{color:var(--highcontrast-checkbox-content-color-default, var(--luzmo-checkbox-content-color-default, var(--luzmo-font-color-hard)));min-block-size:var(--luzmo-checkbox-height, var(--checkbox-height, 32px));max-inline-size:100%;vertical-align:top;align-items:flex-start;display:inline-flex;position:relative;font-family:var(--luzmo-checkbox-font-family, var(--luzmo-font-family))}:host(:is(:active,[active])) #box:before{border-color:var(--highcontrast-checkbox-highlight-color-down, var(--luzmo-checkbox-control-color-down, var(--luzmo-font-color-hard)))}:host(:is(:active,[active])) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-down, var(--luzmo-checkbox-control-selected-color-down, var(--luzmo-font-color-hard)))}:host(:is(:active,[active])) #label{color:var(--highcontrast-checkbox-content-color-down, var(--luzmo-checkbox-content-color-down, var(--luzmo-font-color-hard)))}:host([invalid][invalid]) #box:before,:host([invalid][invalid]) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-invalid-color-default, var(--luzmo-negative-color)))}:host([invalid][invalid]) #input:focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input:focus-visible+#box:before{border-color:var(--highcontrast-checkbox-color-hover, var(--luzmo-checkbox-invalid-color-hover, var(--luzmo-negative-color)))}:host([readonly]){border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-control-selected-color-default, var(--luzmo-font-color)))}:host([readonly]:is(:active,[active])) #box:before{border-color:var(--highcontrast-checkbox-selected-color-default, var(--luzmo-checkbox-control-selected-color-default, var(--luzmo-font-color)))}:host([readonly]) #input:checked:disabled+#box:before,:host([readonly]) #input:disabled+#box:before{border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-control-selected-color-default, var(--luzmo-font-color)));background-color:var(--highcontrast-checkbox-background-color-default, var(--luzmo-checkbox-checkmark-color, var(--luzmo-background-color)))}:host([readonly]) #input:checked:disabled~#label,:host([readonly]) #input:disabled~#label{forced-color-adjust:none;color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-content-color-default, var(--luzmo-font-color-hard)))}:host([indeterminate]) #box:before,:host([indeterminate]) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-default, var(--luzmo-checkbox-control-selected-color-default, var(--luzmo-font-color)));border-width:var(--luzmo-checkbox-selected-border-width, calc(var(--checkbox-control-size, 14px) / 2))}:host([indeterminate]) #box #checkmark,:host([indeterminate]) #input:checked+#box #checkmark{display:none}:host([indeterminate]) #box #partialCheckmark,:host([indeterminate]) #input:checked+#box #partialCheckmark{opacity:1;display:flex;transform:scale(1)}:host([indeterminate]) #input:focus-visible+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-focus, var(--luzmo-checkbox-control-selected-color-focus, var(--luzmo-font-color-hard)))}:host([invalid][invalid][indeterminate]) #box:before,:host([invalid][invalid][indeterminate]) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-invalid-color-default, var(--luzmo-negative-color)));border-width:var(--luzmo-checkbox-selected-border-width, calc(var(--checkbox-control-size, 14px) / 2))}:host([emphasized]) #input:checked+#box:before,:host([emphasized][indeterminate]) #box:before,:host([emphasized][indeterminate]) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-default, var(--luzmo-checkbox-emphasized-color-default, var(--luzmo-primary)))}:host([emphasized]) #input:focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input:focus-visible+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-focus, var(--luzmo-checkbox-emphasized-color-focus, var(--luzmo-primary)))}:host([emphasized][invalid][invalid]) #input:focus-visible:checked+#box:before{border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-invalid-color-focus, var(--luzmo-negative-color)))}@media (hover: hover){:host(:hover) #box:before{border-color:var(--highcontrast-checkbox-highlight-color-hover, var(--luzmo-checkbox-control-color-hover, var(--luzmo-font-color)))}:host(:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-hover, var(--luzmo-checkbox-control-selected-color-hover, var(--luzmo-font-color-hard)))}:host(:hover) #label{color:var(--highcontrast-checkbox-content-color-hover, var(--luzmo-checkbox-content-color-hover, var(--luzmo-font-color-hard)))}:host([invalid][invalid]:hover) #box:before,:host([invalid][invalid]:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-hover, var(--luzmo-checkbox-invalid-color-hover, var(--luzmo-negative-color)))}:host([readonly]:hover) #box:before{border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-control-selected-color-default, var(--luzmo-font-color)))}:host([indeterminate]:hover) #box:before,:host([indeterminate]:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-hover, var(--luzmo-checkbox-control-selected-color-hover, var(--luzmo-font-color-hard)))}:host([invalid][invalid][indeterminate]:hover) #box:before,:host([invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-invalid-color-hover, var(--luzmo-negative-color)))}:host([invalid][invalid][indeterminate]:hover) #label{color:var(--highcontrast-checkbox-content-color-hover, var(--luzmo-checkbox-content-color-hover, var(--luzmo-font-color-hard)))}:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before,:host([emphasized]:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-hover, var(--luzmo-checkbox-emphasized-color-hover, var(--luzmo-primary)))}:host([emphasized][invalid][invalid][indeterminate]:hover) #box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #input:checked+#box:before,:host([emphasized][invalid][invalid]:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-hover, var(--luzmo-checkbox-invalid-color-hover, var(--luzmo-negative-color)))}:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before,:host([emphasized]:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-hover, var(--luzmo-checkbox-emphasized-color-hover, var(--luzmo-primary)))}}:host([emphasized][indeterminate]:is(:active,[active])) #box:before,:host([emphasized][indeterminate]:is(:active,[active])) #input:checked+#box:before,:host([emphasized]:is(:active,[active])) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-default, var(--luzmo-checkbox-emphasized-color-down, var(--luzmo-primary)))}:host([emphasized][invalid][invalid]:is(:active,[active])) #box:before,:host([emphasized][invalid][invalid]:is(:active,[active])) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-default, var(--luzmo-checkbox-control-invalid-color-down, var(--luzmo-negative-color)))}:host([emphasized]:focus-visible) #box:before,:host([emphasized]:focus-visible) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-focus, var(--luzmo-checkbox-control-color-focus, var(--luzmo-font-color)))}#label{text-align:start;font-size:var(--luzmo-checkbox-font-size, var(--checkbox-font-size, 14px));transition:color var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-in-out;line-height:var(--luzmo-checkbox-line-height, 1.3);margin-block-start:var(--luzmo-checkbox-top-to-text, var(--checkbox-top-to-text, 6px));margin-inline-start:var(--luzmo-checkbox-text-to-control, var(--checkbox-text-to-control, 10px))}#label:lang(ja),#label:lang(ko),#label:lang(zh){line-height:var(--luzmo-checkbox-line-height-cjk, 1.5)}#input{color:var(--luzmo-checkbox-control-color-default, var(--luzmo-font-color));box-sizing:border-box;inline-size:100%;block-size:100%;opacity:.0001;z-index:1;cursor:pointer;margin:0;padding:0;font-family:inherit;font-size:100%;line-height:1.15;position:absolute;overflow:visible}#input:disabled{cursor:default}#input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-default, var(--luzmo-checkbox-control-selected-color-default, var(--luzmo-font-color)));background-color:var(--luzmo-checkbox-checkmark-color, var(--luzmo-background-color));border-width:var(--luzmo-checkbox-selected-border-width, calc(var(--checkbox-control-size, 14px) / 2))}#input:checked+#box #checkmark{opacity:1;transform:scale(1)}#input:focus-visible+#box:before{border-color:var(--highcontrast-checkbox-color-focus, var(--luzmo-checkbox-control-color-focus, var(--luzmo-font-color)))}#input:focus-visible+#box:after{forced-color-adjust:none;box-shadow:0 0 0 var(--luzmo-checkbox-focus-indicator-width, var(--luzmo-indicator-width)) var(--highcontrast-checkbox-focus-indicator-color, var(--luzmo-checkbox-focus-indicator-color, var(--luzmo-primary)));margin:calc(var(--luzmo-checkbox-focus-indicator-gap, 2px) * -1)}#input:focus-visible+#label{color:var(--highcontrast-checkbox-content-color-focus, var(--luzmo-checkbox-content-color-focus, var(--luzmo-font-color-hard)))}#input:focus-visible:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-focus, var(--luzmo-checkbox-control-selected-color-focus, var(--luzmo-font-color-hard)))}#box{--luzmo-checkbox-spacing: calc( var(--luzmo-checkbox-height, var(--checkbox-height, 32px)) - var( --luzmo-checkbox-control-size, var(--checkbox-control-size, 14px) ) );margin:calc(var(--luzmo-checkbox-spacing) / 2) 0;flex-grow:0;flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}#box,#box:before{box-sizing:border-box;inline-size:var(--luzmo-checkbox-control-size, var(--checkbox-control-size, 14px));block-size:var(--luzmo-checkbox-control-size, var(--checkbox-control-size, 14px))}#box:before{forced-color-adjust:none;border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-control-color-default, var(--luzmo-font-color)));z-index:0;content:"";border-radius:var(--luzmo-checkbox-control-corner-radius, 2px);border-width:var(--luzmo-checkbox-border-width, var(--luzmo-border-width));transition:border var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-in-out,box-shadow var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-in-out;border-style:solid;display:block;position:absolute}#box:after{border-radius:calc(var(--luzmo-checkbox-control-corner-radius, 2px) + var(--luzmo-checkbox-focus-indicator-gap, 2px));content:"";margin:var(--luzmo-checkbox-focus-indicator-gap, 2px);transition:box-shadow var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-out,margin var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-out;display:block;position:absolute;inset-block:0;inset-inline:0;transform:translate(0)}#checkmark,#partialCheckmark{pointer-events:none;color:var(--highcontrast-checkbox-background-color-default, var(--luzmo-checkbox-checkmark-color, var(--luzmo-background-color)));opacity:0;transition:opacity var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-in-out,transform var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-in-out;transform:scale(0);width:var(--textbox-control-size, 14px);display:flex;align-items:center;justify-content:center;font-size:var(--checkbox-icon-size)}#partialCheckmark{display:none}#input:checked:disabled+#box:before,#input:disabled+#box:before{border-color:var(--highcontrast-checkbox-disabled-color-default, var(--luzmo-checkbox-control-color-disabled, var(--luzmo-disabled-color)));background-color:var(--highcontrast-checkbox-background-color-default, var(--luzmo-checkbox-checkmark-color, var(--luzmo-background-color)))}#input:checked:disabled~#label,#input:disabled~#label{forced-color-adjust:none;color:var(--highcontrast-checkbox-disabled-color-default, var(--luzmo-checkbox-content-color-disabled, var(--luzmo-disabled-color)))}@media (forced-colors: active){#input:focus-visible+#box{forced-color-adjust:none;outline-color:var(--highcontrast-checkbox-focus-indicator-color, var(--luzmo-checkbox-focus-indicator-color, var(--luzmo-primary)));outline-offset:var(--highcontrast-checkbox-focus-indicator-gap, var(--luzmo-checkbox-focus-indicator-gap, 2px));outline-style:auto;outline-width:var(--luzmo-focus-indicator-width, var(--luzmo-indicator-width))}#input:focus-visible+#box:after{box-shadow:0 0 0 0 var(--highcontrast-checkbox-focus-indicator-color, var(--luzmo-checkbox-focus-indicator-color, var(--luzmo-primary)))}:host{--highcontrast-checkbox-content-color-default: CanvasText;--highcontrast-checkbox-content-color-hover: CanvasText;--highcontrast-checkbox-content-color-down: CanvasText;--highcontrast-checkbox-content-color-focus: CanvasText;--highcontrast-checkbox-background-color-default: Canvas;--highcontrast-checkbox-color-default: ButtonText;--highcontrast-checkbox-color-hover: ButtonText;--highcontrast-checkbox-color-focus: Highlight;--highcontrast-checkbox-highlight-color-default: Highlight;--highcontrast-checkbox-highlight-color-hover: Highlight;--highcontrast-checkbox-highlight-color-down: Highlight;--highcontrast-checkbox-highlight-color-focus: Highlight;--highcontrast-checkbox-disabled-color-default: GrayText;--highcontrast-checkbox-focus-indicator-color: CanvasText}}:host([size=s]){--checkbox-font-size: var(--luzmo-checkbox-size-s-font-size, 12px);--checkbox-height: var(--luzmo-checkbox-size-s-height, 24px);--checkbox-control-size: var(--luzmo-checkbox-size-s-control-size, 12px);--checkbox-top-to-text: var(--luzmo-checkbox-size-s-top-to-text, 4px);--checkbox-text-to-control: var(--luzmo-checkbox-size-s-text-to-control, 9px);--checkbox-icon-size: var(--luzmo-checkbox-size-s-icon-size, 9px)}:host{--checkbox-font-size: var(--luzmo-checkbox-size-m-font-size, 14px);--checkbox-height: var(--luzmo-checkbox-size-m-height, 32px);--checkbox-control-size: var(--luzmo-checkbox-size-m-control-size, 14px);--checkbox-top-to-text: var(--luzmo-checkbox-size-m-top-to-text, 6px);--checkbox-text-to-control: var( --luzmo-checkbox-size-m-text-to-control, 10px );--checkbox-icon-size: var(--luzmo-checkbox-size-m-icon-size, 10px)}:host([size=l]){--checkbox-font-size: var(--luzmo-checkbox-size-l-font-size, 16px);--checkbox-height: var(--luzmo-checkbox-size-l-height, 40px);--checkbox-control-size: var(--luzmo-checkbox-size-l-control-size, 16px);--checkbox-top-to-text: var(--luzmo-checkbox-size-l-top-to-text, 9px);--checkbox-text-to-control: var( --luzmo-checkbox-size-l-text-to-control, 11px );--checkbox-icon-size: var(--luzmo-checkbox-size-l-icon-size, 11px)}:host([size=xl]){--checkbox-font-size: var(--luzmo-checkbox-size-xl-font-size, 18px);--checkbox-height: var(--luzmo-checkbox-size-xl-height, 48px);--checkbox-control-size: var(--luzmo-checkbox-size-xl-control-size, 18px);--checkbox-top-to-text: var(--luzmo-checkbox-size-xl-top-to-text, 12px);--checkbox-text-to-control: var( --luzmo-checkbox-size-xl-text-to-control, 13px );--checkbox-icon-size: var(--luzmo-checkbox-size-xl-icon-size, 12px)}:host{display:inline-flex;vertical-align:top}:host(:focus){outline:none}:host([disabled]){pointer-events:none}:host(:empty) label{display:none}';var x=Object.defineProperty,t=(h,e,n,k)=>{for(var r=void 0,a=h.length-1,s;a>=0;a--)(s=h[a])&&(r=s(e,n,r)||r);return r&&x(e,n,r),r};const v=()=>o.x`<div id="checkmark">${i.luzmoIcon(i.luzmoCheck)}</div>`,m=()=>o.x`<div id="partialCheckmark">${i.luzmoIcon(i.luzmoDash)}</div>`,l=class l extends b.SizedMixin(d.checkboxMixin(o.LuzmoElement),{noDefaultSize:!0}){constructor(){super(...arguments),this.disabled=!1,this.indeterminate=!1,this.autofocus=!1,this.invalid=!1,this.emphasized=!1,this.tabIndex=0}connectedCallback(){super.connectedCallback(),this.hasAttribute("autofocus")&&this.updateComplete.then(()=>{this.focus()})}static get styles(){return[o.r(u)]}click(){var e;this.disabled||(e=this.inputElement)==null||e.click()}handleChange(){this.indeterminate=!1,super.handleChange()}render(){return o.x`
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../luzmo-icons-DletXGWU.cjs"),o=require("../base-CBCg3yyw.cjs"),b=require("../sized-mixin-CPxE5C96.cjs"),d=require("../checkbox-mixin-BDN0dBtS.cjs"),u=':host{color:var(--highcontrast-checkbox-content-color-default, var(--luzmo-checkbox-content-color-default, var(--luzmo-font-color-hard)));min-block-size:var(--luzmo-checkbox-height, var(--checkbox-height, 32px));max-inline-size:100%;vertical-align:top;align-items:flex-start;display:inline-flex;position:relative;font-family:var(--luzmo-checkbox-font-family, var(--luzmo-font-family))}:host(:is(:active,[active])) #box:before{border-color:var(--highcontrast-checkbox-highlight-color-down, var(--luzmo-checkbox-control-color-down, var(--luzmo-font-color-hard)))}:host(:is(:active,[active])) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-down, var(--luzmo-checkbox-control-selected-color-down, var(--luzmo-font-color-hard)))}:host(:is(:active,[active])) #label{color:var(--highcontrast-checkbox-content-color-down, var(--luzmo-checkbox-content-color-down, var(--luzmo-font-color-hard)))}:host([invalid][invalid]) #box:before,:host([invalid][invalid]) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-invalid-color-default, var(--luzmo-negative-color)))}:host([invalid][invalid]) #input:focus-visible+#box:before,:host([invalid][invalid][indeterminate]) #input:focus-visible+#box:before{border-color:var(--highcontrast-checkbox-color-hover, var(--luzmo-checkbox-invalid-color-hover, var(--luzmo-negative-color)))}:host([readonly]){border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-control-selected-color-default, var(--luzmo-font-color)))}:host([readonly]:is(:active,[active])) #box:before{border-color:var(--highcontrast-checkbox-selected-color-default, var(--luzmo-checkbox-control-selected-color-default, var(--luzmo-font-color)))}:host([readonly]) #input:checked:disabled+#box:before,:host([readonly]) #input:disabled+#box:before{border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-control-selected-color-default, var(--luzmo-font-color)));background-color:var(--highcontrast-checkbox-background-color-default, var(--luzmo-checkbox-checkmark-color, var(--luzmo-background-color)))}:host([readonly]) #input:checked:disabled~#label,:host([readonly]) #input:disabled~#label{forced-color-adjust:none;color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-content-color-default, var(--luzmo-font-color-hard)))}:host([indeterminate]) #box:before,:host([indeterminate]) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-default, var(--luzmo-checkbox-control-selected-color-default, var(--luzmo-font-color)));border-width:var(--luzmo-checkbox-selected-border-width, calc(var(--checkbox-control-size, 14px) / 2))}:host([indeterminate]) #box #checkmark,:host([indeterminate]) #input:checked+#box #checkmark{display:none}:host([indeterminate]) #box #partialCheckmark,:host([indeterminate]) #input:checked+#box #partialCheckmark{opacity:1;display:flex;transform:scale(1)}:host([indeterminate]) #input:focus-visible+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-focus, var(--luzmo-checkbox-control-selected-color-focus, var(--luzmo-font-color-hard)))}:host([invalid][invalid][indeterminate]) #box:before,:host([invalid][invalid][indeterminate]) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-invalid-color-default, var(--luzmo-negative-color)));border-width:var(--luzmo-checkbox-selected-border-width, calc(var(--checkbox-control-size, 14px) / 2))}:host([emphasized]) #input:checked+#box:before,:host([emphasized][indeterminate]) #box:before,:host([emphasized][indeterminate]) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-default, var(--luzmo-checkbox-emphasized-color-default, var(--luzmo-primary)))}:host([emphasized]) #input:focus-visible:checked+#box:before,:host([emphasized][indeterminate]) #input:focus-visible+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-focus, var(--luzmo-checkbox-emphasized-color-focus, var(--luzmo-primary)))}:host([emphasized][invalid][invalid]) #input:focus-visible:checked+#box:before{border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-invalid-color-focus, var(--luzmo-negative-color)))}@media (hover: hover){:host(:hover) #box:before{border-color:var(--highcontrast-checkbox-highlight-color-hover, var(--luzmo-checkbox-control-color-hover, var(--luzmo-font-color)))}:host(:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-hover, var(--luzmo-checkbox-control-selected-color-hover, var(--luzmo-font-color-hard)))}:host(:hover) #label{color:var(--highcontrast-checkbox-content-color-hover, var(--luzmo-checkbox-content-color-hover, var(--luzmo-font-color-hard)))}:host([invalid][invalid]:hover) #box:before,:host([invalid][invalid]:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-hover, var(--luzmo-checkbox-invalid-color-hover, var(--luzmo-negative-color)))}:host([readonly]:hover) #box:before{border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-control-selected-color-default, var(--luzmo-font-color)))}:host([indeterminate]:hover) #box:before,:host([indeterminate]:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-hover, var(--luzmo-checkbox-control-selected-color-hover, var(--luzmo-font-color-hard)))}:host([invalid][invalid][indeterminate]:hover) #box:before,:host([invalid][invalid][indeterminate]:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-invalid-color-hover, var(--luzmo-negative-color)))}:host([invalid][invalid][indeterminate]:hover) #label{color:var(--highcontrast-checkbox-content-color-hover, var(--luzmo-checkbox-content-color-hover, var(--luzmo-font-color-hard)))}:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before,:host([emphasized]:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-hover, var(--luzmo-checkbox-emphasized-color-hover, var(--luzmo-primary)))}:host([emphasized][invalid][invalid][indeterminate]:hover) #box:before,:host([emphasized][invalid][invalid][indeterminate]:hover) #input:checked+#box:before,:host([emphasized][invalid][invalid]:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-hover, var(--luzmo-checkbox-invalid-color-hover, var(--luzmo-negative-color)))}:host([emphasized][indeterminate]:hover) #box:before,:host([emphasized][indeterminate]:hover) #input:checked+#box:before,:host([emphasized]:hover) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-hover, var(--luzmo-checkbox-emphasized-color-hover, var(--luzmo-primary)))}}:host([emphasized][indeterminate]:is(:active,[active])) #box:before,:host([emphasized][indeterminate]:is(:active,[active])) #input:checked+#box:before,:host([emphasized]:is(:active,[active])) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-default, var(--luzmo-checkbox-emphasized-color-down, var(--luzmo-primary)))}:host([emphasized][invalid][invalid]:is(:active,[active])) #box:before,:host([emphasized][invalid][invalid]:is(:active,[active])) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-default, var(--luzmo-checkbox-control-invalid-color-down, var(--luzmo-negative-color)))}:host([emphasized]:focus-visible) #box:before,:host([emphasized]:focus-visible) #input:checked+#box:before{border-color:var(--highcontrast-checkbox-color-focus, var(--luzmo-checkbox-control-color-focus, var(--luzmo-font-color)))}#label{text-align:start;font-size:var(--luzmo-checkbox-font-size, var(--checkbox-font-size, 14px));transition:color var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-in-out;line-height:var(--luzmo-checkbox-line-height, 1.3);margin-block-start:var(--luzmo-checkbox-top-to-text, var(--checkbox-top-to-text, 6px));margin-inline-start:var(--luzmo-checkbox-text-to-control, var(--checkbox-text-to-control, 10px))}#label:lang(ja),#label:lang(ko),#label:lang(zh){line-height:var(--luzmo-checkbox-line-height-cjk, 1.5)}#input{color:var(--luzmo-checkbox-control-color-default, var(--luzmo-font-color));box-sizing:border-box;inline-size:100%;block-size:100%;opacity:.0001;z-index:1;cursor:pointer;margin:0;padding:0;font-family:inherit;font-size:100%;line-height:1.15;position:absolute;overflow:visible}#input:disabled{cursor:default}#input:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-default, var(--luzmo-checkbox-control-selected-color-default, var(--luzmo-font-color)));background-color:var(--luzmo-checkbox-checkmark-color, var(--luzmo-background-color));border-width:var(--luzmo-checkbox-selected-border-width, calc(var(--checkbox-control-size, 14px) / 2))}#input:checked+#box #checkmark{opacity:1;transform:scale(1)}#input:focus-visible+#box:before{border-color:var(--highcontrast-checkbox-color-focus, var(--luzmo-checkbox-control-color-focus, var(--luzmo-font-color)))}#input:focus-visible+#box:after{forced-color-adjust:none;box-shadow:0 0 0 var(--luzmo-checkbox-focus-indicator-width, var(--luzmo-indicator-width)) var(--highcontrast-checkbox-focus-indicator-color, var(--luzmo-checkbox-focus-indicator-color, var(--luzmo-primary)));margin:calc(var(--luzmo-checkbox-focus-indicator-gap, 2px) * -1)}#input:focus-visible+#label{color:var(--highcontrast-checkbox-content-color-focus, var(--luzmo-checkbox-content-color-focus, var(--luzmo-font-color-hard)))}#input:focus-visible:checked+#box:before{border-color:var(--highcontrast-checkbox-highlight-color-focus, var(--luzmo-checkbox-control-selected-color-focus, var(--luzmo-font-color-hard)))}#box{--luzmo-checkbox-spacing: calc( var(--luzmo-checkbox-height, var(--checkbox-height, 32px)) - var( --luzmo-checkbox-control-size, var(--checkbox-control-size, 14px) ) );margin:calc(var(--luzmo-checkbox-spacing) / 2) 0;flex-grow:0;flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}#box,#box:before{box-sizing:border-box;inline-size:var(--luzmo-checkbox-control-size, var(--checkbox-control-size, 14px));block-size:var(--luzmo-checkbox-control-size, var(--checkbox-control-size, 14px))}#box:before{forced-color-adjust:none;border-color:var(--highcontrast-checkbox-color-default, var(--luzmo-checkbox-control-color-default, var(--luzmo-font-color)));z-index:0;content:"";border-radius:var(--luzmo-checkbox-control-corner-radius, 2px);border-width:var(--luzmo-checkbox-border-width, var(--luzmo-border-width));transition:border var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-in-out,box-shadow var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-in-out;border-style:solid;display:block;position:absolute}#box:after{border-radius:calc(var(--luzmo-checkbox-control-corner-radius, 2px) + var(--luzmo-checkbox-focus-indicator-gap, 2px));content:"";margin:var(--luzmo-checkbox-focus-indicator-gap, 2px);transition:box-shadow var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-out,margin var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-out;display:block;position:absolute;inset-block:0;inset-inline:0;transform:translate(0)}#checkmark,#partialCheckmark{pointer-events:none;color:var(--highcontrast-checkbox-background-color-default, var(--luzmo-checkbox-checkmark-color, var(--luzmo-background-color)));opacity:0;transition:opacity var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-in-out,transform var(--luzmo-checkbox-animation-duration, var(--luzmo-animation-duration)) ease-in-out;transform:scale(0);width:var(--textbox-control-size, 14px);display:flex;align-items:center;justify-content:center;font-size:var(--checkbox-icon-size)}#partialCheckmark{display:none}#input:checked:disabled+#box:before,#input:disabled+#box:before{border-color:var(--highcontrast-checkbox-disabled-color-default, var(--luzmo-checkbox-control-color-disabled, var(--luzmo-disabled-color)));background-color:var(--highcontrast-checkbox-background-color-default, var(--luzmo-checkbox-checkmark-color, var(--luzmo-background-color)))}#input:checked:disabled~#label,#input:disabled~#label{forced-color-adjust:none;color:var(--highcontrast-checkbox-disabled-color-default, var(--luzmo-checkbox-content-color-disabled, var(--luzmo-disabled-color)))}@media (forced-colors: active){#input:focus-visible+#box{forced-color-adjust:none;outline-color:var(--highcontrast-checkbox-focus-indicator-color, var(--luzmo-checkbox-focus-indicator-color, var(--luzmo-primary)));outline-offset:var(--highcontrast-checkbox-focus-indicator-gap, var(--luzmo-checkbox-focus-indicator-gap, 2px));outline-style:auto;outline-width:var(--luzmo-focus-indicator-width, var(--luzmo-indicator-width))}#input:focus-visible+#box:after{box-shadow:0 0 0 0 var(--highcontrast-checkbox-focus-indicator-color, var(--luzmo-checkbox-focus-indicator-color, var(--luzmo-primary)))}:host{--highcontrast-checkbox-content-color-default: CanvasText;--highcontrast-checkbox-content-color-hover: CanvasText;--highcontrast-checkbox-content-color-down: CanvasText;--highcontrast-checkbox-content-color-focus: CanvasText;--highcontrast-checkbox-background-color-default: Canvas;--highcontrast-checkbox-color-default: ButtonText;--highcontrast-checkbox-color-hover: ButtonText;--highcontrast-checkbox-color-focus: Highlight;--highcontrast-checkbox-highlight-color-default: Highlight;--highcontrast-checkbox-highlight-color-hover: Highlight;--highcontrast-checkbox-highlight-color-down: Highlight;--highcontrast-checkbox-highlight-color-focus: Highlight;--highcontrast-checkbox-disabled-color-default: GrayText;--highcontrast-checkbox-focus-indicator-color: CanvasText}}:host([size=s]){--checkbox-font-size: var(--luzmo-checkbox-size-s-font-size, 12px);--checkbox-height: var(--luzmo-checkbox-size-s-height, 24px);--checkbox-control-size: var(--luzmo-checkbox-size-s-control-size, 12px);--checkbox-top-to-text: var(--luzmo-checkbox-size-s-top-to-text, 4px);--checkbox-text-to-control: var(--luzmo-checkbox-size-s-text-to-control, 9px);--checkbox-icon-size: var(--luzmo-checkbox-size-s-icon-size, 9px)}:host{--checkbox-font-size: var(--luzmo-checkbox-size-m-font-size, 14px);--checkbox-height: var(--luzmo-checkbox-size-m-height, 32px);--checkbox-control-size: var(--luzmo-checkbox-size-m-control-size, 14px);--checkbox-top-to-text: var(--luzmo-checkbox-size-m-top-to-text, 6px);--checkbox-text-to-control: var( --luzmo-checkbox-size-m-text-to-control, 10px );--checkbox-icon-size: var(--luzmo-checkbox-size-m-icon-size, 10px)}:host([size=l]){--checkbox-font-size: var(--luzmo-checkbox-size-l-font-size, 16px);--checkbox-height: var(--luzmo-checkbox-size-l-height, 40px);--checkbox-control-size: var(--luzmo-checkbox-size-l-control-size, 16px);--checkbox-top-to-text: var(--luzmo-checkbox-size-l-top-to-text, 9px);--checkbox-text-to-control: var( --luzmo-checkbox-size-l-text-to-control, 11px );--checkbox-icon-size: var(--luzmo-checkbox-size-l-icon-size, 11px)}:host([size=xl]){--checkbox-font-size: var(--luzmo-checkbox-size-xl-font-size, 18px);--checkbox-height: var(--luzmo-checkbox-size-xl-height, 48px);--checkbox-control-size: var(--luzmo-checkbox-size-xl-control-size, 18px);--checkbox-top-to-text: var(--luzmo-checkbox-size-xl-top-to-text, 12px);--checkbox-text-to-control: var( --luzmo-checkbox-size-xl-text-to-control, 13px );--checkbox-icon-size: var(--luzmo-checkbox-size-xl-icon-size, 12px)}:host{display:inline-flex;vertical-align:top}:host(:focus){outline:none}:host([disabled]){pointer-events:none}:host(:empty) label{display:none}';var x=Object.defineProperty,t=(h,e,n,k)=>{for(var r=void 0,a=h.length-1,s;a>=0;a--)(s=h[a])&&(r=s(e,n,r)||r);return r&&x(e,n,r),r};const v=()=>o.x`<div id="checkmark">${i.O2(i.F)}</div>`,m=()=>o.x`<div id="partialCheckmark">${i.O2(i.$)}</div>`,l=class l extends b.SizedMixin(d.checkboxMixin(o.LuzmoElement),{noDefaultSize:!0}){constructor(){super(...arguments),this.disabled=!1,this.indeterminate=!1,this.autofocus=!1,this.invalid=!1,this.emphasized=!1,this.tabIndex=0}connectedCallback(){super.connectedCallback(),this.hasAttribute("autofocus")&&this.updateComplete.then(()=>{this.focus()})}static get styles(){return[o.r(u)]}click(){var e;this.disabled||(e=this.inputElement)==null||e.click()}handleChange(){this.indeterminate=!1,super.handleChange()}render(){return o.x`
|
|
19
19
|
${super.render()}
|
|
20
20
|
<span id="box">
|
|
21
21
|
${this.checked?v():o.x``}
|
|
@@ -15,10 +15,10 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import {
|
|
19
|
-
import { a as d, r as v, x as i, n as t } from "../base-
|
|
20
|
-
import { S as z } from "../sized-mixin-
|
|
21
|
-
import { c as f } from "../checkbox-mixin-
|
|
18
|
+
import { O as u, F as m, $ as x } from "../luzmo-icons-DbwDQtuO.js";
|
|
19
|
+
import { a as d, r as v, x as i, n as t } from "../base-WsynuqaS.js";
|
|
20
|
+
import { S as z } from "../sized-mixin-D4ACoVUr.js";
|
|
21
|
+
import { c as f } from "../checkbox-mixin-Do7EgtpQ.js";
|
|
22
22
|
const b = () => {
|
|
23
23
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
24
24
|
const r = document.createElement("style");
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";const c=require("./base-
|
|
18
|
+
"use strict";const c=require("./base-CBCg3yyw.cjs"),d=require("./query-BL-TJj7K.cjs"),o=require("./if-defined-C9YGdo33.cjs");var l=Object.defineProperty,i=(n,e,r,s)=>{for(var t=void 0,h=n.length-1,a;h>=0;h--)(a=n[h])&&(t=a(e,r,t)||t);return t&&l(e,r,t),t};function u(n){class e extends n{constructor(){super(...arguments),this.checked=!1,this.readonly=!1}handleChange(){if(this.readonly){this.inputElement.checked=this.checked;return}this.checked=this.inputElement.checked;const s=new CustomEvent("change",{bubbles:!0,cancelable:!0,composed:!0,detail:this.checked});this.dispatchEvent(s)||(this.checked=!this.inputElement.checked,this.inputElement.checked=this.checked)}render(){return c.x`
|
|
19
19
|
<input
|
|
20
20
|
id="input"
|
|
21
21
|
name=${o.o(this.name||void 0)}
|
|
@@ -15,9 +15,9 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { n as h, x as a } from "./base-
|
|
18
|
+
import { n as h, x as a } from "./base-WsynuqaS.js";
|
|
19
19
|
import { e as p } from "./query-D_KR_GUc.js";
|
|
20
|
-
import { o as d } from "./if-defined-
|
|
20
|
+
import { o as d } from "./if-defined-DOaE2coe.js";
|
|
21
21
|
var l = Object.defineProperty, c = (n, e, r, o) => {
|
|
22
22
|
for (var t = void 0, i = n.length - 1, s; i >= 0; i--)
|
|
23
23
|
(s = n[i]) && (t = s(e, r, t) || t);
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";const h=require("./base-
|
|
18
|
+
"use strict";const h=require("./base-CBCg3yyw.cjs"),r=require("./directive-C7oCP5Bh.cjs");/**
|
|
19
19
|
* @license
|
|
20
20
|
* Copyright 2018 Google LLC
|
|
21
21
|
* SPDX-License-Identifier: BSD-3-Clause
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { T as a } from "./base-
|
|
18
|
+
import { T as a } from "./base-WsynuqaS.js";
|
|
19
19
|
import { e as h, i as d, t as c } from "./directive-oAbCiebi.js";
|
|
20
20
|
/**
|
|
21
21
|
* @license
|
|
@@ -15,21 +15,21 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import {
|
|
19
|
-
import { r as b, x as
|
|
20
|
-
import { S as v } from "./sized-mixin-
|
|
21
|
-
import { L as g } from "./button-base-
|
|
18
|
+
import { O as e, f as u, w as i, D as s } from "./luzmo-icons-DbwDQtuO.js";
|
|
19
|
+
import { r as b, x as l, n as d } from "./base-WsynuqaS.js";
|
|
20
|
+
import { S as v } from "./sized-mixin-D4ACoVUr.js";
|
|
21
|
+
import { L as g } from "./button-base-DbkDzb71.js";
|
|
22
22
|
const h = ":host{font-size:var(--luzmo-clear-button-icon-size, var(--clear-button-icon-size));cursor:pointer;background-color:initial;background-color:var(--luzmo-clear-button-background-color, transparent);padding:var(--luzmo-clear-button-padding, var(--clear-button-padding));color:var(--luzmo-clear-button-icon-color, var(--clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover: hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover, var(--luzmo-clear-button-icon-color-hover, var(--clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--luzmo-clear-button-background-color-hover, var(--clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--luzmo-clear-button-icon-color-down, var(--clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--luzmo-clear-button-background-color-down, var(--clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within{color:var(--luzmo-clear-button-icon-color-key-focus, var(--clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill{background-color:var(--luzmo-clear-button-background-color-key-focus, var(--clear-button-background-color-key-focus))}:host([disabled]){--clear-button-icon-color: var( --luzmo-clear-button-icon-color-disabled, var(--disabled-content-color) );--clear-button-background-color: var( --luzmo-clear-button-background-color-disabled, transparent )}.fill{background-color:var(--luzmo-clear-button-background-color, var(--clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors: active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover: Highlight}}:host{--clear-button-background-color: transparent;--clear-button-background-color-hover: transparent;--clear-button-background-color-down: transparent;--clear-button-background-color-key-focus: transparent;--clear-button-icon-size: var(--luzmo-font-size);--clear-button-padding: 0px;--clear-button-icon-color: var(--luzmo-font-color);--clear-button-icon-color-hover: var(--luzmo-font-color-hover);--clear-button-icon-color-down: var(--luzmo-font-color-down);--clear-button-icon-color-key-focus: var(--luzmo-font-color-focus)}:host([size=s]){--clear-button-icon-size: var(--luzmo-font-size-s)}:host([size=l]){--clear-button-icon-size: var(--luzmo-font-size-l)}:host([size=xl]){--clear-button-icon-size: var(--luzmo-font-size-xl)}:host .luzmo-ClearButton--quiet{--clear-button-background-color: transparent;--clear-button-background-color-hover: transparent;--clear-button-background-color-down: transparent;--clear-button-background-color-key-focus: transparent}:host([variant=overBackground]){--clear-button-icon-color: rgb(255, 255, 255);--clear-button-icon-color-hover: rgb(255, 255, 255);--clear-button-icon-color-down: rgb(255, 255, 255);--clear-button-icon-color-key-focus: rgb(255, 255, 255);--clear-button-background-color: transparent;--clear-button-background-color-hover: rgba(255, 255, 255, .25);--clear-button-background-color-down: rgba(255, 255, 255, .4);--clear-button-background-color-key-focus: rgba(255, 255, 255, .25)}:host([disabled]){--clear-button-icon-color: var(--luzmo-disabled-color);--clear-button-icon-color-hover: var(--luzmo-disabled-color);--clear-button-icon-color-down: var(--luzmo-disabled-color);--clear-button-background-color: transparent}:host{box-sizing:border-box}";
|
|
23
|
-
var
|
|
24
|
-
for (var r = void 0, c = o.length - 1,
|
|
25
|
-
(
|
|
26
|
-
return r &&
|
|
23
|
+
var f = Object.defineProperty, z = (o, t, n, p) => {
|
|
24
|
+
for (var r = void 0, c = o.length - 1, a; c >= 0; c--)
|
|
25
|
+
(a = o[c]) && (r = a(t, n, r) || r);
|
|
26
|
+
return r && f(t, n, r), r;
|
|
27
27
|
};
|
|
28
|
-
const
|
|
28
|
+
const k = (o) => {
|
|
29
29
|
const t = o === "s" ? u : ["xl", "l"].includes(o) ? i : s;
|
|
30
|
-
return
|
|
30
|
+
return l` <div class="icon" slot="icon">${e(t)}</div> `;
|
|
31
31
|
};
|
|
32
|
-
class
|
|
32
|
+
class m extends v(g, {
|
|
33
33
|
noDefaultSize: !0
|
|
34
34
|
}) {
|
|
35
35
|
constructor() {
|
|
@@ -39,15 +39,15 @@ class k extends v(g, {
|
|
|
39
39
|
return [...super.styles, b(h)];
|
|
40
40
|
}
|
|
41
41
|
get buttonContent() {
|
|
42
|
-
return [
|
|
42
|
+
return [k(this.size)];
|
|
43
43
|
}
|
|
44
44
|
render() {
|
|
45
|
-
return
|
|
45
|
+
return l` <div class="fill">${super.render()}</div> `;
|
|
46
46
|
}
|
|
47
47
|
}
|
|
48
|
-
|
|
48
|
+
z([
|
|
49
49
|
d({ reflect: !0 })
|
|
50
|
-
],
|
|
50
|
+
], m.prototype, "variant");
|
|
51
51
|
export {
|
|
52
|
-
|
|
52
|
+
m as L
|
|
53
53
|
};
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/*! * Lucero - The design system for Luzmo.
|
|
2
|
+
*
|
|
3
|
+
* Copyright © 2025 Luzmo
|
|
4
|
+
* All rights reserved.
|
|
5
|
+
* Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
|
|
6
|
+
* This license allows users with a current active Luzmo account to use Lucero.
|
|
7
|
+
* This license terminates automatically if a user no longer has an active Luzmo account.
|
|
8
|
+
* Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
|
|
9
|
+
*
|
|
10
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
11
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
12
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
13
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
14
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
15
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
|
+
* SOFTWARE.
|
|
17
|
+
* */
|
|
18
|
+
"use strict";const c=require("./luzmo-icons-DletXGWU.cjs"),n=require("./base-CBCg3yyw.cjs"),i=require("./sized-mixin-CPxE5C96.cjs"),s=require("./button-base-XgPLmwP-.cjs"),b=":host{font-size:var(--luzmo-clear-button-icon-size, var(--clear-button-icon-size));cursor:pointer;background-color:initial;background-color:var(--luzmo-clear-button-background-color, transparent);padding:var(--luzmo-clear-button-padding, var(--clear-button-padding));color:var(--luzmo-clear-button-icon-color, var(--clear-button-icon-color));border:none;border-radius:100%;margin:0}.icon{margin-block:0;margin-inline:auto}@media (hover: hover){:host(:hover){color:var(--highcontrast-clear-button-icon-color-hover, var(--luzmo-clear-button-icon-color-hover, var(--clear-button-icon-color-hover)))}:host(:hover) .fill{background-color:var(--luzmo-clear-button-background-color-hover, var(--clear-button-background-color-hover))}}:host(:is(:active,[active])){color:var(--luzmo-clear-button-icon-color-down, var(--clear-button-icon-color-down))}:host(:is(:active,[active])) .fill{background-color:var(--luzmo-clear-button-background-color-down, var(--clear-button-background-color-down))}:host([focus-within]) .js-focus-within,:host(:focus-visible),:host:focus-within{color:var(--luzmo-clear-button-icon-color-key-focus, var(--clear-button-icon-color-key-focus))}:host([focus-within]) .js-focus-within .fill,:host(:focus-visible) .fill,:host:focus-within .fill{background-color:var(--luzmo-clear-button-background-color-key-focus, var(--clear-button-background-color-key-focus))}:host([disabled]){--clear-button-icon-color: var( --luzmo-clear-button-icon-color-disabled, var(--disabled-content-color) );--clear-button-background-color: var( --luzmo-clear-button-background-color-disabled, transparent )}.fill{background-color:var(--luzmo-clear-button-background-color, var(--clear-button-background-color));inline-size:100%;block-size:100%;border-radius:100%;justify-content:center;align-items:center;display:flex}:host([variant=overBackground]:focus-visible){outline:none}@media (forced-colors: active){:host:not(:disabled){--highcontrast-clear-button-icon-color-hover: Highlight}}:host{--clear-button-background-color: transparent;--clear-button-background-color-hover: transparent;--clear-button-background-color-down: transparent;--clear-button-background-color-key-focus: transparent;--clear-button-icon-size: var(--luzmo-font-size);--clear-button-padding: 0px;--clear-button-icon-color: var(--luzmo-font-color);--clear-button-icon-color-hover: var(--luzmo-font-color-hover);--clear-button-icon-color-down: var(--luzmo-font-color-down);--clear-button-icon-color-key-focus: var(--luzmo-font-color-focus)}:host([size=s]){--clear-button-icon-size: var(--luzmo-font-size-s)}:host([size=l]){--clear-button-icon-size: var(--luzmo-font-size-l)}:host([size=xl]){--clear-button-icon-size: var(--luzmo-font-size-xl)}:host .luzmo-ClearButton--quiet{--clear-button-background-color: transparent;--clear-button-background-color-hover: transparent;--clear-button-background-color-down: transparent;--clear-button-background-color-key-focus: transparent}:host([variant=overBackground]){--clear-button-icon-color: rgb(255, 255, 255);--clear-button-icon-color-hover: rgb(255, 255, 255);--clear-button-icon-color-down: rgb(255, 255, 255);--clear-button-icon-color-key-focus: rgb(255, 255, 255);--clear-button-background-color: transparent;--clear-button-background-color-hover: rgba(255, 255, 255, .25);--clear-button-background-color-down: rgba(255, 255, 255, .4);--clear-button-background-color-key-focus: rgba(255, 255, 255, .25)}:host([disabled]){--clear-button-icon-color: var(--luzmo-disabled-color);--clear-button-icon-color-hover: var(--luzmo-disabled-color);--clear-button-icon-color-down: var(--luzmo-disabled-color);--clear-button-background-color: transparent}:host{box-sizing:border-box}";var d=Object.defineProperty,v=(o,t,a,h)=>{for(var r=void 0,l=o.length-1,e;l>=0;l--)(e=o[l])&&(r=e(t,a,r)||r);return r&&d(t,a,r),r};const g=o=>{const t=o==="s"?c.f2:["xl","l"].includes(o)?c.w2:c.D2;return n.x` <div class="icon" slot="icon">${c.O2(t)}</div> `};class u extends i.SizedMixin(s.LuzmoButtonBase,{noDefaultSize:!0}){constructor(){super(...arguments),this.variant=""}static get styles(){return[...super.styles,n.r(b)]}get buttonContent(){return[g(this.size)]}render(){return n.x` <div class="fill">${super.render()}</div> `}}v([n.n({reflect:!0})],u.prototype,"variant");exports.LuzmoClearButton=u;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/*! * Lucero - The design system for Luzmo.
|
|
2
|
+
*
|
|
3
|
+
* Copyright © 2025 Luzmo
|
|
4
|
+
* All rights reserved.
|
|
5
|
+
* Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
|
|
6
|
+
* This license allows users with a current active Luzmo account to use Lucero.
|
|
7
|
+
* This license terminates automatically if a user no longer has an active Luzmo account.
|
|
8
|
+
* Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
|
|
9
|
+
*
|
|
10
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
11
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
12
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
13
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
14
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
15
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
|
+
* SOFTWARE.
|
|
17
|
+
* */
|
|
18
|
+
"use strict";const n=require("./luzmo-icons-DletXGWU.cjs"),r=require("./base-CBCg3yyw.cjs"),u=require("./sized-mixin-CPxE5C96.cjs");require("./icon/index.cjs");const b=require("./button-base-XgPLmwP-.cjs"),d=':host{cursor:pointer;-webkit-user-select:none;user-select:none;box-sizing:border-box;font-family:var(--luzmo-button-font-family, var(--luzmo-sans-font-family-stack, var(--luzmo-font-family)));-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:var(--luzmo-button-line-height, var(--luzmo-line-height, 1.3));text-transform:none;vertical-align:top;-webkit-appearance:button;transition:background var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,border-color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,color var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out,box-shadow var(--luzmo-button-animation-duration, var(--luzmo-animation-duration)) ease-out;border-style:solid;margin:0;-webkit-text-decoration:none;text-decoration:none;overflow:visible}:host(:focus){outline:none}:host([disabled]){cursor:default}:host a{-webkit-user-select:none;user-select:none;-webkit-appearance:none}@media (forced-colors: active){:host{--highcontrast-close-button-icon-color-disabled: GrayText;--highcontrast-close-button-icon-color-down: Highlight;--highcontrast-close-button-icon-color-hover: Highlight;--highcontrast-close-button-icon-color-focus: Highlight;--highcontrast-close-button-background-color-default: ButtonFace;--highcontrast-close-button-focus-indicator-color: ButtonText}:host(:focus-visible):after{forced-color-adjust:none;margin:var(--luzmo-close-button-focus-indicator-gap, var(--close-button-focus-indicator-gap));transition:opacity var(--luzmo-close-button-animation-duration, var(--close-button-animation-duration)) ease-out,margin var(--luzmo-close-button-animation-duraction, var(--close-button-animation-duration)) ease-out}:host([static-color=black]){--highcontrast-close-button-static-background-color-default: ButtonFace;--highcontrast-close-button-icon-color-default: Highlight;--highcontrast-close-button-icon-color-disabled: GrayText}:host([static-color=white]){--highcontrast-close-button-static-background-color-default: ButtonFace;--highcontrast-close-button-icon-color-default: Highlight;--highcontrast-close-button-icon-color-disabled: Highlight}}:host{block-size:var(--luzmo-close-button-height, var(--close-button-size));inline-size:var(--luzmo-close-button-width, var(--close-button-size));font-size:var(--luzmo-close-button-icon-size, var(--close-button-icon-size));color:inherit;border-radius:var(--luzmo-close-button-border-radius, var(--close-button-size));transition:border-color var(--luzmo-close-button-animation-duration, var(--close-button-animation-duration)) ease-in-out;margin-inline:var(--luzmo-close-button-margin-inline);justify-content:center;align-items:center;align-self:var(--luzmo-close-button-align-self);border-width:0;border-color:#0000;flex-direction:row;margin-block-start:var(--luzmo-close-button-margin-top);padding:0;display:inline-flex;position:relative}:host:after{pointer-events:none;content:"";margin:calc(var(--luzmo-close-button-focus-indicator-gap, var(--close-button-focus-indicator-gap)) * -1);border-radius:calc(var(--luzmo-close-button-size, var(--close-button-size)) + var(--luzmo-close-button-focus-indicator-gap, var(--close-button-focus-indicator-gap)));transition:box-shadow var(--luzmo-close-button-animation-duration, var(--close-button-animation-duration)) ease-in-out;position:absolute;inset-block:0;inset-inline:0}:host(:focus-visible){box-shadow:none;outline:none}:host(:focus-visible):after{box-shadow:0 0 0 var(--luzmo-close-button-focus-indicator-width, var(--close-button-focus-indicator-width)) var(--highcontrast-close-button-focus-indicator-color, var(--luzmo-close-button-focus-indicator-color, var(--close-button-focus-indicator-color)))}:host(:not([disabled])){background-color:var(--highcontrast-close-button-background-color-default, var(--luzmo-close-button-background-color-default, var(--close-button-background-color-default)))}:host(:not([disabled]):is(:active,[active])){background-color:var(--luzmo-close-button-background-color-down, var(--close-button-background-color-down))}:host(:not([disabled]):is(:active,[active])) .icon{color:var(--highcontrast-close-button-icon-color-down, var(--luzmo-close-button-icon-color-down, var(--close-button-icon-color-down)))}:host([focused]:not([disabled])),:host(:not([disabled]):focus-visible){background-color:var(--luzmo-close-button-background-color-focus, var(--close-button-background-color-focus))}:host([focused]:not([disabled])) .icon,:host(:not([disabled]):focus-visible) .icon{color:var(--highcontrast-close-button-icon-color-focus, var(--luzmo-close-button-icon-color-focus, var(--close-button-icon-color-focus)))}:host(:not([disabled])) .icon{color:var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default))}:host([focused]:not([disabled])) .icon,:host(:not([disabled]):focus) .icon{color:var(--highcontrast-close-button-icon-color-focus, var(--luzmo-close-button-icon-color-focus, var(--close-button-icon-color-focus)))}:host([disabled]){background-color:var(--luzmo-close-button-background-color-default, var(--close-button-background-color-default))}:host([disabled]) .icon{color:var(--highcontrast-close-button-icon-color-disabled, var(--luzmo-close-button-icon-color-disabled, var(--close-button-icon-color-disabled)))}:host([static-color=black]:not([disabled])),:host([static-color=white]:not([disabled])){background-color:var(--highcontrast-close-button-static-background-color-default, var(--luzmo-close-button-static-background-color-default, var(--close-button-static-background-color-default)))}@media (hover: hover){:host(:not([disabled]):hover){--luzmo-icon-color: var( --luzmo-close-button-icon-color-hover, var(--close-button-icon-color-hover) );background-color:var(--luzmo-close-button-background-color-hover, var(--close-button-background-color-hover))}:host(:not([disabled]):hover) .icon{color:var(--highcontrast-close-button-icon-color-hover, var(--luzmo-close-button-icon-color-hover, var(--close-button-icon-color-hover)))}:host([static-color=black]:not([disabled]):hover),:host([static-color=white]:not([disabled]):hover){background-color:var(--highcontrast-close-button-static-background-color-hover, var(--luzmo-close-button-static-background-color-hover, var(--close-button-static-background-color-hover)))}:host([static-color=black]:not([disabled]):hover) .icon,:host([static-color=white]:not([disabled]):hover) .icon{color:var(--highcontrast-close-button-icon-color-default, var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default)))}}:host([static-color=black]:not([disabled]):is(:active,[active])),:host([static-color=white]:not([disabled]):is(:active,[active])){background-color:var(--highcontrast-close-button-static-background-color-down, var(--luzmo-close-button-static-background-color-down, var(--close-button-static-background-color-down)))}:host([static-color=black]:not([disabled]):is(:active,[active])) .icon,:host([static-color=white]:not([disabled]):is(:active,[active])) .icon{color:var(--highcontrast-close-button-icon-color-default, var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default)))}:host([static-color=black][focused]:not([disabled])),:host([static-color=black]:not([disabled]):focus-visible),:host([static-color=white][focused]:not([disabled])),:host([static-color=white]:not([disabled]):focus-visible){background-color:var(--highcontrast-close-button-static-background-color-focus, var(--luzmo-close-button-static-background-color-focus, var(--close-button-static-background-color-focus)))}:host([static-color=black][focused]:not([disabled])) .icon,:host([static-color=black]:not([disabled]):focus) .icon,:host([static-color=black]:not([disabled]):focus-visible) .icon,:host([static-color=white][focused]:not([disabled])) .icon,:host([static-color=white]:not([disabled]):focus) .icon,:host([static-color=white]:not([disabled]):focus-visible) .icon{color:var(--highcontrast-close-button-icon-color-default, var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default)))}:host([static-color=black]:not([disabled])) .icon,:host([static-color=white]:not([disabled])) .icon{color:var(--luzmo-close-button-icon-color-default, var(--close-button-icon-color-default))}:host([static-color=black][disabled]) .icon,:host([static-color=white][disabled]) .icon{color:var(--highcontrast-close-button-icon-disabled, var(--luzmo-close-button-icon-color-disabled, var(--close-button-icon-color-disabled)))}.icon{margin:0}:host{--close-button-background-color-default: transparent;--close-button-background-color-hover: var(--luzmo-background-color-hover);--close-button-background-color-down: var(--luzmo-background-color-down);--close-button-background-color-focus: var(--luzmo-background-color-focus);--close-button-icon-color-default: var(--luzmo-font-color);--close-button-icon-color-hover: var(--luzmo-font-color-hover);--close-button-icon-color-down: var(--luzmo-font-color-down);--close-button-icon-color-focus: var(--luzmo-font-color-focus);--close-button-icon-color-disabled: var(--luzmo-disabled-color);--close-button-focus-indicator-width: var(--luzmo-indicator-width);--close-button-focus-indicator-gap: var(--luzmo-indicator-gap);--close-button-focus-indicator-color: var(--luzmo-indicator-color);--close-button-animation-duration: var(--luzmo-animation-duration);--close-button-size: var(--luzmo-component-height)}:host([static-color=white]){--close-button-static-background-color-default: transparent;--close-button-static-background-color-hover: rgba(255, 255, 255, .2);--close-button-static-background-color-down: rgba(255, 255, 255, .4);--close-button-static-background-color-focus: rgba(255, 255, 255, .2);--close-button-icon-color-default: rgb(255, 255, 255);--close-button-icon-color-disabled: rgba(255, 255, 255, .2);--close-button-focus-indicator-color: rgb(255, 255, 255)}:host([static-color=black]){--close-button-static-background-color-default: transparent;--close-button-static-background-color-hover: rgba(0, 0, 0, .2);--close-button-static-background-color-down: rgba(0, 0, 0, .4);--close-button-static-background-color-focus: rgba(0, 0, 0, .2);--close-button-icon-color-default: rgb(0, 0, 0);--close-button-icon-color-disabled: rgba(0, 0, 0, .2);--close-button-focus-indicator-color: rgb(0, 0, 0)}:host([size=s]){--close-button-size: var(--luzmo-component-height-s);--close-button-icon-size: var(--luzmo-font-size-s)}:host{--close-button-size: var(--luzmo-component-height);--close-button-icon-size: var(--luzmo-font-size)}:host([size=l]){--close-button-size: var(--luzmo-component-height-l);--close-button-icon-size: var(--luzmo-font-size-l)}:host([size=xl]){--close-button-size: var(--luzmo-component-height-xl);--close-button-icon-size: var(--luzmo-font-size-xl)}';var h=Object.defineProperty,e=(o,c,s,g)=>{for(var t=void 0,a=o.length-1,i;a>=0;a--)(i=o[a])&&(t=i(c,s,t)||t);return t&&h(c,s,t),t};const v=o=>{const c=o==="s"?n.w:o==="l"?n.B:n.x;return r.x` <div class="icon" slot="icon">${n.O2(c)}</div> `};class l extends u.SizedMixin(b.LuzmoButtonBase,{noDefaultSize:!0}){constructor(){super(...arguments),this.variant=""}static get styles(){return[...super.styles,r.r(d)]}get buttonContent(){return[v(this.size)]}}e([r.n({reflect:!0})],l.prototype,"variant");e([r.n({reflect:!0,attribute:"static-color"})],l.prototype,"staticColor");exports.LuzmoCloseButton=l;
|