@seed-ship/mcp-ui-solid 4.0.6 → 4.2.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/components/AgentCard.cjs +122 -0
- package/dist/components/AgentCard.cjs.map +1 -0
- package/dist/components/AgentCard.d.ts +20 -0
- package/dist/components/AgentCard.d.ts.map +1 -0
- package/dist/components/AgentCard.js +122 -0
- package/dist/components/AgentCard.js.map +1 -0
- package/dist/components/AgentHandoff.cjs +49 -0
- package/dist/components/AgentHandoff.cjs.map +1 -0
- package/dist/components/AgentHandoff.d.ts +12 -0
- package/dist/components/AgentHandoff.d.ts.map +1 -0
- package/dist/components/AgentHandoff.js +49 -0
- package/dist/components/AgentHandoff.js.map +1 -0
- package/dist/components/BriefingDiff.cjs +165 -0
- package/dist/components/BriefingDiff.cjs.map +1 -0
- package/dist/components/BriefingDiff.d.ts +12 -0
- package/dist/components/BriefingDiff.d.ts.map +1 -0
- package/dist/components/BriefingDiff.js +165 -0
- package/dist/components/BriefingDiff.js.map +1 -0
- package/dist/components/FormFieldRenderer.cjs +314 -264
- package/dist/components/FormFieldRenderer.cjs.map +1 -1
- package/dist/components/FormFieldRenderer.d.ts.map +1 -1
- package/dist/components/FormFieldRenderer.js +315 -265
- package/dist/components/FormFieldRenderer.js.map +1 -1
- package/dist/components/FormRenderer.cjs +74 -17
- package/dist/components/FormRenderer.cjs.map +1 -1
- package/dist/components/FormRenderer.d.ts.map +1 -1
- package/dist/components/FormRenderer.js +76 -19
- package/dist/components/FormRenderer.js.map +1 -1
- package/dist/components/ScratchpadPanel.cjs +618 -411
- package/dist/components/ScratchpadPanel.cjs.map +1 -1
- package/dist/components/ScratchpadPanel.d.ts.map +1 -1
- package/dist/components/ScratchpadPanel.js +619 -412
- package/dist/components/ScratchpadPanel.js.map +1 -1
- package/dist/components/SplitStepper.cjs +121 -0
- package/dist/components/SplitStepper.cjs.map +1 -0
- package/dist/components/SplitStepper.d.ts +12 -0
- package/dist/components/SplitStepper.d.ts.map +1 -0
- package/dist/components/SplitStepper.js +121 -0
- package/dist/components/SplitStepper.js.map +1 -0
- package/dist/components/index.d.ts +8 -0
- package/dist/components/index.d.ts.map +1 -1
- package/dist/components.cjs +9 -0
- package/dist/components.cjs.map +1 -1
- package/dist/components.d.cts +8 -0
- package/dist/components.d.ts +8 -0
- package/dist/components.js +9 -0
- package/dist/components.js.map +1 -1
- package/dist/index.cjs +9 -0
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +9 -1
- package/dist/index.d.ts +9 -1
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +9 -0
- package/dist/index.js.map +1 -1
- package/dist/types/chat-bus.d.ts +81 -1
- package/dist/types/chat-bus.d.ts.map +1 -1
- package/dist/types/index.d.ts +15 -0
- package/dist/types/index.d.ts.map +1 -1
- package/dist/types.d.cts +15 -0
- package/dist/types.d.ts +15 -0
- package/package.json +1 -1
- package/src/components/AgentCard.tsx +109 -0
- package/src/components/AgentHandoff.tsx +64 -0
- package/src/components/BriefingDiff.tsx +93 -0
- package/src/components/FormFieldRenderer.tsx +35 -4
- package/src/components/FormRenderer.tsx +74 -4
- package/src/components/ScratchpadPanel.tsx +131 -49
- package/src/components/SplitStepper.tsx +111 -0
- package/src/components/index.ts +13 -0
- package/src/index.ts +15 -0
- package/src/types/chat-bus.ts +70 -1
- package/src/types/index.ts +18 -0
- package/tsconfig.tsbuildinfo +1 -1
|
@@ -3,7 +3,22 @@ Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
|
|
|
3
3
|
const web = require("solid-js/web");
|
|
4
4
|
const solidJs = require("solid-js");
|
|
5
5
|
const useConditionalField = require("../hooks/useConditionalField.cjs");
|
|
6
|
-
var _tmpl$ = /* @__PURE__ */ web.template(`<span class="text-red-500 ml-1"aria-hidden=true>*`), _tmpl$
|
|
6
|
+
var _tmpl$ = /* @__PURE__ */ web.template(`<span class=mr-1>`), _tmpl$2 = /* @__PURE__ */ web.template(`<span class="text-red-500 ml-1"aria-hidden=true>*`), _tmpl$3 = /* @__PURE__ */ web.template(`<span class="ml-2 text-[10px] font-medium bg-orange-100 dark:bg-orange-900/30 text-orange-600 dark:text-orange-400 px-1.5 py-0.5 rounded">Not supported`), _tmpl$4 = /* @__PURE__ */ web.template(`<span class="ml-2 text-[10px] font-medium bg-yellow-100 dark:bg-yellow-900/30 text-yellow-600 dark:text-yellow-400 px-1.5 py-0.5 rounded">?`), _tmpl$5 = /* @__PURE__ */ web.template(`<label><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/>`), _tmpl$6 = /* @__PURE__ */ web.template(`<input>`), _tmpl$7 = /* @__PURE__ */ web.template(`<input type=number>`), _tmpl$8 = /* @__PURE__ */ web.template(`<input type=date>`), _tmpl$9 = /* @__PURE__ */ web.template(`<textarea>`), _tmpl$0 = /* @__PURE__ */ web.template(`<option value disabled>`), _tmpl$1 = /* @__PURE__ */ web.template(`<select><!$><!/><!$><!/>`), _tmpl$10 = /* @__PURE__ */ web.template(`<label class="flex items-center gap-2 cursor-pointer"><input type=checkbox class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500 dark:border-gray-600 dark:bg-gray-700"><span class="text-sm text-gray-700 dark:text-gray-300"><!$><!/><!$><!/>`), _tmpl$11 = /* @__PURE__ */ web.template(`<div class=space-y-2 role=radiogroup>`), _tmpl$12 = /* @__PURE__ */ web.template(`<div class="flex items-center gap-3"><input type=range class="flex-1 h-2 bg-gray-200 dark:bg-gray-600 rounded-lg appearance-none cursor-pointer accent-blue-600"><span class="text-sm font-mono text-gray-700 dark:text-gray-300 min-w-[3rem] text-right">`), _tmpl$13 = /* @__PURE__ */ web.template(`<label class="flex items-center gap-2 cursor-pointer"><button type=button role=switch><span></span></button><span class="text-sm text-gray-700 dark:text-gray-300">`), _tmpl$14 = /* @__PURE__ */ web.template(`<fieldset class="border border-gray-200 dark:border-gray-600 rounded-lg p-3"><legend class="text-xs font-medium text-gray-500 dark:text-gray-400 px-1"></legend><p class="text-xs text-gray-400">`), _tmpl$15 = /* @__PURE__ */ web.template(`<input type=text>`), _tmpl$16 = /* @__PURE__ */ web.template(`<p class="text-xs text-amber-500 mt-0.5">Unknown field type: <!$><!/>`), _tmpl$17 = /* @__PURE__ */ web.template(`<p>`), _tmpl$18 = /* @__PURE__ */ web.template(`<p class="text-xs text-gray-500 dark:text-gray-400">`), _tmpl$19 = /* @__PURE__ */ web.template(`<p role=alert class="text-xs text-red-600 dark:text-red-400">`), _tmpl$20 = /* @__PURE__ */ web.template(`<div class=space-y-1><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/><!$><!/>`), _tmpl$21 = /* @__PURE__ */ web.template(`<option>`), _tmpl$22 = /* @__PURE__ */ web.template(`<label class="flex items-center gap-2 cursor-pointer"><input type=radio class="w-4 h-4 border-gray-300 text-blue-600 focus:ring-blue-500 dark:border-gray-600"><span class="text-sm text-gray-700 dark:text-gray-300">`), _tmpl$23 = /* @__PURE__ */ web.template(`<div class="flex flex-wrap gap-1 mb-1">`), _tmpl$24 = /* @__PURE__ */ web.template(`<div class="p-2 border-b border-gray-200 dark:border-gray-600 flex-shrink-0"><input type=text placeholder=Filter... class="w-full px-2 py-1 text-sm border border-gray-200 dark:border-gray-600 rounded bg-white dark:bg-gray-700 text-gray-900 dark:text-white focus:border-blue-400 outline-none"autofocus>`), _tmpl$25 = /* @__PURE__ */ web.template(`<p class="px-3 py-2 text-sm text-gray-400">No matches`), _tmpl$26 = /* @__PURE__ */ web.template(`<div class="absolute z-50 mt-1 w-full bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-md shadow-lg"style=max-height:320px;display:flex;flex-direction:column><!$><!/><div style=overflow-y:auto;flex:1;-webkit-overflow-scrolling:touch><!$><!/><!$><!/>`), _tmpl$27 = /* @__PURE__ */ web.template(`<div class=relative><!$><!/><button type=button><span></span><svg class="w-4 h-4 text-gray-400"fill=none viewBox="0 0 24 24"stroke=currentColor><path stroke-linecap=round stroke-linejoin=round stroke-width=2 d="M19 9l-7 7-7-7"></path></svg></button><!$><!/>`), _tmpl$28 = /* @__PURE__ */ web.template(`<span class="inline-flex items-center gap-1 px-2 py-0.5 text-xs font-medium bg-blue-100 dark:bg-blue-900/30 text-blue-700 dark:text-blue-300 rounded-full"><!$><!/><button type=button class="hover:text-blue-900 dark:hover:text-blue-100">×`), _tmpl$29 = /* @__PURE__ */ web.template(`<label class="flex items-center gap-2 px-3 py-2 hover:bg-gray-100 dark:hover:bg-gray-700 cursor-pointer text-sm"><input type=checkbox class="w-4 h-4 rounded border-gray-300 text-blue-600 focus:ring-blue-500 dark:border-gray-600"><span class="text-gray-900 dark:text-white">`), _tmpl$30 = /* @__PURE__ */ web.template(`<div class="absolute z-20 mt-1 w-full bg-white dark:bg-gray-800 border border-gray-200 dark:border-gray-600 rounded-md shadow-lg max-h-72 overflow-y-auto">`), _tmpl$31 = /* @__PURE__ */ web.template(`<div class=relative><!$><!/><input type=text autocomplete=off><!$><!/>`), _tmpl$32 = /* @__PURE__ */ web.template(`<span class="ml-2 text-xs">✓`), _tmpl$33 = /* @__PURE__ */ web.template(`<button type=button><!$><!/><!$><!/>`), _tmpl$34 = /* @__PURE__ */ web.template(`<div><!$><!/><input type=text>`);
|
|
7
|
+
const SOURCE_BADGES = {
|
|
8
|
+
detected: {
|
|
9
|
+
icon: "✅",
|
|
10
|
+
title: "Detected from message"
|
|
11
|
+
},
|
|
12
|
+
inferred: {
|
|
13
|
+
icon: "🔗",
|
|
14
|
+
title: "Inferred from context"
|
|
15
|
+
},
|
|
16
|
+
user: {
|
|
17
|
+
icon: "✏️",
|
|
18
|
+
title: "Previously provided"
|
|
19
|
+
},
|
|
20
|
+
default: null
|
|
21
|
+
};
|
|
7
22
|
const FormFieldRenderer = (props) => {
|
|
8
23
|
const {
|
|
9
24
|
isVisible
|
|
@@ -11,9 +26,18 @@ const FormFieldRenderer = (props) => {
|
|
|
11
26
|
condition: props.field.showWhen,
|
|
12
27
|
formData: props.formData || (() => ({}))
|
|
13
28
|
});
|
|
29
|
+
const [isMuted, setIsMuted] = solidJs.createSignal(!!props.field.muted);
|
|
30
|
+
const handleFieldFocus = () => {
|
|
31
|
+
if (isMuted()) setIsMuted(false);
|
|
32
|
+
};
|
|
14
33
|
const status = () => props.field.fieldStatus || "optional";
|
|
15
34
|
const isUnsupported = () => status() === "unsupported";
|
|
16
35
|
const isFieldDisabled = () => props.disabled || isUnsupported();
|
|
36
|
+
const sourceBadge = () => {
|
|
37
|
+
const src = props.field.source;
|
|
38
|
+
if (!src) return null;
|
|
39
|
+
return SOURCE_BADGES[src];
|
|
40
|
+
};
|
|
17
41
|
const baseInputClass = () => `
|
|
18
42
|
w-full px-3 py-2 border rounded-md
|
|
19
43
|
focus:ring-2 focus:ring-blue-500 focus:border-blue-500
|
|
@@ -21,6 +45,7 @@ const FormFieldRenderer = (props) => {
|
|
|
21
45
|
${props.error ? "border-red-500 focus:ring-red-500" : "border-gray-300 dark:border-gray-600"}
|
|
22
46
|
dark:bg-gray-700 dark:text-white
|
|
23
47
|
${isUnsupported() ? "opacity-50" : ""}
|
|
48
|
+
${isMuted() ? "bg-gray-50 dark:bg-gray-700/50 text-gray-500 dark:text-gray-400" : ""}
|
|
24
49
|
`;
|
|
25
50
|
const fieldId = () => `field-${props.field.name}`;
|
|
26
51
|
const errorId = () => `${props.field.name}-error`;
|
|
@@ -29,40 +54,53 @@ const FormFieldRenderer = (props) => {
|
|
|
29
54
|
return isVisible();
|
|
30
55
|
},
|
|
31
56
|
get children() {
|
|
32
|
-
var _el$ = web.getNextElement(_tmpl$
|
|
57
|
+
var _el$ = web.getNextElement(_tmpl$20), _el$53 = _el$.firstChild, [_el$54, _co$1] = web.getNextMarker(_el$53.nextSibling), _el$55 = _el$54.nextSibling, [_el$56, _co$10] = web.getNextMarker(_el$55.nextSibling), _el$57 = _el$56.nextSibling, [_el$58, _co$11] = web.getNextMarker(_el$57.nextSibling), _el$59 = _el$58.nextSibling, [_el$60, _co$12] = web.getNextMarker(_el$59.nextSibling), _el$61 = _el$60.nextSibling, [_el$62, _co$13] = web.getNextMarker(_el$61.nextSibling), _el$63 = _el$62.nextSibling, [_el$64, _co$14] = web.getNextMarker(_el$63.nextSibling);
|
|
58
|
+
_el$.$$click = handleFieldFocus;
|
|
59
|
+
_el$.$$focusin = handleFieldFocus;
|
|
33
60
|
web.insert(_el$, web.createComponent(solidJs.Show, {
|
|
34
61
|
get when() {
|
|
35
62
|
return web.memo(() => !!props.field.label)() && props.field.type !== "checkbox";
|
|
36
63
|
},
|
|
37
64
|
get children() {
|
|
38
|
-
var _el$2 = web.getNextElement(_tmpl$
|
|
39
|
-
web.insert(_el$2, (
|
|
65
|
+
var _el$2 = web.getNextElement(_tmpl$5), _el$7 = _el$2.firstChild, [_el$8, _co$] = web.getNextMarker(_el$7.nextSibling), _el$9 = _el$8.nextSibling, [_el$0, _co$2] = web.getNextMarker(_el$9.nextSibling), _el$1 = _el$0.nextSibling, [_el$10, _co$3] = web.getNextMarker(_el$1.nextSibling), _el$11 = _el$10.nextSibling, [_el$12, _co$4] = web.getNextMarker(_el$11.nextSibling), _el$13 = _el$12.nextSibling, [_el$14, _co$5] = web.getNextMarker(_el$13.nextSibling);
|
|
66
|
+
web.insert(_el$2, web.createComponent(solidJs.Show, {
|
|
67
|
+
get when() {
|
|
68
|
+
return sourceBadge();
|
|
69
|
+
},
|
|
70
|
+
get children() {
|
|
71
|
+
var _el$3 = web.getNextElement(_tmpl$);
|
|
72
|
+
web.insert(_el$3, () => sourceBadge().icon);
|
|
73
|
+
web.effect(() => web.setAttribute(_el$3, "title", sourceBadge().title));
|
|
74
|
+
return _el$3;
|
|
75
|
+
}
|
|
76
|
+
}), _el$8, _co$);
|
|
77
|
+
web.insert(_el$2, () => props.field.label, _el$0, _co$2);
|
|
40
78
|
web.insert(_el$2, web.createComponent(solidJs.Show, {
|
|
41
79
|
get when() {
|
|
42
80
|
return props.field.required || status() === "required";
|
|
43
81
|
},
|
|
44
82
|
get children() {
|
|
45
|
-
return web.getNextElement(_tmpl$);
|
|
83
|
+
return web.getNextElement(_tmpl$2);
|
|
46
84
|
}
|
|
47
|
-
}), _el$
|
|
85
|
+
}), _el$10, _co$3);
|
|
48
86
|
web.insert(_el$2, web.createComponent(solidJs.Show, {
|
|
49
87
|
get when() {
|
|
50
88
|
return isUnsupported();
|
|
51
89
|
},
|
|
52
90
|
get children() {
|
|
53
|
-
return web.getNextElement(_tmpl$
|
|
91
|
+
return web.getNextElement(_tmpl$3);
|
|
54
92
|
}
|
|
55
|
-
}), _el$
|
|
93
|
+
}), _el$12, _co$4);
|
|
56
94
|
web.insert(_el$2, web.createComponent(solidJs.Show, {
|
|
57
95
|
get when() {
|
|
58
96
|
return status() === "unknown";
|
|
59
97
|
},
|
|
60
98
|
get children() {
|
|
61
|
-
return web.getNextElement(_tmpl$
|
|
99
|
+
return web.getNextElement(_tmpl$4);
|
|
62
100
|
}
|
|
63
|
-
}), _el$
|
|
101
|
+
}), _el$14, _co$5);
|
|
64
102
|
web.effect((_p$) => {
|
|
65
|
-
var _v$ = fieldId(), _v$2 = `block text-sm font-medium ${isUnsupported() ? "text-gray-400 dark:text-gray-500" : "text-gray-700 dark:text-gray-300"}`;
|
|
103
|
+
var _v$ = fieldId(), _v$2 = `block text-sm font-medium ${isUnsupported() ? "text-gray-400 dark:text-gray-500" : isMuted() ? "text-gray-400 dark:text-gray-500" : "text-gray-700 dark:text-gray-300"}`;
|
|
66
104
|
_v$ !== _p$.e && web.setAttribute(_el$2, "for", _p$.e = _v$);
|
|
67
105
|
_v$2 !== _p$.t && web.className(_el$2, _p$.t = _v$2);
|
|
68
106
|
return _p$;
|
|
@@ -72,7 +110,7 @@ const FormFieldRenderer = (props) => {
|
|
|
72
110
|
});
|
|
73
111
|
return _el$2;
|
|
74
112
|
}
|
|
75
|
-
}), _el$
|
|
113
|
+
}), _el$54, _co$1);
|
|
76
114
|
web.insert(_el$, web.createComponent(solidJs.Switch, {
|
|
77
115
|
get children() {
|
|
78
116
|
return [web.createComponent(solidJs.Match, {
|
|
@@ -80,22 +118,22 @@ const FormFieldRenderer = (props) => {
|
|
|
80
118
|
return props.field.type === "text" || props.field.type === "email" || props.field.type === "password";
|
|
81
119
|
},
|
|
82
120
|
get children() {
|
|
83
|
-
var _el$
|
|
84
|
-
_el$
|
|
121
|
+
var _el$15 = web.getNextElement(_tmpl$6);
|
|
122
|
+
_el$15.$$input = (e) => props.onChange(e.currentTarget.value);
|
|
85
123
|
web.effect((_p$) => {
|
|
86
124
|
var _v$3 = fieldId(), _v$4 = props.field.type, _v$5 = props.field.name, _v$6 = props.field.placeholder, _v$7 = props.disabled, _v$8 = props.field.required, _v$9 = props.field.minLength, _v$0 = props.field.maxLength, _v$1 = props.field.pattern, _v$10 = !!props.error, _v$11 = props.error ? errorId() : void 0, _v$12 = baseInputClass();
|
|
87
|
-
_v$3 !== _p$.e && web.setAttribute(_el$
|
|
88
|
-
_v$4 !== _p$.t && web.setAttribute(_el$
|
|
89
|
-
_v$5 !== _p$.a && web.setAttribute(_el$
|
|
90
|
-
_v$6 !== _p$.o && web.setAttribute(_el$
|
|
91
|
-
_v$7 !== _p$.i && web.setProperty(_el$
|
|
92
|
-
_v$8 !== _p$.n && web.setProperty(_el$
|
|
93
|
-
_v$9 !== _p$.s && web.setAttribute(_el$
|
|
94
|
-
_v$0 !== _p$.h && web.setAttribute(_el$
|
|
95
|
-
_v$1 !== _p$.r && web.setAttribute(_el$
|
|
96
|
-
_v$10 !== _p$.d && web.setAttribute(_el$
|
|
97
|
-
_v$11 !== _p$.l && web.setAttribute(_el$
|
|
98
|
-
_v$12 !== _p$.u && web.className(_el$
|
|
125
|
+
_v$3 !== _p$.e && web.setAttribute(_el$15, "id", _p$.e = _v$3);
|
|
126
|
+
_v$4 !== _p$.t && web.setAttribute(_el$15, "type", _p$.t = _v$4);
|
|
127
|
+
_v$5 !== _p$.a && web.setAttribute(_el$15, "name", _p$.a = _v$5);
|
|
128
|
+
_v$6 !== _p$.o && web.setAttribute(_el$15, "placeholder", _p$.o = _v$6);
|
|
129
|
+
_v$7 !== _p$.i && web.setProperty(_el$15, "disabled", _p$.i = _v$7);
|
|
130
|
+
_v$8 !== _p$.n && web.setProperty(_el$15, "required", _p$.n = _v$8);
|
|
131
|
+
_v$9 !== _p$.s && web.setAttribute(_el$15, "minlength", _p$.s = _v$9);
|
|
132
|
+
_v$0 !== _p$.h && web.setAttribute(_el$15, "maxlength", _p$.h = _v$0);
|
|
133
|
+
_v$1 !== _p$.r && web.setAttribute(_el$15, "pattern", _p$.r = _v$1);
|
|
134
|
+
_v$10 !== _p$.d && web.setAttribute(_el$15, "aria-invalid", _p$.d = _v$10);
|
|
135
|
+
_v$11 !== _p$.l && web.setAttribute(_el$15, "aria-describedby", _p$.l = _v$11);
|
|
136
|
+
_v$12 !== _p$.u && web.className(_el$15, _p$.u = _v$12);
|
|
99
137
|
return _p$;
|
|
100
138
|
}, {
|
|
101
139
|
e: void 0,
|
|
@@ -111,30 +149,30 @@ const FormFieldRenderer = (props) => {
|
|
|
111
149
|
l: void 0,
|
|
112
150
|
u: void 0
|
|
113
151
|
});
|
|
114
|
-
web.effect(() => web.setProperty(_el$
|
|
152
|
+
web.effect(() => web.setProperty(_el$15, "value", props.value || ""));
|
|
115
153
|
web.runHydrationEvents();
|
|
116
|
-
return _el$
|
|
154
|
+
return _el$15;
|
|
117
155
|
}
|
|
118
156
|
}), web.createComponent(solidJs.Match, {
|
|
119
157
|
get when() {
|
|
120
158
|
return props.field.type === "number";
|
|
121
159
|
},
|
|
122
160
|
get children() {
|
|
123
|
-
var _el$
|
|
124
|
-
_el$
|
|
161
|
+
var _el$16 = web.getNextElement(_tmpl$7);
|
|
162
|
+
_el$16.$$input = (e) => props.onChange(e.currentTarget.value === "" ? void 0 : Number(e.currentTarget.value));
|
|
125
163
|
web.effect((_p$) => {
|
|
126
164
|
var _v$13 = fieldId(), _v$14 = props.field.name, _v$15 = props.field.placeholder, _v$16 = props.disabled, _v$17 = props.field.required, _v$18 = props.field.min, _v$19 = props.field.max, _v$20 = props.field.step, _v$21 = !!props.error, _v$22 = props.error ? errorId() : void 0, _v$23 = baseInputClass();
|
|
127
|
-
_v$13 !== _p$.e && web.setAttribute(_el$
|
|
128
|
-
_v$14 !== _p$.t && web.setAttribute(_el$
|
|
129
|
-
_v$15 !== _p$.a && web.setAttribute(_el$
|
|
130
|
-
_v$16 !== _p$.o && web.setProperty(_el$
|
|
131
|
-
_v$17 !== _p$.i && web.setProperty(_el$
|
|
132
|
-
_v$18 !== _p$.n && web.setAttribute(_el$
|
|
133
|
-
_v$19 !== _p$.s && web.setAttribute(_el$
|
|
134
|
-
_v$20 !== _p$.h && web.setAttribute(_el$
|
|
135
|
-
_v$21 !== _p$.r && web.setAttribute(_el$
|
|
136
|
-
_v$22 !== _p$.d && web.setAttribute(_el$
|
|
137
|
-
_v$23 !== _p$.l && web.className(_el$
|
|
165
|
+
_v$13 !== _p$.e && web.setAttribute(_el$16, "id", _p$.e = _v$13);
|
|
166
|
+
_v$14 !== _p$.t && web.setAttribute(_el$16, "name", _p$.t = _v$14);
|
|
167
|
+
_v$15 !== _p$.a && web.setAttribute(_el$16, "placeholder", _p$.a = _v$15);
|
|
168
|
+
_v$16 !== _p$.o && web.setProperty(_el$16, "disabled", _p$.o = _v$16);
|
|
169
|
+
_v$17 !== _p$.i && web.setProperty(_el$16, "required", _p$.i = _v$17);
|
|
170
|
+
_v$18 !== _p$.n && web.setAttribute(_el$16, "min", _p$.n = _v$18);
|
|
171
|
+
_v$19 !== _p$.s && web.setAttribute(_el$16, "max", _p$.s = _v$19);
|
|
172
|
+
_v$20 !== _p$.h && web.setAttribute(_el$16, "step", _p$.h = _v$20);
|
|
173
|
+
_v$21 !== _p$.r && web.setAttribute(_el$16, "aria-invalid", _p$.r = _v$21);
|
|
174
|
+
_v$22 !== _p$.d && web.setAttribute(_el$16, "aria-describedby", _p$.d = _v$22);
|
|
175
|
+
_v$23 !== _p$.l && web.className(_el$16, _p$.l = _v$23);
|
|
138
176
|
return _p$;
|
|
139
177
|
}, {
|
|
140
178
|
e: void 0,
|
|
@@ -149,28 +187,28 @@ const FormFieldRenderer = (props) => {
|
|
|
149
187
|
d: void 0,
|
|
150
188
|
l: void 0
|
|
151
189
|
});
|
|
152
|
-
web.effect(() => web.setProperty(_el$
|
|
190
|
+
web.effect(() => web.setProperty(_el$16, "value", props.value ?? ""));
|
|
153
191
|
web.runHydrationEvents();
|
|
154
|
-
return _el$
|
|
192
|
+
return _el$16;
|
|
155
193
|
}
|
|
156
194
|
}), web.createComponent(solidJs.Match, {
|
|
157
195
|
get when() {
|
|
158
196
|
return props.field.type === "date";
|
|
159
197
|
},
|
|
160
198
|
get children() {
|
|
161
|
-
var _el$
|
|
162
|
-
_el$
|
|
199
|
+
var _el$17 = web.getNextElement(_tmpl$8);
|
|
200
|
+
_el$17.$$input = (e) => props.onChange(e.currentTarget.value);
|
|
163
201
|
web.effect((_p$) => {
|
|
164
202
|
var _v$24 = fieldId(), _v$25 = props.field.name, _v$26 = props.disabled, _v$27 = props.field.required, _v$28 = props.field.minDate, _v$29 = props.field.maxDate, _v$30 = !!props.error, _v$31 = props.error ? errorId() : void 0, _v$32 = baseInputClass();
|
|
165
|
-
_v$24 !== _p$.e && web.setAttribute(_el$
|
|
166
|
-
_v$25 !== _p$.t && web.setAttribute(_el$
|
|
167
|
-
_v$26 !== _p$.a && web.setProperty(_el$
|
|
168
|
-
_v$27 !== _p$.o && web.setProperty(_el$
|
|
169
|
-
_v$28 !== _p$.i && web.setAttribute(_el$
|
|
170
|
-
_v$29 !== _p$.n && web.setAttribute(_el$
|
|
171
|
-
_v$30 !== _p$.s && web.setAttribute(_el$
|
|
172
|
-
_v$31 !== _p$.h && web.setAttribute(_el$
|
|
173
|
-
_v$32 !== _p$.r && web.className(_el$
|
|
203
|
+
_v$24 !== _p$.e && web.setAttribute(_el$17, "id", _p$.e = _v$24);
|
|
204
|
+
_v$25 !== _p$.t && web.setAttribute(_el$17, "name", _p$.t = _v$25);
|
|
205
|
+
_v$26 !== _p$.a && web.setProperty(_el$17, "disabled", _p$.a = _v$26);
|
|
206
|
+
_v$27 !== _p$.o && web.setProperty(_el$17, "required", _p$.o = _v$27);
|
|
207
|
+
_v$28 !== _p$.i && web.setAttribute(_el$17, "min", _p$.i = _v$28);
|
|
208
|
+
_v$29 !== _p$.n && web.setAttribute(_el$17, "max", _p$.n = _v$29);
|
|
209
|
+
_v$30 !== _p$.s && web.setAttribute(_el$17, "aria-invalid", _p$.s = _v$30);
|
|
210
|
+
_v$31 !== _p$.h && web.setAttribute(_el$17, "aria-describedby", _p$.h = _v$31);
|
|
211
|
+
_v$32 !== _p$.r && web.className(_el$17, _p$.r = _v$32);
|
|
174
212
|
return _p$;
|
|
175
213
|
}, {
|
|
176
214
|
e: void 0,
|
|
@@ -183,30 +221,30 @@ const FormFieldRenderer = (props) => {
|
|
|
183
221
|
h: void 0,
|
|
184
222
|
r: void 0
|
|
185
223
|
});
|
|
186
|
-
web.effect(() => web.setProperty(_el$
|
|
224
|
+
web.effect(() => web.setProperty(_el$17, "value", props.value || ""));
|
|
187
225
|
web.runHydrationEvents();
|
|
188
|
-
return _el$
|
|
226
|
+
return _el$17;
|
|
189
227
|
}
|
|
190
228
|
}), web.createComponent(solidJs.Match, {
|
|
191
229
|
get when() {
|
|
192
230
|
return props.field.type === "textarea";
|
|
193
231
|
},
|
|
194
232
|
get children() {
|
|
195
|
-
var _el$
|
|
196
|
-
_el$
|
|
233
|
+
var _el$18 = web.getNextElement(_tmpl$9);
|
|
234
|
+
_el$18.$$input = (e) => props.onChange(e.currentTarget.value);
|
|
197
235
|
web.effect((_p$) => {
|
|
198
236
|
var _v$33 = fieldId(), _v$34 = props.field.name, _v$35 = props.field.placeholder, _v$36 = props.disabled, _v$37 = props.field.required, _v$38 = props.field.rows || 4, _v$39 = props.field.minLength, _v$40 = props.field.maxLength, _v$41 = !!props.error, _v$42 = props.error ? errorId() : void 0, _v$43 = baseInputClass();
|
|
199
|
-
_v$33 !== _p$.e && web.setAttribute(_el$
|
|
200
|
-
_v$34 !== _p$.t && web.setAttribute(_el$
|
|
201
|
-
_v$35 !== _p$.a && web.setAttribute(_el$
|
|
202
|
-
_v$36 !== _p$.o && web.setProperty(_el$
|
|
203
|
-
_v$37 !== _p$.i && web.setProperty(_el$
|
|
204
|
-
_v$38 !== _p$.n && web.setAttribute(_el$
|
|
205
|
-
_v$39 !== _p$.s && web.setAttribute(_el$
|
|
206
|
-
_v$40 !== _p$.h && web.setAttribute(_el$
|
|
207
|
-
_v$41 !== _p$.r && web.setAttribute(_el$
|
|
208
|
-
_v$42 !== _p$.d && web.setAttribute(_el$
|
|
209
|
-
_v$43 !== _p$.l && web.className(_el$
|
|
237
|
+
_v$33 !== _p$.e && web.setAttribute(_el$18, "id", _p$.e = _v$33);
|
|
238
|
+
_v$34 !== _p$.t && web.setAttribute(_el$18, "name", _p$.t = _v$34);
|
|
239
|
+
_v$35 !== _p$.a && web.setAttribute(_el$18, "placeholder", _p$.a = _v$35);
|
|
240
|
+
_v$36 !== _p$.o && web.setProperty(_el$18, "disabled", _p$.o = _v$36);
|
|
241
|
+
_v$37 !== _p$.i && web.setProperty(_el$18, "required", _p$.i = _v$37);
|
|
242
|
+
_v$38 !== _p$.n && web.setAttribute(_el$18, "rows", _p$.n = _v$38);
|
|
243
|
+
_v$39 !== _p$.s && web.setAttribute(_el$18, "minlength", _p$.s = _v$39);
|
|
244
|
+
_v$40 !== _p$.h && web.setAttribute(_el$18, "maxlength", _p$.h = _v$40);
|
|
245
|
+
_v$41 !== _p$.r && web.setAttribute(_el$18, "aria-invalid", _p$.r = _v$41);
|
|
246
|
+
_v$42 !== _p$.d && web.setAttribute(_el$18, "aria-describedby", _p$.d = _v$42);
|
|
247
|
+
_v$43 !== _p$.l && web.className(_el$18, _p$.l = _v$43);
|
|
210
248
|
return _p$;
|
|
211
249
|
}, {
|
|
212
250
|
e: void 0,
|
|
@@ -221,48 +259,48 @@ const FormFieldRenderer = (props) => {
|
|
|
221
259
|
d: void 0,
|
|
222
260
|
l: void 0
|
|
223
261
|
});
|
|
224
|
-
web.effect(() => web.setProperty(_el$
|
|
262
|
+
web.effect(() => web.setProperty(_el$18, "value", props.value || ""));
|
|
225
263
|
web.runHydrationEvents();
|
|
226
|
-
return _el$
|
|
264
|
+
return _el$18;
|
|
227
265
|
}
|
|
228
266
|
}), web.createComponent(solidJs.Match, {
|
|
229
267
|
get when() {
|
|
230
268
|
return web.memo(() => props.field.type === "select")() && !props.field.multiple;
|
|
231
269
|
},
|
|
232
270
|
get children() {
|
|
233
|
-
var _el$
|
|
234
|
-
_el$
|
|
235
|
-
web.insert(_el$
|
|
271
|
+
var _el$19 = web.getNextElement(_tmpl$1), _el$21 = _el$19.firstChild, [_el$22, _co$6] = web.getNextMarker(_el$21.nextSibling), _el$23 = _el$22.nextSibling, [_el$24, _co$7] = web.getNextMarker(_el$23.nextSibling);
|
|
272
|
+
_el$19.addEventListener("change", (e) => props.onChange(e.currentTarget.value));
|
|
273
|
+
web.insert(_el$19, web.createComponent(solidJs.Show, {
|
|
236
274
|
get when() {
|
|
237
275
|
return props.field.placeholder;
|
|
238
276
|
},
|
|
239
277
|
get children() {
|
|
240
|
-
var _el$
|
|
241
|
-
web.insert(_el$
|
|
242
|
-
return _el$
|
|
278
|
+
var _el$20 = web.getNextElement(_tmpl$0);
|
|
279
|
+
web.insert(_el$20, () => props.field.placeholder);
|
|
280
|
+
return _el$20;
|
|
243
281
|
}
|
|
244
|
-
}), _el$
|
|
245
|
-
web.insert(_el$
|
|
282
|
+
}), _el$22, _co$6);
|
|
283
|
+
web.insert(_el$19, web.createComponent(solidJs.For, {
|
|
246
284
|
get each() {
|
|
247
285
|
return props.field.options;
|
|
248
286
|
},
|
|
249
287
|
children: (option) => (() => {
|
|
250
|
-
var _el$
|
|
251
|
-
web.insert(_el$
|
|
252
|
-
web.effect(() => web.setProperty(_el$
|
|
253
|
-
web.effect(() => web.setProperty(_el$
|
|
254
|
-
return _el$
|
|
288
|
+
var _el$65 = web.getNextElement(_tmpl$21);
|
|
289
|
+
web.insert(_el$65, () => option.label);
|
|
290
|
+
web.effect(() => web.setProperty(_el$65, "disabled", option.disabled));
|
|
291
|
+
web.effect(() => web.setProperty(_el$65, "value", option.value));
|
|
292
|
+
return _el$65;
|
|
255
293
|
})()
|
|
256
|
-
}), _el$
|
|
294
|
+
}), _el$24, _co$7);
|
|
257
295
|
web.effect((_p$) => {
|
|
258
296
|
var _v$44 = fieldId(), _v$45 = props.field.name, _v$46 = props.disabled, _v$47 = props.field.required, _v$48 = !!props.error, _v$49 = props.error ? errorId() : void 0, _v$50 = baseInputClass();
|
|
259
|
-
_v$44 !== _p$.e && web.setAttribute(_el$
|
|
260
|
-
_v$45 !== _p$.t && web.setAttribute(_el$
|
|
261
|
-
_v$46 !== _p$.a && web.setProperty(_el$
|
|
262
|
-
_v$47 !== _p$.o && web.setProperty(_el$
|
|
263
|
-
_v$48 !== _p$.i && web.setAttribute(_el$
|
|
264
|
-
_v$49 !== _p$.n && web.setAttribute(_el$
|
|
265
|
-
_v$50 !== _p$.s && web.className(_el$
|
|
297
|
+
_v$44 !== _p$.e && web.setAttribute(_el$19, "id", _p$.e = _v$44);
|
|
298
|
+
_v$45 !== _p$.t && web.setAttribute(_el$19, "name", _p$.t = _v$45);
|
|
299
|
+
_v$46 !== _p$.a && web.setProperty(_el$19, "disabled", _p$.a = _v$46);
|
|
300
|
+
_v$47 !== _p$.o && web.setProperty(_el$19, "required", _p$.o = _v$47);
|
|
301
|
+
_v$48 !== _p$.i && web.setAttribute(_el$19, "aria-invalid", _p$.i = _v$48);
|
|
302
|
+
_v$49 !== _p$.n && web.setAttribute(_el$19, "aria-describedby", _p$.n = _v$49);
|
|
303
|
+
_v$50 !== _p$.s && web.className(_el$19, _p$.s = _v$50);
|
|
266
304
|
return _p$;
|
|
267
305
|
}, {
|
|
268
306
|
e: void 0,
|
|
@@ -273,32 +311,32 @@ const FormFieldRenderer = (props) => {
|
|
|
273
311
|
n: void 0,
|
|
274
312
|
s: void 0
|
|
275
313
|
});
|
|
276
|
-
web.effect(() => web.setProperty(_el$
|
|
277
|
-
return _el$
|
|
314
|
+
web.effect(() => web.setProperty(_el$19, "value", props.value || ""));
|
|
315
|
+
return _el$19;
|
|
278
316
|
}
|
|
279
317
|
}), web.createComponent(solidJs.Match, {
|
|
280
318
|
get when() {
|
|
281
319
|
return props.field.type === "checkbox";
|
|
282
320
|
},
|
|
283
321
|
get children() {
|
|
284
|
-
var _el$
|
|
285
|
-
_el$
|
|
286
|
-
web.insert(_el$
|
|
287
|
-
web.insert(_el$
|
|
322
|
+
var _el$25 = web.getNextElement(_tmpl$10), _el$26 = _el$25.firstChild, _el$27 = _el$26.nextSibling, _el$29 = _el$27.firstChild, [_el$30, _co$8] = web.getNextMarker(_el$29.nextSibling), _el$31 = _el$30.nextSibling, [_el$32, _co$9] = web.getNextMarker(_el$31.nextSibling);
|
|
323
|
+
_el$26.addEventListener("change", (e) => props.onChange(e.currentTarget.checked));
|
|
324
|
+
web.insert(_el$27, () => props.field.checkboxLabel || props.field.label, _el$30, _co$8);
|
|
325
|
+
web.insert(_el$27, web.createComponent(solidJs.Show, {
|
|
288
326
|
get when() {
|
|
289
327
|
return props.field.required;
|
|
290
328
|
},
|
|
291
329
|
get children() {
|
|
292
|
-
return web.getNextElement(_tmpl$);
|
|
330
|
+
return web.getNextElement(_tmpl$2);
|
|
293
331
|
}
|
|
294
|
-
}), _el$
|
|
332
|
+
}), _el$32, _co$9);
|
|
295
333
|
web.effect((_p$) => {
|
|
296
334
|
var _v$51 = fieldId(), _v$52 = props.field.name, _v$53 = props.disabled, _v$54 = !!props.error, _v$55 = props.error ? errorId() : void 0;
|
|
297
|
-
_v$51 !== _p$.e && web.setAttribute(_el$
|
|
298
|
-
_v$52 !== _p$.t && web.setAttribute(_el$
|
|
299
|
-
_v$53 !== _p$.a && web.setProperty(_el$
|
|
300
|
-
_v$54 !== _p$.o && web.setAttribute(_el$
|
|
301
|
-
_v$55 !== _p$.i && web.setAttribute(_el$
|
|
335
|
+
_v$51 !== _p$.e && web.setAttribute(_el$26, "id", _p$.e = _v$51);
|
|
336
|
+
_v$52 !== _p$.t && web.setAttribute(_el$26, "name", _p$.t = _v$52);
|
|
337
|
+
_v$53 !== _p$.a && web.setProperty(_el$26, "disabled", _p$.a = _v$53);
|
|
338
|
+
_v$54 !== _p$.o && web.setAttribute(_el$26, "aria-invalid", _p$.o = _v$54);
|
|
339
|
+
_v$55 !== _p$.i && web.setAttribute(_el$26, "aria-describedby", _p$.i = _v$55);
|
|
302
340
|
return _p$;
|
|
303
341
|
}, {
|
|
304
342
|
e: void 0,
|
|
@@ -307,8 +345,8 @@ const FormFieldRenderer = (props) => {
|
|
|
307
345
|
o: void 0,
|
|
308
346
|
i: void 0
|
|
309
347
|
});
|
|
310
|
-
web.effect(() => web.setProperty(_el$
|
|
311
|
-
return _el$
|
|
348
|
+
web.effect(() => web.setProperty(_el$26, "checked", props.value || false));
|
|
349
|
+
return _el$25;
|
|
312
350
|
}
|
|
313
351
|
}), web.createComponent(solidJs.Match, {
|
|
314
352
|
get when() {
|
|
@@ -361,60 +399,60 @@ const FormFieldRenderer = (props) => {
|
|
|
361
399
|
return props.field.type === "radio";
|
|
362
400
|
},
|
|
363
401
|
get children() {
|
|
364
|
-
var _el$
|
|
365
|
-
web.insert(_el$
|
|
402
|
+
var _el$33 = web.getNextElement(_tmpl$11);
|
|
403
|
+
web.insert(_el$33, web.createComponent(solidJs.For, {
|
|
366
404
|
get each() {
|
|
367
405
|
return props.field.options;
|
|
368
406
|
},
|
|
369
407
|
children: (option, index) => (() => {
|
|
370
|
-
var _el$
|
|
371
|
-
_el$
|
|
372
|
-
web.insert(_el$
|
|
408
|
+
var _el$66 = web.getNextElement(_tmpl$22), _el$67 = _el$66.firstChild, _el$68 = _el$67.nextSibling;
|
|
409
|
+
_el$67.addEventListener("change", () => props.onChange(option.value));
|
|
410
|
+
web.insert(_el$68, () => option.label);
|
|
373
411
|
web.effect((_p$) => {
|
|
374
412
|
var _v$74 = props.field.name, _v$75 = `${fieldId()}-${index()}`, _v$76 = props.disabled || option.disabled;
|
|
375
|
-
_v$74 !== _p$.e && web.setAttribute(_el$
|
|
376
|
-
_v$75 !== _p$.t && web.setAttribute(_el$
|
|
377
|
-
_v$76 !== _p$.a && web.setProperty(_el$
|
|
413
|
+
_v$74 !== _p$.e && web.setAttribute(_el$67, "name", _p$.e = _v$74);
|
|
414
|
+
_v$75 !== _p$.t && web.setAttribute(_el$67, "id", _p$.t = _v$75);
|
|
415
|
+
_v$76 !== _p$.a && web.setProperty(_el$67, "disabled", _p$.a = _v$76);
|
|
378
416
|
return _p$;
|
|
379
417
|
}, {
|
|
380
418
|
e: void 0,
|
|
381
419
|
t: void 0,
|
|
382
420
|
a: void 0
|
|
383
421
|
});
|
|
384
|
-
web.effect(() => web.setProperty(_el$
|
|
385
|
-
web.effect(() => web.setProperty(_el$
|
|
386
|
-
return _el$
|
|
422
|
+
web.effect(() => web.setProperty(_el$67, "value", option.value));
|
|
423
|
+
web.effect(() => web.setProperty(_el$67, "checked", props.value === option.value));
|
|
424
|
+
return _el$66;
|
|
387
425
|
})()
|
|
388
426
|
}));
|
|
389
427
|
web.effect((_p$) => {
|
|
390
428
|
var _v$56 = props.field.label ? `${fieldId()}-label` : void 0, _v$57 = !!props.error, _v$58 = props.error ? errorId() : void 0;
|
|
391
|
-
_v$56 !== _p$.e && web.setAttribute(_el$
|
|
392
|
-
_v$57 !== _p$.t && web.setAttribute(_el$
|
|
393
|
-
_v$58 !== _p$.a && web.setAttribute(_el$
|
|
429
|
+
_v$56 !== _p$.e && web.setAttribute(_el$33, "aria-labelledby", _p$.e = _v$56);
|
|
430
|
+
_v$57 !== _p$.t && web.setAttribute(_el$33, "aria-invalid", _p$.t = _v$57);
|
|
431
|
+
_v$58 !== _p$.a && web.setAttribute(_el$33, "aria-describedby", _p$.a = _v$58);
|
|
394
432
|
return _p$;
|
|
395
433
|
}, {
|
|
396
434
|
e: void 0,
|
|
397
435
|
t: void 0,
|
|
398
436
|
a: void 0
|
|
399
437
|
});
|
|
400
|
-
return _el$
|
|
438
|
+
return _el$33;
|
|
401
439
|
}
|
|
402
440
|
}), web.createComponent(solidJs.Match, {
|
|
403
441
|
get when() {
|
|
404
442
|
return props.field.type === "range";
|
|
405
443
|
},
|
|
406
444
|
get children() {
|
|
407
|
-
var _el$
|
|
408
|
-
_el$
|
|
409
|
-
web.insert(_el$
|
|
445
|
+
var _el$34 = web.getNextElement(_tmpl$12), _el$35 = _el$34.firstChild, _el$36 = _el$35.nextSibling;
|
|
446
|
+
_el$35.$$input = (e) => props.onChange(Number(e.currentTarget.value));
|
|
447
|
+
web.insert(_el$36, () => props.value ?? props.field.min ?? 0);
|
|
410
448
|
web.effect((_p$) => {
|
|
411
449
|
var _v$59 = fieldId(), _v$60 = props.field.name, _v$61 = props.field.min, _v$62 = props.field.max, _v$63 = props.field.step || 1, _v$64 = isFieldDisabled();
|
|
412
|
-
_v$59 !== _p$.e && web.setAttribute(_el$
|
|
413
|
-
_v$60 !== _p$.t && web.setAttribute(_el$
|
|
414
|
-
_v$61 !== _p$.a && web.setAttribute(_el$
|
|
415
|
-
_v$62 !== _p$.o && web.setAttribute(_el$
|
|
416
|
-
_v$63 !== _p$.i && web.setAttribute(_el$
|
|
417
|
-
_v$64 !== _p$.n && web.setProperty(_el$
|
|
450
|
+
_v$59 !== _p$.e && web.setAttribute(_el$35, "id", _p$.e = _v$59);
|
|
451
|
+
_v$60 !== _p$.t && web.setAttribute(_el$35, "name", _p$.t = _v$60);
|
|
452
|
+
_v$61 !== _p$.a && web.setAttribute(_el$35, "min", _p$.a = _v$61);
|
|
453
|
+
_v$62 !== _p$.o && web.setAttribute(_el$35, "max", _p$.o = _v$62);
|
|
454
|
+
_v$63 !== _p$.i && web.setAttribute(_el$35, "step", _p$.i = _v$63);
|
|
455
|
+
_v$64 !== _p$.n && web.setProperty(_el$35, "disabled", _p$.n = _v$64);
|
|
418
456
|
return _p$;
|
|
419
457
|
}, {
|
|
420
458
|
e: void 0,
|
|
@@ -424,9 +462,9 @@ const FormFieldRenderer = (props) => {
|
|
|
424
462
|
i: void 0,
|
|
425
463
|
n: void 0
|
|
426
464
|
});
|
|
427
|
-
web.effect(() => web.setProperty(_el$
|
|
465
|
+
web.effect(() => web.setProperty(_el$35, "value", props.value ?? props.field.min ?? 0));
|
|
428
466
|
web.runHydrationEvents();
|
|
429
|
-
return _el$
|
|
467
|
+
return _el$34;
|
|
430
468
|
}
|
|
431
469
|
}), web.createComponent(solidJs.Match, {
|
|
432
470
|
get when() {
|
|
@@ -456,15 +494,15 @@ const FormFieldRenderer = (props) => {
|
|
|
456
494
|
return props.field.type === "toggle";
|
|
457
495
|
},
|
|
458
496
|
get children() {
|
|
459
|
-
var _el$
|
|
460
|
-
_el$
|
|
461
|
-
web.insert(_el$
|
|
497
|
+
var _el$37 = web.getNextElement(_tmpl$13), _el$38 = _el$37.firstChild, _el$39 = _el$38.firstChild, _el$40 = _el$38.nextSibling;
|
|
498
|
+
_el$38.$$click = () => props.onChange(!props.value);
|
|
499
|
+
web.insert(_el$40, () => props.field.checkboxLabel || props.field.label);
|
|
462
500
|
web.effect((_p$) => {
|
|
463
501
|
var _v$65 = !!props.value, _v$66 = isFieldDisabled(), _v$67 = `relative inline-flex h-5 w-9 items-center rounded-full transition-colors ${props.value ? "bg-blue-600" : "bg-gray-300 dark:bg-gray-600"} ${isFieldDisabled() ? "opacity-50 cursor-not-allowed" : ""}`, _v$68 = `inline-block h-3.5 w-3.5 transform rounded-full bg-white transition-transform ${props.value ? "translate-x-4" : "translate-x-0.5"}`;
|
|
464
|
-
_v$65 !== _p$.e && web.setAttribute(_el$
|
|
465
|
-
_v$66 !== _p$.t && web.setProperty(_el$
|
|
466
|
-
_v$67 !== _p$.a && web.className(_el$
|
|
467
|
-
_v$68 !== _p$.o && web.className(_el$
|
|
502
|
+
_v$65 !== _p$.e && web.setAttribute(_el$38, "aria-checked", _p$.e = _v$65);
|
|
503
|
+
_v$66 !== _p$.t && web.setProperty(_el$38, "disabled", _p$.t = _v$66);
|
|
504
|
+
_v$67 !== _p$.a && web.className(_el$38, _p$.a = _v$67);
|
|
505
|
+
_v$68 !== _p$.o && web.className(_el$39, _p$.o = _v$68);
|
|
468
506
|
return _p$;
|
|
469
507
|
}, {
|
|
470
508
|
e: void 0,
|
|
@@ -473,31 +511,31 @@ const FormFieldRenderer = (props) => {
|
|
|
473
511
|
o: void 0
|
|
474
512
|
});
|
|
475
513
|
web.runHydrationEvents();
|
|
476
|
-
return _el$
|
|
514
|
+
return _el$37;
|
|
477
515
|
}
|
|
478
516
|
}), web.createComponent(solidJs.Match, {
|
|
479
517
|
get when() {
|
|
480
518
|
return props.field.type === "fieldset";
|
|
481
519
|
},
|
|
482
520
|
get children() {
|
|
483
|
-
var _el$
|
|
484
|
-
web.insert(_el$
|
|
485
|
-
web.insert(_el$
|
|
486
|
-
return _el$
|
|
521
|
+
var _el$41 = web.getNextElement(_tmpl$14), _el$42 = _el$41.firstChild, _el$43 = _el$42.nextSibling;
|
|
522
|
+
web.insert(_el$42, () => props.field.label);
|
|
523
|
+
web.insert(_el$43, () => props.field.helpText || "Group container");
|
|
524
|
+
return _el$41;
|
|
487
525
|
}
|
|
488
526
|
}), web.createComponent(solidJs.Match, {
|
|
489
527
|
when: true,
|
|
490
528
|
get children() {
|
|
491
529
|
return [(() => {
|
|
492
|
-
var _el$
|
|
493
|
-
_el$
|
|
530
|
+
var _el$44 = web.getNextElement(_tmpl$15);
|
|
531
|
+
_el$44.$$input = (e) => props.onChange(e.currentTarget.value);
|
|
494
532
|
web.effect((_p$) => {
|
|
495
533
|
var _v$69 = fieldId(), _v$70 = props.field.name, _v$71 = props.field.placeholder || `(${props.field.type})`, _v$72 = props.disabled, _v$73 = baseInputClass();
|
|
496
|
-
_v$69 !== _p$.e && web.setAttribute(_el$
|
|
497
|
-
_v$70 !== _p$.t && web.setAttribute(_el$
|
|
498
|
-
_v$71 !== _p$.a && web.setAttribute(_el$
|
|
499
|
-
_v$72 !== _p$.o && web.setProperty(_el$
|
|
500
|
-
_v$73 !== _p$.i && web.className(_el$
|
|
534
|
+
_v$69 !== _p$.e && web.setAttribute(_el$44, "id", _p$.e = _v$69);
|
|
535
|
+
_v$70 !== _p$.t && web.setAttribute(_el$44, "name", _p$.t = _v$70);
|
|
536
|
+
_v$71 !== _p$.a && web.setAttribute(_el$44, "placeholder", _p$.a = _v$71);
|
|
537
|
+
_v$72 !== _p$.o && web.setProperty(_el$44, "disabled", _p$.o = _v$72);
|
|
538
|
+
_v$73 !== _p$.i && web.className(_el$44, _p$.i = _v$73);
|
|
501
539
|
return _p$;
|
|
502
540
|
}, {
|
|
503
541
|
e: void 0,
|
|
@@ -506,50 +544,62 @@ const FormFieldRenderer = (props) => {
|
|
|
506
544
|
o: void 0,
|
|
507
545
|
i: void 0
|
|
508
546
|
});
|
|
509
|
-
web.effect(() => web.setProperty(_el$
|
|
547
|
+
web.effect(() => web.setProperty(_el$44, "value", props.value || ""));
|
|
510
548
|
web.runHydrationEvents();
|
|
511
|
-
return _el$
|
|
549
|
+
return _el$44;
|
|
512
550
|
})(), (() => {
|
|
513
|
-
var _el$
|
|
514
|
-
web.insert(_el$
|
|
515
|
-
return _el$
|
|
551
|
+
var _el$45 = web.getNextElement(_tmpl$16), _el$46 = _el$45.firstChild, _el$47 = _el$46.nextSibling, [_el$48, _co$0] = web.getNextMarker(_el$47.nextSibling);
|
|
552
|
+
web.insert(_el$45, () => props.field.type, _el$48, _co$0);
|
|
553
|
+
return _el$45;
|
|
516
554
|
})()];
|
|
517
555
|
}
|
|
518
556
|
})];
|
|
519
557
|
}
|
|
520
|
-
}), _el$
|
|
558
|
+
}), _el$56, _co$10);
|
|
521
559
|
web.insert(_el$, web.createComponent(solidJs.Show, {
|
|
522
560
|
get when() {
|
|
523
561
|
return props.field.statusReason;
|
|
524
562
|
},
|
|
525
563
|
get children() {
|
|
526
|
-
var _el$
|
|
527
|
-
web.insert(_el$
|
|
528
|
-
web.effect(() => web.className(_el$
|
|
529
|
-
return _el$
|
|
564
|
+
var _el$49 = web.getNextElement(_tmpl$17);
|
|
565
|
+
web.insert(_el$49, () => props.field.statusReason);
|
|
566
|
+
web.effect(() => web.className(_el$49, `text-xs ${isUnsupported() ? "text-orange-500 dark:text-orange-400" : status() === "unknown" ? "text-yellow-500 dark:text-yellow-400" : status() === "required" ? "text-blue-500 dark:text-blue-400" : "text-gray-500 dark:text-gray-400"}`));
|
|
567
|
+
return _el$49;
|
|
530
568
|
}
|
|
531
|
-
}), _el$
|
|
569
|
+
}), _el$58, _co$11);
|
|
532
570
|
web.insert(_el$, web.createComponent(solidJs.Show, {
|
|
533
571
|
get when() {
|
|
534
|
-
return web.memo(() => !!
|
|
572
|
+
return web.memo(() => !!props.field.displayHint)() && props.field.prefill != null;
|
|
535
573
|
},
|
|
536
574
|
get children() {
|
|
537
|
-
var _el$
|
|
538
|
-
web.insert(_el$
|
|
539
|
-
|
|
575
|
+
var _el$50 = web.getNextElement(_tmpl$17);
|
|
576
|
+
web.insert(_el$50, () => props.field.displayHint);
|
|
577
|
+
web.effect(() => web.className(_el$50, `text-xs italic ${isMuted() ? "text-gray-400 dark:text-gray-500" : "text-gray-500 dark:text-gray-400"}`));
|
|
578
|
+
return _el$50;
|
|
540
579
|
}
|
|
541
|
-
}), _el$
|
|
580
|
+
}), _el$60, _co$12);
|
|
581
|
+
web.insert(_el$, web.createComponent(solidJs.Show, {
|
|
582
|
+
get when() {
|
|
583
|
+
return web.memo(() => !!(props.field.helpText && !props.error && !props.field.statusReason))() && !props.field.displayHint;
|
|
584
|
+
},
|
|
585
|
+
get children() {
|
|
586
|
+
var _el$51 = web.getNextElement(_tmpl$18);
|
|
587
|
+
web.insert(_el$51, () => props.field.helpText);
|
|
588
|
+
return _el$51;
|
|
589
|
+
}
|
|
590
|
+
}), _el$62, _co$13);
|
|
542
591
|
web.insert(_el$, web.createComponent(solidJs.Show, {
|
|
543
592
|
get when() {
|
|
544
593
|
return props.error;
|
|
545
594
|
},
|
|
546
595
|
get children() {
|
|
547
|
-
var _el$
|
|
548
|
-
web.insert(_el$
|
|
549
|
-
web.effect(() => web.setAttribute(_el$
|
|
550
|
-
return _el$
|
|
596
|
+
var _el$52 = web.getNextElement(_tmpl$19);
|
|
597
|
+
web.insert(_el$52, () => props.error);
|
|
598
|
+
web.effect(() => web.setAttribute(_el$52, "id", errorId()));
|
|
599
|
+
return _el$52;
|
|
551
600
|
}
|
|
552
|
-
}), _el$
|
|
601
|
+
}), _el$64, _co$14);
|
|
602
|
+
web.runHydrationEvents();
|
|
553
603
|
return _el$;
|
|
554
604
|
}
|
|
555
605
|
});
|
|
@@ -578,84 +628,84 @@ const MultiSelectField = (props) => {
|
|
|
578
628
|
return (props.field.options || []).filter((o) => o.label.toLowerCase().includes(q) || o.value.toLowerCase().includes(q));
|
|
579
629
|
};
|
|
580
630
|
return (() => {
|
|
581
|
-
var _el$
|
|
582
|
-
web.insert(_el$
|
|
631
|
+
var _el$69 = web.getNextElement(_tmpl$27), _el$84 = _el$69.firstChild, [_el$85, _co$18] = web.getNextMarker(_el$84.nextSibling), _el$71 = _el$85.nextSibling, _el$72 = _el$71.firstChild, _el$86 = _el$71.nextSibling, [_el$87, _co$19] = web.getNextMarker(_el$86.nextSibling);
|
|
632
|
+
web.insert(_el$69, web.createComponent(solidJs.Show, {
|
|
583
633
|
get when() {
|
|
584
634
|
return props.value.length > 0;
|
|
585
635
|
},
|
|
586
636
|
get children() {
|
|
587
|
-
var _el$
|
|
588
|
-
web.insert(_el$
|
|
637
|
+
var _el$70 = web.getNextElement(_tmpl$23);
|
|
638
|
+
web.insert(_el$70, web.createComponent(solidJs.For, {
|
|
589
639
|
get each() {
|
|
590
640
|
return props.value;
|
|
591
641
|
},
|
|
592
642
|
children: (val) => (() => {
|
|
593
|
-
var _el$
|
|
594
|
-
web.insert(_el$
|
|
595
|
-
_el$
|
|
596
|
-
web.effect(() => web.setAttribute(_el$
|
|
643
|
+
var _el$88 = web.getNextElement(_tmpl$28), _el$90 = _el$88.firstChild, [_el$91, _co$20] = web.getNextMarker(_el$90.nextSibling), _el$89 = _el$91.nextSibling;
|
|
644
|
+
web.insert(_el$88, () => getLabel(val), _el$91, _co$20);
|
|
645
|
+
_el$89.$$click = () => removeChip(val);
|
|
646
|
+
web.effect(() => web.setAttribute(_el$89, "aria-label", `Remove ${getLabel(val)}`));
|
|
597
647
|
web.runHydrationEvents();
|
|
598
|
-
return _el$
|
|
648
|
+
return _el$88;
|
|
599
649
|
})()
|
|
600
650
|
}));
|
|
601
|
-
return _el$
|
|
651
|
+
return _el$70;
|
|
602
652
|
}
|
|
603
|
-
}), _el$
|
|
604
|
-
_el$
|
|
653
|
+
}), _el$85, _co$18);
|
|
654
|
+
_el$71.$$click = () => {
|
|
605
655
|
setOpen(!open());
|
|
606
656
|
if (!open()) setFilter("");
|
|
607
657
|
};
|
|
608
|
-
web.insert(_el$
|
|
658
|
+
web.insert(_el$72, (() => {
|
|
609
659
|
var _c$ = web.memo(() => !!props.value.length);
|
|
610
660
|
return () => _c$() ? `${props.value.length} selected` : props.field.placeholder || "Select...";
|
|
611
661
|
})());
|
|
612
|
-
web.insert(_el$
|
|
662
|
+
web.insert(_el$69, web.createComponent(solidJs.Show, {
|
|
613
663
|
get when() {
|
|
614
664
|
return open();
|
|
615
665
|
},
|
|
616
666
|
get children() {
|
|
617
|
-
var _el$
|
|
618
|
-
web.insert(_el$
|
|
667
|
+
var _el$73 = web.getNextElement(_tmpl$26), _el$82 = _el$73.firstChild, [_el$83, _co$17] = web.getNextMarker(_el$82.nextSibling), _el$76 = _el$83.nextSibling, _el$78 = _el$76.firstChild, [_el$79, _co$15] = web.getNextMarker(_el$78.nextSibling), _el$80 = _el$79.nextSibling, [_el$81, _co$16] = web.getNextMarker(_el$80.nextSibling);
|
|
668
|
+
web.insert(_el$73, web.createComponent(solidJs.Show, {
|
|
619
669
|
get when() {
|
|
620
670
|
var _a;
|
|
621
671
|
return (((_a = props.field.options) == null ? void 0 : _a.length) || 0) > 10;
|
|
622
672
|
},
|
|
623
673
|
get children() {
|
|
624
|
-
var _el$
|
|
625
|
-
_el$
|
|
626
|
-
web.effect(() => web.setProperty(_el$
|
|
674
|
+
var _el$74 = web.getNextElement(_tmpl$24), _el$75 = _el$74.firstChild;
|
|
675
|
+
_el$75.$$input = (e) => setFilter(e.currentTarget.value);
|
|
676
|
+
web.effect(() => web.setProperty(_el$75, "value", filter()));
|
|
627
677
|
web.runHydrationEvents();
|
|
628
|
-
return _el$
|
|
678
|
+
return _el$74;
|
|
629
679
|
}
|
|
630
|
-
}), _el$
|
|
631
|
-
web.insert(_el$
|
|
680
|
+
}), _el$83, _co$17);
|
|
681
|
+
web.insert(_el$76, web.createComponent(solidJs.For, {
|
|
632
682
|
get each() {
|
|
633
683
|
return filteredOptions();
|
|
634
684
|
},
|
|
635
685
|
children: (option) => (() => {
|
|
636
|
-
var _el$
|
|
637
|
-
_el$
|
|
638
|
-
web.insert(_el$
|
|
639
|
-
web.effect(() => web.setProperty(_el$
|
|
640
|
-
return _el$
|
|
686
|
+
var _el$92 = web.getNextElement(_tmpl$29), _el$93 = _el$92.firstChild, _el$94 = _el$93.nextSibling;
|
|
687
|
+
_el$93.addEventListener("change", () => toggle(option.value));
|
|
688
|
+
web.insert(_el$94, () => option.label);
|
|
689
|
+
web.effect(() => web.setProperty(_el$93, "checked", (props.value || []).includes(option.value)));
|
|
690
|
+
return _el$92;
|
|
641
691
|
})()
|
|
642
|
-
}), _el$
|
|
643
|
-
web.insert(_el$
|
|
692
|
+
}), _el$79, _co$15);
|
|
693
|
+
web.insert(_el$76, web.createComponent(solidJs.Show, {
|
|
644
694
|
get when() {
|
|
645
695
|
return filteredOptions().length === 0;
|
|
646
696
|
},
|
|
647
697
|
get children() {
|
|
648
|
-
return web.getNextElement(_tmpl$
|
|
698
|
+
return web.getNextElement(_tmpl$25);
|
|
649
699
|
}
|
|
650
|
-
}), _el$
|
|
651
|
-
return _el$
|
|
700
|
+
}), _el$81, _co$16);
|
|
701
|
+
return _el$73;
|
|
652
702
|
}
|
|
653
|
-
}), _el$
|
|
703
|
+
}), _el$87, _co$19);
|
|
654
704
|
web.effect((_p$) => {
|
|
655
705
|
var _v$77 = props.disabled, _v$78 = `${props.baseClass} text-left flex items-center justify-between`, _v$79 = props.value.length ? "text-gray-900 dark:text-white" : "text-gray-400";
|
|
656
|
-
_v$77 !== _p$.e && web.setProperty(_el$
|
|
657
|
-
_v$78 !== _p$.t && web.className(_el$
|
|
658
|
-
_v$79 !== _p$.a && web.className(_el$
|
|
706
|
+
_v$77 !== _p$.e && web.setProperty(_el$71, "disabled", _p$.e = _v$77);
|
|
707
|
+
_v$78 !== _p$.t && web.className(_el$71, _p$.t = _v$78);
|
|
708
|
+
_v$79 !== _p$.a && web.className(_el$72, _p$.a = _v$79);
|
|
659
709
|
return _p$;
|
|
660
710
|
}, {
|
|
661
711
|
e: void 0,
|
|
@@ -663,7 +713,7 @@ const MultiSelectField = (props) => {
|
|
|
663
713
|
a: void 0
|
|
664
714
|
});
|
|
665
715
|
web.runHydrationEvents();
|
|
666
|
-
return _el$
|
|
716
|
+
return _el$69;
|
|
667
717
|
})();
|
|
668
718
|
};
|
|
669
719
|
const AutocompleteField = (props) => {
|
|
@@ -749,90 +799,90 @@ const AutocompleteField = (props) => {
|
|
|
749
799
|
if (debounceTimer) clearTimeout(debounceTimer);
|
|
750
800
|
});
|
|
751
801
|
return (() => {
|
|
752
|
-
var _el$
|
|
753
|
-
web.insert(_el$
|
|
802
|
+
var _el$95 = web.getNextElement(_tmpl$31), _el$99 = _el$95.firstChild, [_el$100, _co$21] = web.getNextMarker(_el$99.nextSibling), _el$97 = _el$100.nextSibling, _el$101 = _el$97.nextSibling, [_el$102, _co$22] = web.getNextMarker(_el$101.nextSibling);
|
|
803
|
+
web.insert(_el$95, web.createComponent(solidJs.Show, {
|
|
754
804
|
get when() {
|
|
755
805
|
return web.memo(() => !!isMultiple())() && selectedValues().length > 0;
|
|
756
806
|
},
|
|
757
807
|
get children() {
|
|
758
|
-
var _el$
|
|
759
|
-
web.insert(_el$
|
|
808
|
+
var _el$96 = web.getNextElement(_tmpl$23);
|
|
809
|
+
web.insert(_el$96, web.createComponent(solidJs.For, {
|
|
760
810
|
get each() {
|
|
761
811
|
return selectedValues();
|
|
762
812
|
},
|
|
763
813
|
children: (val) => (() => {
|
|
764
|
-
var _el$
|
|
765
|
-
web.insert(_el$
|
|
766
|
-
_el$
|
|
767
|
-
web.effect(() => web.setAttribute(_el$
|
|
814
|
+
var _el$103 = web.getNextElement(_tmpl$28), _el$105 = _el$103.firstChild, [_el$106, _co$23] = web.getNextMarker(_el$105.nextSibling), _el$104 = _el$106.nextSibling;
|
|
815
|
+
web.insert(_el$103, () => getLabel(val), _el$106, _co$23);
|
|
816
|
+
_el$104.$$click = () => removeChip(val);
|
|
817
|
+
web.effect(() => web.setAttribute(_el$104, "aria-label", `Remove ${getLabel(val)}`));
|
|
768
818
|
web.runHydrationEvents();
|
|
769
|
-
return _el$
|
|
819
|
+
return _el$103;
|
|
770
820
|
})()
|
|
771
821
|
}));
|
|
772
|
-
return _el$
|
|
822
|
+
return _el$96;
|
|
773
823
|
}
|
|
774
|
-
}), _el$
|
|
775
|
-
_el$
|
|
776
|
-
_el$
|
|
824
|
+
}), _el$100, _co$21);
|
|
825
|
+
_el$97.addEventListener("blur", () => setTimeout(() => setIsOpen(false), 200));
|
|
826
|
+
_el$97.addEventListener("focus", () => {
|
|
777
827
|
if (suggestions().length) setIsOpen(true);
|
|
778
828
|
});
|
|
779
|
-
_el$
|
|
780
|
-
web.insert(_el$
|
|
829
|
+
_el$97.$$input = (e) => handleInput(e.currentTarget.value);
|
|
830
|
+
web.insert(_el$95, web.createComponent(solidJs.Show, {
|
|
781
831
|
get when() {
|
|
782
832
|
return web.memo(() => !!isOpen())() && suggestions().length > 0;
|
|
783
833
|
},
|
|
784
834
|
get children() {
|
|
785
|
-
var _el$
|
|
786
|
-
web.insert(_el$
|
|
835
|
+
var _el$98 = web.getNextElement(_tmpl$30);
|
|
836
|
+
web.insert(_el$98, web.createComponent(solidJs.For, {
|
|
787
837
|
get each() {
|
|
788
838
|
return suggestions();
|
|
789
839
|
},
|
|
790
840
|
children: (item) => {
|
|
791
841
|
const isSelected = () => isMultiple() && selectedValues().includes(item.value);
|
|
792
842
|
return (() => {
|
|
793
|
-
var _el$
|
|
794
|
-
_el$
|
|
795
|
-
_el$
|
|
796
|
-
web.insert(_el$
|
|
797
|
-
web.insert(_el$
|
|
843
|
+
var _el$107 = web.getNextElement(_tmpl$33), _el$109 = _el$107.firstChild, [_el$110, _co$24] = web.getNextMarker(_el$109.nextSibling), _el$111 = _el$110.nextSibling, [_el$112, _co$25] = web.getNextMarker(_el$111.nextSibling);
|
|
844
|
+
_el$107.$$click = () => selectSuggestion(item);
|
|
845
|
+
_el$107.$$mousedown = (e) => e.preventDefault();
|
|
846
|
+
web.insert(_el$107, () => item.label, _el$110, _co$24);
|
|
847
|
+
web.insert(_el$107, web.createComponent(solidJs.Show, {
|
|
798
848
|
get when() {
|
|
799
849
|
return isSelected();
|
|
800
850
|
},
|
|
801
851
|
get children() {
|
|
802
|
-
return web.getNextElement(_tmpl$
|
|
852
|
+
return web.getNextElement(_tmpl$32);
|
|
803
853
|
}
|
|
804
|
-
}), _el$
|
|
854
|
+
}), _el$112, _co$25);
|
|
805
855
|
web.effect((_p$) => {
|
|
806
856
|
var _v$83 = `w-full text-left px-3 py-2 text-sm hover:bg-blue-50 dark:hover:bg-blue-900/20 ${isSelected() ? "text-blue-600 dark:text-blue-400 bg-blue-50/50 dark:bg-blue-900/10" : "text-gray-900 dark:text-white"}`, _v$84 = isSelected();
|
|
807
|
-
_v$83 !== _p$.e && web.className(_el$
|
|
808
|
-
_v$84 !== _p$.t && web.setProperty(_el$
|
|
857
|
+
_v$83 !== _p$.e && web.className(_el$107, _p$.e = _v$83);
|
|
858
|
+
_v$84 !== _p$.t && web.setProperty(_el$107, "disabled", _p$.t = _v$84);
|
|
809
859
|
return _p$;
|
|
810
860
|
}, {
|
|
811
861
|
e: void 0,
|
|
812
862
|
t: void 0
|
|
813
863
|
});
|
|
814
864
|
web.runHydrationEvents();
|
|
815
|
-
return _el$
|
|
865
|
+
return _el$107;
|
|
816
866
|
})();
|
|
817
867
|
}
|
|
818
868
|
}));
|
|
819
|
-
return _el$
|
|
869
|
+
return _el$98;
|
|
820
870
|
}
|
|
821
|
-
}), _el$
|
|
871
|
+
}), _el$102, _co$22);
|
|
822
872
|
web.effect((_p$) => {
|
|
823
873
|
var _v$80 = isMultiple() && selectedValues().length ? "Add more..." : props.field.placeholder, _v$81 = props.disabled, _v$82 = props.baseClass;
|
|
824
|
-
_v$80 !== _p$.e && web.setAttribute(_el$
|
|
825
|
-
_v$81 !== _p$.t && web.setProperty(_el$
|
|
826
|
-
_v$82 !== _p$.a && web.className(_el$
|
|
874
|
+
_v$80 !== _p$.e && web.setAttribute(_el$97, "placeholder", _p$.e = _v$80);
|
|
875
|
+
_v$81 !== _p$.t && web.setProperty(_el$97, "disabled", _p$.t = _v$81);
|
|
876
|
+
_v$82 !== _p$.a && web.className(_el$97, _p$.a = _v$82);
|
|
827
877
|
return _p$;
|
|
828
878
|
}, {
|
|
829
879
|
e: void 0,
|
|
830
880
|
t: void 0,
|
|
831
881
|
a: void 0
|
|
832
882
|
});
|
|
833
|
-
web.effect(() => web.setProperty(_el$
|
|
883
|
+
web.effect(() => web.setProperty(_el$97, "value", query()));
|
|
834
884
|
web.runHydrationEvents();
|
|
835
|
-
return _el$
|
|
885
|
+
return _el$95;
|
|
836
886
|
})();
|
|
837
887
|
};
|
|
838
888
|
const TagsField = (props) => {
|
|
@@ -857,48 +907,48 @@ const TagsField = (props) => {
|
|
|
857
907
|
}
|
|
858
908
|
};
|
|
859
909
|
return (() => {
|
|
860
|
-
var _el$
|
|
861
|
-
web.insert(_el$
|
|
910
|
+
var _el$113 = web.getNextElement(_tmpl$34), _el$116 = _el$113.firstChild, [_el$117, _co$26] = web.getNextMarker(_el$116.nextSibling), _el$115 = _el$117.nextSibling;
|
|
911
|
+
web.insert(_el$113, web.createComponent(solidJs.Show, {
|
|
862
912
|
get when() {
|
|
863
913
|
return (props.value || []).length > 0;
|
|
864
914
|
},
|
|
865
915
|
get children() {
|
|
866
|
-
var _el$
|
|
867
|
-
web.insert(_el$
|
|
916
|
+
var _el$114 = web.getNextElement(_tmpl$23);
|
|
917
|
+
web.insert(_el$114, web.createComponent(solidJs.For, {
|
|
868
918
|
get each() {
|
|
869
919
|
return props.value || [];
|
|
870
920
|
},
|
|
871
921
|
children: (tag) => (() => {
|
|
872
|
-
var _el$
|
|
873
|
-
web.insert(_el$
|
|
874
|
-
_el$
|
|
875
|
-
web.setAttribute(_el$
|
|
922
|
+
var _el$118 = web.getNextElement(_tmpl$28), _el$120 = _el$118.firstChild, [_el$121, _co$27] = web.getNextMarker(_el$120.nextSibling), _el$119 = _el$121.nextSibling;
|
|
923
|
+
web.insert(_el$118, tag, _el$121, _co$27);
|
|
924
|
+
_el$119.$$click = () => removeTag(tag);
|
|
925
|
+
web.setAttribute(_el$119, "aria-label", `Remove ${tag}`);
|
|
876
926
|
web.runHydrationEvents();
|
|
877
|
-
return _el$
|
|
927
|
+
return _el$118;
|
|
878
928
|
})()
|
|
879
929
|
}));
|
|
880
|
-
return _el$
|
|
930
|
+
return _el$114;
|
|
881
931
|
}
|
|
882
|
-
}), _el$
|
|
883
|
-
_el$
|
|
884
|
-
_el$
|
|
885
|
-
_el$
|
|
932
|
+
}), _el$117, _co$26);
|
|
933
|
+
_el$115.addEventListener("blur", addTag);
|
|
934
|
+
_el$115.$$keydown = handleKeyDown;
|
|
935
|
+
_el$115.$$input = (e) => setInput(e.currentTarget.value);
|
|
886
936
|
web.effect((_p$) => {
|
|
887
937
|
var _v$85 = props.placeholder || "Type and press Enter...", _v$86 = props.disabled, _v$87 = props.baseClass;
|
|
888
|
-
_v$85 !== _p$.e && web.setAttribute(_el$
|
|
889
|
-
_v$86 !== _p$.t && web.setProperty(_el$
|
|
890
|
-
_v$87 !== _p$.a && web.className(_el$
|
|
938
|
+
_v$85 !== _p$.e && web.setAttribute(_el$115, "placeholder", _p$.e = _v$85);
|
|
939
|
+
_v$86 !== _p$.t && web.setProperty(_el$115, "disabled", _p$.t = _v$86);
|
|
940
|
+
_v$87 !== _p$.a && web.className(_el$115, _p$.a = _v$87);
|
|
891
941
|
return _p$;
|
|
892
942
|
}, {
|
|
893
943
|
e: void 0,
|
|
894
944
|
t: void 0,
|
|
895
945
|
a: void 0
|
|
896
946
|
});
|
|
897
|
-
web.effect(() => web.setProperty(_el$
|
|
947
|
+
web.effect(() => web.setProperty(_el$115, "value", input()));
|
|
898
948
|
web.runHydrationEvents();
|
|
899
|
-
return _el$
|
|
949
|
+
return _el$113;
|
|
900
950
|
})();
|
|
901
951
|
};
|
|
902
|
-
web.delegateEvents(["
|
|
952
|
+
web.delegateEvents(["focusin", "click", "input", "mousedown", "keydown"]);
|
|
903
953
|
exports.FormFieldRenderer = FormFieldRenderer;
|
|
904
954
|
//# sourceMappingURL=FormFieldRenderer.cjs.map
|