@clyrex-digital/clyrex-controls-dev 0.8.1-dev.20260723123821 → 0.8.1-dev.20260724060217
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-7NS4QUWO.mjs → InputControlClient-J2NUB5BS.mjs} +47 -7
- package/dist/{Pagination-T7YN2OMV.mjs → Pagination-BETIPTVF.mjs} +2 -2
- package/dist/{chunk-5GHPW7SJ.mjs → chunk-BAGK3UOE.mjs} +4 -0
- package/dist/{chunk-7ZFZLN56.mjs → chunk-HAGCF2RO.mjs} +322 -1
- package/dist/{chunk-X3YSXTD2.mjs → chunk-TMVO22U3.mjs} +1 -1
- package/dist/index.d.mts +13 -2
- package/dist/index.d.ts +13 -2
- package/dist/index.js +889 -497
- package/dist/index.mjs +11 -5
- package/package.json +1 -1
|
@@ -6,6 +6,7 @@ import {
|
|
|
6
6
|
BooleanSelect_default,
|
|
7
7
|
CheckboxInput_default,
|
|
8
8
|
ColorInput_default,
|
|
9
|
+
DateInput_default,
|
|
9
10
|
DateTimeInput_default,
|
|
10
11
|
EmailInput_default,
|
|
11
12
|
LineTextInput_default,
|
|
@@ -15,14 +16,16 @@ import {
|
|
|
15
16
|
OtpInput_default,
|
|
16
17
|
PercentageInput_default,
|
|
17
18
|
PhoneInput_default,
|
|
19
|
+
RadioInput_default,
|
|
18
20
|
SelectWithSearchInput_default,
|
|
21
|
+
Switcher_default,
|
|
19
22
|
TimeInput_default
|
|
20
|
-
} from "./chunk-
|
|
23
|
+
} from "./chunk-HAGCF2RO.mjs";
|
|
21
24
|
import {
|
|
22
25
|
Hyperlink,
|
|
23
26
|
Icon_default,
|
|
24
27
|
InputControlType_default
|
|
25
|
-
} from "./chunk-
|
|
28
|
+
} from "./chunk-BAGK3UOE.mjs";
|
|
26
29
|
import {
|
|
27
30
|
Button_default,
|
|
28
31
|
ClientButton_default
|
|
@@ -36,7 +39,7 @@ import React5 from "react";
|
|
|
36
39
|
import { useState, useEffect } from "react";
|
|
37
40
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
38
41
|
var Select = (props) => {
|
|
39
|
-
const [list, setList] = useState(
|
|
42
|
+
const [list, setList] = useState();
|
|
40
43
|
const getSafeValue = (val) => {
|
|
41
44
|
if (val === null || val === void 0) return "";
|
|
42
45
|
if (typeof val === "boolean") return val ? "1" : "0";
|
|
@@ -65,6 +68,14 @@ var Select = (props) => {
|
|
|
65
68
|
groupKey: props.groupKey
|
|
66
69
|
});
|
|
67
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
|
+
};
|
|
68
79
|
useEffect(() => {
|
|
69
80
|
async function fetchData() {
|
|
70
81
|
if (props.dataset) {
|
|
@@ -74,7 +85,11 @@ var Select = (props) => {
|
|
|
74
85
|
if (props.dataSource && props.serviceClient) {
|
|
75
86
|
let dataSource = props.dataSource;
|
|
76
87
|
let response;
|
|
77
|
-
if (props.dataSourceDependsOn
|
|
88
|
+
if (props.dataSourceDependsOn) {
|
|
89
|
+
if (!props.dependentValue) {
|
|
90
|
+
setList([]);
|
|
91
|
+
return;
|
|
92
|
+
}
|
|
78
93
|
dataSource = dataSource.replace(
|
|
79
94
|
`{${props.dataSourceDependsOn}}`,
|
|
80
95
|
props.dependentValue
|
|
@@ -82,7 +97,9 @@ var Select = (props) => {
|
|
|
82
97
|
}
|
|
83
98
|
response = await props.serviceClient.get(dataSource);
|
|
84
99
|
setList(response.result ?? []);
|
|
100
|
+
return;
|
|
85
101
|
}
|
|
102
|
+
setList([]);
|
|
86
103
|
}
|
|
87
104
|
fetchData();
|
|
88
105
|
}, [
|
|
@@ -96,7 +113,24 @@ var Select = (props) => {
|
|
|
96
113
|
props.attributes?.label && /* @__PURE__ */ jsx("span", { className: "text-sm font-medium inline-block pb-1", children: props.attributes?.label }),
|
|
97
114
|
" ",
|
|
98
115
|
props.attributes?.label && props.attributes?.required && /* @__PURE__ */ jsx("span", { className: "bg-error-weak", children: "*" }),
|
|
99
|
-
/* @__PURE__ */
|
|
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(
|
|
100
134
|
"select",
|
|
101
135
|
{
|
|
102
136
|
name: props.name,
|
|
@@ -105,7 +139,9 @@ var Select = (props) => {
|
|
|
105
139
|
onChange: textChangeHandler,
|
|
106
140
|
required: props.attributes?.required,
|
|
107
141
|
disabled: props.attributes?.readOnly,
|
|
108
|
-
className:
|
|
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 ?? ""}`,
|
|
109
145
|
children: [
|
|
110
146
|
/* @__PURE__ */ jsx("option", { value: "", children: props.attributes?.placeholder || "Select" }),
|
|
111
147
|
list.map((item, index) => {
|
|
@@ -664,7 +700,11 @@ var InputControl = React5.forwardRef(
|
|
|
664
700
|
[InputControlType_default.booleanSelect]: BooleanSelect_default,
|
|
665
701
|
[InputControlType_default.timeInput]: TimeInput_default,
|
|
666
702
|
[InputControlType_default.asset]: AssetUpload_default,
|
|
667
|
-
[InputControlType_default.
|
|
703
|
+
[InputControlType_default.assetUpload]: AssetUpload_default,
|
|
704
|
+
[InputControlType_default.switchInput]: SwitchInput_default,
|
|
705
|
+
[InputControlType_default.dateInput]: DateInput_default,
|
|
706
|
+
[InputControlType_default.radioInput]: RadioInput_default,
|
|
707
|
+
[InputControlType_default.switcher]: Switcher_default
|
|
668
708
|
};
|
|
669
709
|
const SelectedControlComponent = ControlComponents[props.controlType];
|
|
670
710
|
return /* @__PURE__ */ jsx5(React5.Fragment, { children: SelectedControlComponent ? /* @__PURE__ */ jsx5(SelectedControlComponent, { ...props }) : "Control not found" });
|
|
@@ -3,12 +3,12 @@
|
|
|
3
3
|
"use client";
|
|
4
4
|
import {
|
|
5
5
|
OdataBuilder
|
|
6
|
-
} from "./chunk-
|
|
6
|
+
} from "./chunk-TMVO22U3.mjs";
|
|
7
7
|
import {
|
|
8
8
|
Constants,
|
|
9
9
|
Hyperlink,
|
|
10
10
|
Icon_default
|
|
11
|
-
} from "./chunk-
|
|
11
|
+
} from "./chunk-BAGK3UOE.mjs";
|
|
12
12
|
import "./chunk-IMNQO57B.mjs";
|
|
13
13
|
|
|
14
14
|
// src/components/Pagination.tsx
|
|
@@ -16,6 +16,7 @@ var InputControlType = {
|
|
|
16
16
|
select: "select",
|
|
17
17
|
percentageInput: "percentage",
|
|
18
18
|
asset: "asset",
|
|
19
|
+
assetUpload: "assetUpload",
|
|
19
20
|
phoneInput: "phone",
|
|
20
21
|
numberInput: "number",
|
|
21
22
|
checkboxInput: "boolean",
|
|
@@ -27,6 +28,9 @@ var InputControlType = {
|
|
|
27
28
|
selectWithSearchPanel: "selectWithSearchPanel",
|
|
28
29
|
booleanSelect: "booleanSelect",
|
|
29
30
|
switchInput: "switchInput",
|
|
31
|
+
dateInput: "dateInput",
|
|
32
|
+
radioInput: "radioInput",
|
|
33
|
+
switcher: "switcher",
|
|
30
34
|
videoInput: "videoInput"
|
|
31
35
|
};
|
|
32
36
|
var InputControlType_default = InputControlType;
|
|
@@ -1,5 +1,8 @@
|
|
|
1
1
|
"use client";
|
|
2
2
|
|
|
3
|
+
import {
|
|
4
|
+
Icon_default
|
|
5
|
+
} from "./chunk-BAGK3UOE.mjs";
|
|
3
6
|
|
|
4
7
|
// src/components/controls/edit/MultilineTextInput.tsx
|
|
5
8
|
import React from "react";
|
|
@@ -863,6 +866,321 @@ var TimeInput = (props) => {
|
|
|
863
866
|
};
|
|
864
867
|
var TimeInput_default = TimeInput;
|
|
865
868
|
|
|
869
|
+
// src/components/controls/edit/DateInput.tsx
|
|
870
|
+
import { useMemo } from "react";
|
|
871
|
+
|
|
872
|
+
// src/components/utilities/DateTimeUtility.tsx
|
|
873
|
+
var DateTimeUtility = class {
|
|
874
|
+
constructor() {
|
|
875
|
+
}
|
|
876
|
+
static formatDate(date) {
|
|
877
|
+
if (!date) {
|
|
878
|
+
throw new Error("Invalid date");
|
|
879
|
+
}
|
|
880
|
+
const pad = (num) => num.toString().padStart(2, "0");
|
|
881
|
+
const year = date.getFullYear();
|
|
882
|
+
const month = pad(date.getMonth() + 1);
|
|
883
|
+
const day = pad(date.getDate());
|
|
884
|
+
const hours = pad(date.getHours());
|
|
885
|
+
const minutes = pad(date.getMinutes());
|
|
886
|
+
const seconds = pad(date.getSeconds());
|
|
887
|
+
return `${year}-${month}-${day}T${hours}:${minutes}:${seconds}`;
|
|
888
|
+
}
|
|
889
|
+
static getMonthShortNameCustom(month) {
|
|
890
|
+
const monthNames = [
|
|
891
|
+
"Jan",
|
|
892
|
+
"Feb",
|
|
893
|
+
"Mar",
|
|
894
|
+
"Apr",
|
|
895
|
+
"May",
|
|
896
|
+
"Jun",
|
|
897
|
+
"Jul",
|
|
898
|
+
"Aug",
|
|
899
|
+
"Sep",
|
|
900
|
+
"Oct",
|
|
901
|
+
"Nov",
|
|
902
|
+
"Dec"
|
|
903
|
+
];
|
|
904
|
+
if (month < 1 || month > 12) {
|
|
905
|
+
throw new Error(
|
|
906
|
+
"Invalid month. Please provide a value between 1 and 12."
|
|
907
|
+
);
|
|
908
|
+
}
|
|
909
|
+
return monthNames[month - 1];
|
|
910
|
+
}
|
|
911
|
+
static getCurrentWeekRange() {
|
|
912
|
+
const today = /* @__PURE__ */ new Date();
|
|
913
|
+
const day = today.getDay();
|
|
914
|
+
const diffToMonday = (day === 0 ? -6 : 1) - day;
|
|
915
|
+
const monday = new Date(today);
|
|
916
|
+
monday.setDate(today.getDate() + diffToMonday);
|
|
917
|
+
monday.setHours(0, 0, 0, 0);
|
|
918
|
+
const sunday = new Date(monday);
|
|
919
|
+
sunday.setDate(monday.getDate() + 6);
|
|
920
|
+
sunday.setHours(23, 59, 59, 999);
|
|
921
|
+
return { start: monday, end: sunday };
|
|
922
|
+
}
|
|
923
|
+
static getCurrentMonthRange() {
|
|
924
|
+
const now = /* @__PURE__ */ new Date();
|
|
925
|
+
const start = new Date(now.getFullYear(), now.getMonth(), 1);
|
|
926
|
+
const end = new Date(now.getFullYear(), now.getMonth() + 1, 0);
|
|
927
|
+
return { start, end };
|
|
928
|
+
}
|
|
929
|
+
static formatShortDate(date) {
|
|
930
|
+
const day = date.getDate();
|
|
931
|
+
const month = this.getMonthShortNameCustom(date.getMonth() + 1);
|
|
932
|
+
return `${day} ${month}`;
|
|
933
|
+
}
|
|
934
|
+
static formatIndianCurrencyShort(value) {
|
|
935
|
+
if (value >= 1e7) {
|
|
936
|
+
return `${(value / 1e7).toFixed(2)} Cr`;
|
|
937
|
+
} else if (value >= 1e5) {
|
|
938
|
+
return `${(value / 1e5).toFixed(2)} L`;
|
|
939
|
+
} else if (value >= 1e3) {
|
|
940
|
+
return `${(value / 1e3).toFixed(2)} K`;
|
|
941
|
+
} else {
|
|
942
|
+
return `${value}`;
|
|
943
|
+
}
|
|
944
|
+
}
|
|
945
|
+
};
|
|
946
|
+
var DateTimeUtility_default = DateTimeUtility;
|
|
947
|
+
|
|
948
|
+
// src/components/controls/edit/DateInput.tsx
|
|
949
|
+
import { jsx as jsx15, jsxs as jsxs15 } from "react/jsx-runtime";
|
|
950
|
+
var DateInput = (props) => {
|
|
951
|
+
const value = useMemo(() => {
|
|
952
|
+
if (props.value === void 0 || props.value === null || props.value === "") {
|
|
953
|
+
return "";
|
|
954
|
+
}
|
|
955
|
+
try {
|
|
956
|
+
const rawValue = String(props.value);
|
|
957
|
+
const utcDate = new Date(rawValue.endsWith("Z") ? rawValue : `${rawValue}Z`);
|
|
958
|
+
const localDate = new Date(
|
|
959
|
+
utcDate.getTime() - utcDate.getTimezoneOffset() * 6e4
|
|
960
|
+
);
|
|
961
|
+
return localDate.toISOString().slice(0, 10);
|
|
962
|
+
} catch {
|
|
963
|
+
return String(props.value);
|
|
964
|
+
}
|
|
965
|
+
}, [props.value]);
|
|
966
|
+
const changeHandler = (event) => {
|
|
967
|
+
const dateValue = event.target.value;
|
|
968
|
+
let callbackValue = dateValue;
|
|
969
|
+
const parsedDate = new Date(dateValue);
|
|
970
|
+
if (dateValue && !Number.isNaN(parsedDate.getTime())) {
|
|
971
|
+
const adjustedDate = new Date(
|
|
972
|
+
parsedDate.getTime() + 2 * parsedDate.getTimezoneOffset() * 6e4
|
|
973
|
+
);
|
|
974
|
+
callbackValue = DateTimeUtility_default.formatDate(adjustedDate);
|
|
975
|
+
}
|
|
976
|
+
props.callback?.({
|
|
977
|
+
name: props.name,
|
|
978
|
+
value: callbackValue,
|
|
979
|
+
index: props.index,
|
|
980
|
+
groupKey: props.groupKey
|
|
981
|
+
});
|
|
982
|
+
};
|
|
983
|
+
return /* @__PURE__ */ jsxs15("label", { className: "block mb-1", children: [
|
|
984
|
+
props.attributes?.label && /* @__PURE__ */ jsx15("span", { className: "text-sm font-medium", children: props.attributes.label }),
|
|
985
|
+
" ",
|
|
986
|
+
props.attributes?.label && props.attributes.required && /* @__PURE__ */ jsx15("span", { className: "bg-error-weak", children: "*" }),
|
|
987
|
+
/* @__PURE__ */ jsx15(
|
|
988
|
+
"input",
|
|
989
|
+
{
|
|
990
|
+
type: "date",
|
|
991
|
+
name: props.name,
|
|
992
|
+
id: props.name,
|
|
993
|
+
value,
|
|
994
|
+
onChange: changeHandler,
|
|
995
|
+
required: props.attributes?.required,
|
|
996
|
+
disabled: props.attributes?.readOnly,
|
|
997
|
+
max: String(props.attributes?.maxValue ?? "9999-12-31"),
|
|
998
|
+
className: `peer input mt-1 py-1.5 block w-full rounded shadow-sm ${props.inputClasses ?? ""}`
|
|
999
|
+
}
|
|
1000
|
+
),
|
|
1001
|
+
/* @__PURE__ */ jsx15("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props.attributes?.errorMessage ?? "" })
|
|
1002
|
+
] });
|
|
1003
|
+
};
|
|
1004
|
+
var DateInput_default = DateInput;
|
|
1005
|
+
|
|
1006
|
+
// src/components/controls/edit/RadioInput.tsx
|
|
1007
|
+
import { useEffect as useEffect4, useState as useState3 } from "react";
|
|
1008
|
+
import { jsx as jsx16, jsxs as jsxs16 } from "react/jsx-runtime";
|
|
1009
|
+
var RadioInput = (props) => {
|
|
1010
|
+
const [list, setList] = useState3([]);
|
|
1011
|
+
useEffect4(() => {
|
|
1012
|
+
async function loadData() {
|
|
1013
|
+
if (props.dataset) {
|
|
1014
|
+
setList(props.dataset);
|
|
1015
|
+
return;
|
|
1016
|
+
}
|
|
1017
|
+
if (!props.dataSource || !props.serviceClient) {
|
|
1018
|
+
setList([]);
|
|
1019
|
+
return;
|
|
1020
|
+
}
|
|
1021
|
+
let dataSource = props.dataSource;
|
|
1022
|
+
if (props.dataSourceDependsOn) {
|
|
1023
|
+
if (!props.dependentValue) {
|
|
1024
|
+
setList([]);
|
|
1025
|
+
return;
|
|
1026
|
+
}
|
|
1027
|
+
dataSource = dataSource.replace(
|
|
1028
|
+
`{${props.dataSourceDependsOn}}`,
|
|
1029
|
+
props.dependentValue
|
|
1030
|
+
);
|
|
1031
|
+
}
|
|
1032
|
+
const response = await props.serviceClient.get(dataSource);
|
|
1033
|
+
setList(response.result ?? []);
|
|
1034
|
+
}
|
|
1035
|
+
loadData();
|
|
1036
|
+
}, [
|
|
1037
|
+
props.dataSource,
|
|
1038
|
+
props.dataSourceDependsOn,
|
|
1039
|
+
props.dataset,
|
|
1040
|
+
props.dependentValue,
|
|
1041
|
+
props.serviceClient
|
|
1042
|
+
]);
|
|
1043
|
+
const changeHandler = (event) => {
|
|
1044
|
+
if (!props.attributes?.readOnly) {
|
|
1045
|
+
props.callback?.({
|
|
1046
|
+
name: props.name,
|
|
1047
|
+
value: event.target.value,
|
|
1048
|
+
index: props.index,
|
|
1049
|
+
groupKey: props.groupKey
|
|
1050
|
+
});
|
|
1051
|
+
}
|
|
1052
|
+
};
|
|
1053
|
+
return /* @__PURE__ */ jsxs16("div", { className: "block", children: [
|
|
1054
|
+
/* @__PURE__ */ jsx16("span", { className: "text-sm font-medium", children: props.attributes?.label }),
|
|
1055
|
+
/* @__PURE__ */ jsx16("div", { className: "flex flex-col gap-3", children: list.map((item, index) => {
|
|
1056
|
+
const itemValue = item[props.dataKeyFieldName];
|
|
1057
|
+
const isSelected = String(itemValue) === String(props.value ?? "");
|
|
1058
|
+
const isRecommended = props.dataRecommendedValue !== void 0 && String(itemValue) === String(props.dataRecommendedValue);
|
|
1059
|
+
const resultClassName = isSelected ? isRecommended ? "bg-success" : props.dataRecommendedValue ? "bg-alert" : "border-transparent" : "border-transparent";
|
|
1060
|
+
const iconName = isSelected && props.dataRecommendedValue ? isRecommended ? "checkCircle" : "xCircle" : void 0;
|
|
1061
|
+
const inputId = `${props.name}-${props.index ?? 0}-id-${index}`;
|
|
1062
|
+
return /* @__PURE__ */ jsxs16(
|
|
1063
|
+
"div",
|
|
1064
|
+
{
|
|
1065
|
+
className: `font-normal flex items-center justify-between gap-4 cursor-pointer border rounded p-2 ${resultClassName}`,
|
|
1066
|
+
children: [
|
|
1067
|
+
/* @__PURE__ */ jsxs16("div", { className: "flex gap-4 items-start", children: [
|
|
1068
|
+
/* @__PURE__ */ jsx16(
|
|
1069
|
+
"input",
|
|
1070
|
+
{
|
|
1071
|
+
type: "radio",
|
|
1072
|
+
className: "form-radio mt-1.5 focus:outline-none",
|
|
1073
|
+
name: `${props.name}-${props.index ?? 0}`,
|
|
1074
|
+
id: inputId,
|
|
1075
|
+
value: itemValue,
|
|
1076
|
+
checked: isSelected,
|
|
1077
|
+
readOnly: props.attributes?.readOnly,
|
|
1078
|
+
onChange: changeHandler,
|
|
1079
|
+
required: props.attributes?.required
|
|
1080
|
+
}
|
|
1081
|
+
),
|
|
1082
|
+
/* @__PURE__ */ jsx16("label", { className: "text-body-950 pr-2", htmlFor: inputId, children: item[props.dataTextFieldName] })
|
|
1083
|
+
] }),
|
|
1084
|
+
iconName && /* @__PURE__ */ jsx16(Icon_default, { className: "w-5 h-5 text-success", name: iconName })
|
|
1085
|
+
]
|
|
1086
|
+
},
|
|
1087
|
+
String(itemValue)
|
|
1088
|
+
);
|
|
1089
|
+
}) }),
|
|
1090
|
+
/* @__PURE__ */ jsx16("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props.attributes?.errorMessage ?? "" })
|
|
1091
|
+
] });
|
|
1092
|
+
};
|
|
1093
|
+
var RadioInput_default = RadioInput;
|
|
1094
|
+
|
|
1095
|
+
// src/components/controls/edit/Switcher.tsx
|
|
1096
|
+
import { useEffect as useEffect5, useState as useState4 } from "react";
|
|
1097
|
+
import { jsx as jsx17, jsxs as jsxs17 } from "react/jsx-runtime";
|
|
1098
|
+
var Switcher = (props) => {
|
|
1099
|
+
const [list, setList] = useState4([]);
|
|
1100
|
+
useEffect5(() => {
|
|
1101
|
+
async function loadData() {
|
|
1102
|
+
if (props.dataset) {
|
|
1103
|
+
setList(props.dataset);
|
|
1104
|
+
return;
|
|
1105
|
+
}
|
|
1106
|
+
if (!props.dataSource || !props.serviceClient) {
|
|
1107
|
+
setList([]);
|
|
1108
|
+
return;
|
|
1109
|
+
}
|
|
1110
|
+
let dataSource = props.dataSource;
|
|
1111
|
+
if (props.dataSourceDependsOn) {
|
|
1112
|
+
if (!props.dependentValue) {
|
|
1113
|
+
setList([]);
|
|
1114
|
+
return;
|
|
1115
|
+
}
|
|
1116
|
+
dataSource = dataSource.replace(
|
|
1117
|
+
`{${props.dataSourceDependsOn}}`,
|
|
1118
|
+
props.dependentValue
|
|
1119
|
+
);
|
|
1120
|
+
}
|
|
1121
|
+
const response = await props.serviceClient.get(dataSource);
|
|
1122
|
+
setList(response.result ?? []);
|
|
1123
|
+
}
|
|
1124
|
+
loadData();
|
|
1125
|
+
}, [
|
|
1126
|
+
props.dataSource,
|
|
1127
|
+
props.dataSourceDependsOn,
|
|
1128
|
+
props.dataset,
|
|
1129
|
+
props.dependentValue,
|
|
1130
|
+
props.serviceClient
|
|
1131
|
+
]);
|
|
1132
|
+
const changeHandler = (event) => {
|
|
1133
|
+
props.callback?.({
|
|
1134
|
+
name: props.name,
|
|
1135
|
+
value: event.target.value,
|
|
1136
|
+
index: props.index,
|
|
1137
|
+
groupKey: props.groupKey
|
|
1138
|
+
});
|
|
1139
|
+
};
|
|
1140
|
+
const value = props.value === void 0 || props.value === null ? "" : String(props.value);
|
|
1141
|
+
return /* @__PURE__ */ jsxs17("label", { className: "block mb-1", children: [
|
|
1142
|
+
/* @__PURE__ */ jsx17("span", { className: "text-sm font-medium", children: props.attributes?.label }),
|
|
1143
|
+
list.length === 0 ? /* @__PURE__ */ jsx17(
|
|
1144
|
+
"input",
|
|
1145
|
+
{
|
|
1146
|
+
type: "text",
|
|
1147
|
+
name: props.name,
|
|
1148
|
+
id: props.name,
|
|
1149
|
+
value,
|
|
1150
|
+
onChange: changeHandler,
|
|
1151
|
+
required: props.attributes?.required,
|
|
1152
|
+
placeholder: props.attributes?.placeholder,
|
|
1153
|
+
disabled: props.attributes?.readOnly,
|
|
1154
|
+
className: `peer input mt-1 py-1.5 block w-full rounded shadow-sm ${props.inputClasses ?? ""}`
|
|
1155
|
+
}
|
|
1156
|
+
) : /* @__PURE__ */ jsxs17(
|
|
1157
|
+
"select",
|
|
1158
|
+
{
|
|
1159
|
+
name: props.name,
|
|
1160
|
+
id: props.name,
|
|
1161
|
+
value,
|
|
1162
|
+
onChange: changeHandler,
|
|
1163
|
+
required: props.attributes?.required,
|
|
1164
|
+
disabled: props.attributes?.readOnly,
|
|
1165
|
+
className: `peer select my-1 py-1 block w-full rounded shadow-sm ${props.inputClasses ?? ""}`,
|
|
1166
|
+
children: [
|
|
1167
|
+
/* @__PURE__ */ jsx17("option", { value: "", children: props.attributes?.placeholder || "Select" }),
|
|
1168
|
+
list.map((item) => /* @__PURE__ */ jsx17(
|
|
1169
|
+
"option",
|
|
1170
|
+
{
|
|
1171
|
+
value: item[props.dataKeyFieldName],
|
|
1172
|
+
children: item[props.dataTextFieldName]
|
|
1173
|
+
},
|
|
1174
|
+
String(item[props.dataKeyFieldName])
|
|
1175
|
+
))
|
|
1176
|
+
]
|
|
1177
|
+
}
|
|
1178
|
+
),
|
|
1179
|
+
/* @__PURE__ */ jsx17("p", { className: "hidden group-[.validated]:peer-invalid:block mt-1 bg-error-weak text-sm", children: props.attributes?.errorMessage ?? "" })
|
|
1180
|
+
] });
|
|
1181
|
+
};
|
|
1182
|
+
var Switcher_default = Switcher;
|
|
1183
|
+
|
|
866
1184
|
// src/components/utilities/AssetUtility.tsx
|
|
867
1185
|
var AssetUtility = class {
|
|
868
1186
|
constructor() {
|
|
@@ -899,5 +1217,8 @@ export {
|
|
|
899
1217
|
SelectWithSearchInput_default,
|
|
900
1218
|
BooleanSelect_default,
|
|
901
1219
|
EmailInput_default,
|
|
902
|
-
TimeInput_default
|
|
1220
|
+
TimeInput_default,
|
|
1221
|
+
DateInput_default,
|
|
1222
|
+
RadioInput_default,
|
|
1223
|
+
Switcher_default
|
|
903
1224
|
};
|
package/dist/index.d.mts
CHANGED
|
@@ -52,6 +52,7 @@ declare const InputControlType: {
|
|
|
52
52
|
select: string;
|
|
53
53
|
percentageInput: string;
|
|
54
54
|
asset: string;
|
|
55
|
+
assetUpload: string;
|
|
55
56
|
phoneInput: string;
|
|
56
57
|
numberInput: string;
|
|
57
58
|
checkboxInput: string;
|
|
@@ -63,6 +64,9 @@ declare const InputControlType: {
|
|
|
63
64
|
selectWithSearchPanel: string;
|
|
64
65
|
booleanSelect: string;
|
|
65
66
|
switchInput: string;
|
|
67
|
+
dateInput: string;
|
|
68
|
+
radioInput: string;
|
|
69
|
+
switcher: string;
|
|
66
70
|
videoInput: string;
|
|
67
71
|
};
|
|
68
72
|
|
|
@@ -128,6 +132,7 @@ interface InputControlProps {
|
|
|
128
132
|
dataKeyFieldName?: string;
|
|
129
133
|
dataTextFieldName?: string;
|
|
130
134
|
dataset?: any[];
|
|
135
|
+
dataRecommendedValue?: string;
|
|
131
136
|
assetsUploadPath?: string;
|
|
132
137
|
entityType?: string;
|
|
133
138
|
showAsLink?: boolean;
|
|
@@ -143,7 +148,7 @@ interface InputControlProps {
|
|
|
143
148
|
pattern?: string;
|
|
144
149
|
maxLength?: number;
|
|
145
150
|
minLength?: number;
|
|
146
|
-
maxValue?: number;
|
|
151
|
+
maxValue?: number | string;
|
|
147
152
|
minValue?: number;
|
|
148
153
|
readOnly?: boolean;
|
|
149
154
|
disable?: boolean;
|
|
@@ -256,6 +261,12 @@ declare const EmailInput: React__default.FC<InputControlProps>;
|
|
|
256
261
|
|
|
257
262
|
declare const TimeInput: React__default.FC<InputControlProps>;
|
|
258
263
|
|
|
264
|
+
declare const DateInput: React__default.FC<InputControlProps>;
|
|
265
|
+
|
|
266
|
+
declare const RadioInput: React__default.FC<InputControlProps>;
|
|
267
|
+
|
|
268
|
+
declare const Switcher: React__default.FC<InputControlProps>;
|
|
269
|
+
|
|
259
270
|
interface TabItem {
|
|
260
271
|
tabTitle: string;
|
|
261
272
|
displayOrder: number;
|
|
@@ -453,4 +464,4 @@ interface DataFormRendererProps {
|
|
|
453
464
|
}
|
|
454
465
|
declare const DataFormRenderer: ({ formDefinition, dataItem, params, tabs, apiBaseUrl, session, widgetProps, onSave, onDelete, onCancelAdd, isAddPage, entityId, }: DataFormRendererProps) => React.JSX.Element | null;
|
|
455
466
|
|
|
456
|
-
export { type ActionResponse$1 as ActionResponse, BooleanSelect, Button, CheckboxInput, ColorInput, DataFormRenderer, DataList, DataListRenderer, DateTimeInput, EmailInput, EnterAnimationHydrator, InputControl, type InputControlProps, InputControlType, LineTextInput, MoneyInput, MultilineTextInput, NavigationTabsV2, NumberInput, OtpInput, PageBodyRenderer, PercentageInput, PhoneInput, StyleTypes, TimeInput, Toast, ToastService, ViewControl, type ViewControlProps, ViewControlTypes };
|
|
467
|
+
export { type ActionResponse$1 as ActionResponse, BooleanSelect, Button, CheckboxInput, ColorInput, DataFormRenderer, DataList, DataListRenderer, DateInput, DateTimeInput, EmailInput, EnterAnimationHydrator, InputControl, type InputControlProps, InputControlType, LineTextInput, MoneyInput, MultilineTextInput, NavigationTabsV2, NumberInput, OtpInput, PageBodyRenderer, PercentageInput, PhoneInput, RadioInput, StyleTypes, Switcher, TimeInput, Toast, ToastService, ViewControl, type ViewControlProps, ViewControlTypes };
|
package/dist/index.d.ts
CHANGED
|
@@ -52,6 +52,7 @@ declare const InputControlType: {
|
|
|
52
52
|
select: string;
|
|
53
53
|
percentageInput: string;
|
|
54
54
|
asset: string;
|
|
55
|
+
assetUpload: string;
|
|
55
56
|
phoneInput: string;
|
|
56
57
|
numberInput: string;
|
|
57
58
|
checkboxInput: string;
|
|
@@ -63,6 +64,9 @@ declare const InputControlType: {
|
|
|
63
64
|
selectWithSearchPanel: string;
|
|
64
65
|
booleanSelect: string;
|
|
65
66
|
switchInput: string;
|
|
67
|
+
dateInput: string;
|
|
68
|
+
radioInput: string;
|
|
69
|
+
switcher: string;
|
|
66
70
|
videoInput: string;
|
|
67
71
|
};
|
|
68
72
|
|
|
@@ -128,6 +132,7 @@ interface InputControlProps {
|
|
|
128
132
|
dataKeyFieldName?: string;
|
|
129
133
|
dataTextFieldName?: string;
|
|
130
134
|
dataset?: any[];
|
|
135
|
+
dataRecommendedValue?: string;
|
|
131
136
|
assetsUploadPath?: string;
|
|
132
137
|
entityType?: string;
|
|
133
138
|
showAsLink?: boolean;
|
|
@@ -143,7 +148,7 @@ interface InputControlProps {
|
|
|
143
148
|
pattern?: string;
|
|
144
149
|
maxLength?: number;
|
|
145
150
|
minLength?: number;
|
|
146
|
-
maxValue?: number;
|
|
151
|
+
maxValue?: number | string;
|
|
147
152
|
minValue?: number;
|
|
148
153
|
readOnly?: boolean;
|
|
149
154
|
disable?: boolean;
|
|
@@ -256,6 +261,12 @@ declare const EmailInput: React__default.FC<InputControlProps>;
|
|
|
256
261
|
|
|
257
262
|
declare const TimeInput: React__default.FC<InputControlProps>;
|
|
258
263
|
|
|
264
|
+
declare const DateInput: React__default.FC<InputControlProps>;
|
|
265
|
+
|
|
266
|
+
declare const RadioInput: React__default.FC<InputControlProps>;
|
|
267
|
+
|
|
268
|
+
declare const Switcher: React__default.FC<InputControlProps>;
|
|
269
|
+
|
|
259
270
|
interface TabItem {
|
|
260
271
|
tabTitle: string;
|
|
261
272
|
displayOrder: number;
|
|
@@ -453,4 +464,4 @@ interface DataFormRendererProps {
|
|
|
453
464
|
}
|
|
454
465
|
declare const DataFormRenderer: ({ formDefinition, dataItem, params, tabs, apiBaseUrl, session, widgetProps, onSave, onDelete, onCancelAdd, isAddPage, entityId, }: DataFormRendererProps) => React.JSX.Element | null;
|
|
455
466
|
|
|
456
|
-
export { type ActionResponse$1 as ActionResponse, BooleanSelect, Button, CheckboxInput, ColorInput, DataFormRenderer, DataList, DataListRenderer, DateTimeInput, EmailInput, EnterAnimationHydrator, InputControl, type InputControlProps, InputControlType, LineTextInput, MoneyInput, MultilineTextInput, NavigationTabsV2, NumberInput, OtpInput, PageBodyRenderer, PercentageInput, PhoneInput, StyleTypes, TimeInput, Toast, ToastService, ViewControl, type ViewControlProps, ViewControlTypes };
|
|
467
|
+
export { type ActionResponse$1 as ActionResponse, BooleanSelect, Button, CheckboxInput, ColorInput, DataFormRenderer, DataList, DataListRenderer, DateInput, DateTimeInput, EmailInput, EnterAnimationHydrator, InputControl, type InputControlProps, InputControlType, LineTextInput, MoneyInput, MultilineTextInput, NavigationTabsV2, NumberInput, OtpInput, PageBodyRenderer, PercentageInput, PhoneInput, RadioInput, StyleTypes, Switcher, TimeInput, Toast, ToastService, ViewControl, type ViewControlProps, ViewControlTypes };
|