norma-library 0.6.4 → 0.6.5

package/dist/esm/components/UncontrolledTable/components/header/index.js

@@ -15,7 +15,7 @@ var Header = function (_a) {
             showClearFiels && (React.createElement(S.TextClearSearch, { onClick: function () { return onClearFieldsClick && onClearFieldsClick(); } }, clearLabel || 'Limpar busca'))),
         React.createElement(S.Tools, null,
             showSettings ? (React.createElement(S.IconTools, { onClick: function () { return setOpenTools(!openTools); } },
-                React.createElement(SettingsIcon, { sx: { fontSize: 16, color: '#DE8B50' } }))) : null,
+                React.createElement(SettingsIcon, { sx: { fontSize: 18, color: '#DE8B50' } }))) : null,
             customIcons &&
                 customIcons.map(function (IconComponent, index) { return (React.createElement(S.IconTools, { key: index }, IconComponent)); }),
             openTools ? (React.createElement(S.ListTools, { ref: listToolsRef }, table.getAllLeafColumns().map(function (column) {

package/dist/esm/components/UncontrolledTable/components/header/styles.js

@@ -2,7 +2,7 @@ import { __makeTemplateObject } from "tslib";
 import styled from 'styled-components';
 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"])));
 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"])));
-export var Tools = styled.div(templateObject_3 || (templateObject_3 = __makeTemplateObject(["\n  display: flex;\n"], ["\n  display: flex;\n"])));
+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"])));
 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"])));
 export var TextClearSearchContent = styled.div(templateObject_5 || (templateObject_5 = __makeTemplateObject(["\n  height: 10px;\n"], ["\n  height: 10px;\n"])));
 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"])));

package/dist/esm/components/UncontrolledTable/components/header/styles.js.map

@@ -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,yFAAA,sBAE9B,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"}
+{"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"}

package/dist/esm/components/UncontrolledTabs/UncontrolledTabs.d.ts

@@ -9,6 +9,7 @@ interface Props extends MuiTabsBaseProps {
     onTabChange: (event: SyntheticEvent, tab: number) => void;
     color?: ColorVariant;
     variant?: TabsVariant;
+    info?: React.ReactNode;
 }
-declare const UncontrolledTabs: ({ tabs, tab, color, onTabChange, ...props }: Props) => React.JSX.Element;
+declare const UncontrolledTabs: ({ tabs, tab, color, onTabChange, info, ...props }: Props) => React.JSX.Element;
 export default UncontrolledTabs;

package/dist/esm/components/UncontrolledTabs/UncontrolledTabs.js

@@ -2,6 +2,7 @@ import { __assign, __rest } from "tslib";
 import React from 'react';
 import { Box } from '@mui/material';
 import { NormaTab, NormaTabs } from './UncontrolledTabs.style';
+import { NormaTabInfo } from './UncontrolledTabsInfo.style';
 function TabPanel(props) {
     var children = props.children, value = props.value, index = props.index, other = __rest(props, ["children", "value", "index"]);
     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) {
     };
 }
 var UncontrolledTabs = function (_a) {
-    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"]);
+    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"]);
     var handleChange = function (event, newValue) {
         onTabChange(event, newValue);
     };
     return (React.createElement(Box, { sx: { width: '100%' } },
         React.createElement(Box, null,
-            React.createElement(NormaTabs, __assign({ value: tab, color: color, onChange: handleChange, "aria-label": "tabs" }, props), tabs.map(function (item, key) { return (React.createElement(NormaTab, __assign({ key: key, label: item.label, color: color }, a11yProps(key)))); }))),
+            React.createElement(NormaTabs, __assign({ value: tab, color: color, onChange: handleChange, "aria-label": "tabs" }, props),
+                tabs.map(function (item, key) { return (React.createElement(NormaTab, __assign({ key: key, label: item.label, color: color }, a11yProps(key)))); }),
+                info && React.createElement(NormaTabInfo, null, info))),
         tabs.map(function (item, key) {
             var _a;
             return (React.createElement(TabPanel, __assign({}, (_a = item.tabPanel) === null || _a === void 0 ? void 0 : _a.props, { key: key, value: tab, index: key }), item.children));

package/dist/esm/components/UncontrolledTabs/UncontrolledTabs.js.map

@@ -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;AAkB/D,SAAS,QAAQ,CAAC,KAAoB;IAC5B,IAAA,QAAQ,GAA8B,KAAK,SAAnC,EAAE,KAAK,GAAuB,KAAK,MAA5B,EAAE,KAAK,GAAgB,KAAK,MAArB,EAAM,KAAK,UAAK,KAAK,EAA7C,8BAAqC,CAAF,CAAW;IAEpD,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,EAA8D;IAA5D,IAAA,IAAI,UAAA,EAAE,GAAG,SAAA,EAAE,aAAiB,EAAjB,KAAK,mBAAG,SAAS,KAAA,EAAE,WAAW,iBAAA,EAAK,KAAK,cAArD,uCAAuD,CAAF;IAC7E,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,GACrF,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,CACQ,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"}
+{"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"}

package/dist/esm/components/UncontrolledTabs/UncontrolledTabsInfo.style.d.ts

@@ -0,0 +1,2 @@
+/// <reference types="react" />
+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;

package/dist/esm/components/UncontrolledTabs/UncontrolledTabsInfo.style.js

@@ -0,0 +1,5 @@
+import { __makeTemplateObject } from "tslib";
+import styled from 'styled-components';
+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"])));
+var templateObject_1;
+//# sourceMappingURL=UncontrolledTabsInfo.style.js.map

package/dist/esm/components/UncontrolledTabs/UncontrolledTabsInfo.style.js.map

@@ -0,0 +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

@@ -1,6 +1,6 @@
 {
   "name": "norma-library",
-  "version": "0.6.004",
+  "version": "0.6.005",
   "private": false,
   "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.",
   "scripts": {

package/src/components/UncontrolledTable/components/header/index.tsx

@@ -38,7 +38,7 @@ const Header: React.FC<any> = ({
       <S.Tools>
         {showSettings ? (
           <S.IconTools onClick={() => setOpenTools(!openTools)}>
-            <SettingsIcon sx={{ fontSize: 16, color: '#DE8B50' }} />
+            <SettingsIcon sx={{ fontSize: 18, color: '#DE8B50' }} />
           </S.IconTools>
         ) : null}
 

package/src/components/UncontrolledTable/components/header/styles.tsx

@@ -18,6 +18,7 @@ export const Results = styled.div`
 
 export const Tools = styled.div`
   display: flex;
+  align-items: center;
 `;
 
 export const TextResult = styled.div`

package/src/components/UncontrolledTabs/UncontrolledTabs.style.tsx

@@ -54,3 +54,5 @@ export const NormaTab: React.ComponentType<StyledTabProps> = styled((props: Styl
     backgroundColor: 'rgba(100, 95, 228, 0.32)',
   },
 }));
+
+

package/src/components/UncontrolledTabs/UncontrolledTabs.tsx

@@ -3,6 +3,7 @@ import { Box, SxProps } from '@mui/material';
 import { ColorVariant, DataTabs, MuiTabsBaseProps, TabsVariant } from '@/types';
 import { NormaTab, NormaTabs } from './UncontrolledTabs.style';
 import { Theme } from '@emotion/react';
+import { NormaTabInfo } from './UncontrolledTabsInfo.style';
 
 interface Props extends MuiTabsBaseProps {
   sx?: SxProps<Theme>;
@@ -11,6 +12,7 @@ interface Props extends MuiTabsBaseProps {
   onTabChange: (event: SyntheticEvent, tab: number) => void;
   color?: ColorVariant;
   variant?: TabsVariant;
+  info?: React.ReactNode;
 }
 
 interface TabPanelProps {
@@ -20,7 +22,7 @@ interface TabPanelProps {
 }
 
 function TabPanel(props: TabPanelProps) {
-  const { children, value, index,  ...other } = props;
+  const { children, value, index, ...other } = props;
 
   return (
     <div
@@ -42,7 +44,7 @@ function a11yProps(index: number) {
   };
 }
 
-const UncontrolledTabs = ({ tabs, tab, color = 'primary', onTabChange, ...props }: Props) => {
+const UncontrolledTabs = ({ tabs, tab, color = 'primary', onTabChange, info, ...props }: Props) => {
   const handleChange = (event: SyntheticEvent, newValue: number) => {
     onTabChange(event, newValue);
   };
@@ -54,6 +56,7 @@ const UncontrolledTabs = ({ tabs, tab, color = 'primary', onTabChange, ...props
           {tabs.map((item, key) => (
             <NormaTab key={key} label={item.label} color={color} {...a11yProps(key)} />
           ))}
+          {info && <NormaTabInfo>{info}</NormaTabInfo>}
         </NormaTabs>
       </Box>
       {tabs.map((item, key) => (

package/src/components/UncontrolledTabs/UncontrolledTabsInfo.style.ts

@@ -0,0 +1,8 @@
+import styled from 'styled-components';
+
+export const NormaTabInfo = styled.div`
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  height: 38px;
+`;

package/src/stories/UncontrolledTable.stories.tsx

@@ -280,10 +280,10 @@ export const Default = args => {
         showSettings
         customIcons={[
           <div key="1" onClick={() => alert('Ícone 1 clicado')}>
-            <CodeIcon sx={{ fontSize: 16, color: '#DE8B50' }} />
+            <CodeIcon sx={{ fontSize: 18, color: '#DE8B50' }} />
           </div>,
           <div key="2" onClick={() => alert('Ícone 2 clicado')}>
-            <CreateIcon sx={{ fontSize: 16, color: '#DE8B50' }}  />
+            <CreateIcon sx={{ fontSize: 18, color: '#DE8B50' }}  />
           </div>,
         ]}
         onClick={value => console.log('onClick line:', value)}

package/src/stories/UncontrolledTabs.stories.tsx

@@ -61,3 +61,14 @@ export const UncontrolledTabsBasic = () => {
 };
 
 UncontrolledTabsBasic.storyName = 'Uncontrolled Tabs';
+
+export const UncontrolledTabsInfo = () => {
+  const [tab, setTab] = useState(0);
+  return (
+    <div style={{ width: '480px', marginBottom: 30 }}>
+      <UncontrolledTabs info={<div>Informação dentro da tab</div>} tab={tab} tabs={data} onTabChange={(evt, tab) => setTab(tab)} />
+    </div>
+  );
+};
+
+UncontrolledTabsInfo.storyName = 'Uncontrolled Tabs With  Info';