@clyrex-digital/clyrex-controls-dev 0.8.1-dev.20260724091901 → 0.8.1-dev.20260728103223
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/{InputControlClient-YOSLWB3V.mjs → InputControlClient-IKTP3566.mjs} +80 -201
- package/dist/{chunk-6F7QBX3H.mjs → chunk-6GS7N4EV.mjs} +257 -134
- package/dist/index.d.mts +3 -1
- package/dist/index.d.ts +3 -1
- package/dist/index.js +4 -1
- package/dist/index.mjs +5 -3
- package/dist/server.js +1 -1
- package/dist/server.mjs +1 -1
- package/package.json +1 -1
|
@@ -18,9 +18,10 @@ import {
|
|
|
18
18
|
PhoneInput_default,
|
|
19
19
|
RadioInput_default,
|
|
20
20
|
SelectWithSearchInput_default,
|
|
21
|
+
Select_default,
|
|
21
22
|
Switcher_default,
|
|
22
23
|
TimeInput_default
|
|
23
|
-
} from "./chunk-
|
|
24
|
+
} from "./chunk-6GS7N4EV.mjs";
|
|
24
25
|
import {
|
|
25
26
|
Hyperlink,
|
|
26
27
|
Icon_default,
|
|
@@ -33,152 +34,30 @@ import {
|
|
|
33
34
|
import "./chunk-IMNQO57B.mjs";
|
|
34
35
|
|
|
35
36
|
// src/components/controls/edit/InputControlClient.tsx
|
|
36
|
-
import
|
|
37
|
-
|
|
38
|
-
// src/components/controls/edit/Select.tsx
|
|
39
|
-
import { useState, useEffect } from "react";
|
|
40
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
41
|
-
var Select = (props) => {
|
|
42
|
-
const [list, setList] = useState();
|
|
43
|
-
const getSafeValue = (val) => {
|
|
44
|
-
if (val === null || val === void 0) return "";
|
|
45
|
-
if (typeof val === "boolean") return val ? "1" : "0";
|
|
46
|
-
return val;
|
|
47
|
-
};
|
|
48
|
-
const textChangeHandler = (event) => {
|
|
49
|
-
let rawValue = event.target.value;
|
|
50
|
-
if (rawValue === "") rawValue = null;
|
|
51
|
-
let finalValue = rawValue;
|
|
52
|
-
if (list && props.dataKeyFieldName) {
|
|
53
|
-
const key = props.dataKeyFieldName;
|
|
54
|
-
const selectedItem = list.find(
|
|
55
|
-
(item) => String(item[key]) === String(rawValue)
|
|
56
|
-
);
|
|
57
|
-
if (selectedItem) {
|
|
58
|
-
const keyValue = selectedItem[key];
|
|
59
|
-
if (typeof keyValue === "number") {
|
|
60
|
-
finalValue = Number(rawValue);
|
|
61
|
-
}
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
props.callback?.({
|
|
65
|
-
name: props.name,
|
|
66
|
-
value: finalValue,
|
|
67
|
-
index: props.index,
|
|
68
|
-
groupKey: props.groupKey
|
|
69
|
-
});
|
|
70
|
-
};
|
|
71
|
-
const inputChangeHandler = (event) => {
|
|
72
|
-
props.callback?.({
|
|
73
|
-
name: props.name,
|
|
74
|
-
value: event.target.value,
|
|
75
|
-
index: props.index,
|
|
76
|
-
groupKey: props.groupKey
|
|
77
|
-
});
|
|
78
|
-
};
|
|
79
|
-
useEffect(() => {
|
|
80
|
-
async function fetchData() {
|
|
81
|
-
if (props.dataset) {
|
|
82
|
-
setList(props.dataset);
|
|
83
|
-
return;
|
|
84
|
-
}
|
|
85
|
-
if (props.dataSource && props.serviceClient) {
|
|
86
|
-
let dataSource = props.dataSource;
|
|
87
|
-
let response;
|
|
88
|
-
if (props.dataSourceDependsOn) {
|
|
89
|
-
if (!props.dependentValue) {
|
|
90
|
-
setList([]);
|
|
91
|
-
return;
|
|
92
|
-
}
|
|
93
|
-
dataSource = dataSource.replace(
|
|
94
|
-
`{${props.dataSourceDependsOn}}`,
|
|
95
|
-
props.dependentValue
|
|
96
|
-
);
|
|
97
|
-
}
|
|
98
|
-
response = await props.serviceClient.get(dataSource);
|
|
99
|
-
setList(response.result ?? []);
|
|
100
|
-
return;
|
|
101
|
-
}
|
|
102
|
-
setList([]);
|
|
103
|
-
}
|
|
104
|
-
fetchData();
|
|
105
|
-
}, [
|
|
106
|
-
props.dataset,
|
|
107
|
-
props.dataSource,
|
|
108
|
-
props.dependentValue,
|
|
109
|
-
props.dataSourceDependsOn
|
|
110
|
-
]);
|
|
111
|
-
const value = getSafeValue(props.value);
|
|
112
|
-
return /* @__PURE__ */ jsxs("label", { className: "block", children: [
|
|
113
|
-
props.attributes?.label && /* @__PURE__ */ jsx("span", { className: "text-sm font-medium inline-block pb-1", children: props.attributes?.label }),
|
|
114
|
-
" ",
|
|
115
|
-
props.attributes?.label && props.attributes?.required && /* @__PURE__ */ jsx("span", { className: "bg-error-weak", children: "*" }),
|
|
116
|
-
list && list.length === 0 && /* @__PURE__ */ jsx(
|
|
117
|
-
"input",
|
|
118
|
-
{
|
|
119
|
-
type: "text",
|
|
120
|
-
name: props.name,
|
|
121
|
-
id: props.name,
|
|
122
|
-
value,
|
|
123
|
-
onChange: inputChangeHandler,
|
|
124
|
-
required: props.attributes?.required,
|
|
125
|
-
placeholder: props.attributes?.placeholder,
|
|
126
|
-
maxLength: props.attributes?.maxLength,
|
|
127
|
-
pattern: props.attributes?.pattern,
|
|
128
|
-
disabled: props.attributes?.readOnly,
|
|
129
|
-
minLength: props.attributes?.minLength,
|
|
130
|
-
className: `peer input select mt-1 py-1.5 block w-full rounded shadow-sm ${props.inputClasses ?? ""}`
|
|
131
|
-
}
|
|
132
|
-
),
|
|
133
|
-
list && list.length > 0 && /* @__PURE__ */ jsxs(
|
|
134
|
-
"select",
|
|
135
|
-
{
|
|
136
|
-
name: props.name,
|
|
137
|
-
id: props.name,
|
|
138
|
-
value,
|
|
139
|
-
onChange: textChangeHandler,
|
|
140
|
-
required: props.attributes?.required,
|
|
141
|
-
disabled: props.attributes?.readOnly,
|
|
142
|
-
className: `peer select py-1.5 block w-full text-black rounded border-gray-300 shadow-sm
|
|
143
|
-
focus:border-indigo-300 focus:ring focus:ring-indigo-200 focus:ring-opacity-50
|
|
144
|
-
disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none ${props.inputClasses ?? ""}`,
|
|
145
|
-
children: [
|
|
146
|
-
/* @__PURE__ */ jsx("option", { value: "", children: props.attributes?.placeholder || "Select" }),
|
|
147
|
-
list.map((item, index) => {
|
|
148
|
-
const keyField = props.dataKeyFieldName;
|
|
149
|
-
const textField = props.dataTextFieldName;
|
|
150
|
-
return /* @__PURE__ */ jsx("option", { value: item[keyField], children: item[textField] }, index);
|
|
151
|
-
})
|
|
152
|
-
]
|
|
153
|
-
}
|
|
154
|
-
),
|
|
155
|
-
/* @__PURE__ */ jsx("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 text-alert text-sm", children: props.attributes?.errorMessage || "" })
|
|
156
|
-
] });
|
|
157
|
-
};
|
|
158
|
-
var Select_default = Select;
|
|
37
|
+
import React4 from "react";
|
|
159
38
|
|
|
160
39
|
// src/components/controls/edit/SelectWithSearchPanel.tsx
|
|
161
|
-
import
|
|
162
|
-
useEffect
|
|
40
|
+
import React, {
|
|
41
|
+
useEffect,
|
|
163
42
|
useRef,
|
|
164
|
-
useState
|
|
43
|
+
useState,
|
|
165
44
|
useCallback
|
|
166
45
|
} from "react";
|
|
167
|
-
import { jsx
|
|
46
|
+
import { jsx, jsxs } from "react/jsx-runtime";
|
|
168
47
|
var SelectWithSearchPanel = (props) => {
|
|
169
|
-
const [isOpen, setIsOpen] =
|
|
170
|
-
const [searchTerm, setSearchTerm] =
|
|
171
|
-
const [highlightedIndex, setHighlightedIndex] =
|
|
172
|
-
const [list, setList] =
|
|
48
|
+
const [isOpen, setIsOpen] = useState(false);
|
|
49
|
+
const [searchTerm, setSearchTerm] = useState("");
|
|
50
|
+
const [highlightedIndex, setHighlightedIndex] = useState(0);
|
|
51
|
+
const [list, setList] = useState([]);
|
|
173
52
|
const listRef = useRef(null);
|
|
174
|
-
const [isError, setIsError] =
|
|
53
|
+
const [isError, setIsError] = useState(false);
|
|
175
54
|
const containerRef = useRef(null);
|
|
176
|
-
const [isCreateOpen, setIsCreateOpen] =
|
|
177
|
-
const [formData, setFormData] =
|
|
55
|
+
const [isCreateOpen, setIsCreateOpen] = useState(false);
|
|
56
|
+
const [formData, setFormData] = useState({});
|
|
178
57
|
const getNestedValue = (obj, path) => {
|
|
179
58
|
return path.split(".").reduce((acc, key) => acc?.[key], obj);
|
|
180
59
|
};
|
|
181
|
-
|
|
60
|
+
useEffect(() => {
|
|
182
61
|
const handleClickOutside = (event) => {
|
|
183
62
|
if (containerRef.current && !containerRef.current.contains(event.target)) {
|
|
184
63
|
setIsOpen(false);
|
|
@@ -189,7 +68,7 @@ var SelectWithSearchPanel = (props) => {
|
|
|
189
68
|
document.removeEventListener("mousedown", handleClickOutside);
|
|
190
69
|
};
|
|
191
70
|
}, []);
|
|
192
|
-
|
|
71
|
+
useEffect(() => {
|
|
193
72
|
async function fetchData() {
|
|
194
73
|
if (props.dataset) {
|
|
195
74
|
setList(props.dataset);
|
|
@@ -231,7 +110,7 @@ var SelectWithSearchPanel = (props) => {
|
|
|
231
110
|
audioCtx.close();
|
|
232
111
|
}, 250);
|
|
233
112
|
};
|
|
234
|
-
|
|
113
|
+
useEffect(() => {
|
|
235
114
|
const filteredItems2 = list?.filter(
|
|
236
115
|
(item) => item[props?.dataTextFieldName]?.toLowerCase().includes(searchTerm?.toLowerCase())
|
|
237
116
|
);
|
|
@@ -300,14 +179,14 @@ var SelectWithSearchPanel = (props) => {
|
|
|
300
179
|
console.log("Form Data:", formData);
|
|
301
180
|
return formData;
|
|
302
181
|
}, []);
|
|
303
|
-
return /* @__PURE__ */
|
|
304
|
-
/* @__PURE__ */
|
|
182
|
+
return /* @__PURE__ */ jsxs("div", { className: "relative", children: [
|
|
183
|
+
/* @__PURE__ */ jsxs("label", { className: "text-sm mb-1 font-medium", children: [
|
|
305
184
|
props.attributes?.label,
|
|
306
185
|
" ",
|
|
307
186
|
" ",
|
|
308
|
-
props?.attributes?.required && /* @__PURE__ */
|
|
187
|
+
props?.attributes?.required && /* @__PURE__ */ jsx("span", { className: "bg-error-weak", children: "*" })
|
|
309
188
|
] }),
|
|
310
|
-
/* @__PURE__ */
|
|
189
|
+
/* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
|
|
311
190
|
"input",
|
|
312
191
|
{
|
|
313
192
|
type: "text",
|
|
@@ -321,14 +200,14 @@ var SelectWithSearchPanel = (props) => {
|
|
|
321
200
|
disabled:bg-slate-50 disabled:text-slate-500 disabled:border-slate-200 disabled:shadow-none`
|
|
322
201
|
}
|
|
323
202
|
) }),
|
|
324
|
-
/* @__PURE__ */
|
|
325
|
-
/* @__PURE__ */
|
|
326
|
-
/* @__PURE__ */
|
|
203
|
+
/* @__PURE__ */ jsx("div", { ref: containerRef, children: isOpen && /* @__PURE__ */ jsxs(React.Fragment, { children: [
|
|
204
|
+
/* @__PURE__ */ jsxs("div", { className: "fixed z-50 right-0 bg-white top-[62px] w-1/4 border-l border-gray-200", children: [
|
|
205
|
+
/* @__PURE__ */ jsx("div", { className: "flex flex-col p-2 bg-accent-950 text-white", children: /* @__PURE__ */ jsxs("h5", { className: "text-md text-white font-medium", children: [
|
|
327
206
|
"Select a",
|
|
328
207
|
" ",
|
|
329
208
|
props.attributes?.label || props.attributes?.heading
|
|
330
209
|
] }) }),
|
|
331
|
-
/* @__PURE__ */
|
|
210
|
+
/* @__PURE__ */ jsx("div", { className: "flex justify-end px-4 border-b py-2 border-gray-200 h-10", children: props.createFields && props.createFields.length > 0 && /* @__PURE__ */ jsx(
|
|
332
211
|
"button",
|
|
333
212
|
{
|
|
334
213
|
type: "button",
|
|
@@ -341,12 +220,12 @@ var SelectWithSearchPanel = (props) => {
|
|
|
341
220
|
}
|
|
342
221
|
) })
|
|
343
222
|
] }),
|
|
344
|
-
isCreateOpen && /* @__PURE__ */
|
|
345
|
-
/* @__PURE__ */
|
|
223
|
+
isCreateOpen && /* @__PURE__ */ jsxs("div", { className: "fixed right-0 w-1/4 h-full top-[62px] bg-white shadow-lg border-l border-gray-200 z-50", children: [
|
|
224
|
+
/* @__PURE__ */ jsx("div", { className: "flex flex-col p-2 bg-accent-950", children: /* @__PURE__ */ jsxs("h5", { className: "text-md font-medium text-white", children: [
|
|
346
225
|
"Create New ",
|
|
347
226
|
props.attributes?.label
|
|
348
227
|
] }) }),
|
|
349
|
-
/* @__PURE__ */
|
|
228
|
+
/* @__PURE__ */ jsx("div", { className: "flex justify-end px-4 border-b py-2 border-gray-200", children: /* @__PURE__ */ jsx(
|
|
350
229
|
"button",
|
|
351
230
|
{
|
|
352
231
|
type: "button",
|
|
@@ -355,10 +234,10 @@ var SelectWithSearchPanel = (props) => {
|
|
|
355
234
|
children: "Close"
|
|
356
235
|
}
|
|
357
236
|
) }),
|
|
358
|
-
/* @__PURE__ */
|
|
359
|
-
props.createFields?.map((field) => /* @__PURE__ */
|
|
360
|
-
/* @__PURE__ */
|
|
361
|
-
/* @__PURE__ */
|
|
237
|
+
/* @__PURE__ */ jsxs("div", { className: "p-4", children: [
|
|
238
|
+
props.createFields?.map((field) => /* @__PURE__ */ jsxs("div", { className: "mb-4", children: [
|
|
239
|
+
/* @__PURE__ */ jsx("label", { className: "text-sm mb-1 font-medium block", children: field.label }),
|
|
240
|
+
/* @__PURE__ */ jsx(
|
|
362
241
|
"input",
|
|
363
242
|
{
|
|
364
243
|
type: field.type,
|
|
@@ -374,7 +253,7 @@ var SelectWithSearchPanel = (props) => {
|
|
|
374
253
|
}
|
|
375
254
|
)
|
|
376
255
|
] }, field.name)),
|
|
377
|
-
/* @__PURE__ */
|
|
256
|
+
/* @__PURE__ */ jsxs(Button_default, { onClick: async () => {
|
|
378
257
|
handleSaveModal();
|
|
379
258
|
return { isSuccessful: true };
|
|
380
259
|
}, className: "w-full", children: [
|
|
@@ -383,13 +262,13 @@ var SelectWithSearchPanel = (props) => {
|
|
|
383
262
|
] })
|
|
384
263
|
] })
|
|
385
264
|
] }),
|
|
386
|
-
/* @__PURE__ */
|
|
265
|
+
/* @__PURE__ */ jsx(
|
|
387
266
|
"div",
|
|
388
267
|
{
|
|
389
268
|
ref: listRef,
|
|
390
269
|
className: "fixed z-10 right-0 mt-[130px] top-0 w-1/4 bg-white border-l border-gray-200 shadow-lg overflow-y-auto",
|
|
391
270
|
style: { height: "calc(100vh - 130px)" },
|
|
392
|
-
children: filteredItems.length > 0 ? filteredItems.map((item, index) => /* @__PURE__ */
|
|
271
|
+
children: filteredItems.length > 0 ? filteredItems.map((item, index) => /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
|
|
393
272
|
"button",
|
|
394
273
|
{
|
|
395
274
|
onClick: (e) => {
|
|
@@ -399,9 +278,9 @@ var SelectWithSearchPanel = (props) => {
|
|
|
399
278
|
role: "option",
|
|
400
279
|
tabIndex: -1,
|
|
401
280
|
onMouseEnter: () => setHighlightedIndex(index),
|
|
402
|
-
children: /* @__PURE__ */
|
|
281
|
+
children: /* @__PURE__ */ jsx("span", { children: getNestedValue(item, props.dataTextFieldName) })
|
|
403
282
|
}
|
|
404
|
-
) }, item[props.dataKeyFieldName])) : /* @__PURE__ */
|
|
283
|
+
) }, item[props.dataKeyFieldName])) : /* @__PURE__ */ jsx("div", { className: "px-4 py-2 text-gray-500", children: "No results found" })
|
|
405
284
|
}
|
|
406
285
|
)
|
|
407
286
|
] }) })
|
|
@@ -410,8 +289,8 @@ var SelectWithSearchPanel = (props) => {
|
|
|
410
289
|
var SelectWithSearchPanel_default = SelectWithSearchPanel;
|
|
411
290
|
|
|
412
291
|
// src/components/controls/edit/AssetUpload.tsx
|
|
413
|
-
import
|
|
414
|
-
import { jsx as
|
|
292
|
+
import React2, { useEffect as useEffect2 } from "react";
|
|
293
|
+
import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
|
|
415
294
|
var AssetUpload = (props) => {
|
|
416
295
|
const isDisabled = props.attributes?.disable ?? false;
|
|
417
296
|
let allValues = [];
|
|
@@ -432,8 +311,8 @@ var AssetUpload = (props) => {
|
|
|
432
311
|
}
|
|
433
312
|
return "image";
|
|
434
313
|
};
|
|
435
|
-
const [assetType, setAssetType] =
|
|
436
|
-
|
|
314
|
+
const [assetType, setAssetType] = React2.useState(getInitialTab);
|
|
315
|
+
useEffect2(() => {
|
|
437
316
|
setAssetType(getInitialTab());
|
|
438
317
|
}, [props.value]);
|
|
439
318
|
const assetUploadCallback = (newAsset) => {
|
|
@@ -508,10 +387,10 @@ var AssetUpload = (props) => {
|
|
|
508
387
|
}
|
|
509
388
|
return false;
|
|
510
389
|
};
|
|
511
|
-
return /* @__PURE__ */
|
|
512
|
-
/* @__PURE__ */
|
|
513
|
-
/* @__PURE__ */
|
|
514
|
-
/* @__PURE__ */
|
|
390
|
+
return /* @__PURE__ */ jsxs2(React2.Fragment, { children: [
|
|
391
|
+
/* @__PURE__ */ jsx2("label", { className: "block mb-1", children: /* @__PURE__ */ jsx2("span", { className: "text-sm font-medium", children: props?.attributes?.label }) }),
|
|
392
|
+
/* @__PURE__ */ jsxs2("div", { className: "flex gap-6 bg-neutral-100 rounded p-2", children: [
|
|
393
|
+
/* @__PURE__ */ jsx2(
|
|
515
394
|
ClientButton_default,
|
|
516
395
|
{
|
|
517
396
|
className: assetType === "image" ? "px-2 py-1 rounded bg-body-200 scale-95" : "text-neutral-700",
|
|
@@ -521,7 +400,7 @@ var AssetUpload = (props) => {
|
|
|
521
400
|
children: "Image Upload"
|
|
522
401
|
}
|
|
523
402
|
),
|
|
524
|
-
/* @__PURE__ */
|
|
403
|
+
/* @__PURE__ */ jsx2(
|
|
525
404
|
ClientButton_default,
|
|
526
405
|
{
|
|
527
406
|
className: assetType === "video" ? "bg-body-200 px-2 py-1 rounded-md scale-95" : "text-neutral-700",
|
|
@@ -532,13 +411,13 @@ var AssetUpload = (props) => {
|
|
|
532
411
|
}
|
|
533
412
|
)
|
|
534
413
|
] }),
|
|
535
|
-
shouldShowDetails() && /* @__PURE__ */
|
|
536
|
-
/* @__PURE__ */
|
|
537
|
-
/* @__PURE__ */
|
|
538
|
-
/* @__PURE__ */
|
|
539
|
-
/* @__PURE__ */
|
|
540
|
-
/* @__PURE__ */
|
|
541
|
-
/* @__PURE__ */
|
|
414
|
+
shouldShowDetails() && /* @__PURE__ */ jsxs2("div", { className: "relative mt-4 rounded-md p-4 border-2 border-dotted border-gray-300 bg-gray-50", children: [
|
|
415
|
+
/* @__PURE__ */ jsx2("span", { className: "absolute -top-2.5 left-3 bg-primary-600 text-white text-xs px-2 py-0.5 rounded-full", children: getAssetType(allValues[0]) === "video" ? "Video" : "Image" }),
|
|
416
|
+
/* @__PURE__ */ jsx2("div", { className: "flex flex-col gap-3", children: allValues.map((digitalAsset, index) => /* @__PURE__ */ jsxs2("div", { className: "flex justify-between items-start gap-5", children: [
|
|
417
|
+
/* @__PURE__ */ jsxs2("div", { className: "grid grid-cols-2 gap-x-8 gap-y-3 text-sm w-full", children: [
|
|
418
|
+
/* @__PURE__ */ jsxs2("div", { children: [
|
|
419
|
+
/* @__PURE__ */ jsx2("p", { className: "text-gray-500", children: "Title" }),
|
|
420
|
+
/* @__PURE__ */ jsx2(
|
|
542
421
|
"input",
|
|
543
422
|
{
|
|
544
423
|
type: "text",
|
|
@@ -550,18 +429,18 @@ var AssetUpload = (props) => {
|
|
|
550
429
|
}
|
|
551
430
|
)
|
|
552
431
|
] }),
|
|
553
|
-
digitalAsset.intrinsicWidth && digitalAsset.intrinsicHeight && /* @__PURE__ */
|
|
554
|
-
/* @__PURE__ */
|
|
555
|
-
/* @__PURE__ */
|
|
432
|
+
digitalAsset.intrinsicWidth && digitalAsset.intrinsicHeight && /* @__PURE__ */ jsxs2("div", { children: [
|
|
433
|
+
/* @__PURE__ */ jsx2("p", { className: "text-gray-500", children: "Resolution" }),
|
|
434
|
+
/* @__PURE__ */ jsxs2("p", { className: "font-medium text-gray-900 mt-3", children: [
|
|
556
435
|
digitalAsset.intrinsicWidth,
|
|
557
436
|
"\xD7",
|
|
558
437
|
digitalAsset.intrinsicHeight
|
|
559
438
|
] })
|
|
560
439
|
] }),
|
|
561
|
-
(digitalAsset.assetUrl || digitalAsset.posterUrl) && /* @__PURE__ */
|
|
562
|
-
/* @__PURE__ */
|
|
563
|
-
/* @__PURE__ */
|
|
564
|
-
getAssetType(digitalAsset) === "video" && digitalAsset.posterUrl && /* @__PURE__ */
|
|
440
|
+
(digitalAsset.assetUrl || digitalAsset.posterUrl) && /* @__PURE__ */ jsxs2("div", { children: [
|
|
441
|
+
/* @__PURE__ */ jsx2("p", { className: "text-gray-500", children: "Image / Poster" }),
|
|
442
|
+
/* @__PURE__ */ jsxs2("div", { className: "flex-shrink-0 flex flex-col gap-3 mt-1", children: [
|
|
443
|
+
getAssetType(digitalAsset) === "video" && digitalAsset.posterUrl && /* @__PURE__ */ jsx2(
|
|
565
444
|
"img",
|
|
566
445
|
{
|
|
567
446
|
src: AssetUtility_default.resolveUrl(props.serviceClient?.baseUrl, digitalAsset.posterUrl),
|
|
@@ -569,7 +448,7 @@ var AssetUpload = (props) => {
|
|
|
569
448
|
className: "w-32 h-auto object-cover rounded border p-1"
|
|
570
449
|
}
|
|
571
450
|
),
|
|
572
|
-
getAssetType(digitalAsset) === "image" && digitalAsset.assetUrl && /* @__PURE__ */
|
|
451
|
+
getAssetType(digitalAsset) === "image" && digitalAsset.assetUrl && /* @__PURE__ */ jsx2(
|
|
573
452
|
"img",
|
|
574
453
|
{
|
|
575
454
|
src: AssetUtility_default.resolveUrl(props.serviceClient?.baseUrl, digitalAsset.assetUrl),
|
|
@@ -579,9 +458,9 @@ var AssetUpload = (props) => {
|
|
|
579
458
|
)
|
|
580
459
|
] })
|
|
581
460
|
] }),
|
|
582
|
-
digitalAsset.assetUrl?.endsWith(".m3u8") && /* @__PURE__ */
|
|
583
|
-
/* @__PURE__ */
|
|
584
|
-
/* @__PURE__ */
|
|
461
|
+
digitalAsset.assetUrl?.endsWith(".m3u8") && /* @__PURE__ */ jsxs2("div", { className: "col-span-2", children: [
|
|
462
|
+
/* @__PURE__ */ jsx2("p", { className: "text-gray-500", children: "HLS Link" }),
|
|
463
|
+
/* @__PURE__ */ jsx2(
|
|
585
464
|
Hyperlink,
|
|
586
465
|
{
|
|
587
466
|
href: digitalAsset.assetUrl,
|
|
@@ -592,12 +471,12 @@ var AssetUpload = (props) => {
|
|
|
592
471
|
)
|
|
593
472
|
] })
|
|
594
473
|
] }),
|
|
595
|
-
/* @__PURE__ */
|
|
474
|
+
/* @__PURE__ */ jsx2(
|
|
596
475
|
"span",
|
|
597
476
|
{
|
|
598
477
|
onClick: () => !isDisabled && deleteFile(index),
|
|
599
478
|
className: isDisabled ? "cursor-not-allowed opacity-50" : "cursor-pointer",
|
|
600
|
-
children: /* @__PURE__ */
|
|
479
|
+
children: /* @__PURE__ */ jsx2(Icon_default, { className: "w-4 h-4 text-primary", name: "delete" })
|
|
601
480
|
}
|
|
602
481
|
)
|
|
603
482
|
] }, index)) })
|
|
@@ -607,8 +486,8 @@ var AssetUpload = (props) => {
|
|
|
607
486
|
var AssetUpload_default = AssetUpload;
|
|
608
487
|
|
|
609
488
|
// src/components/controls/edit/SwitchInput.tsx
|
|
610
|
-
import
|
|
611
|
-
import { jsx as
|
|
489
|
+
import React3 from "react";
|
|
490
|
+
import { jsx as jsx3, jsxs as jsxs3 } from "react/jsx-runtime";
|
|
612
491
|
var SwitchInput = (props) => {
|
|
613
492
|
const textChangeHandler = (event) => {
|
|
614
493
|
let text = event.target.checked;
|
|
@@ -625,28 +504,28 @@ var SwitchInput = (props) => {
|
|
|
625
504
|
if (props.value != void 0 && props.value != null && props.value != "" && (props.value == "true" || props.value.toString() == "true")) {
|
|
626
505
|
value = true;
|
|
627
506
|
}
|
|
628
|
-
return /* @__PURE__ */
|
|
629
|
-
/* @__PURE__ */
|
|
630
|
-
props?.attributes?.label && /* @__PURE__ */
|
|
507
|
+
return /* @__PURE__ */ jsx3(React3.Fragment, { children: /* @__PURE__ */ jsxs3("div", { className: "flex items-start justify-between gap-4 py-3", children: [
|
|
508
|
+
/* @__PURE__ */ jsxs3("div", { className: "min-w-0", children: [
|
|
509
|
+
props?.attributes?.label && /* @__PURE__ */ jsxs3(
|
|
631
510
|
"label",
|
|
632
511
|
{
|
|
633
512
|
htmlFor: props.name,
|
|
634
513
|
className: "inline-block text-sm font-semibold text-slate-800",
|
|
635
514
|
children: [
|
|
636
515
|
props.attributes.label,
|
|
637
|
-
props?.attributes?.required && /* @__PURE__ */
|
|
516
|
+
props?.attributes?.required && /* @__PURE__ */ jsx3("span", { className: "bg-error-weak", children: "*" })
|
|
638
517
|
]
|
|
639
518
|
}
|
|
640
519
|
),
|
|
641
|
-
/* @__PURE__ */
|
|
520
|
+
/* @__PURE__ */ jsx3("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props?.attributes?.errorMessage || "" })
|
|
642
521
|
] }),
|
|
643
|
-
/* @__PURE__ */
|
|
522
|
+
/* @__PURE__ */ jsxs3(
|
|
644
523
|
"label",
|
|
645
524
|
{
|
|
646
525
|
htmlFor: props.name,
|
|
647
526
|
className: "relative inline-flex shrink-0 cursor-pointer items-center peer-disabled:cursor-not-allowed",
|
|
648
527
|
children: [
|
|
649
|
-
/* @__PURE__ */
|
|
528
|
+
/* @__PURE__ */ jsx3(
|
|
650
529
|
"input",
|
|
651
530
|
{
|
|
652
531
|
type: "checkbox",
|
|
@@ -659,13 +538,13 @@ var SwitchInput = (props) => {
|
|
|
659
538
|
className: "peer sr-only"
|
|
660
539
|
}
|
|
661
540
|
),
|
|
662
|
-
/* @__PURE__ */
|
|
541
|
+
/* @__PURE__ */ jsx3(
|
|
663
542
|
"div",
|
|
664
543
|
{
|
|
665
544
|
className: "h-6 w-11 rounded-full bg-slate-200 shadow-inner\n transition-colors duration-200 ease-in-out\n peer-checked:bg-blue-600\n peer-focus-visible:ring-2 peer-focus-visible:ring-blue-300 peer-focus-visible:ring-offset-2\n peer-disabled:bg-slate-100"
|
|
666
545
|
}
|
|
667
546
|
),
|
|
668
|
-
/* @__PURE__ */
|
|
547
|
+
/* @__PURE__ */ jsx3(
|
|
669
548
|
"div",
|
|
670
549
|
{
|
|
671
550
|
className: "absolute left-0.5 top-0.5 h-5 w-5 rounded-full bg-default shadow\n transition-transform duration-200 ease-in-out\n peer-checked:translate-x-5\n peer-disabled:bg-slate-50"
|
|
@@ -679,8 +558,8 @@ var SwitchInput = (props) => {
|
|
|
679
558
|
var SwitchInput_default = SwitchInput;
|
|
680
559
|
|
|
681
560
|
// src/components/controls/edit/InputControlClient.tsx
|
|
682
|
-
import { jsx as
|
|
683
|
-
var InputControl =
|
|
561
|
+
import { jsx as jsx4 } from "react/jsx-runtime";
|
|
562
|
+
var InputControl = React4.forwardRef(
|
|
684
563
|
(props, ref) => {
|
|
685
564
|
const ControlComponents = {
|
|
686
565
|
[InputControlType_default.lineTextInput]: LineTextInput_default,
|
|
@@ -707,7 +586,7 @@ var InputControl = React5.forwardRef(
|
|
|
707
586
|
[InputControlType_default.switcher]: Switcher_default
|
|
708
587
|
};
|
|
709
588
|
const SelectedControlComponent = ControlComponents[props.controlType];
|
|
710
|
-
return /* @__PURE__ */
|
|
589
|
+
return /* @__PURE__ */ jsx4(React4.Fragment, { children: SelectedControlComponent ? /* @__PURE__ */ jsx4(SelectedControlComponent, { ...props }) : "Control not found:" + props.controlType });
|
|
711
590
|
}
|
|
712
591
|
);
|
|
713
592
|
InputControl.displayName = "InputControl";
|