@tecsinapse/react-web-kit 3.5.1-beta.0 → 3.5.1-beta.1

package/dist/cjs/components/atoms/Dropdown/index.js

@@ -21,7 +21,7 @@ const Component = ({
     {
       style: { ...animations.defaultStyles, ...animations.transition["bottom"][state] },
       ref: refDropDown,
-      children
+      children: React.isValidElement(children) ? children : /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children })
     }
   ) });
 };

package/dist/cjs/components/atoms/Tooltip/Tooltip.js

@@ -11,7 +11,7 @@ const Tooltip = ({
   maxWidht,
   position = "bottom"
 }) => {
-  const spanRef = React.useRef();
+  const spanRef = React.useRef(null);
   const [computed, setComputed] = React.useState(
     void 0
   );
@@ -29,7 +29,9 @@ const Tooltip = ({
         maxWidth: maxWidht,
         computed,
         position,
-        ref: (ref) => spanRef.current = ref,
+        ref: (ref) => {
+          spanRef.current = ref;
+        },
         children: /* @__PURE__ */ jsxRuntime.jsx(
           reactCore.Text,
           {

package/dist/cjs/components/molecules/Grid/Grid.js

@@ -24,16 +24,19 @@ const Grid = ({
           flexWrap: "wrap"
         },
         ...rest,
-        children: React.Children.map(children, (child, index) => /* @__PURE__ */ jsxRuntime.jsx(
-          Item,
-          {
-            columns,
-            span: flatLayout[index],
-            spacing,
-            children: child
-          },
-          `child-${index}`
-        ))
+        children: React.Children.map(children, (child, index) => {
+          const content = React.isValidElement(child) ? child : /* @__PURE__ */ jsxRuntime.jsx(jsxRuntime.Fragment, { children: child });
+          return /* @__PURE__ */ jsxRuntime.jsx(
+            Item,
+            {
+              columns,
+              span: flatLayout[index],
+              spacing,
+              children: content
+            },
+            `child-${index}`
+          );
+        })
       }
     );
   }
@@ -48,12 +51,16 @@ const Grid = ({
       },
       ...rest,
       children: React.Children.map(children, (child, index) => {
-        return React.cloneElement(child, {
-          ...child?.props,
-          columns,
-          spacing: child?.props.spacing ?? spacing,
-          key: `child-${index}`
-        });
+        if (React.isValidElement(child)) {
+          const childEl = child;
+          return React.cloneElement(childEl, {
+            ...childEl.props,
+            columns,
+            spacing: childEl.props?.spacing ?? spacing,
+            key: `child-${index}`
+          });
+        }
+        return child;
       })
     }
   );

package/dist/cjs/components/molecules/Grid/Item/Item.js

@@ -52,10 +52,14 @@ const GridItem = ({
     paddingRight: reactCore.getGridItemPadding("right", _spacing, spacing),
     paddingLeft: reactCore.getGridItemPadding("left", _spacing, spacing)
   };
-  const clone = React.cloneElement(children, {
-    ...children?.props,
-    style: wrapper ? children?.props.style : { ..._style, ...children?.props.style }
-  });
+  let clone = void 0;
+  if (React.isValidElement(children)) {
+    const childEl = children;
+    clone = React.cloneElement(childEl, {
+      ...childEl.props,
+      style: wrapper ? childEl.props?.style : { ..._style, ...childEl.props?.style }
+    });
+  }
   return wrapper ? /* @__PURE__ */ jsxRuntime.jsx("div", { ...rest, style: _style, children: clone }) : clone;
 };
 

package/dist/cjs/components/molecules/Menubar/Menubar.js

@@ -39,7 +39,9 @@ const Menubar = ({
     if (search === "") return;
     setResults(utils.filterAndTransform(options, search));
   }, [search]);
-  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: (ref) => menuRef.current = ref, ...rest, children: [
+  return /* @__PURE__ */ jsxRuntime.jsxs("div", { ref: (ref) => {
+    menuRef.current = ref;
+  }, ...rest, children: [
     /* @__PURE__ */ jsxRuntime.jsxs(styled.StyledMenuBar, { children: [
       /* @__PURE__ */ jsxRuntime.jsx(styled.StyledMenuButton, { variant: "filled", color: "primary", onPress: toggleOpen, children: !open ? /* @__PURE__ */ jsxRuntime.jsx(
         reactCore.Icon,

package/dist/esm/components/atoms/Dropdown/index.js

@@ -1,4 +1,4 @@
-import { jsx } from 'react/jsx-runtime';
+import { jsx, Fragment } from 'react/jsx-runtime';
 import React__default from 'react';
 import { StyledContainerDropdown } from './styled.js';
 import { Transition } from 'react-transition-group';
@@ -19,7 +19,7 @@ const Component = ({
     {
       style: { ...defaultStyles, ...transition["bottom"][state] },
       ref: refDropDown,
-      children
+      children: React__default.isValidElement(children) ? children : /* @__PURE__ */ jsx(Fragment, { children })
     }
   ) });
 };

package/dist/esm/components/atoms/Tooltip/Tooltip.js

@@ -9,7 +9,7 @@ const Tooltip = ({
   maxWidht,
   position = "bottom"
 }) => {
-  const spanRef = React__default.useRef();
+  const spanRef = React__default.useRef(null);
   const [computed, setComputed] = React__default.useState(
     void 0
   );
@@ -27,7 +27,9 @@ const Tooltip = ({
         maxWidth: maxWidht,
         computed,
         position,
-        ref: (ref) => spanRef.current = ref,
+        ref: (ref) => {
+          spanRef.current = ref;
+        },
         children: /* @__PURE__ */ jsx(
           Text,
           {

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

@@ -1,4 +1,4 @@
-import { jsx } from 'react/jsx-runtime';
+import { jsx, Fragment } from 'react/jsx-runtime';
 import React__default from 'react';
 import GridItem from './Item/Item.js';
 
@@ -22,16 +22,19 @@ const Grid = ({
           flexWrap: "wrap"
         },
         ...rest,
-        children: React__default.Children.map(children, (child, index) => /* @__PURE__ */ jsx(
-          GridItem,
-          {
-            columns,
-            span: flatLayout[index],
-            spacing,
-            children: child
-          },
-          `child-${index}`
-        ))
+        children: React__default.Children.map(children, (child, index) => {
+          const content = React__default.isValidElement(child) ? child : /* @__PURE__ */ jsx(Fragment, { children: child });
+          return /* @__PURE__ */ jsx(
+            GridItem,
+            {
+              columns,
+              span: flatLayout[index],
+              spacing,
+              children: content
+            },
+            `child-${index}`
+          );
+        })
       }
     );
   }
@@ -46,12 +49,16 @@ const Grid = ({
       },
       ...rest,
       children: React__default.Children.map(children, (child, index) => {
-        return React__default.cloneElement(child, {
-          ...child?.props,
-          columns,
-          spacing: child?.props.spacing ?? spacing,
-          key: `child-${index}`
-        });
+        if (React__default.isValidElement(child)) {
+          const childEl = child;
+          return React__default.cloneElement(childEl, {
+            ...childEl.props,
+            columns,
+            spacing: childEl.props?.spacing ?? spacing,
+            key: `child-${index}`
+          });
+        }
+        return child;
       })
     }
   );

package/dist/esm/components/molecules/Grid/Item/Item.js

@@ -50,10 +50,14 @@ const GridItem = ({
     paddingRight: getGridItemPadding("right", _spacing, spacing),
     paddingLeft: getGridItemPadding("left", _spacing, spacing)
   };
-  const clone = React__default.cloneElement(children, {
-    ...children?.props,
-    style: wrapper ? children?.props.style : { ..._style, ...children?.props.style }
-  });
+  let clone = void 0;
+  if (React__default.isValidElement(children)) {
+    const childEl = children;
+    clone = React__default.cloneElement(childEl, {
+      ...childEl.props,
+      style: wrapper ? childEl.props?.style : { ..._style, ...childEl.props?.style }
+    });
+  }
   return wrapper ? /* @__PURE__ */ jsx("div", { ...rest, style: _style, children: clone }) : clone;
 };
 

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

@@ -37,7 +37,9 @@ const Menubar = ({
     if (search === "") return;
     setResults(filterAndTransform(options, search));
   }, [search]);
-  return /* @__PURE__ */ jsxs("div", { ref: (ref) => menuRef.current = ref, ...rest, children: [
+  return /* @__PURE__ */ jsxs("div", { ref: (ref) => {
+    menuRef.current = ref;
+  }, ...rest, children: [
     /* @__PURE__ */ jsxs(StyledMenuBar, { children: [
       /* @__PURE__ */ jsx(StyledMenuButton, { variant: "filled", color: "primary", onPress: toggleOpen, children: !open ? /* @__PURE__ */ jsx(
         Icon,

package/dist/types/components/atoms/Accordion/styled.d.ts

@@ -1,16 +1,16 @@
 export declare const IconContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const TitleContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const AccordionContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const ContentContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, JSX.IntrinsicElements, {}>;

package/dist/types/components/atoms/Dropdown/index.d.ts

@@ -5,5 +5,5 @@ export interface DropdownProps {
     onClickAway?: () => void;
 }
 export declare const Dropdown: React.FC<DropdownProps & {
-    children: JSX.Element;
+    children?: React.ReactNode;
 }>;

package/dist/types/components/atoms/Dropdown/styled.d.ts

@@ -1,4 +1,4 @@
 export declare const StyledContainerDropdown: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/atoms/Modal/styled.d.ts

@@ -1,4 +1,4 @@
 export declare const ModalContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/atoms/Overlay/Overlay.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 import { ZIndex } from '@tecsinapse/react-core';
 export interface OverlayProps {
     timeout?: number;
@@ -7,5 +7,5 @@ export interface OverlayProps {
     zIndex: keyof ZIndex;
     children?: ReactNode;
 }
-declare const Overlay: ({ timeout, open, onClose, zIndex, children, }: OverlayProps) => JSX.Element;
+declare const Overlay: ({ timeout, open, onClose, zIndex, children, }: OverlayProps) => React.ReactElement;
 export default Overlay;

package/dist/types/components/atoms/Overlay/styled.d.ts

@@ -6,5 +6,5 @@ type InjectedProps = {
 export declare const StyledOverlay: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps> & InjectedProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps> & InjectedProps, JSX.IntrinsicElements, {}>;
 export {};

package/dist/types/components/atoms/Skeleton/styled.d.ts

@@ -2,4 +2,4 @@ import { SkeletonProps } from './Skeleton';
 export declare const Wrapper: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps & SkeletonProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps & SkeletonProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/atoms/Switch/styled.d.ts

@@ -1,8 +1,8 @@
 export declare const StyledSwitchContent: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledSwitch: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/atoms/Table/Cell/styled.d.ts

@@ -1,4 +1,4 @@
 export declare const TCell: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").TdHTMLAttributes<HTMLTableDataCellElement>, HTMLTableDataCellElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/atoms/Table/Container/styled.d.ts

@@ -1,4 +1,4 @@
 export declare const TContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/atoms/Table/Footer/styled.d.ts

@@ -1,4 +1,4 @@
 export declare const TFooter: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, {}>;
+}, JSX.IntrinsicElements, {}>;

package/dist/types/components/atoms/Table/Header/styled.d.ts

@@ -1,12 +1,12 @@
 export declare const ThStyled: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const THeadStyled: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const HeaderBackground: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLHRElement>, HTMLHRElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/atoms/Table/Row/styled.d.ts

@@ -1,4 +1,4 @@
 export declare const TRow: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/atoms/Table/Toolbar/styled.d.ts

@@ -1,4 +1,4 @@
 export declare const TableToolbarStyled: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, JSX.IntrinsicElements, {}>;

package/dist/types/components/atoms/Table/styled.d.ts

@@ -1,4 +1,4 @@
 export declare const TableStyled: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/atoms/Tooltip/styled.d.ts

@@ -7,11 +7,11 @@ type InjectedProps = {
 export declare const TooltipSpan: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps> & InjectedProps, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps> & InjectedProps, JSX.IntrinsicElements, {}>;
 export declare const Container: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & {
     position?: Position;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, JSX.IntrinsicElements, {}>;
 export {};

package/dist/types/components/molecules/Breadcrumbs/BreadcrumbItem/styled.d.ts

@@ -1,8 +1,8 @@
 export declare const StyledContainerItem: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledContainerIcon: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/molecules/Breadcrumbs/styled.d.ts

@@ -1,4 +1,4 @@
 export declare const StyledContainerBreadcrumbs: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/molecules/DatePicker/DatePicker.d.ts

@@ -1,6 +1,7 @@
 import { DatePickerProps, SelectionType } from '@tecsinapse/react-core';
+import React from 'react';
 export type WebDatePickerProps<T extends SelectionType> = Omit<DatePickerProps<T>, 'CalendarComponent' | 'renderCalendar' | 'requestCloseCalendar' | 'requestShowCalendar'> & {
     callbackAfterValidated?: (valid: boolean, message?: string) => void;
     invalidDateLabel?: string;
 };
-export declare const DatePicker: <T extends SelectionType>({ value, type, locale, onChange, callbackAfterValidated, placeholder, disabled, label, invalidDateLabel, ...rest }: WebDatePickerProps<T>) => JSX.Element;
+export declare const DatePicker: <T extends SelectionType>({ value, type, locale, onChange, callbackAfterValidated, placeholder, disabled, label, invalidDateLabel, ...rest }: WebDatePickerProps<T>) => React.ReactElement;

package/dist/types/components/molecules/DatePicker/Modal.d.ts

@@ -1,5 +1,6 @@
 import { CalendarProps, SelectionType } from '@tecsinapse/react-core';
+import * as React from 'react';
 import { ModalProps } from 'react-native';
 export declare const Modal: <T extends SelectionType>({ onRequestClose, children, ...modalProps }: CalendarProps<T> & ModalProps & {
-    children: JSX.Element;
-}) => JSX.Element;
+    children: React.ReactElement | React.ReactNode;
+}) => React.ReactElement;

package/dist/types/components/molecules/DateTimePickerSelector/components/MemoizedTimeCard.d.ts

@@ -6,5 +6,5 @@ interface MemoizedTimeCardProps {
     onPress: () => void;
     TextComponent: React.FC<TextProps>;
 }
-declare const MemoizedTimeCard: React.MemoExoticComponent<({ time, isSelected, onPress, TextComponent, }: MemoizedTimeCardProps) => JSX.Element>;
+declare const MemoizedTimeCard: React.MemoExoticComponent<({ time, isSelected, onPress, TextComponent, }: MemoizedTimeCardProps) => React.ReactElement>;
 export default MemoizedTimeCard;

package/dist/types/components/molecules/Drawer/styled.d.ts

@@ -2,4 +2,4 @@ import { DrawerProps } from './Drawer';
 export declare const StyledContainerDrawer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & DrawerProps & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & DrawerProps & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/molecules/Grid/Grid.d.ts

@@ -1,5 +1,5 @@
 import React from 'react';
 import { IGrid } from '@tecsinapse/react-core';
 export type IGridWeb = IGrid & Omit<React.HTMLAttributes<HTMLDivElement>, 'children'>;
-declare const Grid: ({ children, columns, layout, style, spacing, ...rest }: IGridWeb) => JSX.Element;
+declare const Grid: ({ children, columns, layout, style, spacing, ...rest }: IGridWeb) => React.ReactElement;
 export default Grid;

package/dist/types/components/molecules/Grid/Item/Item.d.ts

@@ -5,5 +5,5 @@ export interface IGridItemWeb extends Omit<IGridItem, 'span'>, Omit<React.HTMLAt
     span: number | Span;
     flexBasis?: string | 'content' | 'auto' | 'max-content' | 'min-content' | 'fit-content';
 }
-declare const GridItem: ({ children, span: _span, columns, loadingComponent, loading, spacing: _spacing, wrapper, alignContent, alignItems, alignSelf, flex, flexDirection, flexGrow, flexShrink, justifyContent, flexBasis, style, ...rest }: IGridItemWeb) => JSX.Element;
+declare const GridItem: ({ children, span: _span, columns, loadingComponent, loading, spacing: _spacing, wrapper, alignContent, alignItems, alignSelf, flex, flexDirection, flexGrow, flexShrink, justifyContent, flexBasis, style, ...rest }: IGridItemWeb) => React.ReactElement;
 export default GridItem;

package/dist/types/components/molecules/LabeledSwitch/styled.d.ts

@@ -2,7 +2,7 @@ import { LabelPositionOptions } from '@tecsinapse/react-core';
 export declare const StyledDiv: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, JSX.IntrinsicElements, {}>;
 export declare const StyledLabel: import("@emotion/native").StyledComponent<import("@tecsinapse/react-core").TextProps & {
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;

package/dist/types/components/molecules/Masonry/Masonry.d.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from 'react';
+import React, { ReactNode } from 'react';
 import { SpacingType } from '@tecsinapse/react-core';
 export interface MasonryProps {
     columns: number;
@@ -6,5 +6,5 @@ export interface MasonryProps {
     spacingTop: SpacingType;
     children?: ReactNode;
 }
-declare const Masonry: ({ children, columns, spacingTop, spacingLeft, }: MasonryProps) => JSX.Element;
+declare const Masonry: ({ children, columns, spacingTop, spacingLeft, }: MasonryProps) => React.ReactElement;
 export default Masonry;

package/dist/types/components/molecules/Masonry/styled.d.ts

@@ -4,14 +4,14 @@ export declare const StyledColumnItem: import("@emotion/styled").StyledComponent
     as?: React.ElementType;
 } & Partial<import("@tecsinapse/react-core").ThemeProviderProps> & {
     index: number;
-} & Partial<MasonryProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<MasonryProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledMasonry: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, JSX.IntrinsicElements, {}>;
 export declare const StyledRowItem: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & Partial<import("@tecsinapse/react-core").ThemeProviderProps> & {
     index: number;
-} & Partial<MasonryProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<MasonryProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/molecules/Menubar/MenuBlock/MenuItem/SubMenuBlock/styled.d.ts

@@ -1,8 +1,8 @@
 export declare const StyledContainerItem: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const DummyBorder: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/molecules/Menubar/MenuBlock/MenuItem/styled.d.ts

@@ -1,8 +1,8 @@
 export declare const StyledContainerItemText: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledSubButton: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/molecules/Menubar/MenuBlock/styled.d.ts

@@ -1,20 +1,20 @@
 export declare const StyledLeftComponent: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledRightComponent: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledContainerMenu: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledContainerItems: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledText: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/molecules/Menubar/MostUsed/styled.d.ts

@@ -1,7 +1,7 @@
 export declare const StyledCardContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledCard: import("@emotion/native").StyledComponent<import("@tecsinapse/react-core").CardProps & {
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;

package/dist/types/components/molecules/Menubar/SearchResultItem/styled.d.ts

@@ -1,7 +1,7 @@
 export declare const StyledSearchItemContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const HighlightText: import("@emotion/native").StyledComponent<import("@tecsinapse/react-core").TextProps & {
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;

package/dist/types/components/molecules/Menubar/styled.d.ts

@@ -1,11 +1,11 @@
 export declare const StyledIconInput: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledMenuBar: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledMenuButton: import("@emotion/native").StyledComponent<import("@tecsinapse/react-core").ButtonProps & {
     onMouseOver?: () => void;
     onMouseOut?: () => void;
@@ -18,7 +18,7 @@ export declare const StyledMenuButton: import("@emotion/native").StyledComponent
 export declare const StyledContainerOpenMenu: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledInput: import("@emotion/native").StyledComponent<Omit<import("../../atoms/Input").InputWebProps, "ref"> & import("react").RefAttributes<HTMLInputElement> & {
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
@@ -26,12 +26,12 @@ export declare const StyledInput: import("@emotion/native").StyledComponent<Omit
 export declare const StyledInputContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, JSX.IntrinsicElements, {}>;
 export declare const StyledSearchResultsContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, JSX.IntrinsicElements, {}>;
 export declare const StyledSearchTextContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/molecules/ScrollableMonthYearPicker/styled.d.ts

@@ -1,8 +1,8 @@
 export declare const DivStyledColumn: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, JSX.IntrinsicElements, {}>;
 export declare const DivStyledRow: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, JSX.IntrinsicElements, {}>;

package/dist/types/components/molecules/ScrollableTimePicker/styled.d.ts

@@ -1,8 +1,8 @@
 export declare const DivStyledColumn: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, JSX.IntrinsicElements, {}>;
 export declare const DivStyledRow: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}, JSX.IntrinsicElements, {}>;

package/dist/types/components/molecules/Select/Dropdown/Dropdown.d.ts

@@ -2,7 +2,7 @@ import React from 'react';
 import { SelectProps } from '../Select';
 declare const Component: <Data, Type extends "single" | "multi">({ options, onSearch, type, hideSearchBar, onSelect, value, keyExtractor, labelExtractor, setDropDownVisible, style, anchor, selectAllLabel, searchBarPlaceholder, }: SelectProps<Data, Type> & {
     setDropDownVisible: (t: boolean) => void;
-}, ref: React.ForwardedRef<HTMLDivElement>) => JSX.Element;
+}, ref: React.ForwardedRef<HTMLDivElement>) => React.ReactElement;
 declare const Dropdown: <Data, Type extends "single" | "multi">(props: SelectProps<Data, Type> & {
     setDropDownVisible: (t: boolean) => void;
 } & {

package/dist/types/components/molecules/Select/Dropdown/styled.d.ts

@@ -4,32 +4,27 @@ export declare const StyledContainerDropdown: import("@emotion/styled").StyledCo
     as?: React.ElementType;
 } & Partial<import("@tecsinapse/react-core").ThemeProviderProps & SelectProps<unknown, "single" | "multi"> & {
     lengthOptions: number;
-}>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}>, JSX.IntrinsicElements, {}>;
 export declare const OptionsContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & Partial<import("@tecsinapse/react-core").ThemeProviderProps & SelectProps<unknown, "single" | "multi"> & {
     lengthOptions: number;
-}>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+}>, JSX.IntrinsicElements, {}>;
 export declare const SearchBarContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const PaddedContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const StyledContainerCheckAll: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps> & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    theme?: import("@emotion/react").Theme;
-}, {}, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
+export declare const StyledContainerCheckAll: import("@emotion/styled").StyledComponent<any, {}, {}>;
 export declare const StyledSpan: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledContainerTextLabel: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/molecules/Select/Select.d.ts

@@ -20,7 +20,7 @@ export interface SelectProps<Data, Type extends 'single' | 'multi'> extends Omit
     multiLabels?: MultiLabels;
     variant?: InputVariantType;
     hint?: string;
-    hintComponent?: JSX.Element;
+    hintComponent?: React.ReactNode;
 }
-declare const Select: <Data, Type extends "single" | "multi">({ value, options, keyExtractor, onSelect, type, labelExtractor, placeholder, onSearch, searchBarPlaceholder, hideSearchBar, label, disabled, anchor, displayTextProps, selectAllLabel, multiLabels, variant, hint, hintComponent, ...rest }: SelectProps<Data, Type>) => JSX.Element;
+declare const Select: <Data, Type extends "single" | "multi">({ value, options, keyExtractor, onSelect, type, labelExtractor, placeholder, onSearch, searchBarPlaceholder, hideSearchBar, label, disabled, anchor, displayTextProps, selectAllLabel, multiLabels, variant, hint, hintComponent, ...rest }: SelectProps<Data, Type>) => React.ReactElement;
 export default Select;

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

@@ -1,3 +1,4 @@
+import React from 'react';
 interface SelectItemProps<Data, Type extends 'single' | 'multi'> {
     item: Data;
     type: Type;
@@ -12,6 +13,6 @@ declare const SelectItem: <Data, Type extends "single" | "multi">({ item, onSele
     checkedAll: boolean;
     setCheckedAll: (t: boolean) => void;
     lenghtOptions: number;
-}) => JSX.Element;
+}) => React.ReactElement;
 declare const _default: typeof SelectItem;
 export default _default;

package/dist/types/components/molecules/Select/SelectItem/styled.d.ts

@@ -1,14 +1,14 @@
 export declare const ContainerItemSelect: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledSpan: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
 } & Partial<import("@tecsinapse/react-core").ThemeProviderProps> & {
     singleHighligh: boolean;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, {}>;
+}, JSX.IntrinsicElements, {}>;
 export declare const StyledContainerTextLabel: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;

package/dist/types/components/molecules/Select/styled.d.ts

@@ -1,15 +1,15 @@
 export declare const StyledContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledInputContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledHintContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const StyledIconComponent: import("@emotion/native").StyledComponent<import("@tecsinapse/react-core").IconProps & {
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;

package/dist/types/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: _rowsPerPageOptions, rowsPerPageLabel: _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>) => React.ReactElement;
 export default DataGrid;

package/dist/types/components/organisms/DataGrid/Footer/styled.d.ts

@@ -1,32 +1,15 @@
-export declare const TdFooterStyled: import("@emotion/styled").StyledComponent<import("react").TdHTMLAttributes<HTMLTableCellElement> & {
-    theme?: import("@emotion/react").Theme;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, {}, {}>;
+export declare const TdFooterStyled: import("@emotion/styled").StyledComponent<any, {}, {}>;
 export declare const FlexContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
-export declare const FooterContainer: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
-} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    theme?: import("@emotion/react").Theme;
-}, {}, {}>;
-export declare const FooterContainerStart: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
-} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    theme?: import("@emotion/react").Theme;
-}, {}, {}>;
-export declare const FooterContainerEnd: import("@emotion/styled").StyledComponent<{
-    theme?: import("@emotion/react").Theme;
-    as?: React.ElementType;
-} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
-    theme?: import("@emotion/react").Theme;
-}, {}, {}>;
+}, JSX.IntrinsicElements, {}>;
+export declare const FooterContainer: import("@emotion/styled").StyledComponent<any, {}, {}>;
+export declare const FooterContainerStart: import("@emotion/styled").StyledComponent<any, {}, {}>;
+export declare const FooterContainerEnd: import("@emotion/styled").StyledComponent<any, {}, {}>;
 export declare const SelectContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const NavigationButton: import("@emotion/native").StyledComponent<import("@tecsinapse/react-core").ButtonProps & {
     onMouseOver?: () => void;
     onMouseOut?: () => void;
@@ -48,11 +31,11 @@ export declare const PageButton: import("@emotion/native").StyledComponent<impor
 export declare const PagesContainer: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const HoveredText: import("@emotion/styled").StyledComponent<{
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, JSX.IntrinsicElements, {}>;
 export declare const TextPagination: import("@emotion/native").StyledComponent<import("@tecsinapse/react-core").TextProps & {
     theme?: import("@emotion/react").Theme;
     as?: React.ElementType;

package/dist/types/components/organisms/DataGrid/Header/Header.d.ts

@@ -1,3 +1,4 @@
+import React from 'react';
 import { HeadersType } from '../types';
 export interface DataGridHeaderProps<Data> {
     headers: HeadersType<Data>[];
@@ -8,5 +9,5 @@ export interface DataGridHeaderProps<Data> {
     rowsCount: number;
     selectable?: boolean;
 }
-declare const Header: <Data>({ selectable, rowsCount, headers, data, rowKeyExtractor, selectedRows, onSelected, }: DataGridHeaderProps<Data>) => JSX.Element;
+declare const Header: <Data>({ selectable, rowsCount, headers, data, rowKeyExtractor, selectedRows, onSelected, }: DataGridHeaderProps<Data>) => React.ReactElement;
 export default Header;

package/dist/types/components/organisms/DataGrid/Header/styled.d.ts

@@ -1,3 +1 @@
-export declare const CheckboxHeader: import("@emotion/styled").StyledComponent<import("react").ThHTMLAttributes<HTMLTableHeaderCellElement> & {
-    theme?: import("@emotion/react").Theme;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, {}, {}>;
+export declare const CheckboxHeader: import("@emotion/styled").StyledComponent<any, {}, {}>;

package/dist/types/components/organisms/DataGrid/styled.d.ts

@@ -1,3 +1 @@
-export declare const CheckboxCell: import("@emotion/styled").StyledComponent<import("react").TdHTMLAttributes<HTMLTableCellElement> & {
-    theme?: import("@emotion/react").Theme;
-} & Partial<import("@tecsinapse/react-core").ThemeProviderProps>, {}, {}>;
+export declare const CheckboxCell: import("@emotion/styled").StyledComponent<any, {}, {}>;

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@tecsinapse/react-web-kit",
   "description": "React components library for web",
-  "version": "3.5.1-beta.0",
+  "version": "3.5.1-beta.1",
   "license": "MIT",
   "main": "dist/esm/index.js",
   "module": "dist/esm/index.js",
@@ -19,7 +19,7 @@
     "@emotion/native": "~11.11.0",
     "@emotion/react": "~11.11.0",
     "@emotion/styled": "~11.11.0",
-    "@tecsinapse/react-core": "3.4.15-beta.0",
+    "@tecsinapse/react-core": "3.4.15-beta.1",
     "date-fns": "~2.30.0",
     "react-native-vector-icons": "^9.2.0",
     "react-transition-group": "~4.4.5"
@@ -38,5 +38,5 @@
     "react-dom": ">=18.0.0",
     "react-native-web": ">=0.18.0 <1"
   },
-  "gitHead": "a79fd28902c6a78bc91feb725354c363d29765d5"
+  "gitHead": "31f09f066e7f7ee57e2736d0124f2aeb667c78a9"
 }