next-flow-design 1.2.0 → 1.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/dist/index.js
CHANGED
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
import { css as A, LitElement as R, html as p } from "lit";
|
|
2
|
-
const O = (t) => (e,
|
|
3
|
-
|
|
2
|
+
const O = (t) => (e, o) => {
|
|
3
|
+
o !== void 0 ? o.addInitializer(() => {
|
|
4
4
|
customElements.define(t, e);
|
|
5
5
|
}) : customElements.define(t, e);
|
|
6
6
|
};
|
|
7
|
-
const X = globalThis,
|
|
7
|
+
const X = globalThis, se = X.ShadowRoot && (X.ShadyCSS === void 0 || X.ShadyCSS.nativeShadow) && "adoptedStyleSheets" in Document.prototype && "replace" in CSSStyleSheet.prototype, ye = /* @__PURE__ */ Symbol(), ce = /* @__PURE__ */ new WeakMap();
|
|
8
8
|
let Se = class {
|
|
9
|
-
constructor(e,
|
|
10
|
-
if (this._$cssResult$ = !0,
|
|
11
|
-
this.cssText = e, this.t =
|
|
9
|
+
constructor(e, o, s) {
|
|
10
|
+
if (this._$cssResult$ = !0, s !== ye) throw Error("CSSResult is not constructable. Use `unsafeCSS` or `css` instead.");
|
|
11
|
+
this.cssText = e, this.t = o;
|
|
12
12
|
}
|
|
13
13
|
get styleSheet() {
|
|
14
14
|
let e = this.o;
|
|
15
|
-
const
|
|
16
|
-
if (
|
|
17
|
-
const
|
|
18
|
-
|
|
15
|
+
const o = this.t;
|
|
16
|
+
if (se && e === void 0) {
|
|
17
|
+
const s = o !== void 0 && o.length === 1;
|
|
18
|
+
s && (e = ce.get(o)), e === void 0 && ((this.o = e = new CSSStyleSheet()).replaceSync(this.cssText), s && ce.set(o, e));
|
|
19
19
|
}
|
|
20
20
|
return e;
|
|
21
21
|
}
|
|
@@ -23,16 +23,16 @@ let Se = class {
|
|
|
23
23
|
return this.cssText;
|
|
24
24
|
}
|
|
25
25
|
};
|
|
26
|
-
const Ce = (t) => new Se(typeof t == "string" ? t : t + "", void 0,
|
|
27
|
-
if (
|
|
28
|
-
else for (const
|
|
29
|
-
const
|
|
30
|
-
|
|
31
|
-
}
|
|
32
|
-
},
|
|
33
|
-
let
|
|
34
|
-
for (const
|
|
35
|
-
return Ce(
|
|
26
|
+
const Ce = (t) => new Se(typeof t == "string" ? t : t + "", void 0, ye), Pe = (t, e) => {
|
|
27
|
+
if (se) t.adoptedStyleSheets = e.map((o) => o instanceof CSSStyleSheet ? o : o.styleSheet);
|
|
28
|
+
else for (const o of e) {
|
|
29
|
+
const s = document.createElement("style"), r = X.litNonce;
|
|
30
|
+
r !== void 0 && s.setAttribute("nonce", r), s.textContent = o.cssText, t.appendChild(s);
|
|
31
|
+
}
|
|
32
|
+
}, de = se ? (t) => t : (t) => t instanceof CSSStyleSheet ? ((e) => {
|
|
33
|
+
let o = "";
|
|
34
|
+
for (const s of e.cssRules) o += s.cssText;
|
|
35
|
+
return Ce(o);
|
|
36
36
|
})(t) : t;
|
|
37
37
|
const { is: De, defineProperty: Me, getOwnPropertyDescriptor: Oe, getOwnPropertyNames: Ve, getOwnPropertySymbols: Be, getPrototypeOf: Te } = Object, Q = globalThis, ue = Q.trustedTypes, He = ue ? ue.emptyScript : "", Ue = Q.reactiveElementPolyfillSupport, L = (t, e) => t, Z = { toAttribute(t, e) {
|
|
38
38
|
switch (e) {
|
|
@@ -45,24 +45,24 @@ const { is: De, defineProperty: Me, getOwnPropertyDescriptor: Oe, getOwnProperty
|
|
|
45
45
|
}
|
|
46
46
|
return t;
|
|
47
47
|
}, fromAttribute(t, e) {
|
|
48
|
-
let
|
|
48
|
+
let o = t;
|
|
49
49
|
switch (e) {
|
|
50
50
|
case Boolean:
|
|
51
|
-
|
|
51
|
+
o = t !== null;
|
|
52
52
|
break;
|
|
53
53
|
case Number:
|
|
54
|
-
|
|
54
|
+
o = t === null ? null : Number(t);
|
|
55
55
|
break;
|
|
56
56
|
case Object:
|
|
57
57
|
case Array:
|
|
58
58
|
try {
|
|
59
|
-
|
|
59
|
+
o = JSON.parse(t);
|
|
60
60
|
} catch {
|
|
61
|
-
|
|
61
|
+
o = null;
|
|
62
62
|
}
|
|
63
63
|
}
|
|
64
|
-
return
|
|
65
|
-
} },
|
|
64
|
+
return o;
|
|
65
|
+
} }, re = (t, e) => !De(t, e), pe = { attribute: !0, type: String, converter: Z, reflect: !1, useDefault: !1, hasChanged: re };
|
|
66
66
|
Symbol.metadata ??= /* @__PURE__ */ Symbol("metadata"), Q.litPropertyMetadata ??= /* @__PURE__ */ new WeakMap();
|
|
67
67
|
let B = class extends HTMLElement {
|
|
68
68
|
static addInitializer(e) {
|
|
@@ -71,21 +71,21 @@ let B = class extends HTMLElement {
|
|
|
71
71
|
static get observedAttributes() {
|
|
72
72
|
return this.finalize(), this._$Eh && [...this._$Eh.keys()];
|
|
73
73
|
}
|
|
74
|
-
static createProperty(e,
|
|
75
|
-
if (
|
|
76
|
-
const
|
|
77
|
-
|
|
74
|
+
static createProperty(e, o = pe) {
|
|
75
|
+
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) {
|
|
76
|
+
const s = /* @__PURE__ */ Symbol(), r = this.getPropertyDescriptor(e, s, o);
|
|
77
|
+
r !== void 0 && Me(this.prototype, e, r);
|
|
78
78
|
}
|
|
79
79
|
}
|
|
80
|
-
static getPropertyDescriptor(e,
|
|
81
|
-
const { get:
|
|
82
|
-
return this[
|
|
80
|
+
static getPropertyDescriptor(e, o, s) {
|
|
81
|
+
const { get: r, set: i } = Oe(this.prototype, e) ?? { get() {
|
|
82
|
+
return this[o];
|
|
83
83
|
}, set(n) {
|
|
84
|
-
this[
|
|
84
|
+
this[o] = n;
|
|
85
85
|
} };
|
|
86
|
-
return { get:
|
|
87
|
-
const l =
|
|
88
|
-
|
|
86
|
+
return { get: r, set(n) {
|
|
87
|
+
const l = r?.call(this);
|
|
88
|
+
i?.call(this, n), this.requestUpdate(e, l, s);
|
|
89
89
|
}, configurable: !0, enumerable: !0 };
|
|
90
90
|
}
|
|
91
91
|
static getPropertyOptions(e) {
|
|
@@ -99,32 +99,32 @@ let B = class extends HTMLElement {
|
|
|
99
99
|
static finalize() {
|
|
100
100
|
if (this.hasOwnProperty(L("finalized"))) return;
|
|
101
101
|
if (this.finalized = !0, this._$Ei(), this.hasOwnProperty(L("properties"))) {
|
|
102
|
-
const
|
|
103
|
-
for (const
|
|
102
|
+
const o = this.properties, s = [...Ve(o), ...Be(o)];
|
|
103
|
+
for (const r of s) this.createProperty(r, o[r]);
|
|
104
104
|
}
|
|
105
105
|
const e = this[Symbol.metadata];
|
|
106
106
|
if (e !== null) {
|
|
107
|
-
const
|
|
108
|
-
if (
|
|
107
|
+
const o = litPropertyMetadata.get(e);
|
|
108
|
+
if (o !== void 0) for (const [s, r] of o) this.elementProperties.set(s, r);
|
|
109
109
|
}
|
|
110
110
|
this._$Eh = /* @__PURE__ */ new Map();
|
|
111
|
-
for (const [
|
|
112
|
-
const
|
|
113
|
-
|
|
111
|
+
for (const [o, s] of this.elementProperties) {
|
|
112
|
+
const r = this._$Eu(o, s);
|
|
113
|
+
r !== void 0 && this._$Eh.set(r, o);
|
|
114
114
|
}
|
|
115
115
|
this.elementStyles = this.finalizeStyles(this.styles);
|
|
116
116
|
}
|
|
117
117
|
static finalizeStyles(e) {
|
|
118
|
-
const
|
|
118
|
+
const o = [];
|
|
119
119
|
if (Array.isArray(e)) {
|
|
120
|
-
const
|
|
121
|
-
for (const
|
|
122
|
-
} else e !== void 0 &&
|
|
123
|
-
return
|
|
120
|
+
const s = new Set(e.flat(1 / 0).reverse());
|
|
121
|
+
for (const r of s) o.unshift(de(r));
|
|
122
|
+
} else e !== void 0 && o.push(de(e));
|
|
123
|
+
return o;
|
|
124
124
|
}
|
|
125
|
-
static _$Eu(e,
|
|
126
|
-
const
|
|
127
|
-
return
|
|
125
|
+
static _$Eu(e, o) {
|
|
126
|
+
const s = o.attribute;
|
|
127
|
+
return s === !1 ? void 0 : typeof s == "string" ? s : typeof e == "string" ? e.toLowerCase() : void 0;
|
|
128
128
|
}
|
|
129
129
|
constructor() {
|
|
130
130
|
super(), this._$Ep = void 0, this.isUpdatePending = !1, this.hasUpdated = !1, this._$Em = null, this._$Ev();
|
|
@@ -139,8 +139,8 @@ let B = class extends HTMLElement {
|
|
|
139
139
|
this._$EO?.delete(e);
|
|
140
140
|
}
|
|
141
141
|
_$E_() {
|
|
142
|
-
const e = /* @__PURE__ */ new Map(),
|
|
143
|
-
for (const
|
|
142
|
+
const e = /* @__PURE__ */ new Map(), o = this.constructor.elementProperties;
|
|
143
|
+
for (const s of o.keys()) this.hasOwnProperty(s) && (e.set(s, this[s]), delete this[s]);
|
|
144
144
|
e.size > 0 && (this._$Ep = e);
|
|
145
145
|
}
|
|
146
146
|
createRenderRoot() {
|
|
@@ -155,42 +155,42 @@ let B = class extends HTMLElement {
|
|
|
155
155
|
disconnectedCallback() {
|
|
156
156
|
this._$EO?.forEach((e) => e.hostDisconnected?.());
|
|
157
157
|
}
|
|
158
|
-
attributeChangedCallback(e,
|
|
159
|
-
this._$AK(e,
|
|
158
|
+
attributeChangedCallback(e, o, s) {
|
|
159
|
+
this._$AK(e, s);
|
|
160
160
|
}
|
|
161
|
-
_$ET(e,
|
|
162
|
-
const
|
|
163
|
-
if (
|
|
164
|
-
const
|
|
165
|
-
this._$Em = e,
|
|
161
|
+
_$ET(e, o) {
|
|
162
|
+
const s = this.constructor.elementProperties.get(e), r = this.constructor._$Eu(e, s);
|
|
163
|
+
if (r !== void 0 && s.reflect === !0) {
|
|
164
|
+
const i = (s.converter?.toAttribute !== void 0 ? s.converter : Z).toAttribute(o, s.type);
|
|
165
|
+
this._$Em = e, i == null ? this.removeAttribute(r) : this.setAttribute(r, i), this._$Em = null;
|
|
166
166
|
}
|
|
167
167
|
}
|
|
168
|
-
_$AK(e,
|
|
169
|
-
const
|
|
170
|
-
if (
|
|
171
|
-
const
|
|
172
|
-
this._$Em =
|
|
173
|
-
const l = n.fromAttribute(
|
|
174
|
-
this[
|
|
168
|
+
_$AK(e, o) {
|
|
169
|
+
const s = this.constructor, r = s._$Eh.get(e);
|
|
170
|
+
if (r !== void 0 && this._$Em !== r) {
|
|
171
|
+
const i = s.getPropertyOptions(r), n = typeof i.converter == "function" ? { fromAttribute: i.converter } : i.converter?.fromAttribute !== void 0 ? i.converter : Z;
|
|
172
|
+
this._$Em = r;
|
|
173
|
+
const l = n.fromAttribute(o, i.type);
|
|
174
|
+
this[r] = l ?? this._$Ej?.get(r) ?? l, this._$Em = null;
|
|
175
175
|
}
|
|
176
176
|
}
|
|
177
|
-
requestUpdate(e,
|
|
177
|
+
requestUpdate(e, o, s, r = !1, i) {
|
|
178
178
|
if (e !== void 0) {
|
|
179
179
|
const n = this.constructor;
|
|
180
|
-
if (
|
|
181
|
-
this.C(e,
|
|
180
|
+
if (r === !1 && (i = this[e]), s ??= n.getPropertyOptions(e), !((s.hasChanged ?? re)(i, o) || s.useDefault && s.reflect && i === this._$Ej?.get(e) && !this.hasAttribute(n._$Eu(e, s)))) return;
|
|
181
|
+
this.C(e, o, s);
|
|
182
182
|
}
|
|
183
183
|
this.isUpdatePending === !1 && (this._$ES = this._$EP());
|
|
184
184
|
}
|
|
185
|
-
C(e,
|
|
186
|
-
|
|
185
|
+
C(e, o, { useDefault: s, reflect: r, wrapped: i }, n) {
|
|
186
|
+
s && !(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 || s || (o = void 0), this._$AL.set(e, o)), r === !0 && this._$Em !== e && (this._$Eq ??= /* @__PURE__ */ new Set()).add(e));
|
|
187
187
|
}
|
|
188
188
|
async _$EP() {
|
|
189
189
|
this.isUpdatePending = !0;
|
|
190
190
|
try {
|
|
191
191
|
await this._$ES;
|
|
192
|
-
} catch (
|
|
193
|
-
Promise.reject(
|
|
192
|
+
} catch (o) {
|
|
193
|
+
Promise.reject(o);
|
|
194
194
|
}
|
|
195
195
|
const e = this.scheduleUpdate();
|
|
196
196
|
return e != null && await e, !this.isUpdatePending;
|
|
@@ -202,28 +202,28 @@ let B = class extends HTMLElement {
|
|
|
202
202
|
if (!this.isUpdatePending) return;
|
|
203
203
|
if (!this.hasUpdated) {
|
|
204
204
|
if (this.renderRoot ??= this.createRenderRoot(), this._$Ep) {
|
|
205
|
-
for (const [
|
|
205
|
+
for (const [r, i] of this._$Ep) this[r] = i;
|
|
206
206
|
this._$Ep = void 0;
|
|
207
207
|
}
|
|
208
|
-
const
|
|
209
|
-
if (
|
|
210
|
-
const { wrapped: n } =
|
|
211
|
-
n !== !0 || this._$AL.has(
|
|
208
|
+
const s = this.constructor.elementProperties;
|
|
209
|
+
if (s.size > 0) for (const [r, i] of s) {
|
|
210
|
+
const { wrapped: n } = i, l = this[r];
|
|
211
|
+
n !== !0 || this._$AL.has(r) || l === void 0 || this.C(r, void 0, i, l);
|
|
212
212
|
}
|
|
213
213
|
}
|
|
214
214
|
let e = !1;
|
|
215
|
-
const
|
|
215
|
+
const o = this._$AL;
|
|
216
216
|
try {
|
|
217
|
-
e = this.shouldUpdate(
|
|
218
|
-
} catch (
|
|
219
|
-
throw e = !1, this._$EM(),
|
|
217
|
+
e = this.shouldUpdate(o), e ? (this.willUpdate(o), this._$EO?.forEach((s) => s.hostUpdate?.()), this.update(o)) : this._$EM();
|
|
218
|
+
} catch (s) {
|
|
219
|
+
throw e = !1, this._$EM(), s;
|
|
220
220
|
}
|
|
221
|
-
e && this._$AE(
|
|
221
|
+
e && this._$AE(o);
|
|
222
222
|
}
|
|
223
223
|
willUpdate(e) {
|
|
224
224
|
}
|
|
225
225
|
_$AE(e) {
|
|
226
|
-
this._$EO?.forEach((
|
|
226
|
+
this._$EO?.forEach((o) => o.hostUpdated?.()), this.hasUpdated || (this.hasUpdated = !0, this.firstUpdated(e)), this.updated(e);
|
|
227
227
|
}
|
|
228
228
|
_$EM() {
|
|
229
229
|
this._$AL = /* @__PURE__ */ new Map(), this.isUpdatePending = !1;
|
|
@@ -238,7 +238,7 @@ let B = class extends HTMLElement {
|
|
|
238
238
|
return !0;
|
|
239
239
|
}
|
|
240
240
|
update(e) {
|
|
241
|
-
this._$Eq &&= this._$Eq.forEach((
|
|
241
|
+
this._$Eq &&= this._$Eq.forEach((o) => this._$ET(o, this[o])), this._$EM();
|
|
242
242
|
}
|
|
243
243
|
updated(e) {
|
|
244
244
|
}
|
|
@@ -246,11 +246,11 @@ let B = class extends HTMLElement {
|
|
|
246
246
|
}
|
|
247
247
|
};
|
|
248
248
|
B.elementStyles = [], B.shadowRootOptions = { mode: "open" }, B[L("elementProperties")] = /* @__PURE__ */ new Map(), B[L("finalized")] = /* @__PURE__ */ new Map(), Ue?.({ ReactiveElement: B }), (Q.reactiveElementVersions ??= []).push("2.1.2");
|
|
249
|
-
const Le = { attribute: !0, type: String, converter: Z, reflect: !1, hasChanged:
|
|
250
|
-
const { kind:
|
|
251
|
-
let
|
|
252
|
-
if (
|
|
253
|
-
const { name: n } =
|
|
249
|
+
const Le = { attribute: !0, type: String, converter: Z, reflect: !1, hasChanged: re }, Ne = (t = Le, e, o) => {
|
|
250
|
+
const { kind: s, metadata: r } = o;
|
|
251
|
+
let i = globalThis.litPropertyMetadata.get(r);
|
|
252
|
+
if (i === void 0 && globalThis.litPropertyMetadata.set(r, i = /* @__PURE__ */ new Map()), s === "setter" && ((t = Object.create(t)).wrapped = !0), i.set(o.name, t), s === "accessor") {
|
|
253
|
+
const { name: n } = o;
|
|
254
254
|
return { set(l) {
|
|
255
255
|
const a = e.get.call(this);
|
|
256
256
|
e.set.call(this, l), this.requestUpdate(n, a, t, !0, l);
|
|
@@ -258,89 +258,89 @@ const Le = { attribute: !0, type: String, converter: Z, reflect: !1, hasChanged:
|
|
|
258
258
|
return l !== void 0 && this.C(n, void 0, t, l), l;
|
|
259
259
|
} };
|
|
260
260
|
}
|
|
261
|
-
if (
|
|
262
|
-
const { name: n } =
|
|
261
|
+
if (s === "setter") {
|
|
262
|
+
const { name: n } = o;
|
|
263
263
|
return function(l) {
|
|
264
264
|
const a = this[n];
|
|
265
265
|
e.call(this, l), this.requestUpdate(n, a, t, !0, l);
|
|
266
266
|
};
|
|
267
267
|
}
|
|
268
|
-
throw Error("Unsupported decorator location: " +
|
|
268
|
+
throw Error("Unsupported decorator location: " + s);
|
|
269
269
|
};
|
|
270
270
|
function h(t) {
|
|
271
|
-
return (e,
|
|
272
|
-
const n =
|
|
273
|
-
return
|
|
274
|
-
})(t, e,
|
|
271
|
+
return (e, o) => typeof o == "object" ? Ne(t, e, o) : ((s, r, i) => {
|
|
272
|
+
const n = r.hasOwnProperty(i);
|
|
273
|
+
return r.constructor.createProperty(i, s), n ? Object.getOwnPropertyDescriptor(r, i) : void 0;
|
|
274
|
+
})(t, e, o);
|
|
275
275
|
}
|
|
276
|
-
function
|
|
276
|
+
function y(t) {
|
|
277
277
|
return h({ ...t, state: !0, attribute: !1 });
|
|
278
278
|
}
|
|
279
|
-
const
|
|
279
|
+
const ie = globalThis, fe = (t) => t, G = ie.trustedTypes, be = G ? G.createPolicy("lit-html", { createHTML: (t) => t }) : void 0, $e = "$lit$", E = `lit$${Math.random().toFixed(9).slice(2)}$`, xe = "?" + E, Ie = `<${xe}>`, P = document, N = () => P.createComment(""), I = (t) => t === null || typeof t != "object" && typeof t != "function", ne = Array.isArray, Fe = (t) => ne(t) || typeof t?.[Symbol.iterator] == "function", te = `[
|
|
280
280
|
\f\r]`, U = /<(?:(!--|\/[^a-zA-Z])|(\/?[a-zA-Z][^>\s]*)|(\/?$))/g, me = /-->/g, ge = />/g, S = RegExp(`>|${te}(?:([^\\s"'>=/]+)(${te}*=${te}*(?:[^
|
|
281
|
-
\f\r"'\`<>=]|("|')|))|$)`, "g"), ve = /'/g, _e = /"/g,
|
|
282
|
-
function
|
|
281
|
+
\f\r"'\`<>=]|("|')|))|$)`, "g"), ve = /'/g, _e = /"/g, ke = /^(?:script|style|textarea|title)$/i, ze = (t) => (e, ...o) => ({ _$litType$: t, strings: e, values: o }), oe = ze(1), D = /* @__PURE__ */ Symbol.for("lit-noChange"), f = /* @__PURE__ */ Symbol.for("lit-nothing"), we = /* @__PURE__ */ new WeakMap(), C = P.createTreeWalker(P, 129);
|
|
282
|
+
function Ee(t, e) {
|
|
283
283
|
if (!ne(t) || !t.hasOwnProperty("raw")) throw Error("invalid template strings array");
|
|
284
284
|
return be !== void 0 ? be.createHTML(e) : e;
|
|
285
285
|
}
|
|
286
|
-
const
|
|
287
|
-
const
|
|
288
|
-
let
|
|
289
|
-
for (let l = 0; l <
|
|
286
|
+
const je = (t, e) => {
|
|
287
|
+
const o = t.length - 1, s = [];
|
|
288
|
+
let r, i = e === 2 ? "<svg>" : e === 3 ? "<math>" : "", n = U;
|
|
289
|
+
for (let l = 0; l < o; l++) {
|
|
290
290
|
const a = t[l];
|
|
291
|
-
let
|
|
292
|
-
for (; $ < a.length && (n.lastIndex = $, u = n.exec(a), u !== null); ) $ = n.lastIndex, n === U ? u[1] === "!--" ? n = me : u[1] !== void 0 ? n = ge : u[2] !== void 0 ? (
|
|
293
|
-
const
|
|
294
|
-
|
|
291
|
+
let c, u, d = -1, $ = 0;
|
|
292
|
+
for (; $ < a.length && (n.lastIndex = $, u = n.exec(a), u !== null); ) $ = n.lastIndex, n === U ? u[1] === "!--" ? n = me : u[1] !== void 0 ? n = ge : u[2] !== void 0 ? (ke.test(u[2]) && (r = RegExp("</" + u[2], "g")), n = S) : u[3] !== void 0 && (n = S) : n === S ? u[0] === ">" ? (n = r ?? U, 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 = U : (n = S, r = void 0);
|
|
293
|
+
const k = n === S && t[l + 1].startsWith("/>") ? " " : "";
|
|
294
|
+
i += n === U ? a + Ie : d >= 0 ? (s.push(c), a.slice(0, d) + $e + a.slice(d) + E + k) : a + E + (d === -2 ? l : k);
|
|
295
295
|
}
|
|
296
|
-
return [
|
|
296
|
+
return [Ee(t, i + (t[o] || "<?>") + (e === 2 ? "</svg>" : e === 3 ? "</math>" : "")), s];
|
|
297
297
|
};
|
|
298
298
|
class F {
|
|
299
|
-
constructor({ strings: e, _$litType$:
|
|
300
|
-
let
|
|
299
|
+
constructor({ strings: e, _$litType$: o }, s) {
|
|
300
|
+
let r;
|
|
301
301
|
this.parts = [];
|
|
302
|
-
let
|
|
303
|
-
const l = e.length - 1, a = this.parts, [
|
|
304
|
-
if (this.el = F.createElement(
|
|
305
|
-
const
|
|
306
|
-
|
|
302
|
+
let i = 0, n = 0;
|
|
303
|
+
const l = e.length - 1, a = this.parts, [c, u] = je(e, o);
|
|
304
|
+
if (this.el = F.createElement(c, s), C.currentNode = this.el.content, o === 2 || o === 3) {
|
|
305
|
+
const d = this.el.content.firstChild;
|
|
306
|
+
d.replaceWith(...d.childNodes);
|
|
307
307
|
}
|
|
308
|
-
for (; (
|
|
309
|
-
if (
|
|
310
|
-
if (
|
|
311
|
-
const $ = u[n++],
|
|
312
|
-
a.push({ type: 1, index:
|
|
313
|
-
} else
|
|
314
|
-
if (
|
|
315
|
-
const
|
|
308
|
+
for (; (r = C.nextNode()) !== null && a.length < l; ) {
|
|
309
|
+
if (r.nodeType === 1) {
|
|
310
|
+
if (r.hasAttributes()) for (const d of r.getAttributeNames()) if (d.endsWith($e)) {
|
|
311
|
+
const $ = u[n++], k = r.getAttribute(d).split(E), Y = /([.?@])?(.*)/.exec($);
|
|
312
|
+
a.push({ type: 1, index: i, name: Y[2], strings: k, ctor: Y[1] === "." ? We : Y[1] === "?" ? qe : Y[1] === "@" ? Ke : ee }), r.removeAttribute(d);
|
|
313
|
+
} else d.startsWith(E) && (a.push({ type: 6, index: i }), r.removeAttribute(d));
|
|
314
|
+
if (ke.test(r.tagName)) {
|
|
315
|
+
const d = r.textContent.split(E), $ = d.length - 1;
|
|
316
316
|
if ($ > 0) {
|
|
317
|
-
|
|
318
|
-
for (let
|
|
319
|
-
|
|
317
|
+
r.textContent = G ? G.emptyScript : "";
|
|
318
|
+
for (let k = 0; k < $; k++) r.append(d[k], N()), C.nextNode(), a.push({ type: 2, index: ++i });
|
|
319
|
+
r.append(d[$], N());
|
|
320
320
|
}
|
|
321
321
|
}
|
|
322
|
-
} else if (
|
|
322
|
+
} else if (r.nodeType === 8) if (r.data === xe) a.push({ type: 2, index: i });
|
|
323
323
|
else {
|
|
324
|
-
let
|
|
325
|
-
for (; (
|
|
324
|
+
let d = -1;
|
|
325
|
+
for (; (d = r.data.indexOf(E, d + 1)) !== -1; ) a.push({ type: 7, index: i }), d += E.length - 1;
|
|
326
326
|
}
|
|
327
|
-
|
|
327
|
+
i++;
|
|
328
328
|
}
|
|
329
329
|
}
|
|
330
|
-
static createElement(e,
|
|
331
|
-
const
|
|
332
|
-
return
|
|
330
|
+
static createElement(e, o) {
|
|
331
|
+
const s = P.createElement("template");
|
|
332
|
+
return s.innerHTML = e, s;
|
|
333
333
|
}
|
|
334
334
|
}
|
|
335
|
-
function H(t, e,
|
|
335
|
+
function H(t, e, o = t, s) {
|
|
336
336
|
if (e === D) return e;
|
|
337
|
-
let
|
|
338
|
-
const
|
|
339
|
-
return
|
|
337
|
+
let r = s !== void 0 ? o._$Co?.[s] : o._$Cl;
|
|
338
|
+
const i = I(e) ? void 0 : e._$litDirective$;
|
|
339
|
+
return r?.constructor !== i && (r?._$AO?.(!1), i === void 0 ? r = void 0 : (r = new i(t), r._$AT(t, o, s)), s !== void 0 ? (o._$Co ??= [])[s] = r : o._$Cl = r), r !== void 0 && (e = H(t, r._$AS(t, e.values), r, s)), e;
|
|
340
340
|
}
|
|
341
341
|
class Re {
|
|
342
|
-
constructor(e,
|
|
343
|
-
this._$AV = [], this._$AN = void 0, this._$AD = e, this._$AM =
|
|
342
|
+
constructor(e, o) {
|
|
343
|
+
this._$AV = [], this._$AN = void 0, this._$AD = e, this._$AM = o;
|
|
344
344
|
}
|
|
345
345
|
get parentNode() {
|
|
346
346
|
return this._$AM.parentNode;
|
|
@@ -349,34 +349,34 @@ class Re {
|
|
|
349
349
|
return this._$AM._$AU;
|
|
350
350
|
}
|
|
351
351
|
u(e) {
|
|
352
|
-
const { el: { content:
|
|
353
|
-
C.currentNode =
|
|
354
|
-
let
|
|
352
|
+
const { el: { content: o }, parts: s } = this._$AD, r = (e?.creationScope ?? P).importNode(o, !0);
|
|
353
|
+
C.currentNode = r;
|
|
354
|
+
let i = C.nextNode(), n = 0, l = 0, a = s[0];
|
|
355
355
|
for (; a !== void 0; ) {
|
|
356
356
|
if (n === a.index) {
|
|
357
|
-
let
|
|
358
|
-
a.type === 2 ?
|
|
357
|
+
let c;
|
|
358
|
+
a.type === 2 ? c = new W(i, i.nextSibling, this, e) : a.type === 1 ? c = new a.ctor(i, a.name, a.strings, this, e) : a.type === 6 && (c = new Ye(i, this, e)), this._$AV.push(c), a = s[++l];
|
|
359
359
|
}
|
|
360
|
-
n !== a?.index && (
|
|
360
|
+
n !== a?.index && (i = C.nextNode(), n++);
|
|
361
361
|
}
|
|
362
|
-
return C.currentNode = P,
|
|
362
|
+
return C.currentNode = P, r;
|
|
363
363
|
}
|
|
364
364
|
p(e) {
|
|
365
|
-
let
|
|
366
|
-
for (const
|
|
365
|
+
let o = 0;
|
|
366
|
+
for (const s of this._$AV) s !== void 0 && (s.strings !== void 0 ? (s._$AI(e, s, o), o += s.strings.length - 2) : s._$AI(e[o])), o++;
|
|
367
367
|
}
|
|
368
368
|
}
|
|
369
369
|
class W {
|
|
370
370
|
get _$AU() {
|
|
371
371
|
return this._$AM?._$AU ?? this._$Cv;
|
|
372
372
|
}
|
|
373
|
-
constructor(e,
|
|
374
|
-
this.type = 2, this._$AH = f, this._$AN = void 0, this._$AA = e, this._$AB =
|
|
373
|
+
constructor(e, o, s, r) {
|
|
374
|
+
this.type = 2, this._$AH = f, this._$AN = void 0, this._$AA = e, this._$AB = o, this._$AM = s, this.options = r, this._$Cv = r?.isConnected ?? !0;
|
|
375
375
|
}
|
|
376
376
|
get parentNode() {
|
|
377
377
|
let e = this._$AA.parentNode;
|
|
378
|
-
const
|
|
379
|
-
return
|
|
378
|
+
const o = this._$AM;
|
|
379
|
+
return o !== void 0 && e?.nodeType === 11 && (e = o.parentNode), e;
|
|
380
380
|
}
|
|
381
381
|
get startNode() {
|
|
382
382
|
return this._$AA;
|
|
@@ -384,8 +384,8 @@ class W {
|
|
|
384
384
|
get endNode() {
|
|
385
385
|
return this._$AB;
|
|
386
386
|
}
|
|
387
|
-
_$AI(e,
|
|
388
|
-
e = H(this, e,
|
|
387
|
+
_$AI(e, o = this) {
|
|
388
|
+
e = H(this, e, o), I(e) ? e === f || e == null || e === "" ? (this._$AH !== f && this._$AR(), this._$AH = f) : e !== this._$AH && e !== D && this._(e) : e._$litType$ !== void 0 ? this.$(e) : e.nodeType !== void 0 ? this.T(e) : Fe(e) ? this.k(e) : this._(e);
|
|
389
389
|
}
|
|
390
390
|
O(e) {
|
|
391
391
|
return this._$AA.parentNode.insertBefore(e, this._$AB);
|
|
@@ -397,28 +397,28 @@ class W {
|
|
|
397
397
|
this._$AH !== f && I(this._$AH) ? this._$AA.nextSibling.data = e : this.T(P.createTextNode(e)), this._$AH = e;
|
|
398
398
|
}
|
|
399
399
|
$(e) {
|
|
400
|
-
const { values:
|
|
401
|
-
if (this._$AH?._$AD ===
|
|
400
|
+
const { values: o, _$litType$: s } = e, r = typeof s == "number" ? this._$AC(e) : (s.el === void 0 && (s.el = F.createElement(Ee(s.h, s.h[0]), this.options)), s);
|
|
401
|
+
if (this._$AH?._$AD === r) this._$AH.p(o);
|
|
402
402
|
else {
|
|
403
|
-
const
|
|
404
|
-
|
|
403
|
+
const i = new Re(r, this), n = i.u(this.options);
|
|
404
|
+
i.p(o), this.T(n), this._$AH = i;
|
|
405
405
|
}
|
|
406
406
|
}
|
|
407
407
|
_$AC(e) {
|
|
408
|
-
let
|
|
409
|
-
return
|
|
408
|
+
let o = we.get(e.strings);
|
|
409
|
+
return o === void 0 && we.set(e.strings, o = new F(e)), o;
|
|
410
410
|
}
|
|
411
411
|
k(e) {
|
|
412
412
|
ne(this._$AH) || (this._$AH = [], this._$AR());
|
|
413
|
-
const
|
|
414
|
-
let
|
|
415
|
-
for (const
|
|
416
|
-
|
|
417
|
-
}
|
|
418
|
-
_$AR(e = this._$AA.nextSibling,
|
|
419
|
-
for (this._$AP?.(!1, !0,
|
|
420
|
-
const
|
|
421
|
-
fe(e).remove(), e =
|
|
413
|
+
const o = this._$AH;
|
|
414
|
+
let s, r = 0;
|
|
415
|
+
for (const i of e) r === o.length ? o.push(s = new W(this.O(N()), this.O(N()), this, this.options)) : s = o[r], s._$AI(i), r++;
|
|
416
|
+
r < o.length && (this._$AR(s && s._$AB.nextSibling, r), o.length = r);
|
|
417
|
+
}
|
|
418
|
+
_$AR(e = this._$AA.nextSibling, o) {
|
|
419
|
+
for (this._$AP?.(!1, !0, o); e !== this._$AB; ) {
|
|
420
|
+
const s = fe(e).nextSibling;
|
|
421
|
+
fe(e).remove(), e = s;
|
|
422
422
|
}
|
|
423
423
|
}
|
|
424
424
|
setConnected(e) {
|
|
@@ -432,19 +432,19 @@ class ee {
|
|
|
432
432
|
get _$AU() {
|
|
433
433
|
return this._$AM._$AU;
|
|
434
434
|
}
|
|
435
|
-
constructor(e, s,
|
|
436
|
-
this.type = 1, this._$AH = f, this._$AN = void 0, this.element = e, this.name =
|
|
435
|
+
constructor(e, o, s, r, i) {
|
|
436
|
+
this.type = 1, this._$AH = f, this._$AN = void 0, this.element = e, this.name = o, this._$AM = r, this.options = i, s.length > 2 || s[0] !== "" || s[1] !== "" ? (this._$AH = Array(s.length - 1).fill(new String()), this.strings = s) : this._$AH = f;
|
|
437
437
|
}
|
|
438
|
-
_$AI(e,
|
|
439
|
-
const
|
|
438
|
+
_$AI(e, o = this, s, r) {
|
|
439
|
+
const i = this.strings;
|
|
440
440
|
let n = !1;
|
|
441
|
-
if (
|
|
441
|
+
if (i === void 0) e = H(this, e, o, 0), n = !I(e) || e !== this._$AH && e !== D, n && (this._$AH = e);
|
|
442
442
|
else {
|
|
443
443
|
const l = e;
|
|
444
|
-
let a,
|
|
445
|
-
for (e =
|
|
444
|
+
let a, c;
|
|
445
|
+
for (e = i[0], a = 0; a < i.length - 1; a++) c = H(this, l[s + a], o, a), c === D && (c = this._$AH[a]), n ||= !I(c) || c !== this._$AH[a], c === f ? e = f : e !== f && (e += (c ?? "") + i[a + 1]), this._$AH[a] = c;
|
|
446
446
|
}
|
|
447
|
-
n && !
|
|
447
|
+
n && !r && this.j(e);
|
|
448
448
|
}
|
|
449
449
|
j(e) {
|
|
450
450
|
e === f ? this.element.removeAttribute(this.name) : this.element.setAttribute(this.name, e ?? "");
|
|
@@ -467,21 +467,21 @@ class qe extends ee {
|
|
|
467
467
|
}
|
|
468
468
|
}
|
|
469
469
|
class Ke extends ee {
|
|
470
|
-
constructor(e, s,
|
|
471
|
-
super(e, s,
|
|
470
|
+
constructor(e, o, s, r, i) {
|
|
471
|
+
super(e, o, s, r, i), this.type = 5;
|
|
472
472
|
}
|
|
473
|
-
_$AI(e,
|
|
474
|
-
if ((e = H(this, e,
|
|
475
|
-
const
|
|
476
|
-
|
|
473
|
+
_$AI(e, o = this) {
|
|
474
|
+
if ((e = H(this, e, o, 0) ?? f) === D) return;
|
|
475
|
+
const s = this._$AH, r = e === f && s !== f || e.capture !== s.capture || e.once !== s.once || e.passive !== s.passive, i = e !== f && (s === f || r);
|
|
476
|
+
r && this.element.removeEventListener(this.name, this, s), i && this.element.addEventListener(this.name, this, e), this._$AH = e;
|
|
477
477
|
}
|
|
478
478
|
handleEvent(e) {
|
|
479
479
|
typeof this._$AH == "function" ? this._$AH.call(this.options?.host ?? this.element, e) : this._$AH.handleEvent(e);
|
|
480
480
|
}
|
|
481
481
|
}
|
|
482
482
|
class Ye {
|
|
483
|
-
constructor(e,
|
|
484
|
-
this.element = e, this.type = 6, this._$AN = void 0, this._$AM =
|
|
483
|
+
constructor(e, o, s) {
|
|
484
|
+
this.element = e, this.type = 6, this._$AN = void 0, this._$AM = o, this.options = s;
|
|
485
485
|
}
|
|
486
486
|
get _$AU() {
|
|
487
487
|
return this._$AM._$AU;
|
|
@@ -490,16 +490,16 @@ class Ye {
|
|
|
490
490
|
H(this, e);
|
|
491
491
|
}
|
|
492
492
|
}
|
|
493
|
-
const Xe =
|
|
494
|
-
Xe?.(F, W), (
|
|
495
|
-
const Ze = (t, e,
|
|
496
|
-
const
|
|
497
|
-
let
|
|
498
|
-
if (
|
|
499
|
-
const
|
|
500
|
-
|
|
501
|
-
}
|
|
502
|
-
return
|
|
493
|
+
const Xe = ie.litHtmlPolyfillSupport;
|
|
494
|
+
Xe?.(F, W), (ie.litHtmlVersions ??= []).push("3.3.2");
|
|
495
|
+
const Ze = (t, e, o) => {
|
|
496
|
+
const s = o?.renderBefore ?? e;
|
|
497
|
+
let r = s._$litPart$;
|
|
498
|
+
if (r === void 0) {
|
|
499
|
+
const i = o?.renderBefore ?? null;
|
|
500
|
+
s._$litPart$ = r = new W(e.insertBefore(N(), i), i, void 0, o ?? {});
|
|
501
|
+
}
|
|
502
|
+
return r._$AI(t), r;
|
|
503
503
|
};
|
|
504
504
|
const ae = globalThis;
|
|
505
505
|
let T = class extends B {
|
|
@@ -511,8 +511,8 @@ let T = class extends B {
|
|
|
511
511
|
return this.renderOptions.renderBefore ??= e.firstChild, e;
|
|
512
512
|
}
|
|
513
513
|
update(e) {
|
|
514
|
-
const
|
|
515
|
-
this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(e), this._$Do = Ze(
|
|
514
|
+
const o = this.render();
|
|
515
|
+
this.hasUpdated || (this.renderOptions.isConnected = this.isConnected), super.update(e), this._$Do = Ze(o, this.renderRoot, this.renderOptions);
|
|
516
516
|
}
|
|
517
517
|
connectedCallback() {
|
|
518
518
|
super.connectedCallback(), this._$Do?.setConnected(!0);
|
|
@@ -528,13 +528,13 @@ T._$litElement$ = !0, T.finalized = !0, ae.litElementHydrateSupport?.({ LitEleme
|
|
|
528
528
|
const Ge = ae.litElementPolyfillSupport;
|
|
529
529
|
Ge?.({ LitElement: T });
|
|
530
530
|
(ae.litElementVersions ??= []).push("4.2.2");
|
|
531
|
-
const Je = A`:host{cursor:pointer;-webkit-user-select:none;user-select:none}:host([disabled]){cursor:not-allowed;opacity:.6}.checkbox-container{position:relative;
|
|
532
|
-
var Qe = Object.defineProperty, et = Object.getOwnPropertyDescriptor, le = (t, e,
|
|
533
|
-
for (var
|
|
534
|
-
(n = t[
|
|
535
|
-
return
|
|
531
|
+
const Je = A`: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(--primary-color))}:host([checked]) .checkbox-box{background-color:var(--nf-primary-color,var(--primary-color));border-color:var(--nf-primary-color,var(--primary-color))}:host([disabled]) .checkbox-box{border-color:#ccc;background:#ccc;cursor:not-allowed;pointer-events:none}:host([disabled][checked]) .checkbox-box{background-color:#ccc;border-color:#ccc}.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(--primary-color));outline-offset:.125rem}`;
|
|
532
|
+
var Qe = Object.defineProperty, et = Object.getOwnPropertyDescriptor, le = (t, e, o, s) => {
|
|
533
|
+
for (var r = s > 1 ? void 0 : s ? et(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
534
|
+
(n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
|
|
535
|
+
return s && r && Qe(e, o, r), r;
|
|
536
536
|
};
|
|
537
|
-
let
|
|
537
|
+
let z = class extends T {
|
|
538
538
|
constructor() {
|
|
539
539
|
super(...arguments), this.checked = !1, this.disabled = !1;
|
|
540
540
|
}
|
|
@@ -550,65 +550,65 @@ let j = class extends T {
|
|
|
550
550
|
}
|
|
551
551
|
// 渲染复选框组件
|
|
552
552
|
render() {
|
|
553
|
-
return
|
|
553
|
+
return oe`<div class=checkbox-container @click=${this.toggleCheckbox} aria-checked=${this.checked} aria-disabled=${this.disabled} role=checkbox><div class=checkbox-box>${this.checked ? oe`<div class=checkbox-icon><svg aria-hidden=true data-icon=check fill=currentColor focusable=false height=0.625rem viewBox="64 64 896 896"width=0.625rem><path d="M912 190h-69.9c-9.8 0-19.1 4.5-25.1 12.2L404.7 724.5 207 474a32 32 0 00-25.1-12.2H112c-6.7 0-10.4 7.7-6.3 12.9l273.9 347c12.8 16.2 37.4 16.2 50.3 0l488.4-618.9c4.1-5.1.4-12.8-6.3-12.8z"></path></svg></div>` : ""}</div></div>`;
|
|
554
554
|
}
|
|
555
555
|
};
|
|
556
|
-
|
|
556
|
+
z.styles = [Je];
|
|
557
557
|
le([
|
|
558
558
|
h({ type: Boolean, reflect: !0 })
|
|
559
|
-
],
|
|
559
|
+
], z.prototype, "checked", 2);
|
|
560
560
|
le([
|
|
561
561
|
h({ type: Boolean, reflect: !0 })
|
|
562
|
-
],
|
|
563
|
-
|
|
562
|
+
], z.prototype, "disabled", 2);
|
|
563
|
+
z = le([
|
|
564
564
|
O("nf-checkbox")
|
|
565
|
-
],
|
|
566
|
-
const tt = { ATTRIBUTE: 1 },
|
|
567
|
-
let
|
|
565
|
+
], z);
|
|
566
|
+
const tt = { ATTRIBUTE: 1 }, ot = (t) => (...e) => ({ _$litDirective$: t, values: e });
|
|
567
|
+
let st = class {
|
|
568
568
|
constructor(e) {
|
|
569
569
|
}
|
|
570
570
|
get _$AU() {
|
|
571
571
|
return this._$AM._$AU;
|
|
572
572
|
}
|
|
573
|
-
_$AT(e,
|
|
574
|
-
this._$Ct = e, this._$AM =
|
|
573
|
+
_$AT(e, o, s) {
|
|
574
|
+
this._$Ct = e, this._$AM = o, this._$Ci = s;
|
|
575
575
|
}
|
|
576
|
-
_$AS(e,
|
|
577
|
-
return this.update(e,
|
|
576
|
+
_$AS(e, o) {
|
|
577
|
+
return this.update(e, o);
|
|
578
578
|
}
|
|
579
|
-
update(e,
|
|
580
|
-
return this.render(...
|
|
579
|
+
update(e, o) {
|
|
580
|
+
return this.render(...o);
|
|
581
581
|
}
|
|
582
582
|
};
|
|
583
|
-
const Ae = "important",
|
|
583
|
+
const Ae = "important", rt = " !" + Ae, J = ot(class extends st {
|
|
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
|
-
return Object.keys(t).reduce((e,
|
|
589
|
-
const
|
|
590
|
-
return
|
|
588
|
+
return Object.keys(t).reduce((e, o) => {
|
|
589
|
+
const s = t[o];
|
|
590
|
+
return s == null ? e : e + `${o = o.includes("-") ? o : o.replace(/(?:^(webkit|moz|ms|o)|)(?=[A-Z])/g, "-$&").toLowerCase()}:${s};`;
|
|
591
591
|
}, "");
|
|
592
592
|
}
|
|
593
593
|
update(t, [e]) {
|
|
594
|
-
const { style:
|
|
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
|
|
602
|
-
|
|
596
|
+
for (const s of this.ft) e[s] == null && (this.ft.delete(s), s.includes("-") ? o.removeProperty(s) : o[s] = null);
|
|
597
|
+
for (const s in e) {
|
|
598
|
+
const r = e[s];
|
|
599
|
+
if (r != null) {
|
|
600
|
+
this.ft.add(s);
|
|
601
|
+
const i = typeof r == "string" && r.endsWith(rt);
|
|
602
|
+
s.includes("-") || i ? o.setProperty(s, i ? r.slice(0, -11) : r, i ? Ae : "") : o[s] = r;
|
|
603
603
|
}
|
|
604
604
|
}
|
|
605
605
|
return D;
|
|
606
606
|
}
|
|
607
|
-
}), q = A`: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)}`,
|
|
608
|
-
var nt = Object.defineProperty, at = Object.getOwnPropertyDescriptor, v = (t, e,
|
|
609
|
-
for (var
|
|
610
|
-
(n = t[
|
|
611
|
-
return
|
|
607
|
+
}), q = A`: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 = A`: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);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([show-text=false]) .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));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, v = (t, e, o, s) => {
|
|
609
|
+
for (var r = s > 1 ? void 0 : s ? at(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
610
|
+
(n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
|
|
611
|
+
return s && r && nt(e, o, r), r;
|
|
612
612
|
};
|
|
613
613
|
let b = class extends R {
|
|
614
614
|
constructor() {
|
|
@@ -648,34 +648,34 @@ let b = class extends R {
|
|
|
648
648
|
}
|
|
649
649
|
// 从HEX颜色值更新HSB值
|
|
650
650
|
_updateHSBFromHex(t) {
|
|
651
|
-
const e = parseInt(t.slice(1, 3), 16) / 255,
|
|
651
|
+
const e = parseInt(t.slice(1, 3), 16) / 255, o = parseInt(t.slice(3, 5), 16) / 255, s = parseInt(t.slice(5, 7), 16) / 255, r = Math.max(e, o, s), i = Math.min(e, o, s), n = r - i;
|
|
652
652
|
let l = 0, a = 0;
|
|
653
|
-
const
|
|
654
|
-
n !== 0 && (a = n /
|
|
653
|
+
const c = r;
|
|
654
|
+
n !== 0 && (a = n / r, r === e ? l = (o - s) / n % 6 : r === o ? l = (s - e) / n + 2 : l = (e - o) / n + 4, l *= 60, l < 0 && (l += 360)), this._hsb = {
|
|
655
655
|
h: Math.round(l),
|
|
656
656
|
s: Math.round(a * 100),
|
|
657
|
-
b: Math.round(
|
|
657
|
+
b: Math.round(c * 100)
|
|
658
658
|
};
|
|
659
659
|
}
|
|
660
660
|
// 从HSB值生成HEX颜色值
|
|
661
|
-
_generateHexFromHSB(t, e,
|
|
662
|
-
e /= 100,
|
|
663
|
-
const
|
|
664
|
-
let l = 0, a = 0,
|
|
665
|
-
return 0 <= t && t < 60 ? (l =
|
|
661
|
+
_generateHexFromHSB(t, e, o, s = "FF") {
|
|
662
|
+
e /= 100, o /= 100;
|
|
663
|
+
const r = o * e, i = r * (1 - Math.abs(t / 60 % 2 - 1)), n = o - r;
|
|
664
|
+
let l = 0, a = 0, c = 0;
|
|
665
|
+
return 0 <= t && t < 60 ? (l = r, a = i, c = 0) : 60 <= t && t < 120 ? (l = i, a = r, c = 0) : 120 <= t && t < 180 ? (l = 0, a = r, c = i) : 180 <= t && t < 240 ? (l = 0, a = i, c = r) : 240 <= t && t < 300 ? (l = i, a = 0, c = r) : 300 <= t && t < 360 && (l = r, 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") + s;
|
|
666
666
|
}
|
|
667
667
|
// 计算面板位置
|
|
668
668
|
_updatePanelPosition() {
|
|
669
669
|
requestAnimationFrame(() => {
|
|
670
670
|
const t = this.getBoundingClientRect(), e = this.shadowRoot?.querySelector(".panel");
|
|
671
671
|
if (!e) return;
|
|
672
|
-
const
|
|
672
|
+
const o = 0.15 * 16, s = 8, r = e.offsetWidth || 240, i = e.offsetHeight || 300;
|
|
673
673
|
let n = this.placement, l = this.align;
|
|
674
|
-
this.autoAdjust && (n === "bottom" ? window.innerHeight - t.bottom -
|
|
674
|
+
this.autoAdjust && (n === "bottom" ? window.innerHeight - t.bottom - s < i && t.top - s >= i && (n = "top") : t.top - s < i && window.innerHeight - t.bottom - s >= i && (n = "bottom"), l === "right" ? t.right - o < r && t.left + t.width + o + r <= window.innerWidth && (l = "left") : t.left - o + r > window.innerWidth && t.right - o >= r && (l = "right"));
|
|
675
675
|
let a;
|
|
676
|
-
n === "bottom" ? a = t.height +
|
|
677
|
-
let
|
|
678
|
-
l === "right" ?
|
|
676
|
+
n === "bottom" ? a = t.height + s : a = -i - s;
|
|
677
|
+
let c;
|
|
678
|
+
l === "right" ? c = t.width - r + o : c = -o, this._panelPosition = { top: a, left: c };
|
|
679
679
|
});
|
|
680
680
|
}
|
|
681
681
|
// 打开面板
|
|
@@ -701,15 +701,15 @@ let b = class extends R {
|
|
|
701
701
|
this._panelVisible ? this._closePanel() : this._openPanel();
|
|
702
702
|
}
|
|
703
703
|
// 处理HSB颜色变化
|
|
704
|
-
_handleHSBChange(t, e,
|
|
705
|
-
this._hsb = { h: t, s: e, b:
|
|
706
|
-
const
|
|
707
|
-
this._handleColorChange(
|
|
704
|
+
_handleHSBChange(t, e, o) {
|
|
705
|
+
this._hsb = { h: t, s: e, b: o };
|
|
706
|
+
const s = this._internalValue.slice(7), r = this._generateHexFromHSB(t, e, o, s);
|
|
707
|
+
this._handleColorChange(r);
|
|
708
708
|
}
|
|
709
709
|
// 处理Alpha值变化
|
|
710
710
|
_handleAlphaChange(t) {
|
|
711
|
-
const e = Math.round(t * 255 / 100).toString(16).padStart(2, "0").toUpperCase(),
|
|
712
|
-
this._handleColorChange(
|
|
711
|
+
const e = Math.round(t * 255 / 100).toString(16).padStart(2, "0").toUpperCase(), o = "#" + this._internalValue.slice(1, 7) + e;
|
|
712
|
+
this._handleColorChange(o);
|
|
713
713
|
}
|
|
714
714
|
// 处理颜色变化
|
|
715
715
|
_handleColorChange(t) {
|
|
@@ -723,20 +723,20 @@ let b = class extends R {
|
|
|
723
723
|
}
|
|
724
724
|
// 处理色相选择
|
|
725
725
|
_handleHueChange(t) {
|
|
726
|
-
const e = t.target,
|
|
727
|
-
this._handleHSBChange(
|
|
726
|
+
const e = t.target, o = parseInt(e.value);
|
|
727
|
+
this._handleHSBChange(o, this._hsb.s, this._hsb.b);
|
|
728
728
|
}
|
|
729
729
|
// 处理饱和度和亮度选择
|
|
730
730
|
_handleSBChange(t) {
|
|
731
731
|
const e = this.shadowRoot?.querySelector(".color-sb");
|
|
732
732
|
if (!e) return;
|
|
733
|
-
const
|
|
734
|
-
this._handleHSBChange(this._hsb.h,
|
|
733
|
+
const o = e.getBoundingClientRect(), s = t instanceof MouseEvent ? t.clientX : t.touches[0].clientX, r = t instanceof MouseEvent ? t.clientY : t.touches[0].clientY, i = Math.max(0, Math.min(100, Math.round((s - o.left) / o.width * 100))), n = Math.max(0, Math.min(100, Math.round((1 - (r - o.top) / o.height) * 100)));
|
|
734
|
+
this._handleHSBChange(this._hsb.h, i, n);
|
|
735
735
|
}
|
|
736
736
|
// 处理透明度选择
|
|
737
737
|
_handleAlphaChangeInput(t) {
|
|
738
|
-
const e = t.target,
|
|
739
|
-
this._handleAlphaChange(
|
|
738
|
+
const e = t.target, o = parseInt(e.value);
|
|
739
|
+
this._handleAlphaChange(o);
|
|
740
740
|
}
|
|
741
741
|
// 渲染触发器
|
|
742
742
|
_renderTrigger() {
|
|
@@ -757,7 +757,7 @@ let b = class extends R {
|
|
|
757
757
|
}
|
|
758
758
|
// 渲染颜色选择区域
|
|
759
759
|
_renderColorSelector() {
|
|
760
|
-
const t = this._generateHexFromHSB(this._hsb.h, 100, 100, "FF"), e = this._hsb.s / 100 * 100,
|
|
760
|
+
const t = this._generateHexFromHSB(this._hsb.h, 100, 100, "FF"), e = this._hsb.s / 100 * 100, o = (1 - this._hsb.b / 100) * 100;
|
|
761
761
|
return p`
|
|
762
762
|
<div class="color-selector">
|
|
763
763
|
<div
|
|
@@ -775,7 +775,7 @@ let b = class extends R {
|
|
|
775
775
|
class="selector"
|
|
776
776
|
style=${J({
|
|
777
777
|
left: `${e}%`,
|
|
778
|
-
top: `${
|
|
778
|
+
top: `${o}%`
|
|
779
779
|
})}
|
|
780
780
|
></div>
|
|
781
781
|
</div>
|
|
@@ -860,7 +860,7 @@ let b = class extends R {
|
|
|
860
860
|
`;
|
|
861
861
|
}
|
|
862
862
|
};
|
|
863
|
-
b.styles = [q,
|
|
863
|
+
b.styles = [q, it];
|
|
864
864
|
v([
|
|
865
865
|
h({ type: String })
|
|
866
866
|
], b.prototype, "value", 2);
|
|
@@ -898,25 +898,25 @@ v([
|
|
|
898
898
|
})
|
|
899
899
|
], b.prototype, "autoAdjust", 2);
|
|
900
900
|
v([
|
|
901
|
-
|
|
901
|
+
y()
|
|
902
902
|
], b.prototype, "_panelVisible", 2);
|
|
903
903
|
v([
|
|
904
|
-
|
|
904
|
+
y()
|
|
905
905
|
], b.prototype, "_internalValue", 2);
|
|
906
906
|
v([
|
|
907
|
-
|
|
907
|
+
y()
|
|
908
908
|
], b.prototype, "_hsb", 2);
|
|
909
909
|
v([
|
|
910
|
-
|
|
910
|
+
y()
|
|
911
911
|
], b.prototype, "_panelPosition", 2);
|
|
912
912
|
b = v([
|
|
913
913
|
O("nf-color-picker")
|
|
914
914
|
], b);
|
|
915
|
-
const lt = A`:host{min-width:10rem;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%)}.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}`;
|
|
916
|
-
var ht = Object.defineProperty,
|
|
917
|
-
for (var
|
|
918
|
-
(n = t[
|
|
919
|
-
return
|
|
915
|
+
const lt = A`:host{min-width:10rem;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}`;
|
|
916
|
+
var ht = Object.defineProperty, ct = Object.getOwnPropertyDescriptor, V = (t, e, o, s) => {
|
|
917
|
+
for (var r = s > 1 ? void 0 : s ? ct(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
918
|
+
(n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
|
|
919
|
+
return s && r && ht(e, o, r), r;
|
|
920
920
|
};
|
|
921
921
|
let x = class extends R {
|
|
922
922
|
constructor() {
|
|
@@ -995,37 +995,37 @@ V([
|
|
|
995
995
|
h({ type: Boolean, reflect: !0 })
|
|
996
996
|
], x.prototype, "disabled", 2);
|
|
997
997
|
V([
|
|
998
|
-
|
|
998
|
+
y()
|
|
999
999
|
], x.prototype, "showPassword", 2);
|
|
1000
1000
|
x = V([
|
|
1001
1001
|
O("nf-input")
|
|
1002
1002
|
], x);
|
|
1003
|
-
const
|
|
1004
|
-
var ut = Object.defineProperty, pt = Object.getOwnPropertyDescriptor, _ = (t, e,
|
|
1005
|
-
for (var
|
|
1006
|
-
(n = t[
|
|
1007
|
-
return
|
|
1003
|
+
const dt = A`:host{min-width:10rem;position:relative;display:inline-block;box-sizing:border-box;padding:0;overflow:hidden}.input-number-container{position:relative;width:100%;height:100%;display:flex;align-items:center;box-sizing:border-box}.input-number{position:relative;flex:1;height:100%;outline:0;border:none;background:0 0;box-sizing:border-box;color:var(--nf-color);font-weight:var(--nf-font-weight);text-align:left}.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-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}.input-number:hover .controls{width:1.5rem}.input-prefix{display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding-inline-start:.6125rem;color:var(--nf-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-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}`;
|
|
1004
|
+
var ut = Object.defineProperty, pt = Object.getOwnPropertyDescriptor, _ = (t, e, o, s) => {
|
|
1005
|
+
for (var r = s > 1 ? void 0 : s ? pt(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
1006
|
+
(n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
|
|
1007
|
+
return s && r && ut(e, o, r), r;
|
|
1008
1008
|
};
|
|
1009
1009
|
let m = class extends R {
|
|
1010
1010
|
constructor() {
|
|
1011
1011
|
super(...arguments), this.value = 0, this.controls = !0, this.changeOnWheel = !0, this.step = 1, this.decimalSeparator = ".", this.prefix = "", this.suffix = "", this.disabled = !1, this.isInputFocused = !1, this.handleInput = (t) => {
|
|
1012
1012
|
t.stopPropagation();
|
|
1013
|
-
const
|
|
1013
|
+
const o = t.target.value;
|
|
1014
1014
|
this.dispatchEvent(
|
|
1015
1015
|
new CustomEvent("input", {
|
|
1016
|
-
detail:
|
|
1016
|
+
detail: o,
|
|
1017
1017
|
bubbles: !0,
|
|
1018
1018
|
composed: !0
|
|
1019
1019
|
})
|
|
1020
1020
|
);
|
|
1021
1021
|
}, this.handleChange = (t) => {
|
|
1022
1022
|
t.stopPropagation();
|
|
1023
|
-
const e = t.target,
|
|
1024
|
-
if (
|
|
1025
|
-
const
|
|
1026
|
-
|
|
1023
|
+
const e = t.target, o = this.parseInputValue(e.value);
|
|
1024
|
+
if (o !== null) {
|
|
1025
|
+
const s = this.clampValue(o);
|
|
1026
|
+
s !== this.value && (this.value = s, this.dispatchEvent(
|
|
1027
1027
|
new CustomEvent("change", {
|
|
1028
|
-
detail:
|
|
1028
|
+
detail: s,
|
|
1029
1029
|
bubbles: !0,
|
|
1030
1030
|
composed: !0
|
|
1031
1031
|
})
|
|
@@ -1058,12 +1058,12 @@ let m = class extends R {
|
|
|
1058
1058
|
}} aria-label="Decrease value"class="control-btn control-btn-down"type=button><svg height=12 viewBox="0 0 24 24"width=12><path d="M18 9.4l-6 6.6-6-6.6"/></svg></button></div>` : ""}</div>${this.suffix ? p`<div class=input-suffix>${this.suffix}</div>` : ""}</div>`;
|
|
1059
1059
|
}
|
|
1060
1060
|
formatDisplayValue(t) {
|
|
1061
|
-
return isNaN(t) ? "" : t.toString().replace(".", this.decimalSeparator);
|
|
1061
|
+
return t === null || isNaN(t) ? "" : t.toString().replace(".", this.decimalSeparator);
|
|
1062
1062
|
}
|
|
1063
1063
|
parseInputValue(t) {
|
|
1064
1064
|
if (!t) return null;
|
|
1065
|
-
const e = t.replace(this.decimalSeparator, "."),
|
|
1066
|
-
return isNaN(
|
|
1065
|
+
const e = t.replace(this.decimalSeparator, "."), o = parseFloat(e);
|
|
1066
|
+
return isNaN(o) ? null : o;
|
|
1067
1067
|
}
|
|
1068
1068
|
clampValue(t) {
|
|
1069
1069
|
let e = t;
|
|
@@ -1071,23 +1071,23 @@ let m = class extends R {
|
|
|
1071
1071
|
}
|
|
1072
1072
|
handleStepChange(t) {
|
|
1073
1073
|
if (this.disabled) return;
|
|
1074
|
-
const e = this.clampValue(
|
|
1075
|
-
|
|
1074
|
+
const e = this.value ?? 0, o = this.clampValue(e + t * this.step);
|
|
1075
|
+
o !== this.value && (this.value = o, this.dispatchEvent(
|
|
1076
1076
|
new CustomEvent("step", {
|
|
1077
|
-
detail:
|
|
1077
|
+
detail: o,
|
|
1078
1078
|
bubbles: !0,
|
|
1079
1079
|
composed: !0
|
|
1080
1080
|
})
|
|
1081
1081
|
), this.dispatchEvent(
|
|
1082
1082
|
new CustomEvent("change", {
|
|
1083
|
-
detail:
|
|
1083
|
+
detail: o,
|
|
1084
1084
|
bubbles: !0,
|
|
1085
1085
|
composed: !0
|
|
1086
1086
|
})
|
|
1087
1087
|
));
|
|
1088
1088
|
}
|
|
1089
1089
|
};
|
|
1090
|
-
m.styles = [q,
|
|
1090
|
+
m.styles = [q, dt];
|
|
1091
1091
|
_([
|
|
1092
1092
|
h({ type: Number })
|
|
1093
1093
|
], m.prototype, "value", 2);
|
|
@@ -1119,7 +1119,7 @@ _([
|
|
|
1119
1119
|
h({ type: Boolean, reflect: !0 })
|
|
1120
1120
|
], m.prototype, "disabled", 2);
|
|
1121
1121
|
_([
|
|
1122
|
-
|
|
1122
|
+
y()
|
|
1123
1123
|
], m.prototype, "isInputFocused", 2);
|
|
1124
1124
|
m = _([
|
|
1125
1125
|
O("nf-input-number")
|
|
@@ -1128,10 +1128,10 @@ async function ft(t) {
|
|
|
1128
1128
|
return new Promise((e) => setTimeout(e, t));
|
|
1129
1129
|
}
|
|
1130
1130
|
const bt = A`:host{min-width:5rem;-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}`;
|
|
1131
|
-
var mt = Object.defineProperty, gt = Object.getOwnPropertyDescriptor, K = (t, e,
|
|
1132
|
-
for (var
|
|
1133
|
-
(n = t[
|
|
1134
|
-
return
|
|
1131
|
+
var mt = Object.defineProperty, gt = Object.getOwnPropertyDescriptor, K = (t, e, o, s) => {
|
|
1132
|
+
for (var r = s > 1 ? void 0 : s ? gt(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
1133
|
+
(n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
|
|
1134
|
+
return s && r && mt(e, o, r), r;
|
|
1135
1135
|
};
|
|
1136
1136
|
let M = class extends R {
|
|
1137
1137
|
constructor() {
|
|
@@ -1155,9 +1155,9 @@ let M = class extends R {
|
|
|
1155
1155
|
this.dispatchEvent(new CustomEvent("input", { detail: t, bubbles: !0, composed: !0 })), this.value !== t && this.dispatchEvent(new CustomEvent("change", { detail: t, bubbles: !0, composed: !0 })), await ft(34), this.blur();
|
|
1156
1156
|
}
|
|
1157
1157
|
render() {
|
|
1158
|
-
const t = this.options.findIndex((
|
|
1158
|
+
const t = this.options.findIndex((o) => o.value == this.value), e = t > -1 ? this.options[t]?.label : this.value;
|
|
1159
1159
|
return p`<div class=dropdown>${(this.showDropdown ? this.options : []).map(
|
|
1160
|
-
(
|
|
1160
|
+
(o) => p`<div @click=${() => this.set(o.value)} class="${this.value == o.value ? "item-selected" : "item-unselected"} item">${o.label}</div>`
|
|
1161
1161
|
)}</div><slot></slot><div class=text>${e}</div><svg class=icon height=24 viewBox="0 0 24 24"width=24><path d="M17 10l-5 5.5-5-5.5"/></svg>`;
|
|
1162
1162
|
}
|
|
1163
1163
|
connectedCallback() {
|
|
@@ -1193,18 +1193,18 @@ K([
|
|
|
1193
1193
|
h({ type: Boolean, reflect: !0 })
|
|
1194
1194
|
], M.prototype, "disabled", 2);
|
|
1195
1195
|
K([
|
|
1196
|
-
|
|
1196
|
+
y()
|
|
1197
1197
|
], M.prototype, "showDropdown", 2);
|
|
1198
1198
|
M = K([
|
|
1199
1199
|
O("nf-select")
|
|
1200
1200
|
], M);
|
|
1201
|
-
const vt = A`: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(--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-
|
|
1202
|
-
var _t = Object.defineProperty,
|
|
1203
|
-
for (var
|
|
1204
|
-
(n = t[
|
|
1205
|
-
return
|
|
1201
|
+
const vt = A`: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(--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(--primary-color));outline-offset:.125rem}`;
|
|
1202
|
+
var _t = Object.defineProperty, wt = Object.getOwnPropertyDescriptor, he = (t, e, o, s) => {
|
|
1203
|
+
for (var r = s > 1 ? void 0 : s ? wt(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
1204
|
+
(n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
|
|
1205
|
+
return s && r && _t(e, o, r), r;
|
|
1206
1206
|
};
|
|
1207
|
-
let
|
|
1207
|
+
let j = class extends T {
|
|
1208
1208
|
constructor() {
|
|
1209
1209
|
super(...arguments), this.checked = !1, this.disabled = !1, this.rippleElement = null;
|
|
1210
1210
|
}
|
|
@@ -1221,33 +1221,33 @@ let z = class extends T {
|
|
|
1221
1221
|
createRipple(t) {
|
|
1222
1222
|
const e = this.shadowRoot?.querySelector(".switch-wrapper");
|
|
1223
1223
|
if (!e) return;
|
|
1224
|
-
const
|
|
1225
|
-
|
|
1226
|
-
const
|
|
1227
|
-
|
|
1228
|
-
e.contains(
|
|
1224
|
+
const o = e.querySelector(".ripple");
|
|
1225
|
+
o && e.removeChild(o);
|
|
1226
|
+
const s = document.createElement("div");
|
|
1227
|
+
s.classList.add("ripple"), e.appendChild(s), s.addEventListener("animationend", () => {
|
|
1228
|
+
e.contains(s) && e.removeChild(s);
|
|
1229
1229
|
});
|
|
1230
1230
|
}
|
|
1231
1231
|
// 渲染开关组件
|
|
1232
1232
|
render() {
|
|
1233
|
-
return
|
|
1233
|
+
return oe`<div class=switch-wrapper><div class=switch-container @click=${this.toggleSwitch} aria-checked=${this.checked} aria-disabled=${this.disabled} role=switch><div class=switch-thumb></div></div></div>`;
|
|
1234
1234
|
}
|
|
1235
1235
|
};
|
|
1236
|
-
|
|
1236
|
+
j.styles = [vt];
|
|
1237
1237
|
he([
|
|
1238
1238
|
h({ type: Boolean, reflect: !0 })
|
|
1239
|
-
],
|
|
1239
|
+
], j.prototype, "checked", 2);
|
|
1240
1240
|
he([
|
|
1241
1241
|
h({ type: Boolean, reflect: !0 })
|
|
1242
|
-
],
|
|
1243
|
-
|
|
1242
|
+
], j.prototype, "disabled", 2);
|
|
1243
|
+
j = he([
|
|
1244
1244
|
O("nf-switch")
|
|
1245
|
-
],
|
|
1246
|
-
const
|
|
1247
|
-
var $t = Object.defineProperty, xt = Object.getOwnPropertyDescriptor,
|
|
1248
|
-
for (var
|
|
1249
|
-
(n = t[
|
|
1250
|
-
return
|
|
1245
|
+
], j);
|
|
1246
|
+
const yt = A`:host{display:inline-flex;align-items:center;position:relative;min-width:10rem;width:var(--nf-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}`;
|
|
1247
|
+
var $t = Object.defineProperty, xt = Object.getOwnPropertyDescriptor, w = (t, e, o, s) => {
|
|
1248
|
+
for (var r = s > 1 ? void 0 : s ? xt(e, o) : e, i = t.length - 1, n; i >= 0; i--)
|
|
1249
|
+
(n = t[i]) && (r = (s ? n(e, o, r) : n(r)) || r);
|
|
1250
|
+
return s && r && $t(e, o, r), r;
|
|
1251
1251
|
};
|
|
1252
1252
|
let g = class extends R {
|
|
1253
1253
|
constructor() {
|
|
@@ -1318,7 +1318,7 @@ let g = class extends R {
|
|
|
1318
1318
|
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);
|
|
1319
1319
|
}
|
|
1320
1320
|
_updateValue(t) {
|
|
1321
|
-
const e = this.getBoundingClientRect(),
|
|
1321
|
+
const e = this.getBoundingClientRect(), o = t instanceof MouseEvent ? t.clientX : t.touches[0].clientX, s = Math.max(0, Math.min(1, (o - e.left) / e.width)), r = this.max - this.min, i = this.min + s * r, n = Math.round((i - this.min) / this.step), l = this.min + n * this.step;
|
|
1322
1322
|
this._currentValue = Math.min(this.max, Math.max(this.min, l)), this.requestUpdate();
|
|
1323
1323
|
}
|
|
1324
1324
|
_getValuePercentage() {
|
|
@@ -1326,53 +1326,53 @@ let g = class extends R {
|
|
|
1326
1326
|
return t === 0 ? 0 : (this._currentValue - this.min) / t * 100;
|
|
1327
1327
|
}
|
|
1328
1328
|
render() {
|
|
1329
|
-
const t = this._getValuePercentage(), e = `${t}%`,
|
|
1330
|
-
return p`<div class=slider-fill style=${J({ width:
|
|
1329
|
+
const t = this._getValuePercentage(), e = `${t}%`, o = `${t}%`, s = `slider-tooltip ${this._showTooltip || this.tooltip ? "visible" : ""}`;
|
|
1330
|
+
return p`<div class=slider-fill style=${J({ width: o })}></div><div class=slider-handle style=${J({ left: e })} @keydown=${this.disabled ? -1 : 0} @mousedown=${this._handleMouseDown} @touchstart=${this._handleTouchStart} tabindex=${this._handleKeyDown}><div class=${s}>${this._currentValue}</div></div>`;
|
|
1331
1331
|
}
|
|
1332
1332
|
};
|
|
1333
|
-
g.styles = [q,
|
|
1334
|
-
|
|
1333
|
+
g.styles = [q, yt];
|
|
1334
|
+
w([
|
|
1335
1335
|
h({ type: Number })
|
|
1336
1336
|
], g.prototype, "value", 2);
|
|
1337
|
-
|
|
1337
|
+
w([
|
|
1338
1338
|
h({ type: Number })
|
|
1339
1339
|
], g.prototype, "defaultValue", 2);
|
|
1340
|
-
|
|
1340
|
+
w([
|
|
1341
1341
|
h({ type: Number })
|
|
1342
1342
|
], g.prototype, "min", 2);
|
|
1343
|
-
|
|
1343
|
+
w([
|
|
1344
1344
|
h({ type: Number })
|
|
1345
1345
|
], g.prototype, "max", 2);
|
|
1346
|
-
|
|
1346
|
+
w([
|
|
1347
1347
|
h({ type: Number })
|
|
1348
1348
|
], g.prototype, "step", 2);
|
|
1349
|
-
|
|
1349
|
+
w([
|
|
1350
1350
|
h({ type: Boolean, reflect: !0 })
|
|
1351
1351
|
], g.prototype, "disabled", 2);
|
|
1352
|
-
|
|
1352
|
+
w([
|
|
1353
1353
|
h({ type: Boolean })
|
|
1354
1354
|
], g.prototype, "range", 2);
|
|
1355
|
-
|
|
1355
|
+
w([
|
|
1356
1356
|
h({ type: Boolean })
|
|
1357
1357
|
], g.prototype, "tooltip", 2);
|
|
1358
|
-
|
|
1359
|
-
|
|
1358
|
+
w([
|
|
1359
|
+
y()
|
|
1360
1360
|
], g.prototype, "_currentValue", 2);
|
|
1361
|
-
|
|
1362
|
-
|
|
1361
|
+
w([
|
|
1362
|
+
y()
|
|
1363
1363
|
], g.prototype, "_isDragging", 2);
|
|
1364
|
-
|
|
1365
|
-
|
|
1364
|
+
w([
|
|
1365
|
+
y()
|
|
1366
1366
|
], g.prototype, "_showTooltip", 2);
|
|
1367
|
-
g =
|
|
1367
|
+
g = w([
|
|
1368
1368
|
O("nf-slider")
|
|
1369
1369
|
], g);
|
|
1370
1370
|
export {
|
|
1371
|
-
|
|
1371
|
+
z as NfCheckboxElement,
|
|
1372
1372
|
b as NfColorPickerElement,
|
|
1373
1373
|
x as NfInputElement,
|
|
1374
1374
|
m as NfInputNumberElement,
|
|
1375
1375
|
M as NfSelectElement,
|
|
1376
1376
|
g as NfSliderElement,
|
|
1377
|
-
|
|
1377
|
+
j as NfSwitchElement
|
|
1378
1378
|
};
|