norma-library 0.6.4 → 0.6.6
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.
- package/dist/esm/components/UncontrolledTable/components/header/index.js +1 -1
- package/dist/esm/components/UncontrolledTable/components/header/styles.js +1 -1
- package/dist/esm/components/UncontrolledTable/components/header/styles.js.map +1 -1
- package/dist/esm/components/UncontrolledTable/index.js +2 -2
- package/dist/esm/components/UncontrolledTable/index.js.map +1 -1
- package/dist/esm/components/UncontrolledTable/interface.d.ts +1 -0
- package/dist/esm/components/UncontrolledTable/styles.d.ts +1 -0
- package/dist/esm/components/UncontrolledTable/styles.js +2 -2
- package/dist/esm/components/UncontrolledTable/styles.js.map +1 -1
- package/dist/esm/components/UncontrolledTabs/UncontrolledTabs.d.ts +2 -1
- package/dist/esm/components/UncontrolledTabs/UncontrolledTabs.js +5 -2
- package/dist/esm/components/UncontrolledTabs/UncontrolledTabs.js.map +1 -1
- package/dist/esm/components/UncontrolledTabs/UncontrolledTabsInfo.style.d.ts +2 -0
- package/dist/esm/components/UncontrolledTabs/UncontrolledTabsInfo.style.js +5 -0
- package/dist/esm/components/UncontrolledTabs/UncontrolledTabsInfo.style.js.map +1 -0
- package/package.json +1 -1
- package/src/components/UncontrolledTable/components/header/index.tsx +1 -1
- package/src/components/UncontrolledTable/components/header/styles.tsx +1 -0
- package/src/components/UncontrolledTable/index.tsx +2 -1
- package/src/components/UncontrolledTable/interface.ts +2 -0
- package/src/components/UncontrolledTable/styles.tsx +5 -5
- package/src/components/UncontrolledTabs/UncontrolledTabs.style.tsx +2 -0
- package/src/components/UncontrolledTabs/UncontrolledTabs.tsx +5 -2
- package/src/components/UncontrolledTabs/UncontrolledTabsInfo.style.ts +8 -0
- package/src/stories/UncontrolledTable.stories.tsx +2 -2
- package/src/stories/UncontrolledTabs.stories.tsx +11 -0
|
@@ -15,7 +15,7 @@ var Header = function (_a) {
|
|
|
15
15
|
showClearFiels && (React.createElement(S.TextClearSearch, { onClick: function () { return onClearFieldsClick && onClearFieldsClick(); } }, clearLabel || 'Limpar busca'))),
|
|
16
16
|
React.createElement(S.Tools, null,
|
|
17
17
|
showSettings ? (React.createElement(S.IconTools, { onClick: function () { return setOpenTools(!openTools); } },
|
|
18
|
-
React.createElement(SettingsIcon, { sx: { fontSize:
|
|
18
|
+
React.createElement(SettingsIcon, { sx: { fontSize: 18, color: '#DE8B50' } }))) : null,
|
|
19
19
|
customIcons &&
|
|
20
20
|
customIcons.map(function (IconComponent, index) { return (React.createElement(S.IconTools, { key: index }, IconComponent)); }),
|
|
21
21
|
openTools ? (React.createElement(S.ListTools, { ref: listToolsRef }, table.getAllLeafColumns().map(function (column) {
|
|
@@ -2,7 +2,7 @@ import { __makeTemplateObject } from "tslib";
|
|
|
2
2
|
import styled from 'styled-components';
|
|
3
3
|
export var Header = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n display: flex;\n justify-content: space-between;\n width: calc(100% - 32px);\n @media screen and (max-width: 1440px) {\n width: calc(100% - 16px);\n }\n margin: 0 auto;\n"], ["\n display: flex;\n justify-content: space-between;\n width: calc(100% - 32px);\n @media screen and (max-width: 1440px) {\n width: calc(100% - 16px);\n }\n margin: 0 auto;\n"])));
|
|
4
4
|
export var Results = styled.div(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: flex;\n flex-direction: column;\n gap: 8px;\n"], ["\n display: flex;\n flex-direction: column;\n gap: 8px;\n"])));
|
|
5
|
-
export var Tools = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n"], ["\n display: flex;\n"])));
|
|
5
|
+
export var Tools = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: flex;\n align-items: center;\n"], ["\n display: flex;\n align-items: center;\n"])));
|
|
6
6
|
export var TextResult = styled.div(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n color: #666666;\n font-size: 16px;\n"], ["\n color: #666666;\n font-size: 16px;\n"])));
|
|
7
7
|
export var TextClearSearchContent = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n height: 10px;\n"], ["\n height: 10px;\n"])));
|
|
8
8
|
export var TextClearSearch = styled.p(templateObject_6 || (templateObject_6 = __makeTemplateObject(["\n color: #de8b50;\n font-size: 14px;\n cursor: pointer;\n margin: 0;\n &:hover {\n text-decoration: underline;\n }\n"], ["\n color: #de8b50;\n font-size: 14px;\n cursor: pointer;\n margin: 0;\n &:hover {\n text-decoration: underline;\n }\n"])));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../../src/components/UncontrolledTable/components/header/styles.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,CAAC,IAAM,MAAM,GAAG,MAAM,CAAC,GAAG,2PAAK,wLAQpC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,OAAO,GAAG,MAAM,CAAC,GAAG,iIAAA,8DAIhC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,KAAK,GAAG,MAAM,CAAC,GAAG,
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../../../src/components/UncontrolledTable/components/header/styles.tsx"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,CAAC,IAAM,MAAM,GAAG,MAAM,CAAC,GAAG,2PAAK,wLAQpC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,OAAO,GAAG,MAAM,CAAC,GAAG,iIAAA,8DAIhC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,KAAK,GAAG,MAAM,CAAC,GAAG,iHAAA,8CAG9B,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,UAAU,GAAG,MAAM,CAAC,GAAG,8GAAA,2CAGnC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,sBAAsB,GAAG,MAAM,CAAC,GAAG,wFAAA,qBAE/C,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,eAAe,GAAG,MAAM,CAAC,CAAC,mMAAA,gIAQtC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,4HAAA,yDAIlC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,gZAAA,6UAiBlC,IAAA,CAAC"}
|
|
@@ -5,7 +5,7 @@ import { flexRender, getCoreRowModel, getSortedRowModel, useReactTable, } from '
|
|
|
5
5
|
import { Pagination, Header, TBody } from './components';
|
|
6
6
|
import useClickOutside from '../../hooks/useClickOutside';
|
|
7
7
|
var UncontrolledTable = function (props) {
|
|
8
|
-
var data = props.data, columns = props.columns, onClick = props.onClick, onMouseOver = props.onMouseOver, onMouseOut = props.onMouseOut, showTotalResults = props.showTotalResults, showSettings = props.showSettings, onChangePage = props.onChangePage, pagination = props.pagination, totalPages = props.totalPages, showClearFields = props.showClearFields, onClearFieldsClick = props.onClearFieldsClick, onFilterClick = props.onFilterClick, onSortClick = props.onSortClick, customTotalResults = props.customTotalResults, labels = props.labels, tableClassName = props.tableClassName, stickyHeader = props.stickyHeader;
|
|
8
|
+
var data = props.data, columns = props.columns, onClick = props.onClick, onMouseOver = props.onMouseOver, onMouseOut = props.onMouseOut, showTotalResults = props.showTotalResults, showSettings = props.showSettings, onChangePage = props.onChangePage, pagination = props.pagination, totalPages = props.totalPages, showClearFields = props.showClearFields, onClearFieldsClick = props.onClearFieldsClick, onFilterClick = props.onFilterClick, onSortClick = props.onSortClick, customTotalResults = props.customTotalResults, labels = props.labels, tableClassName = props.tableClassName, stickyHeader = props.stickyHeader, stickyHeaderP = props.stickyHeaderP;
|
|
9
9
|
var _a = useState(''), openFilterDialog = _a[0], setOpenFilterDialog = _a[1];
|
|
10
10
|
var _b = useState([]), sorting = _b[0], setSorting = _b[1];
|
|
11
11
|
var _c = useState([]), filterByColumn = _c[0], setFilterByColumn = _c[1];
|
|
@@ -36,7 +36,7 @@ var UncontrolledTable = function (props) {
|
|
|
36
36
|
return (React.createElement(S.Container, null,
|
|
37
37
|
React.createElement(Header, { table: table, globalFilters: globalFilters, orderSmallest: orderSmallest, orderLargest: orderLargest, showTotalResults: showTotalResults, showSettings: showSettings, setGlobalFilters: setGlobalFilters, setOrderLargest: setOrderLargest, setOrderSmallest: setOrderSmallest, showClearFiels: showClearFields, customTotalResults: customTotalResults, clearLabel: labels === null || labels === void 0 ? void 0 : labels.clearFilter, onClearFieldsClick: function () { return onClearFieldsClick && onClearFieldsClick(); }, customIcons: props.customIcons }),
|
|
38
38
|
React.createElement(S.Table, { className: tableClassName || '' },
|
|
39
|
-
React.createElement(S.Thead, { "$sticky": stickyHeader }, table.getHeaderGroups().map(function (headerGroup) { return (React.createElement(S.TableRow, { key: headerGroup.id }, headerGroup.headers.map(function (header) {
|
|
39
|
+
React.createElement(S.Thead, { "$sticky": stickyHeader, "$stickyTopP": stickyHeaderP }, table.getHeaderGroups().map(function (headerGroup) { return (React.createElement(S.TableRow, { key: headerGroup.id }, headerGroup.headers.map(function (header) {
|
|
40
40
|
var _a, _b, _c, _d;
|
|
41
41
|
return (React.createElement(S.Th, { key: header.id },
|
|
42
42
|
React.createElement(S.ColumnContent, { onClick: function () {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/UncontrolledTable/index.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,KAAK,CAAC,MAAM,UAAU,CAAC;AAE9B,OAAO,EACL,UAAU,EACV,eAAe,EACf,iBAAiB,EACjB,aAAa,GAGd,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAEzD,OAAO,eAAe,MAAM,6BAA6B,CAAC;AAE1D,IAAM,iBAAiB,GAAG,UAAC,KAA6B;IAEpD,IAAA,IAAI,
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/UncontrolledTable/index.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAK,EAAE,EAAE,QAAQ,EAAE,OAAO,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AACzD,OAAO,KAAK,CAAC,MAAM,UAAU,CAAC;AAE9B,OAAO,EACL,UAAU,EACV,eAAe,EACf,iBAAiB,EACjB,aAAa,GAGd,MAAM,uBAAuB,CAAC;AAE/B,OAAO,EAAE,UAAU,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,cAAc,CAAC;AAEzD,OAAO,eAAe,MAAM,6BAA6B,CAAC;AAE1D,IAAM,iBAAiB,GAAG,UAAC,KAA6B;IAEpD,IAAA,IAAI,GAmBF,KAAK,KAnBH,EACJ,OAAO,GAkBL,KAAK,QAlBA,EACP,OAAO,GAiBL,KAAK,QAjBA,EACP,WAAW,GAgBT,KAAK,YAhBI,EACX,UAAU,GAeR,KAAK,WAfG,EACV,gBAAgB,GAcd,KAAK,iBAdS,EAChB,YAAY,GAaV,KAAK,aAbK,EACZ,YAAY,GAYV,KAAK,aAZK,EACZ,UAAU,GAWR,KAAK,WAXG,EACV,UAAU,GAUR,KAAK,WAVG,EACV,eAAe,GASb,KAAK,gBATQ,EACf,kBAAkB,GAQhB,KAAK,mBARW,EAClB,aAAa,GAOX,KAAK,cAPM,EACb,WAAW,GAMT,KAAK,YANI,EACX,kBAAkB,GAKhB,KAAK,mBALW,EAClB,MAAM,GAIJ,KAAK,OAJD,EACN,cAAc,GAGZ,KAAK,eAHO,EACd,YAAY,GAEV,KAAK,aAFK,EACZ,aAAa,GACX,KAAK,cADM,CACL;IAEJ,IAAA,KAA0C,QAAQ,CAAC,EAAE,CAAC,EAArD,gBAAgB,QAAA,EAAE,mBAAmB,QAAgB,CAAC;IACvD,IAAA,KAAwB,QAAQ,CAAM,EAAE,CAAC,EAAxC,OAAO,QAAA,EAAE,UAAU,QAAqB,CAAC;IAC1C,IAAA,KAAsC,QAAQ,CAAqB,EAAE,CAAC,EAArE,cAAc,QAAA,EAAE,iBAAiB,QAAoC,CAAC;IACvE,IAAA,KAAoC,QAAQ,CAAM,EAAE,CAAC,EAApD,aAAa,QAAA,EAAE,gBAAgB,QAAqB,CAAC;IACtD,IAAA,KAAoC,QAAQ,CAAC,KAAK,CAAC,EAAlD,aAAa,QAAA,EAAE,gBAAgB,QAAmB,CAAC;IACpD,IAAA,KAAkC,QAAQ,CAAC,KAAK,CAAC,EAAhD,YAAY,QAAA,EAAE,eAAe,QAAmB,CAAC;IAExD,IAAM,gBAAgB,GAAG,OAAO,CAAC;QAC/B,IAAM,MAAM,GAA0B;YACpC,OAAO,EAAE,OAAc;YACvB,IAAI,MAAA;YACJ,KAAK,EAAE;gBACL,OAAO,EAAE,OAAO;gBAChB,aAAa,EAAE,cAAc;gBAC7B,UAAU,EAAE,UAAU;aACvB;YACD,QAAQ,EAAE,UAAU;YACpB,eAAe,EAAE,eAAe,EAAE;YAClC,iBAAiB,EAAE,iBAAiB,EAAE;YACtC,eAAe,EAAE,UAAU;YAC3B,qBAAqB,EAAE,iBAAiB;YACxC,gBAAgB,EAAE,IAAI;SACvB,CAAC;QAEF,OAAO,MAAM,CAAC;IAChB,CAAC,EAAE,CAAC,IAAI,EAAE,OAAO,EAAE,cAAc,EAAE,OAAO,EAAE,UAAU,CAAC,CAAC,CAAC;IAEzD,IAAM,KAAK,GAAG,aAAa,CAAC,gBAAgB,CAAC,CAAC;IAC9C,IAAM,SAAS,GAAG,MAAM,CAAiB,IAAI,CAAC,CAAC;IAE/C,eAAe,CAAC,SAAS,EAAE,cAAM,OAAA,mBAAmB,CAAC,EAAE,CAAC,EAAvB,CAAuB,CAAC,CAAC;IAE1D,OAAO,CACL,oBAAC,CAAC,CAAC,SAAS;QACV,oBAAC,MAAM,IACL,KAAK,EAAE,KAAK,EACZ,aAAa,EAAE,aAAa,EAC5B,aAAa,EAAE,aAAa,EAC5B,YAAY,EAAE,YAAY,EAC1B,gBAAgB,EAAE,gBAAgB,EAClC,YAAY,EAAE,YAAY,EAC1B,gBAAgB,EAAE,gBAAgB,EAClC,eAAe,EAAE,eAAe,EAChC,gBAAgB,EAAE,gBAAgB,EAClC,cAAc,EAAE,eAAe,EAC/B,kBAAkB,EAAE,kBAAkB,EACtC,UAAU,EAAE,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,WAAW,EAC/B,kBAAkB,EAAE,cAAM,OAAA,kBAAkB,IAAI,kBAAkB,EAAE,EAA1C,CAA0C,EACpE,WAAW,EAAE,KAAK,CAAC,WAAW,GAC9B;QACF,oBAAC,CAAC,CAAC,KAAK,IAAC,SAAS,EAAE,cAAc,IAAI,EAAE;YACtC,oBAAC,CAAC,CAAC,KAAK,eAAU,YAAY,iBAAe,aAAa,IACvD,KAAK,CAAC,eAAe,EAAE,CAAC,GAAG,CAAC,UAAC,WAAgB,IAAK,OAAA,CACjD,oBAAC,CAAC,CAAC,QAAQ,IAAC,GAAG,EAAE,WAAW,CAAC,EAAE,IAC5B,WAAW,CAAC,OAAO,CAAC,GAAG,CAAC,UAAC,MAAW;;gBAAK,OAAA,CACxC,oBAAC,CAAC,CAAC,EAAE,IAAC,GAAG,EAAE,MAAM,CAAC,EAAE;oBAClB,oBAAC,CAAC,CAAC,aAAa,IACd,OAAO,EAAE;;4BACP,IAAI,CAAC,CAAA,MAAA,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,0CAAE,SAAS,0CAAE,WAAW,CAAA;gCACzC,mBAAmB,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;wBAC7D,CAAC;wBAED,oBAAC,CAAC,CAAC,UAAU,QACV,CAAC,MAAM,CAAC,aAAa,IAAI,UAAU,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,MAAM,EAAE,MAAM,CAAC,UAAU,EAAE,CAAC,CAC5E;wBACd,CAAC,CAAA,MAAA,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,0CAAE,SAAS,0CAAE,WAAW,CAAA,IAAI,CAC1C,oBAAC,CAAC,CAAC,gBAAgB;4BACjB,6BAAK,IAAI,EAAC,MAAM,EAAC,SAAS,EAAC,OAAO,iBAAa,MAAM,EAAC,OAAO,EAAC,WAAW;gCACvE,8BAAM,CAAC,EAAC,gBAAgB,GAAG,CACvB,CACa,CACtB,CACe;oBACjB,gBAAgB,KAAK,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,WAAW,IAAI,CAC3D,oBAAC,CAAC,CAAC,YAAY,IAAC,GAAG,EAAE,SAAS;wBAC5B,oBAAC,CAAC,CAAC,gBAAgB;4BACjB,oBAAC,CAAC,CAAC,kBAAkB,IACnB,KAAK,EAAE;oCACL,UAAU,EAAE,aAAa,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE;iCACvD,EACD,OAAO,EAAE;oCACP,WAAW,IAAI,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,WAAW,EAAE,KAAK,CAAC,CAAC;oCACvE,mBAAmB,CAAC,EAAE,CAAC,CAAC;gCAC1B,CAAC;gCAED,6BAAK,SAAS,EAAC,MAAM;oCACnB,6BACE,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,KAAK,EACjB,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B,iBACtB,MAAM,EAClB,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI;wCAEX,8BACE,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,CAAC,EAAC,6CAA6C,GAC/C,CACE,CACF;gCACN,+BAAI,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,QAAQ,KAAI,gBAAgB,CAAK,CACxB;4BACvB,oBAAC,CAAC,CAAC,kBAAkB,IACnB,KAAK,EAAE;oCACL,UAAU,EAAE,YAAY,CAAC,CAAC,CAAC,qBAAqB,CAAC,CAAC,CAAC,EAAE;iCACtD,EACD,OAAO,EAAE;oCACP,WAAW,IAAI,WAAW,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,WAAW,EAAE,MAAM,CAAC,CAAC;oCACxE,mBAAmB,CAAC,EAAE,CAAC,CAAC;gCAC1B,CAAC;gCAED,6BAAK,SAAS,EAAC,aAAa;oCAC1B,6BACE,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,KAAK,EACjB,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B,iBACtB,MAAM,EAClB,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI;wCAEX,8BACE,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,CAAC,EAAC,6CAA6C,GACzC,CACJ,CACF;gCACN,+BAAI,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,SAAS,KAAI,gBAAgB,CAAK,CACzB;4BACtB,CAAC,CAAA,MAAA,MAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,0CAAE,SAAS,0CAAE,QAAQ,CAAA,IAAI,CACvC,oBAAC,CAAC,CAAC,kBAAkB,IACnB,OAAO,EAAE;oCACP,aAAa,IAAI,aAAa,CAAC,MAAM,CAAC,MAAM,CAAC,SAAS,CAAC,WAAW,CAAC,CAAC;oCACpE,mBAAmB,CAAC,EAAE,CAAC,CAAC;gCAC1B,CAAC;gCAED,6BAAK,SAAS,EAAC,MAAM;oCACnB,6BACE,IAAI,EAAC,MAAM,EACX,MAAM,EAAC,cAAc,EACrB,WAAW,EAAC,KAAK,EACjB,OAAO,EAAC,WAAW,EACnB,KAAK,EAAC,4BAA4B,iBACtB,MAAM,EAClB,KAAK,EAAC,IAAI,EACV,MAAM,EAAC,IAAI;wCAEX,8BACE,aAAa,EAAC,OAAO,EACrB,cAAc,EAAC,OAAO,EACtB,CAAC,EAAC,qSAAqS,GACjS,CACJ,CACF;gCACN,+BAAI,CAAA,MAAM,aAAN,MAAM,uBAAN,MAAM,CAAE,MAAM,KAAI,aAAa,CAAK,CACnB,CACxB,CACkB,CACN,CAClB,CACI,CACR,CAAA;aAAA,CAAC,CACS,CACd,EApHkD,CAoHlD,CAAC,CACM;YACV,oBAAC,KAAK,IAAC,KAAK,EAAE,KAAK,EAAE,OAAO,EAAE,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,UAAU,EAAE,UAAU,GAAI,CACnF;QACT,UAAU,IAAI,CACb,oBAAC,UAAU,IACT,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,UAAU,EACjB,YAAY,EAAE,UAAC,IAAY,IAAK,OAAA,YAAY,uBAAM,UAAU,KAAE,SAAS,EAAE,IAAI,IAAG,EAAhD,CAAgD,GAChF,CACH,CACW,CACf,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,iBAAiB,CAAC"}
|
|
@@ -3,6 +3,7 @@ export declare const Container: import("styled-components/dist/types").IStyledCo
|
|
|
3
3
|
export declare const Table: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").TableHTMLAttributes<HTMLTableElement>, HTMLTableElement>, never>> & string;
|
|
4
4
|
export declare const Thead: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components/dist/types").Substitute<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableSectionElement>, HTMLTableSectionElement>, {
|
|
5
5
|
$sticky?: boolean | undefined;
|
|
6
|
+
$stickyTopP?: number | undefined;
|
|
6
7
|
}>> & string;
|
|
7
8
|
export declare const TableRow: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLTableRowElement>, HTMLTableRowElement>, never>> & string;
|
|
8
9
|
export declare const Th: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").ThHTMLAttributes<HTMLTableHeaderCellElement>, HTMLTableHeaderCellElement>, never>> & string;
|
|
@@ -3,8 +3,8 @@ import { breakpoints } from '../../utils/styledBreakpoints';
|
|
|
3
3
|
import styled from 'styled-components';
|
|
4
4
|
export var Container = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n background-color: #fff;\n"], ["\n background-color: #fff;\n"])));
|
|
5
5
|
export var Table = styled.table(templateObject_2 || (templateObject_2 = __makeTemplateObject(["\n display: table;\n width: 100%;\n border-collapse: collapse;\n border-spacing: 0;\n min-width: 650px;\n border: none;\n"], ["\n display: table;\n width: 100%;\n border-collapse: collapse;\n border-spacing: 0;\n min-width: 650px;\n border: none;\n"])));
|
|
6
|
-
var StickyStyles = "\n position: sticky;\n top:
|
|
7
|
-
export var Thead = styled.thead(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: table-header-group;\n ", "
|
|
6
|
+
var StickyStyles = function (top) { return "\n position: sticky;\n top: ".concat(top, "px;\n z-index: 1;\n background: #fff;\n"); };
|
|
7
|
+
export var Thead = styled.thead(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n display: table-header-group;\n ", ";\n"], ["\n display: table-header-group;\n ", ";\n"])), function (props) { return props.$sticky && StickyStyles(props.$stickyTopP || 0); });
|
|
8
8
|
export var TableRow = styled.tr(templateObject_4 || (templateObject_4 = __makeTemplateObject(["\n color: inherit;\n display: table-row;\n vertical-align: middle;\n outline: 0;\n"], ["\n color: inherit;\n display: table-row;\n vertical-align: middle;\n outline: 0;\n"])));
|
|
9
9
|
export var Th = styled.th(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n font-weight: 500;\n font-size: 0.875rem;\n line-height: 1.5rem;\n letter-spacing: 0.01071em;\n display: table-cell;\n vertical-align: inherit;\n border-bottom: 1px solid rgba(224, 224, 224, 1);\n text-align: left;\n padding: 16px;\n ", ";\n color: rgba(0, 0, 0, 0.87);\n color: #666666;\n font-size: 0.875rem;\n font-weight: 700;\n"], ["\n font-weight: 500;\n font-size: 0.875rem;\n line-height: 1.5rem;\n letter-spacing: 0.01071em;\n display: table-cell;\n vertical-align: inherit;\n border-bottom: 1px solid rgba(224, 224, 224, 1);\n text-align: left;\n padding: 16px;\n ", ";\n color: rgba(0, 0, 0, 0.87);\n color: #666666;\n font-size: 0.875rem;\n font-weight: 700;\n"])), breakpoints({
|
|
10
10
|
cssProp: 'padding',
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/components/UncontrolledTable/styles.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,kGAAA,+BAElC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,KAAK,GAAG,MAAM,CAAC,KAAK,oMAAA,iIAOhC,IAAA,CAAC;AAEF,IAAM,YAAY,GAAG,
|
|
1
|
+
{"version":3,"file":"styles.js","sourceRoot":"","sources":["../../../../src/components/UncontrolledTable/styles.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,WAAW,EAAE,MAAM,+BAA+B,CAAC;AAC5D,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,CAAC,IAAM,SAAS,GAAG,MAAM,CAAC,GAAG,kGAAA,+BAElC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,KAAK,GAAG,MAAM,CAAC,KAAK,oMAAA,iIAOhC,IAAA,CAAC;AAEF,IAAM,YAAY,GAAG,UAAC,GAAW,IAAK,OAAA,wCAE7B,GAAG,8CAGX,EALqC,CAKrC,CAAC;AAEF,MAAM,CAAC,IAAM,KAAK,GAAG,MAAM,CAAC,KAAK,gHAA4C,sCAEzE,EAA8D,KACjE,KADG,UAAA,KAAK,IAAI,OAAA,KAAK,CAAC,OAAO,IAAI,YAAY,CAAC,KAAK,CAAC,WAAW,IAAI,CAAC,CAAC,EAArD,CAAqD,CACjE,CAAC;AAEF,MAAM,CAAC,IAAM,QAAQ,GAAG,MAAM,CAAC,EAAE,2JAAA,wFAKhC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,EAAE,GAAG,MAAM,CAAC,EAAE,iaAAA,wPAUvB,EAKA,oGAKH,KAVG,WAAW,CAAC;IACZ,OAAO,EAAE,SAAS;IAClB,YAAY,EAAE,IAAI;IAClB,MAAM,EAAE,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,CAAC;IACrB,cAAc,EAAE,WAAW;CAC5B,CAAC,CAKH,CAAC;AAEF,MAAM,CAAC,IAAM,aAAa,GAAG,MAAM,CAAC,GAAG,8HAAA,2DAItC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,UAAU,GAAG,MAAM,CAAC,IAAI,qEAAA,EAAE,IAAA,CAAC;AAExC,MAAM,CAAC,IAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,wGAAA,qCAGzC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,YAAY,GAAG,MAAM,CAAC,GAAG,0QAAA,uMASrC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,gBAAgB,GAAG,MAAM,CAAC,GAAG,kUAAA,6PAczC,IAAA,CAAC;AAEF,MAAM,CAAC,IAAM,kBAAkB,GAAG,MAAM,CAAC,GAAG,6bAAA,wXAyB3C,IAAA,CAAC"}
|
|
@@ -9,6 +9,7 @@ interface Props extends MuiTabsBaseProps {
|
|
|
9
9
|
onTabChange: (event: SyntheticEvent, tab: number) => void;
|
|
10
10
|
color?: ColorVariant;
|
|
11
11
|
variant?: TabsVariant;
|
|
12
|
+
info?: React.ReactNode;
|
|
12
13
|
}
|
|
13
|
-
declare const UncontrolledTabs: ({ tabs, tab, color, onTabChange, ...props }: Props) => React.JSX.Element;
|
|
14
|
+
declare const UncontrolledTabs: ({ tabs, tab, color, onTabChange, info, ...props }: Props) => React.JSX.Element;
|
|
14
15
|
export default UncontrolledTabs;
|
|
@@ -2,6 +2,7 @@ import { __assign, __rest } from "tslib";
|
|
|
2
2
|
import React from 'react';
|
|
3
3
|
import { Box } from '@mui/material';
|
|
4
4
|
import { NormaTab, NormaTabs } from './UncontrolledTabs.style';
|
|
5
|
+
import { NormaTabInfo } from './UncontrolledTabsInfo.style';
|
|
5
6
|
function TabPanel(props) {
|
|
6
7
|
var children = props.children, value = props.value, index = props.index, other = __rest(props, ["children", "value", "index"]);
|
|
7
8
|
return (React.createElement("div", __assign({ role: "tabpanel", hidden: value !== index, id: "simple-tabpanel-".concat(index), "aria-labelledby": "simple-tab-".concat(index) }, other), value === index && React.createElement(Box, { sx: { p: 3 } }, children)));
|
|
@@ -13,13 +14,15 @@ function a11yProps(index) {
|
|
|
13
14
|
};
|
|
14
15
|
}
|
|
15
16
|
var UncontrolledTabs = function (_a) {
|
|
16
|
-
var tabs = _a.tabs, tab = _a.tab, _b = _a.color, color = _b === void 0 ? 'primary' : _b, onTabChange = _a.onTabChange, props = __rest(_a, ["tabs", "tab", "color", "onTabChange"]);
|
|
17
|
+
var tabs = _a.tabs, tab = _a.tab, _b = _a.color, color = _b === void 0 ? 'primary' : _b, onTabChange = _a.onTabChange, info = _a.info, props = __rest(_a, ["tabs", "tab", "color", "onTabChange", "info"]);
|
|
17
18
|
var handleChange = function (event, newValue) {
|
|
18
19
|
onTabChange(event, newValue);
|
|
19
20
|
};
|
|
20
21
|
return (React.createElement(Box, { sx: { width: '100%' } },
|
|
21
22
|
React.createElement(Box, null,
|
|
22
|
-
React.createElement(NormaTabs, __assign({ value: tab, color: color, onChange: handleChange, "aria-label": "tabs" }, props),
|
|
23
|
+
React.createElement(NormaTabs, __assign({ value: tab, color: color, onChange: handleChange, "aria-label": "tabs" }, props),
|
|
24
|
+
tabs.map(function (item, key) { return (React.createElement(NormaTab, __assign({ key: key, label: item.label, color: color }, a11yProps(key)))); }),
|
|
25
|
+
info && React.createElement(NormaTabInfo, null, info))),
|
|
23
26
|
tabs.map(function (item, key) {
|
|
24
27
|
var _a;
|
|
25
28
|
return (React.createElement(TabPanel, __assign({}, (_a = item.tabPanel) === null || _a === void 0 ? void 0 : _a.props, { key: key, value: tab, index: key }), item.children));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"UncontrolledTabs.js","sourceRoot":"","sources":["../../../../src/components/UncontrolledTabs/UncontrolledTabs.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAyB,MAAM,OAAO,CAAC;AAC9C,OAAO,EAAE,GAAG,EAAW,MAAM,eAAe,CAAC;AAE7C,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;
|
|
1
|
+
{"version":3,"file":"UncontrolledTabs.js","sourceRoot":"","sources":["../../../../src/components/UncontrolledTabs/UncontrolledTabs.tsx"],"names":[],"mappings":";AAAA,OAAO,KAAyB,MAAM,OAAO,CAAC;AAC9C,OAAO,EAAE,GAAG,EAAW,MAAM,eAAe,CAAC;AAE7C,OAAO,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,0BAA0B,CAAC;AAE/D,OAAO,EAAE,YAAY,EAAE,MAAM,8BAA8B,CAAC;AAkB5D,SAAS,QAAQ,CAAC,KAAoB;IAC5B,IAAA,QAAQ,GAA6B,KAAK,SAAlC,EAAE,KAAK,GAAsB,KAAK,MAA3B,EAAE,KAAK,GAAe,KAAK,MAApB,EAAK,KAAK,UAAK,KAAK,EAA5C,8BAAoC,CAAF,CAAW;IAEnD,OAAO,CACL,sCACE,IAAI,EAAC,UAAU,EACf,MAAM,EAAE,KAAK,KAAK,KAAK,EACvB,EAAE,EAAE,0BAAmB,KAAK,CAAE,qBACb,qBAAc,KAAK,CAAE,IAClC,KAAK,GAER,KAAK,KAAK,KAAK,IAAI,oBAAC,GAAG,IAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,IAAG,QAAQ,CAAO,CACnD,CACP,CAAC;AACJ,CAAC;AAED,SAAS,SAAS,CAAC,KAAa;IAC9B,OAAO;QACL,EAAE,EAAE,qBAAc,KAAK,CAAE;QACzB,eAAe,EAAE,0BAAmB,KAAK,CAAE;KAC5C,CAAC;AACJ,CAAC;AAED,IAAM,gBAAgB,GAAG,UAAC,EAAoE;IAAlE,IAAA,IAAI,UAAA,EAAE,GAAG,SAAA,EAAE,aAAiB,EAAjB,KAAK,mBAAG,SAAS,KAAA,EAAE,WAAW,iBAAA,EAAE,IAAI,UAAA,EAAK,KAAK,cAA3D,+CAA6D,CAAF;IACnF,IAAM,YAAY,GAAG,UAAC,KAAqB,EAAE,QAAgB;QAC3D,WAAW,CAAC,KAAK,EAAE,QAAQ,CAAC,CAAC;IAC/B,CAAC,CAAC;IAEF,OAAO,CACL,oBAAC,GAAG,IAAC,EAAE,EAAE,EAAE,KAAK,EAAE,MAAM,EAAE;QACxB,oBAAC,GAAG;YACF,oBAAC,SAAS,aAAC,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,YAAY,gBAAa,MAAM,IAAK,KAAK;gBACrF,IAAI,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,GAAG,IAAK,OAAA,CACvB,oBAAC,QAAQ,aAAC,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,IAAM,SAAS,CAAC,GAAG,CAAC,EAAI,CAC5E,EAFwB,CAExB,CAAC;gBACD,IAAI,IAAI,oBAAC,YAAY,QAAE,IAAI,CAAgB,CAClC,CACR;QACL,IAAI,CAAC,GAAG,CAAC,UAAC,IAAI,EAAE,GAAG;;YAAK,OAAA,CACvB,oBAAC,QAAQ,eAAK,MAAA,IAAI,CAAC,QAAQ,0CAAE,KAAK,IAAE,GAAG,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,GAAG,KACjE,IAAI,CAAC,QAAQ,CACL,CACZ,CAAA;SAAA,CAAC,CACE,CACP,CAAC;AACJ,CAAC,CAAC;AAEF,eAAe,gBAAgB,CAAC"}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
/// <reference types="react" />
|
|
2
|
+
export declare const NormaTabInfo: import("styled-components/dist/types").IStyledComponentBase<"web", import("styled-components").FastOmit<import("react").DetailedHTMLProps<import("react").HTMLAttributes<HTMLDivElement>, HTMLDivElement>, never>> & string;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
import { __makeTemplateObject } from "tslib";
|
|
2
|
+
import styled from 'styled-components';
|
|
3
|
+
export var NormaTabInfo = styled.div(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n position: absolute;\n right: 0;\n bottom: 0;\n height: 38px;\n"], ["\n position: absolute;\n right: 0;\n bottom: 0;\n height: 38px;\n"])));
|
|
4
|
+
var templateObject_1;
|
|
5
|
+
//# sourceMappingURL=UncontrolledTabsInfo.style.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"UncontrolledTabsInfo.style.js","sourceRoot":"","sources":["../../../../src/components/UncontrolledTabs/UncontrolledTabsInfo.style.ts"],"names":[],"mappings":";AAAA,OAAO,MAAM,MAAM,mBAAmB,CAAC;AAEvC,MAAM,CAAC,IAAM,YAAY,GAAG,MAAM,CAAC,GAAG,0IAAA,uEAKrC,IAAA,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "norma-library",
|
|
3
|
-
"version": "0.6.
|
|
3
|
+
"version": "0.6.6",
|
|
4
4
|
"private": false,
|
|
5
5
|
"description": "Olos/Norma-DS. Design System based on Material UI, developed with TypeScript and Styled Components to create reusable and consistent components in web applications.",
|
|
6
6
|
"scripts": {
|
|
@@ -38,7 +38,7 @@ const Header: React.FC<any> = ({
|
|
|
38
38
|
<S.Tools>
|
|
39
39
|
{showSettings ? (
|
|
40
40
|
<S.IconTools onClick={() => setOpenTools(!openTools)}>
|
|
41
|
-
<SettingsIcon sx={{ fontSize:
|
|
41
|
+
<SettingsIcon sx={{ fontSize: 18, color: '#DE8B50' }} />
|
|
42
42
|
</S.IconTools>
|
|
43
43
|
) : null}
|
|
44
44
|
|
|
@@ -34,6 +34,7 @@ const UncontrolledTable = (props: UncontrolledTableProps) => {
|
|
|
34
34
|
labels,
|
|
35
35
|
tableClassName,
|
|
36
36
|
stickyHeader,
|
|
37
|
+
stickyHeaderP,
|
|
37
38
|
} = props;
|
|
38
39
|
|
|
39
40
|
const [openFilterDialog, setOpenFilterDialog] = useState('');
|
|
@@ -87,7 +88,7 @@ const UncontrolledTable = (props: UncontrolledTableProps) => {
|
|
|
87
88
|
customIcons={props.customIcons}
|
|
88
89
|
/>
|
|
89
90
|
<S.Table className={tableClassName || ''}>
|
|
90
|
-
<S.Thead $sticky={stickyHeader}>
|
|
91
|
+
<S.Thead $sticky={stickyHeader} $stickyTopP={stickyHeaderP}>
|
|
91
92
|
{table.getHeaderGroups().map((headerGroup: any) => (
|
|
92
93
|
<S.TableRow key={headerGroup.id}>
|
|
93
94
|
{headerGroup.headers.map((header: any) => (
|
|
@@ -14,16 +14,16 @@ export const Table = styled.table`
|
|
|
14
14
|
border: none;
|
|
15
15
|
`;
|
|
16
16
|
|
|
17
|
-
const StickyStyles = `
|
|
17
|
+
const StickyStyles = (top: number) => `
|
|
18
18
|
position: sticky;
|
|
19
|
-
top:
|
|
20
|
-
z-index:
|
|
19
|
+
top: ${top}px;
|
|
20
|
+
z-index: 1;
|
|
21
21
|
background: #fff;
|
|
22
22
|
`;
|
|
23
23
|
|
|
24
|
-
export const Thead = styled.thead<{ $sticky?: boolean }>`
|
|
24
|
+
export const Thead = styled.thead<{ $sticky?: boolean, $stickyTopP?: number}>`
|
|
25
25
|
display: table-header-group;
|
|
26
|
-
${props => props.$sticky && StickyStyles}
|
|
26
|
+
${props => props.$sticky && StickyStyles(props.$stickyTopP || 0)};
|
|
27
27
|
`;
|
|
28
28
|
|
|
29
29
|
export const TableRow = styled.tr`
|
|
@@ -3,6 +3,7 @@ import { Box, SxProps } from '@mui/material';
|
|
|
3
3
|
import { ColorVariant, DataTabs, MuiTabsBaseProps, TabsVariant } from '@/types';
|
|
4
4
|
import { NormaTab, NormaTabs } from './UncontrolledTabs.style';
|
|
5
5
|
import { Theme } from '@emotion/react';
|
|
6
|
+
import { NormaTabInfo } from './UncontrolledTabsInfo.style';
|
|
6
7
|
|
|
7
8
|
interface Props extends MuiTabsBaseProps {
|
|
8
9
|
sx?: SxProps<Theme>;
|
|
@@ -11,6 +12,7 @@ interface Props extends MuiTabsBaseProps {
|
|
|
11
12
|
onTabChange: (event: SyntheticEvent, tab: number) => void;
|
|
12
13
|
color?: ColorVariant;
|
|
13
14
|
variant?: TabsVariant;
|
|
15
|
+
info?: React.ReactNode;
|
|
14
16
|
}
|
|
15
17
|
|
|
16
18
|
interface TabPanelProps {
|
|
@@ -20,7 +22,7 @@ interface TabPanelProps {
|
|
|
20
22
|
}
|
|
21
23
|
|
|
22
24
|
function TabPanel(props: TabPanelProps) {
|
|
23
|
-
const { children, value, index,
|
|
25
|
+
const { children, value, index, ...other } = props;
|
|
24
26
|
|
|
25
27
|
return (
|
|
26
28
|
<div
|
|
@@ -42,7 +44,7 @@ function a11yProps(index: number) {
|
|
|
42
44
|
};
|
|
43
45
|
}
|
|
44
46
|
|
|
45
|
-
const UncontrolledTabs = ({ tabs, tab, color = 'primary', onTabChange, ...props }: Props) => {
|
|
47
|
+
const UncontrolledTabs = ({ tabs, tab, color = 'primary', onTabChange, info, ...props }: Props) => {
|
|
46
48
|
const handleChange = (event: SyntheticEvent, newValue: number) => {
|
|
47
49
|
onTabChange(event, newValue);
|
|
48
50
|
};
|
|
@@ -54,6 +56,7 @@ const UncontrolledTabs = ({ tabs, tab, color = 'primary', onTabChange, ...props
|
|
|
54
56
|
{tabs.map((item, key) => (
|
|
55
57
|
<NormaTab key={key} label={item.label} color={color} {...a11yProps(key)} />
|
|
56
58
|
))}
|
|
59
|
+
{info && <NormaTabInfo>{info}</NormaTabInfo>}
|
|
57
60
|
</NormaTabs>
|
|
58
61
|
</Box>
|
|
59
62
|
{tabs.map((item, key) => (
|
|
@@ -280,10 +280,10 @@ export const Default = args => {
|
|
|
280
280
|
showSettings
|
|
281
281
|
customIcons={[
|
|
282
282
|
<div key="1" onClick={() => alert('Ícone 1 clicado')}>
|
|
283
|
-
<CodeIcon sx={{ fontSize:
|
|
283
|
+
<CodeIcon sx={{ fontSize: 18, color: '#DE8B50' }} />
|
|
284
284
|
</div>,
|
|
285
285
|
<div key="2" onClick={() => alert('Ícone 2 clicado')}>
|
|
286
|
-
<CreateIcon sx={{ fontSize:
|
|
286
|
+
<CreateIcon sx={{ fontSize: 18, color: '#DE8B50' }} />
|
|
287
287
|
</div>,
|
|
288
288
|
]}
|
|
289
289
|
onClick={value => console.log('onClick line:', value)}
|
|
@@ -61,3 +61,14 @@ export const UncontrolledTabsBasic = () => {
|
|
|
61
61
|
};
|
|
62
62
|
|
|
63
63
|
UncontrolledTabsBasic.storyName = 'Uncontrolled Tabs';
|
|
64
|
+
|
|
65
|
+
export const UncontrolledTabsInfo = () => {
|
|
66
|
+
const [tab, setTab] = useState(0);
|
|
67
|
+
return (
|
|
68
|
+
<div style={{ width: '480px', marginBottom: 30 }}>
|
|
69
|
+
<UncontrolledTabs info={<div>Informação dentro da tab</div>} tab={tab} tabs={data} onTabChange={(evt, tab) => setTab(tab)} />
|
|
70
|
+
</div>
|
|
71
|
+
);
|
|
72
|
+
};
|
|
73
|
+
|
|
74
|
+
UncontrolledTabsInfo.storyName = 'Uncontrolled Tabs With Info';
|