@luzmo/lucero 0.0.10 → 0.0.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/components/accordion/index.cjs +5 -5
- package/components/accordion/index.js +9 -10
- package/components/action-bar/index.cjs +4 -4
- package/components/action-bar/index.js +10 -10
- package/components/action-button/index.cjs +2 -2
- package/components/action-button/index.js +4 -4
- package/components/action-group/index.cjs +1 -1
- package/components/action-group/index.js +1 -1
- package/components/action-group-B59CWNnT.cjs +20 -0
- package/components/{action-group-Bf28z235.js → action-group-DzT5e9uS.js} +8 -9
- package/components/action-menu/index.cjs +9 -9
- package/components/action-menu/index.js +8 -9
- package/components/avatar/index.cjs +3 -3
- package/components/avatar/index.js +6 -7
- package/components/base-CCsOyfm4.js +632 -0
- package/components/base-CaRKlVkL.cjs +36 -0
- package/components/button/index.cjs +2 -2
- package/components/button/index.js +7 -7
- package/components/{button-base-CDLQV7Vk.js → button-base-BUylwU1F.js} +5 -6
- package/components/button-base-D62oiPcu.cjs +25 -0
- package/components/button-group/index.cjs +1 -1
- package/components/button-group/index.js +6 -6
- package/components/checkbox/index.cjs +4 -4
- package/components/checkbox/index.js +4 -4
- package/components/{checkbox-mixin-DXUIwtea.js → checkbox-mixin-CM4VUJxF.js} +9 -10
- package/components/{checkbox-mixin-DaXMsrtV.cjs → checkbox-mixin-CifGmiLR.cjs} +3 -3
- package/components/{clear-button-Dh2Mq0cc.js → clear-button-BmUyRVoz.js} +4 -4
- package/components/clear-button-Cc5-XUOJ.cjs +18 -0
- package/components/{close-button-BsYkXOVh.js → close-button-BekXo6bQ.js} +10 -10
- package/components/close-button-Bf8yzpLd.cjs +18 -0
- package/components/color-area/index.cjs +6 -6
- package/components/color-area/index.js +10 -11
- package/components/color-field/index.cjs +2 -2
- package/components/color-field/index.js +3 -3
- package/components/color-handle/index.cjs +2 -2
- package/components/color-handle/index.js +6 -6
- package/components/color-loupe/index.cjs +1 -1
- package/components/color-loupe/index.js +1 -1
- package/components/color-loupe-CLzp2MiI.cjs +56 -0
- package/components/{color-loupe-BCfIVFkB.js → color-loupe-DiegGLZu.js} +4 -4
- package/components/color-menu/index.cjs +5 -5
- package/components/color-menu/index.js +5 -7
- package/components/color-picker/index.cjs +4 -4
- package/components/color-picker/index.js +11 -13
- package/components/color-slider/index.cjs +7 -7
- package/components/color-slider/index.js +6 -7
- package/components/divider/index.cjs +1 -1
- package/components/divider/index.js +6 -6
- package/components/field-group/index.cjs +1 -1
- package/components/field-group/index.js +1 -1
- package/components/{field-group-CwZULltm.js → field-group-BPZvGJi1.js} +6 -6
- package/components/field-group-CodR_26L.cjs +23 -0
- package/components/field-label/index.cjs +1 -1
- package/components/field-label/index.js +1 -1
- package/components/{field-label-C3HFlH91.js → field-label-6AaW05kA.js} +7 -8
- package/components/field-label-B91K6moC.cjs +25 -0
- package/components/focusable-BFdecx5l.cjs +18 -0
- package/components/{focusable-zT9NFFYs.js → focusable-CxA_NMK_.js} +2 -1
- package/components/icon/index.cjs +1 -1
- package/components/icon/index.js +6 -6
- package/components/index-Cg_y7WKM.cjs +77 -0
- package/components/{index-C2qG2Sm8.js → index-QeYYAZQR.js} +15 -18
- package/components/index.cjs +1 -1
- package/components/index.js +16 -16
- package/components/infield-button/index.cjs +2 -2
- package/components/infield-button/index.js +4 -4
- package/components/label/index.cjs +1 -1
- package/components/label/index.js +5 -5
- package/components/{like-anchor-DoJWh4Uu.js → like-anchor-D7tY6am5.js} +21 -21
- package/components/like-anchor-b3cNzw52.cjs +32 -0
- package/components/{manage-help-text-BzWK2v8i.js → manage-help-text-CmE_nfjl.js} +8 -8
- package/components/{manage-help-text-BKlmmlgp.cjs → manage-help-text-CoX77cTJ.cjs} +3 -3
- package/components/menu/index.cjs +1 -1
- package/components/menu/index.js +1 -1
- package/components/multi-language-field/index.cjs +2 -2
- package/components/multi-language-field/index.js +7 -7
- package/components/number-field/index.cjs +4 -4
- package/components/number-field/index.js +16 -17
- package/components/observe-slot-text-ByPG1Lqw.cjs +18 -0
- package/components/{observe-slot-text-BG0H7bQK.js → observe-slot-text-CugmOzNZ.js} +20 -21
- package/components/overlay/index.cjs +7 -7
- package/components/overlay/index.js +45 -49
- package/components/overlay-BWBJGJN_.cjs +47 -0
- package/components/{overlay-D7EbnA6E.js → overlay-CtdbWiFs.js} +71 -74
- package/components/{pending-state-DHXuiejX.js → pending-state-B_JeaE62.js} +2 -2
- package/components/{pending-state-BHCOneQ7.cjs → pending-state-DWvTsSoS.cjs} +2 -2
- package/components/picker/index.cjs +1 -1
- package/components/picker/index.js +2 -2
- package/components/picker-CaC1rQOK.cjs +123 -0
- package/components/{picker-ChtCbFLB.js → picker-DwbcFve2.js} +109 -140
- package/components/popover/index.cjs +1 -1
- package/components/popover/index.js +1 -1
- package/components/popover-C4w3aY8m.cjs +30 -0
- package/components/{popover-bg0EQQ8p.js → popover-DLFHilGS.js} +6 -7
- package/components/progress-circle/index.cjs +1 -1
- package/components/progress-circle/index.js +1 -1
- package/components/progress-circle-BXyXtMcs.cjs +33 -0
- package/components/{progress-circle-BT2qW7LK.js → progress-circle-CUCJ_Ehs.js} +6 -7
- package/components/radio/index.cjs +2 -2
- package/components/radio/index.js +9 -10
- package/components/search/index.cjs +7 -7
- package/components/search/index.js +4 -5
- package/components/{base-BjTwmyRF.cjs → sized-mixin-DcvJLFeo.cjs} +1 -5
- package/components/{sized-mixin-PyCYpyQq.js → sized-mixin-cJbo3PKR.js} +5 -5
- package/components/slider/index.cjs +1 -1
- package/components/slider/index.js +6 -6
- package/components/{streaming-listener-wjMvsv4N.js → streaming-listener-BgCzt2TI.js} +5 -6
- package/components/streaming-listener-C2bsIc4J.cjs +18 -0
- package/components/swatch/index.cjs +7 -7
- package/components/swatch/index.js +11 -12
- package/components/switch/index.cjs +2 -2
- package/components/switch/index.js +5 -5
- package/components/tags/index.cjs +4 -4
- package/components/tags/index.js +12 -13
- package/components/text-field/index.cjs +3 -3
- package/components/text-field/index.js +8 -8
- package/components/text-field-BX_aHXSW.js +288 -0
- package/components/text-field-DAr2RyH9.cjs +81 -0
- package/components/toast/index.cjs +5 -5
- package/components/toast/index.js +5 -5
- package/components/tooltip/index.cjs +4 -4
- package/components/tooltip/index.js +6 -7
- package/components/unit-input/index.cjs +6 -6
- package/components/unit-input/index.js +5 -6
- package/components/utils.cjs +1 -1
- package/components/utils.js +4 -4
- package/custom-elements.json +1 -1
- package/package.json +2 -1
- package/components/action-group-BBoV2VL9.cjs +0 -20
- package/components/async-directive-CV2MII86.cjs +0 -22
- package/components/async-directive-FGzMycjH.js +0 -82
- package/components/base-D76d76ww.js +0 -26
- package/components/base-DNrOP9L3.js +0 -391
- package/components/base-DzbGOAPo.cjs +0 -30
- package/components/button-base-C1ceE1LF.cjs +0 -25
- package/components/clear-button-pnT9_M8M.cjs +0 -18
- package/components/close-button-CPtjRQ0R.cjs +0 -18
- package/components/color-loupe-DIBrhG1Y.cjs +0 -56
- package/components/directive-C7oCP5Bh.cjs +0 -22
- package/components/directive-helpers-BLDZnGQv.js +0 -28
- package/components/directive-helpers-C2vOfhFx.cjs +0 -22
- package/components/directive-oAbCiebi.js +0 -44
- package/components/field-group-eICRTHzI.cjs +0 -23
- package/components/field-label-DOIVL4S4.cjs +0 -25
- package/components/focusable-zn6qaMtV.cjs +0 -18
- package/components/if-defined-CYpcjGCb.js +0 -27
- package/components/if-defined-Cv6xanXh.cjs +0 -22
- package/components/index-BYumXRH5.cjs +0 -77
- package/components/like-anchor-CmIcmz5k.cjs +0 -32
- package/components/lit-html-B3ugcwD9.js +0 -248
- package/components/lit-html-p4Oxv2-5.cjs +0 -24
- package/components/observe-slot-text-CP_EB97X.cjs +0 -18
- package/components/overlay-B1JDPmUJ.cjs +0 -47
- package/components/picker-CLKdhX0B.cjs +0 -127
- package/components/popover-CdkB6GFb.cjs +0 -30
- package/components/progress-circle-DTeqfeun.cjs +0 -33
- package/components/query-BL-TJj7K.cjs +0 -22
- package/components/query-D_KR_GUc.js +0 -51
- package/components/query-assigned-elements-DjfhL1cl.js +0 -36
- package/components/query-assigned-elements-DsKsfk7G.cjs +0 -22
- package/components/query-assigned-nodes-BcKWmGzy.cjs +0 -22
- package/components/query-assigned-nodes-C76XVPWY.js +0 -36
- package/components/sized-mixin-BEemErtP.cjs +0 -18
- package/components/state-BG4JQVA1.js +0 -29
- package/components/state-DHaIxrnQ.cjs +0 -22
- package/components/streaming-listener-BQxEN4sL.cjs +0 -18
- package/components/style-map-BjBGQ_u3.cjs +0 -22
- package/components/style-map-BqvQDFJt.js +0 -53
- package/components/text-field-7ITo3Lac.js +0 -315
- package/components/text-field-CtUKbEQN.cjs +0 -85
- package/components/when-CDK1Tt5Y.js +0 -28
- package/components/when-CDZyJPvd.cjs +0 -22
|
@@ -16,11 +16,9 @@
|
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
18
|
import { luzmoIcon as p, luzmoAngleUp as z, luzmoAngleDown as f } from "@luzmo/icons";
|
|
19
|
-
import {
|
|
20
|
-
import {
|
|
21
|
-
import {
|
|
22
|
-
import { e as n } from "../query-D_KR_GUc.js";
|
|
23
|
-
import { S as w } from "../sized-mixin-PyCYpyQq.js";
|
|
19
|
+
import { a as v, r as b, x as s } from "../base-CCsOyfm4.js";
|
|
20
|
+
import { property as h, query as n, state as x } from "lit/decorators.js";
|
|
21
|
+
import { S as w } from "../sized-mixin-cJbo3PKR.js";
|
|
24
22
|
import "../color-area/index.js";
|
|
25
23
|
import "../color-field/index.js";
|
|
26
24
|
import "../color-handle/index.js";
|
|
@@ -42,7 +40,7 @@ var y = Object.defineProperty, t = (i, o, r, e) => {
|
|
|
42
40
|
(d = i[m]) && (c = d(o, r, c) || c);
|
|
43
41
|
return c && y(o, r, c), c;
|
|
44
42
|
};
|
|
45
|
-
const u = class u extends w(
|
|
43
|
+
const u = class u extends w(v) {
|
|
46
44
|
constructor() {
|
|
47
45
|
super(...arguments), this.color = "rgb(255, 0, 0)", this.noAlphaChannel = !1, this._alpha = 1, this._rgbColor = "rgb(255, 0, 0)", this._rgbaColor = "rgb(255, 0, 0, 1)", this._previousColor = "rgb(255, 0, 0)";
|
|
48
46
|
}
|
|
@@ -169,7 +167,7 @@ const u = class u extends w(b) {
|
|
|
169
167
|
`;
|
|
170
168
|
}
|
|
171
169
|
};
|
|
172
|
-
u.styles =
|
|
170
|
+
u.styles = b(C);
|
|
173
171
|
let l = u;
|
|
174
172
|
t([
|
|
175
173
|
h({ type: String, reflect: !0 })
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../base-CaRKlVkL.cjs"),t=require("lit/decorators.js"),c=require("../sized-mixin-DcvJLFeo.cjs");require("../color-menu/index.cjs");require("../overlay/index.cjs");const h=require("../slottable-request-event-BfUUt1Mh.cjs");require("../popover/index.cjs");require("../swatch/index.cjs");const d="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)}";var m=Object.defineProperty,r=(i,o,a,y)=>{for(var l=void 0,n=i.length-1,u;n>=0;n--)(u=i[n])&&(l=u(o,a,l)||l);return l&&m(o,a,l),l};const p=class p extends c.SizedMixin(s.LuzmoElement){constructor(){super(...arguments),this.color="rgb(255, 0, 0)",this.open=!1,this.disabled=!1,this.placement="left-start",this.rounding="full",this.swatches=[],this.noAlphaChannel=!1,this._renderMenu=!1}overlayCloseEvent(){this.open=!1}overlayOpenEvent(){this.open=!0}handleColorChange(){this.color=this.menuElement.color,this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}firstUpdated(){this.overlayElement.addEventListener("slottable-request",o=>{this._renderMenu=o.data!==h.removeSlottableRequest})}updated(o){o.has("open")&&this.open===!0&&(this._renderMenu=!0)}renderColorMenu(){return s.x`
|
|
19
19
|
<luzmo-color-menu
|
|
20
20
|
.size=${this.size}
|
|
21
21
|
.color=${this.color}
|
|
@@ -23,7 +23,7 @@
|
|
|
23
23
|
.swatches=${this.swatches}
|
|
24
24
|
@change=${this.handleColorChange}
|
|
25
25
|
></luzmo-color-menu>
|
|
26
|
-
`}render(){return
|
|
26
|
+
`}render(){return s.x`
|
|
27
27
|
<luzmo-swatch
|
|
28
28
|
id="trigger"
|
|
29
29
|
.shape=${this.shape}
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
type="page"
|
|
43
43
|
>
|
|
44
44
|
<luzmo-popover style="position:relative">
|
|
45
|
-
${this._renderMenu?this.renderColorMenu():
|
|
45
|
+
${this._renderMenu?this.renderColorMenu():s.x``}
|
|
46
46
|
</luzmo-popover>
|
|
47
47
|
</luzmo-overlay>
|
|
48
|
-
`}};
|
|
48
|
+
`}};p.styles=s.r(d);let e=p;r([t.property({type:String,reflect:!0})],e.prototype,"color");r([t.property({type:Boolean,reflect:!0})],e.prototype,"open");r([t.property({type:Boolean,reflect:!0})],e.prototype,"disabled");r([t.property({type:String,reflect:!0})],e.prototype,"placement");r([t.property({type:String,reflect:!0})],e.prototype,"rounding");r([t.property({type:String,reflect:!0})],e.prototype,"shape");r([t.property({type:Array,reflect:!0})],e.prototype,"swatches");r([t.property({type:Boolean,reflect:!0,attribute:"no-alpha-channel"})],e.prototype,"noAlphaChannel");r([t.query("luzmo-color-menu")],e.prototype,"menuElement");r([t.query("luzmo-overlay")],e.prototype,"overlayElement");r([t.state()],e.prototype,"_renderMenu");customElements.get("luzmo-color-picker")||customElements.define("luzmo-color-picker",e);exports.LuzmoColorPicker=e;
|
|
@@ -15,11 +15,9 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import {
|
|
19
|
-
import {
|
|
20
|
-
import {
|
|
21
|
-
import { e as c } from "../query-D_KR_GUc.js";
|
|
22
|
-
import { S as g } from "../sized-mixin-PyCYpyQq.js";
|
|
18
|
+
import { a as z, r as d, x as u } from "../base-CCsOyfm4.js";
|
|
19
|
+
import { property as r, query as m, state as h } from "lit/decorators.js";
|
|
20
|
+
import { S as g } from "../sized-mixin-cJbo3PKR.js";
|
|
23
21
|
import "../color-menu/index.js";
|
|
24
22
|
import "../overlay/index.js";
|
|
25
23
|
import { r as f } from "../slottable-request-event-DggLA4Rx.js";
|
|
@@ -33,12 +31,12 @@ const p = () => {
|
|
|
33
31
|
};
|
|
34
32
|
p();
|
|
35
33
|
const b = "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)}";
|
|
36
|
-
var v = Object.defineProperty, e = (l, t,
|
|
37
|
-
for (var n = void 0, i = l.length - 1,
|
|
38
|
-
(
|
|
39
|
-
return n && v(t,
|
|
34
|
+
var v = Object.defineProperty, e = (l, t, s, y) => {
|
|
35
|
+
for (var n = void 0, i = l.length - 1, c; i >= 0; i--)
|
|
36
|
+
(c = l[i]) && (n = c(t, s, n) || n);
|
|
37
|
+
return n && v(t, s, n), n;
|
|
40
38
|
};
|
|
41
|
-
const a = class a extends g(
|
|
39
|
+
const a = class a extends g(z) {
|
|
42
40
|
constructor() {
|
|
43
41
|
super(...arguments), this.color = "rgb(255, 0, 0)", this.open = !1, this.disabled = !1, this.placement = "left-start", this.rounding = "full", this.swatches = [], this.noAlphaChannel = !1, this._renderMenu = !1;
|
|
44
42
|
}
|
|
@@ -101,7 +99,7 @@ const a = class a extends g(d) {
|
|
|
101
99
|
`;
|
|
102
100
|
}
|
|
103
101
|
};
|
|
104
|
-
a.styles =
|
|
102
|
+
a.styles = d(b);
|
|
105
103
|
let o = a;
|
|
106
104
|
e([
|
|
107
105
|
r({ type: String, reflect: !0 })
|
|
@@ -128,10 +126,10 @@ e([
|
|
|
128
126
|
r({ type: Boolean, reflect: !0, attribute: "no-alpha-channel" })
|
|
129
127
|
], o.prototype, "noAlphaChannel");
|
|
130
128
|
e([
|
|
131
|
-
|
|
129
|
+
m("luzmo-color-menu")
|
|
132
130
|
], o.prototype, "menuElement");
|
|
133
131
|
e([
|
|
134
|
-
|
|
132
|
+
m("luzmo-overlay")
|
|
135
133
|
], o.prototype, "overlayElement");
|
|
136
134
|
e([
|
|
137
135
|
h()
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../base-CaRKlVkL.cjs"),i=require("lit/decorators.js"),d=require("lit/directives/if-defined.js"),p=require("lit/directives/style-map.js");require("../color-handle/index.cjs");const b=require("../focusable-BFdecx5l.cjs"),m=require("../color-DphK4hwx.cjs"),g=require("../language-resolution-DJzmyzZq.cjs"),v=require("../streaming-listener-C2bsIc4J.cjs"),h=require("../index-DCKCHDTt.cjs"),y='.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}';var f=Object.defineProperty,z=Object.getOwnPropertyDescriptor,l=(c,e,t,o)=>{for(var s=o>1?void 0:o?z(e,t):e,a=c.length-1,n;a>=0;a--)(n=c[a])&&(s=(o?n(e,t,s):n(s))||s);return o&&s&&f(e,t,s),s};class r extends b.Focusable{constructor(){super(...arguments),this.disabled=!1,this.focused=!1,this.label="hue",this.vertical=!1,this.languageResolver=new g.LanguageResolutionController(this),this.colorController=new m.ColorController(this,{applyColorToState:()=>{if(this.mode==="opacity"){const e=new h.TinyColor(this.colorController.color);this.sliderHandlePosition=100*e.getAlpha()}else this.sliderHandlePosition=100*(this.colorController.hue/360)},extractColorFromState:e=>this.mode==="opacity"?{...e.getColor("hsl"),a:this.value}:{...e.getColor("hsl"),h:this.value},maintains:"saturation"}),this.sliderHandlePosition=0,this.step=1,this.isLTR=!0,this._altered=0,this._pointerDown=!1}static get styles(){return[u.r(y)]}get value(){return this.mode==="opacity"?this.colorController.opacity:this.colorController.hue}set value(e){this.mode==="opacity"?this.colorController.opacity=e:this.colorController.hue=e}get color(){return this.colorController.color}set color(e){this.colorController.color=e}get altered(){return this._altered}set altered(e){this._altered=e,this.step=Math.max(1,this.altered*10)}get focusElement(){return this.input}handleKeydown(e){const{key:t}=e;this.focused=!0,this.altered=[e.shiftKey,e.ctrlKey,e.altKey].filter(n=>!!n).length;let o=0;switch(t){case"ArrowUp":{o=this.step;break}case"ArrowDown":{o=-this.step;break}case"ArrowLeft":{o=this.step*(this.isLTR?-1:1);break}case"ArrowRight":{o=this.step*(this.isLTR?1:-1);break}default:return}e.preventDefault();const a=100/(this.mode==="opacity"?100:360);this.sliderHandlePosition=Math.min(100,Math.max(0,this.sliderHandlePosition+o*a)),this.value=this.mode==="opacity"?Math.min(1,Math.max(0,this.value+o/100)):Math.min(360,Math.max(0,this.value+o)),this.colorController.applyColorFromState(),o!==0&&(this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0})),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0})))}handleInput(e){const{valueAsNumber:t}=e.target;this.value=t,this.sliderHandlePosition=100*(this.mode==="opacity"?this.value:this.value/360),this.colorController.applyColorFromState()}handleChange(e){this.handleInput(e),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0}))}focus(e={}){super.focus(e),this.forwardFocus()}forwardFocus(){this.input.focus()}handleFocus(){this.focused=!0}handleBlur(){this._pointerDown||(this.altered=0,this.focused=!1)}handlePointerdown(e){if(e.button!==0){e.preventDefault();return}this._pointerDown=!0,this.colorController.savePreviousColor(),this.boundingClientRect=this.getBoundingClientRect(),e.target.setPointerCapture(e.pointerId),e.pointerType==="mouse"&&(this.focused=!0)}handlePointermove(e){this.sliderHandlePosition=this.calculateHandlePosition(e),this.value=(this.mode==="opacity"?1:360)*(this.sliderHandlePosition/100),this.colorController.applyColorFromState(),this.dispatchEvent(new Event("input",{bubbles:!0,composed:!0,cancelable:!0}))}handlePointerup(e){this._pointerDown=!1,e.target.releasePointerCapture(e.pointerId),this.dispatchEvent(new Event("change",{bubbles:!0,composed:!0,cancelable:!0}))||this.colorController.restorePreviousColor(),this.focus(),e.pointerType==="mouse"&&(this.focused=!1)}calculateHandlePosition(e){if(!this.boundingClientRect)return this.sliderHandlePosition;const t=this.boundingClientRect,o=this.vertical?t.top:t.left,s=this.vertical?e.clientY:e.clientX,a=this.vertical?t.height:t.width,n=Math.max(0,Math.min(1,(s-o)/a));return this.vertical||!this.isLTR?100-100*n:100*n}handleGradientPointerdown(e){e.button===0&&(e.stopPropagation(),e.preventDefault(),this.handle.dispatchEvent(new PointerEvent("pointerdown",e)),this.handlePointermove(e))}get handlePositionStyles(){return`${this.vertical?"inset-block-end":"inset-inline-start"}: ${this.sliderHandlePosition}%`}get getColorSliderStyle(){const e=this.vertical?"top":"right";if(this.mode==="opacity"){const t=new h.TinyColor(this.colorController.color).setAlpha(1).toRgbString();return{background:`linear-gradient(to ${e}, transparent, ${t})`}}return{background:`linear-gradient(to ${e}, var(--luzmo-color-slider-gradient, var(--luzmo-color-slider-gradient-fallback)))`}}render(){return u.x`
|
|
19
19
|
<div
|
|
20
20
|
class="opacity-checkerboard checkerboard"
|
|
21
21
|
role="presentation"
|
|
@@ -24,28 +24,28 @@
|
|
|
24
24
|
<div
|
|
25
25
|
class="gradient"
|
|
26
26
|
role="presentation"
|
|
27
|
-
style=${
|
|
27
|
+
style=${p.styleMap(this.getColorSliderStyle)}
|
|
28
28
|
>
|
|
29
29
|
<slot name="gradient"></slot>
|
|
30
30
|
</div>
|
|
31
31
|
</div>
|
|
32
32
|
<luzmo-color-handle
|
|
33
|
-
tabindex=${d.
|
|
33
|
+
tabindex=${d.ifDefined(this.focused?void 0:"0")}
|
|
34
34
|
@focus=${this.forwardFocus}
|
|
35
35
|
?focused=${this.focused}
|
|
36
36
|
class="handle"
|
|
37
37
|
color=${this.mode==="opacity"?this.color:"hsl("+this.value+", 100%, 50%)"}
|
|
38
38
|
?disabled=${this.disabled}
|
|
39
39
|
style=${this.handlePositionStyles}
|
|
40
|
-
${
|
|
40
|
+
${v.streamingListener({start:["pointerdown",this.handlePointerdown],streamInside:["pointermove",this.handlePointermove],end:[["pointerup","pointercancel","pointerleave"],this.handlePointerup]})}
|
|
41
41
|
></luzmo-color-handle>
|
|
42
42
|
<input
|
|
43
43
|
type="range"
|
|
44
44
|
class="slider"
|
|
45
45
|
min="0"
|
|
46
46
|
max=${this.mode==="opacity"?"100":"360"}
|
|
47
|
-
aria-orientation=${d.
|
|
48
|
-
orient=${d.
|
|
47
|
+
aria-orientation=${d.ifDefined(this.vertical?"vertical":void 0)}
|
|
48
|
+
orient=${d.ifDefined(this.vertical?"vertical":void 0)}
|
|
49
49
|
step=${this.step}
|
|
50
50
|
aria-label=${this.label}
|
|
51
51
|
.value=${String(this.mode==="opacity"?this.value*100:this.value)}
|
|
@@ -54,4 +54,4 @@
|
|
|
54
54
|
@change=${this.handleChange}
|
|
55
55
|
@keydown=${this.handleKeydown}
|
|
56
56
|
/>
|
|
57
|
-
`}firstUpdated(e){super.firstUpdated(e),this.boundingClientRect=this.getBoundingClientRect(),this.addEventListener("focus",this.handleFocus),this.addEventListener("blur",this.handleBlur)}updated(e){e.has("mode")&&(this.handle.style.insetInlineStart="",this.handle.style.insetBlockEnd="",this.mode==="opacity"&&(this.colorController.color=new h.TinyColor(this.colorController.color).toRgbString(),this.handle.style.insetInlineStart=100*this.colorController.opacity+"%"))}}
|
|
57
|
+
`}firstUpdated(e){super.firstUpdated(e),this.boundingClientRect=this.getBoundingClientRect(),this.addEventListener("focus",this.handleFocus),this.addEventListener("blur",this.handleBlur)}updated(e){e.has("mode")&&(this.handle.style.insetInlineStart="",this.handle.style.insetBlockEnd="",this.mode==="opacity"&&(this.colorController.color=new h.TinyColor(this.colorController.color).toRgbString(),this.handle.style.insetInlineStart=100*this.colorController.opacity+"%"))}}l([i.property({type:String,reflect:!0})],r.prototype,"dir",2);l([i.property({type:String,reflect:!0})],r.prototype,"mode",2);l([i.property({type:Boolean,reflect:!0})],r.prototype,"disabled",2);l([i.property({type:Boolean,reflect:!0})],r.prototype,"focused",2);l([i.query(".handle")],r.prototype,"handle",2);l([i.property({type:String})],r.prototype,"label",2);l([i.property({type:Boolean,reflect:!0})],r.prototype,"vertical",2);l([i.property({type:Number})],r.prototype,"value",1);l([i.property({type:Number,reflect:!0})],r.prototype,"sliderHandlePosition",2);l([i.property({type:String})],r.prototype,"color",1);l([i.property({type:Number})],r.prototype,"step",2);l([i.property({type:Boolean,attribute:"is-ltr"})],r.prototype,"isLTR",2);l([i.query("input")],r.prototype,"input",2);customElements.get("luzmo-color-slider")||customElements.define("luzmo-color-slider",r);exports.LuzmoColorSlider=r;
|
|
@@ -15,16 +15,15 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import {
|
|
19
|
-
import {
|
|
20
|
-
import {
|
|
21
|
-
import {
|
|
22
|
-
import { o as g } from "../style-map-BqvQDFJt.js";
|
|
18
|
+
import { r as p, x as b } from "../base-CCsOyfm4.js";
|
|
19
|
+
import { property as i, query as h } from "lit/decorators.js";
|
|
20
|
+
import { ifDefined as d } from "lit/directives/if-defined.js";
|
|
21
|
+
import { styleMap as g } from "lit/directives/style-map.js";
|
|
23
22
|
import "../color-handle/index.js";
|
|
24
|
-
import { F as z } from "../focusable-
|
|
23
|
+
import { F as z } from "../focusable-CxA_NMK_.js";
|
|
25
24
|
import { C as f } from "../color-Bg3tYsAQ.js";
|
|
26
25
|
import { L as v } from "../language-resolution-8yZa5r_P.js";
|
|
27
|
-
import { s as y } from "../streaming-listener-
|
|
26
|
+
import { s as y } from "../streaming-listener-BgCzt2TI.js";
|
|
28
27
|
import { T as u } from "../index-C1chwzNp.js";
|
|
29
28
|
const m = () => {
|
|
30
29
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("../base-CaRKlVkL.cjs"),c=require("../sized-mixin-DcvJLFeo.cjs"),n=require("lit/decorators.js"),p=require("../divider.module-CXMNveQc.cjs");var f=Object.defineProperty,d=(a,e,l,v)=>{for(var t=void 0,i=a.length-1,u;i>=0;i--)(u=a[i])&&(t=u(e,l,t)||t);return t&&f(e,l,t),t};const o=class o extends c.SizedMixin(s.LuzmoElement,{validSizes:["s","m","l"],noDefaultSize:!0}){constructor(){super(...arguments),this.vertical=!1}render(){return s.x``}firstUpdated(e){super.firstUpdated(e),this.setAttribute("role","separator")}updated(e){super.updated(e),e.has("vertical")&&(this.vertical?this.setAttribute("aria-orientation","vertical"):this.removeAttribute("aria-orientation"))}};o.styles=[s.r(p.styles)];let r=o;d([n.property({type:Boolean,reflect:!0})],r.prototype,"vertical");d([n.property({type:String,reflect:!0,attribute:"static-color"})],r.prototype,"staticColor");customElements.get("luzmo-divider")||customElements.define("luzmo-divider",r);exports.LuzmoDivider=r;
|
|
@@ -15,9 +15,9 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import {
|
|
19
|
-
import {
|
|
20
|
-
import {
|
|
18
|
+
import { a as s, r as z, x as d } from "../base-CCsOyfm4.js";
|
|
19
|
+
import { S as f } from "../sized-mixin-cJbo3PKR.js";
|
|
20
|
+
import { property as c } from "lit/decorators.js";
|
|
21
21
|
import { s as b } from "../divider.module-DwOuLGU3.js";
|
|
22
22
|
const n = () => {
|
|
23
23
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
@@ -31,7 +31,7 @@ var p = Object.defineProperty, a = (r, o, m, g) => {
|
|
|
31
31
|
(i = r[t]) && (l = i(o, m, l) || l);
|
|
32
32
|
return l && p(o, m, l), l;
|
|
33
33
|
};
|
|
34
|
-
const u = class u extends f(
|
|
34
|
+
const u = class u extends f(s, {
|
|
35
35
|
validSizes: ["s", "m", "l"],
|
|
36
36
|
noDefaultSize: !0
|
|
37
37
|
}) {
|
|
@@ -39,7 +39,7 @@ const u = class u extends f(d, {
|
|
|
39
39
|
super(...arguments), this.vertical = !1;
|
|
40
40
|
}
|
|
41
41
|
render() {
|
|
42
|
-
return
|
|
42
|
+
return d``;
|
|
43
43
|
}
|
|
44
44
|
firstUpdated(o) {
|
|
45
45
|
super.firstUpdated(o), this.setAttribute("role", "separator");
|
|
@@ -48,7 +48,7 @@ const u = class u extends f(d, {
|
|
|
48
48
|
super.updated(o), o.has("vertical") && (this.vertical ? this.setAttribute("aria-orientation", "vertical") : this.removeAttribute("aria-orientation"));
|
|
49
49
|
}
|
|
50
50
|
};
|
|
51
|
-
u.styles = [
|
|
51
|
+
u.styles = [z(b)];
|
|
52
52
|
let e = u;
|
|
53
53
|
a([
|
|
54
54
|
c({ type: Boolean, reflect: !0 })
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../field-group-
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../field-group-CodR_26L.cjs");customElements.get("luzmo-field-group")||customElements.define("luzmo-field-group",e.LuzmoFieldGroup);exports.LuzmoFieldGroup=e.LuzmoFieldGroup;
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { L as r } from "../field-group-
|
|
18
|
+
import { L as r } from "../field-group-BPZvGJi1.js";
|
|
19
19
|
const l = () => {
|
|
20
20
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
21
21
|
const o = document.createElement("style");
|
|
@@ -15,28 +15,28 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import {
|
|
19
|
-
import {
|
|
20
|
-
import { M as h } from "./manage-help-text-
|
|
18
|
+
import { a as d, r as p, x as u } from "./base-CCsOyfm4.js";
|
|
19
|
+
import { property as l } from "lit/decorators.js";
|
|
20
|
+
import { M as h } from "./manage-help-text-CmE_nfjl.js";
|
|
21
21
|
const f = '.luzmo-FieldGroup--toplabel{flex-direction:column}.luzmo-FieldGroup--sidelabel{flex-direction:row}.group{flex-flow:column wrap;display:flex}:host([vertical]) .group{flex-direction:column}:host([horizontal]) .group{flex-direction:row}:host([horizontal]) .group slot:not([name])::slotted(:not(:last-child)){margin-inline-end:var(--field-group-margin)}:host([horizontal]) .group .luzmo-HelpText{flex-basis:100%}:host{--field-group-margin: 16px;--field-group-readonly-delimiter: ","}:host([horizontal][dir=rtl]) slot:not([name])::slotted(*:not(:last-child)),:host([dir=rtl]:not([vertical])) slot:not([name])::slotted(*:not(:last-child)){margin:0 0 0 var(--field-group-margin)}:host([horizontal][dir=ltr]) slot:not([name])::slotted(*:not(:last-child)),:host([dir=ltr]:not([vertical])) slot:not([name])::slotted(*:not(:last-child)){margin:0 var(--field-group-margin) 0 0}';
|
|
22
22
|
var m = Object.defineProperty, o = (i, t, s, c) => {
|
|
23
23
|
for (var e = void 0, a = i.length - 1, n; a >= 0; a--)
|
|
24
24
|
(n = i[a]) && (e = n(t, s, e) || e);
|
|
25
25
|
return e && m(t, s, e), e;
|
|
26
26
|
};
|
|
27
|
-
class r extends h(
|
|
27
|
+
class r extends h(d, {
|
|
28
28
|
mode: "external"
|
|
29
29
|
}) {
|
|
30
30
|
constructor() {
|
|
31
31
|
super(...arguments), this.horizontal = !1, this.invalid = !1, this.label = "", this.vertical = !1;
|
|
32
32
|
}
|
|
33
33
|
static get styles() {
|
|
34
|
-
return [
|
|
34
|
+
return [p(f)];
|
|
35
35
|
}
|
|
36
36
|
handleSlotchange() {
|
|
37
37
|
}
|
|
38
38
|
render() {
|
|
39
|
-
return
|
|
39
|
+
return u`
|
|
40
40
|
<div class="group" role="presentation">
|
|
41
41
|
<slot @slotchange=${this.handleSlotchange}></slot>
|
|
42
42
|
</div>
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
/*! * Lucero - The design system for Luzmo.
|
|
2
|
+
*
|
|
3
|
+
* Copyright © 2025 Luzmo
|
|
4
|
+
* All rights reserved.
|
|
5
|
+
* Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
|
|
6
|
+
* This license allows users with a current active Luzmo account to use Lucero.
|
|
7
|
+
* This license terminates automatically if a user no longer has an active Luzmo account.
|
|
8
|
+
* Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
|
|
9
|
+
*
|
|
10
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
11
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
12
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
13
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
14
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
15
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
|
+
* SOFTWARE.
|
|
17
|
+
* */
|
|
18
|
+
"use strict";const s=require("./base-CaRKlVkL.cjs"),l=require("lit/decorators.js"),p=require("./manage-help-text-CoX77cTJ.cjs"),u='.luzmo-FieldGroup--toplabel{flex-direction:column}.luzmo-FieldGroup--sidelabel{flex-direction:row}.group{flex-flow:column wrap;display:flex}:host([vertical]) .group{flex-direction:column}:host([horizontal]) .group{flex-direction:row}:host([horizontal]) .group slot:not([name])::slotted(:not(:last-child)){margin-inline-end:var(--field-group-margin)}:host([horizontal]) .group .luzmo-HelpText{flex-basis:100%}:host{--field-group-margin: 16px;--field-group-readonly-delimiter: ","}:host([horizontal][dir=rtl]) slot:not([name])::slotted(*:not(:last-child)),:host([dir=rtl]:not([vertical])) slot:not([name])::slotted(*:not(:last-child)){margin:0 0 0 var(--field-group-margin)}:host([horizontal][dir=ltr]) slot:not([name])::slotted(*:not(:last-child)),:host([dir=ltr]:not([vertical])) slot:not([name])::slotted(*:not(:last-child)){margin:0 var(--field-group-margin) 0 0}';var h=Object.defineProperty,o=(i,t,n,c)=>{for(var e=void 0,a=i.length-1,d;a>=0;a--)(d=i[a])&&(e=d(t,n,e)||e);return e&&h(t,n,e),e};class r extends p.ManageHelpText(s.LuzmoElement,{mode:"external"}){constructor(){super(...arguments),this.horizontal=!1,this.invalid=!1,this.label="",this.vertical=!1}static get styles(){return[s.r(u)]}handleSlotchange(){}render(){return s.x`
|
|
19
|
+
<div class="group" role="presentation">
|
|
20
|
+
<slot @slotchange=${this.handleSlotchange}></slot>
|
|
21
|
+
</div>
|
|
22
|
+
${this.renderHelpText(this.invalid)}
|
|
23
|
+
`}firstUpdated(t){super.firstUpdated(t),this.hasAttribute("role")||this.setAttribute("role","group")}updated(t){super.updated(t),t.has("label")&&(this.label?this.setAttribute("aria-label",this.label):this.removeAttribute("aria-label"))}}o([l.property({type:Boolean,reflect:!0})],r.prototype,"horizontal");o([l.property({type:Boolean,reflect:!0})],r.prototype,"invalid");o([l.property()],r.prototype,"label");o([l.property({type:Boolean,reflect:!0})],r.prototype,"vertical");exports.LuzmoFieldGroup=r;
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../field-label-
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../field-label-B91K6moC.cjs");customElements.get("luzmo-field-label")||customElements.define("luzmo-field-label",e.LuzmoFieldLabel);exports.LuzmoFieldLabel=e.LuzmoFieldLabel;
|
|
@@ -15,7 +15,7 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import { L as r } from "../field-label-
|
|
18
|
+
import { L as r } from "../field-label-6AaW05kA.js";
|
|
19
19
|
const l = () => {
|
|
20
20
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
21
21
|
const o = document.createElement("style");
|
|
@@ -15,30 +15,29 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import {
|
|
19
|
-
import {
|
|
20
|
-
import { e as h } from "./query-D_KR_GUc.js";
|
|
18
|
+
import { a as b, r as g, E as m, x as d } from "./base-CCsOyfm4.js";
|
|
19
|
+
import { property as r, query as h } from "lit/decorators.js";
|
|
21
20
|
import { c, a as u } from "./condition-attribute-with-id-Dv4lSRbe.js";
|
|
22
21
|
import { r as p } from "./random-id-ByCz1xaq.js";
|
|
23
22
|
import { E as z, e as v } from "./element-resolution-FCUT-wql.js";
|
|
24
|
-
import { S as x } from "./sized-mixin-
|
|
23
|
+
import { S as x } from "./sized-mixin-cJbo3PKR.js";
|
|
25
24
|
const k = ":host{box-sizing:border-box;min-block-size:var(--luzmo-field-label-min-height, var(--field-label-min-height));padding-block:var(--luzmo-field-label-padding-block, var(--luzmo-field-label-top-to-text, var(--field-label-top-to-text)) var(--luzmo-field-label-bottom-to-text, var(--field-label-bottom-to-text)));padding-inline:0;padding-inline:var(--luzmo-field-label-padding-inline, 0);margin-block:0;margin-block:var(--luzmo-field-label-margin-block, var(--luzmo-field-label-margin-block-start, 0) var(--luzmo-field-label-margin-block-end, 0));margin-inline:0;margin-inline:var(--luzmo-field-label-margin-inline, var(--luzmo-field-label-margin-inline-start, 0) var(--luzmo-field-label-margin-inline-end, 0));font-size:var(--luzmo-field-label-font-size, var(--field-label-font-size));font-weight:var(--luzmo-field-label-font-weight, var(--field-label-font-weight));line-height:var(--luzmo-field-label-line-height, var(--field-label-line-height));-webkit-font-smoothing:subpixel-antialiased;-moz-osx-font-smoothing:auto;color:var(--luzmo-field-label-color, var(--field-label-color));display:block;font-family:var(--luzmo-field-label-font-family, var(--luzmo-font-family))}:host(:lang(ja)),:host(:lang(ko)),:host(:lang(zh)){--luzmo-field-label-line-height: var( --luzmo-field-label-line-height-cjk, var(--field-label-line-height-cjk) )}:host([disabled]),:host([disabled]) .required-icon{--luzmo-field-label-color: var( --highcontrast-field-label-disabled-content-color, var( --luzmo-disabled-content-color, var(--field-label-disabled-content-color) ) )}.required-icon{display:inline-block;margin-block:0;margin-inline:var(--luzmo-field-label-text-to-asterisk, var(--field-label-text-to-asterisk)) 0;vertical-align:initial;vertical-align:var(--luzmo-field-label-asterisk-vertical-align, baseline)}:host([side-aligned=start]),:host([side-aligned=end]){vertical-align:top;margin-block-start:0;margin-block-end:0;margin-inline-end:var(--luzmo-field-label-side-padding-right, var(--field-label-side-padding-right));display:inline-flex;align-items:center;font-size:var(--luzmo-field-label-side-aligned-font-size, var(--field-label-side-aligned-font-size));block-size:var(--luzmo-field-label-side-aligned-height, var(--field-label-side-aligned-height))}:host([side-aligned=end]){text-align:end}@media (forced-colors: active){:host{--highcontrast-field-label-disabled-content-color: GrayText}}:host{--field-label-color: var(--luzmo-font-color);--field-label-font-weight: var(--luzmo-font-weight);--field-label-line-height: var(--luzmo-line-height);--field-label-line-height-cjk: 1.5;--field-label-disabled-content-color: var(--luzmo-font-color-disabled)}:host{--field-label-min-height: var(--luzmo-component-height-xs);--field-label-side-aligned-height: var(--luzmo-component-height);--field-label-top-to-text: calc(var(--luzmo-spacing-2));--field-label-bottom-to-text: var(--luzmo-spacing-2);--field-label-side-aligned-font-size: var(--luzmo-font-size);--field-label-font-size: var(--luzmo-font-size-s);--field-label-side-padding-right: var(--luzmo-spacing-4);--field-label-text-to-asterisk: 0px}:host([size=s]){--field-label-min-height: var(--luzmo-component-height-xxs);--field-label-side-aligned-height: var(--luzmo-component-height-s);--field-label-top-to-text: calc(var(--luzmo-spacing-1));--field-label-bottom-to-text: var(--luzmo-spacing-1);--field-label-side-aligned-font-size: var(--luzmo-font-size-s);--field-label-font-size: var(--luzmo-font-size-xs);--field-label-side-padding-right: var(--luzmo-spacing-3);--field-label-text-to-asterisk: 0px}:host([size=l]){--field-label-min-height: var(--luzmo-component-height-xs);--field-label-side-aligned-height: var(--luzmo-component-height-l);--field-label-top-to-text: var(--luzmo-spacing-3);--field-label-bottom-to-text: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--field-label-side-aligned-font-size: var(--luzmo-font-size-l);--field-label-font-size: var(--luzmo-font-size);--field-label-side-padding-right: var(--luzmo-spacing-4);--field-label-text-to-asterisk: var(--luzmo-spacing-1)}:host([size=xl]){--field-label-min-height: var(--luzmo-component-height-s);--field-label-side-aligned-height: var(--luzmo-component-height-xl);--field-label-top-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--field-label-bottom-to-text: var(--luzmo-spacing-3);--field-label-side-aligned-font-size: var(--luzmo-font-size-xl);--field-label-font-size: var(--luzmo-font-size-l);--field-label-side-padding-right: var(--luzmo-spacing-4);--field-label-text-to-asterisk: var(--luzmo-spacing-1)}label{display:inline-block}";
|
|
26
25
|
var y = Object.defineProperty, o = (s, e, t, l) => {
|
|
27
26
|
for (var i = void 0, a = s.length - 1, f; a >= 0; a--)
|
|
28
27
|
(f = s[a]) && (i = f(e, t, i) || i);
|
|
29
28
|
return i && y(e, t, i), i;
|
|
30
29
|
};
|
|
31
|
-
const
|
|
30
|
+
const E = () => d`
|
|
32
31
|
<div class="icon-container required-icon">*</div>
|
|
33
32
|
`;
|
|
34
|
-
class n extends x(
|
|
33
|
+
class n extends x(b, {
|
|
35
34
|
noDefaultSize: !0
|
|
36
35
|
}) {
|
|
37
36
|
constructor() {
|
|
38
37
|
super(...arguments), this.disabled = !1, this.id = "", this.for = "", this.required = !1, this.resolvedElement = new z(this);
|
|
39
38
|
}
|
|
40
39
|
static get styles() {
|
|
41
|
-
return [
|
|
40
|
+
return [g(k)];
|
|
42
41
|
}
|
|
43
42
|
handleClick(e) {
|
|
44
43
|
if (!this.target || this.disabled || e.defaultPrevented)
|
|
@@ -73,7 +72,7 @@ class n extends x(g, {
|
|
|
73
72
|
return d`
|
|
74
73
|
<label>
|
|
75
74
|
<slot></slot>
|
|
76
|
-
${this.required ? d` ${
|
|
75
|
+
${this.required ? d` ${E()} ` : m}
|
|
77
76
|
</label>
|
|
78
77
|
`;
|
|
79
78
|
}
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
/*! * Lucero - The design system for Luzmo.
|
|
2
|
+
*
|
|
3
|
+
* Copyright © 2025 Luzmo
|
|
4
|
+
* All rights reserved.
|
|
5
|
+
* Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
|
|
6
|
+
* This license allows users with a current active Luzmo account to use Lucero.
|
|
7
|
+
* This license terminates automatically if a user no longer has an active Luzmo account.
|
|
8
|
+
* Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
|
|
9
|
+
*
|
|
10
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
11
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
12
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
13
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
14
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
15
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
|
+
* SOFTWARE.
|
|
17
|
+
* */
|
|
18
|
+
"use strict";const n=require("./base-CaRKlVkL.cjs"),r=require("lit/decorators.js"),b=require("./condition-attribute-with-id-DrQYZzFS.cjs"),h=require("./random-id-CqvckpWe.cjs"),g=require("./element-resolution-BvRLGqIU.cjs"),c=require("./sized-mixin-DcvJLFeo.cjs"),m=":host{box-sizing:border-box;min-block-size:var(--luzmo-field-label-min-height, var(--field-label-min-height));padding-block:var(--luzmo-field-label-padding-block, var(--luzmo-field-label-top-to-text, var(--field-label-top-to-text)) var(--luzmo-field-label-bottom-to-text, var(--field-label-bottom-to-text)));padding-inline:0;padding-inline:var(--luzmo-field-label-padding-inline, 0);margin-block:0;margin-block:var(--luzmo-field-label-margin-block, var(--luzmo-field-label-margin-block-start, 0) var(--luzmo-field-label-margin-block-end, 0));margin-inline:0;margin-inline:var(--luzmo-field-label-margin-inline, var(--luzmo-field-label-margin-inline-start, 0) var(--luzmo-field-label-margin-inline-end, 0));font-size:var(--luzmo-field-label-font-size, var(--field-label-font-size));font-weight:var(--luzmo-field-label-font-weight, var(--field-label-font-weight));line-height:var(--luzmo-field-label-line-height, var(--field-label-line-height));-webkit-font-smoothing:subpixel-antialiased;-moz-osx-font-smoothing:auto;color:var(--luzmo-field-label-color, var(--field-label-color));display:block;font-family:var(--luzmo-field-label-font-family, var(--luzmo-font-family))}:host(:lang(ja)),:host(:lang(ko)),:host(:lang(zh)){--luzmo-field-label-line-height: var( --luzmo-field-label-line-height-cjk, var(--field-label-line-height-cjk) )}:host([disabled]),:host([disabled]) .required-icon{--luzmo-field-label-color: var( --highcontrast-field-label-disabled-content-color, var( --luzmo-disabled-content-color, var(--field-label-disabled-content-color) ) )}.required-icon{display:inline-block;margin-block:0;margin-inline:var(--luzmo-field-label-text-to-asterisk, var(--field-label-text-to-asterisk)) 0;vertical-align:initial;vertical-align:var(--luzmo-field-label-asterisk-vertical-align, baseline)}:host([side-aligned=start]),:host([side-aligned=end]){vertical-align:top;margin-block-start:0;margin-block-end:0;margin-inline-end:var(--luzmo-field-label-side-padding-right, var(--field-label-side-padding-right));display:inline-flex;align-items:center;font-size:var(--luzmo-field-label-side-aligned-font-size, var(--field-label-side-aligned-font-size));block-size:var(--luzmo-field-label-side-aligned-height, var(--field-label-side-aligned-height))}:host([side-aligned=end]){text-align:end}@media (forced-colors: active){:host{--highcontrast-field-label-disabled-content-color: GrayText}}:host{--field-label-color: var(--luzmo-font-color);--field-label-font-weight: var(--luzmo-font-weight);--field-label-line-height: var(--luzmo-line-height);--field-label-line-height-cjk: 1.5;--field-label-disabled-content-color: var(--luzmo-font-color-disabled)}:host{--field-label-min-height: var(--luzmo-component-height-xs);--field-label-side-aligned-height: var(--luzmo-component-height);--field-label-top-to-text: calc(var(--luzmo-spacing-2));--field-label-bottom-to-text: var(--luzmo-spacing-2);--field-label-side-aligned-font-size: var(--luzmo-font-size);--field-label-font-size: var(--luzmo-font-size-s);--field-label-side-padding-right: var(--luzmo-spacing-4);--field-label-text-to-asterisk: 0px}:host([size=s]){--field-label-min-height: var(--luzmo-component-height-xxs);--field-label-side-aligned-height: var(--luzmo-component-height-s);--field-label-top-to-text: calc(var(--luzmo-spacing-1));--field-label-bottom-to-text: var(--luzmo-spacing-1);--field-label-side-aligned-font-size: var(--luzmo-font-size-s);--field-label-font-size: var(--luzmo-font-size-xs);--field-label-side-padding-right: var(--luzmo-spacing-3);--field-label-text-to-asterisk: 0px}:host([size=l]){--field-label-min-height: var(--luzmo-component-height-xs);--field-label-side-aligned-height: var(--luzmo-component-height-l);--field-label-top-to-text: var(--luzmo-spacing-3);--field-label-bottom-to-text: calc( var(--luzmo-spacing-2) + var(--luzmo-spacing-1) );--field-label-side-aligned-font-size: var(--luzmo-font-size-l);--field-label-font-size: var(--luzmo-font-size);--field-label-side-padding-right: var(--luzmo-spacing-4);--field-label-text-to-asterisk: var(--luzmo-spacing-1)}:host([size=xl]){--field-label-min-height: var(--luzmo-component-height-s);--field-label-side-aligned-height: var(--luzmo-component-height-xl);--field-label-top-to-text: calc( var(--luzmo-spacing-3) + var(--luzmo-spacing-1) );--field-label-bottom-to-text: var(--luzmo-spacing-3);--field-label-side-aligned-font-size: var(--luzmo-font-size-xl);--field-label-font-size: var(--luzmo-font-size-l);--field-label-side-padding-right: var(--luzmo-spacing-4);--field-label-text-to-asterisk: var(--luzmo-spacing-1)}label{display:inline-block}";var u=Object.defineProperty,s=(d,e,t,l)=>{for(var i=void 0,a=d.length-1,f;a>=0;a--)(f=d[a])&&(i=f(e,t,i)||i);return i&&u(e,t,i),i};const p=()=>n.x`
|
|
19
|
+
<div class="icon-container required-icon">*</div>
|
|
20
|
+
`;class o extends c.SizedMixin(n.LuzmoElement,{noDefaultSize:!0}){constructor(){super(...arguments),this.disabled=!1,this.id="",this.for="",this.required=!1,this.resolvedElement=new g.ElementResolutionController(this)}static get styles(){return[n.r(m)]}handleClick(e){if(!this.target||this.disabled||e.defaultPrevented)return;this.target.focus();const t=this.getRootNode(),l=this.target,i=l.getRootNode(),a=i.host;i===t&&l.forceFocusVisible?l.forceFocusVisible():a&&a.forceFocusVisible&&a.forceFocusVisible()}applyTargetLabel(e){if(this.target=e||this.target,this.target){const t=this.target.applyFocusElementLabel,l=this.target.focusElement||this.target,i=l.getRootNode();t!==void 0?t(this.labelText,this):i===this.getRootNode()?(e?b.conditionAttributeWithId:b.conditionAttributeWithoutId)(l,"aria-labelledby",[this.id]):e?l.setAttribute("aria-label",this.labelText):l.removeAttribute("aria-label")}}async manageTarget(){this.applyTargetLabel();const e=this.resolvedElement.element;if(!e){this.target=e;return}e.localName.search("-")>0&&await customElements.whenDefined(e.localName),e.updateComplete!==void 0&&await e.updateComplete,this.applyTargetLabel(e)}get labelText(){const e=this.slotEl.assignedNodes({flatten:!0});return e.length===0?"":e.map(l=>(l.textContent||"").trim()).join(" ")}render(){return n.x`
|
|
21
|
+
<label>
|
|
22
|
+
<slot></slot>
|
|
23
|
+
${this.required?n.x` ${p()} `:n.E}
|
|
24
|
+
</label>
|
|
25
|
+
`}firstUpdated(e){super.firstUpdated(e),this.addEventListener("click",this.handleClick)}willUpdate(e){this.hasAttribute("id")||this.setAttribute("id",`${this.tagName.toLowerCase()}-${h.randomID()}`),e.has("for")&&(this.resolvedElement.selector=this.for?`#${this.for}`:""),(e.has("id")||e.has(g.elementResolverUpdatedSymbol))&&this.manageTarget()}}s([r.property({type:Boolean,reflect:!0})],o.prototype,"disabled");s([r.property({type:String})],o.prototype,"id");s([r.property({type:String})],o.prototype,"for");s([r.property({type:Boolean,reflect:!0})],o.prototype,"required");s([r.query("slot")],o.prototype,"slotEl");s([r.property({type:String,reflect:!0,attribute:"side-aligned"})],o.prototype,"sideAligned");exports.LuzmoFieldLabel=o;
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
/*! * Lucero - The design system for Luzmo.
|
|
2
|
+
*
|
|
3
|
+
* Copyright © 2025 Luzmo
|
|
4
|
+
* All rights reserved.
|
|
5
|
+
* Lucero (“Luzmo Design System”) must be used according to the Luzmo Terms of Service.
|
|
6
|
+
* This license allows users with a current active Luzmo account to use Lucero.
|
|
7
|
+
* This license terminates automatically if a user no longer has an active Luzmo account.
|
|
8
|
+
* Please view the Luzmo Terms of Service at: https://www.luzmo.com/information-pages/terms-of-use.
|
|
9
|
+
*
|
|
10
|
+
* THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
|
|
11
|
+
* IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
|
|
12
|
+
* FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
|
|
13
|
+
* AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
|
|
14
|
+
* LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
|
|
15
|
+
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
|
+
* SOFTWARE.
|
|
17
|
+
* */
|
|
18
|
+
"use strict";const r=require("lit/decorators.js"),d=require("./base-CaRKlVkL.cjs"),b=require("./focus-visible-B0P9aY_G.cjs");var f=Object.defineProperty,c=Object.getOwnPropertyDescriptor,l=(a,t,e,i)=>{for(var s=i>1?void 0:i?c(t,e):t,u=a.length-1,o;u>=0;u--)(o=a[u])&&(s=(i?o(t,e,s):o(s))||s);return i&&s&&f(t,e,s),s};function h(){return new Promise(a=>requestAnimationFrame(()=>a()))}class n extends b.FocusVisiblePolyfillMixin(d.LuzmoElement){constructor(){super(...arguments),this.disabled=!1,this.autofocus=!1,this._tabIndex=0,this.manipulatingTabindex=!1,this.autofocusReady=Promise.resolve()}get tabIndex(){if(this.focusElement===this){const e=this.hasAttribute("tabindex")?Number(this.getAttribute("tabindex")):Number.NaN;return Number.isNaN(e)?-1:e}const t=Number.parseFloat(this.hasAttribute("tabindex")&&this.getAttribute("tabindex")||"0");return this.disabled||t<0?-1:this.focusElement?this._tabIndex:t}set tabIndex(t){var e;if(this.manipulatingTabindex){this.manipulatingTabindex=!1;return}if(this.focusElement===this){if(this.disabled)this._tabIndex=t;else if(t!==this._tabIndex){this._tabIndex=t;const i=""+t;this.manipulatingTabindex=!0,this.setAttribute("tabindex",i)}return}if(t===-1?this.addEventListener("pointerdown",this.onPointerdownManagementOfTabIndex):(this.manipulatingTabindex=!0,this.removeEventListener("pointerdown",this.onPointerdownManagementOfTabIndex)),t===-1||this.disabled){if(this.manipulatingTabindex=!0,this.setAttribute("tabindex","-1"),this.removeAttribute("focusable"),this.selfManageFocusElement)return;t===-1?(e=this.focusElement)==null||e.removeAttribute("tabindex"):(this._tabIndex=t,this.manageFocusElementTabindex(t));return}this.setAttribute("focusable",""),this.hasAttribute("tabindex")?this.removeAttribute("tabindex"):this.manipulatingTabindex=!1,this._tabIndex=t,this.manageFocusElementTabindex(t)}onPointerdownManagementOfTabIndex(){this.tabIndex===-1&&setTimeout(()=>{this.tabIndex=0,this.focus({preventScroll:!0}),this.tabIndex=-1})}async manageFocusElementTabindex(t){this.focusElement||await this.updateComplete,t===null?this.focusElement.removeAttribute("tabindex"):this.focusElement!==this&&(this.focusElement.tabIndex=t)}get focusElement(){throw new Error("Must implement focusElement getter!")}get selfManageFocusElement(){return!1}focus(t){this.disabled||!this.focusElement||(this.focusElement===this?Reflect.apply(HTMLElement.prototype.focus,this,[t]):this.focusElement.focus(t))}blur(){const t=this.focusElement||this;t===this?HTMLElement.prototype.blur.apply(this):t.blur()}click(){if(this.disabled)return;const t=this.focusElement||this;t===this?HTMLElement.prototype.click.apply(this):t.click()}manageAutoFocus(){this.autofocus&&(this.dispatchEvent(new KeyboardEvent("keydown",{code:"Tab"})),this.focusElement.focus())}firstUpdated(t){super.firstUpdated(t),(!this.hasAttribute("tabindex")||this.getAttribute("tabindex")!=="-1")&&this.setAttribute("focusable","")}update(t){t.has("disabled")&&this.handleDisabledChanged(this.disabled,t.get("disabled")),super.update(t)}updated(t){super.updated(t),t.has("disabled")&&this.disabled&&this.blur()}async handleDisabledChanged(t,e){const i=()=>this.focusElement!==this&&this.focusElement.disabled!==void 0;t?(this.manipulatingTabindex=!0,this.setAttribute("tabindex","-1"),await this.updateComplete,i()?this.focusElement.disabled=!0:this.setAttribute("aria-disabled","true")):e&&(this.manipulatingTabindex=!0,this.focusElement===this?this.setAttribute("tabindex",""+this._tabIndex):this.removeAttribute("tabindex"),await this.updateComplete,i()?this.focusElement.disabled=!1:this.removeAttribute("aria-disabled"))}async getUpdateComplete(){const t=await super.getUpdateComplete();return await this.autofocusReady,t}connectedCallback(){super.connectedCallback(),this.autofocus&&(this.autofocusReady=new Promise(async t=>{await h(),await h(),t()}),this.updateComplete.then(()=>{this.manageAutoFocus()}))}}l([r.property({type:Boolean,reflect:!0})],n.prototype,"disabled",2);l([r.property({type:Boolean})],n.prototype,"autofocus",2);l([r.property({type:Number})],n.prototype,"tabIndex",1);exports.Focusable=n;
|
|
@@ -15,7 +15,8 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
import {
|
|
18
|
+
import { property as o } from "lit/decorators.js";
|
|
19
|
+
import { a as d } from "./base-CCsOyfm4.js";
|
|
19
20
|
import { F as b } from "./focus-visible-DBlJGoEW.js";
|
|
20
21
|
var f = Object.defineProperty, m = Object.getOwnPropertyDescriptor, l = (a, t, e, i) => {
|
|
21
22
|
for (var s = i > 1 ? void 0 : i ? m(t, e) : t, n = a.length - 1, u; n >= 0; n--)
|
|
@@ -15,4 +15,4 @@
|
|
|
15
15
|
* OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
|
-
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const
|
|
18
|
+
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const p=require("@luzmo/icons"),c=require("../base-CaRKlVkL.cjs"),r=require("lit/decorators.js"),m=require("lit/directives/if-defined.js"),d=":host{pointer-events:none;transform:none;transform:var(--luzmo-icon-transform, none);inline-size:var(--luzmo-icon-inline-size, var(--luzmo-icon-size, var(--icon-size)));block-size:var(--luzmo-icon-block-size, var(--luzmo-icon-size, var(--icon-size)));font-size:var(--luzmo-icon-block-size, var(--luzmo-icon-size, var(--icon-size)));color:inherit;color:var(--luzmo-icon-color, inherit);fill:currentColor;display:inline-block}::slotted(svg),:host svg,:host img{--icon-vertical-align: var(--parent-element-icon-vertical-align, -.125em);vertical-align:var(--icon-vertical-align)!important}:host([block]){display:block;vertical-align:0}:host([block]) svg,:host([block]) img{--icon-vertical-align: var(--parent-element-icon-vertical-align, 0)}:host([size=xxs]){--icon-size: var(--luzmo-icon-size-xxs)}:host([size=xs]){--icon-size: var(--luzmo-icon-size-xs)}:host([size=s]){--icon-size: var(--luzmo-icon-size-s)}:host,:host([size=m]){--icon-size: var(--luzmo-icon-size-m)}:host([size=l]){--icon-size: var(--luzmo-icon-size-l)}:host([size=xl]){--icon-size: var(--luzmo-icon-size-xl)}:host([size=xxl]){--icon-size: var(--luzmo-icon-size-xxl)}:host(:not(:root)){overflow:visible}@media (forced-colors: active){:host{forced-color-adjust:auto}}img,svg,::slotted(*){height:100%;width:100%;vertical-align:top;color:inherit}@media (forced-colors: active){img,svg,::slotted(*){forced-color-adjust:auto}}";var h=Object.defineProperty,z=(i,o,n,v)=>{for(var e=void 0,t=i.length-1,l;t>=0;t--)(l=i[t])&&(e=l(o,n,e)||e);return e&&h(o,n,e),e};class u extends c.LuzmoElement{constructor(){super(...arguments),this.label=""}static get styles(){return[c.r(d)]}connectedCallback(){super.connectedCallback()}disconnectedCallback(){super.disconnectedCallback()}update(o){o.has("label")&&(this.label?this.removeAttribute("aria-hidden"):this.setAttribute("aria-hidden","true")),super.update(o)}render(){return c.x` <slot></slot> `}}z([r.property({reflect:!0})],u.prototype,"label");z([r.property({reflect:!0})],u.prototype,"size");var f=Object.defineProperty,a=(i,o,n,v)=>{for(var e=void 0,t=i.length-1,l;t>=0;t--)(l=i[t])&&(e=l(o,n,e)||e);return e&&f(o,n,e),e};class s extends u{constructor(){super(...arguments),this.block=!1}render(){return this.icon?p.luzmoIcon(this.icon,this.options):this.src?c.x` <img src=${this.src} alt=${m.ifDefined(this.label)} /> `:super.render()}}a([r.property()],s.prototype,"src");a([r.property()],s.prototype,"options");a([r.property()],s.prototype,"icon");a([r.property({type:Boolean})],s.prototype,"block");customElements.get("luzmo-icon")||customElements.define("luzmo-icon",s);exports.LuzmoIcon=s;
|
package/components/icon/index.js
CHANGED
|
@@ -16,9 +16,9 @@
|
|
|
16
16
|
* SOFTWARE.
|
|
17
17
|
* */
|
|
18
18
|
import { luzmoIcon as f } from "@luzmo/icons";
|
|
19
|
-
import {
|
|
20
|
-
import {
|
|
21
|
-
import {
|
|
19
|
+
import { a as b, r as p, x as m } from "../base-CCsOyfm4.js";
|
|
20
|
+
import { property as i } from "lit/decorators.js";
|
|
21
|
+
import { ifDefined as g } from "lit/directives/if-defined.js";
|
|
22
22
|
const d = () => {
|
|
23
23
|
if (typeof document < "u" && !document.querySelector("style[data-luzmo-vars]")) {
|
|
24
24
|
const e = document.createElement("style");
|
|
@@ -32,12 +32,12 @@ var v = Object.defineProperty, a = (e, l, t, z) => {
|
|
|
32
32
|
(c = e[r]) && (o = c(l, t, o) || o);
|
|
33
33
|
return o && v(l, t, o), o;
|
|
34
34
|
};
|
|
35
|
-
class u extends
|
|
35
|
+
class u extends b {
|
|
36
36
|
constructor() {
|
|
37
37
|
super(...arguments), this.label = "";
|
|
38
38
|
}
|
|
39
39
|
static get styles() {
|
|
40
|
-
return [
|
|
40
|
+
return [p(h)];
|
|
41
41
|
}
|
|
42
42
|
connectedCallback() {
|
|
43
43
|
super.connectedCallback();
|
|
@@ -68,7 +68,7 @@ class n extends u {
|
|
|
68
68
|
super(...arguments), this.block = !1;
|
|
69
69
|
}
|
|
70
70
|
render() {
|
|
71
|
-
return this.icon ? f(this.icon, this.options) : this.src ? m` <img src=${this.src} alt=${
|
|
71
|
+
return this.icon ? f(this.icon, this.options) : this.src ? m` <img src=${this.src} alt=${g(this.label)} /> ` : super.render();
|
|
72
72
|
}
|
|
73
73
|
}
|
|
74
74
|
s([
|