@tsed/react-formio 3.0.0-alpha.8 → 3.0.0-rc.1

package/dist/molecules/forms/input-text/InputText.js

@@ -1,64 +1,54 @@
-import { jsx as p } from "react/jsx-runtime";
-import { c as I } from "../../../chunks/index.js";
-import { useState as T, useEffect as $ } from "react";
-import { c as j } from "../../../chunks/index.module.js";
-import { registerComponent as v } from "../../../registries/components.js";
-import { getEventValue as y } from "../../../utils/getEventValue.js";
-import { FormControl as F } from "../form-control/FormControl.js";
-function N({
-  name: t,
-  id: s = t,
-  value: o,
-  label: f,
-  onChange: i,
-  required: r,
-  size: e,
-  type: l,
-  prefix: u,
-  suffix: a,
-  description: x,
-  className: g,
-  placeholder: h,
-  debounceDelay: C = 300,
-  ...V
-}) {
-  const [d, n] = T(o), m = j(i || (() => {
-  }), C);
-  return $(() => {
-    n(o);
-  }, [o]), /* @__PURE__ */ p(
-    F,
+import { jsx as s } from "react/jsx-runtime";
+import { useState as C, useEffect as I } from "react";
+import { c as x } from "../../../chunks/index.module.js";
+import { registerComponent as g, getComponent as v } from "../../../registries/components.js";
+import { getEventValue as b } from "../../../utils/getEventValue.js";
+import { cleanFormControlProps as y, FormControl as N } from "../form-control/FormControl.js";
+function V(o) {
+  const { name: e, id: n = e, value: t, onChange: r, required: a, type: u, placeholder: m, debounceDelay: c = 300, ...l } = o, [p, i] = C(t), f = x(r || (() => {
+  }), c);
+  return I(() => {
+    i(t);
+  }, [t]), /* @__PURE__ */ s(
+    "input",
     {
-      name: t,
-      label: f,
+      ...y(l, ["className"]),
+      type: u || "text",
+      "data-testid": `input_${e || ""}`,
+      className: "form-control",
+      id: n,
+      name: e,
+      required: a,
+      value: p || "",
+      placeholder: m,
+      onChange: (h) => {
+        const d = b(h);
+        return i(d), f && f(e, d);
+      }
+    }
+  );
+}
+g("Input", V);
+function q(o) {
+  const { name: e, id: n = e, label: t, required: r, size: a, before: u, after: m, description: c, className: l } = o, p = v("Input");
+  return /* @__PURE__ */ s(
+    N,
+    {
+      id: n,
+      name: e,
+      label: t,
       required: r,
-      description: x,
-      prefix: u,
-      suffix: a,
-      className: g,
-      children: /* @__PURE__ */ p(
-        "input",
-        {
-          type: l || "text",
-          ...V,
-          "data-testid": `input_${t}`,
-          className: I("form-control", e && `form-control-${e}`),
-          id: s,
-          name: t,
-          required: r,
-          value: d || "",
-          placeholder: h,
-          onChange: (E) => {
-            const c = y(E);
-            return n(c), m && m(t, c);
-          }
-        }
-      )
+      description: c,
+      before: u,
+      after: m,
+      size: a,
+      className: l,
+      children: /* @__PURE__ */ s(p, { ...o })
     }
   );
 }
-v("InputText", N);
+g("InputText", q);
 export {
-  N as InputText
+  q as InputText
 };
 //# sourceMappingURL=InputText.js.map

package/dist/molecules/forms/input-text/InputText.js.map

@@ -1 +1 @@
-{"version":3,"file":"InputText.js","sources":["../../../../src/molecules/forms/input-text/InputText.tsx"],"sourcesContent":["import classnames from \"classnames\";\nimport { useEffect, useState } from \"react\";\nimport { useDebouncedCallback } from \"use-debounce\";\n\nimport { registerComponent } from \"../../../registries/components\";\nimport { getEventValue } from \"../../../utils/getEventValue\";\nimport { FormControl, FormControlProps } from \"../form-control/FormControl\";\n\nexport interface InputTextProps<Data = any> extends FormControlProps<Data> {\n  type?: string;\n  value?: Data;\n  /**\n   * The input size\n   */\n  size?: \"small\" | string;\n  onChange?: (name: string, value: Data) => void;\n  placeholder?: string;\n  debounceDelay?: number;\n\n  [key: string]: any;\n}\n\nexport function InputText<T = any>({\n  name,\n  id = name,\n  value,\n  label,\n  onChange,\n  required,\n  size,\n  type,\n  prefix,\n  suffix,\n  description,\n  className,\n  placeholder,\n  debounceDelay = 300,\n  ...props\n}: InputTextProps<T>) {\n  const [localValue, setValue] = useState(value);\n  const change = useDebouncedCallback(onChange || (() => {}), debounceDelay);\n\n  useEffect(() => {\n    setValue(value);\n  }, [value]);\n\n  return (\n    <FormControl\n      name={name}\n      label={label}\n      required={required}\n      description={description}\n      prefix={prefix}\n      suffix={suffix}\n      className={className}\n    >\n      <input\n        type={type || \"text\"}\n        {...props}\n        data-testid={`input_${name}`}\n        className={classnames(\"form-control\", size && `form-control-${size}`)}\n        id={id}\n        name={name}\n        required={required}\n        value={(localValue || \"\") as any}\n        placeholder={placeholder}\n        onChange={(event) => {\n          const value = getEventValue(event);\n          setValue(value);\n\n          return change && change(name, value);\n        }}\n      />\n    </FormControl>\n  );\n}\n\nregisterComponent(\"InputText\", InputText);\n"],"names":["InputText","name","id","value","label","onChange","required","size","type","prefix","suffix","description","className","placeholder","debounceDelay","props","localValue","setValue","useState","change","useDebouncedCallback","useEffect","jsx","FormControl","classnames","event","getEventValue","registerComponent"],"mappings":";;;;;;;AAsBO,SAASA,EAAmB;AAAA,EACjC,MAAAC;AAAA,EACA,IAAAC,IAAKD;AAAA,EACL,OAAAE;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,MAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,GAAGC;AACL,GAAsB;AACpB,QAAM,CAACC,GAAYC,CAAQ,IAAIC,EAASf,CAAK,GACvCgB,IAASC,EAAqBf,MAAa,MAAM;AAAA,MAAKS,CAAa;AAEzE,SAAAO,EAAU,MAAM;AACd,IAAAJ,EAASd,CAAK;AAAA,EAAA,GACb,CAACA,CAAK,CAAC,GAGR,gBAAAmB;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,MAAAtB;AAAA,MACA,OAAAG;AAAA,MACA,UAAAE;AAAA,MACA,aAAAK;AAAA,MACA,QAAAF;AAAA,MACA,QAAAC;AAAA,MACA,WAAAE;AAAA,MAEA,UAAA,gBAAAU;AAAA,QAAC;AAAA,QAAA;AAAA,UACC,MAAMd,KAAQ;AAAA,UACb,GAAGO;AAAA,UACJ,eAAa,SAASd,CAAI;AAAA,UAC1B,WAAWuB,EAAW,gBAAgBjB,KAAQ,gBAAgBA,CAAI,EAAE;AAAA,UACpE,IAAAL;AAAA,UACA,MAAAD;AAAA,UACA,UAAAK;AAAA,UACA,OAAQU,KAAc;AAAA,UACtB,aAAAH;AAAA,UACA,UAAU,CAACY,MAAU;AACbtB,kBAAAA,IAAQuB,EAAcD,CAAK;AACjC,mBAAAR,EAASd,CAAK,GAEPgB,KAAUA,EAAOlB,GAAME,CAAK;AAAA,UAAA;AAAA,QACrC;AAAA,MAAA;AAAA,IACF;AAAA,EACF;AAEJ;AAEAwB,EAAkB,aAAa3B,CAAS;"}
+{"version":3,"file":"InputText.js","sources":["../../../../src/molecules/forms/input-text/InputText.tsx"],"sourcesContent":["import { ComponentType, useEffect, useState } from \"react\";\nimport { useDebouncedCallback } from \"use-debounce\";\n\nimport { getComponent, registerComponent } from \"../../../registries/components\";\nimport { getEventValue } from \"../../../utils/getEventValue\";\nimport { cleanFormControlProps, FormControl } from \"../form-control/FormControl\";\nimport { InputTextProps } from \"./InputText.interface\";\n\nfunction Input<Data = any>(props: InputTextProps<Data>) {\n  const { name, id = name, value, onChange, required, type, placeholder, debounceDelay = 300, ...otherProps } = props;\n\n  const [localValue, setValue] = useState(value);\n  const change = useDebouncedCallback(onChange || (() => {}), debounceDelay);\n\n  useEffect(() => {\n    setValue(value);\n  }, [value]);\n\n  return (\n    <input\n      {...cleanFormControlProps(otherProps, [\"className\"])}\n      type={type || \"text\"}\n      data-testid={`input_${name || \"\"}`}\n      className={\"form-control\"}\n      id={id}\n      name={name}\n      required={required}\n      value={(localValue || \"\") as any}\n      placeholder={placeholder}\n      onChange={(event) => {\n        const value = getEventValue(event);\n        setValue(value);\n\n        return change && change(name, value);\n      }}\n    />\n  );\n}\n\nregisterComponent(\"Input\", Input);\n\nexport function InputText<Data = any>(props: InputTextProps<Data>) {\n  const { name, id = name, label, required, size, before, after, description, className } = props;\n  const Input = getComponent<ComponentType<InputTextProps<Data>>>(\"Input\");\n\n  return (\n    <FormControl\n      id={id}\n      name={name}\n      label={label}\n      required={required}\n      description={description}\n      before={before}\n      after={after}\n      size={size}\n      className={className}\n    >\n      <Input {...props} />\n    </FormControl>\n  );\n}\n\nregisterComponent(\"InputText\", InputText);\n"],"names":["Input","props","name","id","value","onChange","required","type","placeholder","debounceDelay","otherProps","localValue","setValue","useState","change","useDebouncedCallback","useEffect","jsx","cleanFormControlProps","event","getEventValue","registerComponent","InputText","label","size","before","after","description","className","getComponent","FormControl"],"mappings":";;;;;;AAQA,SAASA,EAAkBC,GAA6B;AACtD,QAAM,EAAE,MAAAC,GAAM,IAAAC,IAAKD,GAAM,OAAAE,GAAO,UAAAC,GAAU,UAAAC,GAAU,MAAAC,GAAM,aAAAC,GAAa,eAAAC,IAAgB,KAAK,GAAGC,MAAeT,GAExG,CAACU,GAAYC,CAAQ,IAAIC,EAAST,CAAK,GACvCU,IAASC,EAAqBV,MAAa,MAAM;AAAA,EAAC,IAAII,CAAa;AAEzE,SAAAO,EAAU,MAAM;AACd,IAAAJ,EAASR,CAAK;AAAA,EAChB,GAAG,CAACA,CAAK,CAAC,GAGR,gBAAAa;AAAA,IAAC;AAAA,IAAA;AAAA,MACE,GAAGC,EAAsBR,GAAY,CAAC,WAAW,CAAC;AAAA,MACnD,MAAMH,KAAQ;AAAA,MACd,eAAa,SAASL,KAAQ,EAAE;AAAA,MAChC,WAAW;AAAA,MACX,IAAAC;AAAA,MACA,MAAAD;AAAA,MACA,UAAAI;AAAA,MACA,OAAQK,KAAc;AAAA,MACtB,aAAAH;AAAA,MACA,UAAU,CAACW,MAAU;AACnB,cAAMf,IAAQgB,EAAcD,CAAK;AACjC,eAAAP,EAASR,CAAK,GAEPU,KAAUA,EAAOZ,GAAME,CAAK;AAAA,MACrC;AAAA,IAAA;AAAA,EAAA;AAGN;AAEAiB,EAAkB,SAASrB,CAAK;AAEzB,SAASsB,EAAsBrB,GAA6B;AACjE,QAAM,EAAE,MAAAC,GAAM,IAAAC,IAAKD,GAAM,OAAAqB,GAAO,UAAAjB,GAAU,MAAAkB,GAAM,QAAAC,GAAQ,OAAAC,GAAO,aAAAC,GAAa,WAAAC,EAAA,IAAc3B,GACpFD,IAAQ6B,EAAkD,OAAO;AAEvE,SACE,gBAAAZ;AAAA,IAACa;AAAA,IAAA;AAAA,MACC,IAAA3B;AAAA,MACA,MAAAD;AAAA,MACA,OAAAqB;AAAA,MACA,UAAAjB;AAAA,MACA,aAAAqB;AAAA,MACA,QAAAF;AAAA,MACA,OAAAC;AAAA,MACA,MAAAF;AAAA,MACA,WAAAI;AAAA,MAEA,UAAA,gBAAAX,EAACjB,GAAA,EAAO,GAAGC,EAAA,CAAO;AAAA,IAAA;AAAA,EAAA;AAGxB;AAEAoB,EAAkB,aAAaC,CAAS;"}

package/dist/molecules/forms/select/Select.d.ts

@@ -1,2 +1,2 @@
-import { AllSelectProps } from './Select.interfaces';
+import { AllSelectProps } from './Select.interface';
 export declare function Select<Data = string>(props: AllSelectProps<Data>): import("react/jsx-runtime").JSX.Element;

package/dist/molecules/forms/select/{Select.interfaces.d.ts → Select.interface.d.ts}

@@ -1,4 +1,4 @@
-import { HTMLAttributes } from 'react';
+import { SelectHTMLAttributes } from 'react';
 import { FormControlProps } from '../form-control/FormControl';
 export interface SelectOptionBaseProps<Data = any> extends Record<string, any> {
     label: string | JSX.Element;
@@ -13,28 +13,26 @@ export interface SelectOptionBaseProps<Data = any> extends Record<string, any> {
 export interface SelectOptionProps<Data = string> extends SelectOptionBaseProps<Data> {
     options?: SelectOptionProps<Data>[];
 }
-export interface SelectProps<Data = string> extends FormControlProps, Omit<HTMLAttributes<HTMLSelectElement>, "onChange" | "prefix"> {
+export interface SelectProps<Data = string> extends FormControlProps<Data, SelectHTMLAttributes<HTMLSelectElement>> {
     layout?: "html5" | "react" | "choicesjs";
     /**
      * Error message
      */
     errorMessage?: string;
-    disabled?: boolean;
     readonly?: boolean;
-    size?: string;
-    options: (SelectOptionBaseProps<Data> | Omit<SelectOptionProps<Data>, "value">)[];
     disableSearch?: boolean;
     searchEnabled?: boolean;
     customProperties?: Record<string, any>;
+    options: (SelectOptionBaseProps<Data> | Omit<SelectOptionProps<Data>, "value">)[];
+    /**
+     * @deprecated
+     */
+    choices?: (SelectOptionBaseProps<Data> | Omit<SelectOptionProps<Data>, "value">)[];
 }
 export interface SelectSingle<Data = string> extends SelectProps<Data> {
     multiple?: false | undefined;
-    value?: Data;
-    onChange?: (name: string, value: Data) => void;
 }
-export interface SelectMultiple<Data = string> extends SelectProps<Data> {
+export interface SelectMultiple<Data = string> extends SelectProps<Data[]> {
     multiple: true;
-    value?: Data[];
-    onChange?: (name: string, value: Data[]) => void;
 }
 export type AllSelectProps<Data = string> = SelectSingle<Data> | SelectMultiple<Data>;

package/dist/molecules/forms/select/Select.interface.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=Select.interface.js.map

package/dist/molecules/forms/select/Select.interface.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Select.interface.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/dist/molecules/forms/select/Select.js

@@ -1,17 +1,16 @@
 import { jsx as o } from "react/jsx-runtime";
-import { registerComponent as c, getComponent as u } from "../../../registries/components.js";
-import { FormControl as s } from "../form-control/FormControl.js";
-import { useOptions as f } from "./hooks/useOptions.js";
-let d = 0;
-function v(e) {
-  const { className: l, name: n = "", id: t = `field-select-${++d}`, label: i, description: m = "" } = e, r = f({
+import { registerComponent as s, getComponent as l } from "../../../registries/components.js";
+import { useOptions as d } from "./hooks/useOptions.js";
+let f = 0;
+function C(e) {
+  const { className: n, name: i = "", id: t = `field-select-${++f}`, label: m, description: r = "" } = e, a = d({
     ...e,
     value: Array.isArray(e.value) ? e.value : [e.value]
-  }), a = u(["Select." + e.layout, "Select.html5"]);
-  return /* @__PURE__ */ o(s, { ...e, id: t, description: m, shadow: !1, className: l, label: i, children: /* @__PURE__ */ o(a, { ...e, options: r, name: n, id: t }) });
+  }), c = l("FormControl"), u = l(["Select." + e.layout, "Select.html5"]);
+  return /* @__PURE__ */ o(c, { ...e, id: t, description: r, shadow: !1, className: n, label: m, children: /* @__PURE__ */ o(u, { ...e, options: a, name: i, id: t }) });
 }
-c("Select", v);
+s("Select", C);
 export {
-  v as Select
+  C as Select
 };
 //# sourceMappingURL=Select.js.map

package/dist/molecules/forms/select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../../src/molecules/forms/select/Select.tsx"],"sourcesContent":["import type { ComponentType } from \"react\";\n\nimport { getComponent, registerComponent } from \"../../../registries/components\";\nimport { FormControl } from \"../form-control/FormControl\";\nimport { useOptions } from \"./hooks/useOptions\";\nimport { AllSelectProps } from \"./Select.interfaces\";\n\nlet uuid = 0;\n\nexport function Select<Data = string>(props: AllSelectProps<Data>) {\n  const { className, name = \"\", id = `field-select-${++uuid}`, label, description = \"\" } = props;\n  const options = useOptions<Data>({\n    ...props,\n    value: (Array.isArray(props.value) ? props.value : [props.value]) as any\n  });\n\n  const Component = getComponent<ComponentType<AllSelectProps<Data>>>([\"Select.\" + props.layout, \"Select.html5\"]);\n\n  return (\n    <FormControl {...props} id={id} description={description} shadow={false} className={className} label={label}>\n      <Component {...props} options={options} name={name} id={id} />\n    </FormControl>\n  );\n}\n\nregisterComponent(\"Select\", Select);\n"],"names":["uuid","Select","props","className","name","id","label","description","options","useOptions","Component","getComponent","FormControl","registerComponent"],"mappings":";;;;AAOA,IAAIA,IAAO;AAEJ,SAASC,EAAsBC,GAA6B;AACjE,QAAM,EAAE,WAAAC,GAAW,MAAAC,IAAO,IAAI,IAAAC,IAAK,gBAAgB,EAAEL,CAAI,IAAI,OAAAM,GAAO,aAAAC,IAAc,GAAO,IAAAL,GACnFM,IAAUC,EAAiB;AAAA,IAC/B,GAAGP;AAAA,IACH,OAAQ,MAAM,QAAQA,EAAM,KAAK,IAAIA,EAAM,QAAQ,CAACA,EAAM,KAAK;AAAA,EAAA,CAChE,GAEKQ,IAAYC,EAAkD,CAAC,YAAYT,EAAM,QAAQ,cAAc,CAAC;AAE9G,2BACGU,GAAa,EAAA,GAAGV,GAAO,IAAAG,GAAQ,aAAAE,GAA0B,QAAQ,IAAO,WAAAJ,GAAsB,OAAAG,GAC7F,4BAACI,GAAW,EAAA,GAAGR,GAAO,SAAAM,GAAkB,MAAAJ,GAAY,IAAAC,EAAQ,CAAA,GAC9D;AAEJ;AAEAQ,EAAkB,UAAUZ,CAAM;"}
+{"version":3,"file":"Select.js","sources":["../../../../src/molecules/forms/select/Select.tsx"],"sourcesContent":["import type { ComponentType } from \"react\";\n\nimport { getComponent, registerComponent } from \"../../../registries/components\";\nimport type { FormControl as DefaultFormControl } from \"../form-control/FormControl\";\nimport { useOptions } from \"./hooks/useOptions\";\nimport { AllSelectProps } from \"./Select.interface\";\n\nlet uuid = 0;\n\nexport function Select<Data = string>(props: AllSelectProps<Data>) {\n  const { className, name = \"\", id = `field-select-${++uuid}`, label, description = \"\" } = props;\n\n  const options = useOptions<Data>({\n    ...props,\n    value: (Array.isArray(props.value) ? props.value : [props.value]) as any\n  });\n\n  const FormControl = getComponent<typeof DefaultFormControl>(\"FormControl\");\n  const Component = getComponent<ComponentType<AllSelectProps<Data>>>([\"Select.\" + props.layout, \"Select.html5\"]);\n\n  return (\n    <FormControl {...(props as any)} id={id} description={description} shadow={false} className={className} label={label}>\n      <Component {...props} options={options} name={name} id={id} />\n    </FormControl>\n  );\n}\n\nregisterComponent(\"Select\", Select);\n"],"names":["uuid","Select","props","className","name","id","label","description","options","useOptions","FormControl","getComponent","Component","registerComponent"],"mappings":";;;AAOA,IAAIA,IAAO;AAEJ,SAASC,EAAsBC,GAA6B;AACjE,QAAM,EAAE,WAAAC,GAAW,MAAAC,IAAO,IAAI,IAAAC,IAAK,gBAAgB,EAAEL,CAAI,IAAI,OAAAM,GAAO,aAAAC,IAAc,GAAA,IAAOL,GAEnFM,IAAUC,EAAiB;AAAA,IAC/B,GAAGP;AAAA,IACH,OAAQ,MAAM,QAAQA,EAAM,KAAK,IAAIA,EAAM,QAAQ,CAACA,EAAM,KAAK;AAAA,EAAA,CAChE,GAEKQ,IAAcC,EAAwC,aAAa,GACnEC,IAAYD,EAAkD,CAAC,YAAYT,EAAM,QAAQ,cAAc,CAAC;AAE9G,2BACGQ,GAAA,EAAa,GAAIR,GAAe,IAAAG,GAAQ,aAAAE,GAA0B,QAAQ,IAAO,WAAAJ,GAAsB,OAAAG,GACtG,4BAACM,GAAA,EAAW,GAAGV,GAAO,SAAAM,GAAkB,MAAAJ,GAAY,IAAAC,GAAQ,GAC9D;AAEJ;AAEAQ,EAAkB,UAAUZ,CAAM;"}

package/dist/molecules/forms/select/all.d.ts

@@ -1,2 +1,2 @@
 export * from './Select';
-export * from './Select.interfaces';
+export * from './Select.interface';

package/dist/molecules/forms/select/all.js

@@ -1,3 +1,4 @@
+import "../form-control/FormControl.js";
 import "./components/ReactSelect.js";
 import "./components/HtmlSelect.js";
 import "./components/ChoicesSelect.js";

package/dist/molecules/forms/select/all.js.map

@@ -1 +1 @@
-{"version":3,"file":"all.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;"}
+{"version":3,"file":"all.js","sources":[],"sourcesContent":[],"names":[],"mappings":";;;;;"}

package/dist/molecules/forms/select/components/ChoicesSelect.d.ts

@@ -1,5 +1,5 @@
 import { default as Choices } from '@formio/choices.js';
-import { AllSelectProps } from '../Select.interfaces';
+import { AllSelectProps } from '../Select.interface';
 export declare function useChoices({ name, disabled, multiple, options, placeholder, searchEnabled, customProperties, size, value, required, onChange }: AllSelectProps): {
     ref: import('react').MutableRefObject<any>;
     choicesRef: import('react').MutableRefObject<Choices | undefined>;

package/dist/molecules/forms/select/components/ChoicesSelect.js

@@ -1,106 +1,95 @@
-import { jsx as j } from "react/jsx-runtime";
-import k from "@formio/choices.js";
-import { c as B } from "../../../../chunks/index.js";
-import H from "lodash/omit";
-import { useRef as T, useMemo as O, useEffect as w } from "react";
-import { c as R } from "../../../../chunks/index.module.js";
-import { registerComponent as z } from "../../../../registries/components.js";
-import { callbackOnCreateTemplates as _ } from "./choices.template.js";
-function y({
+import { jsx as T } from "react/jsx-runtime";
+import w from "@formio/choices.js";
+import { c as z } from "../../../../chunks/index.js";
+import { useRef as E, useMemo as M, useEffect as b } from "react";
+import { c as g } from "../../../../chunks/index.module.js";
+import { registerComponent as j } from "../../../../registries/components.js";
+import { cleanFormControlProps as k } from "../../form-control/FormControl.js";
+import { callbackOnCreateTemplates as B } from "./choices.template.js";
+function H({
   name: r,
-  disabled: f,
-  multiple: l,
-  options: S,
-  placeholder: m,
-  searchEnabled: E = !0,
-  customProperties: b = {},
-  size: h,
+  disabled: i,
+  multiple: c,
+  options: f,
+  placeholder: l,
+  searchEnabled: d = !0,
+  customProperties: v = {},
+  size: I,
   value: a,
-  required: I,
-  onChange: d
+  required: h,
+  onChange: S
 }) {
-  const L = T(), e = T(), i = O(() => {
-    const c = (t) => [].concat(a).includes(t), o = S.map((t) => (t.options && (t = {
-      ...t,
-      choices: t.options.map((u) => ({
-        ...u,
-        selected: c(u.value)
+  const C = E(), t = E(), m = M(() => {
+    const o = (e) => [].concat(a).includes(e), n = f.map((e) => (e.options && (e = {
+      ...e,
+      choices: e.options.map((s) => ({
+        ...s,
+        selected: o(s.value)
       }))
     }), {
-      ...t,
-      selected: c(t.value)
+      ...e,
+      selected: o(e.value)
     }));
-    return !l && m ? [
+    return !c && l ? [
       {
-        disabled: I,
-        label: m,
+        disabled: h,
+        label: l,
         value: ""
       },
-      ...o
-    ] : o;
-  }, [S, a, I, l, m]), v = R((c, o) => {
-    d == null || d(c, o);
+      ...n
+    ] : n;
+  }, [f, a, h, c, l]), u = g((o, n) => {
+    S?.(o, n);
   }, 50);
-  return w(() => {
-    e.current && (l && e.current.clearStore(), e.current.setChoices(i, "value", "label", !0));
-  }, [i]), w(() => {
-    var t, u, p, C;
-    if (!e.current) {
-      const {
-        allowHTML: s = !0,
-        silent: n = !0,
-        removeItemButton: x = !0,
-        shouldSort: M = !1,
-        itemSelectText: N = "",
-        classNames: $
-      } = b;
-      e.current = new k(L.current, {
-        ...b,
-        allowHTML: s,
-        silent: n,
-        searchEnabled: E,
-        removeItemButton: x,
-        choices: i,
-        placeholder: m,
+  return b(() => {
+    t.current && (c && t.current.clearStore(), t.current.setChoices(m, "value", "label", !0));
+  }, [m]), b(() => {
+    if (!t.current) {
+      const { allowHTML: e = !0, silent: s = !0, removeItemButton: p = !0, shouldSort: L = !1, itemSelectText: x = "" } = v;
+      t.current = new w(C.current, {
+        ...v,
+        allowHTML: e,
+        silent: s,
+        searchEnabled: d,
+        removeItemButton: p,
+        choices: m,
+        placeholder: l,
         placeholderValue: "",
-        itemSelectText: N,
-        shouldSort: M,
-        classNames: {
-          ...$,
-          containerOuter: `choices ${h || ""}`
-        },
-        callbackOnCreateTemplates: _
+        itemSelectText: x,
+        shouldSort: L,
+        callbackOnCreateTemplates: B
       });
     }
-    f ? (t = e.current) == null || t.disable() : (u = e.current) == null || u.enable();
-    const c = ({ detail: { value: s } }) => {
-      v(r, l ? [.../* @__PURE__ */ new Set([...new Set(a), s])] : s);
-    }, o = ({ detail: { value: s } }) => {
-      l ? v(
+    i ? t.current?.disable() : t.current?.enable();
+    const o = ({ detail: { value: e } }) => {
+      u(r, c ? [.../* @__PURE__ */ new Set([...new Set(a), e])] : e);
+    }, n = ({ detail: { value: e } }) => {
+      c ? u(
         r,
-        a.filter((n) => n !== s)
-      ) : v(r, void 0);
+        a.filter((s) => s !== e)
+      ) : u(r, void 0);
     };
-    return (p = e.current) == null || p.passedElement.element.addEventListener("addItem", c), (C = e.current) == null || C.passedElement.element.addEventListener("removeItem", o), () => {
-      var s, n;
-      (s = e.current) == null || s.passedElement.element.removeEventListener("addItem", c), (n = e.current) == null || n.passedElement.element.removeEventListener("removeItem", o);
+    return t.current?.passedElement.element.addEventListener("addItem", o), t.current?.passedElement.element.addEventListener("removeItem", n), () => {
+      t.current?.passedElement.element.removeEventListener("addItem", o), t.current?.passedElement.element.removeEventListener("removeItem", n);
     };
-  }, [f, d, i, m, E, h, a]), {
-    ref: L,
-    choicesRef: e
+  }, [i, S, m, l, d, I, a]), {
+    ref: C,
+    choicesRef: t
   };
 }
-function A(r) {
-  const { ref: f } = y({
+function N(r) {
+  const { ref: i } = H({
     ...r,
     searchEnabled: !r.disableSearch
   });
-  return /* @__PURE__ */ j(
+  return /* @__PURE__ */ T(
     "select",
     {
-      ref: f,
+      ref: i,
       "data-testid": `select_${r.name}`,
-      ...H(r, [
+      ...k(r, [
+        "className",
+        "size",
         "value",
         "options",
         "placeholder",
@@ -112,13 +101,13 @@ function A(r) {
         "itemSelectText",
         "customProperties"
       ]),
-      className: B("form-control", r.size && `form-control-${r.size}`)
+      className: z("form-control", r.size && `form-control-${r.size}`)
     }
   );
 }
-z("Select.choicesjs", A);
+j("Select.choicesjs", N);
 export {
-  A as ChoiceSelect,
-  y as useChoices
+  N as ChoiceSelect,
+  H as useChoices
 };
 //# sourceMappingURL=ChoicesSelect.js.map

package/dist/molecules/forms/select/components/ChoicesSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChoicesSelect.js","sources":["../../../../../src/molecules/forms/select/components/ChoicesSelect.tsx"],"sourcesContent":["import Choices from \"@formio/choices.js\";\nimport cx from \"classnames\";\nimport omit from \"lodash/omit\";\nimport { useEffect, useMemo, useRef } from \"react\";\nimport { useDebouncedCallback } from \"use-debounce\";\n\nimport { registerComponent } from \"../../../../registries/components\";\nimport type { AllSelectProps } from \"../Select.interfaces\";\nimport { callbackOnCreateTemplates } 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, 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, \"value\", \"label\", true);\n      } else {\n        choicesRef.current.setChoices(opts, \"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        classNames\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        classNames: {\n          ...classNames,\n          containerOuter: `choices ${size || \"\"}`\n        },\n        callbackOnCreateTemplates\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      {...omit(props as any, [\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","classNames","Choices","callbackOnCreateTemplates","_a","_b","addItem","newValue","removeItem","v","_c","_d","ChoiceSelect","props","jsx","omit","cx","registerComponent"],"mappings":"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"}
+{"version":3,"file":"ChoicesSelect.js","sources":["../../../../../src/molecules/forms/select/components/ChoicesSelect.tsx"],"sourcesContent":["import Choices from \"@formio/choices.js\";\nimport cx from \"classnames\";\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 } 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 { allowHTML = true, silent = true, removeItemButton = true, shouldSort = false, itemSelectText = \"\" } = 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\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","Choices","callbackOnCreateTemplates","addItem","newValue","removeItem","v","ChoiceSelect","props","jsx","cleanFormControlProps","cx","registerComponent"],"mappings":";;;;;;;;AAUO,SAASA,EAAW;AAAA,EACzB,MAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,SAAAC;AAAA,EACA,aAAAC;AAAA,EACA,eAAAC,IAAgB;AAAA,EAChB,kBAAAC,IAAmB,CAAA;AAAA,EACnB,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AACF,GAAmB;AACjB,QAAMC,IAAMC,EAAA,GACNC,IAAaD,EAAA,GAEbE,IAAOC,EAAQ,MAAM;AACzB,UAAMC,IAAa,CAACC,MAAmB,CAAA,EAAG,OAAOT,CAAY,EAAE,SAASS,CAAkB,GAEpFH,IAAOX,EAAQ,IAAI,CAACe,OACpBA,EAAK,YACPA,IAAO;AAAA,MACL,GAAGA;AAAA,MACH,SAASA,EAAK,QAAQ,IAAI,CAACA,OAAe;AAAA,QACxC,GAAGA;AAAAA,QACH,UAAUF,EAAWE,EAAK,KAAK;AAAA,MAAA,EAC/B;AAAA,IAAA,IAIC;AAAA,MACL,GAAGA;AAAA,MACH,UAAUF,EAAWE,EAAK,KAAK;AAAA,IAAA,EAElC;AAED,WAAI,CAAChB,KAAYE,IACR;AAAA,MACL;AAAA,QACE,UAAUK;AAAA,QACV,OAAOL;AAAA,QACP,OAAO;AAAA,MAAA;AAAA,MAET,GAAGU;AAAAA,IAAA,IAIAA;AAAAA,EACT,GAAG,CAACX,GAASK,GAAOC,GAAUP,GAAUE,CAAW,CAAC,GAE9Ce,IAAmBC,EAAqB,CAACpB,GAA0BQ,MAAe;AACtF,IAAAE,IAAWV,GAAMQ,CAAK;AAAA,EACxB,GAAG,EAAE;AAEL,SAAAa,EAAU,MAAM;AACd,IAAIR,EAAW,YACTX,KACFW,EAAW,QAAQ,WAAA,GACnBA,EAAW,QAAQ,WAAWC,GAAa,SAAS,SAAS,EAAI;AAAA,EAKvE,GAAG,CAACA,CAAI,CAAC,GAETO,EAAU,MAAM;AACd,QAAI,CAACR,EAAW,SAAS;AACvB,YAAM,EAAE,WAAAS,IAAY,IAAM,QAAAC,IAAS,IAAM,kBAAAC,IAAmB,IAAM,YAAAC,IAAa,IAAO,gBAAAC,IAAiB,GAAA,IAAOpB;AAC9G,MAAAO,EAAW,UAAU,IAAIc,EAAQhB,EAAI,SAAS;AAAA,QAC5C,GAAGL;AAAA,QACH,WAAAgB;AAAA,QACA,QAAAC;AAAA,QACA,eAAAlB;AAAA,QACA,kBAAAmB;AAAA,QACA,SAASV;AAAA,QACT,aAAAV;AAAA,QACA,kBAAkB;AAAA,QAClB,gBAAAsB;AAAA,QACA,YAAAD;AAAA,QACA,2BAAAG;AAAA,MAAA,CACM;AAAA,IACV;AAEA,IAAI3B,IACFY,EAAW,SAAS,QAAA,IAEpBA,EAAW,SAAS,OAAA;AAGtB,UAAMgB,IAAU,CAAC,EAAE,QAAQ,EAAE,OAAOC,EAAA,QAAsB;AACxD,MAAAX,EAAiBnB,GAAME,IAAW,CAAC,GAAG,oBAAI,IAAI,CAAC,GAAG,IAAI,IAAIM,CAAiB,GAAGsB,CAAQ,CAAC,CAAC,IAAIA,CAAQ;AAAA,IACtG,GAEMC,IAAa,CAAC,EAAE,QAAQ,EAAE,OAAOD,EAAA,QAAsB;AAC3D,MAAI5B,IACFiB;AAAA,QACEnB;AAAA,QACCQ,EAAmB,OAAO,CAACwB,MAAMA,MAAMF,CAAQ;AAAA,MAAA,IAGlDX,EAAiBnB,GAAM,MAAgB;AAAA,IAE3C;AAEA,WAAAa,EAAW,SAAS,cAAc,QAAQ,iBAAiB,WAAWgB,CAAO,GAC7EhB,EAAW,SAAS,cAAc,QAAQ,iBAAiB,cAAckB,CAAU,GAE5E,MAAM;AACX,MAAAlB,EAAW,SAAS,cAAc,QAAQ,oBAAoB,WAAWgB,CAAO,GAChFhB,EAAW,SAAS,cAAc,QAAQ,oBAAoB,cAAckB,CAAU;AAAA,IACxF;AAAA,EACF,GAAG,CAAC9B,GAAUS,GAAUI,GAAMV,GAAaC,GAAeE,GAAMC,CAAK,CAAC,GAE/D;AAAA,IACL,KAAAG;AAAA,IACA,YAAAE;AAAA,EAAA;AAEJ;AAEO,SAASoB,EAAaC,GAAuB;AAClD,QAAM,EAAE,KAAAvB,EAAA,IAAQZ,EAAW;AAAA,IACzB,GAAGmC;AAAA,IACH,eAAe,CAACA,EAAM;AAAA,EAAA,CACvB;AAED,SACE,gBAAAC;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,KAAAxB;AAAA,MACA,eAAa,UAAUuB,EAAM,IAAI;AAAA,MAChC,GAAGE,EAAsBF,GAAc;AAAA,QACtC;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,QACA;AAAA,MAAA,CACD;AAAA,MACD,WAAWG,EAAG,gBAAgBH,EAAM,QAAQ,gBAAgBA,EAAM,IAAI,EAAE;AAAA,IAAA;AAAA,EAAA;AAG9E;AAEAI,EAAkB,oBAAoBL,CAAY;"}

package/dist/molecules/forms/select/components/HtmlSelect.d.ts

@@ -1,2 +1,2 @@
-import { AllSelectProps } from '../Select.interfaces';
+import { AllSelectProps } from '../Select.interface';
 export declare function HTMLSelect({ name, id, size, value, multiple, onChange, options, placeholder, ...props }: AllSelectProps): import("react/jsx-runtime").JSX.Element;

package/dist/molecules/forms/select/components/HtmlSelect.js

@@ -1,34 +1,35 @@
-import { jsxs as g, jsx as e } from "react/jsx-runtime";
+import { jsxs as g, jsx as o } from "react/jsx-runtime";
 import { c as h } from "../../../../chunks/index.js";
 import { registerComponent as v } from "../../../../registries/components.js";
-import { getEventValue as S } from "../../../../utils/getEventValue.js";
-function s({ value: r, label: n, ...o }) {
-  return /* @__PURE__ */ e("option", { ...o, value: r, children: n });
+import { getEventValue as x } from "../../../../utils/getEventValue.js";
+import { cleanFormControlProps as S } from "../../form-control/FormControl.js";
+function a({ value: t, label: n, ...e }) {
+  return /* @__PURE__ */ o("option", { ...e, value: t, children: n });
 }
-function x({ name: r, id: n = r, size: o, value: a, multiple: c, onChange: u, options: i, placeholder: l, ...p }) {
+function j({ name: t, id: n = t, size: e, value: p, multiple: c, onChange: m, options: i, placeholder: l, ...s }) {
   const f = !!i[0].options;
   return /* @__PURE__ */ g(
     "select",
     {
-      "data-testid": `select_${r}`,
-      ...p,
-      className: h("form-control", o && `form-control-${o}`),
-      name: r,
+      "data-testid": `select_${t}`,
+      ...S(s),
+      className: h("form-control", e && `form-control-${e}`),
+      name: t,
       id: n,
       multiple: c,
-      value: a || "",
-      onChange: (t) => {
-        u && u(r, S(t));
+      value: p || "",
+      onChange: (r) => {
+        m && m(t, x(r));
       },
       children: [
-        l && !c && /* @__PURE__ */ e("option", { value: "", disabled: !0, children: l }),
-        f ? i.map(({ label: t, options: d }) => /* @__PURE__ */ e("optgroup", { label: t, children: d.map((m) => /* @__PURE__ */ e(s, { ...m }, String(m.value))) }, t)) : i.map((t) => /* @__PURE__ */ e(s, { ...t }, String(t.value)))
+        l && !c && /* @__PURE__ */ o("option", { value: "", disabled: !0, children: l }),
+        f ? i.map(({ label: r, options: d }) => /* @__PURE__ */ o("optgroup", { label: r, children: d.map((u) => /* @__PURE__ */ o(a, { ...u }, String(u.value))) }, r)) : i.map((r) => /* @__PURE__ */ o(a, { ...r }, String(r.value)))
       ]
     }
   );
 }
-v("Select.html5", x);
+v("Select.html5", j);
 export {
-  x as HTMLSelect
+  j as HTMLSelect
 };
 //# sourceMappingURL=HtmlSelect.js.map

package/dist/molecules/forms/select/components/HtmlSelect.js.map

@@ -1 +1 @@
-{"version":3,"file":"HtmlSelect.js","sources":["../../../../../src/molecules/forms/select/components/HtmlSelect.tsx"],"sourcesContent":["import cx from \"classnames\";\n\nimport { registerComponent } from \"../../../../registries/components\";\nimport { getEventValue } from \"../../../../utils/getEventValue\";\nimport { AllSelectProps, SelectOptionBaseProps } from \"../Select.interfaces\";\n\nfunction Option({ value, label, ...props }: SelectOptionBaseProps) {\n  return (\n    <option {...props} value={value as any}>\n      {label}\n    </option>\n  );\n}\n\nexport function HTMLSelect({ name, id = name, size, value, multiple, onChange, options, placeholder, ...props }: AllSelectProps) {\n  const hasGroup = !!options[0].options;\n\n  return (\n    <select\n      data-testid={`select_${name}`}\n      {...(props as any)}\n      className={cx(\"form-control\", size && `form-control-${size}`)}\n      name={name}\n      id={id}\n      multiple={multiple}\n      value={value || (\"\" as any)}\n      onChange={(event) => {\n        onChange && onChange(name, getEventValue(event));\n      }}\n    >\n      {placeholder && !multiple && (\n        <option value='' disabled>\n          {placeholder}\n        </option>\n      )}\n      {hasGroup\n        ? options.map(({ label, options }) => {\n            return (\n              <optgroup key={label} label={label}>\n                {options.map((props: SelectOptionBaseProps) => {\n                  return <Option key={String(props.value)} {...props} />;\n                })}\n              </optgroup>\n            );\n          })\n        : (options as SelectOptionBaseProps[]).map((props) => {\n            return <Option key={String(props.value)} {...props} />;\n          })}\n    </select>\n  );\n}\n\nregisterComponent(\"Select.html5\", HTMLSelect);\n"],"names":["Option","value","label","props","jsx","HTMLSelect","name","id","size","multiple","onChange","options","placeholder","hasGroup","jsxs","cx","event","getEventValue","registerComponent"],"mappings":";;;;AAMA,SAASA,EAAO,EAAE,OAAAC,GAAO,OAAAC,GAAO,GAAGC,KAAgC;AACjE,SACG,gBAAAC,EAAA,UAAA,EAAQ,GAAGD,GAAO,OAAAF,GAChB,UACHC,GAAA;AAEJ;AAEO,SAASG,EAAW,EAAE,MAAAC,GAAM,IAAAC,IAAKD,GAAM,MAAAE,GAAM,OAAAP,GAAO,UAAAQ,GAAU,UAAAC,GAAU,SAAAC,GAAS,aAAAC,GAAa,GAAGT,KAAyB;AAC/H,QAAMU,IAAW,CAAC,CAACF,EAAQ,CAAC,EAAE;AAG5B,SAAA,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,eAAa,UAAUR,CAAI;AAAA,MAC1B,GAAIH;AAAA,MACL,WAAWY,EAAG,gBAAgBP,KAAQ,gBAAgBA,CAAI,EAAE;AAAA,MAC5D,MAAAF;AAAA,MACA,IAAAC;AAAA,MACA,UAAAE;AAAA,MACA,OAAOR,KAAU;AAAA,MACjB,UAAU,CAACe,MAAU;AACnB,QAAAN,KAAYA,EAASJ,GAAMW,EAAcD,CAAK,CAAC;AAAA,MACjD;AAAA,MAEC,UAAA;AAAA,QAAeJ,KAAA,CAACH,KACd,gBAAAL,EAAA,UAAA,EAAO,OAAM,IAAG,UAAQ,IACtB,UACHQ,EAAA,CAAA;AAAA,QAEDC,IACGF,EAAQ,IAAI,CAAC,EAAE,OAAAT,GAAO,SAAAS,0BAEjB,YAAqB,EAAA,OAAAT,GACnB,UAAAS,EAAQ,IAAI,CAACR,wBACJH,GAAkC,EAAA,GAAGG,KAAzB,OAAOA,EAAM,KAAK,CAAc,CACrD,KAHYD,CAIf,CAEH,IACAS,EAAoC,IAAI,CAACR,wBAChCH,GAAkC,EAAA,GAAGG,KAAzB,OAAOA,EAAM,KAAK,CAAc,CACrD;AAAA,MAAA;AAAA,IAAA;AAAA,EACP;AAEJ;AAEAe,EAAkB,gBAAgBb,CAAU;"}
+{"version":3,"file":"HtmlSelect.js","sources":["../../../../../src/molecules/forms/select/components/HtmlSelect.tsx"],"sourcesContent":["import cx from \"classnames\";\n\nimport { registerComponent } from \"../../../../registries/components\";\nimport { getEventValue } from \"../../../../utils/getEventValue\";\nimport { cleanFormControlProps } from \"../../form-control/FormControl\";\nimport { AllSelectProps, SelectOptionBaseProps } from \"../Select.interface\";\n\nfunction Option({ value, label, ...props }: SelectOptionBaseProps) {\n  return (\n    <option {...props} value={value as any}>\n      {label}\n    </option>\n  );\n}\n\nexport function HTMLSelect({ name, id = name, size, value, multiple, onChange, options, placeholder, ...props }: AllSelectProps) {\n  const hasGroup = !!options[0].options;\n\n  return (\n    <select\n      data-testid={`select_${name}`}\n      {...cleanFormControlProps(props as any)}\n      className={cx(\"form-control\", size && `form-control-${size}`)}\n      name={name}\n      id={id}\n      multiple={multiple}\n      value={value || (\"\" as any)}\n      onChange={(event) => {\n        onChange && onChange(name, getEventValue(event));\n      }}\n    >\n      {placeholder && !multiple && (\n        <option value='' disabled>\n          {placeholder}\n        </option>\n      )}\n      {hasGroup\n        ? options.map(({ label, options }) => {\n            return (\n              <optgroup key={label} label={label}>\n                {options.map((props: SelectOptionBaseProps) => {\n                  return <Option key={String(props.value)} {...props} />;\n                })}\n              </optgroup>\n            );\n          })\n        : (options as SelectOptionBaseProps[]).map((props) => {\n            return <Option key={String(props.value)} {...props} />;\n          })}\n    </select>\n  );\n}\n\nregisterComponent(\"Select.html5\", HTMLSelect);\n"],"names":["Option","value","label","props","jsx","HTMLSelect","name","id","size","multiple","onChange","options","placeholder","hasGroup","jsxs","cleanFormControlProps","cx","event","getEventValue","registerComponent"],"mappings":";;;;;AAOA,SAASA,EAAO,EAAE,OAAAC,GAAO,OAAAC,GAAO,GAAGC,KAAgC;AACjE,SACE,gBAAAC,EAAC,UAAA,EAAQ,GAAGD,GAAO,OAAAF,GAChB,UAAAC,GACH;AAEJ;AAEO,SAASG,EAAW,EAAE,MAAAC,GAAM,IAAAC,IAAKD,GAAM,MAAAE,GAAM,OAAAP,GAAO,UAAAQ,GAAU,UAAAC,GAAU,SAAAC,GAAS,aAAAC,GAAa,GAAGT,KAAyB;AAC/H,QAAMU,IAAW,CAAC,CAACF,EAAQ,CAAC,EAAE;AAE9B,SACE,gBAAAG;AAAA,IAAC;AAAA,IAAA;AAAA,MACC,eAAa,UAAUR,CAAI;AAAA,MAC1B,GAAGS,EAAsBZ,CAAY;AAAA,MACtC,WAAWa,EAAG,gBAAgBR,KAAQ,gBAAgBA,CAAI,EAAE;AAAA,MAC5D,MAAAF;AAAA,MACA,IAAAC;AAAA,MACA,UAAAE;AAAA,MACA,OAAOR,KAAU;AAAA,MACjB,UAAU,CAACgB,MAAU;AACnB,QAAAP,KAAYA,EAASJ,GAAMY,EAAcD,CAAK,CAAC;AAAA,MACjD;AAAA,MAEC,UAAA;AAAA,QAAAL,KAAe,CAACH,KACf,gBAAAL,EAAC,UAAA,EAAO,OAAM,IAAG,UAAQ,IACtB,UAAAQ,EAAA,CACH;AAAA,QAEDC,IACGF,EAAQ,IAAI,CAAC,EAAE,OAAAT,GAAO,SAAAS,0BAEjB,YAAA,EAAqB,OAAAT,GACnB,UAAAS,EAAQ,IAAI,CAACR,wBACJH,GAAA,EAAkC,GAAGG,KAAzB,OAAOA,EAAM,KAAK,CAAc,CACrD,KAHYD,CAIf,CAEH,IACAS,EAAoC,IAAI,CAACR,wBAChCH,GAAA,EAAkC,GAAGG,KAAzB,OAAOA,EAAM,KAAK,CAAc,CACrD;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGX;AAEAgB,EAAkB,gBAAgBd,CAAU;"}

package/dist/molecules/forms/select/components/ReactSelect.d.ts

@@ -1,2 +1,2 @@
-import { AllSelectProps } from '../Select.interfaces';
+import { AllSelectProps } from '../Select.interface';
 export declare function ReactSelect(props: AllSelectProps): import("react/jsx-runtime").JSX.Element;