linear-react-components-ui 1.1.26-beta.9 → 2.0.0-beta.0

package/lib/inputs/period/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/lib/inputs/period/index.tsx"],"sourcesContent":["import '../../assets/styles/periodpicker.scss';\n\nimport { useEffect, useRef, useState, FocusEvent as ReactFocusEvent, useCallback, useId } from 'react';\nimport moment, { Moment } from 'moment';\nimport PeriodList from './PeriodList';\nimport BaseMask from '../mask/BaseMask';\nimport Dropdown from './Dropdown';\nimport Calendar from '../../calendar';\nimport Button from '../../buttons';\nimport Icon from '../../icons';\nimport Dialog from './Dialog';\nimport Hint from '../../hint';\nimport Grid from '../../gridlayout';\nimport * as helperBase from '../base/helpers';\nimport { ColorStyles } from '../../@types/ColorStyles';\nimport { OnDenied } from '../../@types/PermissionAttr';\nimport { ChangeInputPeriodEvent, TypeCurrentDate, DateTypes, IPeriodPickerProps } from './types';\nimport { CustomInputEvent } from '../base/types';\nimport { ErrorMessage } from '../errorMessage';\nimport TextContent from '../../textContent';\nimport Popover from '../../popover';\n\nconst PeriodPicker = (props: IPeriodPickerProps) => {\n  const {\n    showButtonOpen = true, openOnFocus = true, shouldCloseOnSelect = true, calendarColorStyle,\n    showCalendarInDialog = false, dialogSize = { width: '350px', height: '350px' }, hint, hintPosition = 'below',\n    themePopover = 'light', popoverAlign = 'left', gridLayout,\n  } = props;\n  const idValueInitial = useId();\n  const idValueFinal = useId();\n\n  const [valueInitial, setValueInitial] = useState<moment.Moment | undefined>(props.value && moment(props.value.initial, 'DD/MM/YYYY'));\n  const [valueFinal, setValueFinal] = useState<moment.Moment | undefined>(props.value && moment(props.value.final, 'DD/MM/YYYY'));\n  const [valuePeriodSelection, setValuePeriodSelection] = useState('week');\n  const [showCalendarValueInitial, setShowCalendarValueInitial] = useState(false);\n  const [showCalendarValueFinal, setShowCalendarValueFinal] = useState(false);\n  const [showPeriodSelection, setShowPeriodSelection] = useState(false);\n  const [inputDimensions, setInputDimensions] = useState<DOMRect>();\n  const [onDenied, setOnDenied] = useState<OnDenied>();\n  const [currentTypeDate, setCurrentTypeDate] = useState<TypeCurrentDate>('valueInitial');\n\n  const wrapperBaseInputPeriodRef = useRef<HTMLDivElement | null>(null);\n  const inputContainerRef = useRef<HTMLDivElement>(null);\n  const inputInitialRef = useRef<HTMLInputElement | HTMLTextAreaElement | null>(null);\n  const buttonOpenRef = useRef<HTMLButtonElement | null>(null);\n  const currentDateButtonRef = useRef<HTMLButtonElement>(null);\n  const buttonSelectPeriodRef = useRef<HTMLButtonElement | null>(null);\n  const dropdownCalendarContainer = useRef<HTMLDivElement | null>(null);\n  const inputFinalRef = useRef<HTMLInputElement | HTMLTextAreaElement | null>(null);\n  const calendarContainerRef = useRef<HTMLDivElement | null>(null);\n\n  const onScreenResize = () => {\n    setInputDimensions(inputContainerRef?.current?.getBoundingClientRect());\n  };\n\n  const onBlurWithoutWrapper = (event: ReactFocusEvent<HTMLDivElement>) => {\n    const focusOnAnotherField = !wrapperBaseInputPeriodRef.current?.contains(event.relatedTarget);\n    if (!showCalendarInDialog && showCalendarValueInitial && focusOnAnotherField) { \n      setShowCalendarValueInitial(false); \n    }\n    if (!showCalendarInDialog && showCalendarValueFinal && focusOnAnotherField) { \n      setShowCalendarValueFinal(false); \n    }\n  };\n\n  const onKeyDownPress = (event: KeyboardEvent) => {\n    const { target } = event;\n    const targetElement = target as HTMLInputElement;\n    if (calendarContainerRef.current && event && event.key && event.key === 'Escape') {\n      event.preventDefault();\n      targetElement.focus();\n      if (showCalendarValueInitial) {\n        if (targetElement.id !== 'valueInitial') {\n          inputInitialRef.current?.focus();\n        }\n        setShowCalendarValueInitial(false);\n      }\n      if (showCalendarValueFinal) {\n        if (targetElement.id !== 'valueFinal') {\n          inputFinalRef.current?.focus();\n        }\n        setShowCalendarValueFinal(false);\n      }\n\n      if (showPeriodSelection) {\n        setShowPeriodSelection(false);\n        inputFinalRef.current?.focus();\n        setShowCalendarValueFinal(false);\n      }\n    }\n    event.stopPropagation();\n  };\n\n  const keepPositionCalendarByScroll = () => {\n    const inputDateDimensions = inputContainerRef.current?.getBoundingClientRect();\n    const positionTop = inputDateDimensions && inputDateDimensions.bottom;\n    if (dropdownCalendarContainer && dropdownCalendarContainer.current && inputDateDimensions) {\n      dropdownCalendarContainer.current.style.top = String(positionTop).concat('px');\n    }\n  };\n\n  const openCalendar = (calendarName: string) => {\n    if (calendarName === 'valueInitial') {\n      setCurrentTypeDate('valueInitial');\n      setShowCalendarValueFinal(false);\n      if (!showCalendarValueInitial) {\n        inputInitialRef.current?.focus();\n        if (showCalendarInDialog) {\n          setTimeout(() => {\n            currentDateButtonRef.current?.focus();\n          }, 100);\n        }\n        setShowCalendarValueInitial(true);\n      }\n    }\n    if (calendarName === 'valueFinal') {\n      setCurrentTypeDate('valueFinal');\n      setShowCalendarValueInitial(false);\n      if (!showCalendarValueFinal) {\n        inputFinalRef.current?.focus();\n        if (showCalendarInDialog) {\n          setTimeout(() => {\n            currentDateButtonRef.current?.focus();\n          }, 100);\n        }\n        setShowCalendarValueFinal(true);\n      }\n    }\n    if (inputContainerRef.current) {\n      setInputDimensions(inputContainerRef.current.getBoundingClientRect());\n    }\n  };\n\n  const closeCalendar = (calendarName: TypeCurrentDate) => {\n    if (calendarName === 'valueInitial') { inputInitialRef.current?.focus(); }\n    if (calendarName === 'valueFinal') { inputFinalRef.current?.focus(); }\n    setShowCalendarValueInitial(false);\n    setShowCalendarValueFinal(false);\n  };\n\n  const onDateChange = (date: { initial?: Moment, final?: Moment }) => {\n    const initial = date.initial ? date.initial.format('YYYY-MM-DD') : '';\n    const final = date.final ? date.final.format('YYYY-MM-DD') : '';\n    props?.onChange?.(undefined, '', { initial, final });\n  };\n\n  const onCloseDateDialog = (calendarName: TypeCurrentDate | 'periodSelection') => {\n    setTimeout(() => {\n      if (calendarName === 'valueInitial') {\n        inputInitialRef.current?.focus();\n        setShowCalendarValueInitial(false);\n      }\n      if (calendarName === 'valueFinal') {\n        inputFinalRef.current?.focus();\n        setShowCalendarValueFinal(false);\n      }\n      if (calendarName === 'periodSelection') {\n        setShowPeriodSelection(false);\n        inputFinalRef.current?.focus();\n        setShowCalendarValueFinal(false);\n      }\n    }, 100);\n  };\n\n  const onInputFocus = (e: CustomInputEvent) => {\n    const { name } = e.target as HTMLInputElement;\n\n    if (openOnFocus) openCalendar(name);\n    if (props.onFocus) props.onFocus(e);\n  };\n\n  const onInputBlur = (e: CustomInputEvent) => {\n    if (props.onBlur) props.onBlur(e);\n  };\n\n  const onInputChange = (event?: ChangeInputPeriodEvent) => {\n    if (event) {\n      const { name: changingAux, value } = event.target as HTMLInputElement;\n      if (String(value).trim().length === 0) {\n        if (changingAux === 'valueInitial') {\n          setValueInitial(undefined);\n        } else {\n          setValueFinal(undefined);\n        }\n      }\n    }\n  };\n\n  const setValue = (\n    event: ChangeInputPeriodEvent,\n    value?: Moment | string,\n    shouldOpenDropdown = true,\n  ) => {\n    const valueDateName = event ? event.target.name : '';\n    const dateObj = moment(value, 'DD/MM/YYYY');\n    if (showCalendarValueInitial) inputInitialRef.current?.focus();\n    if (showCalendarValueFinal) inputFinalRef.current?.focus();\n\n    if (valueDateName === 'valueInitial') {\n      setValueInitial(dateObj);\n      onDateChange({ initial: dateObj, final: valueFinal });\n    } else {\n      setValueFinal(dateObj);\n      onDateChange({ initial: valueInitial, final: dateObj });\n    }\n\n    if (valueDateName === 'valueInitial' && !valueFinal && shouldOpenDropdown) {\n      inputFinalRef.current?.focus();\n      setShowCalendarValueFinal(true);\n    }\n\n    if (shouldCloseOnSelect) {\n      setShowCalendarValueInitial(false);\n      setShowCalendarValueFinal(false);\n    }\n  };\n\n  const shouldDisable = () => {\n    const { disabled } = props;\n    return disabled || (onDenied && (onDenied.disabled || onDenied.hideContent));\n  };\n\n  const getButtonOpen = useCallback(() => {\n    if (!showButtonOpen) return null;\n\n    return (\n      <Button\n        key=\"button-open\"\n        boxShadow={false}\n        disabled={shouldDisable()}\n        customClass=\"calendar-button\"\n        icon={<Icon name=\"calendar\" />}\n        onClick={() => {\n          if (showCalendarValueFinal || showCalendarValueInitial) {\n            closeCalendar(currentTypeDate);\n          } else {\n            openCalendar(currentTypeDate);\n          }\n        }}\n        tabIndex={-1}\n        targetRef={(ref) => { buttonOpenRef.current = ref; }} />\n    );\n  }, [showCalendarValueFinal, showCalendarValueInitial]);\n\n  const getPeriodSelection = (\n    valuePeriodSelectionAux: string,\n    setPeriodDates: (value: DateTypes | 'custom', date: Moment[] | null) => void,\n  ) => (\n    <PeriodList selected={valuePeriodSelectionAux} handleOnSelect={setPeriodDates} />\n  );\n\n  const openPeriodSelecion = () => {\n    setShowCalendarValueFinal(false);\n    setShowCalendarValueInitial(false);\n    setShowPeriodSelection(true);\n    if (inputContainerRef.current) {\n      setInputDimensions(inputContainerRef.current.getBoundingClientRect());\n    }\n  };\n\n  const closePeriodSelection = () => {\n    setShowPeriodSelection(false);\n    inputFinalRef.current?.focus();\n    setShowCalendarValueFinal(false);\n  };\n\n  const getButtonSelectPeriod = useCallback(() => {\n    return (\n      <Button\n        key=\"button-select-period\"\n        disabled={shouldDisable()}\n        tabIndex={-1}\n        customClass=\"calendar-button\"\n        icon={<Icon name=\"more1\" />}\n        onBlur={() => setTimeout(() => setShowPeriodSelection(false), 100)}\n        onClick={() => !showPeriodSelection ? openPeriodSelecion() : closePeriodSelection()}\n        targetRef={(ref) => { buttonSelectPeriodRef.current = ref; }} />\n    );\n  }, [showPeriodSelection]);\n\n  const getCalendar = (\n    value?: Moment,\n    calendarColorStyleCalendar?: ColorStyles,\n    valueDateName?: string,\n  ) => (\n    <Calendar\n      colorStyle={calendarColorStyleCalendar}\n      currentDate={value !== undefined ? moment(value) : moment()}\n      calendarContainer={(ref) => { calendarContainerRef.current = ref; }}\n      onDateChange={date => setValue({ target: { name: valueDateName } }, date)}\n      currentDateButton={buttonElement => currentDateButtonRef.current = buttonElement} />\n  );\n\n  const setPeriodDates = (selected: DateTypes | 'custom', dates: Moment[] | null) => {\n    if (selected === 'custom') {\n      inputInitialRef.current?.focus();\n      setValuePeriodSelection(selected);\n      setShowPeriodSelection(false);\n      return;\n    }\n\n    setValuePeriodSelection(selected);\n    if (dates) {\n      setValueInitial(dates[0]);\n      setValueFinal(dates[1]);\n    }\n\n    if (shouldCloseOnSelect) {\n      setShowPeriodSelection(false);\n    }\n\n    inputFinalRef.current?.focus();\n    setShowCalendarValueFinal(false);\n  };\n\n  const getCalendarInitial = () => {\n    if (onDenied && onDenied.readOnly) return null;\n    if (calendarContainerRef && calendarContainerRef.current) calendarContainerRef.current.id = 'valueInitial';\n    if (showCalendarInDialog) {\n      return (\n        <Dialog\n          handlerClose={() => onCloseDateDialog('valueInitial')}\n          dialogSize={dialogSize}\n          onOpenChange={setShowCalendarValueInitial}>\n          {getCalendar(valueInitial, calendarColorStyle, 'valueInitial')}\n        </Dialog>\n      );\n    }\n    return (\n      <Dropdown\n        containerRef={wrapperBaseInputPeriodRef as any}\n        showButtonOpen={showButtonOpen}\n        inputDimensions={inputDimensions}\n        dropdownRef={(el: HTMLDivElement) => { dropdownCalendarContainer.current = el; }}>\n        {getCalendar(valueInitial, calendarColorStyle, 'valueInitial')}\n      </Dropdown>\n    );\n  };\n\n  const getCalendarFinal = () => {\n    if (onDenied && onDenied.readOnly) return null;\n    if (calendarContainerRef && calendarContainerRef.current) calendarContainerRef.current.id = 'valueFinal';\n    if (showCalendarInDialog) {\n      return (\n        <Dialog\n          handlerClose={() => onCloseDateDialog('valueFinal')}\n          dialogSize={dialogSize}\n          onOpenChange={setShowCalendarValueFinal}>\n          {getCalendar(valueFinal, calendarColorStyle, 'valueFinal')}\n        </Dialog>\n      );\n    }\n    return (\n      <Dropdown\n        containerRef={wrapperBaseInputPeriodRef as any}\n        showButtonOpen={showButtonOpen}\n        inputDimensions={inputDimensions}\n        dropdownRef={(el: HTMLDivElement) => { dropdownCalendarContainer.current = el; }}>\n        {getCalendar(valueFinal, calendarColorStyle, 'valueFinal')}\n      </Dropdown>\n    );\n  };\n\n  const getPeriodOfDatesSelection = () => {\n    if (showCalendarInDialog) {\n      return (\n        <Dialog\n          handlerClose={() => onCloseDateDialog('periodSelection')}\n          dialogSize={dialogSize}\n          onOpenChange={setShowPeriodSelection}>\n          {getPeriodSelection(valuePeriodSelection, setPeriodDates)}\n        </Dialog>\n      );\n    }\n    return (\n      <Dropdown\n        containerRef={wrapperBaseInputPeriodRef as any}\n        showButtonOpen={showButtonOpen}\n        inputDimensions={inputDimensions}\n        dropdownRef={(el: HTMLDivElement) => { dropdownCalendarContainer.current = el; }}>\n        {getPeriodSelection(valuePeriodSelection, setPeriodDates)}\n      </Dropdown>\n    );\n  };\n\n  useEffect(() => {\n    window.addEventListener('resize', onScreenResize);\n    document.addEventListener('scroll', keepPositionCalendarByScroll);\n    document.getElementById('modal-dialog-content')?.addEventListener('scroll', keepPositionCalendarByScroll);\n\n    if (inputContainerRef.current) onScreenResize();\n\n    if (inputInitialRef && inputInitialRef.current) inputInitialRef.current.id = idValueInitial;\n    if (inputFinalRef && inputFinalRef.current) inputFinalRef.current.id = idValueFinal;\n\n    return () => {\n      window.removeEventListener('resize', onScreenResize);\n      document.removeEventListener('scroll', keepPositionCalendarByScroll);\n      document.getElementById('modal-dialog-content')?.removeEventListener('scroll', keepPositionCalendarByScroll);\n    };\n  }, []);\n\n  useEffect(() => {\n    document.addEventListener('keydown', onKeyDownPress);\n    return () => {\n      document.removeEventListener('keydown', onKeyDownPress);\n    };\n  }, [\n    showCalendarValueFinal,\n    showCalendarValueInitial,\n    showPeriodSelection,\n    calendarContainerRef.current,\n  ]);\n\n  useEffect(() => {\n    if (valueFinal && valueInitial && moment(valueFinal).isBefore(moment(valueInitial))) {\n      setValueInitial(valueFinal);\n      setValueFinal(valueInitial);\n    } else if (props.onChange) {\n      const initial = valueInitial ? valueInitial.format('YYYY-MM-DD') : '';\n      const final = valueFinal ? valueFinal.format('YYYY-MM-DD') : '';\n      props.onChange(undefined, '', { initial, final });\n    }\n  }, [valueInitial, valueFinal]);\n\n  useEffect(() => {\n    if (props.value && !(moment(props.value.initial).isSame(valueInitial) ||\n      moment(props.value.final).isSame(valueFinal))) {\n      const { initial: valueInitialProp, final: valueFinalProp } = props.value;\n\n      let newValueInitial;\n      let newValueFinal;\n\n      if (moment(valueInitialProp, 'YYYY-MM-DD', true).isValid()) {\n        newValueInitial = moment(valueInitialProp, 'YYYY-MM-DD');\n      }\n\n      if (moment(valueFinalProp, 'YYYY-MM-DD', true).isValid()) {\n        newValueFinal = moment(valueFinalProp, 'YYYY-MM-DD');\n      }\n      setValueInitial(newValueInitial);\n      setValueFinal(newValueFinal);\n    }\n  }, [props.value]);\n\n  if (onDenied && onDenied.unvisible) return null;\n\n  const component = () => (\n    <div\n      ref={wrapperBaseInputPeriodRef}\n      onBlur={onBlurWithoutWrapper}\n      className=\"input-base-component datepicker-period-container\">\n      {props.label && (\n        <div className=\"labelcontainer\">\n          <TextContent\n            required={props.required}\n            className={props.customClassForLabel}\n            labelUppercase={props.labelUppercase} />\n          <div className=\"text-content\" style={{ display: 'flex' }}>\n            <div\n              className={`label ${props.customClassForLabel} ${props.labelUppercase && ' -uppercase'}`}\n              style={{ alignSelf: 'center' }}>\n              {props.label}\n              {props.required && <span className=\"-requiredlabel\">*</span>}\n              {!!hint && hintPosition === 'onLabelRight' && (\n                <Popover\n                  theme={themePopover}\n                  align={popoverAlign}\n                  iconColor=\"#03bde2\"\n                  customClass=\"-hint\"\n                  style={{ margin: '0px 5px', height: 'auto', width: 20 }}>\n                  {hint}\n                </Popover>\n              )}\n            </div>\n          </div>\n          <TextContent />\n        </div>\n      )}\n      <div\n        className={\n          `periodpicker-component ${helperBase.getInputWrapperClass({\n            ...props,\n            value: !valueInitial ? '' : moment(valueInitial).format('DD/MM/YYYY'),\n            disabled: shouldDisable(),\n          })\n          }`\n        }\n        ref={inputContainerRef}>\n        <BaseMask\n          gridLayout={undefined}\n          permissionAttr={props.permissionAttr}\n          name='valueInitial'\n          value={!valueInitial ? '' : moment(valueInitial).format('DD/MM/YYYY')}\n          mask=\"00/00/0000\"\n          onComplete={(e: CustomInputEvent) => { setValue(e, e.target.value, true); }}\n          onFocus={onInputFocus}\n          onBlur={e => onInputBlur(e)}\n          onChange={onInputChange}\n          inputRef={(el) => { inputInitialRef.current = el; }}\n          handlerSetOnDenied={(denied: OnDenied) => { setOnDenied(denied);}}\n          required={props.required} />\n        <Icon name=\"arrow_right\" customClass=\"separation_icon\" />\n        <BaseMask\n          gridLayout={undefined}\n          permissionAttr={props.permissionAttr}\n          name='valueFinal'\n          value={!valueFinal ? '' : moment(valueFinal).format('DD/MM/YYYY')}\n          mask=\"00/00/0000\"\n          onComplete={(e: CustomInputEvent) => { setValue(e, e.target.value, true); }}\n          onFocus={onInputFocus}\n          onBlur={e => onInputBlur(e)}\n          onChange={onInputChange}\n          inputRef={(el) => { inputFinalRef.current = el; }}\n          handlerSetOnDenied={(denied: OnDenied) => setOnDenied(denied)}\n          required={props.required} />\n        {getButtonOpen()}\n        {getButtonSelectPeriod()}\n      </div>\n      {showCalendarValueInitial && getCalendarInitial()}\n      {showCalendarValueFinal && getCalendarFinal()}\n      {showPeriodSelection && getPeriodOfDatesSelection()}\n      <Hint visible={!!hint && hintPosition === 'below'} customClass=\"hint\" description={hint} />\n      <ErrorMessage messages={props.errorMessages} />\n    </div>\n  );\n\n  return (!gridLayout ? component() : <Grid customClass=\"-withinput\" cols={gridLayout}>{component()}</Grid>);\n};\n\nexport default PeriodPicker;\n"],"mappings":"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"}

package/lib/inputs/period/types.d.ts

@@ -1,5 +1,5 @@
 import { Moment } from 'moment';
-import { ReactNode, RefObject } from 'react';
+import { MouseEvent, ReactNode, RefObject } from 'react';
 import { ColorStyles } from '../../@types/ColorStyles';
 import { Period } from '../../@types/Period';
 import { PermissionAttr } from '../../@types/PermissionAttr';
@@ -51,11 +51,14 @@ export interface IPeriodPickerProps {
     calendarColorStyle?: ColorStyles;
     required?: boolean;
     onChange?: (event?: CustomInputEvent, maskValue?: string, date?: Period) => void;
+    onClick?: (event?: MouseEvent) => void;
     disabled?: boolean;
     permissionAttr?: PermissionAttr;
     errorMessages?: string[];
     name?: string;
     hint?: string;
+    nameDateInitial?: string;
+    nameDateFinal?: string;
     hintPosition?: 'below' | 'onLabelRight';
     onBlur?: (e: CustomInputEvent) => void;
     onFocus?: (e: CustomInputEvent) => void;

package/lib/inputs/search/index.js

@@ -1,104 +1,91 @@
-import { j as s } from "../../chunks/jsx-runtime.D1SHvdVE.js";
-import { c as M } from "../../chunks/compiler-runtime.Cu50tn6L.js";
-import { useState as q, useEffect as N, Fragment as Q } from "react";
-import U from "../base/InputTextBase.js";
-import W from "../../buttons/Button.js";
-import z from "../../icons/index.js";
-import '../../assets/button.css';import '../../assets/index25.css';/* empty css                           */
-import X from "../../drawer/index.js";
-import Y from "../../drawer/Header.js";
-import Z from "../../drawer/Content.js";
-const re = (t) => {
-  const e = M.c(53), {
-    resetButton: G,
-    advancedFilterProps: j,
-    value: r
-  } = t, P = G === void 0 ? !0 : G;
-  let O;
-  e[0] !== j ? (O = j === void 0 ? {} : j, e[0] = j, e[1] = O) : O = e[1];
-  const m = O, [d, J] = q(!1), [o, w] = q(""), [n, K] = q();
-  let u, h, c, l;
-  e[2] !== m ? ({
-    headerTitle: c,
-    content: h,
-    onStateChange: l,
-    ...u
-  } = m, e[2] = m, e[3] = u, e[4] = h, e[5] = c, e[6] = l) : (u = e[3], h = e[4], c = e[5], l = e[6]);
-  let g;
-  e[7] !== t ? (g = (a) => {
-    t.onReset && t.onReset(a), w("");
-  }, e[7] = t, e[8] = g) : g = e[8];
-  const C = g;
-  let y;
-  e[9] !== t ? (y = (a) => {
-    a && (t.onChange && t.onChange(a), w(a.target.value));
-  }, e[9] = t, e[10] = y) : y = e[10];
-  const T = y;
-  let B;
-  e[11] !== n || e[12] !== t.disabled ? (B = () => t.disabled || n && (n.disabled || n.hideContent), e[11] = n, e[12] = t.disabled, e[13] = B) : B = e[13];
-  const f = B;
-  let F;
-  e[14] !== n || e[15] !== t.readOnly ? (F = () => t.readOnly || n && n.readOnly, e[14] = n, e[15] = t.readOnly, e[16] = F) : F = e[16];
-  const k = F, A = n?.hideContent;
-  let R;
-  e[17] !== d || e[18] !== A || e[19] !== l || e[20] !== t || e[21] !== k || e[22] !== f ? (R = () => {
-    const a = k() || f() || A;
-    let i = {
-      icon: /* @__PURE__ */ s.jsx(z, { name: "filter1", color: "#a9a8a8" }, "filter-icon"),
-      key: "advanced-filter-button",
-      boxShadow: !1,
-      readOnly: k(),
-      style: {
-        padding: "0 0 0 5px",
-        width: 30
-      },
-      transparent: !0,
-      disabled: f()
-    };
-    return a || (i = {
-      ...i,
-      onClick: ($) => {
-        t.onClick && t.onClick($), J(!d), l && l(!d);
-      },
-      ...i
-    }), i;
-  }, e[17] = d, e[18] = A, e[19] = l, e[20] = t, e[21] = k, e[22] = f, e[23] = R) : R = e[23];
-  const H = R;
-  let E;
-  e[24] !== m || e[25] !== H || e[26] !== C || e[27] !== P || e[28] !== f || e[29] !== o ? (E = () => {
-    const a = Object.keys(m).length > 0;
-    let i = [/* @__PURE__ */ s.jsx(z, { name: "search", color: "#a9a8a8", disabled: f() }, "search-icon")];
-    const $ = /* @__PURE__ */ s.jsx(z, { name: "cancel2", color: "#a9a8a8", style: {
-      cursor: "pointer",
-      pointerEvents: "auto"
-    }, onClick: C }, "inputSearchIcon"), L = /* @__PURE__ */ s.jsx(W, { ...H() });
-    return a && (i = [...i, L]), P && o.trim() !== "" && (i = [$, ...i]), i;
-  }, e[24] = m, e[25] = H, e[26] = C, e[27] = P, e[28] = f, e[29] = o, e[30] = E) : E = e[30];
-  const V = E;
-  let S;
-  e[31] !== o || e[32] !== r ? (S = () => {
-    r !== void 0 && r !== o && w(r);
-  }, e[31] = o, e[32] = r, e[33] = S) : S = e[33];
-  let D;
-  if (e[34] !== r ? (D = [r], e[34] = r, e[35] = D) : D = e[35], N(S, D), n && n.unvisible)
-    return null;
-  let x;
-  e[36] !== V ? (x = V(), e[36] = V, e[37] = x) : x = e[37];
-  let b;
-  e[38] !== T || e[39] !== C || e[40] !== t || e[41] !== x || e[42] !== o ? (b = /* @__PURE__ */ s.jsx(U, { ...t, onReset: C, onChange: T, value: o, customClass: "", handlerSetOnDenied: K, rightElements: x }), e[38] = T, e[39] = C, e[40] = t, e[41] = x, e[42] = o, e[43] = b) : b = e[43];
-  let v;
-  e[44] !== d || e[45] !== u || e[46] !== h || e[47] !== c || e[48] !== l ? (v = d && /* @__PURE__ */ s.jsxs(X, { handlerClose: () => {
-    J(!1), l && l(!1);
-  }, ...u, children: [
-    c && /* @__PURE__ */ s.jsx(Y, { title: c }),
-    /* @__PURE__ */ s.jsx(Z, { children: h })
-  ] }), e[44] = d, e[45] = u, e[46] = h, e[47] = c, e[48] = l, e[49] = v) : v = e[49];
-  let I;
-  return e[50] !== b || e[51] !== v ? (I = /* @__PURE__ */ s.jsxs(Q, { children: [
-    b,
-    v
-  ] }), e[50] = b, e[51] = v, e[52] = I) : I = e[52], I;
-};
-export {
-  re as default
+import { require_compiler_runtime as e } from "../../node_modules/react/compiler-runtime.js";
+import t from "../../icons/index.js";
+import n from "../../buttons/index.js";
+import r from "../../drawer/Header.js";
+import i from "../../drawer/Content.js";
+import a from "../../drawer/index.js";
+import o from "../base/InputTextBase.js";
+import '../../assets/styles/search.css';/* empty css                         */
+import { Fragment as s, useEffect as c, useState as l } from "react";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/lib/inputs/search/index.tsx
+var f = e(), p = (e) => {
+	let p = (0, f.c)(18), { resetButton: m, advancedFilterProps: h, value: g, drawerFilterIsOpened: _ } = e, v = m === void 0 ? !0 : m, y = h === void 0 ? {} : h, b = _ === void 0 ? !1 : _, [x, S] = l(b), [C, w] = l(""), [T, E] = l(), { headerTitle: D, content: O, onStateChange: k, ...A } = y, j;
+	p[0] === e ? j = p[1] : (j = (t) => {
+		e.onReset && e.onReset(t), w("");
+	}, p[0] = e, p[1] = j);
+	let M = j, N;
+	p[2] === e ? N = p[3] : (N = (t) => {
+		t && (e.onChange && e.onChange(t), w(t.target.value));
+	}, p[2] = e, p[3] = N);
+	let P = N, F;
+	p[4] !== T || p[5] !== e.disabled ? (F = () => e.disabled || T && (T.disabled || T.hideContent), p[4] = T, p[5] = e.disabled, p[6] = F) : F = p[6];
+	let I = F, L;
+	p[7] !== T || p[8] !== e.readOnly ? (L = () => e.readOnly || T && T.readOnly, p[7] = T, p[8] = e.readOnly, p[9] = L) : L = p[9];
+	let R = L, z = T?.hideContent, B = () => {
+		let n = R() || I() || z, r = {
+			icon: u(t, {
+				name: "filter1",
+				color: "#a9a8a8"
+			}, "filter-icon"),
+			key: "advanced-filter-button",
+			boxShadow: !1,
+			readOnly: R(),
+			style: {
+				padding: "0 0 0 5px",
+				width: 30
+			},
+			transparent: !0,
+			disabled: I()
+		};
+		return n || (r = {
+			...r,
+			onClick: (t) => {
+				e.onClick && e.onClick(t), S(!x), k && k(!x);
+			},
+			...r
+		}), r;
+	}, V = () => {
+		let e = Object.keys(y).length > 0, r = [u(t, {
+			name: "search",
+			color: "#a9a8a8",
+			disabled: I()
+		}, "search-icon")], i = u(t, {
+			name: "cancel2",
+			color: "#a9a8a8",
+			style: {
+				cursor: "pointer",
+				pointerEvents: "auto"
+			},
+			onClick: M
+		}, "inputSearchIcon"), a = u(n, { ...B() });
+		return e && (r = [...r, a]), v && C.trim() !== "" && (r = [i, ...r]), r;
+	}, H;
+	p[10] !== C || p[11] !== g ? (H = () => {
+		g !== void 0 && g !== C && w(g);
+	}, p[10] = C, p[11] = g, p[12] = H) : H = p[12];
+	let U;
+	p[13] === g ? U = p[14] : (U = [g], p[13] = g, p[14] = U), c(H, U);
+	let W, G;
+	return p[15] === b ? (W = p[16], G = p[17]) : (G = () => {
+		S(b);
+	}, W = [b], p[15] = b, p[16] = W, p[17] = G), c(G, W), T && T.unvisible ? null : d(s, { children: [u(o, {
+		...e,
+		onReset: M,
+		onChange: P,
+		value: C,
+		customClass: "",
+		handlerSetOnDenied: E,
+		rightElements: V()
+	}), x && d(a, {
+		handlerClose: () => {
+			S(!1), k && k(!1);
+		},
+		...A,
+		children: [D && u(r, { title: D }), u(i, { children: O })]
+	})] });
 };
+//#endregion
+export { p as default };
+
+//# sourceMappingURL=index.js.map

package/lib/inputs/search/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":[],"sources":["../../../src/lib/inputs/search/index.tsx"],"sourcesContent":["import { Fragment, useState, MouseEvent, useEffect } from 'react';\nimport InputTextBase from '../base/InputTextBase';\nimport Button from '../../buttons';\nimport Icon from '../../icons';\nimport '../../assets/styles/search.scss';\nimport Drawer, { DrawerHeader, DrawerContent } from '../../drawer';\nimport { IButtonsProps, ISearchProps } from '../types';\nimport { OnDenied } from '../../@types/PermissionAttr';\nimport { CustomInputEvent } from '../base/types';\n\nconst SearchField = (props: ISearchProps) => {\n  const { \n    resetButton = true, advancedFilterProps = {}, value, drawerFilterIsOpened = false, \n  } = props;\n  const [advancedFilterOpened, setAdvancedFilterOpened] = useState(drawerFilterIsOpened);\n  const [valorCampo, setValorCampo] = useState('');\n  const [onDenied, setOnDenied] = useState<OnDenied>();\n  const { headerTitle, content, onStateChange, ...advancedFilterPropsRest } = advancedFilterProps;\n\n  const onReset = (event?: CustomInputEvent) => {\n    if (props.onReset) props.onReset(event);\n    setValorCampo('');\n  };\n\n  const onChange = (event?: CustomInputEvent) => {\n    if (event) {\n      if (props.onChange) props.onChange(event);\n      setValorCampo(event.target.value);\n    }\n  };\n\n  const shouldDisable = () => props.disabled ||\n    (onDenied && (onDenied.disabled || onDenied.hideContent));\n\n  const shouldBeReadOnly = () => props.readOnly || (onDenied && (onDenied.readOnly));\n  const hideContent = onDenied?.hideContent;\n\n  const buttonProps = () => {\n    const disableCallbacks = shouldBeReadOnly() || shouldDisable() || hideContent;\n    let propsButton: IButtonsProps = {\n      icon: <Icon name=\"filter1\" color=\"#a9a8a8\" key=\"filter-icon\" />,\n      key: 'advanced-filter-button',\n      boxShadow: false,\n      readOnly: shouldBeReadOnly(),\n      style: { padding: '0 0 0 5px', width: 30 },\n      transparent: true,\n      disabled: shouldDisable(),\n    };\n    if (!disableCallbacks) {\n      propsButton = {\n        ...propsButton,\n        onClick: (e: MouseEvent<HTMLButtonElement>) => {\n          if (props.onClick) props.onClick(e);\n          setAdvancedFilterOpened(!advancedFilterOpened);\n          if (onStateChange) onStateChange(!advancedFilterOpened);\n        },\n        ...propsButton,\n      };\n    }\n\n    return propsButton;\n  };\n\n  const rightElements = () => {\n    const enableFilterButton = Object.keys(advancedFilterProps).length > 0;\n    let elements = [<Icon name=\"search\" color=\"#a9a8a8\" key=\"search-icon\" disabled={shouldDisable()} />];\n    const resetButtonIcon =\n      (<Icon\n        name=\"cancel2\"\n        color=\"#a9a8a8\"\n        key=\"inputSearchIcon\"\n        style={{ cursor: 'pointer', pointerEvents: 'auto' }}\n        onClick={onReset} />);\n    const filterButton = (\n      <Button {...buttonProps()} />\n    );\n    if (enableFilterButton) elements = [...elements, filterButton];\n    if (resetButton && valorCampo.trim() !== '') elements = [resetButtonIcon, ...elements];\n    return elements;\n  };\n\n  useEffect(() => {\n    if (value !== undefined && value !== valorCampo) {\n      setValorCampo(value);\n    }\n  }, [value]);\n\n  useEffect(() => {\n    setAdvancedFilterOpened(drawerFilterIsOpened);\n  }, [drawerFilterIsOpened]);\n\n  if (onDenied && onDenied.unvisible) {\n    return null;\n  }\n\n  return (\n    <Fragment>\n      <InputTextBase\n        {...props}\n        onReset={onReset}\n        onChange={onChange}\n        value={valorCampo}\n        customClass=\"\"\n        handlerSetOnDenied={setOnDenied}\n        rightElements={rightElements()} />\n      {advancedFilterOpened && (\n        <Drawer\n          handlerClose={() => {\n            setAdvancedFilterOpened(false);\n            if (onStateChange) onStateChange(false);\n          }}\n          {...advancedFilterPropsRest}>\n          {headerTitle && <DrawerHeader title={headerTitle} />}\n          <DrawerContent>\n            {content}\n          </DrawerContent>\n        </Drawer>\n      )}\n    </Fragment>\n  );\n};\n\nexport default SearchField;\n"],"mappings":"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"}

package/lib/inputs/select/ActionButtons.js

@@ -1,28 +1,32 @@
-import { j as l } from "../../chunks/jsx-runtime.D1SHvdVE.js";
-import { c as j } from "../../chunks/compiler-runtime.Cu50tn6L.js";
-import b from "../../icons/index.js";
-const B = (x) => {
-  const t = j.c(14), {
-    disabled: m,
-    showClearButton: p,
-    dropDownOpened: f,
-    handlerOpenClose: c,
-    handlerClear: a,
-    customClassForSideButtons: h
-  } = x, e = m === void 0 ? !1 : m, r = p === void 0 ? !0 : p, d = `actionbuttonsselect ${h}`;
-  let n;
-  t[0] !== e || t[1] !== a || t[2] !== r ? (n = r && /* @__PURE__ */ l.jsx("button", { disabled: e, tabIndex: -1, className: "actionbutton buttonclear", onClick: a, children: /* @__PURE__ */ l.jsx(b, { name: "cancel", pointerEvents: "none" }) }), t[0] = e, t[1] = a, t[2] = r, t[3] = n) : n = t[3];
-  const u = f ? "mini_up" : "mini_down";
-  let o;
-  t[4] !== u ? (o = /* @__PURE__ */ l.jsx(b, { pointerEvents: "none", name: u }), t[4] = u, t[5] = o) : o = t[5];
-  let s;
-  t[6] !== e || t[7] !== c || t[8] !== o ? (s = /* @__PURE__ */ l.jsx("button", { disabled: e, tabIndex: -1, className: "actionbutton buttonopenclose", onClick: c, children: o }), t[6] = e, t[7] = c, t[8] = o, t[9] = s) : s = t[9];
-  let i;
-  return t[10] !== d || t[11] !== n || t[12] !== s ? (i = /* @__PURE__ */ l.jsxs("div", { className: d, children: [
-    n,
-    s
-  ] }), t[10] = d, t[11] = n, t[12] = s, t[13] = i) : i = t[13], i;
-};
-export {
-  B as default
+import e from "../../icons/index.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region src/lib/inputs/select/ActionButtons.tsx
+var r = (r) => {
+	let { disabled: i = !1, showClearButton: a = !0, dropDownOpened: o, handlerOpenClose: s, handlerClear: c, customClassForSideButtons: l } = r;
+	return /* @__PURE__ */ n("div", {
+		className: `actionbuttonsselect ${l}`,
+		children: [a && /* @__PURE__ */ t("button", {
+			disabled: i,
+			tabIndex: -1,
+			className: "actionbutton buttonclear",
+			onClick: c,
+			children: /* @__PURE__ */ t(e, {
+				name: "cancel",
+				pointerEvents: "none"
+			})
+		}), /* @__PURE__ */ t("button", {
+			disabled: i,
+			tabIndex: -1,
+			className: "actionbutton buttonopenclose",
+			onClick: s,
+			children: /* @__PURE__ */ t(e, {
+				pointerEvents: "none",
+				name: o ? "mini_up" : "mini_down"
+			})
+		})]
+	});
 };
+//#endregion
+export { r as default };
+
+//# sourceMappingURL=ActionButtons.js.map

package/lib/inputs/select/ActionButtons.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"ActionButtons.js","names":[],"sources":["../../../src/lib/inputs/select/ActionButtons.tsx"],"sourcesContent":["import Icon from '../../icons';\nimport { IActionButtonsSelectProps } from '../types';\n\nconst ActionButtons = (props: IActionButtonsSelectProps) => {\n  const {\n    disabled = false, showClearButton = true, dropDownOpened, handlerOpenClose, handlerClear,\n    customClassForSideButtons,\n  } = props;\n\n  return (\n    <div className={`actionbuttonsselect ${customClassForSideButtons}`}>\n      {showClearButton &&\n        <button\n          disabled={disabled}\n          tabIndex={-1}\n          className=\"actionbutton buttonclear\"\n          onClick={handlerClear}>\n          <Icon\n            name=\"cancel\"\n            pointerEvents=\"none\" />\n        </button>\n      }\n      <button\n        disabled={disabled}\n        tabIndex={-1}\n        className=\"actionbutton buttonopenclose\"\n        onClick={handlerOpenClose}>\n        <Icon\n          pointerEvents=\"none\"\n          name={dropDownOpened ? 'mini_up' : 'mini_down'} />\n      </button>\n    </div>\n  );\n};\n\nexport default ActionButtons;\n"],"mappings":";;;AAGA,IAAM,KAAiB,MAAqC;CAC1D,IAAM,EACJ,cAAW,IAAO,qBAAkB,IAAM,mBAAgB,qBAAkB,iBAC5E,iCACE;AAEJ,QACE,kBAAC,OAAD;EAAK,WAAW,uBAAuB;YAAvC,CACG,KACC,kBAAC,UAAD;GACY;GACV,UAAU;GACV,WAAU;GACV,SAAS;aACT,kBAAC,GAAD;IACE,MAAK;IACL,eAAc;IAAS,CAAA;GAClB,CAAA,EAEX,kBAAC,UAAD;GACY;GACV,UAAU;GACV,WAAU;GACV,SAAS;aACT,kBAAC,GAAD;IACE,eAAc;IACd,MAAM,IAAiB,YAAY;IAAe,CAAA;GAC7C,CAAA,CAAA"}

package/lib/inputs/select/Dropdown.js

@@ -1,70 +1,87 @@
-import { j as n } from "../../chunks/jsx-runtime.D1SHvdVE.js";
-import { useState as I, useEffect as R } from "react";
-import f from "../../icons/index.js";
-import P from "../../avatar/index.js";
-import { returnDropdownDynamicStyles as h, getDropdownItemCssClass as A } from "./helper.js";
-import B from "../../dropdown/Popup.js";
-const V = (s) => {
-  const {
-    imageAlign: c = "left",
-    striped: x = !1,
-    dataCombo: o,
-    descriptionKey: r,
-    imgSrcKey: y,
-    dropdownRef: a,
-    currents: l = [],
-    dropdownWidth: g,
-    gridWrapperStyle: i,
-    handleOnSelect: w,
-    inputValue: j,
-    handleOnFocus: D,
-    opened: N,
-    handleOnFilter: S,
-    selected: m = null,
-    searchOnDropdown: v,
-    handleOnKeydown: C,
-    searchNotFoundText: K,
-    idKey: t,
-    selectFieldRef: b
-  } = s, [d, F] = I(h({
-    ...s
-  }));
-  return R(() => {
-    a.current && F(h({
-      ...s
-    }));
-  }, [a.current, o]), /* @__PURE__ */ n.jsx(B, { align: "left", leftPosition: d.left, topPosition: d.top, targetRef: b?.current, children: /* @__PURE__ */ n.jsxs("div", { className: "select-dropdown", ref: a, style: {
-    width: g,
-    marginLeft: i ? i.paddingLeft : "0",
-    maxHeight: d.maxHeight
-  }, children: [
-    v && /* @__PURE__ */ n.jsxs("div", { className: "filtercontainer", children: [
-      /* @__PURE__ */ n.jsx("input", { className: "filterinput", type: "text", value: j, onFocus: () => {
-        D();
-      }, onChange: (e) => {
-        S(e.target.value);
-      }, onKeyDown: (e) => {
-        C(e);
-      }, autoFocus: N }),
-      /* @__PURE__ */ n.jsx(f, { name: "search", viewBox: "0 0 32 32" })
-    ] }),
-    o.map((e) => {
-      const p = l && l.length > 0 ? l.some((u) => u[t] === e[t]) : !1, O = !!(m && m[t] === e[t]);
-      return /* @__PURE__ */ n.jsx("div", { className: A(O, p, x), children: /* @__PURE__ */ n.jsxs("button", { className: "menubutton", tabIndex: -1, onClick: (u) => {
-        p || w(e);
-      }, children: [
-        e.iconName && /* @__PURE__ */ n.jsx(f, { name: e.iconName, customClass: "menuicon", style: {
-          order: c === "left" ? 0 : 1
-        } }),
-        y && e.imgSrcKey && /* @__PURE__ */ n.jsx(P, { src: e.imgSrcKey, customClass: "menuicon", style: {
-          order: c === "left" ? 0 : 1
-        } }),
-        /* @__PURE__ */ n.jsx("span", { className: "label", children: typeof r == "string" ? e[r] : r(e) })
-      ] }) }, `dropdowmIten ${e[t]}}`);
-    }),
-    o && o.length === 0 && /* @__PURE__ */ n.jsx("div", { className: "notfound", children: K })
-  ] }) });
-};
-export {
-  V as default
+import e from "../../icons/index.js";
+import t from "../../dropdown/Popup.js";
+import n from "../../avatar/index.js";
+import { getDropdownItemCssClass as r, returnDropdownDynamicStyles as i } from "./helper.js";
+import { useEffect as a, useState as o } from "react";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region src/lib/inputs/select/Dropdown.tsx
+var l = (l) => {
+	let { imageAlign: u = "left", striped: d = !1, dataCombo: f, descriptionKey: p, imgSrcKey: m, dropdownRef: h, currents: g = [], dropdownWidth: _, gridWrapperStyle: v, handleOnSelect: y, inputValue: b, handleOnFocus: x, opened: S, handleOnFilter: C, selected: w = null, searchOnDropdown: T, handleOnKeydown: E, searchNotFoundText: D, idKey: O, selectFieldRef: k } = l, [A, j] = o(i({ ...l }));
+	return a(() => {
+		h.current && j(i({ ...l }));
+	}, [h.current, f]), /* @__PURE__ */ s(t, {
+		align: "left",
+		leftPosition: A.left,
+		topPosition: A.top,
+		targetRef: k?.current,
+		children: /* @__PURE__ */ c("div", {
+			className: "select-dropdown",
+			ref: h,
+			style: {
+				width: _,
+				marginLeft: v ? v.paddingLeft : "0",
+				maxHeight: A.maxHeight
+			},
+			children: [
+				T && /* @__PURE__ */ c("div", {
+					className: "filtercontainer",
+					children: [/* @__PURE__ */ s("input", {
+						className: "filterinput",
+						type: "text",
+						value: b,
+						onFocus: () => {
+							x();
+						},
+						onChange: (e) => {
+							C(e.target.value);
+						},
+						onKeyDown: (e) => {
+							E(e);
+						},
+						autoFocus: S
+					}), /* @__PURE__ */ s(e, {
+						name: "search",
+						viewBox: "0 0 32 32"
+					})]
+				}),
+				f.map((t) => {
+					let i = g && g.length > 0 ? g.some((e) => e[O] === t[O]) : !1;
+					return /* @__PURE__ */ s("div", {
+						className: r(!!(w && w[O] === t[O]), i, d),
+						children: /* @__PURE__ */ c("button", {
+							className: "menubutton",
+							tabIndex: -1,
+							onClick: () => {
+								i || y(t);
+							},
+							children: [
+								t.iconName && /* @__PURE__ */ s(e, {
+									name: t.iconName,
+									customClass: "menuicon",
+									style: { order: u === "left" ? 0 : 1 }
+								}),
+								m && t.imgSrcKey && /* @__PURE__ */ s(n, {
+									src: t.imgSrcKey,
+									customClass: "menuicon",
+									style: { order: u === "left" ? 0 : 1 }
+								}),
+								/* @__PURE__ */ s("span", {
+									className: "label",
+									children: typeof p == "string" ? t[p] : p(t)
+								})
+							]
+						})
+					}, `dropdowmIten ${t[O]}}`);
+				}),
+				f && f.length === 0 && /* @__PURE__ */ s("div", {
+					className: "notfound",
+					children: D
+				})
+			]
+		})
+	});
 };
+//#endregion
+export { l as default };
+
+//# sourceMappingURL=Dropdown.js.map

package/lib/inputs/select/Dropdown.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Dropdown.js","names":[],"sources":["../../../src/lib/inputs/select/Dropdown.tsx"],"sourcesContent":["import { ChangeEvent, KeyboardEvent, useEffect, useState } from 'react';\nimport Icon from '../../icons';\nimport Avatar from '../../avatar';\nimport * as helper from './helper';\nimport DropdownPopup from '../../dropdown/Popup';\nimport { IDropdownSelectProps } from '../types';\nimport { DataCombo } from '../../@types/DataCombo';\n\nconst Dropdown = (props: IDropdownSelectProps) => {\n  const {\n    imageAlign = 'left', striped = false, dataCombo, descriptionKey, imgSrcKey, dropdownRef,\n    currents = [], dropdownWidth, gridWrapperStyle, handleOnSelect, inputValue,\n    handleOnFocus, opened, handleOnFilter, selected = null, searchOnDropdown, handleOnKeydown,\n    searchNotFoundText, idKey, selectFieldRef,\n  } = props;\n  const [dropdownDynamicStyles, setDropdownDynamicStyles] =\n    useState(helper.returnDropdownDynamicStyles({ ...props }));\n\n  useEffect(() => {\n    if (dropdownRef.current) {\n      setDropdownDynamicStyles(helper.returnDropdownDynamicStyles({ ...props }));\n    }\n  }, [dropdownRef.current, dataCombo]);\n\n  return (\n    <DropdownPopup\n      align=\"left\"\n      leftPosition={dropdownDynamicStyles.left}\n      topPosition={dropdownDynamicStyles.top}\n      targetRef={selectFieldRef?.current}>\n      <div\n        className=\"select-dropdown\"\n        ref={dropdownRef}\n        style={{\n          width: dropdownWidth,\n          marginLeft: gridWrapperStyle ? gridWrapperStyle.paddingLeft : '0',\n          maxHeight: dropdownDynamicStyles.maxHeight,\n        }}>\n        {searchOnDropdown &&\n          <div className=\"filtercontainer\">\n            <input\n              className=\"filterinput\"\n              type=\"text\"\n              value={inputValue}\n              onFocus={() => { handleOnFocus(); }}\n              onChange={(e: ChangeEvent<HTMLInputElement>) => {\n                handleOnFilter(e.target.value);\n              }}\n              onKeyDown={(e: KeyboardEvent<Element>) => { handleOnKeydown(e); }}\n              autoFocus={opened} />\n            <Icon name=\"search\" viewBox=\"0 0 32 32\" />\n          </div>\n        }\n        {dataCombo.map((item: DataCombo) => {\n          const disabled = (currents && currents.length > 0 ?\n              currents.some(s => s[idKey] === item[idKey])\n            : false);\n          const itemSelected = Boolean(selected && selected[idKey] === item[idKey]);\n          return (\n            <div\n              key={`dropdowmIten ${item[idKey]}}`}\n              className={helper.getDropdownItemCssClass(itemSelected, disabled, striped)} >\n              <button\n                className=\"menubutton\"\n                tabIndex={-1}\n                onClick={() => { if (!disabled) { handleOnSelect(item); } }}>\n                {item.iconName &&\n                  <Icon\n                    name={item.iconName}\n                    customClass=\"menuicon\"\n                    style={{ order: imageAlign === 'left' ? 0 : 1 }} />\n                }\n                {imgSrcKey && item.imgSrcKey &&\n                  <Avatar\n                    src={item.imgSrcKey}\n                    customClass=\"menuicon\"\n                    style={{ order: imageAlign === 'left' ? 0 : 1 }} />\n                }\n                <span className=\"label\">{typeof descriptionKey === 'string' ? item[descriptionKey] : descriptionKey(item)}</span>\n              </button>\n            </div>\n          );\n        })}\n        {dataCombo && dataCombo.length === 0 &&\n          <div className=\"notfound\">{searchNotFoundText}</div>\n        }\n      </div>\n    </DropdownPopup>\n  );\n};\n\nexport default Dropdown;\n"],"mappings":";;;;;;;AAQA,IAAM,KAAY,MAAgC;CAChD,IAAM,EACJ,gBAAa,QAAQ,aAAU,IAAO,cAAW,mBAAgB,cAAW,gBAC5E,cAAW,EAAE,EAAE,kBAAe,qBAAkB,mBAAgB,eAChE,kBAAe,WAAQ,mBAAgB,cAAW,MAAM,qBAAkB,oBAC1E,uBAAoB,UAAO,sBACzB,GACE,CAAC,GAAuB,KAC5B,EAAS,EAAmC,EAAE,GAAG,GAAO,CAAC,CAAC;AAQ5D,QANA,QAAgB;AACd,EAAI,EAAY,WACd,EAAyB,EAAmC,EAAE,GAAG,GAAO,CAAC,CAAC;IAE3E,CAAC,EAAY,SAAS,EAAU,CAAC,EAGlC,kBAAC,GAAD;EACE,OAAM;EACN,cAAc,EAAsB;EACpC,aAAa,EAAsB;EACnC,WAAW,GAAgB;YAC3B,kBAAC,OAAD;GACE,WAAU;GACV,KAAK;GACL,OAAO;IACL,OAAO;IACP,YAAY,IAAmB,EAAiB,cAAc;IAC9D,WAAW,EAAsB;IAClC;aAPH;IAQG,KACC,kBAAC,OAAD;KAAK,WAAU;eAAf,CACE,kBAAC,SAAD;MACE,WAAU;MACV,MAAK;MACL,OAAO;MACP,eAAe;AAAE,UAAe;;MAChC,WAAW,MAAqC;AAC9C,SAAe,EAAE,OAAO,MAAM;;MAEhC,YAAY,MAA8B;AAAE,SAAgB,EAAE;;MAC9D,WAAW;MAAU,CAAA,EACvB,kBAAC,GAAD;MAAM,MAAK;MAAS,SAAQ;MAAc,CAAA,CAAA;;IAG7C,EAAU,KAAK,MAAoB;KAClC,IAAM,IAAY,KAAY,EAAS,SAAS,IAC5C,EAAS,MAAK,MAAK,EAAE,OAAW,EAAK,GAAO,GAC5C;AAEJ,YACE,kBAAC,OAAD;MAEE,WAAW,EAJM,GAAQ,KAAY,EAAS,OAAW,EAAK,KAIN,GAAU,EAAQ;gBAC1E,kBAAC,UAAD;OACE,WAAU;OACV,UAAU;OACV,eAAe;AAAE,QAAK,KAAY,EAAe,EAAK;;iBAHxD;QAIG,EAAK,YACJ,kBAAC,GAAD;SACE,MAAM,EAAK;SACX,aAAY;SACZ,OAAO,EAAE,OAAO,MAAe,SAAS,IAAI,GAAA;SAAO,CAAA;QAEtD,KAAa,EAAK,aACjB,kBAAC,GAAD;SACE,KAAK,EAAK;SACV,aAAY;SACZ,OAAO,EAAE,OAAO,MAAe,SAAS,IAAI,GAAA;SAAO,CAAA;QAEvD,kBAAC,QAAD;SAAM,WAAU;mBAAS,OAAO,KAAmB,WAAW,EAAK,KAAkB,EAAe,EAAA;SAAa,CAAA;QAAA;;MAE/G,EApBC,gBAAgB,EAAK,GAAA,GAoBtB;MAER;IACD,KAAa,EAAU,WAAW,KACjC,kBAAC,OAAD;KAAK,WAAU;eAAY;KAAyB,CAAA;IAAA;;EAG1C,CAAA"}