@tsed/react-formio 3.0.0-rc.25 → 3.0.0-rc.26

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.
@@ -1,100 +1,97 @@
1
- import { jsx as x } from "react/jsx-runtime";
2
- import { C as w } from "../../../../chunks/choices.js";
1
+ import { jsx as k } from "react/jsx-runtime";
2
+ import { C as p } from "../../../../chunks/choices.js";
3
3
  import { c as O } from "../../../../chunks/clsx.js";
4
- import { useRef as S, useMemo as z, useEffect as p } from "react";
5
- import { c as M } from "../../../../chunks/index.module.js";
6
- import { registerComponent as $ } from "../../../../registries/components.js";
7
- import { cleanFormControlProps as g } from "../../form-control/FormControl.js";
8
- import { callbackOnCreateTemplates as j } from "./choices.template.js";
9
- function B({
4
+ import { useRef as S, useMemo as w, useEffect as E } from "react";
5
+ import { registerComponent as z } from "../../../../registries/components.js";
6
+ import { cleanFormControlProps as M } from "../../form-control/FormControl.js";
7
+ import { callbackOnCreateTemplates as $ } from "./choices.template.js";
8
+ function j({
10
9
  name: r,
11
10
  disabled: i,
12
- multiple: c,
13
- options: f,
14
- placeholder: l,
15
- searchEnabled: d = !0,
16
- customProperties: v = {},
17
- size: E,
18
- value: a,
19
- required: C,
20
- onChange: b
11
+ multiple: s,
12
+ options: d,
13
+ placeholder: n,
14
+ searchEnabled: v = !0,
15
+ customProperties: f = {},
16
+ size: h,
17
+ value: o,
18
+ required: b,
19
+ onChange: u
21
20
  }) {
22
- const h = S(), t = S(), m = z(() => {
23
- const n = (e) => [].concat(a).includes(e), s = f.map((e) => (e.options && (e = {
21
+ const C = S(), t = S(), l = w(() => {
22
+ const a = (e) => [].concat(o).includes(e), m = d.map((e) => (e.options && (e = {
24
23
  ...e,
25
- choices: e.options.map((o) => ({
26
- ...o,
27
- selected: n(o.value)
24
+ choices: e.options.map((c) => ({
25
+ ...c,
26
+ selected: a(c.value)
28
27
  }))
29
28
  }), {
30
29
  ...e,
31
- selected: n(e.value)
30
+ selected: a(e.value)
32
31
  }));
33
- return !c && l ? [
32
+ return !s && n ? [
34
33
  {
35
- disabled: C,
36
- label: l,
34
+ disabled: b,
35
+ label: n,
37
36
  value: ""
38
37
  },
39
- ...s
40
- ] : s;
41
- }, [f, a, C, c, l]), u = M((n, s) => {
42
- b?.(n, s);
43
- }, 50);
44
- return p(() => {
45
- t.current && (c && t.current.clearStore(), t.current.setChoices(m, "value", "label", !0));
46
- }, [m]), p(() => {
38
+ ...m
39
+ ] : m;
40
+ }, [d, o, b, s, n]);
41
+ return E(() => {
42
+ t.current && (s && t.current.clearStore(), t.current.setChoices(l, "value", "label", !0));
43
+ }, [s, l]), E(() => {
47
44
  if (!t.current) {
48
45
  const {
49
46
  allowHTML: e = !0,
50
- silent: o = !0,
51
- removeItemButton: I = !0,
52
- shouldSort: T = !1,
47
+ silent: c = !0,
48
+ removeItemButton: T = !0,
49
+ shouldSort: I = !1,
53
50
  itemSelectText: L = "",
54
- callbackOnCreateTemplates: k
55
- } = v;
56
- t.current = new w(h.current, {
57
- ...v,
51
+ callbackOnCreateTemplates: x
52
+ } = f;
53
+ t.current = new p(C.current, {
54
+ ...f,
58
55
  allowHTML: e,
59
- silent: o,
60
- searchEnabled: d,
61
- removeItemButton: I,
62
- choices: m,
63
- placeholder: l,
56
+ silent: c,
57
+ searchEnabled: v,
58
+ removeItemButton: T,
59
+ choices: l,
60
+ placeholder: n,
64
61
  placeholderValue: "",
65
62
  itemSelectText: L,
66
- shouldSort: T,
67
- callbackOnCreateTemplates: k || j
63
+ shouldSort: I,
64
+ callbackOnCreateTemplates: x || $
68
65
  });
69
66
  }
70
67
  i ? t.current?.disable() : t.current?.enable();
71
- const n = ({ detail: { value: e } }) => {
72
- u(r, c ? [.../* @__PURE__ */ new Set([...new Set(a), e])] : e);
73
- }, s = ({ detail: { value: e } }) => {
74
- c ? u(
68
+ const a = ({ detail: { value: e } }) => {
69
+ u?.(r, s ? [.../* @__PURE__ */ new Set([...o, e])] : e);
70
+ }, m = ({ detail: { value: e } }) => {
71
+ s ? u?.(
75
72
  r,
76
- a.filter((o) => o !== e)
77
- ) : u(r, void 0);
73
+ o.filter((c) => c !== e)
74
+ ) : u?.(r, void 0);
78
75
  };
79
- return t.current?.passedElement.element.addEventListener("addItem", n), t.current?.passedElement.element.addEventListener("removeItem", s), () => {
80
- t.current?.passedElement.element.removeEventListener("addItem", n), t.current?.passedElement.element.removeEventListener("removeItem", s);
76
+ return t.current?.passedElement.element.addEventListener("addItem", a), t.current?.passedElement.element.addEventListener("removeItem", m), () => {
77
+ t.current?.passedElement.element.removeEventListener("addItem", a), t.current?.passedElement.element.removeEventListener("removeItem", m);
81
78
  };
82
- }, [i, b, m, l, d, E, a]), {
83
- ref: h,
79
+ }, [f, i, s, r, u, l, n, v, h, o]), {
80
+ ref: C,
84
81
  choicesRef: t
85
82
  };
86
83
  }
87
- function H(r) {
88
- const { ref: i } = B({
84
+ function B(r) {
85
+ const { ref: i } = j({
89
86
  ...r,
90
87
  searchEnabled: !r.disableSearch
91
88
  });
92
- return /* @__PURE__ */ x(
89
+ return /* @__PURE__ */ k(
93
90
  "select",
94
91
  {
95
92
  ref: i,
96
93
  "data-testid": `select_${r.name}`,
97
- ...g(r, [
94
+ ...M(r, [
98
95
  "className",
99
96
  "size",
100
97
  "value",
@@ -112,9 +109,9 @@ function H(r) {
112
109
  }
113
110
  );
114
111
  }
115
- $("Select.choicesjs", H);
112
+ z("Select.choicesjs", B);
116
113
  export {
117
- H as ChoiceSelect,
118
- B as useChoices
114
+ B as ChoiceSelect,
115
+ j as useChoices
119
116
  };
120
117
  //# sourceMappingURL=ChoicesSelect.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"ChoicesSelect.js","sources":["../../../../../src/molecules/forms/select/components/ChoicesSelect.tsx"],"sourcesContent":["import Choices from \"choices.js\";\nimport cx from \"clsx\";\nimport { useEffect, useMemo, useRef } from \"react\";\nimport { useDebouncedCallback } from \"use-debounce\";\n\nimport { registerComponent } from \"../../../../registries/components\";\nimport { cleanFormControlProps } from \"../../form-control/FormControl\";\nimport type { AllSelectProps } from \"../Select.interface\";\nimport { callbackOnCreateTemplates as defaultTemplateCallback } from \"./choices.template\";\n\nexport function useChoices({\n name,\n disabled,\n multiple,\n options,\n placeholder,\n searchEnabled = true,\n customProperties = {},\n size,\n value,\n required,\n onChange\n}: AllSelectProps) {\n const ref = useRef<any>();\n const choicesRef = useRef<Choices>();\n\n const opts = useMemo(() => {\n const isSelected = (itemValue: any) => [].concat(value as any).includes(itemValue as never);\n\n const opts = options.map((item) => {\n if (item.options) {\n item = {\n ...item,\n choices: item.options.map((item: any) => ({\n ...item,\n selected: isSelected(item.value)\n }))\n };\n }\n\n return {\n ...item,\n selected: isSelected(item.value)\n };\n });\n\n if (!multiple && placeholder) {\n return [\n {\n disabled: required,\n label: placeholder,\n value: \"\"\n },\n ...opts\n ];\n }\n\n return opts;\n }, [options, value, required, multiple, placeholder]);\n\n const onChangeCallback = useDebouncedCallback((name: string | undefined, value: any) => {\n onChange?.(name, value);\n }, 50);\n\n useEffect(() => {\n if (choicesRef.current) {\n if (multiple) {\n choicesRef.current.clearStore();\n choicesRef.current.setChoices(opts as any, \"value\", \"label\", true);\n } else {\n choicesRef.current.setChoices(opts as any, \"value\", \"label\", true);\n }\n }\n }, [opts]);\n\n useEffect(() => {\n if (!choicesRef.current) {\n const {\n allowHTML = true,\n silent = true,\n removeItemButton = true,\n shouldSort = false,\n itemSelectText = \"\",\n callbackOnCreateTemplates\n } = customProperties;\n choicesRef.current = new Choices(ref.current, {\n ...customProperties,\n allowHTML,\n silent,\n searchEnabled,\n removeItemButton,\n choices: opts,\n placeholder: placeholder as string,\n placeholderValue: \"\" as string,\n itemSelectText,\n shouldSort,\n callbackOnCreateTemplates: callbackOnCreateTemplates || defaultTemplateCallback\n } as any);\n }\n\n if (disabled) {\n choicesRef.current?.disable();\n } else {\n choicesRef.current?.enable();\n }\n\n const addItem = ({ detail: { value: newValue } }: any) => {\n onChangeCallback(name, multiple ? [...new Set([...new Set(value as string[]), newValue])] : newValue);\n };\n\n const removeItem = ({ detail: { value: newValue } }: any) => {\n if (multiple) {\n onChangeCallback(\n name,\n (value as string[]).filter((v) => v !== newValue)\n );\n } else {\n onChangeCallback(name, undefined as any);\n }\n };\n\n choicesRef.current?.passedElement.element.addEventListener(\"addItem\", addItem);\n choicesRef.current?.passedElement.element.addEventListener(\"removeItem\", removeItem);\n\n return () => {\n choicesRef.current?.passedElement.element.removeEventListener(\"addItem\", addItem);\n choicesRef.current?.passedElement.element.removeEventListener(\"removeItem\", removeItem);\n };\n }, [disabled, onChange, opts, placeholder, searchEnabled, size, value]);\n\n return {\n ref,\n choicesRef\n };\n}\n\nexport function ChoiceSelect(props: AllSelectProps) {\n const { ref } = useChoices({\n ...props,\n searchEnabled: !props.disableSearch\n });\n\n return (\n <select\n ref={ref}\n data-testid={`select_${props.name}`}\n {...cleanFormControlProps(props as any, [\n \"className\",\n \"size\",\n \"value\",\n \"options\",\n \"placeholder\",\n \"onChange\",\n \"allowHTML\",\n \"silent\",\n \"removeItemButton\",\n \"shouldSort\",\n \"itemSelectText\",\n \"customProperties\"\n ])}\n className={cx(\"form-control\", props.size && `form-control-${props.size}`)}\n />\n );\n}\n\nregisterComponent(\"Select.choicesjs\", ChoiceSelect);\n"],"names":["useChoices","name","disabled","multiple","options","placeholder","searchEnabled","customProperties","size","value","required","onChange","ref","useRef","choicesRef","opts","useMemo","isSelected","itemValue","item","onChangeCallback","useDebouncedCallback","useEffect","allowHTML","silent","removeItemButton","shouldSort","itemSelectText","callbackOnCreateTemplates","Choices","defaultTemplateCallback","addItem","newValue","removeItem","v","ChoiceSelect","props","jsx","cleanFormControlProps","cx","registerComponent"],"mappings":"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"}
1
+ {"version":3,"file":"ChoicesSelect.js","sources":["../../../../../src/molecules/forms/select/components/ChoicesSelect.tsx"],"sourcesContent":["import Choices from \"choices.js\";\nimport cx from \"clsx\";\nimport { useEffect, useMemo, useRef } from \"react\";\n\nimport { registerComponent } from \"../../../../registries/components\";\nimport { cleanFormControlProps } from \"../../form-control/FormControl\";\nimport type { AllSelectProps } from \"../Select.interface\";\nimport { callbackOnCreateTemplates as defaultTemplateCallback } from \"./choices.template\";\n\nexport function useChoices({\n name,\n disabled,\n multiple,\n options,\n placeholder,\n searchEnabled = true,\n customProperties = {},\n size,\n value,\n required,\n onChange\n}: AllSelectProps) {\n const ref = useRef<any>();\n const choicesRef = useRef<Choices>();\n\n const opts = useMemo(() => {\n const isSelected = (itemValue: any) => [].concat(value as any).includes(itemValue as never);\n\n const opts = options.map((item: any) => {\n if (item.options) {\n item = {\n ...item,\n choices: item.options.map((optionItem: any) => ({\n ...optionItem,\n selected: isSelected(optionItem.value)\n }))\n };\n }\n\n return {\n ...item,\n selected: isSelected(item.value)\n };\n });\n\n if (!multiple && placeholder) {\n return [\n {\n disabled: required,\n label: placeholder,\n value: \"\"\n },\n ...opts\n ];\n }\n\n return opts;\n }, [options, value, required, multiple, placeholder]);\n\n useEffect(() => {\n if (choicesRef.current) {\n if (multiple) {\n choicesRef.current.clearStore();\n choicesRef.current.setChoices(opts as any, \"value\", \"label\", true);\n } else {\n choicesRef.current.setChoices(opts as any, \"value\", \"label\", true);\n }\n }\n }, [multiple, opts]);\n\n useEffect(() => {\n if (!choicesRef.current) {\n const {\n allowHTML = true,\n silent = true,\n removeItemButton = true,\n shouldSort = false,\n itemSelectText = \"\",\n callbackOnCreateTemplates\n } = customProperties as any;\n\n choicesRef.current = new Choices(ref.current, {\n ...(customProperties as any),\n allowHTML,\n silent,\n searchEnabled,\n removeItemButton,\n choices: opts,\n placeholder: placeholder as string,\n placeholderValue: \"\" as string,\n itemSelectText,\n shouldSort,\n callbackOnCreateTemplates: callbackOnCreateTemplates || defaultTemplateCallback\n } as any);\n }\n\n if (disabled) {\n choicesRef.current?.disable();\n } else {\n choicesRef.current?.enable();\n }\n\n const addItem = ({ detail: { value: newValue } }: any) => {\n onChange?.(name, multiple ? [...new Set([...(value as string[]), newValue])] : newValue);\n };\n\n const removeItem = ({ detail: { value: newValue } }: any) => {\n if (multiple) {\n onChange?.(\n name,\n (value as string[]).filter((v) => v !== newValue)\n );\n } else {\n onChange?.(name, undefined as any);\n }\n };\n\n choicesRef.current?.passedElement.element.addEventListener(\"addItem\", addItem);\n choicesRef.current?.passedElement.element.addEventListener(\"removeItem\", removeItem);\n\n return () => {\n choicesRef.current?.passedElement.element.removeEventListener(\"addItem\", addItem);\n choicesRef.current?.passedElement.element.removeEventListener(\"removeItem\", removeItem);\n };\n }, [customProperties, disabled, multiple, name, onChange, opts, placeholder, searchEnabled, size, value]);\n\n return {\n ref,\n choicesRef\n };\n}\n\nexport function ChoiceSelect(props: AllSelectProps) {\n const { ref } = useChoices({\n ...props,\n searchEnabled: !props.disableSearch\n });\n\n return (\n <select\n ref={ref}\n data-testid={`select_${props.name}`}\n {...cleanFormControlProps(props as any, [\n \"className\",\n \"size\",\n \"value\",\n \"options\",\n \"placeholder\",\n \"onChange\",\n \"allowHTML\",\n \"silent\",\n \"removeItemButton\",\n \"shouldSort\",\n \"itemSelectText\",\n \"customProperties\"\n ])}\n className={cx(\"form-control\", props.size && `form-control-${props.size}`)}\n />\n );\n}\n\nregisterComponent(\"Select.choicesjs\", ChoiceSelect);\n"],"names":["useChoices","name","disabled","multiple","options","placeholder","searchEnabled","customProperties","size","value","required","onChange","ref","useRef","choicesRef","opts","useMemo","isSelected","itemValue","item","optionItem","useEffect","allowHTML","silent","removeItemButton","shouldSort","itemSelectText","callbackOnCreateTemplates","Choices","defaultTemplateCallback","addItem","newValue","removeItem","v","ChoiceSelect","props","jsx","cleanFormControlProps","cx","registerComponent"],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tsed/react-formio",
3
- "version": "3.0.0-rc.25",
3
+ "version": "3.0.0-rc.26",
4
4
  "description": "Provide a react formio wrapper. Written in TypeScript.",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -44,8 +44,8 @@
44
44
  },
45
45
  "devDependencies": {
46
46
  "@tanstack/react-table": ">=8.20.6",
47
- "@tsed/tailwind-formio": "3.0.0-rc.25",
48
- "@tsed/typescript": "3.0.0-rc.25",
47
+ "@tsed/tailwind-formio": "3.0.0-rc.26",
48
+ "@tsed/typescript": "3.0.0-rc.26",
49
49
  "microbundle": "0.13.0",
50
50
  "vite": "7.1.5",
51
51
  "vitest": "3.2.4"
@@ -1,7 +1,6 @@
1
1
  import Choices from "choices.js";
2
2
  import cx from "clsx";
3
3
  import { useEffect, useMemo, useRef } from "react";
4
- import { useDebouncedCallback } from "use-debounce";
5
4
 
6
5
  import { registerComponent } from "../../../../registries/components";
7
6
  import { cleanFormControlProps } from "../../form-control/FormControl";
@@ -27,13 +26,13 @@ export function useChoices({
27
26
  const opts = useMemo(() => {
28
27
  const isSelected = (itemValue: any) => [].concat(value as any).includes(itemValue as never);
29
28
 
30
- const opts = options.map((item) => {
29
+ const opts = options.map((item: any) => {
31
30
  if (item.options) {
32
31
  item = {
33
32
  ...item,
34
- choices: item.options.map((item: any) => ({
35
- ...item,
36
- selected: isSelected(item.value)
33
+ choices: item.options.map((optionItem: any) => ({
34
+ ...optionItem,
35
+ selected: isSelected(optionItem.value)
37
36
  }))
38
37
  };
39
38
  }
@@ -58,10 +57,6 @@ export function useChoices({
58
57
  return opts;
59
58
  }, [options, value, required, multiple, placeholder]);
60
59
 
61
- const onChangeCallback = useDebouncedCallback((name: string | undefined, value: any) => {
62
- onChange?.(name, value);
63
- }, 50);
64
-
65
60
  useEffect(() => {
66
61
  if (choicesRef.current) {
67
62
  if (multiple) {
@@ -71,7 +66,7 @@ export function useChoices({
71
66
  choicesRef.current.setChoices(opts as any, "value", "label", true);
72
67
  }
73
68
  }
74
- }, [opts]);
69
+ }, [multiple, opts]);
75
70
 
76
71
  useEffect(() => {
77
72
  if (!choicesRef.current) {
@@ -82,9 +77,10 @@ export function useChoices({
82
77
  shouldSort = false,
83
78
  itemSelectText = "",
84
79
  callbackOnCreateTemplates
85
- } = customProperties;
80
+ } = customProperties as any;
81
+
86
82
  choicesRef.current = new Choices(ref.current, {
87
- ...customProperties,
83
+ ...(customProperties as any),
88
84
  allowHTML,
89
85
  silent,
90
86
  searchEnabled,
@@ -105,17 +101,17 @@ export function useChoices({
105
101
  }
106
102
 
107
103
  const addItem = ({ detail: { value: newValue } }: any) => {
108
- onChangeCallback(name, multiple ? [...new Set([...new Set(value as string[]), newValue])] : newValue);
104
+ onChange?.(name, multiple ? [...new Set([...(value as string[]), newValue])] : newValue);
109
105
  };
110
106
 
111
107
  const removeItem = ({ detail: { value: newValue } }: any) => {
112
108
  if (multiple) {
113
- onChangeCallback(
109
+ onChange?.(
114
110
  name,
115
111
  (value as string[]).filter((v) => v !== newValue)
116
112
  );
117
113
  } else {
118
- onChangeCallback(name, undefined as any);
114
+ onChange?.(name, undefined as any);
119
115
  }
120
116
  };
121
117
 
@@ -126,7 +122,7 @@ export function useChoices({
126
122
  choicesRef.current?.passedElement.element.removeEventListener("addItem", addItem);
127
123
  choicesRef.current?.passedElement.element.removeEventListener("removeItem", removeItem);
128
124
  };
129
- }, [disabled, onChange, opts, placeholder, searchEnabled, size, value]);
125
+ }, [customProperties, disabled, multiple, name, onChange, opts, placeholder, searchEnabled, size, value]);
130
126
 
131
127
  return {
132
128
  ref,