shadcn-zod-formkit 3.9.3 → 3.9.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.cjs +337 -212
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.mts +28 -27
- package/dist/index.d.ts +28 -27
- package/dist/index.mjs +338 -212
- package/dist/index.mjs.map +1 -1
- package/dist/shadcn-zod-formkit-3.9.4.tgz +0 -0
- package/package.json +1 -1
- package/dist/shadcn-zod-formkit-3.9.3.tgz +0 -0
package/dist/index.cjs
CHANGED
|
@@ -7005,7 +7005,7 @@ var require_leaflet_src = __commonJS({
|
|
|
7005
7005
|
}
|
|
7006
7006
|
}
|
|
7007
7007
|
});
|
|
7008
|
-
var
|
|
7008
|
+
var Tooltip3 = DivOverlay.extend({
|
|
7009
7009
|
// @section
|
|
7010
7010
|
// @aka Tooltip options
|
|
7011
7011
|
options: {
|
|
@@ -7118,7 +7118,7 @@ var require_leaflet_src = __commonJS({
|
|
|
7118
7118
|
}
|
|
7119
7119
|
});
|
|
7120
7120
|
var tooltip = function(options, source) {
|
|
7121
|
-
return new
|
|
7121
|
+
return new Tooltip3(options, source);
|
|
7122
7122
|
};
|
|
7123
7123
|
Map2.include({
|
|
7124
7124
|
// @method openTooltip(tooltip: Tooltip): this
|
|
@@ -7127,7 +7127,7 @@ var require_leaflet_src = __commonJS({
|
|
|
7127
7127
|
// @method openTooltip(content: String|HTMLElement, latlng: LatLng, options?: Tooltip options): this
|
|
7128
7128
|
// Creates a tooltip with the specified content and options and open it.
|
|
7129
7129
|
openTooltip: function(tooltip2, latlng, options) {
|
|
7130
|
-
this._initOverlay(
|
|
7130
|
+
this._initOverlay(Tooltip3, tooltip2, latlng, options).openOn(this);
|
|
7131
7131
|
return this;
|
|
7132
7132
|
},
|
|
7133
7133
|
// @method closeTooltip(tooltip: Tooltip): this
|
|
@@ -7146,7 +7146,7 @@ var require_leaflet_src = __commonJS({
|
|
|
7146
7146
|
if (this._tooltip && this.isTooltipOpen()) {
|
|
7147
7147
|
this.unbindTooltip();
|
|
7148
7148
|
}
|
|
7149
|
-
this._tooltip = this._initOverlay(
|
|
7149
|
+
this._tooltip = this._initOverlay(Tooltip3, this._tooltip, content, options);
|
|
7150
7150
|
this._initTooltipInteractions();
|
|
7151
7151
|
if (this._tooltip.options.permanent && this._map && this._map.hasLayer(this)) {
|
|
7152
7152
|
this.openTooltip();
|
|
@@ -9610,7 +9610,7 @@ var require_leaflet_src = __commonJS({
|
|
|
9610
9610
|
exports2.SVG = SVG;
|
|
9611
9611
|
exports2.SVGOverlay = SVGOverlay;
|
|
9612
9612
|
exports2.TileLayer = TileLayer;
|
|
9613
|
-
exports2.Tooltip =
|
|
9613
|
+
exports2.Tooltip = Tooltip3;
|
|
9614
9614
|
exports2.Transformation = Transformation;
|
|
9615
9615
|
exports2.Util = Util;
|
|
9616
9616
|
exports2.VideoOverlay = VideoOverlay;
|
|
@@ -12672,6 +12672,77 @@ var KeyboardBuilder = ({
|
|
|
12672
12672
|
return /* @__PURE__ */ jsxRuntime.jsx("div", { className: cn("w-full h-full m-0.5 p-1", className), children: content });
|
|
12673
12673
|
};
|
|
12674
12674
|
|
|
12675
|
+
// src/components/custom/form/inputs/base/style-field-base.ts
|
|
12676
|
+
var sizeClasses = {
|
|
12677
|
+
sm: "px-3 py-2 text-xl",
|
|
12678
|
+
md: "px-4 py-3 text-3xl",
|
|
12679
|
+
lg: "px-5 py-4 text-4xl"
|
|
12680
|
+
};
|
|
12681
|
+
var activeColorClasses = {
|
|
12682
|
+
amber: "border-amber-400 bg-amber-400/10",
|
|
12683
|
+
blue: "border-blue-400 bg-blue-400/10",
|
|
12684
|
+
green: "border-green-400 bg-green-400/10",
|
|
12685
|
+
red: "border-red-400 bg-red-400/10",
|
|
12686
|
+
purple: "border-purple-400 bg-purple-400/10"
|
|
12687
|
+
};
|
|
12688
|
+
|
|
12689
|
+
// src/components/custom/form/inputs/base/base-input.ts
|
|
12690
|
+
var BaseInput = class {
|
|
12691
|
+
constructor(input, form, isSubmitting) {
|
|
12692
|
+
this.input = input;
|
|
12693
|
+
this.form = form;
|
|
12694
|
+
this.isSubmitting = isSubmitting;
|
|
12695
|
+
}
|
|
12696
|
+
};
|
|
12697
|
+
var entityToInputOption = (entitiy, name = "name", description = "description", groupedLabel, optionLabel = "label") => ({
|
|
12698
|
+
id: entitiy["id"],
|
|
12699
|
+
name: entitiy[name],
|
|
12700
|
+
label: entitiy[optionLabel],
|
|
12701
|
+
description: entitiy[description],
|
|
12702
|
+
groupedLabel
|
|
12703
|
+
});
|
|
12704
|
+
var entitiesToInputOption = (data, optionValue = "name", groupedLabel, optionLabel = "description") => {
|
|
12705
|
+
const entities = [];
|
|
12706
|
+
for (const key of data) {
|
|
12707
|
+
const entidad = entityToInputOption(key, optionValue, optionLabel, groupedLabel);
|
|
12708
|
+
if (entidad) entities.push(entidad);
|
|
12709
|
+
}
|
|
12710
|
+
return entities;
|
|
12711
|
+
};
|
|
12712
|
+
var entityToGroupedOption = (entitiy, name = "name") => ({
|
|
12713
|
+
id: entitiy["id"],
|
|
12714
|
+
label: entitiy[name] || entitiy["label"],
|
|
12715
|
+
options: entitiy["options"] || [],
|
|
12716
|
+
selectedOptions: []
|
|
12717
|
+
});
|
|
12718
|
+
var entitiesToGroupedOption = (data, optionValue = "name") => {
|
|
12719
|
+
const entities = [];
|
|
12720
|
+
for (const key of data) {
|
|
12721
|
+
const entidad = entityToGroupedOption(key, optionValue);
|
|
12722
|
+
if (entidad) entities.push(entidad);
|
|
12723
|
+
}
|
|
12724
|
+
return entities;
|
|
12725
|
+
};
|
|
12726
|
+
var handleOnChage = (event, input, field) => {
|
|
12727
|
+
let value = event;
|
|
12728
|
+
if (event && typeof event === "object" && "target" in event) {
|
|
12729
|
+
value = event.target.value;
|
|
12730
|
+
}
|
|
12731
|
+
field?.onChange(value);
|
|
12732
|
+
const data = input.form?.getValues();
|
|
12733
|
+
input.onChange?.(value, data);
|
|
12734
|
+
input.onAnyFieldChange?.(data);
|
|
12735
|
+
};
|
|
12736
|
+
var isValidField = (input, form, defaultValue) => {
|
|
12737
|
+
const value = defaultValue ?? form.getValues(input.name);
|
|
12738
|
+
const fieldState = form.getFieldState(input.name);
|
|
12739
|
+
if (input.zodType) {
|
|
12740
|
+
const result = input.zodType.safeParse(value);
|
|
12741
|
+
return result.success;
|
|
12742
|
+
}
|
|
12743
|
+
return !fieldState.error && value !== void 0 && value !== "";
|
|
12744
|
+
};
|
|
12745
|
+
|
|
12675
12746
|
// src/components/custom/form/inputs/base/definitions.ts
|
|
12676
12747
|
var flattenFields = (fields, onAnyFieldChange) => {
|
|
12677
12748
|
const result = [];
|
|
@@ -12695,6 +12766,234 @@ var TextInputType = /* @__PURE__ */ ((TextInputType3) => {
|
|
|
12695
12766
|
TextInputType3["PASSWORD"] = "password";
|
|
12696
12767
|
return TextInputType3;
|
|
12697
12768
|
})(TextInputType || {});
|
|
12769
|
+
var flattenFields2 = (fields) => {
|
|
12770
|
+
const result = [];
|
|
12771
|
+
for (const field of fields) {
|
|
12772
|
+
if (Array.isArray(field)) {
|
|
12773
|
+
result.push(...flattenFields2(field));
|
|
12774
|
+
} else if (field.fields) {
|
|
12775
|
+
result.push(...flattenFields2(field.fields));
|
|
12776
|
+
} else {
|
|
12777
|
+
result.push(field);
|
|
12778
|
+
}
|
|
12779
|
+
}
|
|
12780
|
+
return result;
|
|
12781
|
+
};
|
|
12782
|
+
var FormErrorsAlert = ({
|
|
12783
|
+
formState,
|
|
12784
|
+
fields
|
|
12785
|
+
}) => {
|
|
12786
|
+
const flatFields = flattenFields2(fields);
|
|
12787
|
+
const hasErrors = Object.keys(formState.errors).length > 0;
|
|
12788
|
+
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginTop: 4 }, children: hasErrors && /* @__PURE__ */ jsxRuntime.jsx(
|
|
12789
|
+
CustomAlert,
|
|
12790
|
+
{
|
|
12791
|
+
title: "Revisar los siguientes criterios",
|
|
12792
|
+
description: /* @__PURE__ */ jsxRuntime.jsx("ul", { children: Object.entries(formState.errors).map(([key, value]) => /* @__PURE__ */ jsxRuntime.jsxs("li", { children: [
|
|
12793
|
+
/* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
|
|
12794
|
+
getFieldLabel(key, flatFields),
|
|
12795
|
+
":"
|
|
12796
|
+
] }),
|
|
12797
|
+
" ",
|
|
12798
|
+
value?.message?.toString() ?? ""
|
|
12799
|
+
] }, key)) }),
|
|
12800
|
+
className: "mb-4",
|
|
12801
|
+
variant: "error"
|
|
12802
|
+
}
|
|
12803
|
+
) });
|
|
12804
|
+
};
|
|
12805
|
+
var getFieldLabel = (fieldErrorKey, fields) => {
|
|
12806
|
+
const foundField = fields.find((field) => field.name === fieldErrorKey);
|
|
12807
|
+
return foundField?.label ?? fieldErrorKey;
|
|
12808
|
+
};
|
|
12809
|
+
|
|
12810
|
+
// src/components/custom/form/inputs/base/input-types.ts
|
|
12811
|
+
var InputTypes = /* @__PURE__ */ ((InputTypes3) => {
|
|
12812
|
+
InputTypes3["HIDDEN"] = "hidden";
|
|
12813
|
+
InputTypes3["TEXT"] = "text";
|
|
12814
|
+
InputTypes3["TEXT_GROUP"] = "text_group";
|
|
12815
|
+
InputTypes3["NUMBER"] = "number";
|
|
12816
|
+
InputTypes3["SWITCH"] = "switch";
|
|
12817
|
+
InputTypes3["CHECKBOX"] = "checkbox";
|
|
12818
|
+
InputTypes3["SELECT"] = "select";
|
|
12819
|
+
InputTypes3["SIMPLE_CHECK_LIST"] = "siple_checklist";
|
|
12820
|
+
InputTypes3["CHECK_LIST"] = "checklist";
|
|
12821
|
+
InputTypes3["GROUPED_SWITCH_LIST"] = "grouped_switchlist";
|
|
12822
|
+
InputTypes3["ACCORDION_GROUPED_SWITCH_LIST"] = "accordion_grouped_switchlist";
|
|
12823
|
+
InputTypes3["DATE"] = "date";
|
|
12824
|
+
InputTypes3["TEXTAREA"] = "textarea";
|
|
12825
|
+
InputTypes3["FILE"] = "file";
|
|
12826
|
+
InputTypes3["OTP"] = "otp";
|
|
12827
|
+
InputTypes3["FORM"] = "form";
|
|
12828
|
+
InputTypes3["COLOR"] = "color";
|
|
12829
|
+
InputTypes3["RADIO_GROUP"] = "radio_group";
|
|
12830
|
+
InputTypes3["TAGS"] = "tags";
|
|
12831
|
+
InputTypes3["DATE_TIME"] = "date_time";
|
|
12832
|
+
InputTypes3["TIME"] = "time";
|
|
12833
|
+
InputTypes3["FILE_MULTI_UPLOAD"] = "file_multi_upload";
|
|
12834
|
+
InputTypes3["SLIDER"] = "slider";
|
|
12835
|
+
InputTypes3["BUTTON_GROUP"] = "button_group";
|
|
12836
|
+
InputTypes3["CURRENCY"] = "currency";
|
|
12837
|
+
InputTypes3["KEY_VALUE"] = "key_value";
|
|
12838
|
+
InputTypes3["REPEATER"] = "repeater";
|
|
12839
|
+
InputTypes3["MULTI_SELECT"] = "multi_select";
|
|
12840
|
+
InputTypes3["COMBOBOX"] = "COMBO_BOX";
|
|
12841
|
+
InputTypes3["SORTABLE_LIST"] = "sortable_list";
|
|
12842
|
+
InputTypes3["REPEATER_TABS"] = "repeater_tabs";
|
|
12843
|
+
InputTypes3["STRING_LIST"] = "string_list";
|
|
12844
|
+
InputTypes3["RATING"] = "rating";
|
|
12845
|
+
InputTypes3["PHONE"] = "phone";
|
|
12846
|
+
InputTypes3["URL"] = "url";
|
|
12847
|
+
InputTypes3["PASSWORD"] = "password";
|
|
12848
|
+
InputTypes3["AUTOCOMPLETE"] = "autocomplete";
|
|
12849
|
+
InputTypes3["EMAIL"] = "email";
|
|
12850
|
+
InputTypes3["SEARCH"] = "search";
|
|
12851
|
+
InputTypes3["LOCATION_PICKER"] = "location_picker";
|
|
12852
|
+
InputTypes3["DATE_RANGE"] = "date_range";
|
|
12853
|
+
InputTypes3["COUNTRY_SELECT"] = "country_select";
|
|
12854
|
+
InputTypes3["RANGE"] = "range";
|
|
12855
|
+
InputTypes3["FILE_UPLOAD"] = "file_upload";
|
|
12856
|
+
return InputTypes3;
|
|
12857
|
+
})(InputTypes || {});
|
|
12858
|
+
var inputFieldComp = [
|
|
12859
|
+
"string_list" /* STRING_LIST */,
|
|
12860
|
+
"repeater_tabs" /* REPEATER_TABS */,
|
|
12861
|
+
"sortable_list" /* SORTABLE_LIST */,
|
|
12862
|
+
"COMBO_BOX" /* COMBOBOX */,
|
|
12863
|
+
"multi_select" /* MULTI_SELECT */,
|
|
12864
|
+
"repeater" /* REPEATER */,
|
|
12865
|
+
"key_value" /* KEY_VALUE */,
|
|
12866
|
+
"currency" /* CURRENCY */,
|
|
12867
|
+
"button_group" /* BUTTON_GROUP */,
|
|
12868
|
+
"slider" /* SLIDER */,
|
|
12869
|
+
"file_multi_upload" /* FILE_MULTI_UPLOAD */,
|
|
12870
|
+
"time" /* TIME */,
|
|
12871
|
+
"date_time" /* DATE_TIME */,
|
|
12872
|
+
"tags" /* TAGS */,
|
|
12873
|
+
"radio_group" /* RADIO_GROUP */,
|
|
12874
|
+
"text_group" /* TEXT_GROUP */,
|
|
12875
|
+
"accordion_grouped_switchlist" /* ACCORDION_GROUPED_SWITCH_LIST */,
|
|
12876
|
+
"grouped_switchlist" /* GROUPED_SWITCH_LIST */,
|
|
12877
|
+
"text" /* TEXT */,
|
|
12878
|
+
"switch" /* SWITCH */,
|
|
12879
|
+
"siple_checklist" /* SIMPLE_CHECK_LIST */,
|
|
12880
|
+
"checkbox" /* CHECKBOX */,
|
|
12881
|
+
"color" /* COLOR */,
|
|
12882
|
+
"otp" /* OTP */,
|
|
12883
|
+
"select" /* SELECT */,
|
|
12884
|
+
"date" /* DATE */,
|
|
12885
|
+
"file" /* FILE */,
|
|
12886
|
+
"form" /* FORM */,
|
|
12887
|
+
"number" /* NUMBER */,
|
|
12888
|
+
"textarea" /* TEXTAREA */,
|
|
12889
|
+
// InputTypes.SWITCH_LIST,
|
|
12890
|
+
"hidden" /* HIDDEN */,
|
|
12891
|
+
// ✨ New input types (v1.35.0)
|
|
12892
|
+
"rating" /* RATING */,
|
|
12893
|
+
"phone" /* PHONE */,
|
|
12894
|
+
"url" /* URL */,
|
|
12895
|
+
"password" /* PASSWORD */,
|
|
12896
|
+
"autocomplete" /* AUTOCOMPLETE */,
|
|
12897
|
+
// ✨ New input types (v1.36.0)
|
|
12898
|
+
"email" /* EMAIL */,
|
|
12899
|
+
"search" /* SEARCH */,
|
|
12900
|
+
"location_picker" /* LOCATION_PICKER */,
|
|
12901
|
+
"date_range" /* DATE_RANGE */,
|
|
12902
|
+
"country_select" /* COUNTRY_SELECT */,
|
|
12903
|
+
"range" /* RANGE */,
|
|
12904
|
+
// ✨ New input types (v1.37.0)
|
|
12905
|
+
"file_upload" /* FILE_UPLOAD */
|
|
12906
|
+
];
|
|
12907
|
+
var TextField = ({
|
|
12908
|
+
name,
|
|
12909
|
+
value,
|
|
12910
|
+
isActive = false,
|
|
12911
|
+
onFocus,
|
|
12912
|
+
onKeyPress,
|
|
12913
|
+
onDelete,
|
|
12914
|
+
onSpace,
|
|
12915
|
+
infoTooltip,
|
|
12916
|
+
textLeft,
|
|
12917
|
+
textRight,
|
|
12918
|
+
iconsLeft = [],
|
|
12919
|
+
iconsRight = [],
|
|
12920
|
+
size = "md",
|
|
12921
|
+
disabled = false,
|
|
12922
|
+
hidden = false,
|
|
12923
|
+
prefix,
|
|
12924
|
+
suffix,
|
|
12925
|
+
placeholder = "",
|
|
12926
|
+
className,
|
|
12927
|
+
activeColor = "amber" /* amber */,
|
|
12928
|
+
inputType = "default" /* DEFAULT */
|
|
12929
|
+
}) => {
|
|
12930
|
+
React3.useEffect(() => {
|
|
12931
|
+
if (!isActive || disabled) return;
|
|
12932
|
+
const handleKeyDown = (e) => {
|
|
12933
|
+
if (e.key === "Backspace" || e.key === "Delete") {
|
|
12934
|
+
e.preventDefault();
|
|
12935
|
+
onDelete?.();
|
|
12936
|
+
return;
|
|
12937
|
+
}
|
|
12938
|
+
if (/^[0-9]$/.test(e.key)) {
|
|
12939
|
+
e.preventDefault();
|
|
12940
|
+
onKeyPress?.(e.key);
|
|
12941
|
+
return;
|
|
12942
|
+
}
|
|
12943
|
+
if (e.key === " ") {
|
|
12944
|
+
e.preventDefault();
|
|
12945
|
+
onSpace?.();
|
|
12946
|
+
return;
|
|
12947
|
+
}
|
|
12948
|
+
};
|
|
12949
|
+
window.addEventListener("keydown", handleKeyDown);
|
|
12950
|
+
return () => {
|
|
12951
|
+
window.removeEventListener("keydown", handleKeyDown);
|
|
12952
|
+
};
|
|
12953
|
+
}, [isActive, disabled, onKeyPress, onDelete, onSpace]);
|
|
12954
|
+
if (hidden) return null;
|
|
12955
|
+
const handleClick = () => {
|
|
12956
|
+
if (!disabled) {
|
|
12957
|
+
onFocus?.(name);
|
|
12958
|
+
}
|
|
12959
|
+
};
|
|
12960
|
+
const displayValue = value ?? "";
|
|
12961
|
+
return /* @__PURE__ */ jsxRuntime.jsxs(
|
|
12962
|
+
"div",
|
|
12963
|
+
{
|
|
12964
|
+
tabIndex: 0,
|
|
12965
|
+
onClick: handleClick,
|
|
12966
|
+
className: cn(
|
|
12967
|
+
"flex flex-row items-center gap-3 rounded-xl border-2 transition-all min-h-16 outline-none",
|
|
12968
|
+
sizeClasses[size],
|
|
12969
|
+
isActive ? activeColorClasses[activeColor] : "border-zinc-700/40 hover:border-zinc-600",
|
|
12970
|
+
disabled ? "opacity-50 cursor-not-allowed" : "cursor-pointer",
|
|
12971
|
+
className
|
|
12972
|
+
),
|
|
12973
|
+
children: [
|
|
12974
|
+
prefix && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-400 text-xs font-mono font-bold", children: prefix }),
|
|
12975
|
+
(iconsLeft.length > 0 || textLeft) && /* @__PURE__ */ jsxRuntime.jsxs(InputGroupAddon, { children: [
|
|
12976
|
+
textLeft && /* @__PURE__ */ jsxRuntime.jsx(InputGroupText, { children: typeof textLeft === "string" ? textLeft : "" }),
|
|
12977
|
+
iconsLeft.map((IconComponent, index) => /* @__PURE__ */ jsxRuntime.jsx(IconComponent, { size: 20, className: "text-zinc-400" }, index))
|
|
12978
|
+
] }),
|
|
12979
|
+
placeholder && displayValue.toString().length == 0 && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "font-mono font-bold text-zinc-500/20", style: { color: "#8080807d" }, children: placeholder }),
|
|
12980
|
+
/* @__PURE__ */ jsxRuntime.jsx("span", { className: cn(
|
|
12981
|
+
"font-mono font-bold tracking-widest",
|
|
12982
|
+
!displayValue && "text-zinc-500"
|
|
12983
|
+
), children: inputType !== "password" /* PASSWORD */ ? displayValue : "\u2022".repeat(displayValue.toString().length) }),
|
|
12984
|
+
suffix && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "text-zinc-400 text-sm", children: suffix }),
|
|
12985
|
+
(iconsRight.length > 0 || textRight) && /* @__PURE__ */ jsxRuntime.jsxs(InputGroupAddon, { className: "ml-auto", children: [
|
|
12986
|
+
textRight && /* @__PURE__ */ jsxRuntime.jsx(InputGroupText, { children: textRight }),
|
|
12987
|
+
iconsRight.map((IconComponent, index) => /* @__PURE__ */ jsxRuntime.jsx(IconComponent, { size: 20, className: "text-zinc-400" }, index))
|
|
12988
|
+
] }),
|
|
12989
|
+
infoTooltip && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "mr-auto text-[10px] uppercase tracking-widest", children: /* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive.TooltipProvider, { children: /* @__PURE__ */ jsxRuntime.jsxs(TooltipPrimitive.Tooltip, { children: [
|
|
12990
|
+
/* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive.TooltipTrigger, { asChild: true, children: /* @__PURE__ */ jsxRuntime.jsx(lucideReact.Info, { size: 20, className: "text-zinc-400 hover:text-zinc-200" }) }),
|
|
12991
|
+
/* @__PURE__ */ jsxRuntime.jsx(TooltipPrimitive.TooltipContent, { children: /* @__PURE__ */ jsxRuntime.jsx("p", { children: infoTooltip }) })
|
|
12992
|
+
] }) }) })
|
|
12993
|
+
]
|
|
12994
|
+
}
|
|
12995
|
+
);
|
|
12996
|
+
};
|
|
12698
12997
|
var QwertyKeyboard = class extends BaseKeyboard {
|
|
12699
12998
|
render() {
|
|
12700
12999
|
const { input, children, className, keyFontSize } = this;
|
|
@@ -12705,7 +13004,7 @@ var KeyboardQwerty = ({ onKeyPress, onEnter, keyFontSize = "text-2xl", onDelete,
|
|
|
12705
13004
|
const [shiftMode, setShiftMode] = React3.useState("off");
|
|
12706
13005
|
const [mode, setMode] = React3.useState("letters");
|
|
12707
13006
|
const lastShiftPress = React3.useRef(0);
|
|
12708
|
-
const { currentInputField, write, setIsOpen, backspace, isInputRequired } = useKeyboardStore();
|
|
13007
|
+
const { currentInputField, write, setIsOpen, backspace, isInputRequired, value } = useKeyboardStore();
|
|
12709
13008
|
const storeonEnter = useKeyboardStore((state) => state.onEnter);
|
|
12710
13009
|
const isUpper = shiftMode !== "off";
|
|
12711
13010
|
React3.useEffect(() => {
|
|
@@ -12776,7 +13075,27 @@ var KeyboardQwerty = ({ onKeyPress, onEnter, keyFontSize = "text-2xl", onDelete,
|
|
|
12776
13075
|
const shiftActive = shiftMode !== "off";
|
|
12777
13076
|
const textField = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
12778
13077
|
children && children,
|
|
12779
|
-
!children && currentInputField && /* @__PURE__ */ jsxRuntime.jsx(
|
|
13078
|
+
!children && currentInputField && /* @__PURE__ */ jsxRuntime.jsx(
|
|
13079
|
+
TextField,
|
|
13080
|
+
{
|
|
13081
|
+
name: currentInputField.input.label,
|
|
13082
|
+
placeholder: currentInputField.input.placeHolder ?? currentInputField.input.label,
|
|
13083
|
+
value: currentInputField.field?.value,
|
|
13084
|
+
inputType: currentInputField.input.keyboardType,
|
|
13085
|
+
isActive: true,
|
|
13086
|
+
iconsLeft: currentInputField.input.inputGroupConfig?.iconsLeft,
|
|
13087
|
+
className: "justify-center"
|
|
13088
|
+
}
|
|
13089
|
+
),
|
|
13090
|
+
!currentInputField && /* @__PURE__ */ jsxRuntime.jsx(
|
|
13091
|
+
TextField,
|
|
13092
|
+
{
|
|
13093
|
+
name: "",
|
|
13094
|
+
value,
|
|
13095
|
+
isActive: true,
|
|
13096
|
+
className: "justify-center"
|
|
13097
|
+
}
|
|
13098
|
+
)
|
|
12780
13099
|
] });
|
|
12781
13100
|
const btnDelete = { label: "delete", icons: [lucideReact.DeleteIcon], onClick: () => {
|
|
12782
13101
|
backspace();
|
|
@@ -12890,161 +13209,6 @@ var KeyboardFactory = class {
|
|
|
12890
13209
|
return /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: instance.render() });
|
|
12891
13210
|
}
|
|
12892
13211
|
};
|
|
12893
|
-
|
|
12894
|
-
// src/components/custom/form/inputs/base/base-input.ts
|
|
12895
|
-
var BaseInput = class {
|
|
12896
|
-
constructor(input, form, isSubmitting) {
|
|
12897
|
-
this.input = input;
|
|
12898
|
-
this.form = form;
|
|
12899
|
-
this.isSubmitting = isSubmitting;
|
|
12900
|
-
}
|
|
12901
|
-
};
|
|
12902
|
-
var entityToInputOption = (entitiy, name = "name", description = "description", groupedLabel, optionLabel = "label") => ({
|
|
12903
|
-
id: entitiy["id"],
|
|
12904
|
-
name: entitiy[name],
|
|
12905
|
-
label: entitiy[optionLabel],
|
|
12906
|
-
description: entitiy[description],
|
|
12907
|
-
groupedLabel
|
|
12908
|
-
});
|
|
12909
|
-
var entitiesToInputOption = (data, optionValue = "name", groupedLabel, optionLabel = "description") => {
|
|
12910
|
-
const entities = [];
|
|
12911
|
-
for (const key of data) {
|
|
12912
|
-
const entidad = entityToInputOption(key, optionValue, optionLabel, groupedLabel);
|
|
12913
|
-
if (entidad) entities.push(entidad);
|
|
12914
|
-
}
|
|
12915
|
-
return entities;
|
|
12916
|
-
};
|
|
12917
|
-
var entityToGroupedOption = (entitiy, name = "name") => ({
|
|
12918
|
-
id: entitiy["id"],
|
|
12919
|
-
label: entitiy[name] || entitiy["label"],
|
|
12920
|
-
options: entitiy["options"] || [],
|
|
12921
|
-
selectedOptions: []
|
|
12922
|
-
});
|
|
12923
|
-
var entitiesToGroupedOption = (data, optionValue = "name") => {
|
|
12924
|
-
const entities = [];
|
|
12925
|
-
for (const key of data) {
|
|
12926
|
-
const entidad = entityToGroupedOption(key, optionValue);
|
|
12927
|
-
if (entidad) entities.push(entidad);
|
|
12928
|
-
}
|
|
12929
|
-
return entities;
|
|
12930
|
-
};
|
|
12931
|
-
var handleOnChage = (event, input, field) => {
|
|
12932
|
-
let value = event;
|
|
12933
|
-
if (event && typeof event === "object" && "target" in event) {
|
|
12934
|
-
value = event.target.value;
|
|
12935
|
-
}
|
|
12936
|
-
field?.onChange(value);
|
|
12937
|
-
const data = input.form?.getValues();
|
|
12938
|
-
input.onChange?.(value, data);
|
|
12939
|
-
input.onAnyFieldChange?.(data);
|
|
12940
|
-
};
|
|
12941
|
-
var isValidField = (input, form, defaultValue) => {
|
|
12942
|
-
const value = defaultValue ?? form.getValues(input.name);
|
|
12943
|
-
const fieldState = form.getFieldState(input.name);
|
|
12944
|
-
if (input.zodType) {
|
|
12945
|
-
const result = input.zodType.safeParse(value);
|
|
12946
|
-
return result.success;
|
|
12947
|
-
}
|
|
12948
|
-
return !fieldState.error && value !== void 0 && value !== "";
|
|
12949
|
-
};
|
|
12950
|
-
|
|
12951
|
-
// src/components/custom/form/inputs/base/input-types.ts
|
|
12952
|
-
var InputTypes = /* @__PURE__ */ ((InputTypes3) => {
|
|
12953
|
-
InputTypes3["HIDDEN"] = "hidden";
|
|
12954
|
-
InputTypes3["TEXT"] = "text";
|
|
12955
|
-
InputTypes3["TEXT_GROUP"] = "text_group";
|
|
12956
|
-
InputTypes3["NUMBER"] = "number";
|
|
12957
|
-
InputTypes3["SWITCH"] = "switch";
|
|
12958
|
-
InputTypes3["CHECKBOX"] = "checkbox";
|
|
12959
|
-
InputTypes3["SELECT"] = "select";
|
|
12960
|
-
InputTypes3["SIMPLE_CHECK_LIST"] = "siple_checklist";
|
|
12961
|
-
InputTypes3["CHECK_LIST"] = "checklist";
|
|
12962
|
-
InputTypes3["GROUPED_SWITCH_LIST"] = "grouped_switchlist";
|
|
12963
|
-
InputTypes3["ACCORDION_GROUPED_SWITCH_LIST"] = "accordion_grouped_switchlist";
|
|
12964
|
-
InputTypes3["DATE"] = "date";
|
|
12965
|
-
InputTypes3["TEXTAREA"] = "textarea";
|
|
12966
|
-
InputTypes3["FILE"] = "file";
|
|
12967
|
-
InputTypes3["OTP"] = "otp";
|
|
12968
|
-
InputTypes3["FORM"] = "form";
|
|
12969
|
-
InputTypes3["COLOR"] = "color";
|
|
12970
|
-
InputTypes3["RADIO_GROUP"] = "radio_group";
|
|
12971
|
-
InputTypes3["TAGS"] = "tags";
|
|
12972
|
-
InputTypes3["DATE_TIME"] = "date_time";
|
|
12973
|
-
InputTypes3["TIME"] = "time";
|
|
12974
|
-
InputTypes3["FILE_MULTI_UPLOAD"] = "file_multi_upload";
|
|
12975
|
-
InputTypes3["SLIDER"] = "slider";
|
|
12976
|
-
InputTypes3["BUTTON_GROUP"] = "button_group";
|
|
12977
|
-
InputTypes3["CURRENCY"] = "currency";
|
|
12978
|
-
InputTypes3["KEY_VALUE"] = "key_value";
|
|
12979
|
-
InputTypes3["REPEATER"] = "repeater";
|
|
12980
|
-
InputTypes3["MULTI_SELECT"] = "multi_select";
|
|
12981
|
-
InputTypes3["COMBOBOX"] = "COMBO_BOX";
|
|
12982
|
-
InputTypes3["SORTABLE_LIST"] = "sortable_list";
|
|
12983
|
-
InputTypes3["REPEATER_TABS"] = "repeater_tabs";
|
|
12984
|
-
InputTypes3["STRING_LIST"] = "string_list";
|
|
12985
|
-
InputTypes3["RATING"] = "rating";
|
|
12986
|
-
InputTypes3["PHONE"] = "phone";
|
|
12987
|
-
InputTypes3["URL"] = "url";
|
|
12988
|
-
InputTypes3["PASSWORD"] = "password";
|
|
12989
|
-
InputTypes3["AUTOCOMPLETE"] = "autocomplete";
|
|
12990
|
-
InputTypes3["EMAIL"] = "email";
|
|
12991
|
-
InputTypes3["SEARCH"] = "search";
|
|
12992
|
-
InputTypes3["LOCATION_PICKER"] = "location_picker";
|
|
12993
|
-
InputTypes3["DATE_RANGE"] = "date_range";
|
|
12994
|
-
InputTypes3["COUNTRY_SELECT"] = "country_select";
|
|
12995
|
-
InputTypes3["RANGE"] = "range";
|
|
12996
|
-
InputTypes3["FILE_UPLOAD"] = "file_upload";
|
|
12997
|
-
return InputTypes3;
|
|
12998
|
-
})(InputTypes || {});
|
|
12999
|
-
var inputFieldComp = [
|
|
13000
|
-
"string_list" /* STRING_LIST */,
|
|
13001
|
-
"repeater_tabs" /* REPEATER_TABS */,
|
|
13002
|
-
"sortable_list" /* SORTABLE_LIST */,
|
|
13003
|
-
"COMBO_BOX" /* COMBOBOX */,
|
|
13004
|
-
"multi_select" /* MULTI_SELECT */,
|
|
13005
|
-
"repeater" /* REPEATER */,
|
|
13006
|
-
"key_value" /* KEY_VALUE */,
|
|
13007
|
-
"currency" /* CURRENCY */,
|
|
13008
|
-
"button_group" /* BUTTON_GROUP */,
|
|
13009
|
-
"slider" /* SLIDER */,
|
|
13010
|
-
"file_multi_upload" /* FILE_MULTI_UPLOAD */,
|
|
13011
|
-
"time" /* TIME */,
|
|
13012
|
-
"date_time" /* DATE_TIME */,
|
|
13013
|
-
"tags" /* TAGS */,
|
|
13014
|
-
"radio_group" /* RADIO_GROUP */,
|
|
13015
|
-
"text_group" /* TEXT_GROUP */,
|
|
13016
|
-
"accordion_grouped_switchlist" /* ACCORDION_GROUPED_SWITCH_LIST */,
|
|
13017
|
-
"grouped_switchlist" /* GROUPED_SWITCH_LIST */,
|
|
13018
|
-
"text" /* TEXT */,
|
|
13019
|
-
"switch" /* SWITCH */,
|
|
13020
|
-
"siple_checklist" /* SIMPLE_CHECK_LIST */,
|
|
13021
|
-
"checkbox" /* CHECKBOX */,
|
|
13022
|
-
"color" /* COLOR */,
|
|
13023
|
-
"otp" /* OTP */,
|
|
13024
|
-
"select" /* SELECT */,
|
|
13025
|
-
"date" /* DATE */,
|
|
13026
|
-
"file" /* FILE */,
|
|
13027
|
-
"form" /* FORM */,
|
|
13028
|
-
"number" /* NUMBER */,
|
|
13029
|
-
"textarea" /* TEXTAREA */,
|
|
13030
|
-
// InputTypes.SWITCH_LIST,
|
|
13031
|
-
"hidden" /* HIDDEN */,
|
|
13032
|
-
// ✨ New input types (v1.35.0)
|
|
13033
|
-
"rating" /* RATING */,
|
|
13034
|
-
"phone" /* PHONE */,
|
|
13035
|
-
"url" /* URL */,
|
|
13036
|
-
"password" /* PASSWORD */,
|
|
13037
|
-
"autocomplete" /* AUTOCOMPLETE */,
|
|
13038
|
-
// ✨ New input types (v1.36.0)
|
|
13039
|
-
"email" /* EMAIL */,
|
|
13040
|
-
"search" /* SEARCH */,
|
|
13041
|
-
"location_picker" /* LOCATION_PICKER */,
|
|
13042
|
-
"date_range" /* DATE_RANGE */,
|
|
13043
|
-
"country_select" /* COUNTRY_SELECT */,
|
|
13044
|
-
"range" /* RANGE */,
|
|
13045
|
-
// ✨ New input types (v1.37.0)
|
|
13046
|
-
"file_upload" /* FILE_UPLOAD */
|
|
13047
|
-
];
|
|
13048
13212
|
var GroupedSwitchInput = class extends BaseInput {
|
|
13049
13213
|
render() {
|
|
13050
13214
|
const { input, isSubmitting } = this;
|
|
@@ -15519,7 +15683,7 @@ var FieldRating = ({ input, form, isSubmitting }) => {
|
|
|
15519
15683
|
const max = input.max ?? 5;
|
|
15520
15684
|
const size = input.size ?? "md";
|
|
15521
15685
|
const showValue = input.showValue ?? false;
|
|
15522
|
-
const
|
|
15686
|
+
const sizeClasses2 = {
|
|
15523
15687
|
sm: "h-4 w-4",
|
|
15524
15688
|
md: "h-6 w-6",
|
|
15525
15689
|
lg: "h-8 w-8"
|
|
@@ -15553,7 +15717,7 @@ var FieldRating = ({ input, form, isSubmitting }) => {
|
|
|
15553
15717
|
lucideReact.Star,
|
|
15554
15718
|
{
|
|
15555
15719
|
className: cn(
|
|
15556
|
-
|
|
15720
|
+
sizeClasses2[size],
|
|
15557
15721
|
isFilled ? "fill-yellow-400 text-yellow-400" : "fill-none text-gray-300"
|
|
15558
15722
|
)
|
|
15559
15723
|
}
|
|
@@ -17031,7 +17195,7 @@ function getDefaultValues(entity, fields) {
|
|
|
17031
17195
|
});
|
|
17032
17196
|
}
|
|
17033
17197
|
if (fields) {
|
|
17034
|
-
const flatFields =
|
|
17198
|
+
const flatFields = flattenFields3(fields);
|
|
17035
17199
|
for (const field of flatFields) {
|
|
17036
17200
|
const key = field.name;
|
|
17037
17201
|
if (defaults[key] === void 0) {
|
|
@@ -17041,13 +17205,13 @@ function getDefaultValues(entity, fields) {
|
|
|
17041
17205
|
}
|
|
17042
17206
|
return defaults;
|
|
17043
17207
|
}
|
|
17044
|
-
var
|
|
17208
|
+
var flattenFields3 = (fields) => {
|
|
17045
17209
|
const result = [];
|
|
17046
17210
|
for (const field of fields) {
|
|
17047
17211
|
if (Array.isArray(field)) {
|
|
17048
|
-
result.push(...
|
|
17212
|
+
result.push(...flattenFields3(field));
|
|
17049
17213
|
} else if (field.fields) {
|
|
17050
|
-
result.push(...
|
|
17214
|
+
result.push(...flattenFields3(field.fields));
|
|
17051
17215
|
} else {
|
|
17052
17216
|
result.push(field);
|
|
17053
17217
|
}
|
|
@@ -17055,7 +17219,7 @@ var flattenFields2 = (fields) => {
|
|
|
17055
17219
|
return result;
|
|
17056
17220
|
};
|
|
17057
17221
|
var getDynamicSchema = (fields, extraValidations) => {
|
|
17058
|
-
const flatFields =
|
|
17222
|
+
const flatFields = flattenFields3(fields);
|
|
17059
17223
|
const shape = flatFields.reduce((acc, f) => {
|
|
17060
17224
|
acc[f.name] = f.zodType ?? z2__default.default.any();
|
|
17061
17225
|
return acc;
|
|
@@ -17068,46 +17232,6 @@ var getDynamicSchema = (fields, extraValidations) => {
|
|
|
17068
17232
|
}
|
|
17069
17233
|
return schema;
|
|
17070
17234
|
};
|
|
17071
|
-
var flattenFields3 = (fields) => {
|
|
17072
|
-
const result = [];
|
|
17073
|
-
for (const field of fields) {
|
|
17074
|
-
if (Array.isArray(field)) {
|
|
17075
|
-
result.push(...flattenFields3(field));
|
|
17076
|
-
} else if (field.fields) {
|
|
17077
|
-
result.push(...flattenFields3(field.fields));
|
|
17078
|
-
} else {
|
|
17079
|
-
result.push(field);
|
|
17080
|
-
}
|
|
17081
|
-
}
|
|
17082
|
-
return result;
|
|
17083
|
-
};
|
|
17084
|
-
var FormErrorsAlert = ({
|
|
17085
|
-
formState,
|
|
17086
|
-
fields
|
|
17087
|
-
}) => {
|
|
17088
|
-
const flatFields = flattenFields3(fields);
|
|
17089
|
-
const hasErrors = Object.keys(formState.errors).length > 0;
|
|
17090
|
-
return /* @__PURE__ */ jsxRuntime.jsx("div", { style: { marginTop: 4 }, children: hasErrors && /* @__PURE__ */ jsxRuntime.jsx(
|
|
17091
|
-
CustomAlert,
|
|
17092
|
-
{
|
|
17093
|
-
title: "Revisar los siguientes criterios",
|
|
17094
|
-
description: /* @__PURE__ */ jsxRuntime.jsx("ul", { children: Object.entries(formState.errors).map(([key, value]) => /* @__PURE__ */ jsxRuntime.jsxs("li", { children: [
|
|
17095
|
-
/* @__PURE__ */ jsxRuntime.jsxs("strong", { children: [
|
|
17096
|
-
getFieldLabel(key, flatFields),
|
|
17097
|
-
":"
|
|
17098
|
-
] }),
|
|
17099
|
-
" ",
|
|
17100
|
-
value?.message?.toString() ?? ""
|
|
17101
|
-
] }, key)) }),
|
|
17102
|
-
className: "mb-4",
|
|
17103
|
-
variant: "error"
|
|
17104
|
-
}
|
|
17105
|
-
) });
|
|
17106
|
-
};
|
|
17107
|
-
var getFieldLabel = (fieldErrorKey, fields) => {
|
|
17108
|
-
const foundField = fields.find((field) => field.name === fieldErrorKey);
|
|
17109
|
-
return foundField?.label ?? fieldErrorKey;
|
|
17110
|
-
};
|
|
17111
17235
|
var isRenderableChild = (c) => c !== void 0 && c !== null && typeof c !== "function";
|
|
17112
17236
|
var shouldShowField = (field, values) => {
|
|
17113
17237
|
if (typeof field.showWhen === "function") {
|
|
@@ -17183,7 +17307,7 @@ var DynamicSheetKeyboard = ({ currentInputField, children, input, className, chi
|
|
|
17183
17307
|
KeyboardFactory.create(currentInputField?.input.keyboard ?? "qwerty" /* QWERTY */, input, children),
|
|
17184
17308
|
" "
|
|
17185
17309
|
] });
|
|
17186
|
-
const { setCurrentInputField
|
|
17310
|
+
const { setCurrentInputField } = useKeyboardStore();
|
|
17187
17311
|
const [container, setContainer] = React3.useState(content);
|
|
17188
17312
|
React3.useEffect(() => {
|
|
17189
17313
|
if (!currentInputField) setCurrentInputField(null);
|
|
@@ -17226,7 +17350,8 @@ var DynamicForm = ({
|
|
|
17226
17350
|
submitBtnIcon = lucideReact.Save,
|
|
17227
17351
|
dialogTitle = "\xBFEst\xE1s seguro?",
|
|
17228
17352
|
dialogDescription = "Esta acci\xF3n no se puede deshacer. \xBFDeseas continuar?",
|
|
17229
|
-
withConfirmDialog = false
|
|
17353
|
+
withConfirmDialog = false,
|
|
17354
|
+
withSheetKeyboard = false
|
|
17230
17355
|
}) => {
|
|
17231
17356
|
const [isPending, startTransition] = React3.useTransition();
|
|
17232
17357
|
const currentInputField = useKeyboardStore((state) => state.currentInputField);
|
|
@@ -17284,7 +17409,7 @@ var DynamicForm = ({
|
|
|
17284
17409
|
}
|
|
17285
17410
|
);
|
|
17286
17411
|
const formBody = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
|
|
17287
|
-
/* @__PURE__ */ jsxRuntime.jsx(DynamicSheetKeyboard, { currentInputField }),
|
|
17412
|
+
withSheetKeyboard && /* @__PURE__ */ jsxRuntime.jsx(DynamicSheetKeyboard, { currentInputField }),
|
|
17288
17413
|
/* @__PURE__ */ jsxRuntime.jsxs("div", { className: "w-full grid grid-cols-1", children: [
|
|
17289
17414
|
/* @__PURE__ */ jsxRuntime.jsx(
|
|
17290
17415
|
FormFieldsGrid,
|