@tecsinapse/react-web-kit 1.23.7 → 2.0.0

package/dist/esm/components/molecules/Select/Select.js.map

@@ -1 +1 @@
-{"version":3,"file":"Select.js","sources":["../../../../../src/components/molecules/Select/Select.tsx"],"sourcesContent":["import {\n  PressableInputContainer,\n  Text,\n  TextProps,\n} from '@tecsinapse/react-core';\nimport React, { useEffect, useState } from 'react';\nimport { Transition } from 'react-transition-group';\nimport { useClickAwayListener } from '../../../hooks';\nimport { defaultStyles, transition } from './animations';\nimport { Dropdown } from './Dropdown';\nimport { getDisplayValue } from './functions';\nimport {\n  RightComponent,\n  StyledContainer,\n  StyledInputContainer,\n} from './styled';\n\nexport interface SelectProps<Data, Type extends 'single' | 'multi'>\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> {\n  options: ((searchInput?: string) => Promise<Data[]>) | Data[];\n  onSelect: (\n    option: Type extends 'single' ? Data | undefined : Data[]\n  ) => never | void;\n  value: Type extends 'single' ? Data | undefined : Data[];\n  type: Type;\n  keyExtractor: (t: Data, index?: number) => string;\n  labelExtractor: (t: Data) => string;\n  placeholder?: string;\n  onSearch?:\n    | ((searchArg: string) => void)\n    | ((searchInput?: string) => Promise<Data[]>)\n    | never;\n  searchBarPlaceholder?: string;\n  hideSearchBar?: boolean;\n  selectAllLabel?: string;\n  disabled?: boolean;\n  label?: string;\n  anchor?: 'top' | 'bottom';\n  displayTextProps?: TextProps;\n}\n\n/** NOTE: For better performance, you should memoize options and handlers */\nconst Select = <Data, Type extends 'single' | 'multi'>({\n  value,\n  options,\n  keyExtractor,\n  onSelect,\n  type,\n  labelExtractor,\n  placeholder,\n  onSearch,\n  searchBarPlaceholder = 'Busque a opção desejada',\n  hideSearchBar = true,\n  label,\n  disabled = false,\n  anchor = 'bottom',\n  displayTextProps,\n  selectAllLabel = 'Selecionar todos',\n  ...rest\n}: SelectProps<Data, Type>): JSX.Element => {\n  const [dropDownVisible, setDropDownVisible] = React.useState<boolean>(false);\n  const [selectOptions, setSelectOptions] = useState<Data[]>([]);\n  const refDropDown = React.useRef(null);\n  useClickAwayListener(refDropDown, setDropDownVisible);\n\n  useEffect(() => {\n    if (typeof options !== 'function') {\n      setSelectOptions(options);\n    }\n  }, [options]);\n\n  // TODO: Add Skeleton to modal height when loading is true\n\n  const onlyLabel = label && !placeholder;\n  const hasValue =\n    type === 'single' ? !!value : ((value || []) as []).length > 0;\n  const _placeholder = onlyLabel ? label : placeholder;\n  const _label = hasValue ? label : undefined;\n\n  const displayValue = getDisplayValue<Data>(\n    type,\n    value,\n    selectOptions,\n    _placeholder,\n    keyExtractor,\n    labelExtractor\n  );\n\n  const handleLazyFocus = React.useCallback(async () => {\n    if (!dropDownVisible && typeof options === 'function') {\n      try {\n        const result = await options();\n        if (result) {\n          setSelectOptions(result ?? []);\n        }\n      } catch (e) {\n        // TODO: Catch error\n      }\n    }\n  }, [options, setSelectOptions, dropDownVisible]);\n\n  const handleOnSearch = React.useCallback(\n    async (searchInput: string | undefined) => {\n      if (searchInput !== undefined && onSearch && dropDownVisible) {\n        try {\n          //TODO: Remove code duplicated below (Select in react-native-kit)\n          const result = await onSearch(searchInput);\n          if (result) {\n            if (type === 'single') {\n              if (\n                value &&\n                !result.find(\n                  v => keyExtractor(value as Data) === keyExtractor(v)\n                )\n              ) {\n                setSelectOptions([value as Data, ...result]);\n              } else setSelectOptions(result);\n            } else {\n              if ((value as Data[]).length > 0) {\n                const selectedValues =\n                  (value as Data[]).filter(\n                    v =>\n                      !result.find(\n                        current =>\n                          keyExtractor(v as Data) === keyExtractor(current)\n                      )\n                  ) || [];\n                setSelectOptions([...selectedValues, ...result]);\n              } else {\n                setSelectOptions(result);\n              }\n            }\n          }\n        } catch (e) {\n          // TODO: Catch error\n        }\n      }\n    },\n    [onSearch, value, keyExtractor, dropDownVisible, setSelectOptions]\n  );\n\n  const handlePressInput = async () => {\n    await handleLazyFocus();\n  };\n\n  const onPress = React.useCallback(\n    () => setDropDownVisible(prev => !prev),\n    [setDropDownVisible]\n  );\n\n  return (\n    <StyledContainer ref={refDropDown} {...rest}>\n      <StyledInputContainer onFocus={handlePressInput}>\n        <PressableInputContainer\n          label={_label}\n          onPress={onPress}\n          disabled={disabled}\n          rightComponent={RightComponent}\n        >\n          <Text\n            {...displayTextProps}\n            ellipsizeMode=\"tail\"\n            numberOfLines={1}\n            fontWeight={'bold'}\n          >\n            {displayValue}\n          </Text>\n        </PressableInputContainer>\n      </StyledInputContainer>\n      <Transition in={dropDownVisible} timeout={300}>\n        {state => (\n          <Dropdown\n            options={selectOptions ?? []}\n            onSelect={onSelect}\n            value={value}\n            type={type}\n            keyExtractor={keyExtractor}\n            labelExtractor={labelExtractor}\n            hideSearchBar={hideSearchBar}\n            searchBarPlaceholder={searchBarPlaceholder}\n            onSearch={handleOnSearch}\n            style={{ ...defaultStyles, ...transition[anchor][state] }}\n            setDropDownVisible={setDropDownVisible}\n            anchor={anchor}\n            selectAllLabel={selectAllLabel}\n          />\n        )}\n      </Transition>\n    </StyledContainer>\n  );\n};\n\nexport default Select;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"Select.js","sources":["../../../../../src/components/molecules/Select/Select.tsx"],"sourcesContent":["import {\n  PressableInputContainer,\n  Text,\n  TextProps,\n} from '@tecsinapse/react-core';\nimport React, { useEffect, useState } from 'react';\nimport { Transition } from 'react-transition-group';\nimport { useClickAwayListener } from '../../../hooks';\nimport { defaultStyles, transition } from './animations';\nimport { Dropdown } from './Dropdown';\nimport { getDisplayValue } from './functions';\nimport {\n  RightComponent,\n  StyledContainer,\n  StyledInputContainer,\n} from './styled';\n\nexport interface SelectProps<Data, Type extends 'single' | 'multi'>\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onSelect'> {\n  options: ((searchInput?: string) => Promise<Data[]>) | Data[];\n  onSelect: (\n    option: Type extends 'single' ? Data | undefined : Data[]\n  ) => never | void;\n  value: Type extends 'single' ? Data | undefined : Data[];\n  type: Type;\n  keyExtractor: (t: Data, index?: number) => string;\n  labelExtractor: (t: Data) => string;\n  placeholder?: string;\n  onSearch?:\n    | ((searchArg: string) => void)\n    | ((searchInput?: string) => Promise<Data[]>)\n    | never;\n  searchBarPlaceholder?: string;\n  hideSearchBar?: boolean;\n  selectAllLabel?: string;\n  disabled?: boolean;\n  label?: string;\n  anchor?: 'top' | 'bottom';\n  displayTextProps?: TextProps;\n}\n\n/** NOTE: For better performance, you should memoize options and handlers */\nconst Select = <Data, Type extends 'single' | 'multi'>({\n  value,\n  options,\n  keyExtractor,\n  onSelect,\n  type,\n  labelExtractor,\n  placeholder,\n  onSearch,\n  searchBarPlaceholder = 'Busque a opção desejada',\n  hideSearchBar = true,\n  label,\n  disabled = false,\n  anchor = 'bottom',\n  displayTextProps,\n  selectAllLabel = 'Selecionar todos',\n  ...rest\n}: SelectProps<Data, Type>): JSX.Element => {\n  const [dropDownVisible, setDropDownVisible] = React.useState<boolean>(false);\n  const [selectOptions, setSelectOptions] = useState<Data[]>([]);\n  const refDropDown = React.useRef(null);\n  useClickAwayListener(refDropDown, setDropDownVisible);\n\n  useEffect(() => {\n    if (typeof options !== 'function') {\n      setSelectOptions(options);\n    }\n  }, [options]);\n\n  // TODO: Add Skeleton to modal height when loading is true\n\n  const onlyLabel = label && !placeholder;\n  const hasValue =\n    type === 'single' ? !!value : ((value || []) as []).length > 0;\n  const _placeholder = onlyLabel ? label : placeholder;\n  const _label = hasValue ? label : undefined;\n\n  const displayValue = getDisplayValue<Data>(\n    type,\n    value,\n    selectOptions,\n    _placeholder,\n    keyExtractor,\n    labelExtractor\n  );\n\n  const handleLazyFocus = React.useCallback(async () => {\n    if (!dropDownVisible && typeof options === 'function') {\n      try {\n        const result = await options();\n        if (result) {\n          setSelectOptions(result ?? []);\n        }\n      } catch (e) {\n        // TODO: Catch error\n      }\n    }\n  }, [options, setSelectOptions, dropDownVisible]);\n\n  const handleOnSearch = React.useCallback(\n    async (searchInput: string | undefined) => {\n      if (searchInput !== undefined && onSearch && dropDownVisible) {\n        try {\n          //TODO: Remove code duplicated below (Select in react-native-kit)\n          const result = await onSearch(searchInput);\n          if (result) {\n            if (type === 'single') {\n              if (\n                value &&\n                !result.find(\n                  v => keyExtractor(value as Data) === keyExtractor(v)\n                )\n              ) {\n                setSelectOptions([value as Data, ...result]);\n              } else setSelectOptions(result);\n            } else {\n              if ((value as Data[]).length > 0) {\n                const selectedValues =\n                  (value as Data[]).filter(\n                    v =>\n                      !result.find(\n                        current =>\n                          keyExtractor(v as Data) === keyExtractor(current)\n                      )\n                  ) || [];\n                setSelectOptions([...selectedValues, ...result]);\n              } else {\n                setSelectOptions(result);\n              }\n            }\n          }\n        } catch (e) {\n          // TODO: Catch error\n        }\n      }\n    },\n    [onSearch, value, keyExtractor, dropDownVisible, setSelectOptions]\n  );\n\n  const handlePressInput = async () => {\n    await handleLazyFocus();\n  };\n\n  const onPress = React.useCallback(\n    () => setDropDownVisible(prev => !prev),\n    [setDropDownVisible]\n  );\n  //TODO: when component is wrapper by GridITem and Text of label has prop \"numberOfLines={1}\", this component incresing witht based on options selects, breaking layout of Grid, we must fix this problem.\n  return (\n    <StyledContainer ref={refDropDown} {...rest}>\n      <StyledInputContainer onFocus={handlePressInput}>\n        <PressableInputContainer\n          label={_label}\n          onPress={onPress}\n          disabled={disabled}\n          rightComponent={RightComponent}\n        >\n          <Text {...displayTextProps} fontWeight={'bold'}>\n            {displayValue}\n          </Text>\n        </PressableInputContainer>\n      </StyledInputContainer>\n      <Transition in={dropDownVisible} timeout={300}>\n        {state => (\n          <Dropdown\n            options={selectOptions ?? []}\n            onSelect={onSelect}\n            value={value}\n            type={type}\n            keyExtractor={keyExtractor}\n            labelExtractor={labelExtractor}\n            hideSearchBar={hideSearchBar}\n            searchBarPlaceholder={searchBarPlaceholder}\n            onSearch={handleOnSearch}\n            style={{ ...defaultStyles, ...transition[anchor][state] }}\n            setDropDownVisible={setDropDownVisible}\n            anchor={anchor}\n            selectAllLabel={selectAllLabel}\n          />\n        )}\n      </Transition>\n    </StyledContainer>\n  );\n};\n\nexport default Select;\n"],"names":[],"mappings":";;;;;;;;;AA0CA,MAAM,SAAS,CAAwC;AAAA,EACrD,KAAA;AAAA,EACA,OAAA;AAAA,EACA,YAAA;AAAA,EACA,QAAA;AAAA,EACA,IAAA;AAAA,EACA,cAAA;AAAA,EACA,WAAA;AAAA,EACA,QAAA;AAAA,EACA,oBAAuB,GAAA,+BAAA;AAAA,EACvB,aAAgB,GAAA,IAAA;AAAA,EAChB,KAAA;AAAA,EACA,QAAW,GAAA,KAAA;AAAA,EACX,MAAS,GAAA,QAAA;AAAA,EACT,gBAAA;AAAA,EACA,cAAiB,GAAA,kBAAA;AAAA,EACjB,GAAG,IAAA;AACL,CAA4C,KAAA;AAC1C,EAAA,MAAM,CAAC,eAAiB,EAAA,kBAAkB,CAAI,GAAA,KAAA,CAAM,SAAkB,KAAK,CAAA,CAAA;AAC3E,EAAA,MAAM,CAAC,aAAe,EAAA,gBAAgB,CAAI,GAAA,QAAA,CAAiB,EAAE,CAAA,CAAA;AAC7D,EAAM,MAAA,WAAA,GAAc,KAAM,CAAA,MAAA,CAAO,IAAI,CAAA,CAAA;AACrC,EAAA,oBAAA,CAAqB,aAAa,kBAAkB,CAAA,CAAA;AAEpD,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,OAAO,YAAY,UAAY,EAAA;AACjC,MAAA,gBAAA,CAAiB,OAAO,CAAA,CAAA;AAAA,KAC1B;AAAA,GACF,EAAG,CAAC,OAAO,CAAC,CAAA,CAAA;AAIZ,EAAM,MAAA,SAAA,GAAY,SAAS,CAAC,WAAA,CAAA;AAC5B,EAAM,MAAA,QAAA,GACJ,SAAS,QAAW,GAAA,CAAC,CAAC,KAAU,GAAA,CAAA,KAAA,IAAS,EAAC,EAAU,MAAS,GAAA,CAAA,CAAA;AAC/D,EAAM,MAAA,YAAA,GAAe,YAAY,KAAQ,GAAA,WAAA,CAAA;AACzC,EAAM,MAAA,MAAA,GAAS,WAAW,KAAQ,GAAA,KAAA,CAAA,CAAA;AAElC,EAAA,MAAM,YAAe,GAAA,eAAA;AAAA,IACnB,IAAA;AAAA,IACA,KAAA;AAAA,IACA,aAAA;AAAA,IACA,YAAA;AAAA,IACA,YAAA;AAAA,IACA,cAAA;AAAA,GACF,CAAA;AAEA,EAAM,MAAA,eAAA,GAAkB,KAAM,CAAA,WAAA,CAAY,YAAY;AACpD,IAAA,IAAI,CAAC,eAAA,IAAmB,OAAO,OAAA,KAAY,UAAY,EAAA;AACrD,MAAI,IAAA;AACF,QAAM,MAAA,MAAA,GAAS,MAAM,OAAQ,EAAA,CAAA;AAC7B,QAAA,IAAI,MAAQ,EAAA;AACV,UAAiB,gBAAA,CAAA,MAAA,IAAU,EAAE,CAAA,CAAA;AAAA,SAC/B;AAAA,eACO,CAAP,EAAA;AAAA,OAEF;AAAA,KACF;AAAA,GACC,EAAA,CAAC,OAAS,EAAA,gBAAA,EAAkB,eAAe,CAAC,CAAA,CAAA;AAE/C,EAAA,MAAM,iBAAiB,KAAM,CAAA,WAAA;AAAA,IAC3B,OAAO,WAAoC,KAAA;AACzC,MAAI,IAAA,WAAA,KAAgB,KAAa,CAAA,IAAA,QAAA,IAAY,eAAiB,EAAA;AAC5D,QAAI,IAAA;AAEF,UAAM,MAAA,MAAA,GAAS,MAAM,QAAA,CAAS,WAAW,CAAA,CAAA;AACzC,UAAA,IAAI,MAAQ,EAAA;AACV,YAAA,IAAI,SAAS,QAAU,EAAA;AACrB,cACE,IAAA,KAAA,IACA,CAAC,MAAO,CAAA,IAAA;AAAA,gBACN,CAAK,CAAA,KAAA,YAAA,CAAa,KAAa,CAAA,KAAM,aAAa,CAAC,CAAA;AAAA,eAErD,EAAA;AACA,gBAAA,gBAAA,CAAiB,CAAC,KAAA,EAAe,GAAG,MAAM,CAAC,CAAA,CAAA;AAAA,eAC7C;AAAO,gBAAA,gBAAA,CAAiB,MAAM,CAAA,CAAA;AAAA,aACzB,MAAA;AACL,cAAK,IAAA,KAAA,CAAiB,SAAS,CAAG,EAAA;AAChC,gBAAA,MAAM,iBACH,KAAiB,CAAA,MAAA;AAAA,kBAChB,CAAA,CAAA,KACE,CAAC,MAAO,CAAA,IAAA;AAAA,oBACN,CACE,OAAA,KAAA,YAAA,CAAa,CAAS,CAAA,KAAM,aAAa,OAAO,CAAA;AAAA,mBACpD;AAAA,qBACC,EAAC,CAAA;AACR,gBAAA,gBAAA,CAAiB,CAAC,GAAG,cAAgB,EAAA,GAAG,MAAM,CAAC,CAAA,CAAA;AAAA,eAC1C,MAAA;AACL,gBAAA,gBAAA,CAAiB,MAAM,CAAA,CAAA;AAAA,eACzB;AAAA,aACF;AAAA,WACF;AAAA,iBACO,CAAP,EAAA;AAAA,SAEF;AAAA,OACF;AAAA,KACF;AAAA,IACA,CAAC,QAAA,EAAU,KAAO,EAAA,YAAA,EAAc,iBAAiB,gBAAgB,CAAA;AAAA,GACnE,CAAA;AAEA,EAAA,MAAM,mBAAmB,YAAY;AACnC,IAAA,MAAM,eAAgB,EAAA,CAAA;AAAA,GACxB,CAAA;AAEA,EAAA,MAAM,UAAU,KAAM,CAAA,WAAA;AAAA,IACpB,MAAM,kBAAA,CAAmB,CAAQ,IAAA,KAAA,CAAC,IAAI,CAAA;AAAA,IACtC,CAAC,kBAAkB,CAAA;AAAA,GACrB,CAAA;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,mBAAgB,GAAK,EAAA,WAAA,EAAc,GAAG,IACrC,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,oBAAqB,EAAA,EAAA,OAAA,EAAS,gBAC7B,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,uBAAA;AAAA,IAAA;AAAA,MACC,KAAO,EAAA,MAAA;AAAA,MACP,OAAA;AAAA,MACA,QAAA;AAAA,MACA,cAAgB,EAAA,cAAA;AAAA,KAAA;AAAA,wCAEf,IAAM,EAAA,EAAA,GAAG,gBAAkB,EAAA,UAAA,EAAY,UACrC,YACH,CAAA;AAAA,GAEJ,mBACC,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,IAAI,eAAiB,EAAA,OAAA,EAAS,OACvC,CACC,KAAA,qBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,OAAA,EAAS,iBAAiB,EAAC;AAAA,MAC3B,QAAA;AAAA,MACA,KAAA;AAAA,MACA,IAAA;AAAA,MACA,YAAA;AAAA,MACA,cAAA;AAAA,MACA,aAAA;AAAA,MACA,oBAAA;AAAA,MACA,QAAU,EAAA,cAAA;AAAA,MACV,KAAA,EAAO,EAAE,GAAG,aAAA,EAAe,GAAG,UAAW,CAAA,MAAM,CAAE,CAAA,KAAK,CAAE,EAAA;AAAA,MACxD,kBAAA;AAAA,MACA,MAAA;AAAA,MACA,cAAA;AAAA,KAAA;AAAA,GAGN,CACF,CAAA,CAAA;AAEJ;;;;"}

package/dist/esm/components/molecules/Select/SelectItem/SelectItem.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 interface SelectItemProps<Data, Type extends 'single' | 'multi'> {
     item: Data;
     type: Type;

package/dist/esm/components/molecules/Select/SelectItem/SelectItem.js

@@ -60,18 +60,7 @@ const SelectItem = ({
     },
     [onSelect, setDropDownVisible, setCheckedAll, setChecked, checked]
   );
-  return /* @__PURE__ */ React.createElement(ContainerItemSelect, {
-    onClick: () => clickItem(item, value)
-  }, isMulti && /* @__PURE__ */ React.createElement(Checkbox, {
-    checked,
-    onChange: () => clickItem(item, value)
-  }), /* @__PURE__ */ React.createElement(StyledContainerTextLabel, null, /* @__PURE__ */ React.createElement(Text, {
-    fontWeight: "bold",
-    ellipsizeMode: "tail",
-    numberOfLines: 1
-  }, /* @__PURE__ */ React.createElement(StyledSpan, {
-    singleHighligh: type === "single" && value === item
-  }, labelExtractor(item)))));
+  return /* @__PURE__ */ React.createElement(ContainerItemSelect, { onClick: () => clickItem(item, value) }, isMulti && /* @__PURE__ */ React.createElement(Checkbox, { checked, onChange: () => clickItem(item, value) }), /* @__PURE__ */ React.createElement(StyledContainerTextLabel, null, /* @__PURE__ */ React.createElement(Text, { fontWeight: "bold", ellipsizeMode: "tail", numberOfLines: 1 }, /* @__PURE__ */ React.createElement(StyledSpan, { singleHighligh: type === "single" && value === item }, labelExtractor(item)))));
 };
 var ItemSelect = React.memo(SelectItem);
 

package/dist/esm/components/molecules/Select/SelectItem/SelectItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"SelectItem.js","sources":["../../../../../../src/components/molecules/Select/SelectItem/SelectItem.tsx"],"sourcesContent":["import React from 'react';\nimport { Checkbox, Text } from '@tecsinapse/react-core';\nimport {\n  ContainerItemSelect,\n  StyledContainerTextLabel,\n  StyledSpan,\n} from './styled';\n\ninterface SelectItemProps<Data, Type extends 'single' | 'multi'> {\n  item: Data;\n  type: Type;\n  value: Type extends 'single' ? Data | undefined : Data[];\n  onSelect: (\n    option: Type extends 'single' ? Data | undefined : Data[]\n  ) => never | void;\n  keyExtractor: (t: Data, index?: number) => string;\n  labelExtractor: (t: Data) => string;\n  index: number;\n}\n\nconst SelectItem = <Data, Type extends 'single' | 'multi'>({\n  item,\n  onSelect,\n  type,\n  value,\n  labelExtractor,\n  setDropDownVisible,\n  checkedAll,\n  setCheckedAll,\n  lenghtOptions,\n  keyExtractor,\n}: SelectItemProps<Data, Type> & {\n  setDropDownVisible: (t: boolean) => void;\n  checkedAll: boolean;\n  setCheckedAll: (t: boolean) => void;\n  lenghtOptions: number;\n}): JSX.Element => {\n  const isMulti = type === 'multi';\n  const [checked, setChecked] = React.useState<boolean>(\n    value !== undefined &&\n      type === 'multi' &&\n      (value as Data[]).find(\n        data => keyExtractor(data) === keyExtractor(item)\n      ) !== undefined\n  );\n\n  React.useEffect(() => {\n    if (\n      !checked &&\n      value !== undefined &&\n      ((type === 'multi' &&\n        (value as Data[]).find(\n          data => keyExtractor(data) === keyExtractor(item)\n        )) ||\n        (type === 'single' &&\n          keyExtractor(value as Data) === keyExtractor(item)))\n    )\n      setChecked(true);\n  }, [value, keyExtractor, type]);\n\n  React.useEffect(() => {\n    if (type === 'multi') {\n      checkedAll\n        ? setChecked(true)\n        : setChecked(\n            (value as Data[]).find(\n              data => keyExtractor(data) === keyExtractor(item)\n            ) !== undefined\n          );\n    }\n  }, [checkedAll]);\n\n  const clickItem = React.useCallback(\n    (item, _value) => {\n      // TS Workaround since TS won't infer the ternary operator's result type correctly\n      type OnSelectArg = Parameters<typeof onSelect>[0];\n      const key: Data = item;\n      if (Array.isArray(_value)) {\n        const auxChecked = !checked;\n        setChecked(!checked);\n        if (auxChecked) {\n          onSelect([..._value, key] as OnSelectArg);\n          [..._value, key].length === lenghtOptions && setCheckedAll(true);\n        } else {\n          const auxArray: Data[] = [..._value];\n          const indexToExclude = auxArray.findIndex(\n            data => keyExtractor(data) === keyExtractor(key)\n          );\n          auxArray.splice(indexToExclude, 1);\n          onSelect([...auxArray] as OnSelectArg);\n          setCheckedAll(false);\n        }\n      } else {\n        onSelect(key as OnSelectArg);\n        setDropDownVisible(false);\n      }\n    },\n    [onSelect, setDropDownVisible, setCheckedAll, setChecked, checked]\n  );\n\n  return (\n    <ContainerItemSelect onClick={() => clickItem(item, value)}>\n      {isMulti && (\n        <Checkbox checked={checked} onChange={() => clickItem(item, value)} />\n      )}\n      <StyledContainerTextLabel>\n        <Text fontWeight=\"bold\" ellipsizeMode=\"tail\" numberOfLines={1}>\n          <StyledSpan singleHighligh={type === 'single' && value === item}>\n            {labelExtractor(item)}\n          </StyledSpan>\n        </Text>\n      </StyledContainerTextLabel>\n    </ContainerItemSelect>\n  );\n};\n\nexport default React.memo(SelectItem) as typeof SelectItem;\n"],"names":["item"],"mappings":";;;;AAoBA,MAAM,aAAa,CAAwC;AAAA,EACzD,IAAA;AAAA,EACA,QAAA;AAAA,EACA,IAAA;AAAA,EACA,KAAA;AAAA,EACA,cAAA;AAAA,EACA,kBAAA;AAAA,EACA,UAAA;AAAA,EACA,aAAA;AAAA,EACA,aAAA;AAAA,EACA,YAAA;AACF,CAKmB,KAAA;AACjB,EAAA,MAAM,UAAU,IAAS,KAAA,OAAA,CAAA;AACzB,EAAA,MAAM,CAAC,OAAA,EAAS,UAAU,CAAA,GAAI,KAAM,CAAA,QAAA;AAAA,IAClC,KAAU,KAAA,KAAA,CAAA,IACR,IAAS,KAAA,OAAA,IACR,KAAiB,CAAA,IAAA;AAAA,MAChB,CAAQ,IAAA,KAAA,YAAA,CAAa,IAAI,CAAA,KAAM,aAAa,IAAI,CAAA;AAAA,KAC5C,KAAA,KAAA,CAAA;AAAA,GACV,CAAA;AAEA,EAAA,KAAA,CAAM,UAAU,MAAM;AACpB,IAAA,IACE,CAAC,OACD,IAAA,KAAA,KAAU,KACR,CAAA,KAAA,IAAA,KAAS,WACR,KAAiB,CAAA,IAAA;AAAA,MAChB,CAAQ,IAAA,KAAA,YAAA,CAAa,IAAI,CAAA,KAAM,aAAa,IAAI,CAAA;AAAA,SAEjD,IAAS,KAAA,QAAA,IACR,aAAa,KAAa,CAAA,KAAM,aAAa,IAAI,CAAA,CAAA;AAErD,MAAA,UAAA,CAAW,IAAI,CAAA,CAAA;AAAA,GAChB,EAAA,CAAC,KAAO,EAAA,YAAA,EAAc,IAAI,CAAC,CAAA,CAAA;AAE9B,EAAA,KAAA,CAAM,UAAU,MAAM;AACpB,IAAA,IAAI,SAAS,OAAS,EAAA;AACpB,MACI,UAAA,GAAA,UAAA,CAAW,IAAI,CACf,GAAA,UAAA;AAAA,QACG,KAAiB,CAAA,IAAA;AAAA,UAChB,CAAQ,IAAA,KAAA,YAAA,CAAa,IAAI,CAAA,KAAM,aAAa,IAAI,CAAA;AAAA,SAC5C,KAAA,KAAA,CAAA;AAAA,OACR,CAAA;AAAA,KACN;AAAA,GACF,EAAG,CAAC,UAAU,CAAC,CAAA,CAAA;AAEf,EAAA,MAAM,YAAY,KAAM,CAAA,WAAA;AAAA,IACtB,CAACA,OAAM,MAAW,KAAA;AAGhB,MAAA,MAAM,GAAYA,GAAAA,KAAAA,CAAAA;AAClB,MAAI,IAAA,KAAA,CAAM,OAAQ,CAAA,MAAM,CAAG,EAAA;AACzB,QAAA,MAAM,aAAa,CAAC,OAAA,CAAA;AACpB,QAAA,UAAA,CAAW,CAAC,OAAO,CAAA,CAAA;AACnB,QAAA,IAAI,UAAY,EAAA;AACd,UAAA,QAAA,CAAS,CAAC,GAAG,MAAQ,EAAA,GAAG,CAAgB,CAAA,CAAA;AACxC,UAAA,CAAC,GAAG,MAAQ,EAAA,GAAG,EAAE,MAAW,KAAA,aAAA,IAAiB,cAAc,IAAI,CAAA,CAAA;AAAA,SAC1D,MAAA;AACL,UAAM,MAAA,QAAA,GAAmB,CAAC,GAAG,MAAM,CAAA,CAAA;AACnC,UAAA,MAAM,iBAAiB,QAAS,CAAA,SAAA;AAAA,YAC9B,CAAQ,IAAA,KAAA,YAAA,CAAa,IAAI,CAAA,KAAM,aAAa,GAAG,CAAA;AAAA,WACjD,CAAA;AACA,UAAS,QAAA,CAAA,MAAA,CAAO,gBAAgB,CAAC,CAAA,CAAA;AACjC,UAAS,QAAA,CAAA,CAAC,GAAG,QAAQ,CAAgB,CAAA,CAAA;AACrC,UAAA,aAAA,CAAc,KAAK,CAAA,CAAA;AAAA,SACrB;AAAA,OACK,MAAA;AACL,QAAA,QAAA,CAAS,GAAkB,CAAA,CAAA;AAC3B,QAAA,kBAAA,CAAmB,KAAK,CAAA,CAAA;AAAA,OAC1B;AAAA,KACF;AAAA,IACA,CAAC,QAAA,EAAU,kBAAoB,EAAA,aAAA,EAAe,YAAY,OAAO,CAAA;AAAA,GACnE,CAAA;AAEA,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA;AAAA,IAAoB,OAAS,EAAA,MAAM,SAAU,CAAA,IAAA,EAAM,KAAK,CAAA;AAAA,GAAA,EACtD,2BACE,KAAA,CAAA,aAAA,CAAA,QAAA,EAAA;AAAA,IAAS,OAAA;AAAA,IAAkB,QAAU,EAAA,MAAM,SAAU,CAAA,IAAA,EAAM,KAAK,CAAA;AAAA,GAAG,CAAA,kBAErE,KAAA,CAAA,aAAA,CAAA,wBAAA,EAAA,IAAA,kBACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IAAK,UAAW,EAAA,MAAA;AAAA,IAAO,aAAc,EAAA,MAAA;AAAA,IAAO,aAAe,EAAA,CAAA;AAAA,GAAA,kBACzD,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA;AAAA,IAAW,cAAA,EAAgB,IAAS,KAAA,QAAA,IAAY,KAAU,KAAA,IAAA;AAAA,GAAA,EACxD,cAAe,CAAA,IAAI,CACtB,CACF,CACF,CACF,CAAA,CAAA;AAEJ,CAAA,CAAA;AAEA,iBAAe,KAAA,CAAM,KAAK,UAAU,CAAA;;;;"}
+{"version":3,"file":"SelectItem.js","sources":["../../../../../../src/components/molecules/Select/SelectItem/SelectItem.tsx"],"sourcesContent":["import React from 'react';\nimport { Checkbox, Text } from '@tecsinapse/react-core';\nimport {\n  ContainerItemSelect,\n  StyledContainerTextLabel,\n  StyledSpan,\n} from './styled';\n\ninterface SelectItemProps<Data, Type extends 'single' | 'multi'> {\n  item: Data;\n  type: Type;\n  value: Type extends 'single' ? Data | undefined : Data[];\n  onSelect: (\n    option: Type extends 'single' ? Data | undefined : Data[]\n  ) => never | void;\n  keyExtractor: (t: Data, index?: number) => string;\n  labelExtractor: (t: Data) => string;\n  index: number;\n}\n\nconst SelectItem = <Data, Type extends 'single' | 'multi'>({\n  item,\n  onSelect,\n  type,\n  value,\n  labelExtractor,\n  setDropDownVisible,\n  checkedAll,\n  setCheckedAll,\n  lenghtOptions,\n  keyExtractor,\n}: SelectItemProps<Data, Type> & {\n  setDropDownVisible: (t: boolean) => void;\n  checkedAll: boolean;\n  setCheckedAll: (t: boolean) => void;\n  lenghtOptions: number;\n}): JSX.Element => {\n  const isMulti = type === 'multi';\n  const [checked, setChecked] = React.useState<boolean>(\n    value !== undefined &&\n      type === 'multi' &&\n      (value as Data[]).find(\n        data => keyExtractor(data) === keyExtractor(item)\n      ) !== undefined\n  );\n\n  React.useEffect(() => {\n    if (\n      !checked &&\n      value !== undefined &&\n      ((type === 'multi' &&\n        (value as Data[]).find(\n          data => keyExtractor(data) === keyExtractor(item)\n        )) ||\n        (type === 'single' &&\n          keyExtractor(value as Data) === keyExtractor(item)))\n    )\n      setChecked(true);\n  }, [value, keyExtractor, type]);\n\n  React.useEffect(() => {\n    if (type === 'multi') {\n      checkedAll\n        ? setChecked(true)\n        : setChecked(\n            (value as Data[]).find(\n              data => keyExtractor(data) === keyExtractor(item)\n            ) !== undefined\n          );\n    }\n  }, [checkedAll]);\n\n  const clickItem = React.useCallback(\n    (item, _value) => {\n      // TS Workaround since TS won't infer the ternary operator's result type correctly\n      type OnSelectArg = Parameters<typeof onSelect>[0];\n      const key: Data = item;\n      if (Array.isArray(_value)) {\n        const auxChecked = !checked;\n        setChecked(!checked);\n        if (auxChecked) {\n          onSelect([..._value, key] as OnSelectArg);\n          [..._value, key].length === lenghtOptions && setCheckedAll(true);\n        } else {\n          const auxArray: Data[] = [..._value];\n          const indexToExclude = auxArray.findIndex(\n            data => keyExtractor(data) === keyExtractor(key)\n          );\n          auxArray.splice(indexToExclude, 1);\n          onSelect([...auxArray] as OnSelectArg);\n          setCheckedAll(false);\n        }\n      } else {\n        onSelect(key as OnSelectArg);\n        setDropDownVisible(false);\n      }\n    },\n    [onSelect, setDropDownVisible, setCheckedAll, setChecked, checked]\n  );\n\n  return (\n    <ContainerItemSelect onClick={() => clickItem(item, value)}>\n      {isMulti && (\n        <Checkbox checked={checked} onChange={() => clickItem(item, value)} />\n      )}\n      <StyledContainerTextLabel>\n        <Text fontWeight=\"bold\" ellipsizeMode=\"tail\" numberOfLines={1}>\n          <StyledSpan singleHighligh={type === 'single' && value === item}>\n            {labelExtractor(item)}\n          </StyledSpan>\n        </Text>\n      </StyledContainerTextLabel>\n    </ContainerItemSelect>\n  );\n};\n\nexport default React.memo(SelectItem) as typeof SelectItem;\n"],"names":["item"],"mappings":"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"}

package/dist/esm/components/molecules/Select/styled.js

@@ -13,12 +13,15 @@ const StyledContainer = styled("div")`
 const StyledInputContainer = styled("div")`
   width: 100%;
 `;
-const RightComponent = /* @__PURE__ */ React.createElement(Icon, {
-  name: "chevron-down",
-  type: "material-community",
-  size: "centi",
-  style: { marginRight: 12 }
-});
+const RightComponent = /* @__PURE__ */ React.createElement(
+  Icon,
+  {
+    name: "chevron-down",
+    type: "material-community",
+    size: "centi",
+    style: { marginRight: 12 }
+  }
+);
 
 export { RightComponent, StyledContainer, StyledInputContainer };
 //# sourceMappingURL=styled.js.map

package/dist/esm/components/molecules/Select/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/Select/styled.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { Icon, StyleProps } from '@tecsinapse/react-core';\nimport React from 'react';\n\nexport const StyledContainer = styled('div')<Partial<StyleProps>>`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: column;\n  width: 100%;\n  position: relative;\n`;\n\nexport const StyledInputContainer = styled('div')<Partial<StyleProps>>`\n  width: 100%;\n`;\n\nexport const RightComponent = (\n  <Icon\n    name=\"chevron-down\"\n    type=\"material-community\"\n    size=\"centi\"\n    style={{ marginRight: 12 }}\n  />\n);\n"],"names":[],"mappings":";;;;AAIa,MAAA,eAAA,GAAkB,OAAO,KAAK,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAS9B,MAAA,oBAAA,GAAuB,OAAO,KAAK,CAAA,CAAA;AAAA;AAAA,EAAA;AAIzC,MAAM,iCACV,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,EACC,IAAK,EAAA,cAAA;AAAA,EACL,IAAK,EAAA,oBAAA;AAAA,EACL,IAAK,EAAA,OAAA;AAAA,EACL,KAAA,EAAO,EAAE,WAAA,EAAa,EAAG,EAAA;AAAA,CAC3B;;;;"}
+{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/Select/styled.tsx"],"sourcesContent":["import styled from '@emotion/styled';\nimport { Icon, StyleProps } from '@tecsinapse/react-core';\nimport React from 'react';\n\nexport const StyledContainer = styled('div')<Partial<StyleProps>>`\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  flex-direction: column;\n  width: 100%;\n  position: relative;\n`;\n\nexport const StyledInputContainer = styled('div')<Partial<StyleProps>>`\n  width: 100%;\n`;\n\nexport const RightComponent = (\n  <Icon\n    name=\"chevron-down\"\n    type=\"material-community\"\n    size=\"centi\"\n    style={{ marginRight: 12 }}\n  />\n);\n"],"names":[],"mappings":";;;;AAIa,MAAA,eAAA,GAAkB,OAAO,KAAK,CAAA,CAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAAA;AAS9B,MAAA,oBAAA,GAAuB,OAAO,KAAK,CAAA,CAAA;AAAA;AAAA,EAAA;AAIzC,MAAM,cACX,mBAAA,KAAA,CAAA,aAAA;AAAA,EAAC,IAAA;AAAA,EAAA;AAAA,IACC,IAAK,EAAA,cAAA;AAAA,IACL,IAAK,EAAA,oBAAA;AAAA,IACL,IAAK,EAAA,OAAA;AAAA,IACL,KAAA,EAAO,EAAE,WAAA,EAAa,EAAG,EAAA;AAAA,GAAA;AAC3B;;;;"}

package/dist/esm/components/molecules/Snackbar/Snackbar.js

@@ -7,13 +7,7 @@ const Snackbar = ({
   textProps = { colorVariant: "primary", colorTone: "medium" },
   ...rest
 }) => {
-  return /* @__PURE__ */ React.createElement(SnackbarStyled, {
-    ...rest
-  }, /* @__PURE__ */ React.createElement(Text, {
-    ...textProps,
-    fontWeight: "bold",
-    typography: "base"
-  }, value));
+  return /* @__PURE__ */ React.createElement(SnackbarStyled, { ...rest, showProgressBar: false }, /* @__PURE__ */ React.createElement(Text, { ...textProps, fontWeight: "bold", typography: "base" }, value));
 };
 
 export { Snackbar as default };

package/dist/esm/components/molecules/Snackbar/Snackbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"Snackbar.js","sources":["../../../../../src/components/molecules/Snackbar/Snackbar.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  SnackbarProps as SnackPropsCore,\n  Text,\n  TextProps,\n} from '@tecsinapse/react-core';\nimport { SnackbarStyled } from './styled';\n\nexport interface SnackbarWebProps extends Omit<SnackPropsCore, 'children'> {\n  value: string;\n  textProps?: TextProps;\n}\n\nconst Snackbar: React.FC<SnackbarWebProps> = ({\n  value,\n  textProps = { colorVariant: 'primary', colorTone: 'medium' },\n  ...rest\n}) => {\n  return (\n    <SnackbarStyled {...rest}>\n      <Text {...textProps} fontWeight=\"bold\" typography=\"base\">\n        {value}\n      </Text>\n    </SnackbarStyled>\n  );\n};\n\nexport default Snackbar;\n"],"names":[],"mappings":";;;;AAaA,MAAM,WAAuC,CAAC;AAAA,EAC5C,KAAA;AAAA,EACA,SAAY,GAAA,EAAE,YAAc,EAAA,SAAA,EAAW,WAAW,QAAS,EAAA;AAAA,EACxD,GAAA,IAAA;AACL,CAAM,KAAA;AACJ,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,cAAA,EAAA;AAAA,IAAgB,GAAG,IAAA;AAAA,GAAA,kBACjB,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA;AAAA,IAAM,GAAG,SAAA;AAAA,IAAW,UAAW,EAAA,MAAA;AAAA,IAAO,UAAW,EAAA,MAAA;AAAA,GAAA,EAC/C,KACH,CACF,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"Snackbar.js","sources":["../../../../../src/components/molecules/Snackbar/Snackbar.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  SnackbarProps as SnackPropsCore,\n  Text,\n  TextProps,\n} from '@tecsinapse/react-core';\nimport { SnackbarStyled } from './styled';\n\nexport interface SnackbarWebProps extends Omit<SnackPropsCore, 'children'> {\n  value: string;\n  textProps?: TextProps;\n}\n\nconst Snackbar: React.FC<SnackbarWebProps> = ({\n  value,\n  textProps = { colorVariant: 'primary', colorTone: 'medium' },\n  ...rest\n}) => {\n  return (\n    <SnackbarStyled {...rest} showProgressBar={false}>\n      <Text {...textProps} fontWeight=\"bold\" typography=\"base\">\n        {value}\n      </Text>\n    </SnackbarStyled>\n  );\n};\n\nexport default Snackbar;\n"],"names":[],"mappings":";;;;AAaA,MAAM,WAAuC,CAAC;AAAA,EAC5C,KAAA;AAAA,EACA,SAAY,GAAA,EAAE,YAAc,EAAA,SAAA,EAAW,WAAW,QAAS,EAAA;AAAA,EAC3D,GAAG,IAAA;AACL,CAAM,KAAA;AACJ,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,cAAA,EAAA,EAAgB,GAAG,IAAA,EAAM,iBAAiB,KACzC,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,IAAM,EAAA,EAAA,GAAG,WAAW,UAAW,EAAA,MAAA,EAAO,UAAW,EAAA,MAAA,EAAA,EAC/C,KACH,CACF,CAAA,CAAA;AAEJ;;;;"}

package/dist/esm/components/molecules/TextArea/TextArea.d.ts

@@ -1,5 +1,5 @@
 import { FC } from 'react';
 import { TextAreaProps as ITACore } from '@tecsinapse/react-core';
-export declare type TextAreaProps = Omit<ITACore, 'TextComponent' | 'focused'>;
+export type TextAreaProps = Omit<ITACore, 'TextComponent' | 'focused'>;
 declare const TextArea: FC<TextAreaProps>;
 export default TextArea;

package/dist/esm/components/molecules/TextArea/TextArea.js

@@ -33,41 +33,48 @@ const TextArea = ({
     onBlur,
     !disabled
   );
-  return /* @__PURE__ */ React.createElement(TextArea$1, {
-    label,
-    labelColor,
-    labelColorVariant,
-    labelColorTone,
-    labelTypography,
-    labelStack,
-    labelWeight,
-    LabelComponent: Text,
-    leftComponent,
-    rightComponent,
-    borderColor,
-    borderColorGradation,
-    inputContainerStyle,
-    focused,
-    disabled,
-    variant,
-    value,
-    hintComponent,
-    hint,
-    style,
-    TextComponent: Text,
-    maxLength
-  }, /* @__PURE__ */ React.createElement(StyledWebInput, {
-    ...rest,
-    fontStack: inputFontStack,
-    fontWeight: inputFontWeight,
-    disabled,
-    onFocus: handleFocus,
-    onBlur: handleBlur,
-    textAlignVertical: "top",
-    multiline: true,
-    value,
-    maxLength
-  }));
+  return /* @__PURE__ */ React.createElement(
+    TextArea$1,
+    {
+      label,
+      labelColor,
+      labelColorVariant,
+      labelColorTone,
+      labelTypography,
+      labelStack,
+      labelWeight,
+      LabelComponent: Text,
+      leftComponent,
+      rightComponent,
+      borderColor,
+      borderColorGradation,
+      inputContainerStyle,
+      focused,
+      disabled,
+      variant,
+      value,
+      hintComponent,
+      hint,
+      style,
+      TextComponent: Text,
+      maxLength
+    },
+    /* @__PURE__ */ React.createElement(
+      StyledWebInput,
+      {
+        ...rest,
+        fontStack: inputFontStack,
+        fontWeight: inputFontWeight,
+        disabled,
+        onFocus: handleFocus,
+        onBlur: handleBlur,
+        textAlignVertical: "top",
+        multiline: true,
+        value,
+        maxLength
+      }
+    )
+  );
 };
 
 export { TextArea as default };

package/dist/esm/components/molecules/TextArea/TextArea.js.map

@@ -1 +1 @@
-{"version":3,"file":"TextArea.js","sources":["../../../../../src/components/molecules/TextArea/TextArea.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport {\n  useInputFocus,\n  TextAreaProps as ITACore,\n  TextArea as TACore,\n  Text,\n} from '@tecsinapse/react-core';\nimport { StyledWebInput } from './styled';\n\nexport type TextAreaProps = Omit<ITACore, 'TextComponent' | 'focused'>;\n\nconst TextArea: FC<TextAreaProps> = ({\n  label,\n  labelColor,\n  labelColorVariant,\n  labelColorTone,\n  labelTypography,\n  labelStack,\n  labelWeight,\n  leftComponent,\n  rightComponent,\n  disabled,\n  style,\n  borderColor,\n  borderColorGradation,\n  inputFontStack = 'default',\n  inputFontWeight = 'bold',\n  inputContainerStyle,\n  variant = 'default',\n  hintComponent,\n  hint,\n  onFocus,\n  onBlur,\n  value,\n  maxLength,\n  ...rest\n}) => {\n  const { focused, handleBlur, handleFocus } = useInputFocus(\n    onFocus,\n    onBlur,\n    !disabled\n  );\n\n  return (\n    <TACore\n      label={label}\n      labelColor={labelColor}\n      labelColorVariant={labelColorVariant}\n      labelColorTone={labelColorTone}\n      labelTypography={labelTypography}\n      labelStack={labelStack}\n      labelWeight={labelWeight}\n      LabelComponent={Text}\n      leftComponent={leftComponent}\n      rightComponent={rightComponent}\n      borderColor={borderColor}\n      borderColorGradation={borderColorGradation}\n      inputContainerStyle={inputContainerStyle}\n      focused={focused}\n      disabled={disabled}\n      variant={variant}\n      value={value}\n      hintComponent={hintComponent}\n      hint={hint}\n      style={style}\n      TextComponent={Text}\n      maxLength={maxLength}\n    >\n      <StyledWebInput\n        {...rest}\n        fontStack={inputFontStack}\n        fontWeight={inputFontWeight}\n        disabled={disabled}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        textAlignVertical={'top'}\n        multiline\n        value={value}\n        maxLength={maxLength}\n      />\n    </TACore>\n  );\n};\n\nexport default TextArea;\n"],"names":["TACore"],"mappings":";;;;AAWA,MAAM,WAA8B,CAAC;AAAA,EACnC,KAAA;AAAA,EACA,UAAA;AAAA,EACA,iBAAA;AAAA,EACA,cAAA;AAAA,EACA,eAAA;AAAA,EACA,UAAA;AAAA,EACA,WAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA,WAAA;AAAA,EACA,oBAAA;AAAA,EACA,cAAiB,GAAA,SAAA;AAAA,EACjB,eAAkB,GAAA,MAAA;AAAA,EAClB,mBAAA;AAAA,EACA,OAAU,GAAA,SAAA;AAAA,EACV,aAAA;AAAA,EACA,IAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACG,GAAA,IAAA;AACL,CAAM,KAAA;AACJ,EAAA,MAAM,EAAE,OAAA,EAAS,UAAY,EAAA,WAAA,EAAgB,GAAA,aAAA;AAAA,IAC3C,OAAA;AAAA,IACA,MAAA;AAAA,IACA,CAAC,QAAA;AAAA,GACH,CAAA;AAEA,EAAA,uBACG,KAAA,CAAA,aAAA,CAAAA,UAAA,EAAA;AAAA,IACC,KAAA;AAAA,IACA,UAAA;AAAA,IACA,iBAAA;AAAA,IACA,cAAA;AAAA,IACA,eAAA;AAAA,IACA,UAAA;AAAA,IACA,WAAA;AAAA,IACA,cAAgB,EAAA,IAAA;AAAA,IAChB,aAAA;AAAA,IACA,cAAA;AAAA,IACA,WAAA;AAAA,IACA,oBAAA;AAAA,IACA,mBAAA;AAAA,IACA,OAAA;AAAA,IACA,QAAA;AAAA,IACA,OAAA;AAAA,IACA,KAAA;AAAA,IACA,aAAA;AAAA,IACA,IAAA;AAAA,IACA,KAAA;AAAA,IACA,aAAe,EAAA,IAAA;AAAA,IACf,SAAA;AAAA,GAAA,kBAEC,KAAA,CAAA,aAAA,CAAA,cAAA,EAAA;AAAA,IACE,GAAG,IAAA;AAAA,IACJ,SAAW,EAAA,cAAA;AAAA,IACX,UAAY,EAAA,eAAA;AAAA,IACZ,QAAA;AAAA,IACA,OAAS,EAAA,WAAA;AAAA,IACT,MAAQ,EAAA,UAAA;AAAA,IACR,iBAAmB,EAAA,KAAA;AAAA,IACnB,SAAS,EAAA,IAAA;AAAA,IACT,KAAA;AAAA,IACA,SAAA;AAAA,GACF,CACF,CAAA,CAAA;AAEJ;;;;"}
+{"version":3,"file":"TextArea.js","sources":["../../../../../src/components/molecules/TextArea/TextArea.tsx"],"sourcesContent":["import React, { FC } from 'react';\nimport {\n  useInputFocus,\n  TextAreaProps as ITACore,\n  TextArea as TACore,\n  Text,\n} from '@tecsinapse/react-core';\nimport { StyledWebInput } from './styled';\n\nexport type TextAreaProps = Omit<ITACore, 'TextComponent' | 'focused'>;\n\nconst TextArea: FC<TextAreaProps> = ({\n  label,\n  labelColor,\n  labelColorVariant,\n  labelColorTone,\n  labelTypography,\n  labelStack,\n  labelWeight,\n  leftComponent,\n  rightComponent,\n  disabled,\n  style,\n  borderColor,\n  borderColorGradation,\n  inputFontStack = 'default',\n  inputFontWeight = 'bold',\n  inputContainerStyle,\n  variant = 'default',\n  hintComponent,\n  hint,\n  onFocus,\n  onBlur,\n  value,\n  maxLength,\n  ...rest\n}) => {\n  const { focused, handleBlur, handleFocus } = useInputFocus(\n    onFocus,\n    onBlur,\n    !disabled\n  );\n\n  return (\n    <TACore\n      label={label}\n      labelColor={labelColor}\n      labelColorVariant={labelColorVariant}\n      labelColorTone={labelColorTone}\n      labelTypography={labelTypography}\n      labelStack={labelStack}\n      labelWeight={labelWeight}\n      LabelComponent={Text}\n      leftComponent={leftComponent}\n      rightComponent={rightComponent}\n      borderColor={borderColor}\n      borderColorGradation={borderColorGradation}\n      inputContainerStyle={inputContainerStyle}\n      focused={focused}\n      disabled={disabled}\n      variant={variant}\n      value={value}\n      hintComponent={hintComponent}\n      hint={hint}\n      style={style}\n      TextComponent={Text}\n      maxLength={maxLength}\n    >\n      <StyledWebInput\n        {...rest}\n        fontStack={inputFontStack}\n        fontWeight={inputFontWeight}\n        disabled={disabled}\n        onFocus={handleFocus}\n        onBlur={handleBlur}\n        textAlignVertical={'top'}\n        multiline\n        value={value}\n        maxLength={maxLength}\n      />\n    </TACore>\n  );\n};\n\nexport default TextArea;\n"],"names":["TACore"],"mappings":";;;;AAWA,MAAM,WAA8B,CAAC;AAAA,EACnC,KAAA;AAAA,EACA,UAAA;AAAA,EACA,iBAAA;AAAA,EACA,cAAA;AAAA,EACA,eAAA;AAAA,EACA,UAAA;AAAA,EACA,WAAA;AAAA,EACA,aAAA;AAAA,EACA,cAAA;AAAA,EACA,QAAA;AAAA,EACA,KAAA;AAAA,EACA,WAAA;AAAA,EACA,oBAAA;AAAA,EACA,cAAiB,GAAA,SAAA;AAAA,EACjB,eAAkB,GAAA,MAAA;AAAA,EAClB,mBAAA;AAAA,EACA,OAAU,GAAA,SAAA;AAAA,EACV,aAAA;AAAA,EACA,IAAA;AAAA,EACA,OAAA;AAAA,EACA,MAAA;AAAA,EACA,KAAA;AAAA,EACA,SAAA;AAAA,EACA,GAAG,IAAA;AACL,CAAM,KAAA;AACJ,EAAA,MAAM,EAAE,OAAA,EAAS,UAAY,EAAA,WAAA,EAAgB,GAAA,aAAA;AAAA,IAC3C,OAAA;AAAA,IACA,MAAA;AAAA,IACA,CAAC,QAAA;AAAA,GACH,CAAA;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAACA,UAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,UAAA;AAAA,MACA,iBAAA;AAAA,MACA,cAAA;AAAA,MACA,eAAA;AAAA,MACA,UAAA;AAAA,MACA,WAAA;AAAA,MACA,cAAgB,EAAA,IAAA;AAAA,MAChB,aAAA;AAAA,MACA,cAAA;AAAA,MACA,WAAA;AAAA,MACA,oBAAA;AAAA,MACA,mBAAA;AAAA,MACA,OAAA;AAAA,MACA,QAAA;AAAA,MACA,OAAA;AAAA,MACA,KAAA;AAAA,MACA,aAAA;AAAA,MACA,IAAA;AAAA,MACA,KAAA;AAAA,MACA,aAAe,EAAA,IAAA;AAAA,MACf,SAAA;AAAA,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA;AAAA,MAAC,cAAA;AAAA,MAAA;AAAA,QACE,GAAG,IAAA;AAAA,QACJ,SAAW,EAAA,cAAA;AAAA,QACX,UAAY,EAAA,eAAA;AAAA,QACZ,QAAA;AAAA,QACA,OAAS,EAAA,WAAA;AAAA,QACT,MAAQ,EAAA,UAAA;AAAA,QACR,iBAAmB,EAAA,KAAA;AAAA,QACnB,SAAS,EAAA,IAAA;AAAA,QACT,KAAA;AAAA,QACA,SAAA;AAAA,OAAA;AAAA,KACF;AAAA,GACF,CAAA;AAEJ;;;;"}

package/dist/esm/components/molecules/TextArea/styled.js.map

@@ -1 +1 @@
-{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/TextArea/styled.ts"],"sourcesContent":["import styled from '@emotion/native';\nimport {\n  FontStackType,\n  FontWeightType,\n  StyleProps,\n  TextAreaInputBase,\n} from '@tecsinapse/react-core';\nimport { TextAreaProps } from './TextArea';\n\ninterface Font {\n  fontStack?: FontStackType;\n  fontWeight?: FontWeightType;\n}\n\nexport const StyledWebInput = styled(TextAreaInputBase)<\n  Font & Partial<TextAreaProps> & Partial<StyleProps>\n>`\n  font-weight: ${({ theme, fontWeight = 'regular' }) =>\n    theme.font.weight[fontWeight]};\n  font-family: ${({ theme, fontStack = 'default' }) =>\n    `'${theme.font.stack[fontStack]}'`};\n  outline-width: 0;\n`;\n"],"names":["styled"],"mappings":";;;AAca,MAAA,cAAA,GAAiBA,aAAO,iBAAiB,CAAA,CAAA;AAAA,eAGrC,EAAA,CAAC,EAAE,KAAO,EAAA,UAAA,GAAa,WACpC,KAAA,KAAA,CAAM,KAAK,MAAO,CAAA,UAAA,CAAA,CAAA;AAAA,eACL,EAAA,CAAC,EAAE,KAAO,EAAA,SAAA,GAAY,WACnC,KAAA,CAAA,CAAA,EAAI,KAAM,CAAA,IAAA,CAAK,KAAM,CAAA,SAAA,CAAA,CAAA,CAAA,CAAA,CAAA;AAAA;AAAA;;;;"}
+{"version":3,"file":"styled.js","sources":["../../../../../src/components/molecules/TextArea/styled.ts"],"sourcesContent":["import styled from '@emotion/native';\nimport {\n  FontStackType,\n  FontWeightType,\n  StyleProps,\n  TextAreaInputBase,\n} from '@tecsinapse/react-core';\nimport { TextAreaProps } from './TextArea';\n\ninterface Font {\n  fontStack?: FontStackType;\n  fontWeight?: FontWeightType;\n}\n\nexport const StyledWebInput = styled(TextAreaInputBase)<\n  Font & Partial<TextAreaProps> & Partial<StyleProps>\n>`\n  font-weight: ${({ theme, fontWeight = 'regular' }) =>\n    theme.font.weight[fontWeight]};\n  font-family: ${({ theme, fontStack = 'default' }) =>\n    `'${theme.font.stack[fontStack]}'`};\n  outline-width: 0;\n`;\n"],"names":["styled"],"mappings":";;;AAca,MAAA,cAAA,GAAiBA,aAAO,iBAAiB,CAAA,CAAA;AAAA,eAGrC,EAAA,CAAC,EAAE,KAAO,EAAA,UAAA,GAAa,WACpC,KAAA,KAAA,CAAM,IAAK,CAAA,MAAA,CAAO,UAAU,CAAA,CAAA;AAAA,eACf,EAAA,CAAC,EAAE,KAAA,EAAO,SAAY,GAAA,SAAA,OACnC,CAAI,CAAA,EAAA,KAAA,CAAM,IAAK,CAAA,KAAA,CAAM,SAAS,CAAA,CAAA,CAAA,CAAA,CAAA;AAAA;AAAA;;;;"}

package/dist/esm/components/organisms/DataGrid/DataGrid.d.ts

@@ -25,5 +25,5 @@ export interface DataGridProps<Data> extends React.HTMLAttributes<HTMLDivElement
     emptyPlaceholder?: React.ReactNode;
     exportComponent?: React.ReactNode;
 }
-declare const DataGrid: <Data>({ headers, data, rowKeyExtractor, toolbarTitle, toolbarFooter, toolbarRightIcons, selectable, selectedRows, onSelectedRows, pagination, rowsPerPage, onRowsPerPageChange, rowsPerPageOptions, rowsPerPageLabel, exportLabel, exportFunction, rowsCount, page, onPageChange, loading, skeletonComponent, emptyPlaceholder, exportComponent, ...rest }: DataGridProps<Data>) => JSX.Element;
+declare const DataGrid: <Data>({ headers, data, rowKeyExtractor, toolbarTitle, toolbarFooter, toolbarRightIcons, selectable, selectedRows, onSelectedRows, pagination, rowsPerPage, onRowsPerPageChange, rowsPerPageOptions: _rowsPerPageOptions, rowsPerPageLabel: _rowsPerPageLabel, exportLabel, exportFunction, rowsCount, page, onPageChange, loading, skeletonComponent, emptyPlaceholder, exportComponent, ...rest }: DataGridProps<Data>) => JSX.Element;
 export default DataGrid;

package/dist/esm/components/organisms/DataGrid/DataGrid.js

@@ -67,58 +67,55 @@ const DataGrid = ({
     },
     [onSelectedRows, rowKeyExtractor]
   );
-  return /* @__PURE__ */ React.createElement(TableContainer, {
-    ...rest
-  }, /* @__PURE__ */ React.createElement(TableToolbar, {
-    title: toolbarTitle,
-    rightIcons: toolbarRightIcons,
-    footer: toolbarFooter
-  }), /* @__PURE__ */ React.createElement(Table, null, /* @__PURE__ */ React.createElement(Header, {
-    selectable,
-    headers,
-    data,
-    rowsCount: rowsCount ?? data.length,
-    rowKeyExtractor,
-    selectedRows,
-    onSelected: onSelectedRows
-  }), !loading ? /* @__PURE__ */ React.createElement(TBody, null, data.length > 0 ? getData(data, rowsCount, page, rowsPerPage, pagination).map(
-    (item) => /* @__PURE__ */ React.createElement(Row, {
-      key: rowKeyExtractor(item),
-      rowKeyExtractor,
-      handleSelect,
+  return /* @__PURE__ */ React.createElement(TableContainer, { ...rest }, /* @__PURE__ */ React.createElement(
+    TableToolbar,
+    {
+      title: toolbarTitle,
+      rightIcons: toolbarRightIcons,
+      footer: toolbarFooter
+    }
+  ), /* @__PURE__ */ React.createElement(Table, null, /* @__PURE__ */ React.createElement(
+    Header,
+    {
       selectable,
       headers,
-      data: item,
-      checked: selectedRows?.some(
-        (sel) => rowKeyExtractor(sel) === rowKeyExtractor(item)
-      )
-    })
-  ) : /* @__PURE__ */ React.createElement("tr", null, /* @__PURE__ */ React.createElement("td", {
-    colSpan: 99
-  }, emptyPlaceholder))) : /* @__PURE__ */ React.createElement(TBody, null, [...Array(rowsPerPage).keys()].map((idx) => /* @__PURE__ */ React.createElement(Tr, {
-    key: `skeleton-${idx}`
-  }, /* @__PURE__ */ React.createElement(Td, {
-    colSpan: 99,
-    style: { padding: 0 }
-  }, skeletonComponent ?? /* @__PURE__ */ React.createElement(Skeleton, {
-    height: 55,
-    radius: "mili",
-    animation: "wave"
-  }, /* @__PURE__ */ React.createElement("div", {
-    style: { width: "100%" }
-  })))))), (Number(rowsCount) > 0 || data.length > 0) && /* @__PURE__ */ React.createElement(Footer, {
-    exportFunction,
-    exportLabel,
-    rowsPerPageLabel,
-    rowsPerPage,
-    onRowsPerPageChange,
-    rowsPerPageOptions,
-    rowsCount: rowsCount ?? data.length,
-    page,
-    onPageChange,
-    pagination,
-    exportComponent
-  })));
+      data,
+      rowsCount: rowsCount ?? data.length,
+      rowKeyExtractor,
+      selectedRows,
+      onSelected: onSelectedRows
+    }
+  ), !loading ? /* @__PURE__ */ React.createElement(TBody, null, data.length > 0 ? getData(data, rowsCount, page, rowsPerPage, pagination).map(
+    (item) => /* @__PURE__ */ React.createElement(
+      Row,
+      {
+        key: rowKeyExtractor(item),
+        rowKeyExtractor,
+        handleSelect,
+        selectable,
+        headers,
+        data: item,
+        checked: selectedRows?.some(
+          (sel) => rowKeyExtractor(sel) === rowKeyExtractor(item)
+        )
+      }
+    )
+  ) : /* @__PURE__ */ React.createElement("tr", null, /* @__PURE__ */ React.createElement("td", { colSpan: 99 }, emptyPlaceholder))) : /* @__PURE__ */ React.createElement(TBody, null, [...Array(rowsPerPage).keys()].map((idx) => /* @__PURE__ */ React.createElement(Tr, { key: `skeleton-${idx}` }, /* @__PURE__ */ React.createElement(Td, { colSpan: 99, style: { padding: 0 } }, skeletonComponent ?? /* @__PURE__ */ React.createElement(Skeleton, { height: 55, radius: "mili", animation: "wave" }, /* @__PURE__ */ React.createElement("div", { style: { width: "100%" } })))))), (Number(rowsCount) > 0 || data.length > 0) && /* @__PURE__ */ React.createElement(
+    Footer,
+    {
+      exportFunction,
+      exportLabel,
+      rowsPerPageLabel,
+      rowsPerPage,
+      onRowsPerPageChange,
+      rowsPerPageOptions,
+      rowsCount: rowsCount ?? data.length,
+      page,
+      onPageChange,
+      pagination,
+      exportComponent
+    }
+  )));
 };
 
 export { DataGrid as default };

package/dist/esm/components/organisms/DataGrid/DataGrid.js.map

@@ -1 +1 @@
-{"version":3,"file":"DataGrid.js","sources":["../../../../../src/components/organisms/DataGrid/DataGrid.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  Table,\n  TableToolbar,\n  TableContainer,\n  Tr,\n  Td,\n  TBody,\n} from '../../atoms/Table';\nimport { Header } from './Header';\nimport { Row } from './Row';\nimport { HeadersType } from './types';\nimport { Footer } from './Footer';\nimport { Skeleton } from '../../atoms/Skeleton';\nimport { getData, removeElement } from './utils';\n\nexport interface DataGridProps<Data>\n  extends React.HTMLAttributes<HTMLDivElement> {\n  headers: HeadersType<Data>[];\n  data: Data[];\n  /** Unique identifier for row data */\n  rowKeyExtractor: (data: Data) => string;\n  toolbarRightIcons?: React.ReactNode;\n  toolbarFooter?: React.ReactNode;\n  toolbarTitle: string;\n  /** Enable rows selection */\n  selectable?: boolean;\n  /** Selected items */\n  selectedRows?: Data[];\n  /** Selection handler */\n  onSelectedRows?: (data: Data[] | ((prevState: Data[]) => Data[])) => void;\n  /** Shows pagination controls */\n  pagination?: boolean;\n  /** Results per page */\n  rowsPerPage?: number;\n  /** Results per page handler */\n  onRowsPerPageChange?: (value: number) => void;\n  rowsPerPageOptions?: number[];\n  rowsPerPageLabel?: (value: number) => string;\n  /** Export button label */\n  exportLabel?: string;\n  exportFunction?: () => void;\n  /** Total data elements. Only specify this property if your data is server-side */\n  rowsCount?: number;\n  /** Current page. Always start in 0 */\n  page?: number;\n  /** Current page handler */\n  onPageChange?: (page: number) => void;\n  /** Loading state. The amount of skeleton rows is based on current rowsPerPage */\n  loading?: boolean;\n  /** Custom skeleton component for better visual */\n  skeletonComponent?: React.ReactNode;\n  /** Empty state placeholder */\n  emptyPlaceholder?: React.ReactNode;\n  /** Export component, use if default button with label is not ideal. This prop, not receive \"exportLabel\" and \"exportFunction\" */\n  exportComponent?: React.ReactNode;\n}\n\n/** Note: Consider memoizing functions for a better performance */\nconst DataGrid = <Data,>({\n  headers,\n  data,\n  rowKeyExtractor,\n  toolbarTitle,\n  toolbarFooter,\n  toolbarRightIcons,\n  selectable = false,\n  selectedRows = [],\n  onSelectedRows,\n  pagination = false,\n  rowsPerPage = 10,\n  onRowsPerPageChange,\n  rowsPerPageOptions: _rowsPerPageOptions,\n  rowsPerPageLabel: _rowsPerPageLabel,\n  exportLabel = 'Exportar',\n  exportFunction,\n  rowsCount,\n  page = 0,\n  onPageChange,\n  loading = false,\n  skeletonComponent,\n  emptyPlaceholder,\n  exportComponent,\n  ...rest\n}: DataGridProps<Data>): JSX.Element => {\n  if (selectable && (!selectedRows || !onSelectedRows)) {\n    throw new Error(\n      '[DataGrid] You should specify selection handlers (selectedRows, onSelectedRows)'\n    );\n  }\n\n  const rowsPerPageLabel = React.useCallback(\n    value =>\n      _rowsPerPageLabel\n        ? _rowsPerPageLabel(value)\n        : `Exibir por página: ${value} itens`,\n    [_rowsPerPageLabel]\n  );\n  const rowsPerPageOptions = React.useMemo(\n    () => _rowsPerPageOptions ?? [10, 25, 50],\n    [_rowsPerPageOptions]\n  );\n\n  const handleSelect = React.useCallback(\n    (current, checked) => {\n      if (checked) {\n        onSelectedRows?.(prevState => [...prevState, current]);\n        return;\n      }\n\n      onSelectedRows?.(prevState => {\n        const idx = prevState.findIndex(\n          el => rowKeyExtractor(el) === rowKeyExtractor(current)\n        );\n        return [...removeElement(prevState, idx)];\n      });\n    },\n    [onSelectedRows, rowKeyExtractor]\n  );\n\n  return (\n    <TableContainer {...rest}>\n      <TableToolbar\n        title={toolbarTitle}\n        rightIcons={toolbarRightIcons}\n        footer={toolbarFooter}\n      />\n      <Table>\n        <Header\n          selectable={selectable}\n          headers={headers}\n          data={data}\n          rowsCount={rowsCount ?? data.length}\n          rowKeyExtractor={rowKeyExtractor}\n          selectedRows={selectedRows}\n          onSelected={onSelectedRows}\n        />\n\n        {!loading ? (\n          <TBody>\n            {data.length > 0 ? (\n              getData(data, rowsCount, page, rowsPerPage, pagination).map(\n                item => (\n                  <Row\n                    key={rowKeyExtractor(item)}\n                    rowKeyExtractor={rowKeyExtractor}\n                    handleSelect={handleSelect}\n                    selectable={selectable}\n                    headers={headers}\n                    data={item}\n                    checked={selectedRows?.some(\n                      sel => rowKeyExtractor(sel) === rowKeyExtractor(item)\n                    )}\n                  />\n                )\n              )\n            ) : (\n              <tr>\n                <td colSpan={99}>{emptyPlaceholder}</td>\n              </tr>\n            )}\n          </TBody>\n        ) : (\n          <TBody>\n            {[...Array(rowsPerPage).keys()].map(idx => (\n              <Tr key={`skeleton-${idx}`}>\n                <Td colSpan={99} style={{ padding: 0 }}>\n                  {skeletonComponent ?? (\n                    <Skeleton height={55} radius=\"mili\" animation=\"wave\">\n                      <div style={{ width: '100%' }} />\n                    </Skeleton>\n                  )}\n                </Td>\n              </Tr>\n            ))}\n          </TBody>\n        )}\n\n        {(Number(rowsCount) > 0 || data.length > 0) && (\n          <Footer\n            exportFunction={exportFunction}\n            exportLabel={exportLabel}\n            rowsPerPageLabel={rowsPerPageLabel}\n            rowsPerPage={rowsPerPage}\n            onRowsPerPageChange={onRowsPerPageChange}\n            rowsPerPageOptions={rowsPerPageOptions}\n            rowsCount={rowsCount ?? data.length}\n            page={page}\n            onPageChange={onPageChange}\n            pagination={pagination}\n            exportComponent={exportComponent}\n          />\n        )}\n      </Table>\n    </TableContainer>\n  );\n};\n\nexport default DataGrid;\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"DataGrid.js","sources":["../../../../../src/components/organisms/DataGrid/DataGrid.tsx"],"sourcesContent":["import React from 'react';\nimport {\n  Table,\n  TableToolbar,\n  TableContainer,\n  Tr,\n  Td,\n  TBody,\n} from '../../atoms/Table';\nimport { Header } from './Header';\nimport { Row } from './Row';\nimport { HeadersType } from './types';\nimport { Footer } from './Footer';\nimport { Skeleton } from '../../atoms/Skeleton';\nimport { getData, removeElement } from './utils';\n\nexport interface DataGridProps<Data>\n  extends React.HTMLAttributes<HTMLDivElement> {\n  headers: HeadersType<Data>[];\n  data: Data[];\n  /** Unique identifier for row data */\n  rowKeyExtractor: (data: Data) => string;\n  toolbarRightIcons?: React.ReactNode;\n  toolbarFooter?: React.ReactNode;\n  toolbarTitle: string;\n  /** Enable rows selection */\n  selectable?: boolean;\n  /** Selected items */\n  selectedRows?: Data[];\n  /** Selection handler */\n  onSelectedRows?: (data: Data[] | ((prevState: Data[]) => Data[])) => void;\n  /** Shows pagination controls */\n  pagination?: boolean;\n  /** Results per page */\n  rowsPerPage?: number;\n  /** Results per page handler */\n  onRowsPerPageChange?: (value: number) => void;\n  rowsPerPageOptions?: number[];\n  rowsPerPageLabel?: (value: number) => string;\n  /** Export button label */\n  exportLabel?: string;\n  exportFunction?: () => void;\n  /** Total data elements. Only specify this property if your data is server-side */\n  rowsCount?: number;\n  /** Current page. Always start in 0 */\n  page?: number;\n  /** Current page handler */\n  onPageChange?: (page: number) => void;\n  /** Loading state. The amount of skeleton rows is based on current rowsPerPage */\n  loading?: boolean;\n  /** Custom skeleton component for better visual */\n  skeletonComponent?: React.ReactNode;\n  /** Empty state placeholder */\n  emptyPlaceholder?: React.ReactNode;\n  /** Export component, use if default button with label is not ideal. This prop, not receive \"exportLabel\" and \"exportFunction\" */\n  exportComponent?: React.ReactNode;\n}\n\n/** Note: Consider memoizing functions for a better performance */\nconst DataGrid = <Data,>({\n  headers,\n  data,\n  rowKeyExtractor,\n  toolbarTitle,\n  toolbarFooter,\n  toolbarRightIcons,\n  selectable = false,\n  selectedRows = [],\n  onSelectedRows,\n  pagination = false,\n  rowsPerPage = 10,\n  onRowsPerPageChange,\n  rowsPerPageOptions: _rowsPerPageOptions,\n  rowsPerPageLabel: _rowsPerPageLabel,\n  exportLabel = 'Exportar',\n  exportFunction,\n  rowsCount,\n  page = 0,\n  onPageChange,\n  loading = false,\n  skeletonComponent,\n  emptyPlaceholder,\n  exportComponent,\n  ...rest\n}: DataGridProps<Data>): JSX.Element => {\n  if (selectable && (!selectedRows || !onSelectedRows)) {\n    throw new Error(\n      '[DataGrid] You should specify selection handlers (selectedRows, onSelectedRows)'\n    );\n  }\n\n  const rowsPerPageLabel = React.useCallback(\n    value =>\n      _rowsPerPageLabel\n        ? _rowsPerPageLabel(value)\n        : `Exibir por página: ${value} itens`,\n    [_rowsPerPageLabel]\n  );\n  const rowsPerPageOptions = React.useMemo(\n    () => _rowsPerPageOptions ?? [10, 25, 50],\n    [_rowsPerPageOptions]\n  );\n\n  const handleSelect = React.useCallback(\n    (current, checked) => {\n      if (checked) {\n        onSelectedRows?.(prevState => [...prevState, current]);\n        return;\n      }\n\n      onSelectedRows?.(prevState => {\n        const idx = prevState.findIndex(\n          el => rowKeyExtractor(el) === rowKeyExtractor(current)\n        );\n        return [...removeElement(prevState, idx)];\n      });\n    },\n    [onSelectedRows, rowKeyExtractor]\n  );\n\n  return (\n    <TableContainer {...rest}>\n      <TableToolbar\n        title={toolbarTitle}\n        rightIcons={toolbarRightIcons}\n        footer={toolbarFooter}\n      />\n      <Table>\n        <Header\n          selectable={selectable}\n          headers={headers}\n          data={data}\n          rowsCount={rowsCount ?? data.length}\n          rowKeyExtractor={rowKeyExtractor}\n          selectedRows={selectedRows}\n          onSelected={onSelectedRows}\n        />\n\n        {!loading ? (\n          <TBody>\n            {data.length > 0 ? (\n              getData(data, rowsCount, page, rowsPerPage, pagination).map(\n                item => (\n                  <Row\n                    key={rowKeyExtractor(item)}\n                    rowKeyExtractor={rowKeyExtractor}\n                    handleSelect={handleSelect}\n                    selectable={selectable}\n                    headers={headers}\n                    data={item}\n                    checked={selectedRows?.some(\n                      sel => rowKeyExtractor(sel) === rowKeyExtractor(item)\n                    )}\n                  />\n                )\n              )\n            ) : (\n              <tr>\n                <td colSpan={99}>{emptyPlaceholder}</td>\n              </tr>\n            )}\n          </TBody>\n        ) : (\n          <TBody>\n            {[...Array(rowsPerPage).keys()].map(idx => (\n              <Tr key={`skeleton-${idx}`}>\n                <Td colSpan={99} style={{ padding: 0 }}>\n                  {skeletonComponent ?? (\n                    <Skeleton height={55} radius=\"mili\" animation=\"wave\">\n                      <div style={{ width: '100%' }} />\n                    </Skeleton>\n                  )}\n                </Td>\n              </Tr>\n            ))}\n          </TBody>\n        )}\n\n        {(Number(rowsCount) > 0 || data.length > 0) && (\n          <Footer\n            exportFunction={exportFunction}\n            exportLabel={exportLabel}\n            rowsPerPageLabel={rowsPerPageLabel}\n            rowsPerPage={rowsPerPage}\n            onRowsPerPageChange={onRowsPerPageChange}\n            rowsPerPageOptions={rowsPerPageOptions}\n            rowsCount={rowsCount ?? data.length}\n            page={page}\n            onPageChange={onPageChange}\n            pagination={pagination}\n            exportComponent={exportComponent}\n          />\n        )}\n      </Table>\n    </TableContainer>\n  );\n};\n\nexport default DataGrid;\n"],"names":[],"mappings":"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"}

package/dist/esm/components/organisms/DataGrid/Footer/Footer.js

@@ -51,51 +51,63 @@ const Footer = ({
   );
   const currentInitItem = page * rowsPerPage + 1;
   const currentFinalItem = (page + 1) * rowsPerPage > rowsCount ? rowsCount : (page + 1) * rowsPerPage;
-  return /* @__PURE__ */ React.createElement(TFoot, null, /* @__PURE__ */ React.createElement(Tr, null, /* @__PURE__ */ React.createElement(TdFooterStyled, {
-    colSpan: 99
-  }, /* @__PURE__ */ React.createElement(FooterContainer, null, /* @__PURE__ */ React.createElement(FooterContainerStart, null, pagination && /* @__PURE__ */ React.createElement(SelectContainer, null, /* @__PURE__ */ React.createElement(Select, {
-    options: rowsPerPageOptions,
-    onSelect: handleRowsPerPage,
-    value: rowsPerPage,
-    type: "single",
-    keyExtractor: (value) => String(value),
-    labelExtractor: rowsPerPageLabel,
-    anchor: "top"
-  })), exportComponent && !exportFunction && /* @__PURE__ */ React.createElement(React.Fragment, null, exportComponent), exportFunction && /* @__PURE__ */ React.createElement(HoveredText, null, /* @__PURE__ */ React.createElement(Button, {
-    variant: "outlined",
-    onPress: () => exportFunction()
-  }, /* @__PURE__ */ React.createElement(Text, {
-    fontColor: "orange",
-    fontWeight: "bold"
-  }, exportLabel)))), pagination && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(TextPagination, {
-    fontWeight: "bold",
-    fontColor: "medium"
-  }, `Exibindo ${currentInitItem} a ${currentFinalItem} de ${rowsCount} registros`), /* @__PURE__ */ React.createElement(FooterContainerEnd, null, /* @__PURE__ */ React.createElement(NavigationButton, {
-    onPress: () => onPageChange?.(page - 1),
-    disabled: page === 0
-  }, /* @__PURE__ */ React.createElement(Icon, {
-    name: "chevron-left",
-    type: "material-community",
-    fontColor: "light"
-  })), /* @__PURE__ */ React.createElement(PagesContainer, null, [...Array(Math.ceil(rowsCount / rowsPerPage)).keys()].slice(
+  return /* @__PURE__ */ React.createElement(TFoot, null, /* @__PURE__ */ React.createElement(Tr, null, /* @__PURE__ */ React.createElement(TdFooterStyled, { colSpan: 99 }, /* @__PURE__ */ React.createElement(FooterContainer, null, /* @__PURE__ */ React.createElement(FooterContainerStart, null, pagination && /* @__PURE__ */ React.createElement(SelectContainer, null, /* @__PURE__ */ React.createElement(
+    Select,
+    {
+      options: rowsPerPageOptions,
+      onSelect: handleRowsPerPage,
+      value: rowsPerPage,
+      type: "single",
+      keyExtractor: (value) => String(value),
+      labelExtractor: rowsPerPageLabel,
+      anchor: "top"
+    }
+  )), exportComponent && !exportFunction && /* @__PURE__ */ React.createElement(React.Fragment, null, exportComponent), exportFunction && /* @__PURE__ */ React.createElement(HoveredText, null, /* @__PURE__ */ React.createElement(Button, { variant: "outlined", onPress: () => exportFunction() }, /* @__PURE__ */ React.createElement(Text, { fontColor: "orange", fontWeight: "bold" }, exportLabel)))), pagination && /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
+    TextPagination,
+    {
+      fontWeight: "bold",
+      fontColor: "medium"
+    },
+    `Exibindo ${currentInitItem} a ${currentFinalItem} de ${rowsCount} registros`
+  ), /* @__PURE__ */ React.createElement(FooterContainerEnd, null, /* @__PURE__ */ React.createElement(
+    NavigationButton,
+    {
+      onPress: () => onPageChange?.(page - 1),
+      disabled: page === 0
+    },
+    /* @__PURE__ */ React.createElement(
+      Icon,
+      {
+        name: "chevron-left",
+        type: "material-community",
+        fontColor: "light"
+      }
+    )
+  ), /* @__PURE__ */ React.createElement(PagesContainer, null, [...Array(Math.ceil(rowsCount / rowsPerPage)).keys()].slice(
     getPaginationSlice().start,
     getPaginationSlice().end
-  ).map((value) => /* @__PURE__ */ React.createElement(HoveredText, {
-    key: `page-${value}`
-  }, /* @__PURE__ */ React.createElement(PageButton, {
-    variant: page === value ? "outlined" : "text",
-    onPress: () => onPageChange?.(value)
-  }, /* @__PURE__ */ React.createElement(Text, {
-    fontColor: "medium",
-    fontWeight: "bold"
-  }, value + 1))))), /* @__PURE__ */ React.createElement(NavigationButton, {
-    onPress: () => onPageChange?.(page + 1),
-    disabled: page === Math.ceil(rowsCount / rowsPerPage) - 1
-  }, /* @__PURE__ */ React.createElement(Icon, {
-    name: "chevron-right",
-    type: "material-community",
-    fontColor: "light"
-  }))))))));
+  ).map((value) => /* @__PURE__ */ React.createElement(HoveredText, { key: `page-${value}` }, /* @__PURE__ */ React.createElement(
+    PageButton,
+    {
+      variant: page === value ? "outlined" : "text",
+      onPress: () => onPageChange?.(value)
+    },
+    /* @__PURE__ */ React.createElement(Text, { fontColor: "medium", fontWeight: "bold" }, value + 1)
+  )))), /* @__PURE__ */ React.createElement(
+    NavigationButton,
+    {
+      onPress: () => onPageChange?.(page + 1),
+      disabled: page === Math.ceil(rowsCount / rowsPerPage) - 1
+    },
+    /* @__PURE__ */ React.createElement(
+      Icon,
+      {
+        name: "chevron-right",
+        type: "material-community",
+        fontColor: "light"
+      }
+    )
+  )))))));
 };
 var Footer$1 = React.memo(Footer);