@sio-group/form-react 0.4.2 → 0.4.3

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.
Files changed (19) hide show
  1. package/CHANGELOG.md +6 -0
  2. package/dist/index.cjs +187 -322
  3. package/dist/index.d.cts +2 -98
  4. package/dist/index.d.ts +2 -98
  5. package/dist/index.js +170 -293
  6. package/dist/styles/index.css +0 -287
  7. package/dist/styles/index.css.map +1 -1
  8. package/package.json +1 -1
  9. package/src/components/Fields/Input/DateInput/index.tsx +1 -1
  10. package/src/components/Fields/Input/FileInput/index.tsx +1 -1
  11. package/src/components/Fields/Input/NumberInput/index.tsx +1 -1
  12. package/src/components/Fields/InputWrapper/index.tsx +1 -1
  13. package/src/components/Form.tsx +2 -1
  14. package/src/index.ts +0 -2
  15. package/src/types/form-config.d.ts +1 -1
  16. package/dist/styles/components/button.css +0 -244
  17. package/dist/styles/components/button.css.map +0 -1
  18. package/dist/styles/components/link.css +0 -113
  19. package/dist/styles/components/link.css.map +0 -1
package/dist/index.cjs CHANGED
@@ -1,9 +1,7 @@
1
1
  "use strict";
2
- var __create = Object.create;
3
2
  var __defProp = Object.defineProperty;
4
3
  var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
5
4
  var __getOwnPropNames = Object.getOwnPropertyNames;
6
- var __getProtoOf = Object.getPrototypeOf;
7
5
  var __hasOwnProp = Object.prototype.hasOwnProperty;
8
6
  var __export = (target, all) => {
9
7
  for (var name in all)
@@ -17,26 +15,16 @@ var __copyProps = (to, from, except, desc) => {
17
15
  }
18
16
  return to;
19
17
  };
20
- var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
21
- // If the importer is in node compatibility mode or this is not an ESM
22
- // file that has been converted to a CommonJS file using a Babel-
23
- // compatible transform (i.e. "__esModule" has not been set), then set
24
- // "default" to the CommonJS "module.exports" for node compatibility.
25
- isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
26
- mod
27
- ));
28
18
  var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
29
19
 
30
20
  // src/index.ts
31
21
  var index_exports = {};
