@eduzz/apps-toolbar - npm Package Compare versions

Comparing version 4.0.12 to 4.0.13

App.d.ts

 /// <reference types="react" />
 import { IEduzzToolbarSetupParams } from './interfaces';
-interface IEduzzToolbarProps extends IEduzzToolbarSetupParams {
-}
-declare const _default: import("react").FC<IEduzzToolbarProps> & {
+declare const _default: import("react").FC<IEduzzToolbarSetupParams> & {
     Apps: import("@emotion/styled").StyledComponent<{
         theme?: import("@emotion/react").Theme;
     }, {}, {}>;
-    User: import("@emotion/styled").StyledComponent<import("./components/Toolbar/User").IEduzzToolbarMenuProps & {
+    User: import("@emotion/styled").StyledComponent<import("./components/User").IEduzzToolbarMenuProps & {
         theme?: import("@emotion/react").Theme;
     }, {}, {}>;
-    Action: import("@emotion/styled").StyledComponent<import("./interfaces").IEduzzToolbarAction & import("./interfaces/styles").IStylesProps & {
+    Action: import("@emotion/styled").StyledComponent<import("./interfaces").IEduzzToolbarCustomAction & import("./interfaces/styles").IStylesProps & {
         theme?: import("@emotion/react").Theme;
@@ -14,0 +12,0 @@ }, {}, {}>;

App.js

@@ -10,7 +10,8 @@ "use strict";
 var chat_1 = (0, tslib_1.__importDefault)(require("./chat"));
+var Apps_1 = (0, tslib_1.__importDefault)(require("./components/Apps"));
+var CustomAction_1 = (0, tslib_1.__importDefault)(require("./components/CustomAction"));
 var Toolbar_1 = (0, tslib_1.__importDefault)(require("./components/Toolbar"));
-var Action_1 = (0, tslib_1.__importDefault)(require("./components/Toolbar/Action"));
-var Apps_1 = (0, tslib_1.__importDefault)(require("./components/Toolbar/Apps"));
-var User_1 = (0, tslib_1.__importDefault)(require("./components/Toolbar/User"));
+var User_1 = (0, tslib_1.__importDefault)(require("./components/User"));
 var context_1 = (0, tslib_1.__importDefault)(require("./context"));
+var globalStyles_1 = (0, tslib_1.__importDefault)(require("./globalStyles"));
 var nestedComponent_1 = (0, tslib_1.__importDefault)(require("./helpers/nestedComponent"));
@@ -20,5 +21,2 @@ var App = (0, react_1.memo)(function (params) {
     var applications = (0, react_1.useState)(applications_1.default)[0];
-    var css = (0, react_1.useMemo)(function () { return ({
-        __html: "\n        * {\n          box-sizing: border-box;\n        }\n\n        body.eduzz-toolbar-applied {\n          margin: 0;\n        }\n\n        .lhc_container--delete {\n          animation: eduzzToolbarFadeOut;\n          animation-duration: 500ms;\n          animation-fill-mode: both;\n        }\n\n        .lhc_container--fix-position {\n          left: auto;\n        }\n      "
-    }); }, []);
     (0, react_1.useEffect)(function () {
@@ -35,3 +33,3 @@ if (!(user === null || user === void 0 ? void 0 : user.isClubeBlack) || disableChat) {
     }
-    return ((0, jsx_runtime_1.jsx)(react_2.ThemeProvider, (0, tslib_1.__assign)({ theme: (user === null || user === void 0 ? void 0 : user.isClubeBlack) ? theme_1.blackTheme : theme_1.theme }, { children: (0, jsx_runtime_1.jsxs)(context_1.default.Provider, (0, tslib_1.__assign)({ value: config }, { children: [(0, jsx_runtime_1.jsx)("style", { dangerouslySetInnerHTML: css }, void 0), (0, jsx_runtime_1.jsx)(Toolbar_1.default, (0, tslib_1.__assign)({}, rest), void 0)] }), void 0) }), void 0));
+    return ((0, jsx_runtime_1.jsx)(react_2.ThemeProvider, (0, tslib_1.__assign)({ theme: (user === null || user === void 0 ? void 0 : user.isClubeBlack) ? theme_1.blackTheme : theme_1.theme }, { children: (0, jsx_runtime_1.jsxs)(context_1.default.Provider, (0, tslib_1.__assign)({ value: config }, { children: [(0, jsx_runtime_1.jsx)(globalStyles_1.default, {}, void 0), (0, jsx_runtime_1.jsx)(Toolbar_1.default, (0, tslib_1.__assign)({}, rest), void 0)] }), void 0) }), void 0));
 });
@@ -41,3 +39,3 @@ exports.default = (0, nestedComponent_1.default)(App, {
     User: User_1.default,
-    Action: Action_1.default
+    Action: CustomAction_1.default
 });

components/Toolbar/index.js

@@ -9,4 +9,4 @@ "use strict";
 var className_1 = (0, tslib_1.__importDefault)(require("../../helpers/className"));
+var Belt_1 = (0, tslib_1.__importDefault)(require("../Belt"));
 var EduzzLogo_1 = (0, tslib_1.__importDefault)(require("../EduzzLogo"));
-var Belt_1 = (0, tslib_1.__importDefault)(require("./Belt"));
 var styles_1 = (0, tslib_1.__importDefault)(require("./styles"));
@@ -47,4 +47,4 @@ var Toolbar = function (_a) {
     var handleClickContainer = (0, react_1.useCallback)(function () { return (contentClicked.clicked = true); }, [contentClicked]);
-    return ((0, jsx_runtime_1.jsxs)("header", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-apps-toolbar', className), onClick: handleClickContainer }, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-logo' }, { children: [(0, jsx_runtime_1.jsx)(EduzzLogo_1.default, {}, void 0), (user === null || user === void 0 ? void 0 : user.isSupport) && (0, jsx_runtime_1.jsx)("span", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-support' }, { children: "SUPORTE" }), void 0)] }), void 0), (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-quick-access' }, { children: [children, (0, jsx_runtime_1.jsx)(Belt_1.default, {}, void 0)] }), void 0)] }), void 0));
+    return ((0, jsx_runtime_1.jsxs)("header", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar', className), onClick: handleClickContainer }, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-logo' }, { children: [(0, jsx_runtime_1.jsx)(EduzzLogo_1.default, {}, void 0), (user === null || user === void 0 ? void 0 : user.isSupport) && (0, jsx_runtime_1.jsx)("span", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-support' }, { children: "SUPORTE" }), void 0)] }), void 0), (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-quick-access' }, { children: [children, (0, jsx_runtime_1.jsx)(Belt_1.default, {}, void 0)] }), void 0)] }), void 0));
 };
 exports.default = (0, styles_1.default)((0, react_1.memo)(Toolbar));

