@tecsinapse/react-web-kit 1.19.0 → 1.20.0

package/dist/hooks/useClickAwayListener.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/useClickAwayListener.ts"],"names":["useClickAwayListener","ref","setVisible","event","React","useEffect","handleClickOutside","current","contains","target","document","addEventListener","removeEventListener"],"mappings":";;;;;;;AAAA;;;;AAEO,MAAMA,oBAAoB,GAAG,CAClCC,GADkC,EAElCC,UAFkC,EAGlCC,KAA0C,GAAG,WAHX,KAIzB;AACTC,iBAAMC,SAAN,CAAgB,MAAM;AACpB,UAAMC,kBAAkB,GAAGH,KAAK,IAAI;AAClC,UAAIF,GAAG,CAACM,OAAJ,IAAe,CAACN,GAAG,CAACM,OAAJ,CAAYC,QAAZ,CAAqBL,KAAK,CAACM,MAA3B,CAApB,EAAwD;AACtDP,QAAAA,UAAU,CAAC,KAAD,CAAV;AACD;AACF,KAJD;;AAKAQ,IAAAA,QAAQ,CAACC,gBAAT,CAA0BR,KAA1B,EAAiCG,kBAAjC;AACA,WAAO,MAAM;AACXI,MAAAA,QAAQ,CAACE,mBAAT,CAA6BT,KAA7B,EAAoCG,kBAApC;AACD,KAFD;AAGD,GAVD,EAUG,CAACL,GAAD,CAVH;AAWD,CAhBM","sourcesContent":["import React from 'react';\n\nexport const useClickAwayListener = (\n  ref: React.MutableRefObject<any>,\n  setVisible: React.Dispatch<React.SetStateAction<boolean>>,\n  event: 'mouseup' | 'mousedown' | undefined = 'mousedown'\n): void => {\n  React.useEffect(() => {\n    const handleClickOutside = event => {\n      if (ref.current && !ref.current.contains(event.target)) {\n        setVisible(false);\n      }\n    };\n    document.addEventListener(event, handleClickOutside);\n    return () => {\n      document.removeEventListener(event, handleClickOutside);\n    };\n  }, [ref]);\n};\n"],"file":"useClickAwayListener.js"}
+{"version":3,"file":"useClickAwayListener.js","names":["useClickAwayListener","ref","setVisible","event","React","useEffect","handleClickOutside","current","contains","target","document","addEventListener","removeEventListener"],"sources":["../../src/hooks/useClickAwayListener.ts"],"sourcesContent":["import React from 'react';\n\nexport const useClickAwayListener = (\n  ref: React.MutableRefObject<any>,\n  setVisible: React.Dispatch<React.SetStateAction<boolean>>,\n  event: 'mouseup' | 'mousedown' | undefined = 'mousedown'\n): void => {\n  React.useEffect(() => {\n    const handleClickOutside = event => {\n      if (ref.current && !ref.current.contains(event.target)) {\n        setVisible(false);\n      }\n    };\n    document.addEventListener(event, handleClickOutside);\n    return () => {\n      document.removeEventListener(event, handleClickOutside);\n    };\n  }, [ref]);\n};\n"],"mappings":";;;;;;;AAAA;;;;AAEO,MAAMA,oBAAoB,GAAG,CAClCC,GADkC,EAElCC,UAFkC,EAGlCC,KAA0C,GAAG,WAHX,KAIzB;EACTC,cAAA,CAAMC,SAAN,CAAgB,MAAM;IACpB,MAAMC,kBAAkB,GAAGH,KAAK,IAAI;MAClC,IAAIF,GAAG,CAACM,OAAJ,IAAe,CAACN,GAAG,CAACM,OAAJ,CAAYC,QAAZ,CAAqBL,KAAK,CAACM,MAA3B,CAApB,EAAwD;QACtDP,UAAU,CAAC,KAAD,CAAV;MACD;IACF,CAJD;;IAKAQ,QAAQ,CAACC,gBAAT,CAA0BR,KAA1B,EAAiCG,kBAAjC;IACA,OAAO,MAAM;MACXI,QAAQ,CAACE,mBAAT,CAA6BT,KAA7B,EAAoCG,kBAApC;IACD,CAFD;EAGD,CAVD,EAUG,CAACL,GAAD,CAVH;AAWD,CAhBM"}

