npm - @tecsinapse/react-web-kit - Versions diffs - 1.8.0 → 1.10.2 - Mend

@tecsinapse/react-web-kit 1.8.0 → 1.10.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (91) hide show

package/dist/components/molecules/TextArea/TextArea.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/molecules/TextArea/TextArea.tsx"],"names":["TextArea","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","Text"],"mappings":";;;;;;;AAAA;;AACA;;AAMA;;;;;;~~AAKA~~,MAAMA,QAA2B,GAAG,CAAC;AACnCC,EAAAA,KADmC;AAEnCC,EAAAA,UAFmC;AAGnCC,EAAAA,iBAHmC;AAInCC,EAAAA,cAJmC;AAKnCC,EAAAA,eALmC;AAMnCC,EAAAA,UANmC;AAOnCC,EAAAA,WAPmC;AAQnCC,EAAAA,aARmC;AASnCC,EAAAA,cATmC;AAUnCC,EAAAA,QAVmC;AAWnCC,EAAAA,KAXmC;AAYnCC,EAAAA,WAZmC;AAanCC,EAAAA,oBAbmC;AAcnCC,EAAAA,cAAc,GAAG,SAdkB;AAenCC,EAAAA,eAAe,GAAG,MAfiB;AAgBnCC,EAAAA,mBAhBmC;AAiBnCC,EAAAA,OAAO,GAAG,SAjByB;AAkBnCC,EAAAA,aAlBmC;AAmBnCC,EAAAA,IAnBmC;AAoBnCC,EAAAA,OApBmC;AAqBnCC,EAAAA,MArBmC;AAsBnCC,EAAAA,KAtBmC;AAuBnCC,EAAAA,SAvBmC;AAwBnC,KAAGC;AAxBgC,CAAD,KAyB9B;AACJ,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA,UAAX;AAAuBC,IAAAA;AAAvB,MAAuC,8BAC3CP,OAD2C,EAE3CC,MAF2C,EAG3C,CAACX,QAH0C,CAA7C;AAMA,SACE,6BAAC,mBAAD;AACE,IAAA,KAAK,EAAET,KADT;AAEE,IAAA,UAAU,EAAEC,UAFd;AAGE,IAAA,iBAAiB,EAAEC,iBAHrB;AAIE,IAAA,cAAc,EAAEC,cAJlB;AAKE,IAAA,eAAe,EAAEC,eALnB;AAME,IAAA,UAAU,EAAEC,UANd;AAOE,IAAA,WAAW,EAAEC,WAPf;AAQE,IAAA,cAAc,EAAEqB,eARlB;AASE,IAAA,aAAa,EAAEpB,aATjB;AAUE,IAAA,cAAc,EAAEC,cAVlB;AAWE,IAAA,WAAW,EAAEG,WAXf;AAYE,IAAA,oBAAoB,EAAEC,oBAZxB;AAaE,IAAA,mBAAmB,EAAEG,mBAbvB;AAcE,IAAA,OAAO,EAAES,OAdX;AAeE,IAAA,QAAQ,EAAEf,QAfZ;AAgBE,IAAA,OAAO,EAAEO,OAhBX;AAiBE,IAAA,KAAK,EAAEK,KAjBT;AAkBE,IAAA,aAAa,EAAEJ,aAlBjB;AAmBE,IAAA,IAAI,EAAEC,IAnBR;AAoBE,IAAA,KAAK,EAAER,KApBT;AAqBE,IAAA,aAAa,EAAEiB,eArBjB;AAsBE,IAAA,SAAS,EAAEL;AAtBb,KAwBE,6BAAC,sBAAD,eACMC,IADN;AAEE,IAAA,SAAS,EAAEV,cAFb;AAGE,IAAA,UAAU,EAAEC,eAHd;AAIE,IAAA,QAAQ,EAAEL,QAJZ;AAKE,IAAA,OAAO,EAAEiB,WALX;AAME,IAAA,MAAM,EAAED,UANV;AAOE,IAAA,iBAAiB,EAAE,KAPrB;AAQE,IAAA,SAAS,MARX;AASE,IAAA,KAAK,EAAEJ,KATT;AAUE,IAAA,SAAS,EAAEC;AAVb,KAxBF,CADF;AAuCD,CAvED;;eAyEevB,Q","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 ~~interface~~ TextAreaProps~~\n extends~~ 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"],"file":"TextArea.js"}
1	+ {"version":3,"sources":["../../../../src/components/molecules/TextArea/TextArea.tsx"],"names":["TextArea","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","Text"],"mappings":";;;;;;;AAAA;;AACA;;AAMA;;;;;;AAIA,MAAMA,QAA2B,GAAG,CAAC;AACnCC,EAAAA,KADmC;AAEnCC,EAAAA,UAFmC;AAGnCC,EAAAA,iBAHmC;AAInCC,EAAAA,cAJmC;AAKnCC,EAAAA,eALmC;AAMnCC,EAAAA,UANmC;AAOnCC,EAAAA,WAPmC;AAQnCC,EAAAA,aARmC;AASnCC,EAAAA,cATmC;AAUnCC,EAAAA,QAVmC;AAWnCC,EAAAA,KAXmC;AAYnCC,EAAAA,WAZmC;AAanCC,EAAAA,oBAbmC;AAcnCC,EAAAA,cAAc,GAAG,SAdkB;AAenCC,EAAAA,eAAe,GAAG,MAfiB;AAgBnCC,EAAAA,mBAhBmC;AAiBnCC,EAAAA,OAAO,GAAG,SAjByB;AAkBnCC,EAAAA,aAlBmC;AAmBnCC,EAAAA,IAnBmC;AAoBnCC,EAAAA,OApBmC;AAqBnCC,EAAAA,MArBmC;AAsBnCC,EAAAA,KAtBmC;AAuBnCC,EAAAA,SAvBmC;AAwBnC,KAAGC;AAxBgC,CAAD,KAyB9B;AACJ,QAAM;AAAEC,IAAAA,OAAF;AAAWC,IAAAA,UAAX;AAAuBC,IAAAA;AAAvB,MAAuC,8BAC3CP,OAD2C,EAE3CC,MAF2C,EAG3C,CAACX,QAH0C,CAA7C;AAMA,SACE,6BAAC,mBAAD;AACE,IAAA,KAAK,EAAET,KADT;AAEE,IAAA,UAAU,EAAEC,UAFd;AAGE,IAAA,iBAAiB,EAAEC,iBAHrB;AAIE,IAAA,cAAc,EAAEC,cAJlB;AAKE,IAAA,eAAe,EAAEC,eALnB;AAME,IAAA,UAAU,EAAEC,UANd;AAOE,IAAA,WAAW,EAAEC,WAPf;AAQE,IAAA,cAAc,EAAEqB,eARlB;AASE,IAAA,aAAa,EAAEpB,aATjB;AAUE,IAAA,cAAc,EAAEC,cAVlB;AAWE,IAAA,WAAW,EAAEG,WAXf;AAYE,IAAA,oBAAoB,EAAEC,oBAZxB;AAaE,IAAA,mBAAmB,EAAEG,mBAbvB;AAcE,IAAA,OAAO,EAAES,OAdX;AAeE,IAAA,QAAQ,EAAEf,QAfZ;AAgBE,IAAA,OAAO,EAAEO,OAhBX;AAiBE,IAAA,KAAK,EAAEK,KAjBT;AAkBE,IAAA,aAAa,EAAEJ,aAlBjB;AAmBE,IAAA,IAAI,EAAEC,IAnBR;AAoBE,IAAA,KAAK,EAAER,KApBT;AAqBE,IAAA,aAAa,EAAEiB,eArBjB;AAsBE,IAAA,SAAS,EAAEL;AAtBb,KAwBE,6BAAC,sBAAD,eACMC,IADN;AAEE,IAAA,SAAS,EAAEV,cAFb;AAGE,IAAA,UAAU,EAAEC,eAHd;AAIE,IAAA,QAAQ,EAAEL,QAJZ;AAKE,IAAA,OAAO,EAAEiB,WALX;AAME,IAAA,MAAM,EAAED,UANV;AAOE,IAAA,iBAAiB,EAAE,KAPrB;AAQE,IAAA,SAAS,MARX;AASE,IAAA,KAAK,EAAEJ,KATT;AAUE,IAAA,SAAS,EAAEC;AAVb,KAxBF,CADF;AAuCD,CAvED;;eAyEevB,Q","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"],"file":"TextArea.js"}