interfaces/index.d.ts

@@ -25,3 +25,3 @@ /// <reference types="react" />
 }
-export interface IEduzzToolbarAction {
+export interface IEduzzToolbarCustomAction {
     active?: boolean;
@@ -28,0 +28,0 @@ icon?: React.ReactNode;

package.json

 {
   "name": "@eduzz/apps-toolbar",
-  "version": "4.0.12",
+  "version": "4.0.13",
   "private": false,
@@ -18,3 +18,3 @@ "author": "Eduzz Team",
     "lint": "yarn eslint \"./src/**/*.ts\" \"./src/**/*.tsx\"",
-    "preprepare": "concurrently -r \"yarn lint\" \"yarn tsc --noEmit\"",
+    "preprepare": "concurrently -r \"yarn lint\"",
     "prepare": "yarn husky install && npm run build",
@@ -21,0 +21,0 @@ "postpublish": "yarn clean"

README.md

@@ -11,63 +11,22 @@ # Eduzz Toolbar
 
+Adicione a fonte padrão no seu HTML.
+
+```html
+<link href="https://fonts.googleapis.com/css2?family=Open+Sans:wght@400;500;600&display=swap" rel="stylesheet">
+```
+
 #### Implementação
 
 ```js
-<Toolbar {...params}>
+<EduzzToolbar {...params}>
   // ações customizadas
-  <Toolbar.Action icon={<AvatarOutline />} />
-  <Toolbar.Action icon={<NotificationOutline />} />
+  <EduzzToolbar.Action icon={<AvatarOutline />} />
+  <EduzzToolbar.Action icon={<NotificationOutline />} />
 
   // ações padrões
-  <Toolbar.Apps />
-  <Toolbar.User menu={...} />
-</Toolbar>
+  <EduzzToolbar.Apps />
+  <EduzzToolbar.User menu={...} />
+</EduzzToolbar>
 ```
 
-#### Teste local
-
-No arquivo `src/index.tsx` implemente o código abaixo.
-
-```js
-function DevApp() {
-  const params: IEduzzToolbarSetupParams = {
-    application: 'blinket',
-    disableChat: true,
-    user: {
-      id: 1,
-      name: 'John Doe',
-      email: '[e-mail]'
-    }
-  };
-
-  const menu: IEduzzToolbarUserMenu[] = [
-    {
-      content: 'Minhas compras',
-      onClick: () => console.log('mysales'),
-      icon: <CartOutline />
-    },
-    {
-      content: 'Dados cadastrais',
-      disabled: true,
-      icon: <CameraFrontOutline />
-    },
-    {
-      content: 'Sair',
-      divider: true,
-      icon: <Exit />
-    }
-  ];
-
-  return (
-    <Toolbar {...params}>
-      <Toolbar.Action icon={<AvatarOutline />} />
-      <Toolbar.Action icon={<NotificationOutline />} />
-      <Toolbar.Apps />
-      <Toolbar.User menu={menu} />
-    </Toolbar>
-  );
-}
-
-ReactDOM.render(<DevApp />, document.getElementById('root'));
-```
-
 #### Props 
@@ -109,1 +68,47 @@
 ```
+
+#### Desenvolvimento local
+
+No arquivo `src/index.tsx` implemente o código abaixo.
+
+```js
+function DevApp() {
+  const params: IEduzzToolbarSetupParams = {
+    application: 'blinket',
+    disableChat: true,
+    user: {
+      id: 1,
+      name: 'John Doe',
+      email: '[e-mail]'
+    }
+  };
+
+  const menu: IEduzzToolbarUserMenu[] = [
+    {
+      content: 'Minhas compras',
+      onClick: () => console.log('shopping')
+    },
+    {
+      content: 'Dados cadastrais',
+      disabled: true
+    },
+    {
+      content: 'Sumiu!',
+      hidden: true
+    },
+    {
+      content: 'Sair',
+      divider: true
+    }
+  ];
+
+  return (
+    <EduzzToolbar {...params}>
+      <EduzzToolbar.Apps />
+      <EduzzToolbar.User menu={menu} />
+    </EduzzToolbar>
+  );
+}
+
+ReactDOM.render(<DevApp />, document.getElementById('root'));
+```

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

113674

increased by0.68%

Number of package files

71

increased by1.43%

Lines of code

1643

increased by0.74%

Number of lines in readme file

113

increased by4.63%

No dependency changes