linear-react-components-ui 1.1.26-beta.14 → 1.1.26-beta.16

package/lib/inputs/select/multiple/index.js

@@ -1,22 +1,22 @@
-import { jsxs as fe, jsx as v } from "react/jsx-runtime";
-import { useState as u, useRef as R, useEffect as F } from "react";
-import x from "../../../_virtual/lodash.js";
-import me from "../Dropdown.js";
-import he from "../ActionButtons.js";
-import Ce from "./Selecteds.js";
-import { keyCodes as C } from "../../../internals/constants.js";
-import pe from "../../base/InputTextBase.js";
+import { jsxs as he, jsx as R } from "react/jsx-runtime";
+import { useState as u, useRef as v, useEffect as F } from "react";
+import L from "../../../_virtual/lodash.js";
+import Ce from "../Dropdown.js";
+import pe from "../ActionButtons.js";
+import ge from "./Selecteds.js";
+import { keyCodes as m, keys as ye } from "../../../internals/constants.js";
+import Se from "../../base/InputTextBase.js";
 import { getFilteredMultipleDataCombo as J } from "../helper.js";
-import ge from "../../../hint/index.js";
-import Se from "../../../node_modules/uuid/dist/v1.js";
-const Ie = (n) => {
+import we from "../../../hint/index.js";
+import Oe from "../../../node_modules/uuid/dist/v1.js";
+const Ae = (n) => {
   const {
     idKey: d,
-    dataSource: i = [],
+    dataSource: r = [],
     handlerClear: Q,
-    value: p = [],
-    remoteSearch: L = !1,
-    descriptionKey: f,
+    value: y = [],
+    remoteSearch: A = !1,
+    descriptionKey: h,
     showClearButton: X,
     rightElements: Y = [],
     hint: K,
@@ -24,104 +24,106 @@ const Ie = (n) => {
     customClassForLabel: V,
     customClassForWrapper: _,
     customClassForInputContent: ee,
-    customClassForSideButtons: te
-  } = n, [r, D] = u(i), [c, g] = u([]), [S, m] = u(), [b, w] = u([]), [y, s] = u(!1), [A, W] = u(0), [ne, oe] = u(!1), [O, re] = u(), [ie, le] = u([]), T = `select-component${Se()}`, N = R(null), h = R(null), l = R(null), E = R(null), a = R(null), P = typeof f == "string", ce = ["item", "menubutton", "filterinput", "filtercontainer", "label", "actionbutton"], $ = () => {
+    customClassForSideButtons: te,
+    disabled: ne = !1,
+    dropdownMaxWidth: oe = void 0
+  } = n, [i, E] = u(r), [c, S] = u([]), [a, C] = u(), [b, w] = u([]), [p, s] = u(!1), [T, W] = u(0), [ie, re] = u(!1), [O, le] = u(), [ce, se] = u([]), N = `select-component${Oe()}`, M = v(null), g = v(null), l = v(null), D = v(null), f = v(null), P = typeof h == "string", ue = ["item", "menubutton", "filterinput", "filtercontainer", "label", "actionbutton"], $ = () => {
     l.current && W(l.current.clientWidth);
-  }, M = (e) => {
+  }, z = (e) => {
     const {
       target: t
     } = e;
-    !ce.includes(t.className) && t !== l.current && l.current && !l.current.contains(t) && h.current && !h.current.contains(t) && s(!1);
-  }, z = (e) => {
-    const t = e.target, o = h.current?.parentElement?.id || "", ae = !!document.getElementById(o)?.contains(t);
-    oe(ae);
-  }, U = () => {
-    m(void 0), g([]), n.onSelect && n.onSelect();
-  }, j = (e) => {
+    !ue.includes(t.className) && t !== l.current && l.current && !l.current.contains(t) && g.current && !g.current.contains(t) && s(!1);
+  }, U = (e) => {
+    const t = e.target, o = g.current?.parentElement?.id || "", me = !!document.getElementById(o)?.contains(t);
+    re(me);
+  }, j = () => {
+    C(void 0), S([]), n.onSelect && n.onSelect();
+  }, q = (e) => {
     let t = null;
-    if (L)
+    if (A)
       n.onSearch && n.onSearch(e), s(!0), w([e]);
     else {
-      let o = i;
+      let o = r;
       e.length > 0 && (o = J({
         inputText: [e],
-        dataSource: i,
-        descriptionKey: f,
+        dataSource: r,
+        descriptionKey: h,
         currents: c
-      })), o && o.length > 0 && (t = o[0]), D(o), s(!0), t && m(t), w([e]);
+      })), o && o.length > 0 && (t = o[0]), E(o), s(!0), t && C(t), w([e]);
     }
-  }, B = () => {
-    const e = l.current ? l.current.clientWidth : A;
+  }, k = () => {
+    const e = l.current ? l.current.clientWidth : T;
     s(!0), W(e);
-  }, q = (e) => {
+  }, B = (e) => {
     if (e === null) return;
     const t = [...c, e];
-    g(t), D(i), w([]), a && a.current && a.current.focus(), n.onSelect && m(n.onSelect(t.map((o) => o[d]))), h.current?.focus();
-  }, se = (e) => {
+    S(t), E(r), w([]), f && f.current && f.current.focus(), n.onSelect && C(n.onSelect(t.map((o) => o[d]))), g.current?.focus();
+  }, de = (e) => {
     if (c) {
       const t = c.filter((o) => o[d] !== e);
-      g(t), a && a.current && a.current.focus(), s(!1), n.onSelect && m(n.onSelect(t.map((o) => o[d]))), h.current?.focus();
+      S(t), f && f.current && f.current.focus(), s(!1), n.onSelect && C(n.onSelect(t.map((o) => o[d]))), g.current?.focus();
     }
-  }, ue = () => {
+  }, ae = () => {
     s((e) => !e), l.current && W(l.current.clientWidth);
   }, H = (e) => {
-    n.onBlur && n.onBlur(e), ne || (s(!1), D(i));
+    n.onBlur && n.onBlur(e), a && p && B(a), ie || (s(!1), E(r));
   }, G = (e) => {
     if (e.keyCode)
-      if (e.keyCode === C.ENTER && S && y)
-        e.preventDefault?.(), c.some((t) => t[d] === S[d]) || (e.preventDefault?.(), q(S));
-      else if ([C.ARROW_UP, C.ARROW_DOWN].includes(e.keyCode)) {
-        y || s(!0);
-        let t = r ? r.findIndex((o) => o === S) : 0;
-        e.keyCode === C.ARROW_DOWN ? t = r && t === r.length - 1 ? 0 : t + 1 : t = r && t === 0 ? r.length - 1 : t - 1, r && r.length && (P && r[t][f] ? w(r[t][f]) : P || w([f(r[t])])), r && m(r[t]);
-      } else if (e.keyCode === C.BACKSPACE) {
+      if ((e.keyCode === m.ENTER || e.key === ye.TAB) && a && p)
+        e.keyCode === m.ENTER && e.preventDefault?.(), c.some((t) => t[d] === a[d]) || B(a);
+      else if ([m.ARROW_UP, m.ARROW_DOWN].includes(e.keyCode)) {
+        p || s(!0);
+        let t = i ? i.findIndex((o) => o === a) : 0;
+        e.keyCode === m.ARROW_DOWN ? t = i && t === i.length - 1 ? 0 : t + 1 : t = i && t === 0 ? i.length - 1 : t - 1, i && i.length && (P && i[t][h] ? w(i[t][h]) : P || w([h(i[t])])), i && C(i[t]);
+      } else if (e.keyCode === m.BACKSPACE) {
         if (b.length === 0) {
-          const t = x.dropRight(c);
-          g(t), n.onSelect && n.onSelect(t.map((o) => o[d]));
+          const t = L.dropRight(c);
+          S(t), n.onSelect && n.onSelect(t.map((o) => o[d]));
         }
-      } else e.keyCode === C.TAB && s(!1);
-  }, de = (e) => {
-    re(e);
-  }, k = () => n.disabled || O && (O.disabled || O.hideContent), I = () => n.readOnly || O && O.readOnly;
-  return F(() => (window.addEventListener("resize", $), document.addEventListener("click", M), document.addEventListener("mousemove", z), Q && U(), () => {
-    window.removeEventListener("resize", $), document.removeEventListener("click", M), document.removeEventListener("mousemove", z);
+      } else e.keyCode === m.TAB && s(!1);
+  }, fe = (e) => {
+    le(e);
+  }, x = () => ne || O && (O.disabled || O.hideContent), I = () => n.readOnly || O && O.readOnly;
+  return F(() => (window.addEventListener("resize", $), document.addEventListener("click", z), document.addEventListener("mousemove", U), Q && j(), () => {
+    window.removeEventListener("resize", $), document.removeEventListener("click", z), document.removeEventListener("mousemove", U);
   }), []), F(() => {
     if (n.gridLayout) {
-      const e = document.querySelector(`#${T}>.-withinput.grid-container`);
-      E.current !== e && e && (E.current = e);
+      const e = document.querySelector(`#${N}>.-withinput.grid-container`);
+      D.current !== e && e && (D.current = e);
     }
   }, []), F(() => {
-    if (p.length > 0 && p !== ie && i.length > 0) {
-      const e = i.filter((t) => p.includes(t[d]));
-      le(p), g(e);
+    if (y.length > 0 && y !== ce && r.length > 0) {
+      const e = r.filter((t) => y.includes(t[d]));
+      se(y), S(e);
     }
-  }, [i.length, p.length]), F(() => {
-    if (!x.isEqual(i, r)) {
-      const e = L ? i : J({
+  }, [r.length, y.length]), F(() => {
+    if (!L.isEqual(r, i)) {
+      const e = A ? r : J({
         currents: c,
-        dataSource: i,
-        descriptionKey: f,
+        dataSource: r,
+        descriptionKey: h,
         inputText: b
       });
-      D(e), m(e.length > 0 ? r[0] : null);
+      E(e), C(e.length > 0 ? i[0] : null);
     }
-  }, [i]), /* @__PURE__ */ fe("span", { id: T, ref: N, className: "select-component", children: [
-    /* @__PURE__ */ v(pe, { ...n, inputRef: (e) => {
-      n.inputRef && (x.isFunction(n.inputRef) ? n.inputRef(e) : n.inputRef.current = e), a.current = e;
+  }, [r]), /* @__PURE__ */ he("span", { id: N, ref: M, className: "select-component", children: [
+    /* @__PURE__ */ R(Se, { ...n, inputRef: (e) => {
+      n.inputRef && (L.isFunction(n.inputRef) ? n.inputRef(e) : n.inputRef.current = e), f.current = e;
     }, autoComplete: "off", value: b.toString(), readOnly: I(), onFocus: () => {
-      B();
+      k();
     }, onBlur: (e) => {
       H(e);
     }, onChange: (e) => {
-      e && j(e.target.value);
-    }, onClick: B, onKeyDown: G, customClassForLabel: V, customClassForWrapper: `selectwrapper ${(n.readOnly || k() || I()) && " -undigitable"} ${_}`, customClassForInputContent: `multiselect ${ee}`, inputBaseRef: (e) => {
+      e && q(e.target.value);
+    }, onClick: k, onKeyDown: G, customClassForLabel: V, customClassForWrapper: `selectwrapper ${(n.readOnly || x() || I()) && " -undigitable"} ${_}`, customClassForInputContent: `multiselect ${ee}`, inputBaseRef: (e) => {
       l.current = e;
-    }, handlerSetOnDenied: de, rightElements: [...Y, /* @__PURE__ */ v(he, { showClearButton: X, disabled: k() || I(), dropDownOpened: y, handlerClear: () => k() ? null : U(), handlerOpenClose: ue, customClassForSideButtons: te }, "action-buttons-multiselect")], children: /* @__PURE__ */ v(Ce, { ...n, currents: c, handlerOnUnselect: se }) }),
-    y && /* @__PURE__ */ v(me, { ...n, selected: S, selectFieldRef: N, dropdownRef: h, gridWrapperStyle: n.gridLayout && E.current ? window.getComputedStyle(E.current) : void 0, handleOnSelect: q, handleOnFilter: j, handleOnKeydown: G, handleOnBlur: () => H, handleOnFocus: B, opened: y, dataCombo: r, currents: c, dropdownWidth: A || 0 }),
-    /* @__PURE__ */ v(ge, { visible: !!K && Z === "below", customClass: "hint", description: K })
+    }, handlerSetOnDenied: fe, rightElements: [...Y, /* @__PURE__ */ R(pe, { showClearButton: X, disabled: x() || I(), dropDownOpened: p, handlerClear: () => x() ? null : j(), handlerOpenClose: ae, customClassForSideButtons: te }, "action-buttons-multiselect")], children: /* @__PURE__ */ R(ge, { ...n, currents: c, handlerOnUnselect: de }) }),
+    p && /* @__PURE__ */ R(Ce, { ...n, selected: a, selectFieldRef: M, dropdownRef: g, gridWrapperStyle: n.gridLayout && D.current ? window.getComputedStyle(D.current) : void 0, handleOnSelect: B, handleOnFilter: q, handleOnKeydown: G, handleOnBlur: () => H, handleOnFocus: k, opened: p, dataCombo: i, currents: c, dropdownWidth: oe || T || 0 }),
+    /* @__PURE__ */ R(we, { visible: !!K && Z === "below", customClass: "hint", description: K })
   ] });
 };
 export {
-  Ie as default
+  Ae as default
 };
 //# sourceMappingURL=index.js.map

package/lib/inputs/select/multiple/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":["../../../../src/lib/inputs/select/multiple/index.tsx"],"sourcesContent":["import React, { KeyboardEvent, useEffect, useRef, useState } from 'react';\nimport _ from 'lodash';\nimport * as uuid from 'uuid';\nimport Dropdown from '../Dropdown';\nimport ActionButtons from '../ActionButtons';\nimport Selecteds from './Selecteds';\nimport * as constants from '../../../internals/constants';\nimport InputTextBase from '../../base/InputTextBase';\nimport { getFilteredMultipleDataCombo } from '../helper';\nimport { OnDenied } from '../../../@types/PermissionAttr';\nimport { DataCombo } from '../../../@types/DataCombo';\nimport { IMultipleSelectProps } from '../types';\nimport { CustomInputEvent } from '../../base/types';\nimport Hint from '../../../hint';\n\nconst MultipleSelect = (props: IMultipleSelectProps) => {\n  const {\n    idKey, dataSource = [], handlerClear, value = [], remoteSearch = false, descriptionKey,\n    showClearButton, rightElements = [], hint, hintPosition = 'below', customClassForLabel, \n    customClassForWrapper, customClassForInputContent, customClassForSideButtons,\n  } = props;\n  const [dataCombo, setDataCombo] = useState(dataSource);\n  const [currents, setCurrents] = useState<DataCombo[]>([]);\n  const [selected, setSelected] = useState<DataCombo>();\n  const [inputValue, setInputValue] = useState<string[] | number[]>([]);\n  const [opened, setOpened] = useState(false);\n  const [dropdownWidth, setDropdownWidth] = useState(0);\n  const [insideComponent, setInsideComponent] = useState(false);\n  const [onDenied, setOnDeniedSelect] = useState<OnDenied>();\n  const [valueFromProps, setValueFromProps] = useState<string[] | number[]>([]);\n\n  const componentId = `select-component${uuid.v1()}`;\n  const componentRef = useRef<HTMLInputElement>(null);\n  const dropdownRef = useRef<HTMLInputElement>(null);\n  const selectWrapper = useRef<HTMLDivElement | HTMLTextAreaElement>(null);\n  const gridElRef = useRef<Element>(null);\n  const inputTextRef = useRef<HTMLInputElement | HTMLTextAreaElement | null>(null);\n  const descriptionKeyIsString = typeof descriptionKey === 'string';\n  const insideComponents =\n    ['item', 'menubutton', 'filterinput', 'filtercontainer', 'label', 'actionbutton'];\n\n  const onScreenResize = () => {\n    if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);\n  };\n\n  const onClickOutside = (event: MouseEvent) => {\n    const { target } = event;\n    if (!insideComponents.includes((target as Element).className) &&\n      target !== selectWrapper.current && selectWrapper.current &&\n      !selectWrapper.current.contains(target as Node) &&\n      dropdownRef.current && !dropdownRef.current.contains(target as Node)) {\n      setOpened(false);\n    }\n  };\n\n  const onMouseMove = (event: MouseEvent) => {\n    const target = event.target as Element;\n    const idDropdown = dropdownRef.current?.parentElement?.id || '';\n    const dropdownElement = document.getElementById(idDropdown);\n    const keepDropdownOpen = Boolean(dropdownElement?.contains(target));\n    setInsideComponent(keepDropdownOpen);\n  };\n\n  const onClearClick = () => {\n    setSelected(undefined);\n    setCurrents([]);\n    if (props.onSelect) props.onSelect();\n  };\n\n  const onFilter = (filteredValue: string) => {\n    let selectedFilter = null;\n    if (remoteSearch) {\n      if (props.onSearch) props.onSearch(filteredValue);\n      setOpened(true);\n      setInputValue([filteredValue]);\n    } else {\n      let dataComboFilter = dataSource;\n      if (filteredValue.length > 0) {\n        dataComboFilter = getFilteredMultipleDataCombo({\n          inputText: [filteredValue],\n          dataSource,\n          descriptionKey,\n          currents,\n        });\n      }\n      if (dataComboFilter && dataComboFilter.length > 0) selectedFilter = dataComboFilter[0];\n      setDataCombo(dataComboFilter);\n      setOpened(true);\n      if (selectedFilter) setSelected(selectedFilter);\n      setInputValue([filteredValue]);\n    }\n  };\n\n  const onFocus = () => {\n    const dropdownWidthFocus =\n      selectWrapper.current ? selectWrapper.current.clientWidth : dropdownWidth;\n    setOpened(true);\n    setDropdownWidth(dropdownWidthFocus);\n  };\n\n  const onSelect = (select: DataCombo) => {\n    if (select === null) return;\n    const currentsSelect = [...currents, select];\n\n    setCurrents(currentsSelect);\n    setDataCombo(dataSource);\n    setInputValue([]);\n    if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();\n    if (props.onSelect) setSelected(props.onSelect(currentsSelect.map(i => i[idKey])));\n    dropdownRef.current?.focus();\n  };\n\n  const onUnselect = (id: string) => {\n    if (currents) {\n      const result = currents.filter(item => item[idKey] !== id);\n      setCurrents(result);\n      if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();\n      setOpened(false);\n      if (props.onSelect) setSelected(props.onSelect(result.map(i => i[idKey])));\n      dropdownRef.current?.focus();\n    }\n  };\n\n  const onOpenClose = () => {\n    setOpened(prevState => !prevState);\n    if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);\n  };\n\n  const onBlur = (e: CustomInputEvent) => {\n    if (props.onBlur) props.onBlur(e);\n    if (!insideComponent) {\n      setOpened(false);\n      setDataCombo(dataSource);\n    }\n  };\n\n  const onInputKeyDown = (e: CustomInputEvent | KeyboardEvent) => {\n    if (e.keyCode) {\n      if (e.keyCode === constants.keyCodes.ENTER && selected && opened) {\n        e.preventDefault?.();\n        if (!currents.some(current => current[idKey] === selected[idKey])) {\n          e.preventDefault?.();\n          onSelect(selected);\n        }\n      } else if ([constants.keyCodes.ARROW_UP, constants.keyCodes.ARROW_DOWN].includes(e.keyCode)) {\n        if (!opened) setOpened(true);\n        let index = dataCombo ? dataCombo.findIndex(d => d === selected) : 0;\n        if (e.keyCode === constants.keyCodes.ARROW_DOWN) {\n          index = (dataCombo && index === dataCombo.length - 1 ? 0 : index + 1);\n        } else {\n          index = (dataCombo && index === 0 ? dataCombo.length - 1 : index - 1);\n        }\n        if (dataCombo && dataCombo.length) {\n          if (descriptionKeyIsString && dataCombo[index][descriptionKey]) {\n            setInputValue(dataCombo[index][descriptionKey]);\n          } else if (!descriptionKeyIsString) setInputValue([descriptionKey(dataCombo[index])]);\n        }\n        if (dataCombo) setSelected(dataCombo[index]);\n      } else if (e.keyCode === constants.keyCodes.BACKSPACE) {\n        if (inputValue.length === 0) {\n          const currentsKeyDown = _.dropRight(currents);\n          setCurrents(currentsKeyDown);\n          if (props.onSelect) props.onSelect(currentsKeyDown.map(i => i[idKey]));\n        }\n      } else if (e.keyCode === constants.keyCodes.TAB) {\n        setOpened(false);\n      }\n    }\n  };\n\n  const setOnDenied = (denied: OnDenied) => {\n    setOnDeniedSelect(denied);\n  };\n\n  const shouldDisable = () =>\n    props.disabled ||\n    (onDenied && (onDenied.disabled || onDenied.hideContent));\n\n  const shouldBeReadOnly = () => props.readOnly || (onDenied && (onDenied.readOnly));\n\n  useEffect(() => {\n    window.addEventListener('resize', onScreenResize);\n    document.addEventListener('click', onClickOutside);\n    document.addEventListener('mousemove', onMouseMove);\n    if (handlerClear) onClearClick();\n\n    return () => {\n      window.removeEventListener('resize', onScreenResize);\n      document.removeEventListener('click', onClickOutside);\n      document.removeEventListener('mousemove', onMouseMove);\n    };\n  }, []);\n\n  useEffect(() => {\n    if (props.gridLayout) {\n      const gridEl = document.querySelector(`#${componentId}>.-withinput.grid-container`);\n      if (gridElRef.current !== gridEl && gridEl) gridElRef.current = gridEl;\n    }\n  }, []);\n\n  useEffect(() => {\n    if (value.length > 0 && value !== valueFromProps && dataSource.length > 0) {\n      const newCurrents = dataSource.filter((item: { [id: string]: string }) =>\n        value.includes(item[idKey] as never));\n\n      setValueFromProps(value);\n      setCurrents(newCurrents);\n    }\n  }, [dataSource.length, value.length]);\n\n  useEffect(() => {\n    if (!_.isEqual(dataSource, dataCombo)) {\n      const filteredDataCombo = remoteSearch\n        ? dataSource\n        : getFilteredMultipleDataCombo({\n            currents, dataSource, descriptionKey, inputText: inputValue,\n          });\n\n      setDataCombo(filteredDataCombo);\n      setSelected(filteredDataCombo.length > 0 ? dataCombo[0] : null);\n    }\n  }, [dataSource]);\n\n  return (\n    <span\n      id={componentId}\n      ref={componentRef}\n      className=\"select-component\">\n      <InputTextBase\n        {...props}\n        inputRef={(ref) => {\n          if (props.inputRef) {\n            if (!_.isFunction(props.inputRef)) {\n              props.inputRef.current = ref;\n            } else {\n              props.inputRef(ref);\n            }\n          }\n          inputTextRef.current = ref;\n        }}\n        autoComplete=\"off\"\n        value={inputValue.toString()}\n        readOnly={shouldBeReadOnly()}\n        onFocus={() => { onFocus(); }}\n        onBlur={(e: CustomInputEvent) => { onBlur(e); }}\n        onChange={(e?: CustomInputEvent) => {\n          if (e) onFilter(e.target.value);\n        }}\n        onClick={onFocus}\n        onKeyDown={onInputKeyDown}\n        customClassForLabel={customClassForLabel}\n        customClassForWrapper={\n          `selectwrapper ${(props.readOnly || shouldDisable() || shouldBeReadOnly()) && ' -undigitable'} ${customClassForWrapper}`\n        }\n        customClassForInputContent={`multiselect ${customClassForInputContent}`}\n        inputBaseRef={(r: HTMLDivElement | HTMLTextAreaElement) => { selectWrapper.current = r; }}\n        handlerSetOnDenied={setOnDenied}\n        rightElements={[\n          ...rightElements,\n          <ActionButtons\n            key=\"action-buttons-multiselect\"\n            showClearButton={showClearButton}\n            disabled={shouldDisable() || shouldBeReadOnly()}\n            dropDownOpened={opened}\n            handlerClear={() => {\n              if (shouldDisable()) return null;\n              return onClearClick();\n            }}\n            handlerOpenClose={onOpenClose}\n            customClassForSideButtons={customClassForSideButtons} />,\n        ]}>\n        <Selecteds\n          {...props}\n          currents={currents}\n          handlerOnUnselect={onUnselect} />\n      </InputTextBase>\n      {opened &&\n        <Dropdown\n          {...props}\n          selected={selected}\n          selectFieldRef={componentRef}\n          dropdownRef={dropdownRef}\n          gridWrapperStyle={props.gridLayout && gridElRef.current\n            ? window.getComputedStyle(gridElRef.current)\n            : undefined}\n          handleOnSelect={onSelect}\n          handleOnFilter={onFilter}\n          handleOnKeydown={onInputKeyDown}\n          handleOnBlur={() => onBlur}\n          handleOnFocus={onFocus}\n          opened={opened}\n          dataCombo={dataCombo}\n          currents={currents}\n          dropdownWidth={dropdownWidth || 0} />\n      }\n      <Hint visible={!!hint && hintPosition === 'below'} customClass=\"hint\" description={hint} />\n    </span>\n  );\n};\n\nexport default MultipleSelect;\n"],"names":["MultipleSelect","props","idKey","dataSource","handlerClear","value","remoteSearch","descriptionKey","showClearButton","rightElements","hint","hintPosition","customClassForLabel","customClassForWrapper","customClassForInputContent","customClassForSideButtons","dataCombo","setDataCombo","useState","currents","setCurrents","selected","setSelected","inputValue","setInputValue","opened","setOpened","dropdownWidth","setDropdownWidth","insideComponent","setInsideComponent","onDenied","setOnDeniedSelect","valueFromProps","setValueFromProps","componentId","uuid","v1","componentRef","useRef","dropdownRef","selectWrapper","gridElRef","inputTextRef","descriptionKeyIsString","insideComponents","onScreenResize","current","clientWidth","onClickOutside","event","target","includes","className","contains","onMouseMove","idDropdown","parentElement","id","keepDropdownOpen","Boolean","document","getElementById","onClearClick","undefined","onSelect","onFilter","filteredValue","selectedFilter","onSearch","dataComboFilter","length","getFilteredMultipleDataCombo","inputText","onFocus","dropdownWidthFocus","select","currentsSelect","focus","map","i","onUnselect","result","filter","item","onOpenClose","prevState","onBlur","e","onInputKeyDown","keyCode","constants","ENTER","preventDefault","some","ARROW_UP","ARROW_DOWN","index","findIndex","d","BACKSPACE","currentsKeyDown","_","dropRight","TAB","setOnDenied","denied","shouldDisable","disabled","hideContent","shouldBeReadOnly","readOnly","useEffect","window","addEventListener","removeEventListener","gridLayout","gridEl","querySelector","newCurrents","isEqual","filteredDataCombo","jsx","InputTextBase","ref","inputRef","isFunction","toString","r","ActionButtons","Selecteds","Dropdown","getComputedStyle","Hint"],"mappings":"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"}
+{"version":3,"file":"index.js","sources":["../../../../src/lib/inputs/select/multiple/index.tsx"],"sourcesContent":["import { KeyboardEvent, useEffect, useRef, useState } from 'react';\nimport _ from 'lodash';\nimport * as uuid from 'uuid';\nimport Dropdown from '../Dropdown';\nimport ActionButtons from '../ActionButtons';\nimport Selecteds from './Selecteds';\nimport * as constants from '../../../internals/constants';\nimport InputTextBase from '../../base/InputTextBase';\nimport { getFilteredMultipleDataCombo } from '../helper';\nimport { OnDenied } from '../../../@types/PermissionAttr';\nimport { DataCombo } from '../../../@types/DataCombo';\nimport { IMultipleSelectProps } from '../types';\nimport { CustomInputEvent } from '../../base/types';\nimport Hint from '../../../hint';\n\nconst MultipleSelect = (props: IMultipleSelectProps) => {\n  const {\n    idKey, dataSource = [], handlerClear, value = [], remoteSearch = false, descriptionKey,\n    showClearButton, rightElements = [], hint, hintPosition = 'below', customClassForLabel,\n    customClassForWrapper, customClassForInputContent, customClassForSideButtons, disabled = false,\n    dropdownMaxWidth = undefined,\n  } = props;\n  const [dataCombo, setDataCombo] = useState(dataSource);\n  const [currents, setCurrents] = useState<DataCombo[]>([]);\n  const [selected, setSelected] = useState<DataCombo>();\n  const [inputValue, setInputValue] = useState<string[] | number[]>([]);\n  const [opened, setOpened] = useState(false);\n  const [dropdownWidth, setDropdownWidth] = useState(0);\n  const [insideComponent, setInsideComponent] = useState(false);\n  const [onDenied, setOnDeniedSelect] = useState<OnDenied>();\n  const [valueFromProps, setValueFromProps] = useState<string[] | number[]>([]);\n\n  const componentId = `select-component${uuid.v1()}`;\n  const componentRef = useRef<HTMLInputElement>(null);\n  const dropdownRef = useRef<HTMLInputElement>(null);\n  const selectWrapper = useRef<HTMLDivElement | HTMLTextAreaElement>(null);\n  const gridElRef = useRef<Element>(null);\n  const inputTextRef = useRef<HTMLInputElement | HTMLTextAreaElement | null>(null);\n  const descriptionKeyIsString = typeof descriptionKey === 'string';\n  const insideComponents =\n    ['item', 'menubutton', 'filterinput', 'filtercontainer', 'label', 'actionbutton'];\n\n  const onScreenResize = () => {\n    if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);\n  };\n\n  const onClickOutside = (event: MouseEvent) => {\n    const { target } = event;\n    if (!insideComponents.includes((target as Element).className) &&\n      target !== selectWrapper.current && selectWrapper.current &&\n      !selectWrapper.current.contains(target as Node) &&\n      dropdownRef.current && !dropdownRef.current.contains(target as Node)) {\n      setOpened(false);\n    }\n  };\n\n  const onMouseMove = (event: MouseEvent) => {\n    const target = event.target as Element;\n    const idDropdown = dropdownRef.current?.parentElement?.id || '';\n    const dropdownElement = document.getElementById(idDropdown);\n    const keepDropdownOpen = Boolean(dropdownElement?.contains(target));\n    setInsideComponent(keepDropdownOpen);\n  };\n\n  const onClearClick = () => {\n    setSelected(undefined);\n    setCurrents([]);\n    if (props.onSelect) props.onSelect();\n  };\n\n  const onFilter = (filteredValue: string) => {\n    let selectedFilter = null;\n    if (remoteSearch) {\n      if (props.onSearch) props.onSearch(filteredValue);\n      setOpened(true);\n      setInputValue([filteredValue]);\n    } else {\n      let dataComboFilter = dataSource;\n      if (filteredValue.length > 0) {\n        dataComboFilter = getFilteredMultipleDataCombo({\n          inputText: [filteredValue],\n          dataSource,\n          descriptionKey,\n          currents,\n        });\n      }\n      if (dataComboFilter && dataComboFilter.length > 0) selectedFilter = dataComboFilter[0];\n      setDataCombo(dataComboFilter);\n      setOpened(true);\n      if (selectedFilter) setSelected(selectedFilter);\n      setInputValue([filteredValue]);\n    }\n  };\n\n  const onFocus = () => {\n    const dropdownWidthFocus =\n      selectWrapper.current ? selectWrapper.current.clientWidth : dropdownWidth;\n    setOpened(true);\n    setDropdownWidth(dropdownWidthFocus);\n  };\n\n  const onSelect = (select: DataCombo) => {\n    if (select === null) return;\n    const currentsSelect = [...currents, select];\n\n    setCurrents(currentsSelect);\n    setDataCombo(dataSource);\n    setInputValue([]);\n    if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();\n    if (props.onSelect) setSelected(props.onSelect(currentsSelect.map(i => i[idKey])));\n    dropdownRef.current?.focus();\n  };\n\n  const onUnselect = (id: string) => {\n    if (currents) {\n      const result = currents.filter(item => item[idKey] !== id);\n      setCurrents(result);\n      if (inputTextRef && inputTextRef.current) inputTextRef.current.focus();\n      setOpened(false);\n      if (props.onSelect) setSelected(props.onSelect(result.map(i => i[idKey])));\n      dropdownRef.current?.focus();\n    }\n  };\n\n  const onOpenClose = () => {\n    setOpened(prevState => !prevState);\n    if (selectWrapper.current) setDropdownWidth(selectWrapper.current.clientWidth);\n  };\n\n  const onBlur = (e: CustomInputEvent) => {\n    if (props.onBlur) props.onBlur(e);\n    if (selected && opened) {\n      onSelect(selected);\n    }\n    if (!insideComponent) {\n      setOpened(false);\n      setDataCombo(dataSource);\n    }\n  };\n\n  const onInputKeyDown = (e: CustomInputEvent | KeyboardEvent) => {\n    if (e.keyCode) {\n      if ((e.keyCode === constants.keyCodes.ENTER || e.key === constants.keys.TAB) \n          && selected && opened) {\n        if (e.keyCode === constants.keyCodes.ENTER) e.preventDefault?.();\n        if (!currents.some(current => current[idKey] === selected[idKey])) {\n          onSelect(selected);\n        }\n      } else if ([constants.keyCodes.ARROW_UP, constants.keyCodes.ARROW_DOWN].includes(e.keyCode)) {\n        if (!opened) setOpened(true);\n        let index = dataCombo ? dataCombo.findIndex(d => d === selected) : 0;\n        if (e.keyCode === constants.keyCodes.ARROW_DOWN) {\n          index = (dataCombo && index === dataCombo.length - 1 ? 0 : index + 1);\n        } else {\n          index = (dataCombo && index === 0 ? dataCombo.length - 1 : index - 1);\n        }\n        if (dataCombo && dataCombo.length) {\n          if (descriptionKeyIsString && dataCombo[index][descriptionKey]) {\n            setInputValue(dataCombo[index][descriptionKey]);\n          } else if (!descriptionKeyIsString) setInputValue([descriptionKey(dataCombo[index])]);\n        }\n        if (dataCombo) setSelected(dataCombo[index]);\n      } else if (e.keyCode === constants.keyCodes.BACKSPACE) {\n        if (inputValue.length === 0) {\n          const currentsKeyDown = _.dropRight(currents);\n          setCurrents(currentsKeyDown);\n          if (props.onSelect) props.onSelect(currentsKeyDown.map(i => i[idKey]));\n        }\n      } else if (e.keyCode === constants.keyCodes.TAB) {\n        setOpened(false);\n      }\n    }\n  };\n\n  const setOnDenied = (denied: OnDenied) => {\n    setOnDeniedSelect(denied);\n  };\n\n  const shouldDisable = () =>\n    disabled ||\n    (onDenied && (onDenied.disabled || onDenied.hideContent));\n\n  const shouldBeReadOnly = () => props.readOnly || (onDenied && (onDenied.readOnly));\n\n  useEffect(() => {\n    window.addEventListener('resize', onScreenResize);\n    document.addEventListener('click', onClickOutside);\n    document.addEventListener('mousemove', onMouseMove);\n    if (handlerClear) onClearClick();\n\n    return () => {\n      window.removeEventListener('resize', onScreenResize);\n      document.removeEventListener('click', onClickOutside);\n      document.removeEventListener('mousemove', onMouseMove);\n    };\n  }, []);\n\n  useEffect(() => {\n    if (props.gridLayout) {\n      const gridEl = document.querySelector(`#${componentId}>.-withinput.grid-container`);\n      if (gridElRef.current !== gridEl && gridEl) gridElRef.current = gridEl;\n    }\n  }, []);\n\n  useEffect(() => {\n    if (value.length > 0 && value !== valueFromProps && dataSource.length > 0) {\n      const newCurrents = dataSource.filter((item: { [id: string]: string }) =>\n        value.includes(item[idKey] as never));\n\n      setValueFromProps(value);\n      setCurrents(newCurrents);\n    }\n  }, [dataSource.length, value.length]);\n\n  useEffect(() => {\n    if (!_.isEqual(dataSource, dataCombo)) {\n      const filteredDataCombo = remoteSearch\n        ? dataSource\n        : getFilteredMultipleDataCombo({\n            currents, dataSource, descriptionKey, inputText: inputValue,\n          });\n\n      setDataCombo(filteredDataCombo);\n      setSelected(filteredDataCombo.length > 0 ? dataCombo[0] : null);\n    }\n  }, [dataSource]);\n\n  return (\n    <span\n      id={componentId}\n      ref={componentRef}\n      className=\"select-component\">\n      <InputTextBase\n        {...props}\n        inputRef={(ref) => {\n          if (props.inputRef) {\n            if (!_.isFunction(props.inputRef)) {\n              props.inputRef.current = ref;\n            } else {\n              props.inputRef(ref);\n            }\n          }\n          inputTextRef.current = ref;\n        }}\n        autoComplete=\"off\"\n        value={inputValue.toString()}\n        readOnly={shouldBeReadOnly()}\n        onFocus={() => { onFocus(); }}\n        onBlur={(e: CustomInputEvent) => { onBlur(e); }}\n        onChange={(e?: CustomInputEvent) => {\n          if (e) onFilter(e.target.value);\n        }}\n        onClick={onFocus}\n        onKeyDown={onInputKeyDown}\n        customClassForLabel={customClassForLabel}\n        customClassForWrapper={\n          `selectwrapper ${(props.readOnly || shouldDisable() || shouldBeReadOnly()) && ' -undigitable'} ${customClassForWrapper}`\n        }\n        customClassForInputContent={`multiselect ${customClassForInputContent}`}\n        inputBaseRef={(r: HTMLDivElement | HTMLTextAreaElement) => { selectWrapper.current = r; }}\n        handlerSetOnDenied={setOnDenied}\n        rightElements={[\n          ...rightElements,\n          <ActionButtons\n            key=\"action-buttons-multiselect\"\n            showClearButton={showClearButton}\n            disabled={shouldDisable() || shouldBeReadOnly()}\n            dropDownOpened={opened}\n            handlerClear={() => {\n              if (shouldDisable()) return null;\n              return onClearClick();\n            }}\n            handlerOpenClose={onOpenClose}\n            customClassForSideButtons={customClassForSideButtons} />,\n        ]}>\n        <Selecteds\n          {...props}\n          currents={currents}\n          handlerOnUnselect={onUnselect} />\n      </InputTextBase>\n      {opened &&\n        <Dropdown\n          {...props}\n          selected={selected}\n          selectFieldRef={componentRef}\n          dropdownRef={dropdownRef}\n          gridWrapperStyle={props.gridLayout && gridElRef.current\n            ? window.getComputedStyle(gridElRef.current)\n            : undefined}\n          handleOnSelect={onSelect}\n          handleOnFilter={onFilter}\n          handleOnKeydown={onInputKeyDown}\n          handleOnBlur={() => onBlur}\n          handleOnFocus={onFocus}\n          opened={opened}\n          dataCombo={dataCombo}\n          currents={currents}\n          dropdownWidth={dropdownMaxWidth || dropdownWidth || 0} />\n      }\n      <Hint visible={!!hint && hintPosition === 'below'} customClass=\"hint\" description={hint} />\n    </span>\n  );\n};\n\nexport default MultipleSelect;\n"],"names":["MultipleSelect","props","idKey","dataSource","handlerClear","value","remoteSearch","descriptionKey","showClearButton","rightElements","hint","hintPosition","customClassForLabel","customClassForWrapper","customClassForInputContent","customClassForSideButtons","disabled","dropdownMaxWidth","undefined","dataCombo","setDataCombo","useState","currents","setCurrents","selected","setSelected","inputValue","setInputValue","opened","setOpened","dropdownWidth","setDropdownWidth","insideComponent","setInsideComponent","onDenied","setOnDeniedSelect","valueFromProps","setValueFromProps","componentId","uuid","v1","componentRef","useRef","dropdownRef","selectWrapper","gridElRef","inputTextRef","descriptionKeyIsString","insideComponents","onScreenResize","current","clientWidth","onClickOutside","event","target","includes","className","contains","onMouseMove","idDropdown","parentElement","id","keepDropdownOpen","Boolean","document","getElementById","onClearClick","onSelect","onFilter","filteredValue","selectedFilter","onSearch","dataComboFilter","length","getFilteredMultipleDataCombo","inputText","onFocus","dropdownWidthFocus","select","currentsSelect","focus","map","i","onUnselect","result","filter","item","onOpenClose","prevState","onBlur","e","onInputKeyDown","keyCode","constants","ENTER","key","TAB","preventDefault","some","ARROW_UP","ARROW_DOWN","index","findIndex","d","BACKSPACE","currentsKeyDown","_","dropRight","setOnDenied","denied","shouldDisable","hideContent","shouldBeReadOnly","readOnly","useEffect","window","addEventListener","removeEventListener","gridLayout","gridEl","querySelector","newCurrents","isEqual","filteredDataCombo","jsx","InputTextBase","ref","inputRef","isFunction","toString","r","ActionButtons","Selecteds","Dropdown","getComputedStyle","Hint"],"mappings":"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"}

package/lib/inputs/select/simple/index.js

@@ -1,63 +1,64 @@
-import { jsxs as we, jsx as K } from "react/jsx-runtime";
-import { useState as m, useRef as R, useEffect as W } from "react";
+import { jsxs as we, jsx as N } from "react/jsx-runtime";
+import { useState as m, useRef as E, useEffect as F } from "react";
 import Y from "../../../_virtual/lodash.js";
-import ye from "../Dropdown.js";
-import Se from "../ActionButtons.js";
-import { keyCodes as F } from "../../../internals/constants.js";
+import Se from "../Dropdown.js";
+import Ee from "../ActionButtons.js";
+import { keyCodes as R, keys as Re } from "../../../internals/constants.js";
 import { getFilteredSimpleDataCombo as Z } from "../helper.js";
-import Re from "../../base/InputTextBase.js";
-import ve from "../../../node_modules/uuid/dist/v1.js";
-const Te = (i) => {
+import ve from "../../base/InputTextBase.js";
+import We from "../../../node_modules/uuid/dist/v1.js";
+const Ae = (i) => {
   const {
-    value: C,
+    value: g,
     descriptionKey: t,
     dataSource: D = [],
-    gridLayout: B,
-    onSearch: N,
+    gridLayout: k,
+    onSearch: A,
     disabled: ee,
     readOnly: ne,
     openDropdownOnFocus: te = !0,
     selectFirstOnEnter: oe = !1,
-    idKey: g,
-    remoteSearch: k = !1,
-    name: _ = "",
+    idKey: y,
+    remoteSearch: B = !1,
+    name: K = "",
     undigitable: x,
-    searchOnDropdown: $ = !1,
-    allOptions: a = void 0,
+    searchOnDropdown: _ = !1,
+    allOptions: d = void 0,
     showClearButton: ie = !1,
     searchNotFoundText: re,
     rightElements: se = [],
     customClassForWrapper: le,
     customClassForInputContent: ce,
     customClassForLabel: ue,
-    customClassForSideButtons: ae
-  } = i, s = typeof t == "string", o = a ? [{
-    [g]: a.idValue,
-    [s ? t : t(a.label)]: a.label
-  }, ...D] : D, [r, v] = m(o), [c, p] = m(null), [O, u] = m(""), [y, d] = m(!1), [de, I] = m(0), [fe, me] = m(!1), [S, pe] = m(), [A, P] = m(!1), E = R(null), z = `select-component-${_}-${ve()}`, V = R(null), l = R(null), b = R(null), h = R(null), j = () => {
-    l.current && I(l.current.clientWidth);
-  }, q = (e) => {
+    customClassForSideButtons: de,
+    dropdownMaxWidth: ae = void 0
+  } = i, s = typeof t == "string", o = d ? [{
+    [y]: d.idValue,
+    [s ? t : t(d.label)]: d.label
+  }, ...D] : D, [r, v] = m(o), [u, p] = m(null), [h, l] = m(""), [w, a] = m(!1), [fe, I] = m(0), [me, pe] = m(!1), [S, he] = m(), [$, P] = m(!1), W = E(null), z = `select-component-${K}-${We()}`, M = E(null), c = E(null), b = E(null), C = E(null), V = () => {
+    c.current && I(c.current.clientWidth);
+  }, j = (e) => {
     const {
       target: n
     } = e;
-    n !== l.current && !l.current?.contains(n) && !E.current?.contains(n) && d(!1);
-  }, M = (e) => {
-    const n = e.target, f = E.current?.parentElement?.id || "", Oe = !!document.getElementById(f)?.contains(n);
-    me(Oe);
+    n !== c.current && !c.current?.contains(n) && !W.current?.contains(n) && a(!1);
+  }, q = (e) => {
+    const n = e.target, f = W.current?.parentElement?.id || "", Oe = !!document.getElementById(f)?.contains(n);
+    pe(Oe);
   }, J = (e) => ({
     target: {
-      value: e ? e[g] : void 0,
-      name: _
+      value: e ? e[y] : void 0,
+      name: K
     }
-  }), w = (e) => {
+  }), O = (e) => {
     if (i.onChange) {
       const n = J(e);
       i.onChange(n);
     }
   }, U = (e) => {
     let n = null;
-    if (k)
-      N && N(e);
+    if (B)
+      A && A(e);
     else {
       const f = Z({
         inputText: e,
@@ -66,92 +67,93 @@ const Te = (i) => {
       });
       f && f.length > 0 && (n = f[0], p(n)), v(f);
     }
-    d(!0), u(e), n && (s && e === n[t] || !s && e === t(n)) && w(n);
+    a(!0), l(e), n && (s && e === n[t] || !s && e === t(n)) && O(n);
   }, G = (e) => {
-    e && (p(e), u(s ? e[t] : t(e)), new Promise((n) => {
-      n(w(e));
+    e && (p(e), l(s ? e[t] : t(e)), new Promise((n) => {
+      n(O(e));
     }).finally(() => {
-      h && h.current && h.current.focus(), d(!1);
-    }), E.current?.focus());
-  }, he = () => {
-    d((e) => !e), l.current && I(l.current.clientWidth);
-  }, L = () => {
-    if (te && d(!0), l) {
-      const e = l.current ? l.current.clientWidth : 0;
+      C && C.current && C.current.focus(), a(!1);
+    }), W.current?.focus());
+  }, Ce = () => {
+    a((e) => !e), c.current && I(c.current.clientWidth);
+  }, T = () => {
+    if (te && a(!0), c) {
+      const e = c.current ? c.current.clientWidth : 0;
       I(e);
     }
   }, H = () => {
     if (i.onBlur) {
-      const e = J(c);
-      i.onBlur(e), (c && s && O !== c[t] || !s && O !== t(c)) && (p(null), u(O), new Promise((n) => {
-        n(w(null));
+      const e = J(u);
+      i.onBlur(e), (u && s && h !== u[t] || !s && h !== t(u)) && (p(null), l(h), new Promise((n) => {
+        n(O(null));
       }).finally(() => {
-        w();
+        O();
       }));
     }
-    fe || (d(!1), P(!1), v(o));
+    me || (a(!1), P(!1), v(o));
   }, Q = (e) => {
     if (e.keyCode) {
-      if (e.keyCode === F.ENTER && c && y)
-        e.preventDefault?.(), G(c);
-      else if ([F.ARROW_UP, F.ARROW_DOWN].includes(e.keyCode)) {
-        y || d(!0);
-        let n = r.length > 0 ? r.findIndex((f) => c && f[g] === c[g]) : 0;
-        e.keyCode === F.ARROW_DOWN ? n = r && n === r.length - 1 ? 0 : n + 1 : n = r && n === 0 ? r?.length - 1 : n - 1, p(r[n]), s && u(r[n][t]), s || u(t(r[n]));
+      if ((e.keyCode === R.ENTER || e.key === Re.TAB) && u && w)
+        e.keyCode === R.ENTER && e.preventDefault?.(), G(u);
+      else if ([R.ARROW_UP, R.ARROW_DOWN].includes(e.keyCode)) {
+        w || a(!0);
+        let n = r.length > 0 ? r.findIndex((f) => u && f[y] === u[y]) : 0;
+        e.keyCode === R.ARROW_DOWN ? n = r && n === r.length - 1 ? 0 : n + 1 : n = r && n === 0 ? r?.length - 1 : n - 1, p(r[n]), s && l(r[n][t]), s || l(t(r[n]));
       }
     }
-    A || P(!0);
-  }, Ce = () => {
+    $ || P(!0);
+  }, ge = () => {
     new Promise((e) => {
-      e(w(null));
+      e(O(null));
     }).finally(() => {
-      p(null), u(""), w(), h && h.current && h.current.focus(), d(!1);
+      p(null), l(""), O(), C && C.current && C.current.focus(), a(!1);
     });
-  }, ge = (e) => {
-    pe(e);
-  }, X = () => ee || S && (S.disabled || S.hideContent), T = () => ne || S && S.readOnly;
-  return W(() => (window.addEventListener("resize", j), document.addEventListener("click", q), document.addEventListener("mousemove", M), () => {
-    window.removeEventListener("resize", j), document.removeEventListener("click", q), document.removeEventListener("mousemove", M);
-  }), []), W(() => {
-    if (B) {
+  }, ye = (e) => {
+    he(e);
+  }, X = () => ee || S && (S.disabled || S.hideContent), L = () => ne || S && S.readOnly;
+  return F(() => (window.addEventListener("resize", V), document.addEventListener("click", j), document.addEventListener("mousemove", q), () => {
+    window.removeEventListener("resize", V), document.removeEventListener("click", j), document.removeEventListener("mousemove", q);
+  }), []), F(() => {
+    if (k) {
       const e = document.querySelector(`#${z}>.-withinput.grid-container`);
       b.current !== e && e && (b.current = e);
     }
-  }, [B]), W(() => {
+  }, [k]), F(() => {
     if (o.length > 0) {
       let e = null;
-      C || C === 0 ? e = o.find((n) => (C || C === 0) && n[g]?.toString().toLowerCase() === C?.toString().toLowerCase()) : o.length > 0 && oe && (e = o[0]), p(e), u(s ? e ? e[t] : "" : e ? t(e) : "");
+      g || g === 0 ? e = o.find((n) => (g || g === 0) && n[y]?.toString().toLowerCase() === g?.toString().toLowerCase()) : o.length > 0 && oe && (e = o[0]), p(e), l(s ? e ? e[t] : "" : e ? t(e) : "");
     }
-  }, [o.length, C]), W(() => {
+    o.length === 0 && h && l("");
+  }, [o.length, g]), F(() => {
     if (!Y.isEqual(r, o)) {
-      const e = x || k || !A ? o : Z({
-        inputText: O,
+      const e = x || B || !$ ? o : Z({
+        inputText: h,
         dataSource: o,
         descriptionKey: t
       });
-      if (v(e), o.length > 0 && k) {
+      if (v(e), o.length > 0 && B) {
         const n = o[0];
         p(n);
       }
     }
-    a && v([{
-      [g]: a.idValue,
-      [s ? t : t(a.label)]: a.label
+    d && v([{
+      [y]: d.idValue,
+      [s ? t : t(d.label)]: d.label
     }, ...D]);
-  }, [JSON.stringify(o)]), /* @__PURE__ */ we("span", { id: z, ref: V, className: "select-component", children: [
-    /* @__PURE__ */ K(Re, { ...i, inputRef: (e) => {
-      i.inputRef && (Y.isFunction(i.inputRef) ? i.inputRef(e) : i.inputRef.current = e), h.current = e;
-    }, autoComplete: "off", readOnly: x || T(), value: O, onFocus: L, onBlur: H, onChange: (e) => {
+  }, [JSON.stringify(o)]), /* @__PURE__ */ we("span", { id: z, ref: M, className: "select-component", children: [
+    /* @__PURE__ */ N(ve, { ...i, inputRef: (e) => {
+      i.inputRef && (Y.isFunction(i.inputRef) ? i.inputRef(e) : i.inputRef.current = e), C.current = e;
+    }, autoComplete: "off", readOnly: x || L(), value: h, onFocus: T, onBlur: H, onChange: (e) => {
       e && U(e.target.value);
-    }, onClick: L, onKeyDown: Q, customClassForLabel: ue, customClassForWrapper: `selectwrapper ${(x || $ || T()) && " -undigitable"} ${le}`, customClassForInputContent: `multiselect ${ce}`, inputBaseRef: (e) => {
-      l.current = e;
-    }, handlerSetOnDenied: (e) => ge(e), rightElements: [...se, /* @__PURE__ */ K(Se, { disabled: X() || T(), showClearButton: ie, dropDownOpened: y, handlerClear: () => X() ? null : Ce(), handlerOpenClose: he, customClassForSideButtons: ae }, "action-buttons-simpleselect")] }),
-    y && /* @__PURE__ */ K(ye, { ...i, opened: y, selected: c, inputValue: O, selectFieldRef: V, dropdownRef: E, searchOnDropdown: $, gridWrapperStyle: B && b.current ? window.getComputedStyle(b.current) : void 0, handleOnSelect: (e) => {
+    }, onClick: T, onKeyDown: Q, customClassForLabel: ue, customClassForWrapper: `selectwrapper ${(x || _ || L()) && " -undigitable"} ${le}`, customClassForInputContent: `multiselect ${ce}`, inputBaseRef: (e) => {
+      c.current = e;
+    }, handlerSetOnDenied: (e) => ye(e), rightElements: [...se, /* @__PURE__ */ N(Ee, { disabled: X() || L(), showClearButton: ie, dropDownOpened: w, handlerClear: () => X() ? null : ge(), handlerOpenClose: Ce, customClassForSideButtons: de }, "action-buttons-simpleselect")] }),
+    w && /* @__PURE__ */ N(Se, { ...i, opened: w, selected: u, inputValue: h, selectFieldRef: M, dropdownRef: W, searchOnDropdown: _, gridWrapperStyle: k && b.current ? window.getComputedStyle(b.current) : void 0, handleOnSelect: (e) => {
       e && G(e);
-    }, handleOnFilter: (e) => U(e), handleOnKeydown: Q, handleOnBlur: () => H, handleOnFocus: L, dataCombo: r, dropdownWidth: de || 0, searchNotFoundText: re })
+    }, handleOnFilter: (e) => U(e), handleOnKeydown: Q, handleOnBlur: () => H, handleOnFocus: T, dataCombo: r, searchNotFoundText: re, dropdownWidth: ae || fe || 0 })
   ] });
 };
 export {
-  Te as default
+  Ae as default
 };
 //# sourceMappingURL=index.js.map