@tecsinapse/react-web-kit 1.18.7 → 1.20.1

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

@@ -0,0 +1,2 @@
+export { default as Snackbar, SnackbarWebProps } from "./Snackbar";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","Snackbar","SnackbarWebProps"],"sources":["../../../../src/components/molecules/Snackbar/index.ts"],"sourcesContent":["export { default as Snackbar, SnackbarWebProps } from './Snackbar';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,QAApB,EAA8BC,gBAA9B"}

package/esm/components/molecules/Snackbar/styled.d.ts

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const SnackbarStyled: import("@emotion/native").StyledComponent<any, {}, {
+    ref?: import("react").Ref<any> | undefined;
+}>;

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

@@ -0,0 +1,25 @@
+var _templateObject, _templateObject2;
+
+function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+
+import styled, { css } from '@emotion/native';
+import { Snackbar as SnackbarCore } from '@tecsinapse/react-core';
+
+var baseStyles = function baseStyles() {
+  return [css({
+    left: '50%',
+    maxWidth: '600px',
+    transform: [{
+      translateX: '-50%'
+    }]
+  })];
+};
+
+var webStyles = function webStyles() {
+  return [css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n    position: fixed;\n  "])))];
+};
+
+export var SnackbarStyled = styled(SnackbarCore)(function () {
+  return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n    ", "\n    ", "\n  "])), baseStyles(), webStyles());
+});
+//# sourceMappingURL=styled.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","names":["styled","css","Snackbar","SnackbarCore","baseStyles","left","maxWidth","transform","translateX","webStyles","SnackbarStyled"],"sources":["../../../../src/components/molecules/Snackbar/styled.ts"],"sourcesContent":["import styled, { css } from '@emotion/native';\nimport { Snackbar as SnackbarCore, StyleProps } from '@tecsinapse/react-core';\n\nconst baseStyles = () => [\n  css({\n    left: '50%',\n    maxWidth: '600px',\n    transform: [{ translateX: '-50%' as any }],\n  }),\n];\n\nconst webStyles = () => [\n  css`\n    position: fixed;\n  `,\n];\n\nexport const SnackbarStyled = styled(SnackbarCore)<Partial<StyleProps>>(\n  () => css`\n    ${baseStyles()}\n    ${webStyles()}\n  `\n);\n"],"mappings":";;;;AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,iBAA5B;AACA,SAASC,QAAQ,IAAIC,YAArB,QAAqD,wBAArD;;AAEA,IAAMC,UAAU,GAAG,SAAbA,UAAa;EAAA,OAAM,CACvBH,GAAG,CAAC;IACFI,IAAI,EAAE,KADJ;IAEFC,QAAQ,EAAE,OAFR;IAGFC,SAAS,EAAE,CAAC;MAAEC,UAAU,EAAE;IAAd,CAAD;EAHT,CAAD,CADoB,CAAN;AAAA,CAAnB;;AAQA,IAAMC,SAAS,GAAG,SAAZA,SAAY;EAAA,OAAM,CACtBR,GADsB,qGAAN;AAAA,CAAlB;;AAMA,OAAO,IAAMS,cAAc,GAAGV,MAAM,CAACG,YAAD,CAAN,CAC5B;EAAA,OAAMF,GAAN,qGACIG,UAAU,EADd,EAEIK,SAAS,EAFb;AAAA,CAD4B,CAAvB"}

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

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

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

@@ -0,0 +1,82 @@
+var _excluded = ["label", "labelColor", "labelColorVariant", "labelColorTone", "labelTypography", "labelStack", "labelWeight", "leftComponent", "rightComponent", "disabled", "style", "borderColor", "borderColorGradation", "inputFontStack", "inputFontWeight", "inputContainerStyle", "variant", "hintComponent", "hint", "onFocus", "onBlur", "value", "maxLength"];
+
+function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import React from 'react';
+import { useInputFocus, TextArea as TACore, Text } from '@tecsinapse/react-core';
+import { StyledWebInput } from "./styled";
+
+var TextArea = function TextArea(_ref) {
+  var label = _ref.label,
+      labelColor = _ref.labelColor,
+      labelColorVariant = _ref.labelColorVariant,
+      labelColorTone = _ref.labelColorTone,
+      labelTypography = _ref.labelTypography,
+      labelStack = _ref.labelStack,
+      labelWeight = _ref.labelWeight,
+      leftComponent = _ref.leftComponent,
+      rightComponent = _ref.rightComponent,
+      disabled = _ref.disabled,
+      style = _ref.style,
+      borderColor = _ref.borderColor,
+      borderColorGradation = _ref.borderColorGradation,
+      _ref$inputFontStack = _ref.inputFontStack,
+      inputFontStack = _ref$inputFontStack === void 0 ? 'default' : _ref$inputFontStack,
+      _ref$inputFontWeight = _ref.inputFontWeight,
+      inputFontWeight = _ref$inputFontWeight === void 0 ? 'bold' : _ref$inputFontWeight,
+      inputContainerStyle = _ref.inputContainerStyle,
+      _ref$variant = _ref.variant,
+      variant = _ref$variant === void 0 ? 'default' : _ref$variant,
+      hintComponent = _ref.hintComponent,
+      hint = _ref.hint,
+      onFocus = _ref.onFocus,
+      onBlur = _ref.onBlur,
+      value = _ref.value,
+      maxLength = _ref.maxLength,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  var _useInputFocus = useInputFocus(onFocus, onBlur, !disabled),
+      focused = _useInputFocus.focused,
+      handleBlur = _useInputFocus.handleBlur,
+      handleFocus = _useInputFocus.handleFocus;
+
+  return React.createElement(TACore, {
+    label: label,
+    labelColor: labelColor,
+    labelColorVariant: labelColorVariant,
+    labelColorTone: labelColorTone,
+    labelTypography: labelTypography,
+    labelStack: labelStack,
+    labelWeight: labelWeight,
+    LabelComponent: Text,
+    leftComponent: leftComponent,
+    rightComponent: rightComponent,
+    borderColor: borderColor,
+    borderColorGradation: borderColorGradation,
+    inputContainerStyle: inputContainerStyle,
+    focused: focused,
+    disabled: disabled,
+    variant: variant,
+    value: value,
+    hintComponent: hintComponent,
+    hint: hint,
+    style: style,
+    TextComponent: Text,
+    maxLength: maxLength
+  }, React.createElement(StyledWebInput, _extends({}, rest, {
+    fontStack: inputFontStack,
+    fontWeight: inputFontWeight,
+    disabled: disabled,
+    onFocus: handleFocus,
+    onBlur: handleBlur,
+    textAlignVertical: 'top',
+    multiline: true,
+    value: value,
+    maxLength: maxLength
+  })));
+};
+
+export default TextArea;
+//# sourceMappingURL=TextArea.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"TextArea.js","names":["React","useInputFocus","TextArea","TACore","Text","StyledWebInput","label","labelColor","labelColorVariant","labelColorTone","labelTypography","labelStack","labelWeight","leftComponent","rightComponent","disabled","style","borderColor","borderColorGradation","inputFontStack","inputFontWeight","inputContainerStyle","variant","hintComponent","hint","onFocus","onBlur","value","maxLength","rest","focused","handleBlur","handleFocus"],"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"],"mappings":";;;;;;AAAA,OAAOA,KAAP,MAA0B,OAA1B;AACA,SACEC,aADF,EAGEC,QAAQ,IAAIC,MAHd,EAIEC,IAJF,QAKO,wBALP;AAMA,SAASC,cAAT;;AAIA,IAAMH,QAA2B,GAAG,SAA9BA,QAA8B,OAyB9B;EAAA,IAxBJI,KAwBI,QAxBJA,KAwBI;EAAA,IAvBJC,UAuBI,QAvBJA,UAuBI;EAAA,IAtBJC,iBAsBI,QAtBJA,iBAsBI;EAAA,IArBJC,cAqBI,QArBJA,cAqBI;EAAA,IApBJC,eAoBI,QApBJA,eAoBI;EAAA,IAnBJC,UAmBI,QAnBJA,UAmBI;EAAA,IAlBJC,WAkBI,QAlBJA,WAkBI;EAAA,IAjBJC,aAiBI,QAjBJA,aAiBI;EAAA,IAhBJC,cAgBI,QAhBJA,cAgBI;EAAA,IAfJC,QAeI,QAfJA,QAeI;EAAA,IAdJC,KAcI,QAdJA,KAcI;EAAA,IAbJC,WAaI,QAbJA,WAaI;EAAA,IAZJC,oBAYI,QAZJA,oBAYI;EAAA,+BAXJC,cAWI;EAAA,IAXJA,cAWI,oCAXa,SAWb;EAAA,gCAVJC,eAUI;EAAA,IAVJA,eAUI,qCAVc,MAUd;EAAA,IATJC,mBASI,QATJA,mBASI;EAAA,wBARJC,OAQI;EAAA,IARJA,OAQI,6BARM,SAQN;EAAA,IAPJC,aAOI,QAPJA,aAOI;EAAA,IANJC,IAMI,QANJA,IAMI;EAAA,IALJC,OAKI,QALJA,OAKI;EAAA,IAJJC,MAII,QAJJA,MAII;EAAA,IAHJC,KAGI,QAHJA,KAGI;EAAA,IAFJC,SAEI,QAFJA,SAEI;EAAA,IADDC,IACC;;EACJ,qBAA6C5B,aAAa,CACxDwB,OADwD,EAExDC,MAFwD,EAGxD,CAACX,QAHuD,CAA1D;EAAA,IAAQe,OAAR,kBAAQA,OAAR;EAAA,IAAiBC,UAAjB,kBAAiBA,UAAjB;EAAA,IAA6BC,WAA7B,kBAA6BA,WAA7B;;EAMA,OACE,oBAAC,MAAD;IACE,KAAK,EAAE1B,KADT;IAEE,UAAU,EAAEC,UAFd;IAGE,iBAAiB,EAAEC,iBAHrB;IAIE,cAAc,EAAEC,cAJlB;IAKE,eAAe,EAAEC,eALnB;IAME,UAAU,EAAEC,UANd;IAOE,WAAW,EAAEC,WAPf;IAQE,cAAc,EAAER,IARlB;IASE,aAAa,EAAES,aATjB;IAUE,cAAc,EAAEC,cAVlB;IAWE,WAAW,EAAEG,WAXf;IAYE,oBAAoB,EAAEC,oBAZxB;IAaE,mBAAmB,EAAEG,mBAbvB;IAcE,OAAO,EAAES,OAdX;IAeE,QAAQ,EAAEf,QAfZ;IAgBE,OAAO,EAAEO,OAhBX;IAiBE,KAAK,EAAEK,KAjBT;IAkBE,aAAa,EAAEJ,aAlBjB;IAmBE,IAAI,EAAEC,IAnBR;IAoBE,KAAK,EAAER,KApBT;IAqBE,aAAa,EAAEZ,IArBjB;IAsBE,SAAS,EAAEwB;EAtBb,GAwBE,oBAAC,cAAD,eACMC,IADN;IAEE,SAAS,EAAEV,cAFb;IAGE,UAAU,EAAEC,eAHd;IAIE,QAAQ,EAAEL,QAJZ;IAKE,OAAO,EAAEiB,WALX;IAME,MAAM,EAAED,UANV;IAOE,iBAAiB,EAAE,KAPrB;IAQE,SAAS,MARX;IASE,KAAK,EAAEJ,KATT;IAUE,SAAS,EAAEC;EAVb,GAxBF,CADF;AAuCD,CAvED;;AAyEA,eAAe1B,QAAf"}

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

@@ -0,0 +1 @@
+export { default as TextArea, TextAreaProps } from './TextArea';

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

@@ -0,0 +1,2 @@
+export { default as TextArea, TextAreaProps } from "./TextArea";
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","TextArea","TextAreaProps"],"sources":["../../../../src/components/molecules/TextArea/index.ts"],"sourcesContent":["export { default as TextArea, TextAreaProps } from './TextArea';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,QAApB,EAA8BC,aAA9B"}

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

@@ -0,0 +1,4 @@
+/// <reference types="react" />
+export declare const StyledWebInput: import("@emotion/native").StyledComponent<any, {}, {
+    ref?: import("react").Ref<any> | undefined;
+}>;

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

@@ -0,0 +1,18 @@
+var _templateObject;
+
+function _taggedTemplateLiteralLoose(strings, raw) { if (!raw) { raw = strings.slice(0); } strings.raw = raw; return strings; }
+
+import styled from '@emotion/native';
+import { TextAreaInputBase } from '@tecsinapse/react-core';
+export var StyledWebInput = styled(TextAreaInputBase)(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n  font-weight: ", ";\n  font-family: ", ";\n  outline-width: 0;\n"])), function (_ref) {
+  var theme = _ref.theme,
+      _ref$fontWeight = _ref.fontWeight,
+      fontWeight = _ref$fontWeight === void 0 ? 'regular' : _ref$fontWeight;
+  return theme.font.weight[fontWeight];
+}, function (_ref2) {
+  var theme = _ref2.theme,
+      _ref2$fontStack = _ref2.fontStack,
+      fontStack = _ref2$fontStack === void 0 ? 'default' : _ref2$fontStack;
+  return "'" + theme.font.stack[fontStack] + "'";
+});
+//# sourceMappingURL=styled.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"styled.js","names":["styled","TextAreaInputBase","StyledWebInput","theme","fontWeight","font","weight","fontStack","stack"],"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"],"mappings":";;;;AAAA,OAAOA,MAAP,MAAmB,iBAAnB;AACA,SAIEC,iBAJF,QAKO,wBALP;AAaA,OAAO,IAAMC,cAAc,GAAGF,MAAM,CAACC,iBAAD,CAAT,8IAGV;EAAA,IAAGE,KAAH,QAAGA,KAAH;EAAA,2BAAUC,UAAV;EAAA,IAAUA,UAAV,gCAAuB,SAAvB;EAAA,OACbD,KAAK,CAACE,IAAN,CAAWC,MAAX,CAAkBF,UAAlB,CADa;AAAA,CAHU,EAKV;EAAA,IAAGD,KAAH,SAAGA,KAAH;EAAA,4BAAUI,SAAV;EAAA,IAAUA,SAAV,gCAAsB,SAAtB;EAAA,aACTJ,KAAK,CAACE,IAAN,CAAWG,KAAX,CAAiBD,SAAjB,CADS;AAAA,CALU,CAApB"}

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