package/dist/components/organisms/DataGrid/DataGrid.js CHANGED Viewed

@@ -103,7 +103,7 @@ const DataGrid = ({
     style: {
       width: '100%'
     }
-  })))))), _react.default.createElement(_Footer.Footer, {
+  })))))), (Number(rowsCount) > 0 || data.length > 0) && _react.default.createElement(_Footer.Footer, {
     exportFunction: exportFunction,
     exportLabel: exportLabel,
     rowsPerPageLabel: rowsPerPageLabel,

package/dist/components/organisms/DataGrid/DataGrid.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../src/components/organisms/DataGrid/DataGrid.tsx"],"names":["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","rest","Error","React","useCallback","value","useMemo","handleSelect","current","checked","prevState","idx","findIndex","el","length","map","item","some","sel","Array","keys","padding","width"],"mappings":"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","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}\n\n/* Note: Consider memoizing functions for a better performance */\nconst DataGrid = <Data extends unknown>({\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 ...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(\n data,\n rowsCount,\n page,\n rowsPerPage,\n pagination\n ).map(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 <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 <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 />\n </Table>\n </TableContainer>\n );\n};\n\nexport default DataGrid;\n"],"file":"DataGrid.js"}
1	+ {"version":3,"sources":["../../../../src/components/organisms/DataGrid/DataGrid.tsx"],"names":["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","rest","Error","React","useCallback","value","useMemo","handleSelect","current","checked","prevState","idx","findIndex","el","length","map","item","some","sel","Array","keys","padding","width","Number"],"mappings":"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","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}\n\n/* Note: Consider memoizing functions for a better performance */\nconst DataGrid = <Data extends unknown>({\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 ...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(\n data,\n rowsCount,\n page,\n rowsPerPage,\n pagination\n ).map(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 <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 />\n )}\n </Table>\n </TableContainer>\n );\n};\n\nexport default DataGrid;\n"],"file":"DataGrid.js"}

package/dist/components/organisms/DataGrid/Footer/Footer.js CHANGED Viewed

@@ -74,7 +74,8 @@ const Footer = ({
     value: rowsPerPage,
     type: 'single',
     keyExtractor: value => String(value),
-    labelExtractor: rowsPerPageLabel
+    labelExtractor: rowsPerPageLabel,
+    anchor: "top"
   })), exportFunction && _react.default.createElement(_styled.HoveredText, null, _react.default.createElement(_reactWebKit.Button, {
     variant: "outlined",
     onPress: () => exportFunction()

package/dist/components/organisms/DataGrid/Footer/Footer.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/organisms/DataGrid/Footer/Footer.tsx"],"names":["Footer","rowsPerPage","onRowsPerPageChange","rowsPerPageOptions","rowsPerPageLabel","exportFunction","exportLabel","rowsCount","page","onPageChange","pagination","Error","getPaginationSlice","totalPages","Math","ceil","start","end","handleRowsPerPage","React","useCallback","value","String","Array","keys","slice","map","memo"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;;;AA0BA,MAAMA,MAAqC,GAAG,CAAC;AAC7CC,EAAAA,WAD6C;AAE7CC,EAAAA,mBAF6C;AAG7CC,EAAAA,kBAH6C;AAI7CC,EAAAA,gBAJ6C;AAK7CC,EAAAA,cAL6C;AAM7CC,EAAAA,WAN6C;AAO7CC,EAAAA,SAP6C;AAQ7CC,EAAAA,IAR6C;AAS7CC,EAAAA,YAT6C;AAU7CC,EAAAA;AAV6C,CAAD,KAWxC;AACJ,MAAIA,UAAU,KAAK,CAACD,YAAD,IAAiB,CAACP,mBAAvB,CAAd,EAA2D;AACzD,UAAM,IAAIS,KAAJ,CACJ,uFADI,CAAN;AAGD;;AAED,QAAMC,kBAAkB,GAAG,MAAsC;AAC/D,UAAMC,UAAU,GAAGC,IAAI,CAACC,IAAL,CAAUR,SAAS,GAAGN,WAAtB,CAAnB;;AACA,QAAIY,UAAU,GAAG,CAAjB,EAAoB;AAClB,aAAO;AAAEG,QAAAA,KAAK,EAAE,CAAT;AAAYC,QAAAA,GAAG,EAAEJ;AAAjB,OAAP;AACD;;AACD,QAAIL,IAAI,KAAK,CAAb,EAAgB;AACd,aAAO;AAAEQ,QAAAA,KAAK,EAAER,IAAT;AAAeS,QAAAA,GAAG,EAAET,IAAI,GAAG;AAA3B,OAAP;AACD;;AACD,QAAIA,IAAI,KAAKK,UAAU,GAAG,CAA1B,EAA6B;AAC3B,aAAO;AAAEG,QAAAA,KAAK,EAAER,IAAI,GAAG,CAAhB;AAAmBS,QAAAA,GAAG,EAAET,IAAI,GAAG;AAA/B,OAAP;AACD;;AACD,WAAO;AAAEQ,MAAAA,KAAK,EAAER,IAAI,GAAG,CAAhB;AAAmBS,MAAAA,GAAG,EAAET,IAAI,GAAG;AAA/B,KAAP;AACD,GAZD;;AAcA,QAAMU,iBAAiB,GAAGC,eAAMC,WAAN,CACxBC,KAAK,IAAI;AACPnB,IAAAA,mBAAmB,SAAnB,IAAAA,mBAAmB,WAAnB,YAAAA,mBAAmB,CAAGmB,KAAH,CAAnB;AACAZ,IAAAA,YAAY,SAAZ,IAAAA,YAAY,WAAZ,YAAAA,YAAY,CAAG,CAAH,CAAZ;AACD,GAJuB,EAKxB,CAACA,YAAD,EAAeP,mBAAf,CALwB,CAA1B;;AAQA,SACE,6BAAC,YAAD,QACE,6BAAC,SAAD,QACE,6BAAC,sBAAD;AAAgB,IAAA,OAAO,EAAE;AAAzB,KACE,6BAAC,uBAAD,QACE,6BAAC,4BAAD,QACGQ,UAAU,IACT,6BAAC,uBAAD,QACE,6BAAC,mBAAD;AACE,IAAA,OAAO,EAAEP,kBADX;AAEE,IAAA,QAAQ,EAAEe,iBAFZ;AAGE,IAAA,KAAK,EAAEjB,WAHT;AAIE,IAAA,IAAI,EAAE,QAJR;AAKE,IAAA,YAAY,EAAEoB,KAAK,IAAIC,MAAM,CAACD,KAAD,CAL/B;AAME,IAAA,cAAc,EAAEjB;~~AANlB~~,IADF,CAFJ,~~EAaGC~~,cAAc,IACb,6BAAC,mBAAD,QACE,6BAAC,mBAAD;AAAQ,IAAA,OAAO,EAAC,UAAhB;AAA2B,IAAA,OAAO,EAAE,MAAMA,cAAc;AAAxD,KACE,6BAAC,iBAAD;AAAM,IAAA,SAAS,EAAC,QAAhB;AAAyB,IAAA,UAAU,EAAC;AAApC,KACGC,WADH,CADF,CADF,~~CAdJ~~,CADF,~~EAwBGI~~,UAAU,IACT,6BAAC,0BAAD,QACE,6BAAC,wBAAD;AACE,IAAA,OAAO,EAAE,MAAMD,YAAN,aAAMA,YAAN,uBAAMA,YAAY,CAAGD,IAAI,GAAG,CAAV,CAD7B;AAEE,IAAA,QAAQ,EAAEA,IAAI,KAAK;AAFrB,KAIE,6BAAC,iBAAD;AACE,IAAA,IAAI,EAAE,cADR;AAEE,IAAA,IAAI,EAAE,oBAFR;AAGE,IAAA,SAAS,EAAE;AAHb,IAJF,CADF,EAWE,6BAAC,sBAAD,QACG,CAAC,GAAGe,KAAK,CAACT,IAAI,CAACC,IAAL,CAAUR,SAAS,GAAGN,WAAtB,CAAD,CAAL,CAA0CuB,IAA1C,EAAJ,EACEC,KADF,CACQb,kBAAkB,GAAGI,KAD7B,EACoCJ,kBAAkB,GAAGK,GADzD,EAEES,GAFF,CAEML,KAAK,IACR,6BAAC,mBAAD;AAAa,IAAA,GAAG,EAAG,QAAOA,KAAM;AAAhC,KACE,6BAAC,kBAAD;AACE,IAAA,OAAO,EAAEb,IAAI,KAAKa,KAAT,GAAiB,UAAjB,GAA8B,MADzC;AAEE,IAAA,OAAO,EAAE,MAAMZ,YAAN,aAAMA,YAAN,uBAAMA,YAAY,CAAGY,KAAH;AAF7B,KAIE,6BAAC,iBAAD;AAAM,IAAA,SAAS,EAAC,QAAhB;AAAyB,IAAA,UAAU,EAAC;AAApC,KACGA,KAAK,GAAG,CADX,CAJF,CADF,CAHH,CADH,CAXF,EA2BE,6BAAC,wBAAD;AACE,IAAA,OAAO,EAAE,MAAMZ,YAAN,aAAMA,YAAN,uBAAMA,YAAY,CAAGD,IAAI,GAAG,CAAV,CAD7B;AAEE,IAAA,QAAQ,EAAEA,IAAI,KAAKM,IAAI,CAACC,IAAL,CAAUR,SAAS,GAAGN,WAAtB,IAAqC;AAF1D,KAIE,6BAAC,iBAAD;AACE,IAAA,IAAI,EAAE,eADR;AAEE,IAAA,IAAI,EAAE,oBAFR;AAGE,IAAA,SAAS,EAAE;AAHb,IAJF,CA3BF,~~CAzBJ~~,CADF,CADF,CADF,CADF;~~AAyED~~,~~CAjHD~~;;~~eAmHekB~~,eAAMQ,IAAN,CAAW3B,MAAX,C","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} 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}\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}) => {\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\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 />\n </SelectContainer>\n )}\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 <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(getPaginationSlice().start, getPaginationSlice().end)\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 </FooterContainer>\n </TdFooterStyled>\n </Tr>\n </TFoot>\n );\n};\n\nexport default React.memo(Footer);\n"],"file":"Footer.js"}
1	+ {"version":3,"sources":["../../../../../src/components/organisms/DataGrid/Footer/Footer.tsx"],"names":["Footer","rowsPerPage","onRowsPerPageChange","rowsPerPageOptions","rowsPerPageLabel","exportFunction","exportLabel","rowsCount","page","onPageChange","pagination","Error","getPaginationSlice","totalPages","Math","ceil","start","end","handleRowsPerPage","React","useCallback","value","String","Array","keys","slice","map","memo"],"mappings":"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","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} 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}\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}) => {\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\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 {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 <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(getPaginationSlice().start, getPaginationSlice().end)\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 </FooterContainer>\n </TdFooterStyled>\n </Tr>\n </TFoot>\n );\n};\n\nexport default React.memo(Footer);\n"],"file":"Footer.js"}