32
22
  __export(index_exports, {
33
- Button: () => Button,
34
23
  Checkbox: () => Checkbox,
35
24
  DateInput: () => DateInput,
36
25
  FileInput: () => FileInput,
37
26
  Form: () => Form,
38
27
  Input: () => Input,
39
- Link: () => Link,
40
28
  NumberInput: () => NumberInput,
41
29
  Radio: () => Radio,
42
30
  RangeInput: () => RangeInput,
@@ -48,7 +36,7 @@ __export(index_exports, {
48
36
  module.exports = __toCommonJS(index_exports);
49
37
 
50
38
  // src/components/Form.tsx
51
- var import_react8 = require("react");
39
+ var import_react6 = require("react");
52
40
 
53
41
  // src/hooks/useForm.ts
54
42
  var import_react2 = require("react");
@@ -599,69 +587,11 @@ var Checkbox = ({
599
587
  };
600
588
 
601
589
  // src/components/Fields/Input/Input.tsx
602
- var import_react6 = require("react");
603
-
604
- // src/components/Button/index.tsx
605
- var import_react4 = __toESM(require("react"), 1);
606
- var import_jsx_runtime4 = require("react/jsx-runtime");
607
- var ButtonComponent = ({
608
- type = "button",
609
- label,
610
- onClick,
611
- variant = "primary",
612
- color = "default",
613
- size = "md",
614
- block = false,
615
- loading = false,
616
- disabled = false,
617
- className = "",
618
- ariaLabel = "",
619
- style = {},
620
- children
621
- }) => {
622
- const isDisabled = disabled || loading;
623
- const handleClick = (e) => {
624
- if (isDisabled) {
625
- e.preventDefault();
626
- return;
627
- }
628
- onClick?.(e);
629
- };
630
- const buttonClasses = [
631
- "btn",
632
- `btn--${variant}`,
633
- `btn--${size}`,
634
- `btn--${color}`,
635
- block && "btn--block",
636
- loading && "btn--loading",
637
- isDisabled && "btn--disabled",
638
- className
639
- ].filter(Boolean).join(" ");
640
- return /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
641
- "button",
642
- {
643
- type,
644
- onClick: handleClick,
645
- className: buttonClasses,
646
- style,
647
- disabled: isDisabled,
648
- "aria-label": ariaLabel || label,
649
- "aria-busy": loading,
650
- "aria-disabled": isDisabled,
651
- children: loading ? /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
652
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "btn__spinner", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("svg", { viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("circle", { cx: "10", cy: "10", r: "8" }) }) }),
653
- /* @__PURE__ */ (0, import_jsx_runtime4.jsx)("span", { className: "btn__loading-text", children: "Processing..." })
654
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(import_jsx_runtime4.Fragment, { children: [
655
- children,
656
- label
657
- ] })
658
- }
659
- );
660
- };
661
- var Button = import_react4.default.memo(ButtonComponent);
590
+ var import_react5 = require("react");
662
591
 
663
592
  // src/components/Fields/Input/NumberInput/index.tsx
664
- var import_jsx_runtime5 = require("react/jsx-runtime");
593
+ var import_ui_core = require("@sio-group/ui-core");
594
+ var import_jsx_runtime4 = require("react/jsx-runtime");
665
595
  var NumberInput = ({
666
596
  value,
667
597
  min,
@@ -717,7 +647,7 @@ var NumberInput = ({
717
647
  }
718
648
  onChange(value2);
719
649
  };
720
- return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
650
+ return /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)(
721
651
  InputWrapper_default,
722
652
  {
723
653
  type,
@@ -733,8 +663,8 @@ var NumberInput = ({
733
663
  className,
734
664
  style,
735
665
  children: [
736
- spinner && spinner === "horizontal" && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
737
- Button,
666
+ spinner && spinner === "horizontal" && /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
667
+ import_ui_core.Button,
738
668
  {
739
669
  type: "button",
740
670
  variant: "link",
@@ -745,8 +675,8 @@ var NumberInput = ({
745
675
  label: "-"
746
676
  }
747
677
  ),
748
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Icon, { icon }),
749
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
678
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(Icon, { icon }),
679
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
750
680
  "input",
751
681
  {
752
682
  type: "number",
@@ -779,8 +709,8 @@ var NumberInput = ({
779
709
  style: spinner && spinner === "horizontal" ? { textAlign: "center" } : {}
780
710
  }
781
711
  ),
782
- spinner && (spinner === "horizontal" ? /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
783
- Button,
712
+ spinner && (spinner === "horizontal" ? /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
713
+ import_ui_core.Button,
784
714
  {
785
715
  type: "button",
786
716
  variant: "link",
@@ -790,9 +720,9 @@ var NumberInput = ({
790
720
  "aria-label": "Increase value",
791
721
  label: "+"
792
722
  }
793
- ) : /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)("div", { className: "form-field__spinner", "aria-hidden": "true", children: [
794
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
795
- Button,
723
+ ) : /* @__PURE__ */ (0, import_jsx_runtime4.jsxs)("div", { className: "form-field__spinner", "aria-hidden": "true", children: [
724
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
725
+ import_ui_core.Button,
796
726
  {
797
727
  type: "button",
798
728
  onClick: handleIncrement,
@@ -801,8 +731,8 @@ var NumberInput = ({
801
731
  label: "\u25B2"
802
732
  }
803
733
  ),
804
- /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
805
- Button,
734
+ /* @__PURE__ */ (0, import_jsx_runtime4.jsx)(
735
+ import_ui_core.Button,
806
736
  {
807
737
  type: "button",
808
738
  onClick: handleDecrement,
@@ -818,7 +748,7 @@ var NumberInput = ({
818
748
  };
819
749
 
820
750
  // src/components/Fields/Input/RangeInput/index.tsx
821
- var import_jsx_runtime6 = require("react/jsx-runtime");
751
+ var import_jsx_runtime5 = require("react/jsx-runtime");
822
752
  var RangeInput = ({
823
753
  value,
824
754
  min,
@@ -845,7 +775,7 @@ var RangeInput = ({
845
775
  className,
846
776
  style
847
777
  }) => {
848
- return /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
778
+ return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(
849
779
  InputWrapper_default,
850
780
  {
851
781
  type,
@@ -861,9 +791,9 @@ var RangeInput = ({
861
791
  className,
862
792
  style,
863
793
  children: [
864
- /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(Icon, { icon }),
865
- showValue && /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("span", { className: "form-field__range-value", children: Number(value) }),
866
- /* @__PURE__ */ (0, import_jsx_runtime6.jsx)(
794
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(Icon, { icon }),
795
+ showValue && /* @__PURE__ */ (0, import_jsx_runtime5.jsx)("span", { className: "form-field__range-value", children: Number(value) }),
796
+ /* @__PURE__ */ (0, import_jsx_runtime5.jsx)(
867
797
  "input",
868
798
  {
869
799
  type,
@@ -896,111 +826,112 @@ var RangeInput = ({
896
826
  };
897
827
 
898
828
  // src/components/Fields/Input/DateInput/index.tsx
899
- var import_react5 = require("react");
829
+ var import_react4 = require("react");
830
+ var import_ui_core2 = require("@sio-group/ui-core");
900
831
 
901
832
  // src/utils/custom-icons.tsx
902
- var import_jsx_runtime7 = require("react/jsx-runtime");
833
+ var import_jsx_runtime6 = require("react/jsx-runtime");
903
834
  var CustomIcons = {
904
- Date: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
905
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", ry: "2", stroke: "currentColor", fill: "none" }),
906
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "8", y1: "2", x2: "8", y2: "6", stroke: "currentColor" }),
907
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "16", y1: "2", x2: "16", y2: "6", stroke: "currentColor" }),
908
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "3", y1: "10", x2: "21", y2: "10", stroke: "currentColor" })
835
+ Date: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
836
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("rect", { x: "3", y: "4", width: "18", height: "18", rx: "2", ry: "2", stroke: "currentColor", fill: "none" }),
837
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "8", y1: "2", x2: "8", y2: "6", stroke: "currentColor" }),
838
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "16", y1: "2", x2: "16", y2: "6", stroke: "currentColor" }),
839
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "3", y1: "10", x2: "21", y2: "10", stroke: "currentColor" })
909
840
  ] }),
910
- Time: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
911
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
912
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polyline", { points: "12 6 12 12 16 14" }),
913
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("circle", { cx: "12", cy: "12", r: "1", fill: "currentColor", fillOpacity: "0.3", stroke: "none" })
841
+ Time: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", strokeLinecap: "round", strokeLinejoin: "round", children: [
842
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
843
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "12 6 12 12 16 14" }),
844
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("circle", { cx: "12", cy: "12", r: "1", fill: "currentColor", fillOpacity: "0.3", stroke: "none" })
914
845
  ] }),
915
- DateTime: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
916
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("rect", { x: "2", y: "3", width: "14", height: "14", rx: "2", ry: "2" }),
917
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "5", y1: "2", x2: "5", y2: "5" }),
918
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "13", y1: "2", x2: "13", y2: "5" }),
919
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "2", y1: "7", x2: "16", y2: "7" }),
920
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("circle", { cx: "19", cy: "15", r: "4" }),
921
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polyline", { points: "19 13 19 15 21 16" })
846
+ DateTime: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
847
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("rect", { x: "2", y: "3", width: "14", height: "14", rx: "2", ry: "2" }),
848
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "5", y1: "2", x2: "5", y2: "5" }),
849
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "13", y1: "2", x2: "13", y2: "5" }),
850
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "2", y1: "7", x2: "16", y2: "7" }),
851
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("circle", { cx: "19", cy: "15", r: "4" }),
852
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "19 13 19 15 21 16" })
922
853
  ] }),
