@luzmo/analytics-components-kit 1.0.1-alpha.5 → 1.0.1-alpha.7
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/{async-directive-FGzMycjH-Bgeca09f.js → async-directive-DWRUSKKF-CmOVMf6V.js} +1 -1
- package/components/{async-directive-FGzMycjH-CeG35vZ3.cjs → async-directive-DWRUSKKF-D4itZyzc.cjs} +3 -3
- package/components/{button-base-CDLQV7Vk-BXgdcJZo.cjs → button-base-B7v4eeRh-BKKUK3x0.cjs} +4 -4
- package/components/{button-base-CDLQV7Vk-C_3zTrbV.js → button-base-B7v4eeRh-D3-GH03o.js} +3 -3
- package/components/{checkbox-mixin-DXUIwtea-wiCZr_KI.js → checkbox-mixin-BFGTmw17-C34LMsgu.js} +6 -6
- package/components/{checkbox-mixin-DXUIwtea-DNISZS47.cjs → checkbox-mixin-BFGTmw17-CCjGd0nS.cjs} +4 -4
- package/components/{directive-helpers-BLDZnGQv-DYFfxaqA.cjs → directive-helpers-nlQRAaQt-3kEWF2GV.cjs} +2 -2
- package/components/{directive-helpers-BLDZnGQv-oKMCBvb2.js → directive-helpers-nlQRAaQt-I6T4KZKW.js} +10 -10
- package/components/display-settings/index.cjs +1 -1
- package/components/display-settings/index.js +11 -11
- package/components/display-settings-binning/display-settings-binning.d.ts +2 -2
- package/components/display-settings-binning/index.cjs +4 -4
- package/components/display-settings-binning/index.js +20 -21
- package/components/display-settings-datetime/index.cjs +1 -1
- package/components/display-settings-datetime/index.js +1 -1
- package/components/display-settings-grand-totals/index.cjs +1 -1
- package/components/display-settings-grand-totals/index.js +8 -8
- package/components/display-settings-numeric/index.cjs +1 -1
- package/components/display-settings-numeric/index.js +12 -12
- package/components/display-settings-period-over-period/index.cjs +5 -5
- package/components/display-settings-period-over-period/index.js +85 -85
- package/components/draggable-data-item/index.cjs +2 -2
- package/components/draggable-data-item/index.js +2 -2
- package/components/draggable-data-item-level/index.cjs +2 -2
- package/components/draggable-data-item-level/index.js +16 -16
- package/components/droppable-slot/index.cjs +2 -2
- package/components/droppable-slot/index.js +8 -8
- package/components/edit-item/index.cjs +6 -6
- package/components/edit-item/index.js +72 -72
- package/components/edit-option/index.cjs +3 -3
- package/components/edit-option/index.js +3 -3
- package/components/edit-option-action-button-group/index.cjs +2 -2
- package/components/edit-option-action-button-group/index.js +6 -6
- package/components/{edit-option-base-DnrerC_T.cjs → edit-option-base-Boz7TNRZ.cjs} +2 -2
- package/components/{edit-option-base-oIvlolV9.js → edit-option-base-qePiIQWd.js} +4 -4
- package/components/edit-option-color-picker/index.cjs +33 -33
- package/components/edit-option-color-picker/index.js +124 -124
- package/components/edit-option-multi-language-field/index.cjs +1 -1
- package/components/edit-option-multi-language-field/index.js +3 -3
- package/components/edit-option-number-field/index.cjs +1 -1
- package/components/edit-option-number-field/index.js +3 -3
- package/components/edit-option-picker/index.cjs +1 -1
- package/components/edit-option-picker/index.js +4 -4
- package/components/edit-option-positions-number-field/index.cjs +1 -1
- package/components/edit-option-positions-number-field/index.js +5 -5
- package/components/edit-option-radio-button-group/index.cjs +1 -1
- package/components/edit-option-radio-button-group/index.js +4 -4
- package/components/edit-option-slider/index.cjs +3 -3
- package/components/edit-option-slider/index.js +217 -217
- package/components/edit-option-switch/index.cjs +4 -4
- package/components/edit-option-switch/index.js +30 -30
- package/components/edit-option-text-field/index.cjs +1 -1
- package/components/edit-option-text-field/index.js +3 -3
- package/components/{en-BsAhbMzm.js → en-DMOM5QNw.js} +12 -12
- package/components/{en-GB-qub-Kemt.js → en-GB-BPwcXBDg.js} +1 -1
- package/components/{en-GB-g8rSQSba.cjs → en-GB-Cp6Zq89F.cjs} +1 -1
- package/components/{en-CdROUdjt.cjs → en-o_2c6hRN.cjs} +2 -2
- package/components/{if-defined-DMSuo5Qx.cjs → if-defined-8BOch-oC.cjs} +1 -1
- package/components/{if-defined-CYpcjGCb-tXzyj9Dq.js → if-defined-BSAr_4u4-4Ys8VE7T.js} +4 -4
- package/components/{if-defined-CYpcjGCb-Bzbg7zmM.cjs → if-defined-BSAr_4u4-gECNwmTC.cjs} +2 -2
- package/components/{if-defined-Ch2dtEOS.js → if-defined-Bv6MRdSW.js} +1 -1
- package/components/{index-gfU9TGd5.cjs → index-86cIx1Ql.cjs} +3 -3
- package/components/{index-DszPbTTD.js → index-B3ve6cAj.js} +17 -17
- package/components/{index-CkDDDzuJ.js → index-B5Wvyv9s.js} +28 -28
- package/components/{index-BD3VxQBH.js → index-BBrer3_5.js} +1 -1
- package/components/index-BJVxTeoi.cjs +192 -0
- package/components/{index-B2z7i1-X.js → index-BUSWsm5N.js} +10 -10
- package/components/{index-BqTdFs1o.js → index-BVX_ozT9.js} +3 -3
- package/components/{index-B5VaT0lQ.js → index-BYfDERr7.js} +3 -3
- package/components/{index-BGaxFTL4.js → index-Bee1uunR.js} +4 -4
- package/components/index-BrEDK88k.cjs +185 -0
- package/components/{index-C_3Ak4MQ.cjs → index-Bt5nP_6w.cjs} +5 -5
- package/components/{index-CayjvyyX.cjs → index-ByjLd3bT.cjs} +4 -4
- package/components/{index-DskAouD-.js → index-C8IL2IZ6.js} +4 -4
- package/components/{index-C2qG2Sm8-BQUlk-w0.js → index-CMvLpPKD-D5MpMVYZ.js} +14 -14
- package/components/{index-C2qG2Sm8-CbVWlbag.cjs → index-CMvLpPKD-Yf1PLWrj.cjs} +12 -12
- package/components/{index-BRk42NQn.js → index-CXIT0cYY.js} +166 -166
- package/components/{index-EQldC-LR.js → index-CdCtJpK9.js} +6 -6
- package/components/{index-B0cBkCaq.cjs → index-CdUTqQ3L.cjs} +4 -4
- package/components/{index-DQiQXn8N.cjs → index-CdpyJ7hp.cjs} +1 -1
- package/components/{index-Cp-lHUlX.js → index-CfEn3fIT.js} +3 -3
- package/components/{index-Bofs4Q2E.cjs → index-D8qmoauu.cjs} +1 -1
- package/components/{index-ON4x-yZ7.cjs → index-DEVOZNSc.cjs} +2 -2
- package/components/{index-CTPox3yS.cjs → index-DUO13KGl.cjs} +3 -3
- package/components/{index-B2N_PZf3.js → index-DVAsMiOm.js} +4 -4
- package/components/{index-DVaeDCbe.js → index-DnozlYag.js} +1 -1
- package/components/{index-liTHhAef.cjs → index-h9T5DPIm.cjs} +2 -2
- package/components/{index-3ewegRbb.cjs → index-i8GaIN7i.cjs} +4 -4
- package/components/{index-D9vzXhtJ.cjs → index-iYpAy-Kg.cjs} +6 -6
- package/components/{index-BC-nmKjU.js → index-ymMEPngt.js} +14 -14
- package/components/{index-CtHO6VyI.cjs → index-zuArOtOt.cjs} +3 -3
- package/components/index.cjs +1 -1
- package/components/index.js +1 -1
- package/components/{language-resolution-8yZa5r_P-CTSmbE1U.js → language-resolution-8yZa5r_P-Bn0bYosv.js} +3 -3
- package/components/{language-resolution-8yZa5r_P-DQ3rZzW5.cjs → language-resolution-8yZa5r_P-FqQChUDW.cjs} +3 -3
- package/components/{luzmo-icons-CZEpXpvy.js → luzmo-icons-BE2T8vWu.js} +1 -1
- package/components/{luzmo-icons-BrtBl3E5.cjs → luzmo-icons-XsFsTAl3.cjs} +1 -1
- package/components/{observe-slot-text-BG0H7bQK-CrkAqUMj.cjs → observe-slot-text-ggb4kKgY-DBVrKDBD.cjs} +4 -4
- package/components/{observe-slot-text-BG0H7bQK-C0wmc4DO.js → observe-slot-text-ggb4kKgY-o5QFWUeA.js} +4 -4
- package/components/{popover-bg0EQQ8p-Dha09dhV.cjs → popover-DlkzrLpl-BhTvuvTu.cjs} +5 -5
- package/components/{popover-bg0EQQ8p-D4-hrhIx.js → popover-DlkzrLpl-CCwcTIXr.js} +3 -3
- package/components/property-0L4eB11h.cjs +112 -0
- package/components/{property-CD3dwBJC.js → property-B2F7x7Cz.js} +581 -547
- package/components/{sized-mixin-PyCYpyQq-B40Ek2UB.js → sized-mixin-BxMraZLS-B_y0PzR3.js} +1 -1
- package/components/{sized-mixin-PyCYpyQq-sKzDjc75.cjs → sized-mixin-BxMraZLS-DEFWqo8f.cjs} +2 -2
- package/components/slot-menu/index.cjs +1 -1
- package/components/slot-menu/index.js +4 -4
- package/components/slot-menu-list/index.cjs +2 -2
- package/components/slot-menu-list/index.js +10 -10
- package/components/{state-ByiKNRhp.cjs → state-BFA93Sye.cjs} +1 -1
- package/components/{state-B1a8XIDm.js → state-Joaryhrg.js} +1 -1
- package/components/{task-HFsHfTra.cjs → task-B8yMzxui.cjs} +1 -1
- package/components/{task-BPD0PyaQ.js → task-Cr9aRIbV.js} +1 -1
- package/components/{text-field-7ITo3Lac-DqVO04kR.js → text-field-CvKSS59x-Dn0_1HO7.js} +29 -29
- package/components/text-field-CvKSS59x-E9LQElL4.cjs +131 -0
- package/package.json +1 -1
- package/components/index-Bjs6Yqet.cjs +0 -185
- package/components/index-D4x-O9Uc.cjs +0 -192
- package/components/property-Su1Q6aME.cjs +0 -124
- package/components/text-field-7ITo3Lac-CKXsSqJP.cjs +0 -131
|
@@ -20,23 +20,23 @@
|
|
|
20
20
|
var Co = Object.getPrototypeOf;
|
|
21
21
|
var $o = Reflect.get;
|
|
22
22
|
var oo = (r, o, e) => $o(Co(r), e, o);
|
|
23
|
-
import {
|
|
24
|
-
import { n as ho } from "../directive-helpers-
|
|
25
|
-
import { m as
|
|
26
|
-
import { m as X } from "../sized-mixin-
|
|
27
|
-
import { O as J, n as
|
|
28
|
-
import { w as
|
|
29
|
-
import { l as mo, u as po } from "../language-resolution-8yZa5r_P-
|
|
30
|
-
import { i as
|
|
31
|
-
import { p as
|
|
32
|
-
import "../index-
|
|
33
|
-
import "../index-
|
|
23
|
+
import { h as R, R as s, k as O, H as m, r as uo, x as Eo, n as F } from "../property-B2F7x7Cz.js";
|
|
24
|
+
import { n as ho } from "../directive-helpers-nlQRAaQt-I6T4KZKW.js";
|
|
25
|
+
import { m as U, d as C } from "../if-defined-BSAr_4u4-4Ys8VE7T.js";
|
|
26
|
+
import { m as X } from "../sized-mixin-BxMraZLS-B_y0PzR3.js";
|
|
27
|
+
import { O as J, n as _o, b as Ao, T as Mo } from "../luzmo-icons-BE2T8vWu.js";
|
|
28
|
+
import { w as Ho, a as Po } from "../async-directive-DWRUSKKF-CmOVMf6V.js";
|
|
29
|
+
import { l as mo, u as po } from "../language-resolution-8yZa5r_P-Bn0bYosv.js";
|
|
30
|
+
import { i as Ro } from "../text-field-CvKSS59x-Dn0_1HO7.js";
|
|
31
|
+
import { p as Fo, d as To, a as Bo } from "../index-CXIT0cYY.js";
|
|
32
|
+
import "../index-BVX_ozT9.js";
|
|
33
|
+
import "../index-DnozlYag.js";
|
|
34
34
|
import { o as eo } from "../when-CDK1Tt5Y-C6ViXC43.js";
|
|
35
|
-
import { a as
|
|
36
|
-
import { m as
|
|
37
|
-
import "../index-
|
|
38
|
-
import { e as
|
|
39
|
-
import { L as
|
|
35
|
+
import { a as No } from "../observe-slot-text-ggb4kKgY-o5QFWUeA.js";
|
|
36
|
+
import { m as Uo } from "../roving-tabindex-DOg4z6ZU-dufnVmvL.js";
|
|
37
|
+
import "../index-BBrer3_5.js";
|
|
38
|
+
import { e as Io } from "../query-Ddbd72Um.js";
|
|
39
|
+
import { L as Oo } from "../edit-option-base-qePiIQWd.js";
|
|
40
40
|
const So = () => {
|
|
41
41
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
42
42
|
const r = document.createElement("style");
|
|
@@ -61,11 +61,11 @@ So();
|
|
|
61
61
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
62
62
|
* SOFTWARE.
|
|
63
63
|
* */
|
|
64
|
-
const
|
|
65
|
-
var
|
|
64
|
+
const Do = ':host{inline-size:var(--luzmo-color-loupe-width, 48px);block-size:var(--luzmo-color-loupe-height, 64px);transform:translateY(var(--luzmo-color-loupe-animation-distance, 8px));opacity:0;transform-origin:bottom;pointer-events:none;filter:drop-shadow(var(--luzmo-color-loupe-drop-shadow-x, 0) var(--luzmo-color-loupe-drop-shadow-y, 2px) var(--luzmo-color-loupe-drop-shadow-blur, 8px) var(--luzmo-color-loupe-drop-shadow-color, rgba(0, 0, 0, .25)));transition:transform .1s ease-in-out,opacity .125s ease-in-out;position:absolute;inset-block-end:calc(var(--luzmo-color-handle-size, 16px) - var(--luzmo-color-handle-outer-border-width, 1px) + var(--luzmo-color-loupe-offset, 12px));inset-inline-end:calc(50% - var(--luzmo-color-loupe-width, 48px) / 2)}:host:dir(rtl),:host([dir=rtl]){inset-inline-end:calc(50% - var(--luzmo-color-loupe-width, 48px) / 2 - 1px)}:host([open]){opacity:1;transform:translate(0)}.luzmo-color-loupe-inner-border{fill:var(--luzmo-picked-color);stroke:var(--luzmo-color-loupe-inner-border-color, rgba(0, 0, 0, .1));stroke-width:var(--luzmo-color-loupe-inner-border-width, 1px)}.luzmo-color-loupe-outer-border{fill:none;stroke:var(--luzmo-color-loupe-outer-border-color, white);stroke-width:calc(var(--luzmo-color-loupe-outer-border-width, 2px) + 2px);transform:translate(calc((var(--luzmo-color-loupe-outer-border-width, 2px) + 2px) / 2))}.luzmo-color-loupe-checkerboard-pattern{fill:var(--luzmo-color-loupe-checkerboard-dark-color, rgb(230, 230, 230))}.luzmo-color-loupe-checkerboard-background{fill:var(--luzmo-color-loupe-checkerboard-light-color, rgb(255, 255, 255))}.luzmo-color-loupe-checkerboard-fill{fill:var(--luzmo-color-loupe-checkerboard-fill, url(#checkerboard-primary))}@media (forced-colors: active){:host{--highcontrast-colorloupe-outer-border-color: CanvasText}}svg{width:inherit;height:inherit}.loupe-clipped{clip-path:path("M23 61.575C19.0044 57.435 15.2591 53.0606 11.784 48.475C8.68949 44.4532 5.96348 40.1608 3.639 35.65C1.224 30.8 0 26.549 0 23C0.00319993 17.6937 1.84059 12.5516 5.20091 8.44488C8.56122 4.33815 13.2378 1.51928 18.4385 0.465803C23.6392 -0.587678 29.0442 0.189006 33.7378 2.66428C38.4314 5.13955 42.125 9.16122 44.193 14.048C45.3915 16.88 46.0061 19.9248 46 23C46 26.551 44.774 30.811 42.355 35.661C40.0274 40.1747 37.298 44.4698 34.2 48.494C30.7297 53.0728 26.9898 57.4409 23 61.575ZZ")}.opacity-checkerboard{position:absolute;top:2px;left:2px;block-size:100%;inline-size:100%}.opacity-checkerboard{background:repeating-conic-gradient(var(--luzmo-color-loupe-checkerboard-light, rgb(255, 255, 255)) 0 25%,var(--luzmo-color-loupe-checkerboard-dark, rgb(230, 230, 230)) 0 50%) var(--luzmo-color-loupe-checkerboard-position, left top)/calc(var(--luzmo-color-loupe-checkerboard-size, 8px) * 2) calc(var(--luzmo-color-loupe-checkerboard-size, 8px) * 2)}';
|
|
65
|
+
var Lo = Object.defineProperty, go = (r, o, e, t) => {
|
|
66
66
|
for (var l = void 0, i = r.length - 1, a; i >= 0; i--)
|
|
67
67
|
(a = r[i]) && (l = a(o, e, l) || l);
|
|
68
|
-
return l &&
|
|
68
|
+
return l && Lo(o, e, l), l;
|
|
69
69
|
};
|
|
70
70
|
const bo = class extends O {
|
|
71
71
|
constructor() {
|
|
@@ -113,7 +113,7 @@ const bo = class extends O {
|
|
|
113
113
|
`;
|
|
114
114
|
}
|
|
115
115
|
};
|
|
116
|
-
bo.styles = R(
|
|
116
|
+
bo.styles = R(Do);
|
|
117
117
|
let zo = bo;
|
|
118
118
|
go([
|
|
119
119
|
s({ type: Boolean, reflect: !0 })
|
|
@@ -138,18 +138,18 @@ go([
|
|
|
138
138
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
139
139
|
* SOFTWARE.
|
|
140
140
|
* */
|
|
141
|
-
const
|
|
141
|
+
const jo = () => {
|
|
142
142
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
143
143
|
const r = document.createElement("style");
|
|
144
144
|
r.setAttribute("data-luzmo-vars", ""), r.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-color-negative: #ca221c;--luzmo-color-negative-hover: #b3241f;--luzmo-color-negative-down: #9f231f;--luzmo-color-negative-focus: #b3241f;--luzmo-color-negative-rgb: 202, 34, 28;--luzmo-color-positive: rgb(20, 150, 101);--luzmo-color-positive-hover: rgb(17, 128, 86);--luzmo-color-positive-down: rgb(16, 105, 71);--luzmo-color-positive-focus: rgb(17, 128, 86);--luzmo-color-positive-rgb: 20, 150, 101;--luzmo-color-selected: rgb(110, 110, 110);--luzmo-color-selected-hover: rgb(70, 70, 70);--luzmo-color-selected-down: rgb(40, 40, 40);--luzmo-color-selected-focus: rgb(70, 70, 70);--luzmo-color-selected-hard: #1e1e1e;--luzmo-color-selected-hard-hover: rgb(0, 0, 0);--luzmo-color-selected-hard-down: rgb(0, 0, 0);--luzmo-color-selected-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(r);
|
|
145
145
|
}
|
|
146
146
|
};
|
|
147
|
-
|
|
148
|
-
const
|
|
149
|
-
var
|
|
147
|
+
jo();
|
|
148
|
+
const qo = ':host{touch-action:none;transition:inline-size var(--luzmo-color-handle-animation-duration, .13s) var(--luzmo-color-handle-animation-easing, ease-in-out),block-size var(--luzmo-color-handle-animation-duration, .13s) var(--luzmo-color-handle-animation-easing, ease-in-out),border-width var(--luzmo-color-handle-animation-duration, .13s) var(--luzmo-color-handle-animation-easing, ease-in-out),margin-inline var(--luzmo-color-handle-animation-duration, .13s) var(--luzmo-color-handle-animation-easing, ease-in-out),margin-block var(--luzmo-color-handle-animation-duration, .13s) var(--luzmo-color-handle-animation-easing, ease-in-out)}:host{background:repeating-conic-gradient(var(--luzmo-color-loupe-checkerboard-light, rgb(255, 255, 255)) 0 25%,var(--luzmo-color-loupe-checkerboard-dark, rgb(230, 230, 230)) 0 50%) var(--luzmo-color-loupe-checkerboard-position, left top)/calc(var(--luzmo-color-loupe-checkerboard-size, 8px) * 2) calc(var(--luzmo-color-loupe-checkerboard-size, 8px) * 2);background-position:50%}:host(:focus){outline:none}:host{z-index:1;box-sizing:border-box;inline-size:var(--luzmo-color-handle-size, 16px);block-size:var(--luzmo-color-handle-size, 16px);margin-inline:calc(var(--luzmo-color-handle-size, 16px) / 2 * -1);margin-block:calc(var(--luzmo-color-handle-size, 16px) / 2 * -1);border-width:var(--luzmo-color-handle-border-width, 2px);border-color:var(--luzmo-color-handle-border-color, rgb(255, 255, 255));box-shadow:0 0 0 var(--luzmo-color-handle-outer-border-width, 1px) var(--luzmo-color-handle-outer-border-color, rgba(0, 0, 0, .42));transition:all var(--luzmo-color-handle-animation-duration, 0) var(--luzmo-color-handle-animation-easing, ease-in-out);border-style:solid}:host,:host:after{border-radius:100%;display:block;position:absolute}:host:after{content:"";inset-inline:calc(50% - var(--luzmo-color-handle-hitarea-size, 24px) / 2);inset-block:calc(50% - var(--luzmo-color-handle-hitarea-size, 24px) / 2);inline-size:var(--luzmo-color-handle-hitarea-size, 24px);block-size:var(--luzmo-color-handle-hitarea-size, 24px);border-radius:var(--luzmo-color-handle-hitarea-border-radius, 100%)}:host([focused]),:host(:focus-visible){inline-size:var(--luzmo-color-handle-focused-size, 32px);block-size:var(--luzmo-color-handle-focused-size, 32px);margin-inline:calc(var(--luzmo-color-handle-size, 16px) * -1);margin-block:calc(var(--luzmo-color-handle-size, 16px) * -1);outline:none}:host([disabled]){pointer-events:none;border-color:var(--highcontrast-color-handle-border-color-disabled, var(--luzmo-color-handle-border-color-disabled, var(--luzmo-font-color-disabled)));background:var(--highcontrast-color-handle-fill-color-disabled, var(--luzmo-color-handle-fill-color-disabled, var(--luzmo-font-color-disabled)));box-shadow:none}:host([disabled]) .inner{display:none}.inner{inline-size:100%;block-size:100%;box-shadow:inset 0 0 0 var(--luzmo-color-handle-inner-border-width, var(--luzmo-border-width)) var(--luzmo-color-handle-inner-border-color, rgba(0, 0, 0, .42));background-color:var(--luzmo-picked-color);border-radius:100%}@media (forced-colors: active){:host{forced-color-adjust:none}:host([disabled]){--highcontrast-color-handle-border-color-disabled: GrayText;--highcontrast-color-handle-fill-color-disabled: Canvas}}';
|
|
149
|
+
var Ko = Object.defineProperty, W = (r, o, e, t) => {
|
|
150
150
|
for (var l = void 0, i = r.length - 1, a; i >= 0; i--)
|
|
151
151
|
(a = r[i]) && (l = a(o, e, l) || l);
|
|
152
|
-
return l &&
|
|
152
|
+
return l && Ko(o, e, l), l;
|
|
153
153
|
};
|
|
154
154
|
const fo = class extends O {
|
|
155
155
|
constructor() {
|
|
@@ -174,7 +174,7 @@ const fo = class extends O {
|
|
|
174
174
|
super.firstUpdated(o), this.addEventListener("pointerdown", this.handlePointerdown), this.addEventListener("pointerup", this.handlePointerup), this.addEventListener("pointercancel", this.handlePointerup);
|
|
175
175
|
}
|
|
176
176
|
};
|
|
177
|
-
fo.styles = R(
|
|
177
|
+
fo.styles = R(qo);
|
|
178
178
|
let D = fo;
|
|
179
179
|
W([
|
|
180
180
|
s({ type: Boolean, reflect: !0 })
|
|
@@ -189,7 +189,7 @@ W([
|
|
|
189
189
|
s({ type: String })
|
|
190
190
|
], D.prototype, "color");
|
|
191
191
|
customElements.get("luzmo-color-handle") || customElements.define("luzmo-color-handle", D);
|
|
192
|
-
const
|
|
192
|
+
const Vo = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
193
193
|
__proto__: null,
|
|
194
194
|
LuzmoColorHandle: D
|
|
195
195
|
}, Symbol.toStringTag, { value: "Module" }));
|
|
@@ -211,17 +211,17 @@ const Ko = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
|
|
|
211
211
|
* SOFTWARE.
|
|
212
212
|
* */
|
|
213
213
|
function p(r, o) {
|
|
214
|
-
|
|
215
|
-
const e =
|
|
214
|
+
Xo(r) && (r = "100%");
|
|
215
|
+
const e = Wo(r);
|
|
216
216
|
return r = o === 360 ? r : Math.min(o, Math.max(0, parseFloat(r))), e && (r = parseInt(String(r * o), 10) / 100), Math.abs(r - o) < 1e-6 ? 1 : (o === 360 ? r = (r < 0 ? r % o + o : r % o) / parseFloat(String(o)) : r = r % o / parseFloat(String(o)), r);
|
|
217
217
|
}
|
|
218
218
|
function j(r) {
|
|
219
219
|
return Math.min(1, Math.max(0, r));
|
|
220
220
|
}
|
|
221
|
-
function
|
|
221
|
+
function Xo(r) {
|
|
222
222
|
return typeof r == "string" && r.indexOf(".") !== -1 && parseFloat(r) === 1;
|
|
223
223
|
}
|
|
224
|
-
function
|
|
224
|
+
function Wo(r) {
|
|
225
225
|
return typeof r == "string" && r.indexOf("%") !== -1;
|
|
226
226
|
}
|
|
227
227
|
function vo(r) {
|
|
@@ -230,10 +230,10 @@ function vo(r) {
|
|
|
230
230
|
function q(r) {
|
|
231
231
|
return Number(r) <= 1 ? `${Number(r) * 100}%` : r;
|
|
232
232
|
}
|
|
233
|
-
function
|
|
233
|
+
function N(r) {
|
|
234
234
|
return r.length === 1 ? "0" + r : String(r);
|
|
235
235
|
}
|
|
236
|
-
function
|
|
236
|
+
function Yo(r, o, e) {
|
|
237
237
|
return {
|
|
238
238
|
r: p(r, 255) * 255,
|
|
239
239
|
g: p(o, 255) * 255,
|
|
@@ -267,7 +267,7 @@ function ro(r, o, e) {
|
|
|
267
267
|
function Z(r, o, e) {
|
|
268
268
|
return e < 0 && (e += 1), e > 1 && (e -= 1), e < 1 / 6 ? r + (o - r) * (6 * e) : e < 1 / 2 ? o : e < 2 / 3 ? r + (o - r) * (2 / 3 - e) * 6 : r;
|
|
269
269
|
}
|
|
270
|
-
function
|
|
270
|
+
function Zo(r, o, e) {
|
|
271
271
|
let t, l, i;
|
|
272
272
|
if (r = p(r, 360), o = p(o, 100), e = p(e, 100), o === 0)
|
|
273
273
|
l = e, i = e, t = e;
|
|
@@ -300,29 +300,29 @@ function to(r, o, e) {
|
|
|
300
300
|
}
|
|
301
301
|
return { h: i, s: c, v: a };
|
|
302
302
|
}
|
|
303
|
-
function
|
|
303
|
+
function Go(r, o, e) {
|
|
304
304
|
r = p(r, 360) * 6, o = p(o, 100), e = p(e, 100);
|
|
305
305
|
const t = Math.floor(r), l = r - t, i = e * (1 - o), a = e * (1 - l * o), n = e * (1 - (1 - l) * o), c = t % 6, d = [e, a, i, i, n, e][c], b = [n, e, e, a, i, i][c], B = [i, i, n, e, e, a][c];
|
|
306
306
|
return { r: d * 255, g: b * 255, b: B * 255 };
|
|
307
307
|
}
|
|
308
308
|
function lo(r, o, e, t) {
|
|
309
309
|
const l = [
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
310
|
+
N(Math.round(r).toString(16)),
|
|
311
|
+
N(Math.round(o).toString(16)),
|
|
312
|
+
N(Math.round(e).toString(16))
|
|
313
313
|
];
|
|
314
314
|
return t && l[0].startsWith(l[0].charAt(1)) && l[1].startsWith(l[1].charAt(1)) && l[2].startsWith(l[2].charAt(1)) ? l[0].charAt(0) + l[1].charAt(0) + l[2].charAt(0) : l.join("");
|
|
315
315
|
}
|
|
316
|
-
function
|
|
316
|
+
function Jo(r, o, e, t, l) {
|
|
317
317
|
const i = [
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
318
|
+
N(Math.round(r).toString(16)),
|
|
319
|
+
N(Math.round(o).toString(16)),
|
|
320
|
+
N(Math.round(e).toString(16)),
|
|
321
|
+
N(oe(t))
|
|
322
322
|
];
|
|
323
323
|
return l && i[0].startsWith(i[0].charAt(1)) && i[1].startsWith(i[1].charAt(1)) && i[2].startsWith(i[2].charAt(1)) && i[3].startsWith(i[3].charAt(1)) ? i[0].charAt(0) + i[1].charAt(0) + i[2].charAt(0) + i[3].charAt(0) : i.join("");
|
|
324
324
|
}
|
|
325
|
-
function
|
|
325
|
+
function Qo(r, o, e, t) {
|
|
326
326
|
const l = r / 100, i = o / 100, a = e / 100, n = t / 100, c = 255 * (1 - l) * (1 - n), d = 255 * (1 - i) * (1 - n), b = 255 * (1 - a) * (1 - n);
|
|
327
327
|
return { r: c, g: d, b };
|
|
328
328
|
}
|
|
@@ -335,7 +335,7 @@ function io(r, o, e) {
|
|
|
335
335
|
k: Math.round(a)
|
|
336
336
|
};
|
|
337
337
|
}
|
|
338
|
-
function
|
|
338
|
+
function oe(r) {
|
|
339
339
|
return Math.round(parseFloat(r) * 255).toString(16);
|
|
340
340
|
}
|
|
341
341
|
function ao(r) {
|
|
@@ -344,7 +344,7 @@ function ao(r) {
|
|
|
344
344
|
function x(r) {
|
|
345
345
|
return parseInt(r, 16);
|
|
346
346
|
}
|
|
347
|
-
function
|
|
347
|
+
function ee(r) {
|
|
348
348
|
return {
|
|
349
349
|
r: r >> 16,
|
|
350
350
|
g: (r & 65280) >> 8,
|
|
@@ -501,9 +501,9 @@ const Q = {
|
|
|
501
501
|
yellow: "#ffff00",
|
|
502
502
|
yellowgreen: "#9acd32"
|
|
503
503
|
};
|
|
504
|
-
function
|
|
504
|
+
function re(r) {
|
|
505
505
|
let o = { r: 0, g: 0, b: 0 }, e = 1, t = null, l = null, i = null, a = !1, n = !1;
|
|
506
|
-
return typeof r == "string" && (r =
|
|
506
|
+
return typeof r == "string" && (r = ie(r)), typeof r == "object" && (v(r.r) && v(r.g) && v(r.b) ? (o = Yo(r.r, r.g, r.b), a = !0, n = String(r.r).substr(-1) === "%" ? "prgb" : "rgb") : v(r.h) && v(r.s) && v(r.v) ? (t = q(r.s), l = q(r.v), o = Go(r.h, t, l), a = !0, n = "hsv") : v(r.h) && v(r.s) && v(r.l) ? (t = q(r.s), i = q(r.l), o = Zo(r.h, t, i), a = !0, n = "hsl") : v(r.c) && v(r.m) && v(r.y) && v(r.k) && (o = Qo(r.c, r.m, r.y, r.k), a = !0, n = "cmyk"), Object.prototype.hasOwnProperty.call(r, "a") && (e = r.a)), e = vo(e), {
|
|
507
507
|
ok: a,
|
|
508
508
|
format: r.format || n,
|
|
509
509
|
r: Math.min(255, Math.max(o.r, 0)),
|
|
@@ -512,7 +512,7 @@ function ee(r) {
|
|
|
512
512
|
a: e
|
|
513
513
|
};
|
|
514
514
|
}
|
|
515
|
-
const
|
|
515
|
+
const te = "[-\\+]?\\d+%?", le = "[-\\+]?\\d*\\.\\d+%?", P = "(?:" + le + ")|(?:" + te + ")", G = "[\\s|\\(]+(" + P + ")[,|\\s]+(" + P + ")[,|\\s]+(" + P + ")\\s*\\)?", K = (
|
|
516
516
|
// eslint-disable-next-line prettier/prettier
|
|
517
517
|
"[\\s|\\(]+(" + P + ")[,|\\s]+(" + P + ")[,|\\s]+(" + P + ")[,|\\s]+(" + P + ")\\s*\\)?"
|
|
518
518
|
), w = {
|
|
@@ -529,7 +529,7 @@ const re = "[-\\+]?\\d+%?", te = "[-\\+]?\\d*\\.\\d+%?", P = "(?:" + te + ")|(?:
|
|
|
529
529
|
hex4: /^#?([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})([0-9a-fA-F]{1})$/,
|
|
530
530
|
hex8: /^#?([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})([0-9a-fA-F]{2})$/
|
|
531
531
|
};
|
|
532
|
-
function
|
|
532
|
+
function ie(r) {
|
|
533
533
|
if (r = r.trim().toLowerCase(), r.length === 0)
|
|
534
534
|
return !1;
|
|
535
535
|
let o = !1;
|
|
@@ -574,8 +574,8 @@ let h = class u {
|
|
|
574
574
|
constructor(o = "", e = {}) {
|
|
575
575
|
if (o instanceof u)
|
|
576
576
|
return o;
|
|
577
|
-
typeof o == "number" && (o =
|
|
578
|
-
const t =
|
|
577
|
+
typeof o == "number" && (o = ee(o)), this.originalInput = o;
|
|
578
|
+
const t = re(o);
|
|
579
579
|
this.originalInput = o, this.r = t.r, this.g = t.g, this.b = t.b, this.a = t.a, this.roundA = Math.round(100 * this.a) / 100, this.format = e.format ?? t.format, this.gradientType = e.gradientType, this.r < 1 && (this.r = Math.round(this.r)), this.g < 1 && (this.g = Math.round(this.g)), this.b < 1 && (this.b = Math.round(this.b)), this.isValid = t.ok;
|
|
580
580
|
}
|
|
581
581
|
isDark() {
|
|
@@ -670,7 +670,7 @@ let h = class u {
|
|
|
670
670
|
* @param allow4Char will shorten hex value to 4 char if possible
|
|
671
671
|
*/
|
|
672
672
|
toHex8(o = !1) {
|
|
673
|
-
return
|
|
673
|
+
return Jo(this.r, this.g, this.b, this.a, o);
|
|
674
674
|
}
|
|
675
675
|
/**
|
|
676
676
|
* Returns the hex 8 value of the color -with a # prefixed.
|
|
@@ -1108,18 +1108,18 @@ let xo = class {
|
|
|
1108
1108
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
1109
1109
|
* SOFTWARE.
|
|
1110
1110
|
* */
|
|
1111
|
-
const
|
|
1111
|
+
const ae = () => {
|
|
1112
1112
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
1113
1113
|
const r = document.createElement("style");
|
|
1114
1114
|
r.setAttribute("data-luzmo-vars", ""), r.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-color-negative: #ca221c;--luzmo-color-negative-hover: #b3241f;--luzmo-color-negative-down: #9f231f;--luzmo-color-negative-focus: #b3241f;--luzmo-color-negative-rgb: 202, 34, 28;--luzmo-color-positive: rgb(20, 150, 101);--luzmo-color-positive-hover: rgb(17, 128, 86);--luzmo-color-positive-down: rgb(16, 105, 71);--luzmo-color-positive-focus: rgb(17, 128, 86);--luzmo-color-positive-rgb: 20, 150, 101;--luzmo-color-selected: rgb(110, 110, 110);--luzmo-color-selected-hover: rgb(70, 70, 70);--luzmo-color-selected-down: rgb(40, 40, 40);--luzmo-color-selected-focus: rgb(70, 70, 70);--luzmo-color-selected-hard: #1e1e1e;--luzmo-color-selected-hard-hover: rgb(0, 0, 0);--luzmo-color-selected-hard-down: rgb(0, 0, 0);--luzmo-color-selected-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(r);
|
|
1115
1115
|
}
|
|
1116
1116
|
};
|
|
1117
|
-
|
|
1118
|
-
const
|
|
1119
|
-
var
|
|
1120
|
-
for (var l = t > 1 ? void 0 : t ?
|
|
1117
|
+
ae();
|
|
1118
|
+
const se = "@media (forced-colors: active){:host{--highcontrast-color-area-border-color-disabled: GrayText;--highcontrast-color-area-border-color: Canvas;--highcontrast-color-area-fill-color-disabled: Canvas}.gradient,:host([disabled]){forced-color-adjust:none}}:host{cursor:default;-webkit-user-select:none;user-select:none;min-inline-size:var(--luzmo-color-area-min-width, 64px);min-block-size:var(--luzmo-color-area-min-height, 64px);inline-size:var(--luzmo-color-area-width, 192px);block-size:var(--luzmo-color-area-height, 192px);box-sizing:border-box;border-radius:var(--luzmo-color-area-border-radius, var(--luzmo-border-radius-s));border:var(--luzmo-color-area-border-width, var(--luzmo-border-width)) solid var(--highcontrast-color-area-border-color, var(--luzmo-color-area-border-color, var(--luzmo-border-color)));display:inline-block;position:relative}:host([focused]){z-index:1}:host([disabled]){pointer-events:none;background:var(--highcontrast-color-area-fill-color-disabled, var(--luzmo-color-area-disabled-background-color, var(--luzmo-dimmed-color)));border:var(--luzmo-color-area-border-width, var(--luzmo-border-width)) solid var(--highcontrast-color-area-border-color-disabled)}:host([disabled]) .gradient{display:none}.handle{transform:translate(calc(var(--luzmo-color-area-width, 192px) - var(--luzmo-border-width)));inset-block-start:0}.handle:dir(rtl),:host([dir=rtl]) .handle{inset-inline-end:0}.gradient{inline-size:100%;block-size:100%;border-radius:var(--luzmo-color-area-border-radius, var(--luzmo-border-radius-s))}.slider{opacity:0;inline-size:100%;block-size:100%;z-index:0;pointer-events:none;margin:0;position:absolute;inset-block-start:0;inset-inline-start:0}:host{touch-action:none}:host:before{pointer-events:none}.gradient{overflow:hidden}.handle{transform:translate(var(--luzmo-color-area-default-width))}::slotted(*){width:100%;height:100%}:host([dir=rtl]) .gradient{transform:scaleX(-1)}.slider[orient=vertical]{-webkit-appearance:slider-vertical;-moz-appearance:slider-vertical;appearance:slider-vertical}.slider:focus{z-index:1}.fieldset{border:0;margin:0;padding:0}";
|
|
1119
|
+
var ne = Object.defineProperty, ce = Object.getOwnPropertyDescriptor, z = (r, o, e, t) => {
|
|
1120
|
+
for (var l = t > 1 ? void 0 : t ? ce(o, e) : o, i = r.length - 1, a; i >= 0; i--)
|
|
1121
1121
|
(a = r[i]) && (l = (t ? a(o, e, l) : a(l)) || l);
|
|
1122
|
-
return t && l &&
|
|
1122
|
+
return t && l && ne(o, e, l), l;
|
|
1123
1123
|
};
|
|
1124
1124
|
class g extends O {
|
|
1125
1125
|
constructor() {
|
|
@@ -1135,7 +1135,7 @@ class g extends O {
|
|
|
1135
1135
|
}), this.activeAxis = "x", this._x = 1, this._y = 1, this.step = 0.01, this.altered = 0, this.activeKeys = /* @__PURE__ */ new Set(), this._valueChanged = !1, this._pointerDown = !1;
|
|
1136
1136
|
}
|
|
1137
1137
|
static get styles() {
|
|
1138
|
-
return [R(
|
|
1138
|
+
return [R(se)];
|
|
1139
1139
|
}
|
|
1140
1140
|
get hue() {
|
|
1141
1141
|
return this.colorController.hue;
|
|
@@ -1300,7 +1300,7 @@ class g extends O {
|
|
|
1300
1300
|
o.button === 0 && (o.stopPropagation(), o.preventDefault(), this.handle.dispatchEvent(new PointerEvent("pointerdown", o)), this.handlePointermove(o));
|
|
1301
1301
|
}
|
|
1302
1302
|
render() {
|
|
1303
|
-
const { width: o = 0, height: e = 0 } = this.boundingClientRect || {}, t =
|
|
1303
|
+
const { width: o = 0, height: e = 0 } = this.boundingClientRect || {}, t = Ho() || Po(), l = "Color Picker", i = U(t ? void 0 : "2d slider"), a = this.labelX, n = this.labelY, c = new Intl.NumberFormat(this.languageResolver.language, {
|
|
1304
1304
|
style: "percent",
|
|
1305
1305
|
unitDisplay: "narrow"
|
|
1306
1306
|
}).format(this.x), d = new Intl.NumberFormat(this.languageResolver.language, {
|
|
@@ -1317,7 +1317,7 @@ class g extends O {
|
|
|
1317
1317
|
</div>
|
|
1318
1318
|
|
|
1319
1319
|
<luzmo-color-handle
|
|
1320
|
-
tabindex=${
|
|
1320
|
+
tabindex=${U(this.focused ? void 0 : "0")}
|
|
1321
1321
|
@focus=${this.forwardFocus}
|
|
1322
1322
|
?focused=${this.focused}
|
|
1323
1323
|
class="handle"
|
|
@@ -1336,7 +1336,7 @@ class g extends O {
|
|
|
1336
1336
|
|
|
1337
1337
|
<fieldset
|
|
1338
1338
|
class="fieldset"
|
|
1339
|
-
aria-label=${
|
|
1339
|
+
aria-label=${U(t ? l : void 0)}
|
|
1340
1340
|
>
|
|
1341
1341
|
<div role="presentation">
|
|
1342
1342
|
<input
|
|
@@ -1470,19 +1470,19 @@ customElements.get("luzmo-color-area") || customElements.define("luzmo-color-are
|
|
|
1470
1470
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
1471
1471
|
* SOFTWARE.
|
|
1472
1472
|
* */
|
|
1473
|
-
const
|
|
1473
|
+
const ue = () => {
|
|
1474
1474
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
1475
1475
|
const r = document.createElement("style");
|
|
1476
1476
|
r.setAttribute("data-luzmo-vars", ""), r.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-color-negative: #ca221c;--luzmo-color-negative-hover: #b3241f;--luzmo-color-negative-down: #9f231f;--luzmo-color-negative-focus: #b3241f;--luzmo-color-negative-rgb: 202, 34, 28;--luzmo-color-positive: rgb(20, 150, 101);--luzmo-color-positive-hover: rgb(17, 128, 86);--luzmo-color-positive-down: rgb(16, 105, 71);--luzmo-color-positive-focus: rgb(17, 128, 86);--luzmo-color-positive-rgb: 20, 150, 101;--luzmo-color-selected: rgb(110, 110, 110);--luzmo-color-selected-hover: rgb(70, 70, 70);--luzmo-color-selected-down: rgb(40, 40, 40);--luzmo-color-selected-focus: rgb(70, 70, 70);--luzmo-color-selected-hard: #1e1e1e;--luzmo-color-selected-hard-hover: rgb(0, 0, 0);--luzmo-color-selected-hard-down: rgb(0, 0, 0);--luzmo-color-selected-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(r);
|
|
1477
1477
|
}
|
|
1478
1478
|
};
|
|
1479
|
-
|
|
1480
|
-
var
|
|
1479
|
+
ue();
|
|
1480
|
+
var he = Object.defineProperty, de = (r, o, e, t) => {
|
|
1481
1481
|
for (var l = void 0, i = r.length - 1, a; i >= 0; i--)
|
|
1482
1482
|
(a = r[i]) && (l = a(o, e, l) || l);
|
|
1483
|
-
return l &&
|
|
1483
|
+
return l && he(o, e, l), l;
|
|
1484
1484
|
};
|
|
1485
|
-
let yo = class extends
|
|
1485
|
+
let yo = class extends Ro {
|
|
1486
1486
|
constructor() {
|
|
1487
1487
|
super(...arguments), this.viewColor = !1, this._value = "", this.cachedColor = null, this.cachedTinyColor = null;
|
|
1488
1488
|
}
|
|
@@ -1516,14 +1516,14 @@ let yo = class extends Po {
|
|
|
1516
1516
|
` : m``;
|
|
1517
1517
|
}
|
|
1518
1518
|
render() {
|
|
1519
|
-
return this.viewColor && Promise.resolve().then(() =>
|
|
1519
|
+
return this.viewColor && Promise.resolve().then(() => Vo), m` ${super.render()} ${this.renderColorHandle()} `;
|
|
1520
1520
|
}
|
|
1521
1521
|
checkValidity() {
|
|
1522
1522
|
let o = super.checkValidity();
|
|
1523
1523
|
return this.value && ((!this.cachedTinyColor || this.cachedTinyColor.originalInput !== this.value) && (this.cachedTinyColor = new h(this.value)), this.valid = o = this.cachedTinyColor.isValid, this.invalid = !o), o;
|
|
1524
1524
|
}
|
|
1525
1525
|
};
|
|
1526
|
-
|
|
1526
|
+
de([
|
|
1527
1527
|
s({ type: Boolean, attribute: "view-color" })
|
|
1528
1528
|
], yo.prototype, "viewColor");
|
|
1529
1529
|
customElements.get("luzmo-color-field") || customElements.define("luzmo-color-field", yo);
|
|
@@ -1544,18 +1544,18 @@ customElements.get("luzmo-color-field") || customElements.define("luzmo-color-fi
|
|
|
1544
1544
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
1545
1545
|
* SOFTWARE.
|
|
1546
1546
|
* */
|
|
1547
|
-
const
|
|
1547
|
+
const me = () => {
|
|
1548
1548
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
1549
1549
|
const r = document.createElement("style");
|
|
1550
1550
|
r.setAttribute("data-luzmo-vars", ""), r.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-color-negative: #ca221c;--luzmo-color-negative-hover: #b3241f;--luzmo-color-negative-down: #9f231f;--luzmo-color-negative-focus: #b3241f;--luzmo-color-negative-rgb: 202, 34, 28;--luzmo-color-positive: rgb(20, 150, 101);--luzmo-color-positive-hover: rgb(17, 128, 86);--luzmo-color-positive-down: rgb(16, 105, 71);--luzmo-color-positive-focus: rgb(17, 128, 86);--luzmo-color-positive-rgb: 20, 150, 101;--luzmo-color-selected: rgb(110, 110, 110);--luzmo-color-selected-hover: rgb(70, 70, 70);--luzmo-color-selected-down: rgb(40, 40, 40);--luzmo-color-selected-focus: rgb(70, 70, 70);--luzmo-color-selected-hard: #1e1e1e;--luzmo-color-selected-hard-hover: rgb(0, 0, 0);--luzmo-color-selected-hard-down: rgb(0, 0, 0);--luzmo-color-selected-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(r);
|
|
1551
1551
|
}
|
|
1552
1552
|
};
|
|
1553
|
-
|
|
1554
|
-
const
|
|
1555
|
-
var
|
|
1556
|
-
for (var l = t > 1 ? void 0 : t ?
|
|
1553
|
+
me();
|
|
1554
|
+
const pe = '.opacity-checkerboard{position:absolute;block-size:100%;inline-size:100%;background:repeating-conic-gradient(var(--luzmo-color-loupe-checkerboard-light, rgb(255, 255, 255)) 0 25%,var(--luzmo-color-loupe-checkerboard-dark, rgb(230, 230, 230)) 0 50%) var(--luzmo-color-loupe-checkerboard-position, left top)/calc(var(--luzmo-color-loupe-checkerboard-size, 8px) * 2) calc(var(--luzmo-color-loupe-checkerboard-size, 8px) * 2)}:host{--luzmo-color-slider-gradient-fallback: rgb(255 0 0) 0%, rgb(255 255 0) 17%, rgb(0 255 0) 33%, rgb(0 255 255) 50%, rgb(0 0 255) 67%, rgb(255 0 255) 83%, rgb(255 0 0) 100%;touch-action:none}:host([vertical]) .handle{inset-block-start:unset;inset-block-end:0}:host([vertical]) .slider{-webkit-appearance:slider-vertical;-moz-appearance:slider-vertical;appearance:slider-vertical}:host(:focus){outline:none}.gradient{overflow:hidden}::slotted(*){width:100%;height:100%}@media (forced-colors: active){:host{--highcontrast-color-slider-border-color: CanvasText;--highcontrast-color-slider-border-color-disabled: GrayText;--highcontrast-color-slider-background-color-disabled: Canvas;forced-color-adjust:none}}:host{--luzmo-color-handle-hitarea-border-radius: var( --luzmo-color-slider-handle-hitarea-border-radius, 0px );min-inline-size:var(--luzmo-color-slider-minimum-length, 80px);inline-size:var(--luzmo-color-slider-length, 192px);block-size:var(--luzmo-color-slider-control-track-width, 24px);-webkit-user-select:none;user-select:none;cursor:default;display:block;position:relative}:host([focused]){z-index:2}:host([disabled]){pointer-events:none}:host([disabled]) .gradient{display:none}:host([vertical]){min-block-size:var(--luzmo-color-slider-vertical-minimum-height, var(--luzmo-color-slider-minimum-length, 80px));block-size:var(--luzmo-color-slider-vertical-height, var(--luzmo-color-slider-length, 192px));min-inline-size:0;inline-size:var(--luzmo-color-slider-vertical-control-track-width, var(--luzmo-color-slider-control-track-height, 24px));display:inline-block}:host([vertical]) .handle{inset-inline-start:50%}.handle{inset-block-start:50%;inset-inline-start:0}.checkerboard{--luzmo-color-slider-border-color-local: var( --highcontrast-color-slider-border-color, var(--luzmo-color-slider-border-color, var(--luzmo-border-color)) )}.checkerboard:before{content:"";z-index:1;box-shadow:inset 0 0 0 var(--luzmo-color-slider-border-width, var(--luzmo-border-width)) var(--luzmo-color-slider-border-color-local);border-radius:var(--luzmo-color-slider-border-rounding, var(--luzmo-border-radius-s));position:absolute;top:0;right:0;bottom:0;left:0}:host([disabled]) .checkerboard{--luzmo-color-slider-border-color-local: var( --highcontrast-color-slider-border-color-disabled, var(--luzmo-color-slider-border-color-disabled, var(--luzmo-dimmed-color)) );background:var(--highcontrast-color-slider-background-color-disabled, var(--luzmo-color-slider-background-color-disabled, var(--luzmo-dimmed-color)))}.checkerboard,.gradient{inline-size:100%;block-size:100%;border-radius:var(--luzmo-color-slider-border-rounding, var(--luzmo-border-radius-s))}.gradient:dir(rtl),:host([dir=rtl]) .gradient{transform:scaleX(-1)}.slider{opacity:0;inline-size:100%;block-size:100%;z-index:0;pointer-events:none;margin:0;position:absolute;inset-block-start:0;inset-inline-start:0}';
|
|
1555
|
+
var ge = Object.defineProperty, be = Object.getOwnPropertyDescriptor, y = (r, o, e, t) => {
|
|
1556
|
+
for (var l = t > 1 ? void 0 : t ? be(o, e) : o, i = r.length - 1, a; i >= 0; i--)
|
|
1557
1557
|
(a = r[i]) && (l = (t ? a(o, e, l) : a(l)) || l);
|
|
1558
|
-
return t && l &&
|
|
1558
|
+
return t && l && ge(o, e, l), l;
|
|
1559
1559
|
};
|
|
1560
1560
|
let f = class extends uo {
|
|
1561
1561
|
constructor() {
|
|
@@ -1579,7 +1579,7 @@ let f = class extends uo {
|
|
|
1579
1579
|
}), this.sliderHandlePosition = 0, this.step = 1, this.isLTR = !0, this._altered = 0, this._pointerDown = !1;
|
|
1580
1580
|
}
|
|
1581
1581
|
static get styles() {
|
|
1582
|
-
return [R(
|
|
1582
|
+
return [R(pe)];
|
|
1583
1583
|
}
|
|
1584
1584
|
get value() {
|
|
1585
1585
|
return this.mode === "opacity" ? this.colorController.opacity : this.colorController.hue;
|
|
@@ -1733,13 +1733,13 @@ let f = class extends uo {
|
|
|
1733
1733
|
<div
|
|
1734
1734
|
class="gradient"
|
|
1735
1735
|
role="presentation"
|
|
1736
|
-
style=${
|
|
1736
|
+
style=${Fo(this.getColorSliderStyle)}
|
|
1737
1737
|
>
|
|
1738
1738
|
<slot name="gradient"></slot>
|
|
1739
1739
|
</div>
|
|
1740
1740
|
</div>
|
|
1741
1741
|
<luzmo-color-handle
|
|
1742
|
-
tabindex=${
|
|
1742
|
+
tabindex=${U(this.focused ? void 0 : "0")}
|
|
1743
1743
|
@focus=${this.forwardFocus}
|
|
1744
1744
|
?focused=${this.focused}
|
|
1745
1745
|
class="handle"
|
|
@@ -1760,8 +1760,8 @@ let f = class extends uo {
|
|
|
1760
1760
|
class="slider"
|
|
1761
1761
|
min="0"
|
|
1762
1762
|
max=${this.mode === "opacity" ? "100" : "360"}
|
|
1763
|
-
aria-orientation=${
|
|
1764
|
-
orient=${
|
|
1763
|
+
aria-orientation=${U(this.vertical ? "vertical" : void 0)}
|
|
1764
|
+
orient=${U(this.vertical ? "vertical" : void 0)}
|
|
1765
1765
|
step=${this.step}
|
|
1766
1766
|
aria-label=${this.label}
|
|
1767
1767
|
.value=${String(
|
|
@@ -1849,18 +1849,18 @@ customElements.get("luzmo-color-slider") || customElements.define("luzmo-color-s
|
|
|
1849
1849
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
1850
1850
|
* SOFTWARE.
|
|
1851
1851
|
* */
|
|
1852
|
-
const
|
|
1852
|
+
const ze = () => {
|
|
1853
1853
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
1854
1854
|
const r = document.createElement("style");
|
|
1855
1855
|
r.setAttribute("data-luzmo-vars", ""), r.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-color-negative: #ca221c;--luzmo-color-negative-hover: #b3241f;--luzmo-color-negative-down: #9f231f;--luzmo-color-negative-focus: #b3241f;--luzmo-color-negative-rgb: 202, 34, 28;--luzmo-color-positive: rgb(20, 150, 101);--luzmo-color-positive-hover: rgb(17, 128, 86);--luzmo-color-positive-down: rgb(16, 105, 71);--luzmo-color-positive-focus: rgb(17, 128, 86);--luzmo-color-positive-rgb: 20, 150, 101;--luzmo-color-selected: rgb(110, 110, 110);--luzmo-color-selected-hover: rgb(70, 70, 70);--luzmo-color-selected-down: rgb(40, 40, 40);--luzmo-color-selected-focus: rgb(70, 70, 70);--luzmo-color-selected-hard: #1e1e1e;--luzmo-color-selected-hard-hover: rgb(0, 0, 0);--luzmo-color-selected-hard-down: rgb(0, 0, 0);--luzmo-color-selected-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(r);
|
|
1856
1856
|
}
|
|
1857
1857
|
};
|
|
1858
|
-
|
|
1859
|
-
const
|
|
1860
|
-
var
|
|
1861
|
-
for (var l = t > 1 ? void 0 : t ?
|
|
1858
|
+
ze();
|
|
1859
|
+
const fe = '@media (forced-colors: active){:host{--highcontrast-swatch-disabled-icon-color: GrayText;--highcontrast-swatch-focus-indicator-color: ButtonText;--highcontrast-swatch-background-color-selected: Background;--highcontrast-swatch-border-color-selected: Highlight;--highcontrast-swatch-border-color: ButtonText;--highcontrast-swatch-fill-foreground-color: ButtonText}.fill{forced-color-adjust:none}:host([disabled]){--highcontrast-swatch-border-color: GrayText}}:host{box-sizing:border-box;inline-size:var(--luzmo-swatch-size, var(--swatch-size));block-size:var(--luzmo-swatch-size, var(--swatch-size));-webkit-user-select:none;user-select:none;outline:none;justify-content:center;align-items:center;display:flex;position:relative}.disabled-icon{inline-size:var(--luzmo-swatch-disabled-icon-size, var(--swatch-disabled-icon-size));block-size:var(--luzmo-swatch-disabled-icon-size, var(--swatch-disabled-icon-size))}:host,:host:before{border-radius:var(--luzmo-swatch-border-radius, var(--swatch-border-radius))}:host([selected]){background-color:var(--highcontrast-swatch-background-color-selected, var(--luzmo-swatch-inner-border-color-selected, var(--swatch-inner-border-color-selected)))}:host([selected]) .fill:before{box-shadow:none;border-radius:0}:host([selected]):before{opacity:1}:host .is-image .fill:before{background-color:initial}:host([mixed-value]) .fill{background:none;background:var(--picked-color, transparent)}:host([mixed-value]) .mixed-value-icon{color:var(--swatch-dash-icon-color);display:block}:host([nothing]) .fill{background-color:initial;background-color:var(--picked-color, transparent);background-image:none}:host([nothing]) .fill:after{inline-size:var(--luzmo-swatch-slash-thickness, var(--swatch-slash-thickness));content:"";block-size:200%;background:var(--highcontrast-swatch-fill-foreground-color, var(--luzmo-swatch-slash-icon-color, var(--swatch-slash-icon-color)));position:absolute;transform:rotate(-45deg)}:host([nothing][shape=rectangle]) .fill:after{transform:rotate(-25deg)}:host([disabled]) .disabled-icon{display:block}:host:before{content:"";border-width:var(--luzmo-swatch-border-thickness-selected, var(--swatch-border-thickness-selected));border-style:solid;border-color:var(--highcontrast-swatch-border-color-selected, var(--luzmo-swatch-border-color-selected, var(--swatch-border-color-selected)));opacity:0;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0}:host:after{content:"";inset:calc(var(--luzmo-swatch-focus-indicator-gap, var(--swatch-focus-indicator-gap)) * -2);opacity:0;border-width:var(--luzmo-swatch-focus-indicator-width, var(--swatch-focus-indicator-width));border-style:solid;border-color:var(--highcontrast-swatch-focus-indicator-color, var(--luzmo-swatch-focus-indicator-color, var(--swatch-focus-indicator-color)));border-radius:var(--luzmo-swatch-focus-indicator-border-radius, var(--swatch-focus-indicator-border-radius));transition:opacity var(--luzmo-animation-duration) ease-in-out;position:absolute}:host(:focus-visible):after{opacity:1}.fill{inline-size:100%;block-size:100%;box-sizing:border-box;border-radius:var(--luzmo-swatch-border-radius, var(--swatch-border-radius));justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.fill:before{content:"";z-index:0;box-sizing:border-box;box-shadow:inset 0 0 0 var(--luzmo-swatch-border-thickness, var(--swatch-border-thickness)) var(--highcontrast-swatch-border-color, var(--luzmo-swatch-border-color, var(--swatch-border-color)));border-radius:var(--luzmo-swatch-border-radius, var(--swatch-border-radius));position:absolute;top:0;right:0;bottom:0;left:0}:host([border=none]) .fill:before,.fill:before{background-color:initial;background-color:var(--picked-color, transparent)}:host([border=none]) .fill:before{box-shadow:none}.mixed-value-icon{pointer-events:none;color:#0000;color:var(--picked-color, transparent);display:none}.disabled-icon{z-index:1;pointer-events:none;color:var(--highcontrast-swatch-disabled-icon-color, var(--luzmo-swatch-disabled-icon-color, var(--swatch-disabled-icon-color)));stroke:var(--highcontrast-swatch-disabled-icon-color, var(--luzmo-swatch-disabled-icon-color, var(--swatch-disabled-icon-color)));display:none;position:relative}.disabled-icon path:first-child{fill:var(--highcontrast-swatch-disabled-icon-color, var(--luzmo-swatch-disabled-icon-color, var(--swatch-disabled-icon-color)))}.disabled-icon path:last-child{fill:var(--luzmo-swatch-icon-border-color, var(--swatch-icon-border-color))}:host([shape=rectangle]){inline-size:calc(var(--luzmo-swatch-size, var(--swatch-size)) * 2)}:host([rounding=none]),:host([rounding=none]) .fill,:host([rounding=none]) .fill:before,:host([rounding=none][selected]) .fill,:host([rounding=none][selected]) .fill:before,:host([rounding=none]):after,:host([rounding=none]):before{border-radius:0}:host([rounding=full][selected]:not([shape=rectangle])) .fill,:host([rounding=full][selected]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])),:host([rounding=full]:not([shape=rectangle])) .fill,:host([rounding=full]:not([shape=rectangle])) .fill:before,:host([rounding=full]:not([shape=rectangle])):after,:host([rounding=full]:not([shape=rectangle])):before{border-radius:100%}:host([selected]) .fill{width:calc(var(--luzmo-swatch-size, var(--swatch-size)) - 2 * var(--luzmo-swatch-border-thickness-selected, var(--swatch-border-thickness-selected)) + -2 * var(--luzmo-swatch-focus-indicator-gap, var(--swatch-focus-indicator-gap)));height:calc(var(--luzmo-swatch-size, var(--swatch-size)) - 2 * var(--luzmo-swatch-border-thickness-selected, var(--swatch-border-thickness-selected)) + -2 * var(--luzmo-swatch-focus-indicator-gap, var(--swatch-focus-indicator-gap)))}:host([selected][shape=rectangle]) .fill{width:calc(var(--luzmo-swatch-size, var(--swatch-size)) * 2 - 2 * var(--luzmo-swatch-border-thickness-selected, var(--swatch-border-thickness-selected)) + -2 * var(--luzmo-swatch-focus-indicator-gap, var(--swatch-focus-indicator-gap)))}::slotted([slot=image]){object-fit:contain;inline-size:100%;block-size:100%;transition:width var(--luzmo-animation-duration) ease-in-out,height var(--luzmo-animation-duration) ease-in-out}:host([size=xl]){--swatch-size: var(--luzmo-component-height-xl);--swatch-disabled-icon-size: 24px;--swatch-slash-thickness: 6px}:host([size=l]){--swatch-size: var(--luzmo-component-height-l);--swatch-disabled-icon-size: 20px;--swatch-slash-thickness: 5px}:host([size=s]){--swatch-size: var(--luzmo-component-height-s);--swatch-disabled-icon-size: 16px;--swatch-slash-thickness: 3px}:host([size=xs]){--swatch-size: var(--luzmo-component-height-xs);--swatch-disabled-icon-size: 16px;--swatch-slash-thickness: 2px}:host([size=xxs]){--swatch-size: var(--luzmo-component-height-xxs);--swatch-disabled-icon-size: 14px;--swatch-slash-thickness: 2px}:host{--swatch-size: var(--luzmo-component-height);--swatch-disabled-icon-size: 18px;--swatch-slash-thickness: 4px}:host{--swatch-border-radius: var(--luzmo-border-radius-s);--swatch-focus-indicator-border-radius: var(--luzmo-border-radius-s);--swatch-border-thickness: var(--luzmo-border-width);--swatch-border-thickness-selected: var(--luzmo-border-width);--swatch-focus-indicator-width: var(--luzmo-indicator-width);--swatch-focus-indicator-gap: var(--luzmo-indicator-gap);--swatch-border-color: var(--luzmo-border-color-down);--swatch-icon-border-color: var(--luzmo-border-color);--swatch-border-color-selected: var(--luzmo-border-color-full-down);--swatch-inner-border-color-selected: var(--luzmo-background-color);--swatch-disabled-icon-color: rgb(255, 255, 255);--swatch-dash-icon-color: var(--luzmo-font-color);--swatch-slash-icon-color: var(--luzmo-color-negative);--swatch-focus-indicator-color: var(--luzmo-primary)}.fill:before{background:var(--picked-color, transparent)}:host([border=none]) .fill:before{background:var(--picked-color, transparent)}:host .is-image .fill:before{background:#0000}:host .opacity-checkerboard{background:repeating-conic-gradient(var(--luzmo-swatch-checkerboard-light, rgb(255, 255, 255)) 0 25%,var(--luzmo-swatch-checkerboard-dark, rgb(230, 230, 230)) 0 50%) var(--luzmo-swatch-checkerboard-position, left top)/calc(var(--luzmo-swatch-checkerboard-size, 8px) * 2) calc(var(--luzmo-swatch-checkerboard-size, 8px) * 2)}';
|
|
1860
|
+
var ve = Object.defineProperty, xe = Object.getOwnPropertyDescriptor, E = (r, o, e, t) => {
|
|
1861
|
+
for (var l = t > 1 ? void 0 : t ? xe(o, e) : o, i = r.length - 1, a; i >= 0; i--)
|
|
1862
1862
|
(a = r[i]) && (l = (t ? a(o, e, l) : a(l)) || l);
|
|
1863
|
-
return t && l &&
|
|
1863
|
+
return t && l && ve(o, e, l), l;
|
|
1864
1864
|
};
|
|
1865
1865
|
let $ = class extends X(uo, {
|
|
1866
1866
|
validSizes: ["xxs", "xs", "s", "m", "l", "xl"],
|
|
@@ -1884,10 +1884,10 @@ let $ = class extends X(uo, {
|
|
|
1884
1884
|
fill="var(--swatch-disabled-icon-stroke-color)"
|
|
1885
1885
|
/>
|
|
1886
1886
|
</svg>
|
|
1887
|
-
`, this.renderMixedValue = () => J(
|
|
1887
|
+
`, this.renderMixedValue = () => J(_o);
|
|
1888
1888
|
}
|
|
1889
1889
|
static get styles() {
|
|
1890
|
-
return [R(
|
|
1890
|
+
return [R(fe)];
|
|
1891
1891
|
}
|
|
1892
1892
|
get value() {
|
|
1893
1893
|
return this._value || this.color || this.label;
|
|
@@ -1944,7 +1944,7 @@ let $ = class extends X(uo, {
|
|
|
1944
1944
|
return m`
|
|
1945
1945
|
<div
|
|
1946
1946
|
class="opacity-checkerboard fill"
|
|
1947
|
-
style=${
|
|
1947
|
+
style=${U(
|
|
1948
1948
|
this.color ? `--picked-color: ${this.color}` : void 0
|
|
1949
1949
|
)}
|
|
1950
1950
|
>
|
|
@@ -1999,18 +1999,18 @@ E([
|
|
|
1999
1999
|
E([
|
|
2000
2000
|
s()
|
|
2001
2001
|
], $.prototype, "value", 1);
|
|
2002
|
-
const
|
|
2003
|
-
var
|
|
2004
|
-
for (var l = t > 1 ? void 0 : t ?
|
|
2002
|
+
const ye = ":host{justify-content:flex-start;align-items:flex-start;gap:var(--luzmo-swatch-group-spacing-regular, var(--swatch-group-spacing-regular));flex-flow:wrap;display:inline-flex}:host([density=compact]){gap:var(--luzmo-swatch-group-spacing-compact, var(--swatch-group-spacing-compact))}:host([density=spacious]){gap:var(--luzmo-swatch-group-spacing-spacious, var(--swatch-group-spacing-spacious))}:host{--swatch-group-spacing-compact: 2px;--swatch-group-spacing-regular: 4px;--swatch-group-spacing-spacious: 8px}";
|
|
2003
|
+
var we = Object.defineProperty, ke = Object.getOwnPropertyDescriptor, I = (r, o, e, t) => {
|
|
2004
|
+
for (var l = t > 1 ? void 0 : t ? ke(o, e) : o, i = r.length - 1, a; i >= 0; i--)
|
|
2005
2005
|
(a = r[i]) && (l = (t ? a(o, e, l) : a(l)) || l);
|
|
2006
|
-
return t && l &&
|
|
2006
|
+
return t && l && we(o, e, l), l;
|
|
2007
2007
|
};
|
|
2008
2008
|
class T extends X(O, {
|
|
2009
2009
|
validSizes: ["xs", "s", "m", "l"],
|
|
2010
2010
|
noDefaultSize: !0
|
|
2011
2011
|
}) {
|
|
2012
2012
|
constructor() {
|
|
2013
|
-
super(), this._selected = [], this.selectedSet = /* @__PURE__ */ new Set(), this.rovingTabindexController = new
|
|
2013
|
+
super(), this._selected = [], this.selectedSet = /* @__PURE__ */ new Set(), this.rovingTabindexController = new Uo(this, {
|
|
2014
2014
|
focusInIndex: (o) => {
|
|
2015
2015
|
let e = -1;
|
|
2016
2016
|
const t = o.findIndex((l, i) => (!o[e] && !l.disabled && (e = i), l.selected && !l.disabled));
|
|
@@ -2025,7 +2025,7 @@ class T extends X(O, {
|
|
|
2025
2025
|
}), this.selectedSet.forEach((e) => {
|
|
2026
2026
|
o.has(e) || this.selectedSet.delete(e);
|
|
2027
2027
|
}), this._selected = [...this.selectedSet], this.rovingTabindexController.clearElementCache();
|
|
2028
|
-
}, new
|
|
2028
|
+
}, new No(this, {
|
|
2029
2029
|
config: {
|
|
2030
2030
|
attributes: !0,
|
|
2031
2031
|
childList: !0,
|
|
@@ -2037,7 +2037,7 @@ class T extends X(O, {
|
|
|
2037
2037
|
});
|
|
2038
2038
|
}
|
|
2039
2039
|
static get styles() {
|
|
2040
|
-
return [R(
|
|
2040
|
+
return [R(ye)];
|
|
2041
2041
|
}
|
|
2042
2042
|
get selected() {
|
|
2043
2043
|
return this._selected;
|
|
@@ -2136,26 +2136,26 @@ class T extends X(O, {
|
|
|
2136
2136
|
);
|
|
2137
2137
|
}
|
|
2138
2138
|
}
|
|
2139
|
-
|
|
2139
|
+
I([
|
|
2140
2140
|
s({ reflect: !0 })
|
|
2141
2141
|
], T.prototype, "border", 2);
|
|
2142
|
-
|
|
2142
|
+
I([
|
|
2143
2143
|
s({ reflect: !0 })
|
|
2144
2144
|
], T.prototype, "density", 2);
|
|
2145
|
-
|
|
2145
|
+
I([
|
|
2146
2146
|
s({ reflect: !0 })
|
|
2147
2147
|
], T.prototype, "rounding", 2);
|
|
2148
|
-
|
|
2148
|
+
I([
|
|
2149
2149
|
s({ type: Array })
|
|
2150
2150
|
], T.prototype, "selected", 1);
|
|
2151
|
-
|
|
2151
|
+
I([
|
|
2152
2152
|
s()
|
|
2153
2153
|
], T.prototype, "selects", 2);
|
|
2154
|
-
|
|
2154
|
+
I([
|
|
2155
2155
|
s({ reflect: !0 })
|
|
2156
2156
|
], T.prototype, "shape", 2);
|
|
2157
|
-
|
|
2158
|
-
|
|
2157
|
+
I([
|
|
2158
|
+
To({ flatten: !0 })
|
|
2159
2159
|
], T.prototype, "swatches", 2);
|
|
2160
2160
|
customElements.get("luzmo-swatch") || customElements.define("luzmo-swatch", $);
|
|
2161
2161
|
customElements.get("luzmo-swatch-group") || customElements.define("luzmo-swatch-group", T);
|
|
@@ -2176,18 +2176,18 @@ customElements.get("luzmo-swatch-group") || customElements.define("luzmo-swatch-
|
|
|
2176
2176
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
2177
2177
|
* SOFTWARE.
|
|
2178
2178
|
* */
|
|
2179
|
-
const
|
|
2179
|
+
const Ce = () => {
|
|
2180
2180
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
2181
2181
|
const r = document.createElement("style");
|
|
2182
2182
|
r.setAttribute("data-luzmo-vars", ""), r.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-color-negative: #ca221c;--luzmo-color-negative-hover: #b3241f;--luzmo-color-negative-down: #9f231f;--luzmo-color-negative-focus: #b3241f;--luzmo-color-negative-rgb: 202, 34, 28;--luzmo-color-positive: rgb(20, 150, 101);--luzmo-color-positive-hover: rgb(17, 128, 86);--luzmo-color-positive-down: rgb(16, 105, 71);--luzmo-color-positive-focus: rgb(17, 128, 86);--luzmo-color-positive-rgb: 20, 150, 101;--luzmo-color-selected: rgb(110, 110, 110);--luzmo-color-selected-hover: rgb(70, 70, 70);--luzmo-color-selected-down: rgb(40, 40, 40);--luzmo-color-selected-focus: rgb(70, 70, 70);--luzmo-color-selected-hard: #1e1e1e;--luzmo-color-selected-hard-hover: rgb(0, 0, 0);--luzmo-color-selected-hard-down: rgb(0, 0, 0);--luzmo-color-selected-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(r);
|
|
2183
2183
|
}
|
|
2184
2184
|
};
|
|
2185
|
-
|
|
2186
|
-
const
|
|
2187
|
-
var
|
|
2185
|
+
Ce();
|
|
2186
|
+
const $e = '@charset "UTF-8";:host{width:var(--luzmo-color-menu-width, var(--color-menu-width))}.hue-opacity-text-swatches-container{display:flex;gap:var(--luzmo-color-menu-color-controls-vertical-gap, var(--color-menu-color-controls-vertical-gap));flex-direction:column;padding:var(--luzmo-color-menu-hue-opacity-text-swatches-vertical-padding, var(--color-menu-hue-opacity-text-swatches-vertical-padding)) var(--luzmo-color-menu-hue-opacity-text-swatches-horizontal-padding, var(--color-menu-hue-opacity-text-swatches-horizontal-padding))}.swatch-sliders-container{display:flex;gap:var(--luzmo-color-menu-swatch-to-sliders-space, var(--color-menu-swatch-to-sliders-space))}.swatch-example-container{display:flex;align-items:center}.field-container{display:flex;align-items:center;gap:var(--luzmo-color-menu-format-field-to-format-space, var(--color-menu-format-field-to-format-space))}.format-container{text-transform:uppercase;position:relative;background:none;border:none;outline:none;height:var(--luzmo-color-menu-format-height, var(--color-menu-format-height));cursor:pointer;font-size:var(--luzmo-color-menu-format-font-size, var(--color-menu-format-font-size));display:flex;align-items:center;color:var(--luzmo-color-menu-format-font-color, var(--color-menu-format-font-color));gap:var(--luzmo-color-menu-format-name-to-icon, var(--color-menu-format-name-to-icon-space));padding:0 var(--luzmo-color-menu-format-horizontal-padding, var(--color-menu-format-horizontal-padding))}.format-container:hover{color:var(--luzmo-color-menu-format-font-color-hover, var(--color-menu-format-font-color-hover))}.format-container:focus-visible{outline:none}.format-container:focus-visible:after{content:"";width:100%;height:100%;position:absolute;box-sizing:border-box;left:0;top:0;border:var(--luzmo-color-menu-format-indicator-width, var(--luzmo-indicator-width)) solid var(--luzmo-color-menu-format-indicator-color, var(--luzmo-indicator-color));border-radius:var(--luzmo-color-menu-format-label-indicator-border-radius, var(--luzmo-border-radius-s))}.format-container:focus-visible,.format-container:active{color:var(--luzmo-color-menu-format-font-color-down, var(--color-menu-format-font-color-down))}.format-container .format-label{-webkit-user-select:none;user-select:none}.format-container .angle-icon{display:flex;align-items:center;height:calc(var(--color-menu-format-font-size) / 1.5)}.slider-container{display:flex;flex-direction:column;justify-content:center;gap:var(--luzmo-color-menu-slider-gap, var(--color-menu-slider-gap))}luzmo-color-area{width:100%;height:var(--luzmo-color-menu-height, var(--color-menu-height))}luzmo-color-slider{width:100%}luzmo-divider{margin:var(--luzmo-spacing-5) à}.swatches-container{display:grid;grid-template-columns:repeat(6,1fr);gap:var(--luzmo-color-menu-swatches-gap, var(--color-menu-swatches-gap))}.swatches-container luzmo-swatch{cursor:pointer}.swatches-container .swatch-choice{display:flex;align-items:center;justify-content:center}:host{--luzmo-text-field-icon-size-valid: 0px;--luzmo-text-field-icon-spacing-inline-end-valid: 1px;--luzmo-text-field-text-align: center}:host{--color-menu-width: 290px;--luzmo-text-field-width: 220px;--luzmo-color-slider-control-track-width: 8px;--color-menu-height: 140px;--color-menu-hue-opacity-text-swatches-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-hue-opacity-text-swatches-vertical-padding: var( --luzmo-spacing-5 );--color-menu-color-controls-vertical-gap: var(--luzmo-spacing-5);--color-menu-swatch-to-sliders-space: var(--luzmo-spacing-5);--color-menu-slider-gap: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-format-height: var(--luzmo-component-height);--color-menu-format-font-size: var(--luzmo-font-size-s);--color-menu-format-name-to-icon-space: var(--luzmo-spacing-2);--color-menu-format-field-to-format-space: var(--luzmo-spacing-2);--color-menu-format-horizontal-padding: var(--luzmo-spacing-3);--color-menu-format-font-color: var(--luzmo-font-color);--color-menu-format-font-color-hover: var(--luzmo-font-color-hover);--color-menu-format-font-color-down: var(--luzmo-font-color-down);--color-menu-swatches-gap: var(--luzmo-spacing-4)}:host .swatches-container{--luzmo-swatch-size: 22px}:host([size=s]){--color-menu-width: 260px;--luzmo-text-field-width: 200px;--luzmo-color-slider-control-track-width: 8px;--color-menu-hue-opacity-text-swatches-horizontal-padding: var( --luzmo-spacing-5 );--color-menu-hue-opacity-text-swatches-vertical-padding: var( --luzmo-spacing-4 );--color-menu-color-controls-vertical-gap: var(--luzmo-spacing-4);--color-menu-swatch-to-sliders-space: var(--luzmo-spacing-4);--color-menu-slider-gap: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-format-height: var(--luzmo-component-height-s);--color-menu-format-font-size: var(--luzmo-font-size-xs);--color-menu-format-name-to-icon-space: var(--luzmo-spacing-2);--color-menu-format-field-to-format-space: var(--luzmo-spacing-2);--color-menu-format-horizontal-padding: var(--luzmo-spacing-2);--color-menu-swatches-gap: var(--luzmo-spacing-3)}:host([size=s]) .swatches-container{--luzmo-swatch-size: 20px}:host([size=l]){--color-menu-width: 350px;--luzmo-text-field-width: 240px;--luzmo-color-slider-control-track-width: 16px;--color-menu-hue-opacity-text-swatches-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-2) );--color-menu-hue-opacity-text-swatches-vertical-padding: var( --luzmo-spacing-5 );--color-menu-color-controls-vertical-gap: var(--luzmo-spacing-5);--color-menu-swatch-to-sliders-space: var(--luzmo-spacing-5);--color-menu-slider-gap: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-2) );--color-menu-format-height: var(--luzmo-component-height-l);--color-menu-format-font-size: var(--luzmo-font-size);--color-menu-format-name-to-icon-space: var(--luzmo-spacing-3);--color-menu-format-field-to-format-space: var(--luzmo-spacing-2);--color-menu-format-horizontal-padding: var(--luzmo-spacing-4);--color-menu-swatches-gap: var(--luzmo-spacing-4)}:host([size=l]) .swatches-container{--luzmo-swatch-size: 24px}:host([size=l]) .swatch-example-container{--luzmo-swatch-size: 56px}:host([size=xl]){--color-menu-width: 380px;--luzmo-text-field-width: 280px;--luzmo-color-slider-control-track-width: 16px;--color-menu-hue-opacity-text-swatches-horizontal-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-2) );--color-menu-hue-opacity-text-swatches-vertical-padding: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-color-controls-vertical-gap: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-swatch-to-sliders-space: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-slider-gap: calc( var(--luzmo-spacing-5) + var(--luzmo-spacing-1) );--color-menu-format-height: var(--luzmo-component-height-xl);--color-menu-format-font-size: var(--luzmo-font-size-l);--color-menu-format-name-to-icon-space: var(--luzmo-spacing-3);--color-menu-format-field-to-format-space: var(--luzmo-spacing-3);--color-menu-format-horizontal-padding: var(--luzmo-spacing-4);--color-menu-swatches-gap: var(--luzmo-spacing-4)}:host([size=xl]) .swatches-container{--luzmo-swatch-size: 26px}:host([size=xl]) .swatch-example-container{--luzmo-swatch-size: 64px}';
|
|
2187
|
+
var Se = Object.defineProperty, M = (r, o, e, t) => {
|
|
2188
2188
|
for (var l = void 0, i = r.length - 1, a; i >= 0; i--)
|
|
2189
2189
|
(a = r[i]) && (l = a(o, e, l) || l);
|
|
2190
|
-
return l &&
|
|
2190
|
+
return l && Se(o, e, l), l;
|
|
2191
2191
|
};
|
|
2192
2192
|
const wo = class extends X(O) {
|
|
2193
2193
|
constructor() {
|
|
@@ -2288,8 +2288,8 @@ const wo = class extends X(O) {
|
|
|
2288
2288
|
>
|
|
2289
2289
|
<div class="format-label">${this._format}</div>
|
|
2290
2290
|
<div class="change-format-icon">
|
|
2291
|
-
<div class="angle-icon">${J(_o)}</div>
|
|
2292
2291
|
<div class="angle-icon">${J(Ao)}</div>
|
|
2292
|
+
<div class="angle-icon">${J(Mo)}</div>
|
|
2293
2293
|
</div>
|
|
2294
2294
|
</button>
|
|
2295
2295
|
</div>
|
|
@@ -2316,7 +2316,7 @@ const wo = class extends X(O) {
|
|
|
2316
2316
|
`;
|
|
2317
2317
|
}
|
|
2318
2318
|
};
|
|
2319
|
-
wo.styles = R(
|
|
2319
|
+
wo.styles = R($e);
|
|
2320
2320
|
let A = wo;
|
|
2321
2321
|
M([
|
|
2322
2322
|
s({ type: String, reflect: !0 })
|
|
@@ -2363,18 +2363,18 @@ customElements.get("luzmo-color-menu") || customElements.define("luzmo-color-men
|
|
|
2363
2363
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
2364
2364
|
* SOFTWARE.
|
|
2365
2365
|
* */
|
|
2366
|
-
const
|
|
2366
|
+
const Ee = () => {
|
|
2367
2367
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
2368
2368
|
const r = document.createElement("style");
|
|
2369
2369
|
r.setAttribute("data-luzmo-vars", ""), r.textContent = 'html{--luzmo-animation-duration: 0.15s;--luzmo-border-color: rgba(var(--luzmo-border-color-rgb), 0.1);--luzmo-border-color-hover: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-down: rgba(var(--luzmo-border-color-rgb), 0.3);--luzmo-border-color-focus: rgba(var(--luzmo-border-color-rgb), 0.15);--luzmo-border-color-rgb: 0, 0, 0;--luzmo-border-color-full: rgb(180, 180, 180);--luzmo-border-color-full-hover: rgb(140, 140, 140);--luzmo-border-color-full-down: rgb(110, 110, 110);--luzmo-border-color-full-focus: rgb(140, 140, 140);--luzmo-border-color-disabled: #dddddd;--luzmo-border-radius: 6px;--luzmo-border-radius-s: 4px;--luzmo-border-radius-l: 8px;--luzmo-border-radius-xl: 12px;--luzmo-border-radius-full: 999rem;--luzmo-background-color: #ffffff;--luzmo-background-color-rgb: 255, 255, 255;--luzmo-background-color-disabled: #eeeeee;--luzmo-background-color-hover: #f0f0fc;--luzmo-background-color-down: #f1f1ff;--luzmo-background-color-focus: #f0f0fc;--luzmo-background-color-highlight: rgb(240, 240, 240);--luzmo-background-color-highlight-disabled: rgb(245, 245, 245);--luzmo-background-color-highlight-hover: rgb(225, 225, 225);--luzmo-background-color-highlight-down: rgb(215, 215, 215);--luzmo-background-color-highlight-focus: rgb(225, 225, 225);--luzmo-border-width: 1px;--luzmo-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", Helvetica, Arial, sans-serif;--luzmo-font-size-xs: 10px;--luzmo-font-size-s: 12px;--luzmo-font-size-m: 14px;--luzmo-font-size: 14px;--luzmo-font-size-l: 16px;--luzmo-font-size-xl: 18px;--luzmo-font-size-xxl: 20px;--luzmo-font-style: normal;--luzmo-line-height: normal;--luzmo-font-weight: 400;--luzmo-font-weight-semibold: 500;--luzmo-font-weight-bold: 600;--luzmo-font-color: #333;--luzmo-font-color-hard: #000;--luzmo-font-color-disabled: var(--luzmo-color-disabled);--luzmo-font-color-extra-dimmed: #888;--luzmo-font-color-hover: #333;--luzmo-font-color-down: #111;--luzmo-font-color-focus: #333;--luzmo-primary: #4434ff;--luzmo-primary-hover: #4234e4;--luzmo-primary-down: #392cc7;--luzmo-primary-focus: #4234e4;--luzmo-primary-inverse-color: #ffffff;--luzmo-primary-rgb: 68, 52, 255;--luzmo-secondary: #ff00ff;--luzmo-secondary-hover: #e309e3;--luzmo-secondary-down: #c711c7;--luzmo-secondary-focus: #e309e3;--luzmo-secondary-inverse-color: #ffffff;--luzmo-secondary-rgb: 255, 0, 255;--luzmo-color-negative: #ca221c;--luzmo-color-negative-hover: #b3241f;--luzmo-color-negative-down: #9f231f;--luzmo-color-negative-focus: #b3241f;--luzmo-color-negative-rgb: 202, 34, 28;--luzmo-color-positive: rgb(20, 150, 101);--luzmo-color-positive-hover: rgb(17, 128, 86);--luzmo-color-positive-down: rgb(16, 105, 71);--luzmo-color-positive-focus: rgb(17, 128, 86);--luzmo-color-positive-rgb: 20, 150, 101;--luzmo-color-selected: rgb(110, 110, 110);--luzmo-color-selected-hover: rgb(70, 70, 70);--luzmo-color-selected-down: rgb(40, 40, 40);--luzmo-color-selected-focus: rgb(70, 70, 70);--luzmo-color-selected-hard: #1e1e1e;--luzmo-color-selected-hard-hover: rgb(0, 0, 0);--luzmo-color-selected-hard-down: rgb(0, 0, 0);--luzmo-color-selected-hard-focus: rgb(0, 0, 0);--luzmo-color-informative: #1a77e9;--luzmo-color-informative-rgb: 26, 119, 233;--luzmo-color-disabled: #aaaaaa;--luzmo-spacing-1: 2px;--luzmo-spacing-2: 4px;--luzmo-spacing-3: 8px;--luzmo-spacing-4: 12px;--luzmo-spacing-5: 16px;--luzmo-indicator-gap: 2px;--luzmo-indicator-width: 1px;--luzmo-indicator-color: var(--luzmo-primary);--luzmo-component-height-xxs: 20px;--luzmo-component-height-xs: 24px;--luzmo-component-height-s: 28px;--luzmo-component-height: 32px;--luzmo-component-height-l: 40px;--luzmo-component-height-xl: 48px;--luzmo-component-height-xxl: 64px;--luzmo-icon-size-xxs: 12px;--luzmo-icon-size-xs: 14px;--luzmo-icon-size-s: 16px;--luzmo-icon-size-m: 18px;--luzmo-icon-size-l: 20px;--luzmo-icon-size-xl: 22px;--luzmo-icon-size-xxl: 32px}', document.head.appendChild(r);
|
|
2370
2370
|
}
|
|
2371
2371
|
};
|
|
2372
|
-
|
|
2373
|
-
const
|
|
2374
|
-
var
|
|
2372
|
+
Ee();
|
|
2373
|
+
const _e = "luzmo-popover{margin-left:var(--luzmo-color-picker-popover-horizontal-gap, var(--color-picker-popover-horizontal-gap));margin-right:var(--luzmo-color-picker-popover-horizontal-gap, var(--color-picker-popover-horizontal-gap))}luzmo-swatch{cursor:pointer}:host{--luzmo-popover-content-area-spacing-vertical: 0;--color-picker-popover-horizontal-gap: var(--luzmo-spacing-4)}:host([size=s]){--color-picker-popover-horizontal-gap: var(--luzmo-spacing-3)}:host([size=l]),:host([size=xl]){--color-picker-popover-horizontal-gap: var(--luzmo-spacing-5)}";
|
|
2374
|
+
var Ae = Object.defineProperty, _ = (r, o, e, t) => {
|
|
2375
2375
|
for (var l = void 0, i = r.length - 1, a; i >= 0; i--)
|
|
2376
2376
|
(a = r[i]) && (l = a(o, e, l) || l);
|
|
2377
|
-
return l &&
|
|
2377
|
+
return l && Ae(o, e, l), l;
|
|
2378
2378
|
};
|
|
2379
2379
|
const ko = class extends X(O) {
|
|
2380
2380
|
constructor() {
|
|
@@ -2396,7 +2396,7 @@ const ko = class extends X(O) {
|
|
|
2396
2396
|
}
|
|
2397
2397
|
firstUpdated() {
|
|
2398
2398
|
this.overlayElement.addEventListener("slottable-request", (o) => {
|
|
2399
|
-
this._renderMenu = o.data !==
|
|
2399
|
+
this._renderMenu = o.data !== Bo;
|
|
2400
2400
|
});
|
|
2401
2401
|
}
|
|
2402
2402
|
updated(o) {
|
|
@@ -2439,7 +2439,7 @@ const ko = class extends X(O) {
|
|
|
2439
2439
|
`;
|
|
2440
2440
|
}
|
|
2441
2441
|
};
|
|
2442
|
-
ko.styles = R(
|
|
2442
|
+
ko.styles = R(_e);
|
|
2443
2443
|
let S = ko;
|
|
2444
2444
|
_([
|
|
2445
2445
|
s({ type: String, reflect: !0 })
|
|
@@ -2475,12 +2475,12 @@ _([
|
|
|
2475
2475
|
ho()
|
|
2476
2476
|
], S.prototype, "_renderMenu");
|
|
2477
2477
|
customElements.get("luzmo-color-picker") || customElements.define("luzmo-color-picker", S);
|
|
2478
|
-
var
|
|
2478
|
+
var Me = Object.defineProperty, H = (r, o, e, t) => {
|
|
2479
2479
|
for (var l = void 0, i = r.length - 1, a; i >= 0; i--)
|
|
2480
2480
|
(a = r[i]) && (l = a(o, e, l) || l);
|
|
2481
|
-
return l &&
|
|
2481
|
+
return l && Me(o, e, l), l;
|
|
2482
2482
|
};
|
|
2483
|
-
const L = class L extends
|
|
2483
|
+
const L = class L extends Oo {
|
|
2484
2484
|
constructor() {
|
|
2485
2485
|
super(...arguments), this.value = "transparent", this.disabled = !1, this.noAlphaChannel = !1, this.swatches = [], this.rounding = "full", this.shape = "circle", this.placement = "left-start", this.debounce = 50;
|
|
2486
2486
|
}
|
|
@@ -2499,7 +2499,7 @@ const L = class L extends Uo {
|
|
|
2499
2499
|
}, this.debounce ?? 200);
|
|
2500
2500
|
}
|
|
2501
2501
|
renderController() {
|
|
2502
|
-
return
|
|
2502
|
+
return Eo`
|
|
2503
2503
|
<luzmo-color-picker
|
|
2504
2504
|
.color=${this.value}
|
|
2505
2505
|
.size=${this.size}
|
|
@@ -2542,7 +2542,7 @@ H([
|
|
|
2542
2542
|
F({ type: Number, reflect: !0 })
|
|
2543
2543
|
], k.prototype, "debounce");
|
|
2544
2544
|
H([
|
|
2545
|
-
|
|
2545
|
+
Io("luzmo-color-picker")
|
|
2546
2546
|
], k.prototype, "colorPicker");
|
|
2547
2547
|
customElements.get("luzmo-edit-option-color-picker") || customElements.define(
|
|
2548
2548
|
"luzmo-edit-option-color-picker",
|