next-flow-design 1.5.3 → 1.5.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/dist/components/nf-input-number/nf-input-number.d.ts +4 -3
- package/dist/index.css +1 -1
- package/dist/index.js +221 -205
- package/dist/react/index.js +352 -336
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1,16 +1,16 @@
|
|
|
1
1
|
import { css as E, LitElement as R, html as f } from "lit";
|
|
2
|
-
const Y = globalThis,
|
|
2
|
+
const Y = globalThis, re = Y.ShadowRoot && (Y.ShadyCSS === void 0 || Y.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, we = /* @__PURE__ */ Symbol(), ce = /* @__PURE__ */ new WeakMap();
|
|
3
3
|
let Se = class {
|
|
4
|
-
constructor(e, o,
|
|
5
|
-
if (this._$cssResult$ = !0,
|
|
4
|
+
constructor(e, o, r) {
|
|
5
|
+
if (this._$cssResult$ = !0, r !== we) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
|
|
6
6
|
this.cssText = e, this.t = o;
|
|
7
7
|
}
|
|
8
8
|
get styleSheet() {
|
|
9
9
|
let e = this.o;
|
|
10
10
|
const o = this.t;
|
|
11
|
-
if (
|
|
12
|
-
const
|
|
13
|
-
|
|
11
|
+
if (re && e === void 0) {
|
|
12
|
+
const r = o !== void 0 && o.length === 1;
|
|
13
|
+
r && (e = ce.get(o)), e === void 0 && ((this.o = e = new CSSStyleSheet()).replaceSync(this.cssText), r && ce.set(o, e));
|
|
14
14
|
}
|
|
15
15
|
return e;
|
|
16
16
|
}
|
|
@@ -19,14 +19,14 @@ let Se = class {
|
|
|
19
19
|
}
|
|
20
20
|
};
|
|
21
21
|
const Ce = (t) => new Se(typeof t == "string" ? t : t + "", void 0, we), Pe = (t, e) => {
|
|
22
|
-
if (
|
|
22
|
+
if (re) t.adoptedStyleSheets = e.map((o) => o instanceof CSSStyleSheet ? o : o.styleSheet);
|
|
23
23
|
else for (const o of e) {
|
|
24
|
-
const
|
|
25
|
-
|
|
24
|
+
const r = document.createElement("style"), s = Y.litNonce;
|
|
25
|
+
s !== void 0 && r.setAttribute("nonce", s), r.textContent = o.cssText, t.appendChild(r);
|
|
26
26
|
}
|
|
27
|
-
}, de =
|
|
27
|
+
}, de = re ? (t) => t : (t) => t instanceof CSSStyleSheet ? ((e) => {
|
|
28
28
|
let o = "";
|
|
29
|
-
for (const
|
|
29
|
+
for (const r of e.cssRules) o += r.cssText;
|
|
30
30
|
return Ce(o);
|
|
31
31
|
})(t) : t;
|
|
32
32
|
const { is: Me, defineProperty: De, getOwnPropertyDescriptor: Te, getOwnPropertyNames: Oe, getOwnPropertySymbols: Be, getPrototypeOf: Ve } = Object, Q = globalThis, ue = Q.trustedTypes, He = ue ? ue.emptyScript : "", Ne = Q.reactiveElementPolyfillSupport, U = (t, e) => t, X = { toAttribute(t, e) {
|
|
@@ -57,7 +57,7 @@ const { is: Me, defineProperty: De, getOwnPropertyDescriptor: Te, getOwnProperty
|
|
|
57
57
|
}
|
|
58
58
|
}
|
|
59
59
|
return o;
|
|
60
|
-
} },
|
|
60
|
+
} }, se = (t, e) => !Me(t, e), pe = { attribute: !0, type: String, converter: X, reflect: !1, useDefault: !1, hasChanged: se };
|
|
61
61
|
Symbol.metadata ??= /* @__PURE__ */ Symbol("metadata"), Q.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
|
|
62
62
|
let B = class extends HTMLElement {
|
|
63
63
|
static addInitializer(e) {
|
|
@@ -68,19 +68,19 @@ let B = class extends HTMLElement {
|
|
|
68
68
|
}
|
|
69
69
|
static createProperty(e, o = pe) {
|
|
70
70
|
if (o.state && (o.attribute = !1), this._$Ei(), this.prototype.hasOwnProperty(e) && ((o = Object.create(o)).wrapped = !0), this.elementProperties.set(e, o), !o.noAccessor) {
|
|
71
|
-
const
|
|
72
|
-
|
|
71
|
+
const r = /* @__PURE__ */ Symbol(), s = this.getPropertyDescriptor(e, r, o);
|
|
72
|
+
s !== void 0 && De(this.prototype, e, s);
|
|
73
73
|
}
|
|
74
74
|
}
|
|
75
|
-
static getPropertyDescriptor(e, o,
|
|
76
|
-
const { get:
|
|
75
|
+
static getPropertyDescriptor(e, o, r) {
|
|
76
|
+
const { get: s, set: i } = Te(this.prototype, e) ?? { get() {
|
|
77
77
|
return this[o];
|
|
78
78
|
}, set(n) {
|
|
79
79
|
this[o] = n;
|
|
80
80
|
} };
|
|
81
|
-
return { get:
|
|
82
|
-
const l =
|
|
83
|
-
i?.call(this, n), this.requestUpdate(e, l,
|
|
81
|
+
return { get: s, set(n) {
|
|
82
|
+
const l = s?.call(this);
|
|
83
|
+
i?.call(this, n), this.requestUpdate(e, l, r);
|
|
84
84
|
}, configurable: !0, enumerable: !0 };
|
|
85
85
|
}
|
|
86
86
|
static getPropertyOptions(e) {
|
|
@@ -94,32 +94,32 @@ let B = class extends HTMLElement {
|
|
|
94
94
|
static finalize() {
|
|
95
95
|
if (this.hasOwnProperty(U("finalized"))) return;
|
|
96
96
|
if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(U("properties"))) {
|
|
97
|
-
const o = this.properties,
|
|
98
|
-
for (const
|
|
97
|
+
const o = this.properties, r = [...Oe(o), ...Be(o)];
|
|
98
|
+
for (const s of r) this.createProperty(s, o[s]);
|
|
99
99
|
}
|
|
100
100
|
const e = this[Symbol.metadata];
|
|
101
101
|
if (e !== null) {
|
|
102
102
|
const o = litPropertyMetadata.get(e);
|
|
103
|
-
if (o !== void 0) for (const [
|
|
103
|
+
if (o !== void 0) for (const [r, s] of o) this.elementProperties.set(r, s);
|
|
104
104
|
}
|
|
105
105
|
this._$Eh = /* @__PURE__ */ new Map();
|
|
106
|
-
for (const [o,
|
|
107
|
-
const
|
|
108
|
-
|
|
106
|
+
for (const [o, r] of this.elementProperties) {
|
|
107
|
+
const s = this._$Eu(o, r);
|
|
108
|
+
s !== void 0 && this._$Eh.set(s, o);
|
|
109
109
|
}
|
|
110
110
|
this.elementStyles = this.finalizeStyles(this.styles);
|
|
111
111
|
}
|
|
112
112
|
static finalizeStyles(e) {
|
|
113
113
|
const o = [];
|
|
114
114
|
if (Array.isArray(e)) {
|
|
115
|
-
const
|
|
116
|
-
for (const
|
|
115
|
+
const r = new Set(e.flat(1 / 0).reverse());
|
|
116
|
+
for (const s of r) o.unshift(de(s));
|
|
117
117
|
} else e !== void 0 && o.push(de(e));
|
|
118
118
|
return o;
|
|
119
119
|
}
|
|
120
120
|
static _$Eu(e, o) {
|
|
121
|
-
const
|
|
122
|
-
return
|
|
121
|
+
const r = o.attribute;
|
|
122
|
+
return r === !1 ? void 0 : typeof r == "string" ? r : typeof e == "string" ? e.toLowerCase() : void 0;
|
|
123
123
|
}
|
|
124
124
|
constructor() {
|
|
125
125
|
super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
|
|
@@ -135,7 +135,7 @@ let B = class extends HTMLElement {
|
|
|
135
135
|
}
|
|
136
136
|
_$E_() {
|
|
137
137
|
const e = /* @__PURE__ */ new Map(), o = this.constructor.elementProperties;
|
|
138
|
-
for (const
|
|
138
|
+
for (const r of o.keys()) this.hasOwnProperty(r) && (e.set(r, this[r]), delete this[r]);
|
|
139
139
|
e.size > 0 && (this._$Ep = e);
|
|
140
140
|
}
|
|
141
141
|
createRenderRoot() {
|
|
@@ -150,35 +150,35 @@ let B = class extends HTMLElement {
|
|
|
150
150
|
disconnectedCallback() {
|
|
151
151
|
this._$EO?.forEach((e) => e.hostDisconnected?.());
|
|
152
152
|
}
|
|
153
|
-
attributeChangedCallback(e, o,
|
|
154
|
-
this._$AK(e,
|
|
153
|
+
attributeChangedCallback(e, o, r) {
|
|
154
|
+
this._$AK(e, r);
|
|
155
155
|
}
|
|
156
156
|
_$ET(e, o) {
|
|
157
|
-
const
|
|
158
|
-
if (
|
|
159
|
-
const i = (
|
|
160
|
-
this._$Em = e, i == null ? this.removeAttribute(
|
|
157
|
+
const r = this.constructor.elementProperties.get(e), s = this.constructor._$Eu(e, r);
|
|
158
|
+
if (s !== void 0 && r.reflect === !0) {
|
|
159
|
+
const i = (r.converter?.toAttribute !== void 0 ? r.converter : X).toAttribute(o, r.type);
|
|
160
|
+
this._$Em = e, i == null ? this.removeAttribute(s) : this.setAttribute(s, i), this._$Em = null;
|
|
161
161
|
}
|
|
162
162
|
}
|
|
163
163
|
_$AK(e, o) {
|
|
164
|
-
const
|
|
165
|
-
if (
|
|
166
|
-
const i =
|
|
167
|
-
this._$Em =
|
|
164
|
+
const r = this.constructor, s = r._$Eh.get(e);
|
|
165
|
+
if (s !== void 0 && this._$Em !== s) {
|
|
166
|
+
const i = r.getPropertyOptions(s), n = typeof i.converter == "function" ? { fromAttribute: i.converter } : i.converter?.fromAttribute !== void 0 ? i.converter : X;
|
|
167
|
+
this._$Em = s;
|
|
168
168
|
const l = n.fromAttribute(o, i.type);
|
|
169
|
-
this[
|
|
169
|
+
this[s] = l ?? this._$Ej?.get(s) ?? l, this._$Em = null;
|
|
170
170
|
}
|
|
171
171
|
}
|
|
172
|
-
requestUpdate(e, o,
|
|
172
|
+
requestUpdate(e, o, r, s = !1, i) {
|
|
173
173
|
if (e !== void 0) {
|
|
174
174
|
const n = this.constructor;
|
|
175
|
-
if (
|
|
176
|
-
this.C(e, o,
|
|
175
|
+
if (s === !1 && (i = this[e]), r ??= n.getPropertyOptions(e), !((r.hasChanged ?? se)(i, o) || r.useDefault && r.reflect && i === this._$Ej?.get(e) && !this.hasAttribute(n._$Eu(e, r)))) return;
|
|
176
|
+
this.C(e, o, r);
|
|
177
177
|
}
|
|
178
178
|
this.isUpdatePending === !1 && (this._$ES = this._$EP());
|
|
179
179
|
}
|
|
180
|
-
C(e, o, { useDefault:
|
|
181
|
-
|
|
180
|
+
C(e, o, { useDefault: r, reflect: s, wrapped: i }, n) {
|
|
181
|
+
r && !(this._$Ej ??= /* @__PURE__ */ new Map()).has(e) && (this._$Ej.set(e, n ?? o ?? this[e]), i !== !0 || n !== void 0) || (this._$AL.has(e) || (this.hasUpdated || r || (o = void 0), this._$AL.set(e, o)), s === !0 && this._$Em !== e && (this._$Eq ??= /* @__PURE__ */ new Set()).add(e));
|
|
182
182
|
}
|
|
183
183
|
async _$EP() {
|
|
184
184
|
this.isUpdatePending = !0;
|
|
@@ -197,21 +197,21 @@ let B = class extends HTMLElement {
|
|
|
197
197
|
if (!this.isUpdatePending) return;
|
|
198
198
|
if (!this.hasUpdated) {
|
|
199
199
|
if (this.renderRoot ??= this.createRenderRoot(), this._$Ep) {
|
|
200
|
-
for (const [
|
|
200
|
+
for (const [s, i] of this._$Ep) this[s] = i;
|
|
201
201
|
this._$Ep = void 0;
|
|
202
202
|
}
|
|
203
|
-
const
|
|
204
|
-
if (
|
|
205
|
-
const { wrapped: n } = i, l = this[
|
|
206
|
-
n !== !0 || this._$AL.has(
|
|
203
|
+
const r = this.constructor.elementProperties;
|
|
204
|
+
if (r.size > 0) for (const [s, i] of r) {
|
|
205
|
+
const { wrapped: n } = i, l = this[s];
|
|
206
|
+
n !== !0 || this._$AL.has(s) || l === void 0 || this.C(s, void 0, i, l);
|
|
207
207
|
}
|
|
208
208
|
}
|
|
209
209
|
let e = !1;
|
|
210
210
|
const o = this._$AL;
|
|
211
211
|
try {
|
|
212
|
-
e = this.shouldUpdate(o), e ? (this.willUpdate(o), this._$EO?.forEach((
|
|
213
|
-
} catch (
|
|
214
|
-
throw e = !1, this._$EM(),
|
|
212
|
+
e = this.shouldUpdate(o), e ? (this.willUpdate(o), this._$EO?.forEach((r) => r.hostUpdate?.()), this.update(o)) : this._$EM();
|
|
213
|
+
} catch (r) {
|
|
214
|
+
throw e = !1, this._$EM(), r;
|
|
215
215
|
}
|
|
216
216
|
e && this._$AE(o);
|
|
217
217
|
}
|
|
@@ -241,10 +241,10 @@ let B = class extends HTMLElement {
|
|
|
241
241
|
}
|
|
242
242
|
};
|
|
243
243
|
B.elementStyles = [], B.shadowRootOptions = { mode: "open" }, B[U("elementProperties")] = /* @__PURE__ */ new Map(), B[U("finalized")] = /* @__PURE__ */ new Map(), Ne?.({ ReactiveElement: B }), (Q.reactiveElementVersions ??= []).push("2.1.2");
|
|
244
|
-
const Ue = { attribute: !0, type: String, converter: X, reflect: !1, hasChanged:
|
|
245
|
-
const { kind:
|
|
246
|
-
let i = globalThis.litPropertyMetadata.get(
|
|
247
|
-
if (i === void 0 && globalThis.litPropertyMetadata.set(
|
|
244
|
+
const Ue = { attribute: !0, type: String, converter: X, reflect: !1, hasChanged: se }, Fe = (t = Ue, e, o) => {
|
|
245
|
+
const { kind: r, metadata: s } = o;
|
|
246
|
+
let i = globalThis.litPropertyMetadata.get(s);
|
|
247
|
+
if (i === void 0 && globalThis.litPropertyMetadata.set(s, i = /* @__PURE__ */ new Map()), r === "setter" && ((t = Object.create(t)).wrapped = !0), i.set(o.name, t), r === "accessor") {
|
|
248
248
|
const { name: n } = o;
|
|
249
249
|
return { set(l) {
|
|
250
250
|
const a = e.get.call(this);
|
|
@@ -253,85 +253,85 @@ const Ue = { attribute: !0, type: String, converter: X, reflect: !1, hasChanged:
|
|
|
253
253
|
return l !== void 0 && this.C(n, void 0, t, l), l;
|
|
254
254
|
} };
|
|
255
255
|
}
|
|
256
|
-
if (
|
|
256
|
+
if (r === "setter") {
|
|
257
257
|
const { name: n } = o;
|
|
258
258
|
return function(l) {
|
|
259
259
|
const a = this[n];
|
|
260
260
|
e.call(this, l), this.requestUpdate(n, a, t, !0, l);
|
|
261
261
|
};
|
|
262
262
|
}
|
|
263
|
-
throw Error("Unsupported decorator location: " +
|
|
263
|
+
throw Error("Unsupported decorator location: " + r);
|
|
264
264
|
};
|
|
265
265
|
function h(t) {
|
|
266
|
-
return (e, o) => typeof o == "object" ?
|
|
267
|
-
const n =
|
|
268
|
-
return
|
|
266
|
+
return (e, o) => typeof o == "object" ? Fe(t, e, o) : ((r, s, i) => {
|
|
267
|
+
const n = s.hasOwnProperty(i);
|
|
268
|
+
return s.constructor.createProperty(i, r), n ? Object.getOwnPropertyDescriptor(s, i) : void 0;
|
|
269
269
|
})(t, e, o);
|
|
270
270
|
}
|
|
271
271
|
function w(t) {
|
|
272
272
|
return h({ ...t, state: !0, attribute: !1 });
|
|
273
273
|
}
|
|
274
|
-
const ie = globalThis, fe = (t) => t, G = ie.trustedTypes, be = G ? G.createPolicy("lit-html", { createHTML: (t) => t }) : void 0, $e = "$lit$", A = `lit$${Math.random().toFixed(9).slice(2)}$`, xe = "?" + A,
|
|
274
|
+
const ie = globalThis, fe = (t) => t, G = ie.trustedTypes, be = G ? G.createPolicy("lit-html", { createHTML: (t) => t }) : void 0, $e = "$lit$", A = `lit$${Math.random().toFixed(9).slice(2)}$`, xe = "?" + A, Le = `<${xe}>`, P = document, F = () => P.createComment(""), L = (t) => t === null || typeof t != "object" && typeof t != "function", ne = Array.isArray, ze = (t) => ne(t) || typeof t?.[Symbol.iterator] == "function", te = `[
|
|
275
275
|
\f\r]`, N = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, me = /-->/g, ge = />/g, S = RegExp(`>|${te}(?:([^\\s"'>=/]+)(${te}*=${te}*(?:[^
|
|
276
|
-
\f\r"'\`<>=]|("|')|))|$)`, "g"), ve = /'/g, _e = /"/g, ke = /^(?:script|style|textarea|title)$/i,
|
|
276
|
+
\f\r"'\`<>=]|("|')|))|$)`, "g"), ve = /'/g, _e = /"/g, ke = /^(?:script|style|textarea|title)$/i, je = (t) => (e, ...o) => ({ _$litType$: t, strings: e, values: o }), oe = je(1), M = /* @__PURE__ */ Symbol.for("lit-noChange"), b = /* @__PURE__ */ Symbol.for("lit-nothing"), ye = /* @__PURE__ */ new WeakMap(), C = P.createTreeWalker(P, 129);
|
|
277
277
|
function Ae(t, e) {
|
|
278
278
|
if (!ne(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
|
|
279
279
|
return be !== void 0 ? be.createHTML(e) : e;
|
|
280
280
|
}
|
|
281
281
|
const Ie = (t, e) => {
|
|
282
|
-
const o = t.length - 1,
|
|
283
|
-
let
|
|
282
|
+
const o = t.length - 1, r = [];
|
|
283
|
+
let s, i = e === 2 ? "<svg>" : e === 3 ? "<math>" : "", n = N;
|
|
284
284
|
for (let l = 0; l < o; l++) {
|
|
285
285
|
const a = t[l];
|
|
286
286
|
let c, u, d = -1, $ = 0;
|
|
287
|
-
for (; $ < a.length && (n.lastIndex = $, u = n.exec(a), u !== null); ) $ = n.lastIndex, n === N ? u[1] === "!--" ? n = me : u[1] !== void 0 ? n = ge : u[2] !== void 0 ? (ke.test(u[2]) && (
|
|
287
|
+
for (; $ < a.length && (n.lastIndex = $, u = n.exec(a), u !== null); ) $ = n.lastIndex, n === N ? u[1] === "!--" ? n = me : u[1] !== void 0 ? n = ge : u[2] !== void 0 ? (ke.test(u[2]) && (s = RegExp("</" + u[2], "g")), n = S) : u[3] !== void 0 && (n = S) : n === S ? u[0] === ">" ? (n = s ?? N, d = -1) : u[1] === void 0 ? d = -2 : (d = n.lastIndex - u[2].length, c = u[1], n = u[3] === void 0 ? S : u[3] === '"' ? _e : ve) : n === _e || n === ve ? n = S : n === me || n === ge ? n = N : (n = S, s = void 0);
|
|
288
288
|
const k = n === S && t[l + 1].startsWith("/>") ? " " : "";
|
|
289
|
-
i += n === N ? a +
|
|
289
|
+
i += n === N ? a + Le : d >= 0 ? (r.push(c), a.slice(0, d) + $e + a.slice(d) + A + k) : a + A + (d === -2 ? l : k);
|
|
290
290
|
}
|
|
291
|
-
return [Ae(t, i + (t[o] || "<?>") + (e === 2 ? "</svg>" : e === 3 ? "</math>" : "")),
|
|
291
|
+
return [Ae(t, i + (t[o] || "<?>") + (e === 2 ? "</svg>" : e === 3 ? "</math>" : "")), r];
|
|
292
292
|
};
|
|
293
|
-
class
|
|
294
|
-
constructor({ strings: e, _$litType$: o },
|
|
295
|
-
let
|
|
293
|
+
class z {
|
|
294
|
+
constructor({ strings: e, _$litType$: o }, r) {
|
|
295
|
+
let s;
|
|
296
296
|
this.parts = [];
|
|
297
297
|
let i = 0, n = 0;
|
|
298
298
|
const l = e.length - 1, a = this.parts, [c, u] = Ie(e, o);
|
|
299
|
-
if (this.el =
|
|
299
|
+
if (this.el = z.createElement(c, r), C.currentNode = this.el.content, o === 2 || o === 3) {
|
|
300
300
|
const d = this.el.content.firstChild;
|
|
301
301
|
d.replaceWith(...d.childNodes);
|
|
302
302
|
}
|
|
303
|
-
for (; (
|
|
304
|
-
if (
|
|
305
|
-
if (
|
|
306
|
-
const $ = u[n++], k =
|
|
307
|
-
a.push({ type: 1, index: i, name: Z[2], strings: k, ctor: Z[1] === "." ? qe : Z[1] === "?" ? We : Z[1] === "@" ? Ke : ee }),
|
|
308
|
-
} else d.startsWith(A) && (a.push({ type: 6, index: i }),
|
|
309
|
-
if (ke.test(
|
|
310
|
-
const d =
|
|
303
|
+
for (; (s = C.nextNode()) !== null && a.length < l; ) {
|
|
304
|
+
if (s.nodeType === 1) {
|
|
305
|
+
if (s.hasAttributes()) for (const d of s.getAttributeNames()) if (d.endsWith($e)) {
|
|
306
|
+
const $ = u[n++], k = s.getAttribute(d).split(A), Z = /([.?@])?(.*)/.exec($);
|
|
307
|
+
a.push({ type: 1, index: i, name: Z[2], strings: k, ctor: Z[1] === "." ? qe : Z[1] === "?" ? We : Z[1] === "@" ? Ke : ee }), s.removeAttribute(d);
|
|
308
|
+
} else d.startsWith(A) && (a.push({ type: 6, index: i }), s.removeAttribute(d));
|
|
309
|
+
if (ke.test(s.tagName)) {
|
|
310
|
+
const d = s.textContent.split(A), $ = d.length - 1;
|
|
311
311
|
if ($ > 0) {
|
|
312
|
-
|
|
313
|
-
for (let k = 0; k < $; k++)
|
|
314
|
-
|
|
312
|
+
s.textContent = G ? G.emptyScript : "";
|
|
313
|
+
for (let k = 0; k < $; k++) s.append(d[k], F()), C.nextNode(), a.push({ type: 2, index: ++i });
|
|
314
|
+
s.append(d[$], F());
|
|
315
315
|
}
|
|
316
316
|
}
|
|
317
|
-
} else if (
|
|
317
|
+
} else if (s.nodeType === 8) if (s.data === xe) a.push({ type: 2, index: i });
|
|
318
318
|
else {
|
|
319
319
|
let d = -1;
|
|
320
|
-
for (; (d =
|
|
320
|
+
for (; (d = s.data.indexOf(A, d + 1)) !== -1; ) a.push({ type: 7, index: i }), d += A.length - 1;
|
|
321
321
|
}
|
|
322
322
|
i++;
|
|
323
323
|
}
|
|
324
324
|
}
|
|
325
325
|
static createElement(e, o) {
|
|
326
|
-
const
|
|
327
|
-
return
|
|
326
|
+
const r = P.createElement("template");
|
|
327
|
+
return r.innerHTML = e, r;
|
|
328
328
|
}
|
|
329
329
|
}
|
|
330
|
-
function H(t, e, o = t,
|
|
330
|
+
function H(t, e, o = t, r) {
|
|
331
331
|
if (e === M) return e;
|
|
332
|
-
let
|
|
333
|
-
const i =
|
|
334
|
-
return
|
|
332
|
+
let s = r !== void 0 ? o._$Co?.[r] : o._$Cl;
|
|
333
|
+
const i = L(e) ? void 0 : e._$litDirective$;
|
|
334
|
+
return s?.constructor !== i && (s?._$AO?.(!1), i === void 0 ? s = void 0 : (s = new i(t), s._$AT(t, o, r)), r !== void 0 ? (o._$Co ??= [])[r] = s : o._$Cl = s), s !== void 0 && (e = H(t, s._$AS(t, e.values), s, r)), e;
|
|
335
335
|
}
|
|
336
336
|
class Re {
|
|
337
337
|
constructor(e, o) {
|
|
@@ -344,29 +344,29 @@ class Re {
|
|
|
344
344
|
return this._$AM._$AU;
|
|
345
345
|
}
|
|
346
346
|
u(e) {
|
|
347
|
-
const { el: { content: o }, parts:
|
|
348
|
-
C.currentNode =
|
|
349
|
-
let i = C.nextNode(), n = 0, l = 0, a =
|
|
347
|
+
const { el: { content: o }, parts: r } = this._$AD, s = (e?.creationScope ?? P).importNode(o, !0);
|
|
348
|
+
C.currentNode = s;
|
|
349
|
+
let i = C.nextNode(), n = 0, l = 0, a = r[0];
|
|
350
350
|
for (; a !== void 0; ) {
|
|
351
351
|
if (n === a.index) {
|
|
352
352
|
let c;
|
|
353
|
-
a.type === 2 ? c = new q(i, i.nextSibling, this, e) : a.type === 1 ? c = new a.ctor(i, a.name, a.strings, this, e) : a.type === 6 && (c = new Ze(i, this, e)), this._$AV.push(c), a =
|
|
353
|
+
a.type === 2 ? c = new q(i, i.nextSibling, this, e) : a.type === 1 ? c = new a.ctor(i, a.name, a.strings, this, e) : a.type === 6 && (c = new Ze(i, this, e)), this._$AV.push(c), a = r[++l];
|
|
354
354
|
}
|
|
355
355
|
n !== a?.index && (i = C.nextNode(), n++);
|
|
356
356
|
}
|
|
357
|
-
return C.currentNode = P,
|
|
357
|
+
return C.currentNode = P, s;
|
|
358
358
|
}
|
|
359
359
|
p(e) {
|
|
360
360
|
let o = 0;
|
|
361
|
-
for (const
|
|
361
|
+
for (const r of this._$AV) r !== void 0 && (r.strings !== void 0 ? (r._$AI(e, r, o), o += r.strings.length - 2) : r._$AI(e[o])), o++;
|
|
362
362
|
}
|
|
363
363
|
}
|
|
364
364
|
class q {
|
|
365
365
|
get _$AU() {
|
|
366
366
|
return this._$AM?._$AU ?? this._$Cv;
|
|
367
367
|
}
|
|
368
|
-
constructor(e, o,
|
|
369
|
-
this.type = 2, this._$AH = b, this._$AN = void 0, this._$AA = e, this._$AB = o, this._$AM =
|
|
368
|
+
constructor(e, o, r, s) {
|
|
369
|
+
this.type = 2, this._$AH = b, this._$AN = void 0, this._$AA = e, this._$AB = o, this._$AM = r, this.options = s, this._$Cv = s?.isConnected ?? !0;
|
|
370
370
|
}
|
|
371
371
|
get parentNode() {
|
|
372
372
|
let e = this._$AA.parentNode;
|
|
@@ -380,7 +380,7 @@ class q {
|
|
|
380
380
|
return this._$AB;
|
|
381
381
|
}
|
|
382
382
|
_$AI(e, o = this) {
|
|
383
|
-
e = H(this, e, o),
|
|
383
|
+
e = H(this, e, o), L(e) ? e === b || e == null || e === "" ? (this._$AH !== b && this._$AR(), this._$AH = b) : e !== this._$AH && e !== M && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : ze(e) ? this.k(e) : this._(e);
|
|
384
384
|
}
|
|
385
385
|
O(e) {
|
|
386
386
|
return this._$AA.parentNode.insertBefore(e, this._$AB);
|
|
@@ -389,31 +389,31 @@ class q {
|
|
|
389
389
|
this._$AH !== e && (this._$AR(), this._$AH = this.O(e));
|
|
390
390
|
}
|
|
391
391
|
_(e) {
|
|
392
|
-
this._$AH !== b &&
|
|
392
|
+
this._$AH !== b && L(this._$AH) ? this._$AA.nextSibling.data = e : this.T(P.createTextNode(e)), this._$AH = e;
|
|
393
393
|
}
|
|
394
394
|
$(e) {
|
|
395
|
-
const { values: o, _$litType$:
|
|
396
|
-
if (this._$AH?._$AD ===
|
|
395
|
+
const { values: o, _$litType$: r } = e, s = typeof r == "number" ? this._$AC(e) : (r.el === void 0 && (r.el = z.createElement(Ae(r.h, r.h[0]), this.options)), r);
|
|
396
|
+
if (this._$AH?._$AD === s) this._$AH.p(o);
|
|
397
397
|
else {
|
|
398
|
-
const i = new Re(
|
|
398
|
+
const i = new Re(s, this), n = i.u(this.options);
|
|
399
399
|
i.p(o), this.T(n), this._$AH = i;
|
|
400
400
|
}
|
|
401
401
|
}
|
|
402
402
|
_$AC(e) {
|
|
403
403
|
let o = ye.get(e.strings);
|
|
404
|
-
return o === void 0 && ye.set(e.strings, o = new
|
|
404
|
+
return o === void 0 && ye.set(e.strings, o = new z(e)), o;
|
|
405
405
|
}
|
|
406
406
|
k(e) {
|
|
407
407
|
ne(this._$AH) || (this._$AH = [], this._$AR());
|
|
408
408
|
const o = this._$AH;
|
|
409
|
-
let
|
|
410
|
-
for (const i of e)
|
|
411
|
-
|
|
409
|
+
let r, s = 0;
|
|
410
|
+
for (const i of e) s === o.length ? o.push(r = new q(this.O(F()), this.O(F()), this, this.options)) : r = o[s], r._$AI(i), s++;
|
|
411
|
+
s < o.length && (this._$AR(r && r._$AB.nextSibling, s), o.length = s);
|
|
412
412
|
}
|
|
413
413
|
_$AR(e = this._$AA.nextSibling, o) {
|
|
414
414
|
for (this._$AP?.(!1, !0, o); e !== this._$AB; ) {
|
|
415
|
-
const
|
|
416
|
-
fe(e).remove(), e =
|
|
415
|
+
const r = fe(e).nextSibling;
|
|
416
|
+
fe(e).remove(), e = r;
|
|
417
417
|
}
|
|
418
418
|
}
|
|
419
419
|
setConnected(e) {
|
|
@@ -427,19 +427,19 @@ class ee {
|
|
|
427
427
|
get _$AU() {
|
|
428
428
|
return this._$AM._$AU;
|
|
429
429
|
}
|
|
430
|
-
constructor(e, o,
|
|
431
|
-
this.type = 1, this._$AH = b, this._$AN = void 0, this.element = e, this.name = o, this._$AM =
|
|
430
|
+
constructor(e, o, r, s, i) {
|
|
431
|
+
this.type = 1, this._$AH = b, this._$AN = void 0, this.element = e, this.name = o, this._$AM = s, this.options = i, r.length > 2 || r[0] !== "" || r[1] !== "" ? (this._$AH = Array(r.length - 1).fill(new String()), this.strings = r) : this._$AH = b;
|
|
432
432
|
}
|
|
433
|
-
_$AI(e, o = this,
|
|
433
|
+
_$AI(e, o = this, r, s) {
|
|
434
434
|
const i = this.strings;
|
|
435
435
|
let n = !1;
|
|
436
|
-
if (i === void 0) e = H(this, e, o, 0), n = !
|
|
436
|
+
if (i === void 0) e = H(this, e, o, 0), n = !L(e) || e !== this._$AH && e !== M, n && (this._$AH = e);
|
|
437
437
|
else {
|
|
438
438
|
const l = e;
|
|
439
439
|
let a, c;
|
|
440
|
-
for (e = i[0], a = 0; a < i.length - 1; a++) c = H(this, l[
|
|
440
|
+
for (e = i[0], a = 0; a < i.length - 1; a++) c = H(this, l[r + a], o, a), c === M && (c = this._$AH[a]), n ||= !L(c) || c !== this._$AH[a], c === b ? e = b : e !== b && (e += (c ?? "") + i[a + 1]), this._$AH[a] = c;
|
|
441
441
|
}
|
|
442
|
-
n && !
|
|
442
|
+
n && !s && this.j(e);
|
|
443
443
|
}
|
|
444
444
|
j(e) {
|
|
445
445
|
e === b ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, e ?? "");
|
|
@@ -462,21 +462,21 @@ class We extends ee {
|
|
|
462
462
|
}
|
|
463
463
|
}
|
|
464
464
|
class Ke extends ee {
|
|
465
|
-
constructor(e, o,
|
|
466
|
-
super(e, o,
|
|
465
|
+
constructor(e, o, r, s, i) {
|
|
466
|
+
super(e, o, r, s, i), this.type = 5;
|
|
467
467
|
}
|
|
468
468
|
_$AI(e, o = this) {
|
|
469
469
|
if ((e = H(this, e, o, 0) ?? b) === M) return;
|
|
470
|
-
const
|
|
471
|
-
|
|
470
|
+
const r = this._$AH, s = e === b && r !== b || e.capture !== r.capture || e.once !== r.once || e.passive !== r.passive, i = e !== b && (r === b || s);
|
|
471
|
+
s && this.element.removeEventListener(this.name, this, r), i && this.element.addEventListener(this.name, this, e), this._$AH = e;
|
|
472
472
|
}
|
|
473
473
|
handleEvent(e) {
|
|
474
474
|
typeof this._$AH == "function" ? this._$AH.call(this.options?.host ?? this.element, e) : this._$AH.handleEvent(e);
|
|
475
475
|
}
|
|
476
476
|
}
|
|
477
477
|
class Ze {
|
|
478
|
-
constructor(e, o,
|
|
479
|
-
this.element = e, this.type = 6, this._$AN = void 0, this._$AM = o, this.options =
|
|
478
|
+
constructor(e, o, r) {
|
|
479
|
+
this.element = e, this.type = 6, this._$AN = void 0, this._$AM = o, this.options = r;
|
|
480
480
|
}
|
|
481
481
|
get _$AU() {
|
|
482
482
|
return this._$AM._$AU;
|
|
@@ -486,15 +486,15 @@ class Ze {
|
|
|
486
486
|
}
|
|
487
487
|
}
|
|
488
488
|
const Ye = ie.litHtmlPolyfillSupport;
|
|
489
|
-
Ye?.(
|
|
489
|
+
Ye?.(z, q), (ie.litHtmlVersions ??= []).push("3.3.2");
|
|
490
490
|
const Xe = (t, e, o) => {
|
|
491
|
-
const
|
|
492
|
-
let
|
|
493
|
-
if (
|
|
491
|
+
const r = o?.renderBefore ?? e;
|
|
492
|
+
let s = r._$litPart$;
|
|
493
|
+
if (s === void 0) {
|
|
494
494
|
const i = o?.renderBefore ?? null;
|
|
495
|
-
|
|
495
|
+
r._$litPart$ = s = new q(e.insertBefore(F(), i), i, void 0, o ?? {});
|
|
496
496
|
}
|
|
497
|
-
return
|
|
497
|
+
return s._$AI(t), s;
|
|
498
498
|
};
|
|
499
499
|
const ae = globalThis;
|
|
500
500
|
let V = class extends B {
|
|
@@ -524,12 +524,12 @@ const Ge = ae.litElementPolyfillSupport;
|
|
|
524
524
|
Ge?.({ LitElement: V });
|
|
525
525
|
(ae.litElementVersions ??= []).push("4.2.2");
|
|
526
526
|
const Je = E`:host{cursor:pointer;-webkit-user-select:none;user-select:none;width:calc(1rem + 2px);height:calc(1rem + 2px)}:host([disabled]){cursor:not-allowed;opacity:.6}.checkbox-container{position:relative;transition:opacity .2s ease}.checkbox-box{width:1rem;height:1rem;border-radius:.25rem;background-color:var(--nf-background-color);border:1px solid var(--nf-border-color);display:flex;align-items:center;justify-content:center;transition:background-color .2s ease,border-color .2s ease}:host(:hover:not([checked]):not([disabled])) .checkbox-box{border-color:var(--nf-primary-color,var(--nf-primary-color))}:host([checked]) .checkbox-box{background-color:var(--nf-primary-color,var(--nf-primary-color));border-color:var(--nf-primary-color,var(--nf-primary-color))}:host([disabled]) .checkbox-box{border-color:#fffc;background:#fffc;cursor:not-allowed;pointer-events:none}:host([disabled][checked]) .checkbox-box{background-color:#fffc;border-color:#fffc}.checkbox-icon{color:#fff;font-size:.75rem;line-height:1;font-weight:700;transition:transform .2s ease;display:flex;align-items:center}:host([checked]) .checkbox-icon{transform:scale(1)}:host(:focus) .checkbox-container{outline:.125rem solid var(--nf-primary-color,var(--nf-primary-color));outline-offset:.125rem}`, T = (t) => (e) => (typeof window > "u" || customElements.get(t) || customElements.define(t, e), e);
|
|
527
|
-
var Qe = Object.defineProperty, et = Object.getOwnPropertyDescriptor, le = (t, e, o,
|
|
528
|
-
for (var
|
|
529
|
-
(n = t[i]) && (
|
|
530
|
-
return
|
|
527
|
+
var Qe = Object.defineProperty, et = Object.getOwnPropertyDescriptor, le = (t, e, o, r) => {
|
|
528
|
+
for (var s = r > 1 ? void 0 : r ? et(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
529
|
+
(n = t[i]) && (s = (r ? n(e, o, s) : n(s)) || s);
|
|
530
|
+
return r && s && Qe(e, o, s), s;
|
|
531
531
|
};
|
|
532
|
-
let
|
|
532
|
+
let j = class extends V {
|
|
533
533
|
constructor() {
|
|
534
534
|
super(...arguments), this.checked = !1, this.disabled = !1;
|
|
535
535
|
}
|
|
@@ -553,25 +553,25 @@ let z = class extends V {
|
|
|
553
553
|
});
|
|
554
554
|
}
|
|
555
555
|
};
|
|
556
|
-
|
|
556
|
+
j.styles = [Je];
|
|
557
557
|
le([
|
|
558
558
|
h({ type: Boolean, reflect: !0 })
|
|
559
|
-
],
|
|
559
|
+
], j.prototype, "checked", 2);
|
|
560
560
|
le([
|
|
561
561
|
h({ type: Boolean, reflect: !0 })
|
|
562
|
-
],
|
|
563
|
-
|
|
562
|
+
], j.prototype, "disabled", 2);
|
|
563
|
+
j = le([
|
|
564
564
|
T("nf-checkbox")
|
|
565
|
-
],
|
|
565
|
+
], j);
|
|
566
566
|
const tt = { ATTRIBUTE: 1 }, ot = (t) => (...e) => ({ _$litDirective$: t, values: e });
|
|
567
|
-
let
|
|
567
|
+
let rt = class {
|
|
568
568
|
constructor(e) {
|
|
569
569
|
}
|
|
570
570
|
get _$AU() {
|
|
571
571
|
return this._$AM._$AU;
|
|
572
572
|
}
|
|
573
|
-
_$AT(e, o,
|
|
574
|
-
this._$Ct = e, this._$AM = o, this._$Ci =
|
|
573
|
+
_$AT(e, o, r) {
|
|
574
|
+
this._$Ct = e, this._$AM = o, this._$Ci = r;
|
|
575
575
|
}
|
|
576
576
|
_$AS(e, o) {
|
|
577
577
|
return this.update(e, o);
|
|
@@ -580,35 +580,35 @@ let st = class {
|
|
|
580
580
|
return this.render(...o);
|
|
581
581
|
}
|
|
582
582
|
};
|
|
583
|
-
const Ee = "important",
|
|
583
|
+
const Ee = "important", st = " !" + Ee, J = ot(class extends rt {
|
|
584
584
|
constructor(t) {
|
|
585
585
|
if (super(t), t.type !== tt.ATTRIBUTE || t.name !== "style" || t.strings?.length > 2) throw Error("The `styleMap` directive must be used in the `style` attribute and must be the only part in the attribute.");
|
|
586
586
|
}
|
|
587
587
|
render(t) {
|
|
588
588
|
return Object.keys(t).reduce((e, o) => {
|
|
589
|
-
const
|
|
590
|
-
return
|
|
589
|
+
const r = t[o];
|
|
590
|
+
return r == null ? e : e + `${o = o.includes("-") ? o : o.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, "-$&").toLowerCase()}:${r};`;
|
|
591
591
|
}, "");
|
|
592
592
|
}
|
|
593
593
|
update(t, [e]) {
|
|
594
594
|
const { style: o } = t.element;
|
|
595
595
|
if (this.ft === void 0) return this.ft = new Set(Object.keys(e)), this.render(e);
|
|
596
|
-
for (const
|
|
597
|
-
for (const
|
|
598
|
-
const
|
|
599
|
-
if (
|
|
600
|
-
this.ft.add(
|
|
601
|
-
const i = typeof
|
|
602
|
-
|
|
596
|
+
for (const r of this.ft) e[r] == null && (this.ft.delete(r), r.includes("-") ? o.removeProperty(r) : o[r] = null);
|
|
597
|
+
for (const r in e) {
|
|
598
|
+
const s = e[r];
|
|
599
|
+
if (s != null) {
|
|
600
|
+
this.ft.add(r);
|
|
601
|
+
const i = typeof s == "string" && s.endsWith(st);
|
|
602
|
+
r.includes("-") || i ? o.setProperty(r, i ? s.slice(0, -11) : s, i ? Ee : "") : o[r] = s;
|
|
603
603
|
}
|
|
604
604
|
}
|
|
605
605
|
return M;
|
|
606
606
|
}
|
|
607
607
|
}), W = E`:host{display:inline-flex;align-items:center;position:relative;width:var(--nf-width);height:var(--nf-height);padding:var(--nf-padding);margin:var(--nf-margin);font-size:var(--nf-text-font-size);font-weight:var(--nf-font-weight);color:var(--nf-color);background:var(--nf-background-color);border-radius:var(--nf-border-radius);border:1px solid var(--nf-border-color);outline:0;background-clip:padding-box;box-shadow:0 0 0 .15rem var(--nf-box-shadow-color);transition:color var(--nf-transition) ease-in-out,background-color var(--nf-transition) ease-in-out,border-color var(--nf-transition) ease-in-out,box-shadow var(--nf-transition) ease-in-out}:host(:focus){border-color:var(--nf-border-color-hover);box-shadow:0 0 0 .15rem var(--nf-box-shadow-color-focus);background:var(--nf-background-color-hover)}:host(:hover:not([disabled])){border-color:var(--nf-border-color-hover);background:var(--nf-background-color-hover)}:host([disabled]){cursor:not-allowed;opacity:.6;pointer-events:auto}:host([disabled]:hover){border-color:var(--nf-border-color);background:var(--nf-background-color)}`, it = E`:host{display:inline-block;position:relative}:host([disabled]){cursor:not-allowed;opacity:.6}:host([disabled]:hover){border-color:var(--nf-border-color);background:var(--nf-background-color)}:host([open]){border-color:var(--nf-border-color-hover);box-shadow:0 0 0 .15rem var(--nf-box-shadow-color-focus)}.trigger{width:calc(100% + 1.5rem + 2px);height:calc(100% + 2px);margin:-1px -.75rem;padding:1px .75rem;box-sizing:border-box;display:flex;align-items:center;cursor:pointer;transition:all .2s;font-size:.875rem;position:relative}:host(:not([disabled])) .trigger:hover{border-color:var(--nf-color-primary)}.trigger[disabled]{cursor:not-allowed;opacity:.6}:host([disabled]) .trigger{cursor:not-allowed;color:var(--nf-color-disabled)}.color-block{width:1.25rem;height:1.25rem;border-radius:.125rem;margin-left:calc((var(--nf-height) - 1.25rem)/ 2 - .75rem);margin-right:.4rem}:host(.hide-text) .color-block{margin-right:calc((var(--nf-height) - 1.25rem)/ 2 - .75rem)}.color-text{flex:1}.panel{position:absolute;z-index:1000;background:var(--nf-color-picker-card-background,var(--nf-dropdown-background));-webkit-backdrop-filter:blur(64px);backdrop-filter:blur(64px);border-radius:var(--nf-border-radius);box-shadow:0 6px 16px 0 var(--nf-color-picker-card-shadow,var(--nf-dropdown-shadow)),0 3px 6px -4px var(--nf-color-picker-card-shadow,var(--nf-dropdown-shadow)),0 9px 28px 8px var(--nf-color-picker-card-shadow,var(--nf-dropdown-shadow));-webkit-user-select:none;user-select:none}.panel-content{padding:.75rem;width:15rem}.color-selector{height:9.375rem;position:relative;margin-bottom:.75rem;border-radius:var(--nf-border-radius);overflow:hidden}.color-sb{width:100%;height:100%;position:relative;cursor:pointer}.sb-white{position:absolute;inset:0;background:linear-gradient(to right,#fff,#fff0)}.sb-black{position:absolute;inset:0;background:linear-gradient(to top,#000,#0000)}.selector{position:absolute;width:.625rem;height:.625rem;border:.125rem solid #fff;border-radius:50%;transform:translate(-50%,-50%);box-shadow:0 0 .125rem #00000080;pointer-events:none}.slider-container{margin-bottom:.5rem}.slider-container:last-child{margin-bottom:0}.sliders-row{display:flex;align-items:center;gap:.75rem}.sliders{flex:1}.slider{position:relative;height:.75rem;border-radius:.375rem}.hue-slider{background:linear-gradient(to right,red,#ff0,#0f0,#0ff,#00f,#f0f,red)}.alpha-slider{position:relative;background-image:linear-gradient(45deg,var(--nf-color-picker-card-checker,#ccc) 25%,transparent 25%),linear-gradient(-45deg,var(--nf-color-picker-card-checker,#ccc) 25%,transparent 25%),linear-gradient(45deg,transparent 75%,var(--nf-color-picker-card-checker,#ccc) 75%),linear-gradient(-45deg,transparent 75%,var(--nf-color-picker-card-checker,#ccc) 75%);background-size:.375rem .375rem;background-position:0 0,0 .1875rem,.1875rem -.1875rem,-.1875rem 0;background-color:var(--nf-color-picker-card-checker-bg,#fff);border-radius:.375rem}.alpha-slider-input{position:relative;z-index:2}.alpha-gradient{position:absolute;inset:0;border-radius:.375rem}input[type=range]{-webkit-appearance:none;width:100%;height:100%;background:0 0;outline:0;position:absolute;top:0;left:0;margin:0;padding:0}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:1rem;height:1rem;border-radius:50%;background:#fff;border:.125rem solid var(--nf-color-border);cursor:pointer;box-shadow:0 0 .125rem #00000080;position:relative;z-index:1}input[type=range]::-moz-range-thumb{width:1rem;height:1rem;border-radius:50%;background:#fff;border:.125rem solid var(--nf-color-border);cursor:pointer;box-shadow:0 0 .125rem #00000080}.current-color-container{display:flex}.current-color{width:2rem;height:2rem;border-radius:var(--nf-border-radius);border:.0625rem solid var(--nf-color-border)}:host(:not([disabled-alpha])) .current-color{width:2.5rem;height:2.5rem}`;
|
|
608
|
-
var nt = Object.defineProperty, at = Object.getOwnPropertyDescriptor, _ = (t, e, o,
|
|
609
|
-
for (var
|
|
610
|
-
(n = t[i]) && (
|
|
611
|
-
return
|
|
608
|
+
var nt = Object.defineProperty, at = Object.getOwnPropertyDescriptor, _ = (t, e, o, r) => {
|
|
609
|
+
for (var s = r > 1 ? void 0 : r ? at(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
610
|
+
(n = t[i]) && (s = (r ? n(e, o, s) : n(s)) || s);
|
|
611
|
+
return r && s && nt(e, o, s), s;
|
|
612
612
|
};
|
|
613
613
|
let g = class extends R {
|
|
614
614
|
constructor() {
|
|
@@ -650,34 +650,34 @@ let g = class extends R {
|
|
|
650
650
|
}
|
|
651
651
|
// 从HEX颜色值更新HSB值
|
|
652
652
|
_updateHSBFromHex(t) {
|
|
653
|
-
const e = parseInt(t.slice(1, 3), 16) / 255, o = parseInt(t.slice(3, 5), 16) / 255,
|
|
653
|
+
const e = parseInt(t.slice(1, 3), 16) / 255, o = parseInt(t.slice(3, 5), 16) / 255, r = parseInt(t.slice(5, 7), 16) / 255, s = Math.max(e, o, r), i = Math.min(e, o, r), n = s - i;
|
|
654
654
|
let l = 0, a = 0;
|
|
655
|
-
const c =
|
|
656
|
-
n !== 0 && (a = n /
|
|
655
|
+
const c = s;
|
|
656
|
+
n !== 0 && (a = n / s, s === e ? l = (o - r) / n % 6 : s === o ? l = (r - e) / n + 2 : l = (e - o) / n + 4, l *= 60, l < 0 && (l += 360)), this._hsb = {
|
|
657
657
|
h: Math.round(l),
|
|
658
658
|
s: Math.round(a * 100),
|
|
659
659
|
b: Math.round(c * 100)
|
|
660
660
|
};
|
|
661
661
|
}
|
|
662
662
|
// 从HSB值生成HEX颜色值
|
|
663
|
-
_generateHexFromHSB(t, e, o,
|
|
663
|
+
_generateHexFromHSB(t, e, o, r = "FF") {
|
|
664
664
|
e /= 100, o /= 100;
|
|
665
|
-
const
|
|
665
|
+
const s = o * e, i = s * (1 - Math.abs(t / 60 % 2 - 1)), n = o - s;
|
|
666
666
|
let l = 0, a = 0, c = 0;
|
|
667
|
-
return 0 <= t && t < 60 ? (l =
|
|
667
|
+
return 0 <= t && t < 60 ? (l = s, a = i, c = 0) : 60 <= t && t < 120 ? (l = i, a = s, c = 0) : 120 <= t && t < 180 ? (l = 0, a = s, c = i) : 180 <= t && t < 240 ? (l = 0, a = i, c = s) : 240 <= t && t < 300 ? (l = i, a = 0, c = s) : 300 <= t && t < 360 && (l = s, a = 0, c = i), l = Math.round((l + n) * 255), a = Math.round((a + n) * 255), c = Math.round((c + n) * 255), "#" + l.toString(16).padStart(2, "0") + a.toString(16).padStart(2, "0") + c.toString(16).padStart(2, "0") + r;
|
|
668
668
|
}
|
|
669
669
|
// 计算面板位置
|
|
670
670
|
_updatePanelPosition() {
|
|
671
671
|
requestAnimationFrame(() => {
|
|
672
672
|
const t = this.getBoundingClientRect(), e = this.shadowRoot?.querySelector(".panel");
|
|
673
673
|
if (!e) return;
|
|
674
|
-
const o = 0.15 * 16,
|
|
674
|
+
const o = 0.15 * 16, r = 8, s = e.offsetWidth || 240, i = e.offsetHeight || 300;
|
|
675
675
|
let n = this.placement, l = this.align;
|
|
676
|
-
this.autoAdjust && (n === "bottom" ? window.innerHeight - t.bottom -
|
|
676
|
+
this.autoAdjust && (n === "bottom" ? window.innerHeight - t.bottom - r < i && t.top - r >= i && (n = "top") : t.top - r < i && window.innerHeight - t.bottom - r >= i && (n = "bottom"), l === "right" ? t.right - o < s && t.left + t.width + o + s <= window.innerWidth && (l = "left") : t.left - o + s > window.innerWidth && t.right - o >= s && (l = "right"));
|
|
677
677
|
let a;
|
|
678
|
-
n === "bottom" ? a = t.height +
|
|
678
|
+
n === "bottom" ? a = t.height + r : a = -i - r;
|
|
679
679
|
let c;
|
|
680
|
-
l === "right" ? c = t.width -
|
|
680
|
+
l === "right" ? c = t.width - s + o : c = -o, this._panelPosition = { top: a, left: c };
|
|
681
681
|
});
|
|
682
682
|
}
|
|
683
683
|
// 打开面板
|
|
@@ -705,8 +705,8 @@ let g = class extends R {
|
|
|
705
705
|
// 处理HSB颜色变化
|
|
706
706
|
_handleHSBChange(t, e, o) {
|
|
707
707
|
this._hsb = { h: t, s: e, b: o };
|
|
708
|
-
const
|
|
709
|
-
this._handleColorChange(
|
|
708
|
+
const r = this._internalValue.slice(7), s = this._generateHexFromHSB(t, e, o, r);
|
|
709
|
+
this._handleColorChange(s);
|
|
710
710
|
}
|
|
711
711
|
// 处理Alpha值变化
|
|
712
712
|
_handleAlphaChange(t) {
|
|
@@ -732,7 +732,7 @@ let g = class extends R {
|
|
|
732
732
|
_handleSBChange(t) {
|
|
733
733
|
const e = this.shadowRoot?.querySelector(".color-sb");
|
|
734
734
|
if (!e) return;
|
|
735
|
-
const o = e.getBoundingClientRect(),
|
|
735
|
+
const o = e.getBoundingClientRect(), r = t instanceof MouseEvent ? t.clientX : t.touches[0].clientX, s = t instanceof MouseEvent ? t.clientY : t.touches[0].clientY, i = Math.max(0, Math.min(100, Math.round((r - o.left) / o.width * 100))), n = Math.max(0, Math.min(100, Math.round((1 - (s - o.top) / o.height) * 100)));
|
|
736
736
|
this._handleHSBChange(this._hsb.h, i, n);
|
|
737
737
|
}
|
|
738
738
|
// 处理透明度选择
|
|
@@ -915,11 +915,11 @@ _([
|
|
|
915
915
|
g = _([
|
|
916
916
|
T("nf-color-picker")
|
|
917
917
|
], g);
|
|
918
|
-
const lt = E`:host{width:var(--nf-width);position:relative;display:inline-block}:host([disabled]) .input{cursor:not-allowed;color:var(--nf-color-disabled)}:host([disabled]) .toggle-password{cursor:not-allowed;pointer-events:none;opacity:.5}::slotted(*){position:absolute;top:50%;left:.75rem;transform:translateY(-50%);color:var(--nf-color)}:host([disabled]) ::slotted(*){color:var(--nf-color-disabled)}.input{position:absolute;inset:0;padding:var(--nf-input-padding);outline:0;border:none;background:0 0;box-sizing:border-box;color:var(--nf-color);font-size:var(--nf-font-size);font-weight:var(--nf-font-weight);font-family:var(--nf-font-family),sans-serif}.input:has(.toggle-password){padding-right:2.5rem}.input .toggle-password{position:absolute;top:50%;right:.5rem;transform:translateY(-50%);background:0 0;border:none;cursor:pointer;padding:.25rem;display:flex;align-items:center;justify-content:center;color:var(--nf-select-icon-color);transition:color var(--nf-transition-fast) ease;outline:0}.input .toggle-password:hover{color:var(--nf-icon-color-hover)}.input .toggle-password:active{color:var(--nf-icon-color-active)}.input .toggle-password svg{display:block}`;
|
|
919
|
-
var ht = Object.defineProperty, ct = Object.getOwnPropertyDescriptor, O = (t, e, o,
|
|
920
|
-
for (var
|
|
921
|
-
(n = t[i]) && (
|
|
922
|
-
return
|
|
918
|
+
const lt = E`:host{width:var(--nf-width);position:relative;display:inline-block;--nf-input-padding:0 .75rem}:host([disabled]) .input{cursor:not-allowed;color:var(--nf-color-disabled)}:host([disabled]) .toggle-password{cursor:not-allowed;pointer-events:none;opacity:.5}::slotted(*){position:absolute;top:50%;left:.75rem;transform:translateY(-50%);color:var(--nf-color)}:host([disabled]) ::slotted(*){color:var(--nf-color-disabled)}.input{position:absolute;inset:0;padding:var(--nf-input-padding);outline:0;border:none;background:0 0;box-sizing:border-box;color:var(--nf-color);font-size:var(--nf-font-size);font-weight:var(--nf-font-weight);font-family:var(--nf-font-family),sans-serif}.input:has(.toggle-password){padding-right:2.5rem}.input .toggle-password{position:absolute;top:50%;right:.5rem;transform:translateY(-50%);background:0 0;border:none;cursor:pointer;padding:.25rem;display:flex;align-items:center;justify-content:center;color:var(--nf-select-icon-color);transition:color var(--nf-transition-fast) ease;outline:0}.input .toggle-password:hover{color:var(--nf-icon-color-hover)}.input .toggle-password:active{color:var(--nf-icon-color-active)}.input .toggle-password svg{display:block}`;
|
|
919
|
+
var ht = Object.defineProperty, ct = Object.getOwnPropertyDescriptor, O = (t, e, o, r) => {
|
|
920
|
+
for (var s = r > 1 ? void 0 : r ? ct(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
921
|
+
(n = t[i]) && (s = (r ? n(e, o, s) : n(s)) || s);
|
|
922
|
+
return r && s && ht(e, o, s), s;
|
|
923
923
|
};
|
|
924
924
|
let x = class extends R {
|
|
925
925
|
constructor() {
|
|
@@ -1003,20 +1003,28 @@ O([
|
|
|
1003
1003
|
x = O([
|
|
1004
1004
|
T("nf-input")
|
|
1005
1005
|
], x);
|
|
1006
|
-
const dt = E`:host{width:
|
|
1007
|
-
var ut = Object.defineProperty, pt = Object.getOwnPropertyDescriptor, m = (t, e, o,
|
|
1008
|
-
for (var
|
|
1009
|
-
(n = t[i]) && (
|
|
1010
|
-
return
|
|
1006
|
+
const dt = E`:host{width:10rem;position:relative;display:inline-flex;align-items:center;box-sizing:border-box;padding:0;overflow:hidden;--nf-input-number-color:var(--nf-color);--nf-input-number-prefix-color:color-mix(in srgb, var(--nf-color), transparent 20%);--nf-input-number-surfix-color:color-mix(in srgb, var(--nf-color), transparent 20%)}.input-number{position:relative;padding-right:.6125rem;flex:1;height:100%;outline:0;border:none;background:0 0;box-sizing:border-box;color:var(--nf-input-number-color);font-weight:var(--nf-font-weight);text-align:left;transition:padding-right var(--nf-transition-fast) ease}.input-number .input-number-input-wrapper{height:100%}.input-number .input-number-input-wrapper .input-number-input{background:0 0;width:100%;height:100%;text-align:start;border:0;outline:0;padding:0;box-sizing:border-box;color:var(--nf-input-number-color);font-size:var(--nf-font-size);font-weight:var(--nf-font-weight);font-family:var(--nf-font-family),sans-serif}.input-number::-webkit-inner-spin-button,.input-number::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.input-number[type=number]{appearance:textfield}:host([controls]) .input-number:hover{padding-right:1.5rem}:host([controls]) .input-number:hover .controls{width:1.5rem}:host([center]) .input-number{padding-left:1.5rem!important;padding-right:1.5rem!important}:host([center]) .input-number .input-number-input{text-align:center}:host([center]) .input-number:hover{padding-left:1.5rem!important;padding-right:1.5rem!important}:host([center]) .input-prefix{position:absolute;left:0;top:0;bottom:0;z-index:1;pointer-events:none}:host([center]) .input-suffix{position:absolute;right:0;top:0;bottom:0;z-index:1;pointer-events:none}:host([center]) .input-number{flex:1;width:100%}.input-prefix{display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding-inline-start:.6125rem;color:var(--nf-input-number-prefix-color);font-size:var(--nf-font-size);pointer-events:none;-webkit-user-select:none;user-select:none}.input-prefix:not(:empty){padding-inline-end:.25rem}.input-suffix{display:flex;align-items:center;justify-content:center;color:var(--nf-input-number-surfix-color);font-size:var(--nf-font-size);pointer-events:none;-webkit-user-select:none;user-select:none}.input-suffix:not(:empty){padding-inline-end:.6125rem;padding-inline-start:.5rem}.controls{position:absolute;top:0;right:0;height:100%;width:0;overflow:hidden;display:flex;flex-direction:column;box-sizing:border-box;transition:width var(--nf-transition-fast) ease}.controls:before{content:\"\";position:absolute;left:0;top:0;bottom:0;width:.67px;background-color:var(--nf-control-divider-color)}:host([suffix]) .controls:after{content:\"\";position:absolute;right:0;top:0;bottom:0;width:.67px;background-color:var(--nf-control-divider-color)}.control-btn{flex:1;display:flex;align-items:center;justify-content:center;background:0 0;border:none;cursor:pointer;transition:background-color var(--nf-transition-fast) ease;outline:0;-webkit-user-select:none;user-select:none}.control-btn:hover{background-color:var(--nf-control-btn-background-hover)}.control-btn:active{background-color:var(--nf-control-btn-background-active)}.control-btn:focus-visible{background-color:var(--nf-control-btn-background-hover)}.control-btn svg{display:block;pointer-events:none;fill:none;stroke:var(--nf-select-icon-color);stroke-width:1;stroke-linecap:round}.control-btn-up{border-bottom:.67px solid var(--nf-control-divider-color)}:host(:not([suffix])) .control-btn-up{border-top-right-radius:var(--nf-border-radius)}:host(:not([suffix])) .control-btn-down{border-bottom-right-radius:var(--nf-border-radius)}:host([disabled]) .input-number-input{cursor:not-allowed;color:var(--nf-color-disabled)}:host([disabled]) .input-prefix,:host([disabled]) .input-suffix{color:var(--nf-color-disabled)}:host([disabled]) .controls{display:none}:host([disabled]) .control-btn{cursor:not-allowed;pointer-events:none;opacity:.5}`;
|
|
1007
|
+
var ut = Object.defineProperty, pt = Object.getOwnPropertyDescriptor, m = (t, e, o, r) => {
|
|
1008
|
+
for (var s = r > 1 ? void 0 : r ? pt(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
1009
|
+
(n = t[i]) && (s = (r ? n(e, o, s) : n(s)) || s);
|
|
1010
|
+
return r && s && ut(e, o, s), s;
|
|
1011
1011
|
};
|
|
1012
1012
|
let p = class extends R {
|
|
1013
1013
|
constructor() {
|
|
1014
|
-
super(...arguments), this.value = 0, this.formatter = (t) =>
|
|
1014
|
+
super(...arguments), this.value = 0, this.formatter = (t) => {
|
|
1015
|
+
if (t === null) return "";
|
|
1016
|
+
const e = String(t);
|
|
1017
|
+
return e.includes("e") ? t.toLocaleString("en", {
|
|
1018
|
+
useGrouping: !1,
|
|
1019
|
+
maximumFractionDigits: 20,
|
|
1020
|
+
minimumFractionDigits: 0
|
|
1021
|
+
}) : e;
|
|
1022
|
+
}, this.parser = (t) => {
|
|
1015
1023
|
if (t.trim().length == 0 || t.endsWith("."))
|
|
1016
1024
|
return null;
|
|
1017
1025
|
const e = Number(t);
|
|
1018
1026
|
return Number.isNaN(e) ? null : this.clampValue(e);
|
|
1019
|
-
}, this.prefix =
|
|
1027
|
+
}, this.prefix = null, this.suffix = null, this.controls = !0, this.step = 1, this.min = null, this.max = null, this.changeOnWheel = !0, this.disabled = !1, this.noDecimal = !1, this.noZero = !1, this.noNegative = !1, this.center = !1, this.text = "", this.isTyping = !1, this.isFocused = !1;
|
|
1020
1028
|
}
|
|
1021
1029
|
// 对解析结果进行额外验证
|
|
1022
1030
|
validateParsed(t) {
|
|
@@ -1034,6 +1042,10 @@ let p = class extends R {
|
|
|
1034
1042
|
}
|
|
1035
1043
|
/* ================== 生命周期 ================== */
|
|
1036
1044
|
willUpdate(t) {
|
|
1045
|
+
if (this.center && this.suffix && this.controls)
|
|
1046
|
+
throw new Error(
|
|
1047
|
+
"[nf-input-number] center 模式下不允许同时开启 suffix 和 controls,请关闭其中一个。"
|
|
1048
|
+
);
|
|
1037
1049
|
t.has("value") && !this.isTyping && this.setText(this.formatter(this.value));
|
|
1038
1050
|
}
|
|
1039
1051
|
/* ================== 事件处理 ================== */
|
|
@@ -1085,8 +1097,8 @@ let p = class extends R {
|
|
|
1085
1097
|
this.value = e;
|
|
1086
1098
|
let o = this.fixFloatingPoint(this.value + t * this.step);
|
|
1087
1099
|
o = this.clampValue(o);
|
|
1088
|
-
const
|
|
1089
|
-
|
|
1100
|
+
const r = this.validateParsed(o);
|
|
1101
|
+
r !== null && (o = r, o !== this.value && (this.value = o, this.setText(this.formatter(o)), this.dispatchEvent(
|
|
1090
1102
|
new CustomEvent("change", {
|
|
1091
1103
|
detail: o
|
|
1092
1104
|
})
|
|
@@ -1099,7 +1111,7 @@ let p = class extends R {
|
|
|
1099
1111
|
}
|
|
1100
1112
|
/* ================== Render ================== */
|
|
1101
1113
|
render() {
|
|
1102
|
-
return f`<div class=input-prefix>${this.prefix}</div><div class=input-number><div class=input-number-input-wrapper><input class=input-number-input .value=${this.text} ?disabled=${this.disabled} @blur=${this.onBlur} @focus=${this.onFocus} @input=${this.onInput} @keydown=${this.onKeyDown} @wheel=${this.onWheel} @keyup=${this.onKeyUp}></div>${this.controls ? f`<div class=controls><button class="control-btn control-btn-up"type=button ?disabled=${this.disabled} @click=${() => this.handleStepChange(1)} aria-label="Increase value"><svg width=12 height=12 viewBox="0 0 24 24"><path d="M6 14.6l6-6.6 6 6.6"/></svg></button><button class="control-btn control-btn-down"type=button ?disabled=${this.disabled} @click=${() => this.handleStepChange(-1)} aria-label="Decrease value"><svg width=12 height=12 viewBox="0 0 24 24"><path d="M18 9.4l-6 6.6-6-6.6"/></svg></button></div>` : ""}</div>${this.suffix ? f`<div class=input-suffix>${this.suffix}</div>` : ""}`;
|
|
1114
|
+
return f`<div class=input-prefix>${this.prefix}</div><div class=input-number><div class=input-number-input-wrapper><input inputmode=decimal class=input-number-input .value=${this.text} ?disabled=${this.disabled} @blur=${this.onBlur} @focus=${this.onFocus} @input=${this.onInput} @keydown=${this.onKeyDown} @wheel=${this.onWheel} @keyup=${this.onKeyUp}></div>${this.controls ? f`<div class=controls><button class="control-btn control-btn-up"type=button ?disabled=${this.disabled} @click=${() => this.handleStepChange(1)} aria-label="Increase value"><svg width=12 height=12 viewBox="0 0 24 24"><path d="M6 14.6l6-6.6 6 6.6"/></svg></button><button class="control-btn control-btn-down"type=button ?disabled=${this.disabled} @click=${() => this.handleStepChange(-1)} aria-label="Decrease value"><svg width=12 height=12 viewBox="0 0 24 24"><path d="M18 9.4l-6 6.6-6-6.6"/></svg></button></div>` : ""}</div>${this.suffix ? f`<div class=input-suffix>${this.suffix}</div>` : ""}`;
|
|
1103
1115
|
}
|
|
1104
1116
|
};
|
|
1105
1117
|
p.styles = [W, dt];
|
|
@@ -1121,6 +1133,7 @@ m([
|
|
|
1121
1133
|
m([
|
|
1122
1134
|
h({
|
|
1123
1135
|
type: Boolean,
|
|
1136
|
+
reflect: !0,
|
|
1124
1137
|
converter: {
|
|
1125
1138
|
fromAttribute: (t) => t !== "false" && t !== null,
|
|
1126
1139
|
toAttribute: (t) => t ? "" : null
|
|
@@ -1158,6 +1171,9 @@ m([
|
|
|
1158
1171
|
m([
|
|
1159
1172
|
h({ type: Boolean, attribute: "no-negative" })
|
|
1160
1173
|
], p.prototype, "noNegative", 2);
|
|
1174
|
+
m([
|
|
1175
|
+
h({ type: Boolean, reflect: !0 })
|
|
1176
|
+
], p.prototype, "center", 2);
|
|
1161
1177
|
m([
|
|
1162
1178
|
w()
|
|
1163
1179
|
], p.prototype, "text", 2);
|
|
@@ -1171,10 +1187,10 @@ async function ft(t) {
|
|
|
1171
1187
|
return new Promise((e) => setTimeout(e, t));
|
|
1172
1188
|
}
|
|
1173
1189
|
const bt = E`:host{width:var(--nf-width);-webkit-user-select:none;user-select:none;cursor:pointer}:host .text{flex-grow:1;display:inline-block;outline:0;white-space:nowrap}:host .icon{width:1.5rem;height:1.5rem;display:inline-block;fill:none;stroke:var(--nf-select-icon-color);stroke-width:1;stroke-linecap:round;margin:0 -.3rem 0 .5rem}:host .dropdown{position:absolute;top:2rem;right:0;left:0;padding:.3rem;background:var(--nf-dropdown-background);-webkit-backdrop-filter:blur(32px);backdrop-filter:blur(32px);border-radius:.5rem;opacity:0;pointer-events:none;color:var(--nf-color);box-shadow:0 0 1rem 0 var(--nf-dropdown-shadow);z-index:1000;transition:opacity var(--nf-transition) ease-out,transform var(--nf-transition) ease-out}:host .dropdown .item{white-space:nowrap;padding:.4rem .7rem;overflow:hidden;text-overflow:ellipsis;border-radius:.3rem;cursor:pointer}:host .dropdown .item-unselected:hover{background:var(--nf-item-background-hover);transition:background-color var(--nf-transition) ease-in-out}:host .dropdown .item-unselected:active{background:var(--nf-item-background-active)}:host .dropdown .item-selected{background-color:color-mix(in srgb,var(--nf-primary-color) 30%,transparent)}:host([disabled]){cursor:not-allowed}:host([disabled]) .text{color:var(--nf-color-disabled)}:host([disabled]) .icon{stroke:var(--nf-color-disabled)}:host([disabled]) .dropdown{display:none}:host(:focus:not([disabled])){color:var(--nf-focus-text-color)}:host(:focus:not([disabled])) .dropdown{transform:translateY(.5rem);opacity:1;pointer-events:auto}:host(:focus:not([disabled])) .cover{pointer-events:auto}`;
|
|
1174
|
-
var mt = Object.defineProperty, gt = Object.getOwnPropertyDescriptor, K = (t, e, o,
|
|
1175
|
-
for (var
|
|
1176
|
-
(n = t[i]) && (
|
|
1177
|
-
return
|
|
1190
|
+
var mt = Object.defineProperty, gt = Object.getOwnPropertyDescriptor, K = (t, e, o, r) => {
|
|
1191
|
+
for (var s = r > 1 ? void 0 : r ? gt(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
1192
|
+
(n = t[i]) && (s = (r ? n(e, o, s) : n(s)) || s);
|
|
1193
|
+
return r && s && mt(e, o, s), s;
|
|
1178
1194
|
};
|
|
1179
1195
|
let D = class extends R {
|
|
1180
1196
|
constructor() {
|
|
@@ -1241,11 +1257,11 @@ K([
|
|
|
1241
1257
|
D = K([
|
|
1242
1258
|
T("nf-select")
|
|
1243
1259
|
], D);
|
|
1244
|
-
const vt = E`:host{display:inline-flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;outline:0}:host[disabled]{cursor:not-allowed;opacity:.6}.switch-wrapper{position:relative;display:inline-block}.switch-container{position:relative;z-index:1;width:3.1rem;height:1.5rem;background-color:var(--nf-background-color);border-radius:.75rem;transition:background-color .2s ease;overflow:hidden}:host(:not([disabled]):not([checked])) .switch-container:hover{background:var(--nf-background-color-hover)}:host([checked]) .switch-container{background-color:var(--nf-primary-color,var(--nf-primary-color))}:host([disabled]) .switch-container{opacity:.5}.ripple{position:absolute;border-radius:.875rem;inset:-.2rem;background-color:#6464641a;animation:ripple-animation 1s ease-out forwards;pointer-events:none;opacity:1}@keyframes ripple-animation{0%{opacity:0}20%{opacity:1}to{opacity:0}}.switch-thumb{position:absolute;top:.125rem;left:0;width:1.25rem;height:1.25rem;transition:transform .2s ease-in-out}.switch-thumb:before{content:\"\";position:absolute;top:0;left:0;width:1.25rem;height:1.25rem;background-color:#fff;border-radius:.625rem;box-shadow:0 .125rem .25rem #0003;transition:width .2s ease-in-out,transform .2s ease-in-out}:host(:not([checked])) .switch-thumb{transform:translate(.125rem)}:host(:not([checked])) .switch-container:active .switch-thumb:before{width:1.625rem;border-radius:.625rem}:host([checked]) .switch-thumb{transform:translate(1.725rem)}:host([checked]) .switch-container:active .switch-thumb:before{width:1.625rem;border-radius:.625rem;transform:translate(-.375rem)}:host(:focus) .switch-container{outline:.125rem solid var(--nf-primary-color,var(--nf-primary-color));outline-offset:.125rem}`;
|
|
1245
|
-
var _t = Object.defineProperty, yt = Object.getOwnPropertyDescriptor, he = (t, e, o,
|
|
1246
|
-
for (var
|
|
1247
|
-
(n = t[i]) && (
|
|
1248
|
-
return
|
|
1260
|
+
const vt = E`:host{display:inline-flex;align-items:center;cursor:pointer;-webkit-user-select:none;user-select:none;outline:0;--nf-switch-padding:.1rem}:host[disabled]{cursor:not-allowed;opacity:.6}.switch-wrapper{position:relative;display:inline-block}.switch-container{position:relative;z-index:1;width:3.1rem;height:1.5rem;background-color:var(--nf-background-color);border-radius:.75rem;transition:background-color .2s ease;overflow:hidden}:host(:not([disabled]):not([checked])) .switch-container:hover{background:var(--nf-background-color-hover)}:host([checked]) .switch-container{background-color:var(--nf-primary-color,var(--nf-primary-color))}:host([disabled]) .switch-container{opacity:.5}.ripple{position:absolute;border-radius:.875rem;inset:-.2rem;background-color:#6464641a;animation:ripple-animation 1s ease-out forwards;pointer-events:none;opacity:1}@keyframes ripple-animation{0%{opacity:0}20%{opacity:1}to{opacity:0}}.switch-thumb{position:absolute;top:.125rem;left:0;width:1.25rem;height:1.25rem;transition:transform .2s ease-in-out}.switch-thumb:before{content:\"\";position:absolute;top:0;left:0;width:1.25rem;height:1.25rem;background-color:#fff;border-radius:.625rem;box-shadow:0 .125rem .25rem #0003;transition:width .2s ease-in-out,transform .2s ease-in-out}:host(:not([checked])) .switch-thumb{transform:translate(.125rem)}:host(:not([checked])) .switch-container:active .switch-thumb:before{width:1.625rem;border-radius:.625rem}:host([checked]) .switch-thumb{transform:translate(1.725rem)}:host([checked]) .switch-container:active .switch-thumb:before{width:1.625rem;border-radius:.625rem;transform:translate(-.375rem)}:host(:focus) .switch-container{outline:.125rem solid var(--nf-primary-color,var(--nf-primary-color));outline-offset:.125rem}`;
|
|
1261
|
+
var _t = Object.defineProperty, yt = Object.getOwnPropertyDescriptor, he = (t, e, o, r) => {
|
|
1262
|
+
for (var s = r > 1 ? void 0 : r ? yt(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
1263
|
+
(n = t[i]) && (s = (r ? n(e, o, s) : n(s)) || s);
|
|
1264
|
+
return r && s && _t(e, o, s), s;
|
|
1249
1265
|
};
|
|
1250
1266
|
let I = class extends V {
|
|
1251
1267
|
constructor() {
|
|
@@ -1266,9 +1282,9 @@ let I = class extends V {
|
|
|
1266
1282
|
if (!e) return;
|
|
1267
1283
|
const o = e.querySelector(".ripple");
|
|
1268
1284
|
o && e.removeChild(o);
|
|
1269
|
-
const
|
|
1270
|
-
|
|
1271
|
-
e.contains(
|
|
1285
|
+
const r = document.createElement("div");
|
|
1286
|
+
r.classList.add("ripple"), e.appendChild(r), r.addEventListener("animationend", () => {
|
|
1287
|
+
e.contains(r) && e.removeChild(r);
|
|
1272
1288
|
});
|
|
1273
1289
|
}
|
|
1274
1290
|
// 渲染开关组件
|
|
@@ -1292,10 +1308,10 @@ I = he([
|
|
|
1292
1308
|
T("nf-switch")
|
|
1293
1309
|
], I);
|
|
1294
1310
|
const wt = E`:host{display:inline-flex;align-items:center;position:relative;width:100%;height:1.25rem;background-color:var(--nf-border-color,#e0e0e0);border-radius:.625rem;cursor:pointer;-webkit-user-select:none;user-select:none;border:none;box-shadow:none;padding:0}:host:hover{background-color:var(--nf-border-color,#e0e0e0);border:none}:host:focus{box-shadow:none;outline:0}:host([disabled]){cursor:not-allowed;opacity:.6}.slider-fill{position:absolute;left:0;top:0;height:100%;background-color:var(--nf-primary-color,#5e72f9);border-radius:.625rem 0 0 .625rem;pointer-events:none}.slider-handle{position:absolute;width:1.25rem;height:1.25rem;background-color:#fff;border-radius:50%;top:50%;transform:translate(-50%,-50%);cursor:grab;outline:0;box-shadow:0 1px 3px #0000004d;transition:transform .15s ease,box-shadow .15s ease;z-index:1}:host([disabled]) .slider-handle{cursor:not-allowed}:host(:not([disabled])) .slider-handle:hover{transform:translate(-50%,-50%) scale(1.05)}:host(:not([disabled])) .slider-handle:active{cursor:grabbing;transform:translate(-50%,-50%) scale(1.15);box-shadow:0 3px 8px #0006}.slider-handle:focus{box-shadow:0 0 0 3px #5e72f94d}.slider-tooltip{position:absolute;bottom:calc(100% + .5rem);left:50%;transform:translate(-50%);background-color:var(--nf-slider-tooltip-background);color:var(--nf-color);padding:.25rem .5rem;border-radius:.25rem;font-size:.75rem;white-space:nowrap;opacity:0;transition:opacity .2s ease;pointer-events:none;box-shadow:0 0 .4rem .1rem #0000001a}.slider-tooltip.visible{opacity:1}`;
|
|
1295
|
-
var $t = Object.defineProperty, xt = Object.getOwnPropertyDescriptor, y = (t, e, o,
|
|
1296
|
-
for (var
|
|
1297
|
-
(n = t[i]) && (
|
|
1298
|
-
return
|
|
1311
|
+
var $t = Object.defineProperty, xt = Object.getOwnPropertyDescriptor, y = (t, e, o, r) => {
|
|
1312
|
+
for (var s = r > 1 ? void 0 : r ? xt(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
1313
|
+
(n = t[i]) && (s = (r ? n(e, o, s) : n(s)) || s);
|
|
1314
|
+
return r && s && $t(e, o, s), s;
|
|
1299
1315
|
};
|
|
1300
1316
|
let v = class extends R {
|
|
1301
1317
|
constructor() {
|
|
@@ -1368,7 +1384,7 @@ let v = class extends R {
|
|
|
1368
1384
|
this._isDragging = !0, this._showTooltip = !0, this._updateValue(t), document.addEventListener("mousemove", this._handleDrag), document.addEventListener("touchmove", this._handleDrag, { passive: !1 }), document.addEventListener("mouseup", this._stopDrag), document.addEventListener("touchend", this._stopDrag);
|
|
1369
1385
|
}
|
|
1370
1386
|
_updateValue(t) {
|
|
1371
|
-
const e = this.getBoundingClientRect(), o = t instanceof MouseEvent ? t.clientX : t.touches[0].clientX,
|
|
1387
|
+
const e = this.getBoundingClientRect(), o = t instanceof MouseEvent ? t.clientX : t.touches[0].clientX, r = Math.max(0, Math.min(1, (o - e.left) / e.width)), s = this.max - this.min, i = this.min + r * s, n = Math.round((i - this.min) / this.step), l = this.min + n * this.step;
|
|
1372
1388
|
this._currentValue = Math.min(this.max, Math.max(this.min, l)), this.requestUpdate();
|
|
1373
1389
|
}
|
|
1374
1390
|
_getValuePercentage() {
|
|
@@ -1376,8 +1392,8 @@ let v = class extends R {
|
|
|
1376
1392
|
return t === 0 ? 0 : (this._currentValue - this.min) / t * 100;
|
|
1377
1393
|
}
|
|
1378
1394
|
render() {
|
|
1379
|
-
const t = this._getValuePercentage(), e = `${t}%`, o = `${t}%`,
|
|
1380
|
-
return f`<div class=slider-fill style=${J({ width: o })}></div><div class=slider-handle style=${J({ left: e })} tabindex=${this.disabled ? -1 : 0} @mousedown=${this._handleMouseDown} @touchstart=${this._handleTouchStart} @keydown=${this._handleKeyDown}><div class=${
|
|
1395
|
+
const t = this._getValuePercentage(), e = `${t}%`, o = `${t}%`, r = `slider-tooltip ${this._showTooltip || this.tooltip ? "visible" : ""}`;
|
|
1396
|
+
return f`<div class=slider-fill style=${J({ width: o })}></div><div class=slider-handle style=${J({ left: e })} tabindex=${this.disabled ? -1 : 0} @mousedown=${this._handleMouseDown} @touchstart=${this._handleTouchStart} @keydown=${this._handleKeyDown}><div class=${r}>${this._currentValue}</div></div>`;
|
|
1381
1397
|
}
|
|
1382
1398
|
};
|
|
1383
1399
|
v.styles = [W, wt];
|
|
@@ -1418,7 +1434,7 @@ v = y([
|
|
|
1418
1434
|
T("nf-slider")
|
|
1419
1435
|
], v);
|
|
1420
1436
|
export {
|
|
1421
|
-
|
|
1437
|
+
j as NfCheckboxElement,
|
|
1422
1438
|
g as NfColorPickerElement,
|
|
1423
1439
|
x as NfInputElement,
|
|
1424
1440
|
p as NfInputNumberElement,
|