923
- FileUpload: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
924
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
925
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polyline", { points: "13 2 13 9 20 9" }),
926
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M12 12v6m0-6 2 2m-2-2-2 2" })
854
+ FileUpload: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
855
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
856
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "13 2 13 9 20 9" }),
857
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M12 12v6m0-6 2 2m-2-2-2 2" })
927
858
  ] }),
928
- CloudUpload: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
929
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M12 16v-6m0 0-2 2m2-2 2 2" }),
930
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M16 16h3a4 4 0 0 0 0-8h-1.5A5.5 5.5 0 0 0 7 9a5 5 0 0 0-1 9.8" })
859
+ CloudUpload: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
860
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M12 16v-6m0 0-2 2m2-2 2 2" }),
861
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M16 16h3a4 4 0 0 0 0-8h-1.5A5.5 5.5 0 0 0 7 9a5 5 0 0 0-1 9.8" })
931
862
  ] }),
932
- TrashIcon: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
933
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3 6h18" }),
934
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("rect", { x: "6", y: "6", width: "12", height: "14", rx: "1", ry: "1" }),
935
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M9 3h6" }),
936
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M10 3v3M14 3v3" }),
937
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "10", y1: "10", x2: "10", y2: "16" }),
938
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "14", y1: "10", x2: "14", y2: "16" })
863
+ TrashIcon: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
864
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M3 6h18" }),
865
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("rect", { x: "6", y: "6", width: "12", height: "14", rx: "1", ry: "1" }),
866
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M9 3h6" }),
867
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M10 3v3M14 3v3" }),
868
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "10", y1: "10", x2: "10", y2: "16" }),
869
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "14", y1: "10", x2: "14", y2: "16" })
939
870
  ] }),
940
- SimpleTrashIcon: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
941
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3 6h18" }),
942
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("rect", { x: "6", y: "8", width: "12", height: "12", rx: "1", ry: "1" }),
943
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M9 4h6" })
871
+ SimpleTrashIcon: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
872
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M3 6h18" }),
873
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("rect", { x: "6", y: "8", width: "12", height: "12", rx: "1", ry: "1" }),
874
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M9 4h6" })
944
875
  ] }),
945
- DeleteTrashIcon: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
946
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M3 6h18" }),
947
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("rect", { x: "6", y: "6", width: "12", height: "14", rx: "1", ry: "1" }),
948
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M9 3h6" }),
949
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M10 3v3M14 3v3" }),
950
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "9", y1: "10", x2: "15", y2: "16" }),
951
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "15", y1: "10", x2: "9", y2: "16" })
876
+ DeleteTrashIcon: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
877
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M3 6h18" }),
878
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("rect", { x: "6", y: "6", width: "12", height: "14", rx: "1", ry: "1" }),
879
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M9 3h6" }),
880
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M10 3v3M14 3v3" }),
881
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "9", y1: "10", x2: "15", y2: "16" }),
882
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "15", y1: "10", x2: "9", y2: "16" })
952
883
  ] }),
953
- FileIcon: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
954
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
955
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polyline", { points: "13 2 13 9 20 9" })
884
+ FileIcon: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
885
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
886
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "13 2 13 9 20 9" })
956
887
  ] }),
957
- Word: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
958
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
959
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polyline", { points: "13 2 13 9 20 9" }),
960
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "8", y1: "13", x2: "16", y2: "13" }),
961
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "8", y1: "16", x2: "16", y2: "16" }),
962
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "8", y1: "19", x2: "13", y2: "19" })
888
+ Word: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
889
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
890
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "13 2 13 9 20 9" }),
891
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "8", y1: "13", x2: "16", y2: "13" }),
892
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "8", y1: "16", x2: "16", y2: "16" }),
893
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "8", y1: "19", x2: "13", y2: "19" })
963
894
  ] }),