package/dist/hooks/useWindowSize.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/hooks/useWindowSize.ts"],"names":["useWindowSize","windowSize","setWindowSize","React","useState","width","undefined","height","useEffect","handleResize","window","innerWidth","innerHeight","addEventListener","removeEventListener"],"mappings":";;;;;;;AAAA;;;;AAOO,MAAMA,aAAa,GAAG,MAAkB;AAC7C,QAAM,CAACC,UAAD,EAAaC,aAAb,IAA8BC,eAAMC,QAAN,CAA2B;AAC7DC,IAAAA,KAAK,EAAEC,SADsD;AAE7DC,IAAAA,MAAM,EAAED;AAFqD,GAA3B,CAApC;;AAIAH,iBAAMK,SAAN,CAAgB,MAAM;AACpB,UAAMC,YAAY,GAAG,MAAM;AACzBP,MAAAA,aAAa,CAAC;AACZG,QAAAA,KAAK,EAAEK,MAAM,CAACC,UADF;AAEZJ,QAAAA,MAAM,EAAEG,MAAM,CAACE;AAFH,OAAD,CAAb;AAID,KALD;;AAMAF,IAAAA,MAAM,CAACG,gBAAP,CAAwB,QAAxB,EAAkCJ,YAAlC;AACAA,IAAAA,YAAY;AACZ,WAAO,MAAMC,MAAM,CAACI,mBAAP,CAA2B,QAA3B,EAAqCL,YAArC,CAAb;AACD,GAVD,EAUG,EAVH;;AAWA,SAAOR,UAAP;AACD,CAjBM","sourcesContent":["import React from 'react';\n\ntype WindowSize = {\n  width: number | undefined;\n  height: number | undefined;\n};\n\nexport const useWindowSize = (): WindowSize => {\n  const [windowSize, setWindowSize] = React.useState<WindowSize>({\n    width: undefined,\n    height: undefined,\n  });\n  React.useEffect(() => {\n    const handleResize = () => {\n      setWindowSize({\n        width: window.innerWidth,\n        height: window.innerHeight,\n      });\n    };\n    window.addEventListener('resize', handleResize);\n    handleResize();\n    return () => window.removeEventListener('resize', handleResize);\n  }, []);\n  return windowSize;\n};\n"],"file":"useWindowSize.js"}
+{"version":3,"file":"useWindowSize.js","names":["useWindowSize","windowSize","setWindowSize","React","useState","width","undefined","height","useEffect","handleResize","window","innerWidth","innerHeight","addEventListener","removeEventListener"],"sources":["../../src/hooks/useWindowSize.ts"],"sourcesContent":["import React from 'react';\n\ntype WindowSize = {\n  width: number | undefined;\n  height: number | undefined;\n};\n\nexport const useWindowSize = (): WindowSize => {\n  const [windowSize, setWindowSize] = React.useState<WindowSize>({\n    width: undefined,\n    height: undefined,\n  });\n  React.useEffect(() => {\n    const handleResize = () => {\n      setWindowSize({\n        width: window.innerWidth,\n        height: window.innerHeight,\n      });\n    };\n    window.addEventListener('resize', handleResize);\n    handleResize();\n    return () => window.removeEventListener('resize', handleResize);\n  }, []);\n  return windowSize;\n};\n"],"mappings":";;;;;;;AAAA;;;;AAOO,MAAMA,aAAa,GAAG,MAAkB;EAC7C,MAAM,CAACC,UAAD,EAAaC,aAAb,IAA8BC,cAAA,CAAMC,QAAN,CAA2B;IAC7DC,KAAK,EAAEC,SADsD;IAE7DC,MAAM,EAAED;EAFqD,CAA3B,CAApC;;EAIAH,cAAA,CAAMK,SAAN,CAAgB,MAAM;IACpB,MAAMC,YAAY,GAAG,MAAM;MACzBP,aAAa,CAAC;QACZG,KAAK,EAAEK,MAAM,CAACC,UADF;QAEZJ,MAAM,EAAEG,MAAM,CAACE;MAFH,CAAD,CAAb;IAID,CALD;;IAMAF,MAAM,CAACG,gBAAP,CAAwB,QAAxB,EAAkCJ,YAAlC;IACAA,YAAY;IACZ,OAAO,MAAMC,MAAM,CAACI,mBAAP,CAA2B,QAA3B,EAAqCL,YAArC,CAAb;EACD,CAVD,EAUG,EAVH;;EAWA,OAAOR,UAAP;AACD,CAjBM"}

package/dist/index.js