@@ -0,0 +1,29 @@
+import React from 'react';
+import { HeadersType } from './types';
+export interface DataGridProps<Data> extends React.HTMLAttributes<HTMLDivElement> {
+    headers: HeadersType<Data>[];
+    data: Data[];
+    rowKeyExtractor: (data: Data) => string;
+    toolbarRightIcons?: React.ReactNode;
+    toolbarFooter?: React.ReactNode;
+    toolbarTitle: string;
+    selectable?: boolean;
+    selectedRows?: Data[];
+    onSelectedRows?: (data: Data[] | ((prevState: Data[]) => Data[])) => void;
+    pagination?: boolean;
+    rowsPerPage?: number;
+    onRowsPerPageChange?: (value: number) => void;
+    rowsPerPageOptions?: number[];
+    rowsPerPageLabel?: (value: number) => string;
+    exportLabel?: string;
+    exportFunction?: () => void;
+    rowsCount?: number;
+    page?: number;
+    onPageChange?: (page: number) => void;
+    loading?: boolean;
+    skeletonComponent?: React.ReactNode;
+    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;
+export default DataGrid;

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

@@ -0,0 +1,130 @@
+var _excluded = ["headers", "data", "rowKeyExtractor", "toolbarTitle", "toolbarFooter", "toolbarRightIcons", "selectable", "selectedRows", "onSelectedRows", "pagination", "rowsPerPage", "onRowsPerPageChange", "rowsPerPageOptions", "rowsPerPageLabel", "exportLabel", "exportFunction", "rowsCount", "page", "onPageChange", "loading", "skeletonComponent", "emptyPlaceholder", "exportComponent"];
+
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+
+import React from 'react';
+import { Table, TableToolbar, TableContainer, Tr, Td, TBody } from "../../atoms/Table";
+import { Header } from "./Header";
+import { Row } from "./Row";
+import { Footer } from "./Footer";
+import { Skeleton } from "../../atoms/Skeleton";
+import { getData, removeElement } from "./utils";
+
+var DataGrid = function DataGrid(_ref) {
+  var headers = _ref.headers,
+      data = _ref.data,
+      rowKeyExtractor = _ref.rowKeyExtractor,
+      toolbarTitle = _ref.toolbarTitle,
+      toolbarFooter = _ref.toolbarFooter,
+      toolbarRightIcons = _ref.toolbarRightIcons,
+      _ref$selectable = _ref.selectable,
+      selectable = _ref$selectable === void 0 ? false : _ref$selectable,
+      _ref$selectedRows = _ref.selectedRows,
+      selectedRows = _ref$selectedRows === void 0 ? [] : _ref$selectedRows,
+      onSelectedRows = _ref.onSelectedRows,
+      _ref$pagination = _ref.pagination,
+      pagination = _ref$pagination === void 0 ? false : _ref$pagination,
+      _ref$rowsPerPage = _ref.rowsPerPage,
+      rowsPerPage = _ref$rowsPerPage === void 0 ? 10 : _ref$rowsPerPage,
+      onRowsPerPageChange = _ref.onRowsPerPageChange,
+      _rowsPerPageOptions = _ref.rowsPerPageOptions,
+      _rowsPerPageLabel = _ref.rowsPerPageLabel,
+      _ref$exportLabel = _ref.exportLabel,
+      exportLabel = _ref$exportLabel === void 0 ? 'Exportar' : _ref$exportLabel,
+      exportFunction = _ref.exportFunction,
+      rowsCount = _ref.rowsCount,
+      _ref$page = _ref.page,
+      page = _ref$page === void 0 ? 0 : _ref$page,
+      onPageChange = _ref.onPageChange,
+      _ref$loading = _ref.loading,
+      loading = _ref$loading === void 0 ? false : _ref$loading,
+      skeletonComponent = _ref.skeletonComponent,
+      emptyPlaceholder = _ref.emptyPlaceholder,
+      exportComponent = _ref.exportComponent,
+      rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+
+  if (selectable && (!selectedRows || !onSelectedRows)) {
+    throw new Error('[DataGrid] You should specify selection handlers (selectedRows, onSelectedRows)');
+  }
+
+  var rowsPerPageLabel = React.useCallback(function (value) {
+    return _rowsPerPageLabel ? _rowsPerPageLabel(value) : "Exibir por p\xE1gina: " + value + " itens";
+  }, [_rowsPerPageLabel]);
+  var rowsPerPageOptions = React.useMemo(function () {
+    return _rowsPerPageOptions != null ? _rowsPerPageOptions : [10, 25, 50];
+  }, [_rowsPerPageOptions]);
+  var handleSelect = React.useCallback(function (current, checked) {
+    if (checked) {
+      onSelectedRows == null ? void 0 : onSelectedRows(function (prevState) {
+        return [].concat(prevState, [current]);
+      });
+      return;
+    }
+
+    onSelectedRows == null ? void 0 : onSelectedRows(function (prevState) {
+      var idx = prevState.findIndex(function (el) {
+        return rowKeyExtractor(el) === rowKeyExtractor(current);
+      });
+      return [].concat(removeElement(prevState, idx));
+    });
+  }, [onSelectedRows, rowKeyExtractor]);
+  return React.createElement(TableContainer, rest, React.createElement(TableToolbar, {
+    title: toolbarTitle,
+    rightIcons: toolbarRightIcons,
+    footer: toolbarFooter
+  }), React.createElement(Table, null, React.createElement(Header, {
+    selectable: selectable,
+    headers: headers,
+    data: data,
+    rowsCount: rowsCount != null ? rowsCount : data.length,
+    rowKeyExtractor: rowKeyExtractor,
+    selectedRows: selectedRows,
+    onSelected: onSelectedRows
+  }), !loading ? React.createElement(TBody, null, data.length > 0 ? getData(data, rowsCount, page, rowsPerPage, pagination).map(function (item) {
+    return React.createElement(Row, {
+      key: rowKeyExtractor(item),
+      rowKeyExtractor: rowKeyExtractor,
+      handleSelect: handleSelect,
+      selectable: selectable,
+      headers: headers,
+      data: item,
+      checked: selectedRows == null ? void 0 : selectedRows.some(function (sel) {
+        return rowKeyExtractor(sel) === rowKeyExtractor(item);
+      })
+    });
+  }) : React.createElement("tr", null, React.createElement("td", {
+    colSpan: 99
+  }, emptyPlaceholder))) : React.createElement(TBody, null, [].concat(Array(rowsPerPage).keys()).map(function (idx) {
+    return React.createElement(Tr, {
+      key: "skeleton-" + idx
+    }, React.createElement(Td, {
+      colSpan: 99,
+      style: {
+        padding: 0
+      }
+    }, skeletonComponent != null ? skeletonComponent : React.createElement(Skeleton, {
+      height: 55,
+      radius: "mili",
+      animation: "wave"
+    }, React.createElement("div", {
+      style: {
+        width: '100%'
+      }
+    }))));
+  })), (Number(rowsCount) > 0 || data.length > 0) && React.createElement(Footer, {
+    exportFunction: exportFunction,
+    exportLabel: exportLabel,
+    rowsPerPageLabel: rowsPerPageLabel,
+    rowsPerPage: rowsPerPage,
+    onRowsPerPageChange: onRowsPerPageChange,
+    rowsPerPageOptions: rowsPerPageOptions,
+    rowsCount: rowsCount != null ? rowsCount : data.length,
+    page: page,
+    onPageChange: onPageChange,
+    pagination: pagination,
+    exportComponent: exportComponent
+  })));
+};
+
+export default DataGrid;
+//# sourceMappingURL=DataGrid.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"DataGrid.js","names":["React","Table","TableToolbar","TableContainer","Tr","Td","TBody","Header","Row","Footer","Skeleton","getData","removeElement","DataGrid","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","Error","useCallback","value","useMemo","handleSelect","current","checked","prevState","idx","findIndex","el","length","map","item","some","sel","Array","keys","padding","width","Number"],"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"],"mappings":"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"}

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

@@ -0,0 +1,16 @@
+import React from 'react';
+interface DataGridFooterProps {
+    rowsPerPage: number;
+    onRowsPerPageChange?: (value: number) => void;
+    rowsPerPageOptions: number[];
+    rowsPerPageLabel: (value: number) => string;
+    exportLabel?: string;
+    exportFunction?: () => void;
+    rowsCount: number;
+    page: number;
+    onPageChange?: (page: number) => void;
+    pagination: boolean;
+    exportComponent?: React.ReactNode;
+}
+declare const _default: React.NamedExoticComponent<DataGridFooterProps>;
+export default _default;

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

@@ -0,0 +1,116 @@
+import React from 'react';
+import { Button, Icon, Select, Text } from '@tecsinapse/react-web-kit';
+import { TFoot, Tr } from "../../../atoms/Table";
+import { FooterContainer, FooterContainerEnd, FooterContainerStart, HoveredText, NavigationButton, PageButton, PagesContainer, SelectContainer, TdFooterStyled, TextPagination } from "./styled";
+
+var Footer = function Footer(_ref) {
+  var rowsPerPage = _ref.rowsPerPage,
+      onRowsPerPageChange = _ref.onRowsPerPageChange,
+      rowsPerPageOptions = _ref.rowsPerPageOptions,
+      rowsPerPageLabel = _ref.rowsPerPageLabel,
+      exportFunction = _ref.exportFunction,
+      exportLabel = _ref.exportLabel,
+      rowsCount = _ref.rowsCount,
+      page = _ref.page,
+      onPageChange = _ref.onPageChange,
+      pagination = _ref.pagination,
+      exportComponent = _ref.exportComponent;
+
+  if (pagination && (!onPageChange || !onRowsPerPageChange)) {
+    throw new Error('[DataGrid] You should specify pagination handlers (onPageChange, onRowsPerPageChange)');
+  }
+
+  var getPaginationSlice = function getPaginationSlice() {
+    var totalPages = Math.ceil(rowsCount / rowsPerPage);
+
+    if (totalPages < 4) {
+      return {
+        start: 0,
+        end: totalPages
+      };
+    }
+
+    if (page === 0) {
+      return {
+        start: page,
+        end: page + 3
+      };
+    }
+
+    if (page === totalPages - 1) {
+      return {
+        start: page - 2,
+        end: page + 1
+      };
+    }
+
+    return {
+      start: page - 1,
+      end: page + 2
+    };
+  };
+
+  var handleRowsPerPage = React.useCallback(function (value) {
+    onRowsPerPageChange == null ? void 0 : onRowsPerPageChange(value);
+    onPageChange == null ? void 0 : onPageChange(0);
+  }, [onPageChange, onRowsPerPageChange]);
+  var currentInitItem = page * rowsPerPage + 1;
+  var currentFinalItem = (page + 1) * rowsPerPage > rowsCount ? rowsCount : (page + 1) * rowsPerPage;
+  return React.createElement(TFoot, null, React.createElement(Tr, null, React.createElement(TdFooterStyled, {
+    colSpan: 99
+  }, React.createElement(FooterContainer, null, React.createElement(FooterContainerStart, null, pagination && React.createElement(SelectContainer, null, React.createElement(Select, {
+    options: rowsPerPageOptions,
+    onSelect: handleRowsPerPage,
+    value: rowsPerPage,
+    type: 'single',
+    keyExtractor: function keyExtractor(value) {
+      return String(value);
+    },
+    labelExtractor: rowsPerPageLabel,
+    anchor: "top"
+  })), exportComponent && !exportFunction && React.createElement(React.Fragment, null, exportComponent), exportFunction && React.createElement(HoveredText, null, React.createElement(Button, {
+    variant: "outlined",
+    onPress: function onPress() {
+      return exportFunction();
+    }
+  }, React.createElement(Text, {
+    fontColor: "orange",
+    fontWeight: "bold"
+  }, exportLabel)))), pagination && React.createElement(React.Fragment, null, React.createElement(TextPagination, {
+    fontWeight: 'bold',
+    fontColor: 'medium'
+  }, "Exibindo " + currentInitItem + " a " + currentFinalItem + " de " + rowsCount + " registros"), React.createElement(FooterContainerEnd, null, React.createElement(NavigationButton, {
+    onPress: function onPress() {
+      return onPageChange == null ? void 0 : onPageChange(page - 1);
+    },
+    disabled: page === 0
+  }, React.createElement(Icon, {
+    name: 'chevron-left',
+    type: 'material-community',
+    fontColor: 'light'
+  })), React.createElement(PagesContainer, null, [].concat(Array(Math.ceil(rowsCount / rowsPerPage)).keys()).slice(getPaginationSlice().start, getPaginationSlice().end).map(function (value) {
+    return React.createElement(HoveredText, {
+      key: "page-" + value
+    }, React.createElement(PageButton, {
+      variant: page === value ? 'outlined' : 'text',
+      onPress: function onPress() {
+        return onPageChange == null ? void 0 : onPageChange(value);
+      }
+    }, React.createElement(Text, {
+      fontColor: "medium",
+      fontWeight: "bold"
+    }, value + 1)));
+  })), React.createElement(NavigationButton, {
+    onPress: function onPress() {
+      return onPageChange == null ? void 0 : onPageChange(page + 1);
+    },
+    disabled: page === Math.ceil(rowsCount / rowsPerPage) - 1
+  }, React.createElement(Icon, {
+    name: 'chevron-right',
+    type: 'material-community',
+    fontColor: 'light'
+  }))))))));
+};
+
+export default React.memo(Footer);
+//# sourceMappingURL=Footer.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"Footer.js","names":["React","Button","Icon","Select","Text","TFoot","Tr","FooterContainer","FooterContainerEnd","FooterContainerStart","HoveredText","NavigationButton","PageButton","PagesContainer","SelectContainer","TdFooterStyled","TextPagination","Footer","rowsPerPage","onRowsPerPageChange","rowsPerPageOptions","rowsPerPageLabel","exportFunction","exportLabel","rowsCount","page","onPageChange","pagination","exportComponent","Error","getPaginationSlice","totalPages","Math","ceil","start","end","handleRowsPerPage","useCallback","value","currentInitItem","currentFinalItem","String","Array","keys","slice","map","memo"],"sources":["../../../../../src/components/organisms/DataGrid/Footer/Footer.tsx"],"sourcesContent":["import React from 'react';\nimport { Button, Icon, Select, Text } from '@tecsinapse/react-web-kit';\nimport { TFoot, Tr } from '../../../atoms/Table';\nimport {\n  FooterContainer,\n  FooterContainerEnd,\n  FooterContainerStart,\n  HoveredText,\n  NavigationButton,\n  PageButton,\n  PagesContainer,\n  SelectContainer,\n  TdFooterStyled,\n  TextPagination,\n} from './styled';\n\ninterface DataGridFooterProps {\n  rowsPerPage: number;\n  onRowsPerPageChange?: (value: number) => void;\n  rowsPerPageOptions: number[];\n  rowsPerPageLabel: (value: number) => string;\n  exportLabel?: string;\n  exportFunction?: () => void;\n  /** Total data elements */\n  rowsCount: number;\n  page: number;\n  onPageChange?: (page: number) => void;\n  pagination: boolean;\n  exportComponent?: React.ReactNode;\n}\n\nconst Footer: React.FC<DataGridFooterProps> = ({\n  rowsPerPage,\n  onRowsPerPageChange,\n  rowsPerPageOptions,\n  rowsPerPageLabel,\n  exportFunction,\n  exportLabel,\n  rowsCount,\n  page,\n  onPageChange,\n  pagination,\n  exportComponent,\n}) => {\n  if (pagination && (!onPageChange || !onRowsPerPageChange)) {\n    throw new Error(\n      '[DataGrid] You should specify pagination handlers (onPageChange, onRowsPerPageChange)'\n    );\n  }\n\n  const getPaginationSlice = (): { start: number; end: number } => {\n    const totalPages = Math.ceil(rowsCount / rowsPerPage);\n    if (totalPages < 4) {\n      return { start: 0, end: totalPages };\n    }\n    if (page === 0) {\n      return { start: page, end: page + 3 };\n    }\n    if (page === totalPages - 1) {\n      return { start: page - 2, end: page + 1 };\n    }\n    return { start: page - 1, end: page + 2 };\n  };\n\n  const handleRowsPerPage = React.useCallback(\n    value => {\n      onRowsPerPageChange?.(value as number);\n      onPageChange?.(0);\n    },\n    [onPageChange, onRowsPerPageChange]\n  );\n  const currentInitItem = page * rowsPerPage + 1;\n  const currentFinalItem =\n    (page + 1) * rowsPerPage > rowsCount ? rowsCount : (page + 1) * rowsPerPage;\n\n  return (\n    <TFoot>\n      <Tr>\n        <TdFooterStyled colSpan={99}>\n          <FooterContainer>\n            <FooterContainerStart>\n              {pagination && (\n                <SelectContainer>\n                  <Select\n                    options={rowsPerPageOptions}\n                    onSelect={handleRowsPerPage}\n                    value={rowsPerPage}\n                    type={'single'}\n                    keyExtractor={value => String(value)}\n                    labelExtractor={rowsPerPageLabel}\n                    anchor=\"top\"\n                  />\n                </SelectContainer>\n              )}\n              {exportComponent && !exportFunction && <>{exportComponent}</>}\n              {exportFunction && (\n                <HoveredText>\n                  <Button variant=\"outlined\" onPress={() => exportFunction()}>\n                    <Text fontColor=\"orange\" fontWeight=\"bold\">\n                      {exportLabel}\n                    </Text>\n                  </Button>\n                </HoveredText>\n              )}\n            </FooterContainerStart>\n            {pagination && (\n              <>\n                <TextPagination\n                  fontWeight={'bold'}\n                  fontColor={'medium'}\n                >{`Exibindo ${currentInitItem} a ${currentFinalItem} de ${rowsCount} registros`}</TextPagination>\n                <FooterContainerEnd>\n                  <NavigationButton\n                    onPress={() => onPageChange?.(page - 1)}\n                    disabled={page === 0}\n                  >\n                    <Icon\n                      name={'chevron-left'}\n                      type={'material-community'}\n                      fontColor={'light'}\n                    />\n                  </NavigationButton>\n                  <PagesContainer>\n                    {[...Array(Math.ceil(rowsCount / rowsPerPage)).keys()]\n                      .slice(\n                        getPaginationSlice().start,\n                        getPaginationSlice().end\n                      )\n                      .map(value => (\n                        <HoveredText key={`page-${value}`}>\n                          <PageButton\n                            variant={page === value ? 'outlined' : 'text'}\n                            onPress={() => onPageChange?.(value)}\n                          >\n                            <Text fontColor=\"medium\" fontWeight=\"bold\">\n                              {value + 1}\n                            </Text>\n                          </PageButton>\n                        </HoveredText>\n                      ))}\n                  </PagesContainer>\n                  <NavigationButton\n                    onPress={() => onPageChange?.(page + 1)}\n                    disabled={page === Math.ceil(rowsCount / rowsPerPage) - 1}\n                  >\n                    <Icon\n                      name={'chevron-right'}\n                      type={'material-community'}\n                      fontColor={'light'}\n                    />\n                  </NavigationButton>\n                </FooterContainerEnd>\n              </>\n            )}\n          </FooterContainer>\n        </TdFooterStyled>\n      </Tr>\n    </TFoot>\n  );\n};\n\nexport default React.memo(Footer);\n"],"mappings":"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"}

package/esm/components/organisms/DataGrid/Footer/index.d.ts

@@ -0,0 +1 @@
+export { default as Footer } from './Footer';

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

@@ -0,0 +1,2 @@
+export { default as Footer } from "./Footer";
+//# sourceMappingURL=index.js.map

package/esm/components/organisms/DataGrid/Footer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","names":["default","Footer"],"sources":["../../../../../src/components/organisms/DataGrid/Footer/index.ts"],"sourcesContent":["export { default as Footer } from './Footer';\n"],"mappings":"AAAA,SAASA,OAAO,IAAIC,MAApB"}

package/esm/components/organisms/DataGrid/Footer/styled.d.ts

@@ -0,0 +1,38 @@
+/// <reference types="react" />
+export declare const TdFooterStyled: import("@emotion/styled").StyledComponent<any, {}, {}>;
+export declare const FlexContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+}, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const FooterContainer: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export declare const FooterContainerStart: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export declare const FooterContainerEnd: import("@emotion/styled").StyledComponent<{
+    theme?: import("@emotion/react").Theme | undefined;
+    as?: import("react").ElementType<any> | undefined;
+} & import("react").ClassAttributes<HTMLDivElement> & import("react").HTMLAttributes<HTMLDivElement> & {
+    children?: import("react").ReactNode;
+} & {
+    theme?: import("@emotion/react").Theme | undefined;
+}, {}, {}>;
+export declare const SelectContainer: import("@emotion/styled").StyledComponent<any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const NavigationButton: import("@emotion/native").StyledComponent<any, {}, {}>;
+export declare const PageButton: import("@emotion/native").StyledComponent<any, {}, {}>;
+export declare const PagesContainer: import("@emotion/styled").StyledComponent<any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const HoveredText: import("@emotion/styled").StyledComponent<any, import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, {}>;
+export declare const TextPagination: import("@emotion/native").StyledComponent<any, {}, {
+    ref?: import("react").Ref<any> | undefined;
+}>;