964
- Excel: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
965
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
966
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polyline", { points: "13 2 13 9 20 9" }),
967
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("rect", { x: "7", y: "12", width: "10", height: "7", rx: "1" }),
968
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "7", y1: "15.5", x2: "17", y2: "15.5" }),
969
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("line", { x1: "11.5", y1: "12", x2: "11.5", y2: "19" })
895
+ Excel: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
896
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
897
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "13 2 13 9 20 9" }),
898
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("rect", { x: "7", y: "12", width: "10", height: "7", rx: "1" }),
899
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "7", y1: "15.5", x2: "17", y2: "15.5" }),
900
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("line", { x1: "11.5", y1: "12", x2: "11.5", y2: "19" })
970
901
  ] }),
971
- PowerPoint: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
972
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
973
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polyline", { points: "13 2 13 9 20 9" }),
974
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("rect", { x: "7", y: "12", width: "10", height: "7", rx: "1" }),
975
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M9 17l2-3 2 2 2-3" })
902
+ PowerPoint: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
903
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
904
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "13 2 13 9 20 9" }),
905
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("rect", { x: "7", y: "12", width: "10", height: "7", rx: "1" }),
906
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M9 17l2-3 2 2 2-3" })
976
907
  ] }),
977
- Pdf: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
978
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
979
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polyline", { points: "13 2 13 9 20 9" }),
980
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("rect", { x: "7", y: "14", width: "10", height: "4", rx: "1" })
908
+ Pdf: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
909
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
910
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "13 2 13 9 20 9" }),
911
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("rect", { x: "7", y: "14", width: "10", height: "4", rx: "1" })
981
912
  ] }),
982
- Image: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
983
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
984
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polyline", { points: "13 2 13 9 20 9" }),
985
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("circle", { cx: "9", cy: "13", r: "1.5" }),
986
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M7 18l3-3 2 2 3-3 2 4" })
913
+ Image: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
914
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
915
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "13 2 13 9 20 9" }),
916
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("circle", { cx: "9", cy: "13", r: "1.5" }),
917
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M7 18l3-3 2 2 3-3 2 4" })
987
918
  ] }),
988
- Audio: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
989
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
990
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polyline", { points: "13 2 13 9 20 9" }),
991
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M8 16v-2" }),
992
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M10 17v-4" }),
993
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M12 18v-6" }),
994
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M14 17v-4" }),
995
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M16 16v-2" })
919
+ Audio: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
920
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
921
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "13 2 13 9 20 9" }),
922
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M8 16v-2" }),
923
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M10 17v-4" }),
924
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M12 18v-6" }),
925
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M14 17v-4" }),
926
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M16 16v-2" })
996
927
  ] }),
997
- Video: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
998
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
999
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polyline", { points: "13 2 13 9 20 9" }),
1000
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("rect", { x: "7", y: "12", width: "8", height: "6", rx: "1" }),
1001
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("polygon", { points: "11 14 14 15 11 16" })
928
+ Video: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)("svg", { width: "20", height: "20", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "1.5", children: [
929
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M13 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V9z" }),
930
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polyline", { points: "13 2 13 9 20 9" }),
931
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("rect", { x: "7", y: "12", width: "8", height: "6", rx: "1" }),
932
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("polygon", { points: "11 14 14 15 11 16" })
1002
933
  ] }),
1003
- Globe: () => /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
934
+ Globe: () => /* @__PURE__ */ (0, import_jsx_runtime6.jsxs)(
1004
935
  "svg",
1005
936
  {
1006
937
  width: "20",
@@ -1012,16 +943,16 @@ var CustomIcons = {
1012
943
  strokeLinecap: "round",
1013
944
  strokeLinejoin: "round",
1014
945
  children: [
1015
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
1016
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M2 12h20" }),
1017
- /* @__PURE__ */ (0, import_jsx_runtime7.jsx)("path", { d: "M12 2a15.3 15.3 0 0 1 0 20 15.3 15.3 0 0 1 0-20z" })
946
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("circle", { cx: "12", cy: "12", r: "10" }),
947
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M2 12h20" }),
948
+ /* @__PURE__ */ (0, import_jsx_runtime6.jsx)("path", { d: "M12 2a15.3 15.3 0 0 1 0 20 15.3 15.3 0 0 1 0-20z" })
1018
949
  ]
1019
950
  }
1020
951
  )
1021
952
  };
1022
953
 
1023
954
  // src/components/Fields/Input/DateInput/index.tsx