package/dist/components/organisms/DataGrid/Header/Header.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/organisms/DataGrid/Header/Header.tsx"],"names":["Header","selectable","rowsCount","headers","data","rowKeyExtractor","selectedRows","onSelected","sortDirection","setSortDirection","React","useState","NEXT_STATE","initial","handleSortDirection","sort","handleSelectAll","checked","currentItemsOnData","unselectedItemsOnData","length","concat","map","label","justifyContent","display","alignItems","marginLeft"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;;;AAkBA,MAAMA,MAAM,GAAG,CAAuB;AACpCC,EAAAA,UADoC;AAEpCC,EAAAA,SAFoC;AAGpCC,EAAAA,OAHoC;AAIpCC,EAAAA,IAJoC;AAKpCC,EAAAA,eALoC;AAMpCC,EAAAA,YANoC;AAOpCC,EAAAA;AAPoC,CAAvB,KAQ+B;AAC5C,QAAM,CAACC,aAAD,EAAgBC,gBAAhB,IAAoCC,eAAMC,QAAN,CACxCC,kBAAWC,OAD6B,CAA1C;;AAIA,QAAMC,mBAAmB,GAAGC,IAAI,IAAI;AAClCA,IAAAA,IAAI,CAACH,kBAAWJ,aAAX,CAAD,CAAJ;AACAC,IAAAA,gBAAgB,CAACG,kBAAWJ,aAAX,CAAD,CAAhB;AACD,GAHD;;AAKA,QAAMQ,eAAe,GAAGC,OAAO,IAAI;AACjC,QAAI,CAACA,OAAL,EAAc;AACZV,MAAAA,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAG,EAAH,CAAV;AACA;AACD;;AAED,UAAMW,kBAAkB,GAAG,mCACzBZ,YADyB,EAEzBF,IAFyB,EAGzBC,eAHyB,CAA3B;AAMA,UAAMc,qBAAqB,GAAG,sCAC5Bb,YAD4B,EAE5BF,IAF4B,EAG5BC,eAH4B,CAA9B;;AAMA,QAAIY,OAAO,IAAIX,YAAY,CAACc,MAAb,GAAsB,CAArC,EAAwC;AACtCb,MAAAA,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAGH,IAAH,CAAV;AACA;AACD;;AACD,QAAIa,OAAO,IAAIC,kBAAkB,CAACE,MAAnB,GAA4B,CAA3C,EAA8C;AAC5Cb,MAAAA,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAGY,qBAAqB,CAACE,MAAtB,CAA6Bf,YAA7B,CAAH,CAAV;AACA;AACD;;AACDC,IAAAA,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAGD,YAAY,CAACe,MAAb,CAAoBF,qBAApB,CAAH,CAAV;AACD,GA3BD;;AA6BA,SACE,6BAAC,YAAD,QACE,6BAAC,SAAD,QACGlB,UAAU,IACT,6BAAC,sBAAD,QACE,6BAAC,mBAAD;AACE,IAAA,OAAO,EAAEC,SAAS,MAAKI,YAAL,aAAKA,YAAL,uBAAKA,YAAY,CAAEc,MAAnB,CADpB;AAEE,IAAA,QAAQ,EAAEJ;AAFZ,IADF,CAFJ,EASGb,OAAO,CAACmB,GAAR,CAAY,CAAC;AAAEC,IAAAA,KAAF;AAASR,IAAAA,IAAT;AAAeS,IAAAA,cAAc,GAAG;AAAhC,GAAD,KACX,6BAAC,SAAD;AAAI,IAAA,GAAG,EAAED;AAAT,KACE;AACE,IAAA,KAAK,EAAE;AACLE,MAAAA,OAAO,EAAE,MADJ;AAELC,MAAAA,UAAU,EAAE,QAFP;AAGLF,MAAAA;AAHK;AADT,KAOGD,KAPH,EAQGR,IAAI,IACH;AAAK,IAAA,KAAK,EAAE;AAAEY,MAAAA,UAAU,EAAE;AAAd;AAAZ,KACE,6BAAC,2BAAD;AAAkB,IAAA,OAAO,EAAE,MAAMb,mBAAmB,CAACC,IAAD;AAApD,KACE,6BAAC,eAAD;AACE,IAAA,IAAI,EAAG,qBAAoB,0BAAcP,aAAd,CAA6B,EAD1D;AAEE,IAAA,IAAI,EAAE,oBAFR;AAGE,IAAA,SAAS,EAAE,yBAAaA,aAAb;AAHb,IADF,CADF,CATJ,CADF,CADD,CATH,CADF,CADF;AAsCD,CArFD;;eAuFeR,M","sourcesContent":["import React from 'react';\nimport { Checkbox, Icon, PressableSurface } from '@tecsinapse/react-core';\nimport { Th, THead, Tr } from '../../../atoms/Table';\nimport { CheckboxHeader } from './styled';\nimport { HeadersType } from '../types';\nimport {\n findCurrentItemsOnData,\n findUnselectedItemsOnData,\n getIconColor,\n getIconSuffix,\n NEXT_STATE,\n} from './utils';\n\nexport interface DataGridHeaderProps<Data> {\n headers: HeadersType<Data>[];\n data: Data[];\n selectedRows: Data[];\n onSelected?: (data: Data[]) => void;\n rowKeyExtractor: (data: Data) => string;\n rowsCount: number;\n selectable?: boolean;\n}\n\nconst Header = <Data extends unknown>({\n selectable,\n rowsCount,\n headers,\n data,\n rowKeyExtractor,\n selectedRows,\n onSelected,\n}: DataGridHeaderProps<Data>): JSX.Element => {\n const [sortDirection, setSortDirection] = React.useState<~~string~~>(\n NEXT_STATE.initial\n );\n\n const handleSortDirection = sort => {\n sort(NEXT_STATE[sortDirection]);\n setSortDirection(NEXT_STATE[sortDirection]);\n };\n\n const handleSelectAll = checked => {\n if (!checked) {\n onSelected?.([]);\n return;\n }\n\n const currentItemsOnData = findCurrentItemsOnData(\n selectedRows,\n data,\n rowKeyExtractor\n );\n\n const unselectedItemsOnData = findUnselectedItemsOnData(\n selectedRows,\n data,\n rowKeyExtractor\n );\n\n if (checked && selectedRows.length < 1) {\n onSelected?.(data);\n return;\n }\n if (checked && currentItemsOnData.length < 1) {\n onSelected?.(unselectedItemsOnData.concat(selectedRows));\n return;\n }\n onSelected?.(selectedRows.concat(unselectedItemsOnData));\n };\n\n return (\n <THead>\n <Tr>\n {selectable && (\n <CheckboxHeader>\n <Checkbox\n checked={rowsCount === selectedRows?.length}\n onChange={handleSelectAll}\n />\n </CheckboxHeader>\n )}\n {headers.map(({ label, sort, justifyContent = 'flex-start' }) => (\n <Th key={label}>\n <div\n style={{\n display: 'flex',\n alignItems: 'center',\n justifyContent,\n }}\n >\n {label}\n {sort && (\n <div style={{ marginLeft: 8 }}>\n <PressableSurface onPress={() => handleSortDirection(sort)}>\n <Icon\n name={`sort-alphabetical-${getIconSuffix(sortDirection)}`}\n type={'material-community'}\n fontColor={getIconColor(sortDirection)}\n />\n </PressableSurface>\n </div>\n )}\n </div>\n </Th>\n ))}\n </Tr>\n </THead>\n );\n};\n\nexport default Header;\n"],"file":"Header.js"}
1	+ {"version":3,"sources":["../../../../../src/components/organisms/DataGrid/Header/Header.tsx"],"names":["Header","selectable","rowsCount","headers","data","rowKeyExtractor","selectedRows","onSelected","sortDirection","setSortDirection","React","useState","NEXT_STATE","initial","handleSortDirection","sort","handleSelectAll","checked","currentItemsOnData","unselectedItemsOnData","length","concat","map","label","justifyContent","display","alignItems","marginLeft"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;AACA;;AAEA;;;;AAkBA,MAAMA,MAAM,GAAG,CAAuB;AACpCC,EAAAA,UADoC;AAEpCC,EAAAA,SAFoC;AAGpCC,EAAAA,OAHoC;AAIpCC,EAAAA,IAJoC;AAKpCC,EAAAA,eALoC;AAMpCC,EAAAA,YANoC;AAOpCC,EAAAA;AAPoC,CAAvB,KAQ+B;AAC5C,QAAM,CAACC,aAAD,EAAgBC,gBAAhB,IAAoCC,eAAMC,QAAN,CACxCC,kBAAWC,OAD6B,CAA1C;;AAIA,QAAMC,mBAAmB,GAAGC,IAAI,IAAI;AAClCA,IAAAA,IAAI,CAACH,kBAAWJ,aAAX,CAAD,CAAJ;AACAC,IAAAA,gBAAgB,CAACG,kBAAWJ,aAAX,CAAD,CAAhB;AACD,GAHD;;AAKA,QAAMQ,eAAe,GAAGC,OAAO,IAAI;AACjC,QAAI,CAACA,OAAL,EAAc;AACZV,MAAAA,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAG,EAAH,CAAV;AACA;AACD;;AAED,UAAMW,kBAAkB,GAAG,mCACzBZ,YADyB,EAEzBF,IAFyB,EAGzBC,eAHyB,CAA3B;AAMA,UAAMc,qBAAqB,GAAG,sCAC5Bb,YAD4B,EAE5BF,IAF4B,EAG5BC,eAH4B,CAA9B;;AAMA,QAAIY,OAAO,IAAIX,YAAY,CAACc,MAAb,GAAsB,CAArC,EAAwC;AACtCb,MAAAA,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAGH,IAAH,CAAV;AACA;AACD;;AACD,QAAIa,OAAO,IAAIC,kBAAkB,CAACE,MAAnB,GAA4B,CAA3C,EAA8C;AAC5Cb,MAAAA,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAGY,qBAAqB,CAACE,MAAtB,CAA6Bf,YAA7B,CAAH,CAAV;AACA;AACD;;AACDC,IAAAA,UAAU,SAAV,IAAAA,UAAU,WAAV,YAAAA,UAAU,CAAGD,YAAY,CAACe,MAAb,CAAoBF,qBAApB,CAAH,CAAV;AACD,GA3BD;;AA6BA,SACE,6BAAC,YAAD,QACE,6BAAC,SAAD,QACGlB,UAAU,IACT,6BAAC,sBAAD,QACE,6BAAC,mBAAD;AACE,IAAA,OAAO,EAAEC,SAAS,MAAKI,YAAL,aAAKA,YAAL,uBAAKA,YAAY,CAAEc,MAAnB,CADpB;AAEE,IAAA,QAAQ,EAAEJ;AAFZ,IADF,CAFJ,EASGb,OAAO,CAACmB,GAAR,CAAY,CAAC;AAAEC,IAAAA,KAAF;AAASR,IAAAA,IAAT;AAAeS,IAAAA,cAAc,GAAG;AAAhC,GAAD,KACX,6BAAC,SAAD;AAAI,IAAA,GAAG,EAAED;AAAT,KACE;AACE,IAAA,KAAK,EAAE;AACLE,MAAAA,OAAO,EAAE,MADJ;AAELC,MAAAA,UAAU,EAAE,QAFP;AAGLF,MAAAA;AAHK;AADT,KAOGD,KAPH,EAQGR,IAAI,IACH;AAAK,IAAA,KAAK,EAAE;AAAEY,MAAAA,UAAU,EAAE;AAAd;AAAZ,KACE,6BAAC,2BAAD;AAAkB,IAAA,OAAO,EAAE,MAAMb,mBAAmB,CAACC,IAAD;AAApD,KACE,6BAAC,eAAD;AACE,IAAA,IAAI,EAAG,qBAAoB,0BAAcP,aAAd,CAA6B,EAD1D;AAEE,IAAA,IAAI,EAAE,oBAFR;AAGE,IAAA,SAAS,EAAE,yBAAaA,aAAb;AAHb,IADF,CADF,CATJ,CADF,CADD,CATH,CADF,CADF;AAsCD,CArFD;;eAuFeR,M","sourcesContent":["import React from 'react';\nimport { Checkbox, Icon, PressableSurface } from '@tecsinapse/react-core';\nimport { Th, THead, Tr } from '../../../atoms/Table';\nimport { CheckboxHeader } from './styled';\nimport { HeadersType, SortState } from '../types';\nimport {\n findCurrentItemsOnData,\n findUnselectedItemsOnData,\n getIconColor,\n getIconSuffix,\n NEXT_STATE,\n} from './utils';\n\nexport interface DataGridHeaderProps<Data> {\n headers: HeadersType<Data>[];\n data: Data[];\n selectedRows: Data[];\n onSelected?: (data: Data[]) => void;\n rowKeyExtractor: (data: Data) => string;\n rowsCount: number;\n selectable?: boolean;\n}\n\nconst Header = <Data extends unknown>({\n selectable,\n rowsCount,\n headers,\n data,\n rowKeyExtractor,\n selectedRows,\n onSelected,\n}: DataGridHeaderProps<Data>): JSX.Element => {\n const [sortDirection, setSortDirection] = React.useState<SortState>(\n NEXT_STATE.initial\n );\n\n const handleSortDirection = sort => {\n sort(NEXT_STATE[sortDirection]);\n setSortDirection(NEXT_STATE[sortDirection]);\n };\n\n const handleSelectAll = checked => {\n if (!checked) {\n onSelected?.([]);\n return;\n }\n\n const currentItemsOnData = findCurrentItemsOnData(\n selectedRows,\n data,\n rowKeyExtractor\n );\n\n const unselectedItemsOnData = findUnselectedItemsOnData(\n selectedRows,\n data,\n rowKeyExtractor\n );\n\n if (checked && selectedRows.length < 1) {\n onSelected?.(data);\n return;\n }\n if (checked && currentItemsOnData.length < 1) {\n onSelected?.(unselectedItemsOnData.concat(selectedRows));\n return;\n }\n onSelected?.(selectedRows.concat(unselectedItemsOnData));\n };\n\n return (\n <THead>\n <Tr>\n {selectable && (\n <CheckboxHeader>\n <Checkbox\n checked={rowsCount === selectedRows?.length}\n onChange={handleSelectAll}\n />\n </CheckboxHeader>\n )}\n {headers.map(({ label, sort, justifyContent = 'flex-start' }) => (\n <Th key={label}>\n <div\n style={{\n display: 'flex',\n alignItems: 'center',\n justifyContent,\n }}\n >\n {label}\n {sort && (\n <div style={{ marginLeft: 8 }}>\n <PressableSurface onPress={() => handleSortDirection(sort)}>\n <Icon\n name={`sort-alphabetical-${getIconSuffix(sortDirection)}`}\n type={'material-community'}\n fontColor={getIconColor(sortDirection)}\n />\n </PressableSurface>\n </div>\n )}\n </div>\n </Th>\n ))}\n </Tr>\n </THead>\n );\n};\n\nexport default Header;\n"],"file":"Header.js"}

package/dist/components/organisms/DataGrid/Header/utils.d.ts CHANGED Viewed

@@ -1,10 +1,8 @@
+import { SortState } from '../types';
 export declare const NEXT_STATE: {
-    unsorted: string;
-    ascending: string;
-    descending: string;
-    initial: string;
+    [key: string]: SortState;
 };
-export declare const getIconSuffix: (state: any) => any;
-export declare const getIconColor: (state: any) => "medium" | "orange";
-export declare const findUnselectedItemsOnData: (selected: any, data: any, rowKeyExtractor: any) => any;
-export declare const findCurrentItemsOnData: (selected: any, data: any, rowKeyExtractor: any) => any;
+export declare const getIconSuffix: (state: SortState) => string;
+export declare const getIconColor: (state: SortState) => 'medium' | 'orange';
+export declare const findUnselectedItemsOnData: <T>(selected: T[], data: T[], rowKeyExtractor: (t: T) => string) => T[];
+export declare const findCurrentItemsOnData: <T>(selected: T[], data: T[], rowKeyExtractor: (t: T) => string) => T[];

package/dist/components/organisms/DataGrid/Header/utils.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../../../../src/components/organisms/DataGrid/Header/utils.ts"],"names":["NEXT_STATE","unsorted","ascending","descending","initial","getIconSuffix","state","getIconColor","findUnselectedItemsOnData","selected","data","rowKeyExtractor","length","filter","item","every","rowData","findCurrentItemsOnData","some"],"mappings":";;;;;;~~AAAO~~,MAAMA,~~UAAU~~,GAAG;~~AACxBC~~,EAAAA,QAAQ,EAAE,~~WADc~~;~~AAExBC~~,EAAAA,SAAS,EAAE,~~YAFa~~;~~AAGxBC~~,EAAAA,UAAU,EAAE,~~UAHY~~;~~AAIxBC~~,EAAAA,OAAO,EAAE;~~AAJe~~,~~CAAnB~~;;;AAOA,MAAMC,aAAa,~~GAAGC~~,~~KAAK~~,~~IAChCA~~,KAAK,KAAK,UAAV,GAAuB,WAAvB,GAAqCA,KADhC;;;;AAGA,MAAMC,YAAY,~~GAAGD~~,~~KAAK~~,~~IAC/BA~~,KAAK,KAAK,UAAV,GAAuB,QAAvB,GAAkC,QAD7B;;;;AAGA,MAAME,yBAAyB,GAAG,~~CAACC~~,~~QAAD~~,~~EAAWC~~,~~IAAX~~,~~EAAiBC~~,~~eAAjB~~,~~KACvCF~~,QAAQ,CAACG,MAAT,GAAkB,CAAlB,GACIF,IAAI,CAACG,MAAL,CAAYC,IAAI,IACdL,QAAQ,CAACM,KAAT,CACEC,OAAO,IAAIL,eAAe,CAACK,OAAD,CAAf,KAA6BL,eAAe,CAACG,IAAD,CADzD,CADF,CADJ,GAMI,~~EAPC~~;;;;~~AASA~~,MAAMG,sBAAsB,GAAG,~~CAACR~~,~~QAAD~~,~~EAAWC~~,~~IAAX~~,~~EAAiBC~~,~~eAAjB~~,~~KACpCF~~,QAAQ,CAACG,MAAT,GAAkB,CAAlB,GACIH,QAAQ,CAACI,MAAT,CAAgBC,IAAI,IAClBJ,IAAI,CAACQ,IAAL,CAAUF,OAAO,IAAIL,eAAe,CAACK,OAAD,CAAf,KAA6BL,eAAe,CAACG,IAAD,CAAjE,CADF,CADJ,GAII,~~EALC~~","sourcesContent":["~~export~~ const NEXT_STATE = {\n unsorted: 'ascending',\n ascending: 'descending',\n descending: 'unsorted',\n initial: 'unsorted',\n};\n\nexport const getIconSuffix = state =>\n state === 'unsorted' ? 'ascending' : state;\n\nexport const getIconColor = state =>\n state === 'unsorted' ? 'medium' : 'orange';\n\nexport const findUnselectedItemsOnData = (selected, data, rowKeyExtractor) =>\n selected.length > 0\n ? data.filter(item =>\n selected.every(\n rowData => rowKeyExtractor(rowData) !== rowKeyExtractor(item)\n )\n )\n : [];\n\nexport const findCurrentItemsOnData = (selected, data, rowKeyExtractor) =>\n selected.length > 0\n ? selected.filter(item =>\n data.some(rowData => rowKeyExtractor(rowData) === rowKeyExtractor(item))\n )\n : [];\n"],"file":"utils.js"}
1	+ {"version":3,"sources":["../../../../../src/components/organisms/DataGrid/Header/utils.ts"],"names":["NEXT_STATE","unsorted","ascending","descending","initial","getIconSuffix","state","getIconColor","findUnselectedItemsOnData","selected","data","rowKeyExtractor","length","filter","item","every","rowData","findCurrentItemsOnData","some"],"mappings":";;;;;;AAEO,MAAMA,UAAwC,GAAG;AACtDC,EAAAA,QAAQ,EAAE,WAD4C;AAEtDC,EAAAA,SAAS,EAAE,YAF2C;AAGtDC,EAAAA,UAAU,EAAE,UAH0C;AAItDC,EAAAA,OAAO,EAAE;AAJ6C,CAAjD;;;AAOA,MAAMC,aAAa,GAAIC,KAAD,IAC3BA,KAAK,KAAK,UAAV,GAAuB,WAAvB,GAAqCA,KADhC;;;;AAGA,MAAMC,YAAY,GAAID,KAAD,IAC1BA,KAAK,KAAK,UAAV,GAAuB,QAAvB,GAAkC,QAD7B;;;;AAGA,MAAME,yBAAyB,GAAG,CACvCC,QADuC,EAEvCC,IAFuC,EAGvCC,eAHuC,KAKvCF,QAAQ,CAACG,MAAT,GAAkB,CAAlB,GACIF,IAAI,CAACG,MAAL,CAAYC,IAAI,IACdL,QAAQ,CAACM,KAAT,CACEC,OAAO,IAAIL,eAAe,CAACK,OAAD,CAAf,KAA6BL,eAAe,CAACG,IAAD,CADzD,CADF,CADJ,GAMI,EAXC;;;;AAaA,MAAMG,sBAAsB,GAAG,CACpCR,QADoC,EAEpCC,IAFoC,EAGpCC,eAHoC,KAKpCF,QAAQ,CAACG,MAAT,GAAkB,CAAlB,GACIH,QAAQ,CAACI,MAAT,CAAgBC,IAAI,IAClBJ,IAAI,CAACQ,IAAL,CAAUF,OAAO,IAAIL,eAAe,CAACK,OAAD,CAAf,KAA6BL,eAAe,CAACG,IAAD,CAAjE,CADF,CADJ,GAII,EATC","sourcesContent":["import { SortState } from '../types';\n\nexport const NEXT_STATE: { [key: string]: SortState } = {\n unsorted: 'ascending',\n ascending: 'descending',\n descending: 'unsorted',\n initial: 'unsorted',\n};\n\nexport const getIconSuffix = (state: SortState): string =>\n state === 'unsorted' ? 'ascending' : state;\n\nexport const getIconColor = (state: SortState): 'medium' \| 'orange' =>\n state === 'unsorted' ? 'medium' : 'orange';\n\nexport const findUnselectedItemsOnData = <T>(\n selected: T[],\n data: T[],\n rowKeyExtractor: (t: T) => string\n): T[] =>\n selected.length > 0\n ? data.filter(item =>\n selected.every(\n rowData => rowKeyExtractor(rowData) !== rowKeyExtractor(item)\n )\n )\n : [];\n\nexport const findCurrentItemsOnData = <T>(\n selected: T[],\n data: T[],\n rowKeyExtractor: (t: T) => string\n): T[] =>\n selected.length > 0\n ? selected.filter(item =>\n data.some(rowData => rowKeyExtractor(rowData) === rowKeyExtractor(item))\n )\n : [];\n"],"file":"utils.js"}

package/dist/components/organisms/DataGrid/types.d.ts CHANGED Viewed

@@ -1,7 +1,8 @@
 import React from 'react';
+export declare type SortState = 'ascending' | 'descending' | 'unsorted';
 export declare type HeadersType<Data> = {
     label: string;
     render: (data: Data) => React.ReactNode;
-    sort?: (direction: 'ascending' | 'descending' | 'unsorted') => void;
+    sort?: (direction: SortState) => void;
     justifyContent?: 'flex-start' | 'center' | 'flex-end';
 };

package/dist/hooks/useClickAwayListener.d.ts CHANGED Viewed

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const useClickAwayListener: (ref: React.MutableRefObject<any>, setVisible: React.Dispatch<React.SetStateAction<boolean>>) => void;
+export declare const useClickAwayListener: (ref: React.MutableRefObject<any>, setVisible: React.Dispatch<React.SetStateAction<boolean>>, event?: 'mouseup' | 'mousedown' | undefined) => void;

package/dist/hooks/useClickAwayListener.js CHANGED Viewed

@@ -9,7 +9,7 @@ var _react = _interopRequireDefault(require("react"));
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-const useClickAwayListener = (ref, setVisible) => {
+const useClickAwayListener = (ref, setVisible, event = 'mousedown') => {
   _react.default.useEffect(() => {
     const handleClickOutside = event => {
       if (ref.current && !ref.current.contains(event.target)) {
@@ -17,9 +17,9 @@ const useClickAwayListener = (ref, setVisible) => {
       }
     };
-    document.addEventListener('mousedown', handleClickOutside);
+    document.addEventListener(event, handleClickOutside);
     return () => {
-      document.removeEventListener('mousedown', handleClickOutside);
+      document.removeEventListener(event, handleClickOutside);
     };
   }, [ref]);
 };

package/dist/hooks/useClickAwayListener.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"sources":["../../src/hooks/useClickAwayListener.ts"],"names":["useClickAwayListener","ref","setVisible","React","useEffect","handleClickOutside","~~event","~~current","contains","target","document","addEventListener","removeEventListener"],"mappings":";;;;;;;AAAA;;;;AAEO,MAAMA,oBAAoB,GAAG,CAClCC,GADkC,EAElCC,UAFkC,~~KAG/B~~;~~AACHC~~,iBAAMC,SAAN,CAAgB,MAAM;AACpB,UAAMC,kBAAkB,~~GAAGC~~,KAAK,IAAI;AAClC,~~UAAIL~~,GAAG,CAACM,OAAJ,IAAe,CAACN,GAAG,CAACM,OAAJ,CAAYC,QAAZ,~~CAAqBF~~,KAAK,~~CAACG~~,MAA3B,CAApB,EAAwD;AACtDP,QAAAA,UAAU,CAAC,KAAD,CAAV;AACD;AACF,KAJD;;AAKAQ,IAAAA,QAAQ,CAACC,gBAAT,~~CAA0B~~,~~WAA1B~~,~~EAAuCN~~,~~kBAAvC~~;AACA,WAAO,MAAM;~~AACXK~~,MAAAA,QAAQ,CAACE,mBAAT,~~CAA6B~~,~~WAA7B~~,~~EAA0CP~~,~~kBAA1C~~;AACD,KAFD;AAGD,GAVD,EAUG,~~CAACJ~~,GAAD,CAVH;AAWD,~~CAfM~~","sourcesContent":["import React from 'react';\n\nexport const useClickAwayListener = (\n ref: React.MutableRefObject<any>,\n setVisible: React.Dispatch<React.SetStateAction<boolean~~>>\~~n) => {\n React.useEffect(() => {\n const handleClickOutside = event => {\n if (ref.current && !ref.current.contains(event.target)) {\n setVisible(false);\n }\n };\n document.addEventListener(~~'mousedown'~~, handleClickOutside);\n return () => {\n document.removeEventListener(~~'mousedown'~~, handleClickOutside);\n };\n }, [ref]);\n};\n"],"file":"useClickAwayListener.js"}
1	+ {"version":3,"sources":["../../src/hooks/useClickAwayListener.ts"],"names":["useClickAwayListener","ref","setVisible","event","React","useEffect","handleClickOutside","current","contains","target","document","addEventListener","removeEventListener"],"mappings":";;;;;;;AAAA;;;;AAEO,MAAMA,oBAAoB,GAAG,CAClCC,GADkC,EAElCC,UAFkC,EAGlCC,KAA0C,GAAG,WAHX,KAIzB;AACTC,iBAAMC,SAAN,CAAgB,MAAM;AACpB,UAAMC,kBAAkB,GAAGH,KAAK,IAAI;AAClC,UAAIF,GAAG,CAACM,OAAJ,IAAe,CAACN,GAAG,CAACM,OAAJ,CAAYC,QAAZ,CAAqBL,KAAK,CAACM,MAA3B,CAApB,EAAwD;AACtDP,QAAAA,UAAU,CAAC,KAAD,CAAV;AACD;AACF,KAJD;;AAKAQ,IAAAA,QAAQ,CAACC,gBAAT,CAA0BR,KAA1B,EAAiCG,kBAAjC;AACA,WAAO,MAAM;AACXI,MAAAA,QAAQ,CAACE,mBAAT,CAA6BT,KAA7B,EAAoCG,kBAApC;AACD,KAFD;AAGD,GAVD,EAUG,CAACL,GAAD,CAVH;AAWD,CAhBM","sourcesContent":["import React from 'react';\n\nexport const useClickAwayListener = (\n ref: React.MutableRefObject<any>,\n setVisible: React.Dispatch<React.SetStateAction<boolean>>,\n event: 'mouseup' \| 'mousedown' \| undefined = 'mousedown'\n): void => {\n React.useEffect(() => {\n const handleClickOutside = event => {\n if (ref.current && !ref.current.contains(event.target)) {\n setVisible(false);\n }\n };\n document.addEventListener(event, handleClickOutside);\n return () => {\n document.removeEventListener(event, handleClickOutside);\n };\n }, [ref]);\n};\n"],"file":"useClickAwayListener.js"}

package/dist/index.d.ts CHANGED Viewed

@@ -14,4 +14,5 @@ export { Accordion, AccordionProps } from './components/atoms/Accordion';
 export { DataGrid, DataGridProps, HeadersType, } from './components/organisms/DataGrid';
 export { Modal, ModalProps } from './components/atoms/Modal';
 export { TextArea, TextAreaProps } from './components/molecules/TextArea';
+export { Tooltip, ITooltip } from './components/atoms/Tooltip';
 export * from './hooks';

package/dist/index.js CHANGED Viewed

@@ -39,7 +39,9 @@ var _exportNames = {
   Modal: true,
   ModalProps: true,
   TextArea: true,
-  TextAreaProps: true
+  TextAreaProps: true,
+  Tooltip: true,
+  ITooltip: true
 };
 Object.defineProperty(exports, "Badge", {
   enumerable: true,
@@ -257,6 +259,18 @@ Object.defineProperty(exports, "TextAreaProps", {
     return _TextArea.TextAreaProps;
   }
 });
+Object.defineProperty(exports, "Tooltip", {
+  enumerable: true,
+  get: function () {
+    return _Tooltip.Tooltip;
+  }
+});
+Object.defineProperty(exports, "ITooltip", {
+  enumerable: true,
+  get: function () {
+    return _Tooltip.ITooltip;
+  }
+});
 var _reactCore = require("@tecsinapse/react-core");
@@ -302,6 +316,8 @@ var _Modal = require("./components/atoms/Modal");
 var _TextArea = require("./components/molecules/TextArea");
+var _Tooltip = require("./components/atoms/Tooltip");
 var _hooks = require("./hooks");
 Object.keys(_hooks).forEach(function (key) {

package/dist/index.js.map CHANGED Viewed

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

package/package.json CHANGED Viewed

@@ -1,7 +1,7 @@
 {
   "name": "@tecsinapse/react-web-kit",
   "description": "TecSinapse React components",
-  "version": "1.8.0",
+  "version": "1.10.2",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
   "license": "MIT",
@@ -14,7 +14,7 @@
     "@emotion/native": "^11.0.0",
     "@emotion/react": "^11.4.1",
     "@emotion/styled": "^11.3.0",
-    "@tecsinapse/react-core": "^1.8.0",
+    "@tecsinapse/react-core": "^1.10.1",
     "@types/react-native": "^0.64.4",
     "react-native-vector-icons": "^8.1.0",
     "react-transition-group": "^4.4.2"
@@ -33,5 +33,5 @@
     "react-dom": ">=16.8.0",
     "react-native-web": "^0.17.1"
   },
-  "gitHead": "007818f30ad4257a740f6abe53c10495b1187ac1"
+  "gitHead": "68cf48b922cfcdd0b4e734541d00f7021f4bc575"
 }

package/src/components/atoms/Button/Button.tsx CHANGED Viewed

@@ -7,12 +7,12 @@ import { StyledWebButton } from './styled';
  * TODO: Add a property 'defaultElement' to render a default
  * component and provide some button's state to it.
  */
-export interface WebButtonProps extends ButtonProps {
+export type WebButtonProps = ButtonProps & {
   onMouseOver?: () => void;
   onMouseOut?: () => void;
-}
+};
-const Button: FC<ButtonProps> = ({
+const Button: FC<WebButtonProps> = ({
   children,
   disabled,
   frozen,

package/src/components/atoms/Input/Input.stories.tsx CHANGED Viewed

@@ -9,7 +9,7 @@ export default {
 };
 const Template: Story<InputWebProps> = args => {
-  const [value, setValue] = useState<string>();
+  const [value, setValue] = useState<string>('');
   const onChange = text => {
     setValue(text);

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

@@ -13,64 +13,72 @@ export interface InputWebProps
   extends Omit<InputElementProps, 'style'>,
     InputContainerProps {}
-const Input: FC<InputWebProps> = ({
-  label,
-  labelColor,
-  labelColorVariant,
-  labelColorTone,
-  labelTypography,
-  labelStack,
-  labelWeight,
-  leftComponent,
-  rightComponent,
-  disabled,
-  style,
-  borderColor,
-  borderColorGradation,
-  inputContainerStyle,
-  variant = 'default',
-  hintComponent,
-  hint,
-  onFocus,
-  onBlur,
-  ...rest
-}) => {
-  const _hint = hintComponent || <Hint text={hint} variant={variant} />;
-  const { focused, handleBlur, handleFocus } = useInputFocus(
-    onFocus,
-    onBlur,
-    !disabled
-  );
+const Input: FC<InputWebProps> = React.forwardRef(
+  (
+    {
+      label,
+      labelColor,
+      labelColorVariant,
+      labelColorTone,
+      labelTypography,
+      labelStack,
+      labelWeight,
+      leftComponent,
+      rightComponent,
+      disabled,
+      style,
+      borderColor,
+      borderColorGradation,
+      inputContainerStyle,
+      variant = 'default',
+      hintComponent,
+      hint,
+      onFocus,
+      onBlur,
+      ...rest
+    },
+    ref
+  ) => {
+    const _hint = hintComponent || <Hint text={hint} variant={variant} />;
+    const { focused, handleBlur, handleFocus } = useInputFocus(
+      onFocus,
+      onBlur,
+      !disabled
+    );
-  return (
-    <View style={style}>
-      <InputContainer
-        label={label}
-        labelColor={labelColor}
-        labelColorVariant={labelColorVariant}
-        labelColorTone={labelColorTone}
-        labelTypography={labelTypography}
-        labelStack={labelStack}
-        labelWeight={labelWeight}
-        leftComponent={leftComponent}
-        rightComponent={rightComponent}
-        borderColor={borderColor}
-        borderColorGradation={borderColorGradation}
-        inputContainerStyle={inputContainerStyle}
-        focused={focused}
-        disabled={disabled}
-        variant={variant}
-      >
-        <StyledWebTextInput
-          {...rest}
+    return (
+      <View style={style}>
+        <InputContainer
+          label={label}
+          labelColor={labelColor}
+          labelColorVariant={labelColorVariant}
+          labelColorTone={labelColorTone}
+          labelTypography={labelTypography}
+          labelStack={labelStack}
+          labelWeight={labelWeight}
+          leftComponent={leftComponent}
+          rightComponent={rightComponent}
+          borderColor={borderColor}
+          borderColorGradation={borderColorGradation}
+          inputContainerStyle={inputContainerStyle}
+          focused={focused}
           disabled={disabled}
-          onFocus={handleFocus}
-          onBlur={handleBlur}
-        />
-      </InputContainer>
-      {hint && _hint}
-    </View>
-  );
-};
+          variant={variant}
+        >
+          <StyledWebTextInput
+            {...rest}
+            ref={ref}
+            disabled={disabled}
+            onFocus={handleFocus}
+            onBlur={handleBlur}
+          />
+        </InputContainer>
+        {hint && _hint}
+      </View>
+    );
+  }
+);
+Input.displayName = 'Input';
 export default Input;

package/src/components/atoms/Table/Header/THead.tsx CHANGED Viewed

@@ -1,6 +1,6 @@
 import React from 'react';
 import { HeaderBackground, THeadStyled } from './styled';
-import Tr from '../Row/Tr';
+import { Tr } from '../Row/Tr';
 const THead: React.FC<React.HTMLAttributes<HTMLTableSectionElement>> = ({
   children,

package/src/components/atoms/Tooltip/Tooltip.stories.tsx ADDED Viewed

@@ -0,0 +1,30 @@
+import React from 'react';
+import { Story } from '@storybook/react';
+import Tooltip, { ITooltip } from './Tooltip';
+import { Button } from '../Button';
+import { Text } from '@tecsinapse/react-core';
+export default {
+  title: 'Web/Tooltip',
+  component: Tooltip,
+};
+const Template: Story<ITooltip> = args => {
+  return (
+    <div style={{ display: 'flex', flexDirection: 'column' }}>
+      <Tooltip {...args}>
+        <Button>
+          <Text fontColor="light" fontWeight="bold">
+            Hover me
+          </Text>
+        </Button>
+      </Tooltip>
+    </div>
+  );
+};
+export const Base = Template.bind({});
+Base.args = {
+  title: 'Tooltip',
+};

package/src/components/atoms/Tooltip/Tooltip.tsx ADDED Viewed

@@ -0,0 +1,51 @@
+import React from 'react';
+import { Text } from '@tecsinapse/react-core';
+import { Container, TooltipSpan } from './styled';
+export type ComputedType = { width?: number; height?: number };
+export type Position = 'top' | 'bottom' | 'right' | 'left';
+export interface ITooltip {
+  title: string;
+  position?: Position;
+}
+const Tooltip: React.FC<ITooltip> = ({
+  children,
+  title,
+  position = 'bottom',
+}) => {
+  const spanRef = React.useRef<HTMLSpanElement | null>();
+  const [computed, setComputed] = React.useState<ComputedType | undefined>(
+    undefined
+  );
+  React.useLayoutEffect(() => {
+    setComputed({
+      width: spanRef.current?.clientWidth,
+      height: spanRef.current?.clientHeight,
+    });
+  }, []);
+  return (
+    <Container position={position}>
+      {children}
+      <TooltipSpan
+        computed={computed}
+        position={position}
+        ref={ref => (spanRef.current = ref)}
+      >
+        <Text
+          fontWeight="bold"
+          typography="base"
+          colorVariant="secondary"
+          colorTone="xlight"
+        >
+          {title}
+        </Text>
+      </TooltipSpan>
+    </Container>
+  );
+};
+export default Tooltip;

package/src/components/atoms/Tooltip/index.ts ADDED Viewed

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