@@ -67,292 +67,292 @@ Object.defineProperty(exports, "AccordionProps", {
     return _Accordion.AccordionProps;
   }
 });
-Object.defineProperty(exports, "BadgeWebProps", {
+Object.defineProperty(exports, "Badge", {
   enumerable: true,
   get: function () {
-    return _Badge.BadgeWebProps;
+    return _Badge.default;
   }
 });
-Object.defineProperty(exports, "Badge", {
+Object.defineProperty(exports, "BadgeWebProps", {
   enumerable: true,
   get: function () {
-    return _Badge.default;
+    return _Badge.BadgeWebProps;
   }
 });
-Object.defineProperty(exports, "Button", {
+Object.defineProperty(exports, "BreadcrumbType", {
   enumerable: true,
   get: function () {
-    return _Button.Button;
+    return _Breadcrumbs.BreadcrumbType;
   }
 });
-Object.defineProperty(exports, "useMouseHover", {
+Object.defineProperty(exports, "Breadcrumbs", {
   enumerable: true,
   get: function () {
-    return _Button.useMouseHover;
+    return _Breadcrumbs.Breadcrumbs;
   }
 });
-Object.defineProperty(exports, "WebButtonProps", {
+Object.defineProperty(exports, "BreadcrumbsProps", {
   enumerable: true,
   get: function () {
-    return _Button.WebButtonProps;
+    return _Breadcrumbs.BreadcrumbsProps;
   }
 });
-Object.defineProperty(exports, "Input", {
+Object.defineProperty(exports, "Button", {
   enumerable: true,
   get: function () {
-    return _Input.Input;
+    return _Button.Button;
   }
 });
-Object.defineProperty(exports, "InputWebProps", {
+Object.defineProperty(exports, "DataGrid", {
   enumerable: true,
   get: function () {
-    return _Input.InputWebProps;
+    return _DataGrid.DataGrid;
   }
 });
-Object.defineProperty(exports, "InputMask", {
+Object.defineProperty(exports, "DataGridProps", {
   enumerable: true,
   get: function () {
-    return _InputMask.InputMask;
+    return _DataGrid.DataGridProps;
   }
 });
-Object.defineProperty(exports, "InputMaskWebProps", {
+Object.defineProperty(exports, "DatePicker", {
   enumerable: true,
   get: function () {
-    return _InputMask.InputMaskWebProps;
+    return _DatePicker.DatePicker;
   }
 });
-Object.defineProperty(exports, "Modal", {
+Object.defineProperty(exports, "DateTimePicker", {
   enumerable: true,
   get: function () {
-    return _Modal.Modal;
+    return _DateTimePicker.DateTimePicker;
   }
 });
-Object.defineProperty(exports, "ModalProps", {
+Object.defineProperty(exports, "Drawer", {
   enumerable: true,
   get: function () {
-    return _Modal.ModalProps;
+    return _Drawer.Drawer;
   }
 });
-Object.defineProperty(exports, "Skeleton", {
+Object.defineProperty(exports, "DrawerProps", {
   enumerable: true,
   get: function () {
-    return _Skeleton.Skeleton;
+    return _Drawer.DrawerProps;
   }
 });
-Object.defineProperty(exports, "SkeletonProps", {
+Object.defineProperty(exports, "Grid", {
   enumerable: true,
   get: function () {
-    return _Skeleton.SkeletonProps;
+    return _Grid.Grid;
   }
 });
-Object.defineProperty(exports, "Tag", {
+Object.defineProperty(exports, "GridItem", {
   enumerable: true,
   get: function () {
-    return _Tag.Tag;
+    return _Grid.GridItem;
   }
 });
-Object.defineProperty(exports, "TagProps", {
+Object.defineProperty(exports, "HeadersType", {
   enumerable: true,
   get: function () {
-    return _Tag.TagProps;
+    return _DataGrid.HeadersType;
   }
 });
-Object.defineProperty(exports, "ITooltip", {
+Object.defineProperty(exports, "IGridItemWeb", {
   enumerable: true,
   get: function () {
-    return _Tooltip.ITooltip;
+    return _Grid.IGridItemWeb;
   }
 });
-Object.defineProperty(exports, "Tooltip", {
+Object.defineProperty(exports, "IGridWeb", {
   enumerable: true,
   get: function () {
-    return _Tooltip.Tooltip;
+    return _Grid.IGridWeb;
   }
 });
-Object.defineProperty(exports, "Breadcrumbs", {
+Object.defineProperty(exports, "ITooltip", {
   enumerable: true,
   get: function () {
-    return _Breadcrumbs.Breadcrumbs;
+    return _Tooltip.ITooltip;
   }
 });
-Object.defineProperty(exports, "BreadcrumbsProps", {
+Object.defineProperty(exports, "Input", {
   enumerable: true,
   get: function () {
-    return _Breadcrumbs.BreadcrumbsProps;
+    return _Input.Input;
   }
 });
-Object.defineProperty(exports, "BreadcrumbType", {
+Object.defineProperty(exports, "InputMask", {
   enumerable: true,
   get: function () {
-    return _Breadcrumbs.BreadcrumbType;
+    return _InputMask.InputMask;
   }
 });
-Object.defineProperty(exports, "DatePicker", {
+Object.defineProperty(exports, "InputMaskWebProps", {
   enumerable: true,
   get: function () {
-    return _DatePicker.DatePicker;
+    return _InputMask.InputMaskWebProps;
   }
 });
-Object.defineProperty(exports, "WebDatePickerProps", {
+Object.defineProperty(exports, "InputPassword", {
   enumerable: true,
   get: function () {
-    return _DatePicker.WebDatePickerProps;
+    return _InputPassword.InputPassword;
   }
 });
-Object.defineProperty(exports, "DateTimePicker", {
+Object.defineProperty(exports, "InputPasswordWebProps", {
   enumerable: true,
   get: function () {
-    return _DateTimePicker.DateTimePicker;
+    return _InputPassword.InputPasswordWebProps;
   }
 });
-Object.defineProperty(exports, "WebDateTimePickerProps", {
+Object.defineProperty(exports, "InputWebProps", {
   enumerable: true,
   get: function () {
-    return _DateTimePicker.WebDateTimePickerProps;
+    return _Input.InputWebProps;
   }
 });
-Object.defineProperty(exports, "Drawer", {
+Object.defineProperty(exports, "LabeledSwitch", {
   enumerable: true,
   get: function () {
-    return _Drawer.Drawer;
+    return _LabeledSwitch.LabeledSwitch;
   }
 });
-Object.defineProperty(exports, "DrawerProps", {
+Object.defineProperty(exports, "LabeledSwitchWebProps", {
   enumerable: true,
   get: function () {
-    return _Drawer.DrawerProps;
+    return _LabeledSwitch.LabeledSwitchWebProps;
   }
 });
-Object.defineProperty(exports, "Grid", {
+Object.defineProperty(exports, "Menubar", {
   enumerable: true,
   get: function () {
-    return _Grid.Grid;
+    return _Menubar.Menubar;
   }
 });
-Object.defineProperty(exports, "GridItem", {
+Object.defineProperty(exports, "MenubarItemsOptions", {
   enumerable: true,
   get: function () {
-    return _Grid.GridItem;
+    return _Menubar.MenubarItemsOptions;
   }
 });
-Object.defineProperty(exports, "IGridWeb", {
+Object.defineProperty(exports, "MenubarMostUsedType", {
   enumerable: true,
   get: function () {
-    return _Grid.IGridWeb;
+    return _Menubar.MenubarMostUsedType;
   }
 });
-Object.defineProperty(exports, "IGridItemWeb", {
+Object.defineProperty(exports, "MenubarOptionsType", {
   enumerable: true,
   get: function () {
-    return _Grid.IGridItemWeb;
+    return _Menubar.MenubarOptionsType;
   }
 });
-Object.defineProperty(exports, "InputPassword", {
+Object.defineProperty(exports, "MenubarProps", {
   enumerable: true,
   get: function () {
-    return _InputPassword.InputPassword;
+    return _Menubar.MenubarProps;
   }
 });
-Object.defineProperty(exports, "InputPasswordWebProps", {
+Object.defineProperty(exports, "Modal", {
   enumerable: true,
   get: function () {
-    return _InputPassword.InputPasswordWebProps;
+    return _Modal.Modal;
   }
 });
-Object.defineProperty(exports, "LabeledSwitch", {
+Object.defineProperty(exports, "ModalProps", {
   enumerable: true,
   get: function () {
-    return _LabeledSwitch.LabeledSwitch;
+    return _Modal.ModalProps;
   }
 });
-Object.defineProperty(exports, "LabeledSwitchWebProps", {
+Object.defineProperty(exports, "Select", {
   enumerable: true,
   get: function () {
-    return _LabeledSwitch.LabeledSwitchWebProps;
+    return _Select.Select;
   }
 });
-Object.defineProperty(exports, "Menubar", {
+Object.defineProperty(exports, "SelectProps", {
   enumerable: true,
   get: function () {
-    return _Menubar.Menubar;
+    return _Select.SelectProps;
   }
 });
-Object.defineProperty(exports, "MenubarItemsOptions", {
+Object.defineProperty(exports, "Skeleton", {
   enumerable: true,
   get: function () {
-    return _Menubar.MenubarItemsOptions;
+    return _Skeleton.Skeleton;
   }
 });
-Object.defineProperty(exports, "MenubarMostUsedType", {
+Object.defineProperty(exports, "SkeletonProps", {
   enumerable: true,
   get: function () {
-    return _Menubar.MenubarMostUsedType;
+    return _Skeleton.SkeletonProps;
   }
 });
-Object.defineProperty(exports, "MenubarOptionsType", {
+Object.defineProperty(exports, "Snackbar", {
   enumerable: true,
   get: function () {
-    return _Menubar.MenubarOptionsType;
+    return _Snackbar.Snackbar;
   }
 });
-Object.defineProperty(exports, "MenubarProps", {
+Object.defineProperty(exports, "SnackbarWebProps", {
   enumerable: true,
   get: function () {
-    return _Menubar.MenubarProps;
+    return _Snackbar.SnackbarWebProps;
   }
 });
-Object.defineProperty(exports, "Select", {
+Object.defineProperty(exports, "Tag", {
   enumerable: true,
   get: function () {
-    return _Select.Select;
+    return _Tag.Tag;
   }
 });
-Object.defineProperty(exports, "SelectProps", {
+Object.defineProperty(exports, "TagProps", {
   enumerable: true,
   get: function () {
-    return _Select.SelectProps;
+    return _Tag.TagProps;
   }
 });
-Object.defineProperty(exports, "Snackbar", {
+Object.defineProperty(exports, "TextArea", {
   enumerable: true,
   get: function () {
-    return _Snackbar.Snackbar;
+    return _TextArea.TextArea;
   }
 });
-Object.defineProperty(exports, "SnackbarWebProps", {
+Object.defineProperty(exports, "TextAreaProps", {
   enumerable: true,
   get: function () {
-    return _Snackbar.SnackbarWebProps;
+    return _TextArea.TextAreaProps;
   }
 });
-Object.defineProperty(exports, "TextArea", {
+Object.defineProperty(exports, "Tooltip", {
   enumerable: true,
   get: function () {
-    return _TextArea.TextArea;
+    return _Tooltip.Tooltip;
   }
 });
-Object.defineProperty(exports, "TextAreaProps", {
+Object.defineProperty(exports, "WebButtonProps", {
   enumerable: true,
   get: function () {
-    return _TextArea.TextAreaProps;
+    return _Button.WebButtonProps;
   }
 });
-Object.defineProperty(exports, "DataGrid", {
+Object.defineProperty(exports, "WebDatePickerProps", {
   enumerable: true,
   get: function () {
-    return _DataGrid.DataGrid;
+    return _DatePicker.WebDatePickerProps;
   }
 });
-Object.defineProperty(exports, "DataGridProps", {
+Object.defineProperty(exports, "WebDateTimePickerProps", {
   enumerable: true,
   get: function () {
-    return _DataGrid.DataGridProps;
+    return _DateTimePicker.WebDateTimePickerProps;
   }
 });
-Object.defineProperty(exports, "HeadersType", {
+Object.defineProperty(exports, "useMouseHover", {
   enumerable: true,
   get: function () {
-    return _DataGrid.HeadersType;
+    return _Button.useMouseHover;
   }
 });
 

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;;AACA;;AACA;;AAIA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AAIA;;AAIA;;AACA;;AAMA;;AAIA;;AAIA;;AAOA;;AACA;;AACA;;AACA;;AAKA;;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA","sourcesContent":["export * from '@tecsinapse/react-core';\nexport { Accordion, AccordionProps } from './components/atoms/Accordion';\nexport {\n  BadgeWebProps,\n  default as Badge,\n} from './components/atoms/Badge/Badge';\nexport {\n  Button,\n  useMouseHover,\n  WebButtonProps,\n} from './components/atoms/Button';\nexport { Input, InputWebProps } from './components/atoms/Input';\nexport { InputMask, InputMaskWebProps } from './components/atoms/InputMask';\nexport { Modal, ModalProps } from './components/atoms/Modal';\nexport { Skeleton, SkeletonProps } from './components/atoms/Skeleton';\nexport { Tag, TagProps } from './components/atoms/Tag';\nexport { ITooltip, Tooltip } from './components/atoms/Tooltip';\nexport {\n  Breadcrumbs,\n  BreadcrumbsProps,\n  BreadcrumbType,\n} from './components/molecules/Breadcrumbs';\nexport {\n  DatePicker,\n  WebDatePickerProps,\n} from './components/molecules/DatePicker';\nexport {\n  DateTimePicker,\n  WebDateTimePickerProps,\n} from './components/molecules/DateTimePicker';\nexport { Drawer, DrawerProps } from './components/molecules/Drawer';\nexport {\n  Grid,\n  GridItem,\n  IGridWeb,\n  IGridItemWeb,\n} from './components/molecules/Grid';\nexport {\n  InputPassword,\n  InputPasswordWebProps,\n} from './components/molecules/InputPassword';\nexport {\n  LabeledSwitch,\n  LabeledSwitchWebProps,\n} from './components/molecules/LabeledSwitch';\nexport {\n  Menubar,\n  MenubarItemsOptions,\n  MenubarMostUsedType,\n  MenubarOptionsType,\n  MenubarProps,\n} from './components/molecules/Menubar';\nexport { Select, SelectProps } from './components/molecules/Select';\nexport { Snackbar, SnackbarWebProps } from './components/molecules/Snackbar';\nexport { TextArea, TextAreaProps } from './components/molecules/TextArea';\nexport {\n  DataGrid,\n  DataGridProps,\n  HeadersType,\n} from './components/organisms/DataGrid';\nexport * from './hooks';\n"],"file":"index.js"}
+{"version":3,"file":"index.js","names":[],"sources":["../src/index.ts"],"sourcesContent":["export * from '@tecsinapse/react-core';\nexport { Accordion, AccordionProps } from './components/atoms/Accordion';\nexport {\n  BadgeWebProps,\n  default as Badge,\n} from './components/atoms/Badge/Badge';\nexport {\n  Button,\n  useMouseHover,\n  WebButtonProps,\n} from './components/atoms/Button';\nexport { Input, InputWebProps } from './components/atoms/Input';\nexport { InputMask, InputMaskWebProps } from './components/atoms/InputMask';\nexport { Modal, ModalProps } from './components/atoms/Modal';\nexport { Skeleton, SkeletonProps } from './components/atoms/Skeleton';\nexport { Tag, TagProps } from './components/atoms/Tag';\nexport { ITooltip, Tooltip } from './components/atoms/Tooltip';\nexport {\n  Breadcrumbs,\n  BreadcrumbsProps,\n  BreadcrumbType,\n} from './components/molecules/Breadcrumbs';\nexport {\n  DatePicker,\n  WebDatePickerProps,\n} from './components/molecules/DatePicker';\nexport {\n  DateTimePicker,\n  WebDateTimePickerProps,\n} from './components/molecules/DateTimePicker';\nexport { Drawer, DrawerProps } from './components/molecules/Drawer';\nexport {\n  Grid,\n  GridItem,\n  IGridWeb,\n  IGridItemWeb,\n} from './components/molecules/Grid';\nexport {\n  InputPassword,\n  InputPasswordWebProps,\n} from './components/molecules/InputPassword';\nexport {\n  LabeledSwitch,\n  LabeledSwitchWebProps,\n} from './components/molecules/LabeledSwitch';\nexport {\n  Menubar,\n  MenubarItemsOptions,\n  MenubarMostUsedType,\n  MenubarOptionsType,\n  MenubarProps,\n} from './components/molecules/Menubar';\nexport { Select, SelectProps } from './components/molecules/Select';\nexport { Snackbar, SnackbarWebProps } from './components/molecules/Snackbar';\nexport { TextArea, TextAreaProps } from './components/molecules/TextArea';\nexport {\n  DataGrid,\n  DataGridProps,\n  HeadersType,\n} from './components/organisms/DataGrid';\nexport * from './hooks';\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA;;AACA;;AACA;;AAIA;;AAKA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AAKA;;AAIA;;AAIA;;AACA;;AAMA;;AAIA;;AAIA;;AAOA;;AACA;;AACA;;AACA;;AAKA;;AAAA;EAAA;EAAA;EAAA;EAAA;IAAA;IAAA;MAAA;IAAA;EAAA;AAAA"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tecsinapse/react-web-kit",
   "description": "TecSinapse React components",
-  "version": "1.19.0",
+  "version": "1.20.0",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "license": "MIT",
@@ -17,7 +17,7 @@
     "@emotion/native": "^11.10.0",
     "@emotion/react": "^11.10.0",
     "@emotion/styled": "^11.10.0",
-    "@tecsinapse/react-core": "^1.18.0",
+    "@tecsinapse/react-core": "^1.19.0",
     "@types/react-native": "^0.64.4",
     "react-native-vector-icons": "^9.2.0",
     "react-transition-group": "^4.4.2"
@@ -36,5 +36,5 @@
     "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0",
     "react-native-web": "^0.17.1 || ^0.18.0"
   },
-  "gitHead": "7014df32d2de88a1f42259b56599d7fc10d794a9"
+  "gitHead": "59f85f1085ace4af0b26b85e32faf92cd2bf303f"
 }

package/src/components/atoms/Input/Input.tsx

@@ -6,12 +6,11 @@ import {
   useInputFocus,
 } from '@tecsinapse/react-core';
 import React, { FC } from 'react';
-import { View } from 'react-native';
+import { TextInput, View } from 'react-native';
 import { StyledWebTextInput } from './styled';
 
-export interface InputWebProps
-  extends Omit<InputElementProps, 'style'>,
-    InputContainerProps {}
+export type InputWebProps = Omit<InputElementProps, 'style'> &
+  InputContainerProps & { ref?: React.Ref<HTMLInputElement | undefined> };
 
 const Input: FC<InputWebProps> = React.forwardRef(
   (
@@ -73,7 +72,7 @@ const Input: FC<InputWebProps> = React.forwardRef(
             {...rest}
             placeholder={onlyLabel ? label : placeholder}
             value={value}
-            ref={ref}
+            ref={ref as React.Ref<TextInput>}
             disabled={disabled}
             onFocus={handleFocus}
             onBlur={handleBlur}

package/src/components/atoms/InputMask/InputMask.tsx

@@ -6,12 +6,11 @@ import {
   useInputFocus,
 } from '@tecsinapse/react-core';
 import React, { FC } from 'react';
-import { View } from 'react-native';
+import { TextInput, View } from 'react-native';
 import { StyledWebTextInputMask } from './styled';
 
-export interface InputMaskWebProps
-  extends Omit<InputMaskElementProps, 'style'>,
-    InputContainerProps {}
+export type InputMaskWebProps = Omit<InputMaskElementProps, 'style'> &
+  InputContainerProps & { ref?: React.Ref<HTMLInputElement | undefined> };
 
 const InputMask: FC<InputMaskWebProps> = React.forwardRef(
   (
@@ -73,7 +72,7 @@ const InputMask: FC<InputMaskWebProps> = React.forwardRef(
             {...rest}
             placeholder={onlyLabel ? label : placeholder}
             value={value}
-            ref={ref}
+            ref={ref as React.Ref<TextInput>}
             disabled={disabled}
             onFocus={handleFocus}
             onBlur={handleBlur}

package/src/components/molecules/DatePicker/Modal.tsx

@@ -1,9 +1,17 @@
-import { CalendarProps, PressableSurface, SelectionType } from '@tecsinapse/react-core';
+import {
+  CalendarProps,
+  PressableSurface,
+  SelectionType,
+} from '@tecsinapse/react-core';
 import * as React from 'react';
 import { Modal as RNModal, ModalProps } from 'react-native';
 import { Backdrop, ModalContent } from './styled';
 
-const Component = <T extends SelectionType>({ onRequestClose, children, ...modalProps }: CalendarProps<T> & ModalProps & { children: JSX.Element }): JSX.Element => {
+const Component = <T extends SelectionType>({
+  onRequestClose,
+  children,
+  ...modalProps
+}: CalendarProps<T> & ModalProps & { children: JSX.Element }): JSX.Element => {
   return (
     <RNModal
       transparent
@@ -14,9 +22,7 @@ const Component = <T extends SelectionType>({ onRequestClose, children, ...modal
     >
       <Backdrop onPress={onRequestClose} effect="none">
         <PressableSurface>
-          <ModalContent>
-            {children}
-          </ModalContent>
+          <ModalContent>{children}</ModalContent>
         </PressableSurface>
       </Backdrop>
     </RNModal>

package/src/components/molecules/DatePicker/index.ts

@@ -1 +1 @@
-export { DatePicker, WebDatePickerProps } from './DatePicker';
+export { DatePicker, WebDatePickerProps } from './DatePicker';

package/src/components/molecules/DatePicker/styled.ts

@@ -1,6 +1,6 @@
-import styled, { css } from "@emotion/native";
-import { hex2rgba, PressableSurface, StyleProps } from "@tecsinapse/react-core";
-import { Platform } from "react-native";
+import styled, { css } from '@emotion/native';
+import { hex2rgba, PressableSurface, StyleProps } from '@tecsinapse/react-core';
+import { Platform } from 'react-native';
 
 const isWeb = Platform.OS === 'web';
 

package/src/components/molecules/DateTimePicker/Modal.tsx

@@ -5,11 +5,9 @@ import { Backdrop, ModalContent } from './styled';
 
 const Component: React.FC<DateTimeSelectorProps & ModalProps> = ({
   onRequestClose,
-  onChange,
   children,
   ...rest
 }) => {
-
   return (
     <RNModal
       transparent
@@ -19,9 +17,7 @@ const Component: React.FC<DateTimeSelectorProps & ModalProps> = ({
       onRequestClose={onRequestClose}
     >
       <Backdrop onPress={onRequestClose} effect="none">
-        <ModalContent>
-          {children}
-        </ModalContent>
+        <ModalContent>{children}</ModalContent>
       </Backdrop>
     </RNModal>
   );

package/src/components/molecules/DateTimePicker/styled.ts

@@ -1,7 +1,10 @@
-import styled, { css } from "@emotion/native";
-import { DateTimeSelectorProps, PressableSurface, RFValueStr, StyleProps } from "@tecsinapse/react-core";
-import { FC } from "react";
-import { Platform } from "react-native";
+import styled, { css } from '@emotion/native';
+import {
+  PressableSurface,
+  RFValueStr,
+  StyleProps,
+} from '@tecsinapse/react-core';
+import { Platform } from 'react-native';
 
 const isWeb = Platform.OS === 'web';
 
@@ -34,4 +37,4 @@ export const ModalContent = styled.View<Partial<StyleProps>>`
     `}
   `}
   overflow: hidden;
-`;
+`;

package/src/components/molecules/Grid/Item/functions.ts

@@ -6,8 +6,8 @@ export const getSpan = (
   md: boolean,
   lg: boolean
 ): number => {
-  if (sm) return value.sm;
-  if (md) return value.md ?? value.sm;
-  if (lg) return value.lg ?? value.md ?? value.sm;
+  if (sm) return value?.sm;
+  if (md) return value?.md ?? value?.sm;
+  if (lg) return value?.lg ?? value?.md ?? value?.sm;
   return 0;
 };

package/src/components/molecules/IconTextButton/IconTextButton.tsx

@@ -17,9 +17,8 @@ const IconTextButton: React.FC<WebIconTextButtonProps> = ({
   size = 'default',
   ...rest
 }): JSX.Element => {
-  const { handleHover, handlePressed, defaultFontColor } = useIconTextButton(
-    variant
-  );
+  const { handleHover, handlePressed, defaultFontColor } =
+    useIconTextButton(variant);
 
   return (
     <StyledIconTextButton

package/src/components/molecules/Menubar/Menubar.tsx

@@ -52,9 +52,10 @@ const Menubar: React.FC<MenubarProps> = ({
   const menuRef = useRef<HTMLDivElement | null>(null);
   useClickAwayListener(menuRef, setOpen, 'mouseup');
 
-  const toggleOpen = React.useCallback(() => setOpen(state => !state), [
-    setOpen,
-  ]);
+  const toggleOpen = React.useCallback(
+    () => setOpen(state => !state),
+    [setOpen]
+  );
 
   React.useEffect(() => {
     if (search === '') return;

package/src/components/molecules/Menubar/SearchResultItem/utils.tsx

@@ -39,7 +39,7 @@ export const stringMatcher = (
   return Array.from(tx.matchAll(r));
 };
 
-const highlightReplacer = <T extends unknown>(
+const highlightReplacer = <T,>(
   searchTerm: string,
   textToReplace: string,
   Component: React.ElementType,
@@ -66,7 +66,7 @@ const highlightReplacer = <T extends unknown>(
   });
 };
 
-export const highlight = <T extends unknown>(
+export const highlight = <T,>(
   searchTerm: string,
   textToReplace: string,
   Component: React.ElementType,