1024
- var import_jsx_runtime8 = require("react/jsx-runtime");
955
+ var import_jsx_runtime7 = require("react/jsx-runtime");
1025
956
  var DateInput = ({
1026
957
  value,
1027
958
  min,
@@ -1047,7 +978,7 @@ var DateInput = ({
1047
978
  className,
1048
979
  style
1049
980
  }) => {
1050
- const inputRef = (0, import_react5.useRef)(null);
981
+ const inputRef = (0, import_react4.useRef)(null);
1051
982
  const showPicker = () => {
1052
983
  if (inputRef.current) {
1053
984
  inputRef.current.focus();
@@ -1056,7 +987,7 @@ var DateInput = ({
1056
987
  }
1057
988
  }
1058
989
  };
1059
- return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
990
+ return /* @__PURE__ */ (0, import_jsx_runtime7.jsxs)(
1060
991
  InputWrapper_default,
1061
992
  {
1062
993
  type,
@@ -1072,8 +1003,8 @@ var DateInput = ({
1072
1003
  className,
1073
1004
  style,
1074
1005
  children: [
1075
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Icon, { icon }),
1076
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1006
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(Icon, { icon }),
1007
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
1077
1008
  "input",
1078
1009
  {
1079
1010
  ref: inputRef,
@@ -1099,8 +1030,8 @@ var DateInput = ({
1099
1030
  "aria-label": label || placeholder
1100
1031
  }
1101
1032
  ),
1102
- /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1103
- Button,
1033
+ /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(
1034
+ import_ui_core2.Button,
1104
1035
  {
1105
1036
  className: "form-field__action",
1106
1037
  type: "button",
@@ -1117,6 +1048,7 @@ var DateInput = ({
1117
1048
 
1118
1049
  // src/components/Fields/Input/FileInput/index.tsx
1119
1050
  var import_form_validation2 = require("@sio-group/form-validation");
1051
+ var import_ui_core3 = require("@sio-group/ui-core");
1120
1052
 
1121
1053
  // src/utils/get-accept-string.ts
1122
1054
  var getAccept = (accept) => {
@@ -1204,7 +1136,7 @@ var FileTypeIcon = (mime) => {
1204
1136
  };
1205
1137
 
1206
1138
  // src/components/Fields/Input/FileInput/index.tsx
1207
- var import_jsx_runtime9 = require("react/jsx-runtime");
1139
+ var import_jsx_runtime8 = require("react/jsx-runtime");
1208
1140
  var FileInput = ({
1209
1141
  value,
1210
1142
  onChange,
@@ -1266,8 +1198,8 @@ var FileInput = ({
1266
1198
  onChange(fileList);
1267
1199
  if (onError) onError(errorList ?? []);
1268
1200
  };
1269
- return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(import_jsx_runtime9.Fragment, { children: [
1270
- /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
1201
+ return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(import_jsx_runtime8.Fragment, { children: [
1202
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
1271
1203
  InputWrapper_default,
1272
1204
  {
1273
1205
  type,
@@ -1283,8 +1215,8 @@ var FileInput = ({
1283
1215
  className,
1284
1216
  style,
1285
1217
  children: [
1286
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Icon, { icon }),
1287
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1218
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(Icon, { icon }),
1219
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1288
1220
  "input",
1289
1221
  {
1290
1222
  type,
@@ -1308,8 +1240,8 @@ var FileInput = ({
1308
1240
  multiple
1309
1241
  }
1310
1242
  ),
1311
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1312
- Button,
1243
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1244
+ import_ui_core3.Button,
1313
1245
  {
1314
1246
  className: "form-field__action",
1315
1247
  type: "button",
@@ -1325,16 +1257,16 @@ var FileInput = ({
1325
1257
  ]
1326
1258
  }
1327
1259
  ),
1328
- currentFiles.length !== 0 && /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "form-field__upload-file-section", children: [
1329
- currentFiles.map((file, index) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "form-field__upload-file", children: [
1330
- /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("div", { className: "form-field__upload-file-label", children: [
1260
+ currentFiles.length !== 0 && /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "form-field__upload-file-section", children: [
1261
+ currentFiles.map((file, index) => /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "form-field__upload-file", children: [
1262
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("div", { className: "form-field__upload-file-label", children: [
1331
1263
  FileTypeIcon(file.type || "text/uri-list"),
1332
- /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)("span", { children: [
1264
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)("span", { children: [
1333
1265
  file.name,
1334
1266
  file.size ? ` (${getFileSize(file.size)})` : ""
1335
1267
  ] })
1336
1268
  ] }),
1337
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "form-field__upload-file__buttons", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1269
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "form-field__upload-file__buttons", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
1338
1270
  "button",
1339
1271
  {
1340
1272
  type: "button",
@@ -1344,7 +1276,7 @@ var FileInput = ({
1344
1276
  }
1345
1277
  ) })
1346
1278
  ] }, index)),
1347
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("div", { className: "form-field__upload-buttons", children: /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
1279
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("div", { className: "form-field__upload-buttons", children: /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
1348
1280
  "button",
1349
1281
  {
1350
1282
  type: "button",
@@ -1352,7 +1284,7 @@ var FileInput = ({
1352
1284
  onClick: handleRemoveAll,
1353
1285
  children: [
1354
1286
  CustomIcons.TrashIcon(),
1355
- /* @__PURE__ */ (0, import_jsx_runtime9.jsx)("span", { children: "Verwijder alles" })
1287
+ /* @__PURE__ */ (0, import_jsx_runtime8.jsx)("span", { children: "Verwijder alles" })
1356
1288
  ]
1357
1289
  }
1358
1290
  ) })
@@ -1361,7 +1293,7 @@ var FileInput = ({
1361
1293
  };
1362
1294
 
1363
1295
  // src/components/Fields/Input/TextInput/index.tsx
1364
- var import_jsx_runtime10 = require("react/jsx-runtime");
1296
+ var import_jsx_runtime9 = require("react/jsx-runtime");
1365
1297
  var TextInput = ({
1366
1298
  value,
1367
1299
  onChange,
@@ -1384,7 +1316,7 @@ var TextInput = ({
1384
1316
  className,
1385
1317
  style
1386
1318
  }) => {
1387
- return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
1319
+ return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
1388
1320
  InputWrapper_default,
1389
1321
  {
1390
1322
  type,
@@ -1400,8 +1332,8 @@ var TextInput = ({
1400
1332
  className,
1401
1333
  style,
1402
1334
  children: [
1403
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(Icon, { icon }),
1404
- /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
1335
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(Icon, { icon }),
1336
+ /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
1405
1337
  "input",
1406
1338
  {
1407
1339
  type,
@@ -1429,24 +1361,24 @@ var TextInput = ({
1429
1361
  };
1430
1362
 
1431
1363
  // src/components/Fields/Input/Input.tsx
1432
- var import_jsx_runtime11 = require("react/jsx-runtime");
1433
- var Input = (0, import_react6.memo)(
1364
+ var import_jsx_runtime10 = require("react/jsx-runtime");
1365
+ var Input = (0, import_react5.memo)(
1434
1366
  (props) => {
1435
1367
  const { type = "text" } = props;
1436
- return (0, import_react6.useMemo)(() => {
1368
+ return (0, import_react5.useMemo)(() => {
1437
1369
  switch (props.type) {
1438
1370
  case "number":
1439
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(NumberInput, { ...props });
1371
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(NumberInput, { ...props });
1440
1372
  case "range":
1441
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(RangeInput, { ...props });
1373
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(RangeInput, { ...props });
1442
1374
  case "date":
1443
1375
  case "time":
1444
1376
  case "datetime-local":
1445
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(DateInput, { ...props });
1377
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(DateInput, { ...props });
1446
1378
  case "file":
1447
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(FileInput, { ...props });
1379
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(FileInput, { ...props });
1448
1380
  case "hidden":
1449
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
1381
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
1450
1382
  "input",
1451
1383
  {
1452
1384
  type: props.type,
@@ -1456,14 +1388,14 @@ var Input = (0, import_react6.memo)(
1456
1388
  }
1457
1389
  );
1458
1390
  default:
1459
- return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(TextInput, { ...props });
1391
+ return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(TextInput, { ...props });
1460
1392
  }
1461
1393
  }, [type, props]);
1462
1394
  }
1463
1395
  );
1464
1396
 
1465
1397
  // src/components/Fields/Radio/index.tsx
1466
- var import_jsx_runtime12 = require("react/jsx-runtime");
1398
+ var import_jsx_runtime11 = require("react/jsx-runtime");
1467
1399
  var Radio = ({
1468
1400
  value,
1469
1401
  onChange,
@@ -1485,7 +1417,7 @@ var Radio = ({
1485
1417
  className,
1486
1418
  style
1487
1419
  }) => {
1488
- return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
1420
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
1489
1421
  InputWrapper_default,
1490
1422
  {
1491
1423
  type,
@@ -1501,16 +1433,16 @@ var Radio = ({
1501
1433
  style,
1502
1434
  hideLayout: true,
1503
1435
  children: [
1504
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, { icon }),
1436
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(Icon, { icon }),
1505
1437
  options.filter((option) => typeof option === "string" || !option.hide).map((option) => {
1506
1438
  const opt = typeof option === "string" ? { value: option, label: option } : option;
1507
- return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
1439
+ return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
1508
1440
  "label",
1509
1441
  {
1510
1442
  htmlFor: `${id}-${opt.value}`,
1511
1443
  className: value === opt.value ? "form-field--has-value" : "",
1512
1444
  children: [
1513
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1445
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
1514
1446
  "input",
1515
1447
  {
1516
1448
  name,
@@ -1526,7 +1458,7 @@ var Radio = ({
1526
1458
  disabled: opt.disabled || disabled
1527
1459
  }
1528
1460
  ),
1529
- /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("div", { children: opt.label })
1461
+ /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("div", { children: opt.label })
1530
1462
  ]
1531
1463
  },
1532
1464
  opt.value
@@ -1538,7 +1470,7 @@ var Radio = ({
1538
1470
  };
1539
1471
 
1540
1472
  // src/components/Fields/Select/index.tsx
1541
- var import_jsx_runtime13 = require("react/jsx-runtime");
1473
+ var import_jsx_runtime12 = require("react/jsx-runtime");
1542
1474
  var Select = ({
1543
1475
  value,
1544
1476
  onChange,
@@ -1565,13 +1497,13 @@ var Select = ({
1565
1497
  }) => {
1566
1498
  const renderOption = (option) => {
1567
1499
  if (typeof option === "string") {
1568
- return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("option", { value: option, children: option }, option);
1500
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("option", { value: option, children: option }, option);
1569
1501
  }
1570
1502
  if ("options" in option) {
1571
- return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("optgroup", { label: option.label, children: option.options.map(renderOption) }, option.label);
1503
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)("optgroup", { label: option.label, children: option.options.map(renderOption) }, option.label);
1572
1504
  }
1573
1505
  if (option.hide) return null;
1574
- return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
1506
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
1575
1507
  "option",
1576
1508
  {
1577
1509
  value: option.value,
@@ -1581,7 +1513,7 @@ var Select = ({
1581
1513
  option.value
1582
1514
  );
1583
1515
  };
1584
- return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
1516
+ return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
1585
1517
  InputWrapper_default,
1586
1518
  {
1587
1519
  type,
@@ -1597,8 +1529,8 @@ var Select = ({
1597
1529
  className: `${className ?? ""} ${multiple ? "form-field__select-multiple" : "form-field__select-single"}`,
1598
1530
  style,
1599
1531
  children: [
1600
- /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Icon, { icon }),
1601
- /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
1532
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(Icon, { icon }),
1533
+ /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
1602
1534
  "select",
1603
1535
  {
1604
1536
  name,
@@ -1624,7 +1556,7 @@ var Select = ({
1624
1556
  multiple,
1625
1557
  "aria-label": label || placeholder,
1626
1558
  children: [
1627
- placeholder && /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)("option", { value: "", selected: true, disabled: true, children: [
1559
+ placeholder && /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)("option", { value: "", selected: true, disabled: true, children: [
1628
1560
  placeholder,
1629
1561
  !label && required ? " *" : ""
1630
1562
  ] }),
@@ -1638,7 +1570,7 @@ var Select = ({
1638
1570
  };
1639
1571
 
1640
1572
  // src/components/Fields/Textarea/index.tsx
1641
- var import_jsx_runtime14 = require("react/jsx-runtime");
1573
+ var import_jsx_runtime13 = require("react/jsx-runtime");
1642
1574
  var Textarea = ({
1643
1575
  value,
1644
1576
  onChange,
@@ -1663,7 +1595,7 @@ var Textarea = ({
1663
1595
  className,
1664
1596
  style
1665
1597
  }) => {
1666
- return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
1598
+ return /* @__PURE__ */ (0, import_jsx_runtime13.jsxs)(
1667
1599
  InputWrapper_default,
1668
1600
  {
1669
1601
  type,
@@ -1679,8 +1611,8 @@ var Textarea = ({
1679
1611
  className,
1680
1612
  style,
1681
1613
  children: [
1682
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Icon, { icon }),
1683
- /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
1614
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(Icon, { icon }),
1615
+ /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
1684
1616
  "textarea",
1685
1617
  {
1686
1618
  name,
@@ -1708,76 +1640,12 @@ var Textarea = ({
1708
1640
  );
1709
1641
  };
1710
1642
 
1711
- // src/components/Link/index.tsx
1712
- var import_react7 = __toESM(require("react"), 1);
1713
- var import_jsx_runtime15 = require("react/jsx-runtime");
1714
- var LinkComponent = ({
1715
- label,
1716
- to = "#",
1717
- onClick,
1718
- color = "default",
1719
- size = "md",
1720
- block = false,
1721
- loading = false,
1722
- disabled = false,
1723
- className = "",
1724
- ariaLabel = "",
1725
- navigate,
1726
- external = false,
1727
- style = {},
1728
- children
1729
- }) => {
1730
- const isDisabled = disabled || loading;
1731
- const isExternal = external || /^(https?:|mailto:|tel:|ftp:)/.test(to);
1732
- const handleClick = (e) => {
1733
- if (isDisabled) {
1734
- e.preventDefault();
1735
- return;
1736
- }
1737
- onClick?.(e);
1738
- if (!isExternal && navigate) {
1739
- e.preventDefault();
1740
- navigate();
1741
- }
1742
- };
1743
- const linkClasses = [
1744
- "link",
1745
- `link--${color}`,
1746
- `btn--${size}`,
1747
- block && "link--block",
1748
- loading && "link--loading",
1749
- isDisabled && "link--disabled",
1750
- className
1751
- ].filter(Boolean).join(" ");
1752
- return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
1753
- "a",
1754
- {
1755
- href: isDisabled ? void 0 : to,
1756
- onClick: handleClick,
1757
- className: linkClasses,
1758
- style,
1759
- "aria-label": ariaLabel || label,
1760
- "aria-busy": loading,
1761
- "aria-disabled": isDisabled,
1762
- target: isExternal ? "_blank" : void 0,
1763
- rel: isExternal ? "noopener noreferrer" : void 0,
1764
- children: loading ? /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
1765
- /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "btn__spinner", "aria-hidden": "true", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("svg", { viewBox: "0 0 20 20", children: /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("circle", { cx: "10", cy: "10", r: "8" }) }) }),
1766
- /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "btn__loading-text", children: "Processing..." })
1767
- ] }) : /* @__PURE__ */ (0, import_jsx_runtime15.jsxs)(import_jsx_runtime15.Fragment, { children: [
1768
- children,
1769
- label && /* @__PURE__ */ (0, import_jsx_runtime15.jsx)("span", { className: "btn__label", children: label })
1770
- ] })
1771
- }
1772
- );
1773
- };
1774
- var Link = import_react7.default.memo(LinkComponent);
1775
-
1776
1643
  // src/components/Form.tsx
1777
- var import_jsx_runtime16 = require("react/jsx-runtime");
1778
- var import_react9 = require("react");
1779
- var DefaultContainer = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { children });
1780
- var DefaultButtonContainer = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "btn-group", children });
1644
+ var import_ui_core4 = require("@sio-group/ui-core");
1645
+ var import_jsx_runtime14 = require("react/jsx-runtime");
1646
+ var import_react7 = require("react");
1647
+ var DefaultContainer = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { children });
1648
+ var DefaultButtonContainer = ({ children }) => /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "btn-group", children });
1781
1649
  var Form = ({
1782
1650
  fields,
1783
1651
  layout = [],
@@ -1801,13 +1669,13 @@ var Form = ({
1801
1669
  const loadElement = (field, renderLayout = false) => {
1802
1670
  switch (field.type) {
1803
1671
  case "textarea":
1804
- return /* @__PURE__ */ (0, import_react9.createElement)(Textarea, { ...register(field.name, field, renderLayout), key: field.name });
1672
+ return /* @__PURE__ */ (0, import_react7.createElement)(Textarea, { ...register(field.name, field, renderLayout), key: field.name });
1805
1673
  case "checkbox":
1806
- return /* @__PURE__ */ (0, import_react9.createElement)(Checkbox, { ...register(field.name, field, renderLayout), key: field.name });
1674
+ return /* @__PURE__ */ (0, import_react7.createElement)(Checkbox, { ...register(field.name, field, renderLayout), key: field.name });
1807
1675
  case "radio":
1808
- return /* @__PURE__ */ (0, import_react9.createElement)(Radio, { ...register(field.name, field, renderLayout), key: field.name });
1676
+ return /* @__PURE__ */ (0, import_react7.createElement)(Radio, { ...register(field.name, field, renderLayout), key: field.name });
1809
1677
  case "select":
1810
- return /* @__PURE__ */ (0, import_react9.createElement)(Select, { ...register(field.name, field, renderLayout), key: field.name });
1678
+ return /* @__PURE__ */ (0, import_react7.createElement)(Select, { ...register(field.name, field, renderLayout), key: field.name });
1811
1679
  case "text":
1812
1680
  case "search":
1813
1681
  case "email":
@@ -1822,9 +1690,9 @@ var Form = ({
1822
1690
  case "color":
1823
1691
  case "file":
1824
1692
  case "hidden":
1825
- return /* @__PURE__ */ (0, import_react9.createElement)(Input, { ...register(field.name, field, renderLayout), key: field.name });
1693
+ return /* @__PURE__ */ (0, import_react7.createElement)(Input, { ...register(field.name, field, renderLayout), key: field.name });
1826
1694
  default:
1827
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("div", { children: [
1695
+ return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("div", { children: [
1828
1696
  field.type,
1829
1697
  " to implement"
1830
1698
  ] }, field.name);
@@ -1836,7 +1704,7 @@ var Form = ({
1836
1704
  const content = target.map((element) => {
1837
1705
  if ("fields" in element) {
1838
1706
  const classes = getColumnClasses(element.layout, element.layout?.className);
1839
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1707
+ return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
1840
1708
  "div",
1841
1709
  {
1842
1710
  className: classes,
@@ -1851,9 +1719,9 @@ var Form = ({
1851
1719
  }
1852
1720
  return loadElement(element, hasLayout);
1853
1721
  });
1854
- return hasLayout ? /* @__PURE__ */ (0, import_jsx_runtime16.jsx)("div", { className: "sio-row", children: content }) : content;
1722
+ return hasLayout ? /* @__PURE__ */ (0, import_jsx_runtime14.jsx)("div", { className: "sio-row", children: content }) : content;
1855
1723
  };
1856
- const fieldMap = (0, import_react8.useMemo)(() => {
1724
+ const fieldMap = (0, import_react6.useMemo)(() => {
1857
1725
  const map = /* @__PURE__ */ new Map();
1858
1726
  fields.forEach((f) => map.set(f.name, f));
1859
1727
  return map;
@@ -1867,12 +1735,12 @@ var Form = ({
1867
1735
  reset();
1868
1736
  };
1869
1737
  const renderButton = (props, i) => {
1870
- return props.type === "link" ? /* @__PURE__ */ (0, import_react9.createElement)(Link, { ...props, key: i }) : /* @__PURE__ */ (0, import_react9.createElement)(Button, { ...props, key: i });
1738
+ return props.type === "link" ? /* @__PURE__ */ (0, import_react7.createElement)(import_ui_core4.Link, { ...props, key: i }) : /* @__PURE__ */ (0, import_react7.createElement)(import_ui_core4.Button, { ...props, key: i });
1871
1739
  };
1872
1740
  const renderButtons = () => {
1873
- return submitShow || cancelShow || buttons.length ? /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(ButtonContainer, { children: [
1874
- submitShow && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1875
- Button,
1741
+ return submitShow || cancelShow || buttons.length ? /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(ButtonContainer, { children: [
1742
+ submitShow && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
1743
+ import_ui_core4.Button,
1876
1744
  {
1877
1745
  type: "submit",
1878
1746
  onClick: handleSubmit,
@@ -1882,33 +1750,30 @@ var Form = ({
1882
1750
  disabled: !isValid() || !extraValidation(getValues())
1883
1751
  }
1884
1752
  ),
1885
- cancelShow && /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
1886
- Button,
1753
+ cancelShow && /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
1754
+ import_ui_core4.Button,
1887
1755
  {
1888
1756
  type: "button",
1889
1757
  onClick: handleCancel,
1890
1758
  variant: "secondary",
1891
- label: cancelLabel,
1892
- disabled: !isDirty()
1759
+ label: cancelLabel
1893
1760
  }
1894
1761
  ),
1895
1762
  buttons?.map(renderButton)
1896
1763
  ] }) : null;
1897
1764
  };
1898
- return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)("form", { className, style, noValidate: true, children: [
1899
- /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(Container, { children: renderFields() }),
1765
+ return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)("form", { className, style, noValidate: true, children: [
1766
+ /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(Container, { children: renderFields() }),
1900
1767
  renderButtons()
1901
1768
  ] });
1902
1769
  };
1903
1770
  // Annotate the CommonJS export names for ESM import in node:
1904
1771
  0 && (module.exports = {
1905
- Button,
1906
1772
  Checkbox,
1907
1773
  DateInput,
1908
1774
  FileInput,
1909
1775
  Form,
1910
1776
  Input,
1911
- Link,
1912
1777
  NumberInput,
1913
1778
  Radio,
1914
1779
  RangeInput,