@eduzz/apps-toolbar - npm Package Compare versions

Comparing version 4.0.6 to 4.0.9

App.d.ts

 /// <reference types="react" />
-import { IEduzzToolbarSetupParams } from '@/interfaces/toolbar';
+import { IEduzzToolbarSetupParams } from '@/interfaces';
 interface IEduzzToolbarProps extends IEduzzToolbarSetupParams {
@@ -12,3 +12,3 @@ }
     }, {}, {}>;
-    Action: import("@emotion/styled").StyledComponent<import("@/interfaces/toolbar").IEduzzToolbarAction & import("./interfaces/styles").IStylesProps & {
+    Action: import("@emotion/styled").StyledComponent<import("@/interfaces").IEduzzToolbarAction & import("./interfaces/styles").IStylesProps & {
         theme?: import("@emotion/react").Theme;
@@ -15,0 +15,0 @@ }, {}, {}>;

App.js

@@ -1,37 +0,39 @@
-import { __assign, __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useEffect, useMemo, useState } from 'react';
-import { ThemeProvider } from '@emotion/react';
-import listApps from '@/applications';
-import { theme, blackTheme } from '@/assets/theme';
-import chatInit from '@/chat';
-import Toolbar from '@/components/Toolbar';
-import Action from '@/components/Toolbar/Action';
-import Apps from '@/components/Toolbar/Apps';
-import User from '@/components/Toolbar/User';
-import ConfigContext from '@/context';
-import nestedComponent from '@/helpers/nestedComponent';
-var App = memo(function (params) {
-    var disableChat = params.disableChat, user = params.user, rest = __rest(params, ["disableChat", "user"]);
-    var applications = useState(listApps)[0];
-    var css = useMemo(function () { return ({
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var react_2 = require("@emotion/react");
+var applications_1 = (0, tslib_1.__importDefault)(require("@/applications"));
+var theme_1 = require("@/assets/theme");
+var chat_1 = (0, tslib_1.__importDefault)(require("@/chat"));
+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 context_1 = (0, tslib_1.__importDefault)(require("@/context"));
+var nestedComponent_1 = (0, tslib_1.__importDefault)(require("@/helpers/nestedComponent"));
+var App = (0, react_1.memo)(function (params) {
+    var disableChat = params.disableChat, user = params.user, rest = (0, tslib_1.__rest)(params, ["disableChat", "user"]);
+    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      "
     }); }, []);
-    useEffect(function () {
+    (0, react_1.useEffect)(function () {
         if (!(user === null || user === void 0 ? void 0 : user.isClubeBlack) || disableChat) {
             return null;
         }
-        var destroy = chatInit(user);
+        var destroy = (0, chat_1.default)(user);
         return function () { return destroy(); };
     }, [user === null || user === void 0 ? void 0 : user.isClubeBlack, disableChat, user]);
-    var config = useMemo(function () { return (__assign(__assign({}, params), { user: user, disableChat: disableChat, applications: applications })); }, [params, user, disableChat, applications]);
+    var config = (0, react_1.useMemo)(function () { return ((0, tslib_1.__assign)((0, tslib_1.__assign)({}, params), { user: user, disableChat: disableChat, applications: applications })); }, [params, user, disableChat, applications]);
     if (!config) {
         return null;
     }
-    return (_jsx(ThemeProvider, __assign({ theme: (user === null || user === void 0 ? void 0 : user.isClubeBlack) ? blackTheme : theme }, { children: _jsxs(ConfigContext.Provider, __assign({ value: config }, { children: [_jsx("style", { dangerouslySetInnerHTML: css }, void 0), _jsx(Toolbar, __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)("style", { dangerouslySetInnerHTML: css }, void 0), (0, jsx_runtime_1.jsx)(Toolbar_1.default, (0, tslib_1.__assign)({}, rest), void 0)] }), void 0) }), void 0));
 });
-export default nestedComponent(App, {
-    Apps: Apps,
-    User: User,
-    Action: Action
+exports.default = (0, nestedComponent_1.default)(App, {
+    Apps: Apps_1.default,
+    User: User_1.default,
+    Action: Action_1.default
 });

applications.js

@@ -0,1 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
 var applications = [
@@ -57,2 +59,2 @@ {
 ];
-export default applications;
+exports.default = applications;

assets/theme.js

@@ -1,2 +0,5 @@
-import { __assign } from "tslib";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.blackTheme = exports.theme = exports.TOOLBAR_HEIGHT = exports.MENU_WIDTH = exports.DROPDOWN_WIDTH = void 0;
+var tslib_1 = require("tslib");
 var colors = {
@@ -28,6 +31,6 @@ text: '#546e7a',
 };
-export var DROPDOWN_WIDTH = 340;
-export var MENU_WIDTH = 240;
-export var TOOLBAR_HEIGHT = 48;
-export var theme = { colors: colors, unit: unit, spacing: spacing, trasitionDuration: trasitionDuration, breakpoints: breakpoints, shadow: shadow };
-export var blackTheme = __assign(__assign({}, theme), { colors: __assign(__assign({}, theme.colors), { barBackground: '#272727' }) });
+exports.DROPDOWN_WIDTH = 340;
+exports.MENU_WIDTH = 240;
+exports.TOOLBAR_HEIGHT = 48;
+exports.theme = { colors: colors, unit: unit, spacing: spacing, trasitionDuration: trasitionDuration, breakpoints: breakpoints, shadow: shadow };
+exports.blackTheme = (0, tslib_1.__assign)((0, tslib_1.__assign)({}, exports.theme), { colors: (0, tslib_1.__assign)((0, tslib_1.__assign)({}, exports.theme.colors), { barBackground: '#272727' }) });

chat.d.ts

@@ -1,2 +0,2 @@
-import { IEduzzToolbarSetupParams } from './interfaces/toolbar';
+import { IEduzzToolbarSetupParams } from './interfaces';
 declare global {
@@ -3,0 +3,0 @@ interface Window {

chat.js

@@ -1,2 +0,4 @@
-export default function chatInit(user) {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function chatInit(user) {
     var _a, _b;
@@ -50,1 +52,2 @@ window.LHCChatOptions = {};
 }
+exports.default = chatInit;

components/EduzzLogo/index.js

@@ -1,8 +0,10 @@
-import { __assign } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
 /* eslint-disable max-len */
-import { memo } from 'react';
-var EduzzLogo = memo(function (props) {
-    return (_jsxs("svg", __assign({ viewBox: '0 0 88 28', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' }, props, { children: [_jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M41.7443 17.25C42.5943 17.25 42.8443 17 42.9443 16.15C42.9443 15.9808 42.9559 15.8117 42.968 15.6369C42.9809 15.45 42.9943 15.2567 42.9943 15.05C42.9943 11.85 41.2943 10.2 37.9943 10.2C34.4943 10.2 32.7443 11.9 32.7443 15.3V17.35C32.7443 20.9 34.5943 22.4 38.5443 22.4C39.6443 22.4 40.6443 22.3 41.5943 22.05C42.3943 21.85 42.5443 21.65 42.5443 20.9V20.6C42.5443 19.8 42.3443 19.6 41.5943 19.8C40.5443 20.05 39.4943 20.15 38.5443 20.15C36.1943 20.15 35.1943 19.45 35.1943 17.75V17.25H41.7443ZM40.6943 14.65V15.25H35.1943L35.2443 14.65C35.2443 13.05 36.1443 12.3 37.9443 12.3C39.7943 12.3 40.6943 13.1 40.6943 14.65Z', fill: 'white', className: 'logo-letter' }, void 0), _jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M49.5443 22.45C52.8943 22.45 54.8943 20.75 54.8943 17.4L54.9443 6.8C54.9443 5.95 54.7443 5.75 53.8943 5.75H53.5943C52.7443 5.75 52.5443 5.95 52.5443 6.8V11.8C51.8943 10.75 50.7443 10.25 49.0943 10.25C45.7943 10.25 44.1443 12 44.1443 15.4V17.4C44.1443 20.8 45.9443 22.45 49.5443 22.45ZM49.4943 20.15C47.1443 20.15 46.5443 19.35 46.5443 17.35V15.35C46.5443 13.4 47.1943 12.55 49.4943 12.55C51.7943 12.55 52.4943 13.35 52.4943 15.35V17.35C52.4943 19.3 51.8443 20.15 49.4943 20.15Z', fill: 'white', className: 'logo-letter' }, void 0), _jsx("path", { d: 'M61.4443 20.15C59.3443 20.15 58.7443 19.45 58.7443 17.85L58.6443 11.55C58.6443 10.7 58.4443 10.5 57.5943 10.5H57.2943C56.4443 10.5 56.2443 10.7 56.2443 11.55V17.85C56.2443 20.9 57.9943 22.45 61.3943 22.45C64.9443 22.45 66.4943 20.9 66.4943 17.85V11.55C66.4943 10.7 66.2943 10.5 65.4443 10.5H65.1443C64.2943 10.5 64.0943 10.7 64.0943 11.55V17.85C64.0943 19.45 63.5443 20.15 61.4443 20.15Z', fill: 'white', className: 'logo-letter' }, void 0), _jsx("path", { d: 'M69.2443 10.5C68.4943 10.5 68.2943 10.7 68.2943 11.45L68.2443 11.75C68.2443 12.5 68.4443 12.7 69.1943 12.7H74.3943C74.8943 12.7 75.1443 12.85 75.1443 13.1C75.1443 13.3 74.9443 13.5 74.5943 13.75L69.3943 16.95C68.1943 17.65 67.5943 18.6 67.5943 19.75C67.5943 21.35 68.4943 22.15 70.2943 22.15H76.3943C77.1443 22.15 77.3443 21.95 77.3443 21.2V20.9C77.3443 20.15 77.1443 19.95 76.3943 19.95H70.5443C70.0443 19.95 69.7943 19.85 69.7943 19.55C69.7943 19.3 69.9443 19.1 70.2943 18.9L75.5443 15.7C76.9943 14.8 77.3443 14.15 77.3443 12.9C77.3443 11.15 76.6443 10.5 74.6443 10.5H69.2443Z', fill: 'white', className: 'logo-letter' }, void 0), _jsx("path", { d: 'M79.6443 10.5C78.8943 10.5 78.6943 10.7 78.6943 11.45L78.6443 11.75C78.6443 12.5 78.8443 12.7 79.5943 12.7H84.7943C85.2943 12.7 85.5443 12.85 85.5443 13.1C85.5443 13.3 85.3443 13.5 84.9943 13.75L79.7943 16.95C78.5943 17.65 77.9943 18.6 77.9943 19.75C77.9943 21.35 78.8943 22.15 80.6943 22.15H86.7943C87.5443 22.15 87.7443 21.95 87.7443 21.2V20.9C87.7443 20.15 87.5443 19.95 86.7943 19.95H80.9443C80.4443 19.95 80.1943 19.85 80.1943 19.55C80.1943 19.3 80.3443 19.1 80.6943 18.9L85.9443 15.7C87.3943 14.8 87.7443 14.15 87.7443 12.9C87.7443 11.15 87.0443 10.5 85.0443 10.5H79.6443Z', fill: 'white', className: 'logo-letter' }, void 0), _jsx("path", { d: 'M27.9186 13.9593C27.9186 21.6868 21.6369 27.9186 13.9593 27.9186C6.23184 27.9186 0 21.6369 0 13.9593C0 6.23183 6.28169 0 13.9593 0C21.6868 0 27.9186 6.23183 27.9186 13.9593Z', fill: '#FFBC01' }, void 0), _jsx("path", { d: 'M0.77186 9.37264C1.45652 7.40631 2.56876 5.64148 3.99551 4.18774H12.015C13.4109 4.18774 14.6074 5.33441 14.6074 6.78019C14.6074 8.22598 13.4608 9.37264 12.015 9.37264H0.77186Z', fill: 'white' }, void 0), _jsx("path", { d: 'M0.205179 16.3523C0.0702838 15.5743 0 14.7747 0 13.9593C0 13.0028 0.0962533 12.0691 0.279493 11.1674H7.57793C8.97386 11.1674 10.1205 12.3141 10.1205 13.7598C10.1205 15.2056 8.97386 16.3523 7.52808 16.3523H0.205179Z', fill: 'white' }, void 0), _jsx("path", { d: 'M3.57453 23.2821C2.24607 21.8027 1.22913 20.0394 0.625629 18.0972H12.015C13.4109 18.0972 14.6074 19.2937 14.6074 20.6896C14.6074 22.1354 13.4608 23.2821 12.015 23.2821H3.57453Z', fill: 'white' }, void 0)] }), void 0));
+var react_1 = require("react");
+var EduzzLogo = (0, react_1.memo)(function (props) {
+    return ((0, jsx_runtime_1.jsxs)("svg", (0, tslib_1.__assign)({ viewBox: '0 0 88 28', fill: 'none', xmlns: 'http://www.w3.org/2000/svg' }, props, { children: [(0, jsx_runtime_1.jsx)("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M41.7443 17.25C42.5943 17.25 42.8443 17 42.9443 16.15C42.9443 15.9808 42.9559 15.8117 42.968 15.6369C42.9809 15.45 42.9943 15.2567 42.9943 15.05C42.9943 11.85 41.2943 10.2 37.9943 10.2C34.4943 10.2 32.7443 11.9 32.7443 15.3V17.35C32.7443 20.9 34.5943 22.4 38.5443 22.4C39.6443 22.4 40.6443 22.3 41.5943 22.05C42.3943 21.85 42.5443 21.65 42.5443 20.9V20.6C42.5443 19.8 42.3443 19.6 41.5943 19.8C40.5443 20.05 39.4943 20.15 38.5443 20.15C36.1943 20.15 35.1943 19.45 35.1943 17.75V17.25H41.7443ZM40.6943 14.65V15.25H35.1943L35.2443 14.65C35.2443 13.05 36.1443 12.3 37.9443 12.3C39.7943 12.3 40.6943 13.1 40.6943 14.65Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M49.5443 22.45C52.8943 22.45 54.8943 20.75 54.8943 17.4L54.9443 6.8C54.9443 5.95 54.7443 5.75 53.8943 5.75H53.5943C52.7443 5.75 52.5443 5.95 52.5443 6.8V11.8C51.8943 10.75 50.7443 10.25 49.0943 10.25C45.7943 10.25 44.1443 12 44.1443 15.4V17.4C44.1443 20.8 45.9443 22.45 49.5443 22.45ZM49.4943 20.15C47.1443 20.15 46.5443 19.35 46.5443 17.35V15.35C46.5443 13.4 47.1943 12.55 49.4943 12.55C51.7943 12.55 52.4943 13.35 52.4943 15.35V17.35C52.4943 19.3 51.8443 20.15 49.4943 20.15Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M61.4443 20.15C59.3443 20.15 58.7443 19.45 58.7443 17.85L58.6443 11.55C58.6443 10.7 58.4443 10.5 57.5943 10.5H57.2943C56.4443 10.5 56.2443 10.7 56.2443 11.55V17.85C56.2443 20.9 57.9943 22.45 61.3943 22.45C64.9443 22.45 66.4943 20.9 66.4943 17.85V11.55C66.4943 10.7 66.2943 10.5 65.4443 10.5H65.1443C64.2943 10.5 64.0943 10.7 64.0943 11.55V17.85C64.0943 19.45 63.5443 20.15 61.4443 20.15Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M69.2443 10.5C68.4943 10.5 68.2943 10.7 68.2943 11.45L68.2443 11.75C68.2443 12.5 68.4443 12.7 69.1943 12.7H74.3943C74.8943 12.7 75.1443 12.85 75.1443 13.1C75.1443 13.3 74.9443 13.5 74.5943 13.75L69.3943 16.95C68.1943 17.65 67.5943 18.6 67.5943 19.75C67.5943 21.35 68.4943 22.15 70.2943 22.15H76.3943C77.1443 22.15 77.3443 21.95 77.3443 21.2V20.9C77.3443 20.15 77.1443 19.95 76.3943 19.95H70.5443C70.0443 19.95 69.7943 19.85 69.7943 19.55C69.7943 19.3 69.9443 19.1 70.2943 18.9L75.5443 15.7C76.9943 14.8 77.3443 14.15 77.3443 12.9C77.3443 11.15 76.6443 10.5 74.6443 10.5H69.2443Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M79.6443 10.5C78.8943 10.5 78.6943 10.7 78.6943 11.45L78.6443 11.75C78.6443 12.5 78.8443 12.7 79.5943 12.7H84.7943C85.2943 12.7 85.5443 12.85 85.5443 13.1C85.5443 13.3 85.3443 13.5 84.9943 13.75L79.7943 16.95C78.5943 17.65 77.9943 18.6 77.9943 19.75C77.9943 21.35 78.8943 22.15 80.6943 22.15H86.7943C87.5443 22.15 87.7443 21.95 87.7443 21.2V20.9C87.7443 20.15 87.5443 19.95 86.7943 19.95H80.9443C80.4443 19.95 80.1943 19.85 80.1943 19.55C80.1943 19.3 80.3443 19.1 80.6943 18.9L85.9443 15.7C87.3943 14.8 87.7443 14.15 87.7443 12.9C87.7443 11.15 87.0443 10.5 85.0443 10.5H79.6443Z', fill: 'white', className: 'logo-letter' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M27.9186 13.9593C27.9186 21.6868 21.6369 27.9186 13.9593 27.9186C6.23184 27.9186 0 21.6369 0 13.9593C0 6.23183 6.28169 0 13.9593 0C21.6868 0 27.9186 6.23183 27.9186 13.9593Z', fill: '#FFBC01' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M0.77186 9.37264C1.45652 7.40631 2.56876 5.64148 3.99551 4.18774H12.015C13.4109 4.18774 14.6074 5.33441 14.6074 6.78019C14.6074 8.22598 13.4608 9.37264 12.015 9.37264H0.77186Z', fill: 'white' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M0.205179 16.3523C0.0702838 15.5743 0 14.7747 0 13.9593C0 13.0028 0.0962533 12.0691 0.279493 11.1674H7.57793C8.97386 11.1674 10.1205 12.3141 10.1205 13.7598C10.1205 15.2056 8.97386 16.3523 7.52808 16.3523H0.205179Z', fill: 'white' }, void 0), (0, jsx_runtime_1.jsx)("path", { d: 'M3.57453 23.2821C2.24607 21.8027 1.22913 20.0394 0.625629 18.0972H12.015C13.4109 18.0972 14.6074 19.2937 14.6074 20.6896C14.6074 22.1354 13.4608 23.2821 12.015 23.2821H3.57453Z', fill: 'white' }, void 0)] }), void 0));
 });
-export default EduzzLogo;
+exports.default = EduzzLogo;

components/Icon/index.js

@@ -1,12 +0,14 @@
-import { __assign, __rest } from "tslib";
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Fragment, memo, useMemo } from 'react';
-import mapper from './mapper';
-var Icon = memo(function (_a) {
-    var name = _a.name, props = __rest(_a, ["name"]);
-    var icon = useMemo(function () { return mapper(name); }, [name]);
-    var _b = useMemo(function () {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var mapper_1 = (0, tslib_1.__importDefault)(require("./mapper"));
+var Icon = (0, react_1.memo)(function (_a) {
+    var name = _a.name, props = (0, tslib_1.__rest)(_a, ["name"]);
+    var icon = (0, react_1.useMemo)(function () { return (0, mapper_1.default)(name); }, [name]);
+    var _b = (0, react_1.useMemo)(function () {
         if (icon.component)
             return {};
-        var content = icon.paths.map(function (path, index) { return (_jsx("path", { d: path.d, fill: path.fill, transform: path.transform }, index)); });
+        var content = icon.paths.map(function (path, index) { return ((0, jsx_runtime_1.jsx)("path", { d: path.d, fill: path.fill, transform: path.transform }, index)); });
         if (icon.wrapper) {
@@ -18,6 +20,6 @@ content = icon.wrapper(content);
     if (icon.component) {
-        return _jsx(Fragment, { children: icon.component() }, void 0);
+        return (0, jsx_runtime_1.jsx)(react_1.Fragment, { children: icon.component() }, void 0);
     }
-    return (_jsx("svg", __assign({}, props, { viewBox: viewBox }, { children: content }), void 0));
+    return ((0, jsx_runtime_1.jsx)("svg", (0, tslib_1.__assign)({}, props, { viewBox: viewBox }, { children: content }), void 0));
 });
-export default Icon;
+exports.default = Icon;

components/Icon/mapper.js

@@ -1,4 +0,7 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import OrbitPagesIcon from './svgs/orbitPages';
-import SafeVideoIcon from './svgs/safevideo';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var orbitPages_1 = (0, tslib_1.__importDefault)(require("./svgs/orbitPages"));
+var safevideo_1 = (0, tslib_1.__importDefault)(require("./svgs/safevideo"));
 var icons = {
@@ -85,7 +88,7 @@ 'icon-orbita': {
         viewBox: '0 0 487.37 542',
-        component: function () { return _jsx(SafeVideoIcon, {}, void 0); }
+        component: function () { return (0, jsx_runtime_1.jsx)(safevideo_1.default, {}, void 0); }
     },
     'icon-orbit-pages': {
         viewBox: '0 0 70 70',
-        component: function () { return _jsx(OrbitPagesIcon, {}, void 0); }
+        component: function () { return (0, jsx_runtime_1.jsx)(orbitPages_1.default, {}, void 0); }
     },
@@ -131,4 +134,5 @@ 'icon-alumy': {
 };
-export default function mapper(name) {
+function mapper(name) {
     return icons[name];
 }
+exports.default = mapper;

components/Icon/svgs/orbitPages.js

@@ -1,7 +0,9 @@
-import { __assign } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
 /* eslint-disable max-len */
 var OrbitPagesIcon = function () {
-    return (_jsxs("svg", __assign({ viewBox: '0 0 70 70', xmlns: 'http://www.w3.org/2000/svg' }, { children: [_jsx("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M33.7744 63C51.1714 63 65.2744 48.897 65.2744 31.5C65.2744 23.7688 62.4892 16.6881 57.8674 11.2066C54.3601 11.7095 49.9533 13.0568 45.3249 15.1516C45.3356 15.1592 45.3464 15.1668 45.3571 15.1745C44.9506 15.3462 44.5492 15.52 44.1531 15.6958C33.5115 20.764 22.011 29.6866 17.7167 41.3115C17.5435 41.8201 17.39 42.3184 17.2551 42.805C17.2447 42.7898 17.2343 42.7747 17.2239 42.7595C17.1475 43.0051 17.0742 43.2519 17.0043 43.4998C14.8879 51.495 15.7783 56.0226 17.4812 58.4643C22.235 61.343 27.8112 63 33.7744 63ZM5.58872 47.4866C0.193824 59.6463 4.01616 69.4995 15.2748 69.4995C-1.91161 69.4995 -3.19931 56.5529 4.52396 43.2127C3.07281 39.592 2.27445 35.6392 2.27445 31.5C2.27445 14.103 16.3775 0 33.7744 0C42.332 0 50.0925 3.41241 55.7695 8.95073C60.2271 8.26939 64.7442 8.09986 69.2747 8.49997C65.0724 8.49997 60.9733 8.99015 57.0419 9.82984C53.7511 10.025 48.0513 11.9078 41.5554 15.0894C34.9362 18.1655 29.3404 21.8376 25.2753 24.9993C20.841 28.2019 17.1097 31.5529 14.0496 34.9171C14.053 34.9369 14.0564 34.9566 14.0599 34.9764C10.7452 38.5774 7.94679 42.4459 6.0043 46.4998C5.83418 46.833 5.69744 47.1619 5.58872 47.4866ZM33.7744 51.5154C27.9818 51.5154 22.7639 49.0547 19.109 45.1215C20.4167 36.814 26.8273 25.4148 45.3994 15.2046C50.4789 18.8348 53.7899 24.7807 53.7899 31.5C53.7899 42.5542 44.8287 51.5154 33.7744 51.5154ZM41.3579 12.9711C39.019 12.0129 36.4584 11.4846 33.7744 11.4846C22.7529 11.4846 13.8121 20.3929 13.7593 31.402C16.0471 29.1294 18.5666 26.9698 21.2755 24.9998C27.53 19.9386 34.2935 15.8418 41.3579 12.9711Z', fill: '#7609F1' }, void 0), _jsx("defs", { children: _jsxs("radialGradient", __assign({ id: 'paint0_radial', cx: '0', cy: '0', r: '1', gradientUnits: 'userSpaceOnUse', gradientTransform: 'translate(49 41) rotate(24.1022) scale(104.073 103.737)' }, { children: [_jsx("stop", { stopColor: '#5505B2' }, void 0), _jsx("stop", { offset: '1', stopColor: '#7708F5' }, void 0)] }), void 0) }, void 0)] }), void 0));
+    return ((0, jsx_runtime_1.jsxs)("svg", (0, tslib_1.__assign)({ viewBox: '0 0 70 70', xmlns: 'http://www.w3.org/2000/svg' }, { children: [(0, jsx_runtime_1.jsx)("path", { fillRule: 'evenodd', clipRule: 'evenodd', d: 'M33.7744 63C51.1714 63 65.2744 48.897 65.2744 31.5C65.2744 23.7688 62.4892 16.6881 57.8674 11.2066C54.3601 11.7095 49.9533 13.0568 45.3249 15.1516C45.3356 15.1592 45.3464 15.1668 45.3571 15.1745C44.9506 15.3462 44.5492 15.52 44.1531 15.6958C33.5115 20.764 22.011 29.6866 17.7167 41.3115C17.5435 41.8201 17.39 42.3184 17.2551 42.805C17.2447 42.7898 17.2343 42.7747 17.2239 42.7595C17.1475 43.0051 17.0742 43.2519 17.0043 43.4998C14.8879 51.495 15.7783 56.0226 17.4812 58.4643C22.235 61.343 27.8112 63 33.7744 63ZM5.58872 47.4866C0.193824 59.6463 4.01616 69.4995 15.2748 69.4995C-1.91161 69.4995 -3.19931 56.5529 4.52396 43.2127C3.07281 39.592 2.27445 35.6392 2.27445 31.5C2.27445 14.103 16.3775 0 33.7744 0C42.332 0 50.0925 3.41241 55.7695 8.95073C60.2271 8.26939 64.7442 8.09986 69.2747 8.49997C65.0724 8.49997 60.9733 8.99015 57.0419 9.82984C53.7511 10.025 48.0513 11.9078 41.5554 15.0894C34.9362 18.1655 29.3404 21.8376 25.2753 24.9993C20.841 28.2019 17.1097 31.5529 14.0496 34.9171C14.053 34.9369 14.0564 34.9566 14.0599 34.9764C10.7452 38.5774 7.94679 42.4459 6.0043 46.4998C5.83418 46.833 5.69744 47.1619 5.58872 47.4866ZM33.7744 51.5154C27.9818 51.5154 22.7639 49.0547 19.109 45.1215C20.4167 36.814 26.8273 25.4148 45.3994 15.2046C50.4789 18.8348 53.7899 24.7807 53.7899 31.5C53.7899 42.5542 44.8287 51.5154 33.7744 51.5154ZM41.3579 12.9711C39.019 12.0129 36.4584 11.4846 33.7744 11.4846C22.7529 11.4846 13.8121 20.3929 13.7593 31.402C16.0471 29.1294 18.5666 26.9698 21.2755 24.9998C27.53 19.9386 34.2935 15.8418 41.3579 12.9711Z', fill: '#7609F1' }, void 0), (0, jsx_runtime_1.jsx)("defs", { children: (0, jsx_runtime_1.jsxs)("radialGradient", (0, tslib_1.__assign)({ id: 'paint0_radial', cx: '0', cy: '0', r: '1', gradientUnits: 'userSpaceOnUse', gradientTransform: 'translate(49 41) rotate(24.1022) scale(104.073 103.737)' }, { children: [(0, jsx_runtime_1.jsx)("stop", { stopColor: '#5505B2' }, void 0), (0, jsx_runtime_1.jsx)("stop", { offset: '1', stopColor: '#7708F5' }, void 0)] }), void 0) }, void 0)] }), void 0));
 };
-export default OrbitPagesIcon;
+exports.default = OrbitPagesIcon;

components/Icon/svgs/safevideo.js

@@ -1,7 +0,9 @@
-import { __assign } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
 /* eslint-disable max-len */
 var SafeVideoIcon = function () {
-    return (_jsxs("svg", __assign({ xmlns: 'http://www.w3.org/2000/svg', viewBox: '0 0 487.37 542' }, { children: [_jsx("path", { fill: '#e58000', d: 'M333.22,188.08s7.17-29.54,44.91-83.2c39.61-56.33,59.72-64.09,59.72-64.09L400.23,29,163.91,103.09c-.3-.56-7.35,74.08-7.35,112.78,0,72.19,8,124.41,8,124.41s21.25,21.46,60.88,37.59c63.86,26,107.71,24.41,107.71,24.41Z', transform: 'translate(-156.56 -29)' }, void 0), _jsx("path", { fill: '#fbbb2e', d: 'M437.85,40.79s-20.55,6.46-63.19,67.09c-36.9,54.08-41.44,80.2-41.44,80.2L510.3,305.82S534,340.93,544.74,384c5.78,23.15,12.61,96.29,12.61,96.29s41.49-35.7,61-74.73c20.46-40.9,25.57-131.75,25.57-182,0-41.42-7.38-120.4-7.38-120.4Z', transform: 'translate(-156.56 -29)' }, void 0), _jsx("path", { fill: '#faa400', d: 'M164.59,340.28s46.14,31.33,81.93,44.67c40,14.88,86.66,17.33,86.66,17.33L510.3,305.82s11.37,9.27,31.38,58.23c22.67,55.48,15.67,116.22,15.67,116.22S510.13,517.39,482.78,532c-28.44,15.2-82.55,39-82.55,39s-105.44-41.4-166.51-98.56C173.19,415.79,164.59,340.28,164.59,340.28Z', transform: 'translate(-156.56 -29)' }, void 0), _jsx("path", { style: { isolation: 'isolate' }, opacity: '0.05', d: 'M333.22,187.48s65.17-83.3,199.3-117C505.09,61.88,458,47.1,437.89,40.79,412.74,51.33,347.47,135.2,333.22,187.48Z', transform: 'translate(-156.56 -29)' }, void 0), _jsx("path", { opacity: '0.08', style: { isolation: 'isolate' }, d: 'M510.43,305.5S534.35,411.1,475,536c26.14-11.83,65.4-42.86,82.32-55.77C564.45,416.76,541.76,344,510.43,305.5Z', transform: 'translate(-156.56 -29)' }, void 0), _jsx("path", { opacity: '0.07', style: { isolation: 'isolate' }, d: 'M333.5,402S225.36,356.74,156.78,236.63c-.22,29.47,4.55,81.79,7.81,103.65C212.25,374.88,268.63,400.38,333.5,402Z', transform: 'translate(-156.56 -29)' }, void 0)] }), void 0));
+    return ((0, jsx_runtime_1.jsxs)("svg", (0, tslib_1.__assign)({ xmlns: 'http://www.w3.org/2000/svg', viewBox: '0 0 487.37 542' }, { children: [(0, jsx_runtime_1.jsx)("path", { fill: '#e58000', d: 'M333.22,188.08s7.17-29.54,44.91-83.2c39.61-56.33,59.72-64.09,59.72-64.09L400.23,29,163.91,103.09c-.3-.56-7.35,74.08-7.35,112.78,0,72.19,8,124.41,8,124.41s21.25,21.46,60.88,37.59c63.86,26,107.71,24.41,107.71,24.41Z', transform: 'translate(-156.56 -29)' }, void 0), (0, jsx_runtime_1.jsx)("path", { fill: '#fbbb2e', d: 'M437.85,40.79s-20.55,6.46-63.19,67.09c-36.9,54.08-41.44,80.2-41.44,80.2L510.3,305.82S534,340.93,544.74,384c5.78,23.15,12.61,96.29,12.61,96.29s41.49-35.7,61-74.73c20.46-40.9,25.57-131.75,25.57-182,0-41.42-7.38-120.4-7.38-120.4Z', transform: 'translate(-156.56 -29)' }, void 0), (0, jsx_runtime_1.jsx)("path", { fill: '#faa400', d: 'M164.59,340.28s46.14,31.33,81.93,44.67c40,14.88,86.66,17.33,86.66,17.33L510.3,305.82s11.37,9.27,31.38,58.23c22.67,55.48,15.67,116.22,15.67,116.22S510.13,517.39,482.78,532c-28.44,15.2-82.55,39-82.55,39s-105.44-41.4-166.51-98.56C173.19,415.79,164.59,340.28,164.59,340.28Z', transform: 'translate(-156.56 -29)' }, void 0), (0, jsx_runtime_1.jsx)("path", { style: { isolation: 'isolate' }, opacity: '0.05', d: 'M333.22,187.48s65.17-83.3,199.3-117C505.09,61.88,458,47.1,437.89,40.79,412.74,51.33,347.47,135.2,333.22,187.48Z', transform: 'translate(-156.56 -29)' }, void 0), (0, jsx_runtime_1.jsx)("path", { opacity: '0.08', style: { isolation: 'isolate' }, d: 'M510.43,305.5S534.35,411.1,475,536c26.14-11.83,65.4-42.86,82.32-55.77C564.45,416.76,541.76,344,510.43,305.5Z', transform: 'translate(-156.56 -29)' }, void 0), (0, jsx_runtime_1.jsx)("path", { opacity: '0.07', style: { isolation: 'isolate' }, d: 'M333.5,402S225.36,356.74,156.78,236.63c-.22,29.47,4.55,81.79,7.81,103.65C212.25,374.88,268.63,400.38,333.5,402Z', transform: 'translate(-156.56 -29)' }, void 0)] }), void 0));
 };
-export default SafeVideoIcon;
+exports.default = SafeVideoIcon;

components/Toolbar/Action/index.d.ts

@@ -0,3 +1,3 @@
+import { IEduzzToolbarAction } from '@/interfaces';
 import { IStylesProps } from '@/interfaces/styles';
-import { IEduzzToolbarAction } from '@/interfaces/toolbar';
 declare const _default: import("@emotion/styled").StyledComponent<IEduzzToolbarAction & IStylesProps & {
@@ -4,0 +4,0 @@ theme?: import("@emotion/react").Theme;

components/Toolbar/Action/index.js

@@ -1,12 +0,14 @@
-import { __assign, __makeTemplateObject, __rest } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo } from 'react';
-import styled from '@emotion/styled';
-import { TOOLBAR_HEIGHT } from '@/assets/theme';
-import clsx from '@/helpers/className';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styled_1 = (0, tslib_1.__importDefault)(require("@emotion/styled"));
+var theme_1 = require("@/assets/theme");
+var className_1 = (0, tslib_1.__importDefault)(require("@/helpers/className"));
 var ToolbarAction = function (_a) {
-    var className = _a.className, active = _a.active, icon = _a.icon, label = _a.label, children = _a.children, rest = __rest(_a, ["className", "active", "icon", "label", "children"]);
-    return (_jsxs("div", __assign({ className: clsx('eduzz-apps-toolbar-action', className) }, rest, { children: [_jsxs("div", __assign({ className: clsx('eduzz-apps-toolbar-action-button', active && '--active') }, { children: [icon && _jsx("div", __assign({ className: 'eduzz-apps-toolbar-action-icon' }, { children: icon }), void 0), label && _jsx("div", __assign({ className: 'eduzz-apps-toolbar-action-label' }, { children: label }), void 0)] }), void 0), children] }), void 0));
+    var className = _a.className, active = _a.active, icon = _a.icon, label = _a.label, children = _a.children, rest = (0, tslib_1.__rest)(_a, ["className", "active", "icon", "label", "children"]);
+    return ((0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-apps-toolbar-action', className) }, rest, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-apps-toolbar-action-button', active && '--active') }, { children: [icon && (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-apps-toolbar-action-icon' }, { children: icon }), void 0), label && (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-apps-toolbar-action-label' }, { children: label }), void 0)] }), void 0), children] }), void 0));
 };
-export default styled(memo(ToolbarAction))(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n\n  .eduzz-apps-toolbar-action-button {\n    display: flex;\n    align-items: center;\n    padding: 0 ", "px;\n    transition: ", ";\n    height: ", "px;\n    cursor: pointer;\n    flex-wrap: wrap;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    .eduzz-apps-toolbar-action-icon {\n      line-height: 0;\n\n      svg {\n        width: 24px;\n        height: 24px;\n      }\n    }\n\n    .eduzz-apps-toolbar-action-label {\n      font-size: 14px;\n      margin-left: ", "px;\n\n      &::selection {\n        background: transparent;\n      }\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n"], ["\n  position: relative;\n\n  .eduzz-apps-toolbar-action-button {\n    display: flex;\n    align-items: center;\n    padding: 0 ", "px;\n    transition: ", ";\n    height: ", "px;\n    cursor: pointer;\n    flex-wrap: wrap;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    .eduzz-apps-toolbar-action-icon {\n      line-height: 0;\n\n      svg {\n        width: 24px;\n        height: 24px;\n      }\n    }\n\n    .eduzz-apps-toolbar-action-label {\n      font-size: 14px;\n      margin-left: ", "px;\n\n      &::selection {\n        background: transparent;\n      }\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n"])), function (_a) {
+exports.default = (0, styled_1.default)((0, react_1.memo)(ToolbarAction))(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  position: relative;\n\n  .eduzz-apps-toolbar-action-button {\n    display: flex;\n    align-items: center;\n    padding: 0 ", "px;\n    transition: ", ";\n    height: ", "px;\n    cursor: pointer;\n    flex-wrap: wrap;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    .eduzz-apps-toolbar-action-icon {\n      line-height: 0;\n\n      svg {\n        width: 24px;\n        height: 24px;\n      }\n    }\n\n    .eduzz-apps-toolbar-action-label {\n      font-size: 14px;\n      margin-left: ", "px;\n\n      &::selection {\n        background: transparent;\n      }\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n"], ["\n  position: relative;\n\n  .eduzz-apps-toolbar-action-button {\n    display: flex;\n    align-items: center;\n    padding: 0 ", "px;\n    transition: ", ";\n    height: ", "px;\n    cursor: pointer;\n    flex-wrap: wrap;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    .eduzz-apps-toolbar-action-icon {\n      line-height: 0;\n\n      svg {\n        width: 24px;\n        height: 24px;\n      }\n    }\n\n    .eduzz-apps-toolbar-action-label {\n      font-size: 14px;\n      margin-left: ", "px;\n\n      &::selection {\n        background: transparent;\n      }\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n"])), function (_a) {
     var theme = _a.theme;
@@ -17,3 +19,3 @@ return theme.spacing(3);
     return theme.trasitionDuration;
-}, TOOLBAR_HEIGHT, function (_a) {
+}, theme_1.TOOLBAR_HEIGHT, function (_a) {
     var theme = _a.theme;
@@ -20,0 +22,0 @@ return theme.spacing(2);

components/Toolbar/Apps/Advanced/index.js

@@ -1,18 +0,20 @@
-import { __assign } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useCallback } from 'react';
-import CancelIcon from '@eduzz/houston-icons/Cancel';
-import { useAppsContext } from '../context';
-import styles from './styles';
-import MyIcon from '@/components/Icon';
-import { useToolbarContext } from '@/context';
-import clsx from '@/helpers/className';
-import { buildUrl } from '@/helpers/url';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var Cancel_1 = (0, tslib_1.__importDefault)(require("@eduzz/houston-icons/Cancel"));
+var context_1 = require("../context");
+var styles_1 = (0, tslib_1.__importDefault)(require("./styles"));
+var Icon_1 = (0, tslib_1.__importDefault)(require("@/components/Icon"));
+var context_2 = require("@/context");
+var className_1 = (0, tslib_1.__importDefault)(require("@/helpers/className"));
+var url_1 = require("@/helpers/url");
 var AdvancedApps = function (_a) {
     var className = _a.className;
-    var application = useToolbarContext().application;
-    var _b = useAppsContext(), applications = _b.applications, opened = _b.opened, setOpenedAdvanced = _b.setOpenedAdvanced;
+    var application = (0, context_2.useToolbarContext)().application;
+    var _b = (0, context_1.useAppsContext)(), applications = _b.applications, opened = _b.opened, setOpenedAdvanced = _b.setOpenedAdvanced;
     var advanced = opened.advanced;
-    var handleClickClose = useCallback(function () { return setOpenedAdvanced(false); }, [setOpenedAdvanced]);
-    var handleClickApplication = useCallback(function (app) {
+    var handleClickClose = (0, react_1.useCallback)(function () { return setOpenedAdvanced(false); }, [setOpenedAdvanced]);
+    var handleClickApplication = (0, react_1.useCallback)(function (app) {
         if (application !== app) {
@@ -22,7 +24,7 @@ setOpenedAdvanced(false);
     }, [application, setOpenedAdvanced]);
-    return (_jsxs("div", __assign({ className: clsx('eduzz-toolbar-advanced-apps', className, advanced && '--active') }, { children: [_jsxs("div", __assign({ className: 'eduzz-toolbar-advanced-apps-header' }, { children: [_jsx("div", __assign({ className: 'eduzz-toolbar-advanced-apps-title' }, { children: "Lista de Apps" }), void 0), _jsxs("div", __assign({ className: 'eduzz-toolbar-advanced-apps-button-close', onClick: handleClickClose }, { children: ["Esc ", _jsx(CancelIcon, {}, void 0)] }), void 0)] }), void 0), _jsx("div", __assign({ className: 'eduzz-toolbar-advanced-apps-list-apps' }, { children: applications.map(function (app) {
+    return ((0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-advanced-apps', className, advanced && '--active') }, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-advanced-apps-header' }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-advanced-apps-title' }, { children: "Lista de Apps" }), void 0), (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-advanced-apps-button-close', onClick: handleClickClose }, { children: ["Esc ", (0, jsx_runtime_1.jsx)(Cancel_1.default, {}, void 0)] }), void 0)] }), void 0), (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-advanced-apps-list-apps' }, { children: applications.map(function (app) {
                     var isActive = app.application === application;
-                    return (_jsx("div", __assign({ className: clsx('eduzz-toolbar-advanced-apps-list-apps-item', isActive && '--active') }, { children: _jsxs("a", __assign({ href: buildUrl(app.application, application), rel: 'noopener noreferrer', target: '_blank', onClick: function () { return handleClickApplication(app.application); } }, { children: [_jsx("div", __assign({ className: 'eduzz-toolbar-icon' }, { children: _jsx(MyIcon, { name: app.icon }, void 0) }), void 0), _jsx("div", __assign({ className: 'eduzz-toolbar-label' }, { children: app.label }), void 0), _jsx("div", __assign({ className: 'eduzz-toolbar-description' }, { children: app.description }), void 0)] }), app.application) }), app.application));
+                    return ((0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-advanced-apps-list-apps-item', isActive && '--active') }, { children: (0, jsx_runtime_1.jsxs)("a", (0, tslib_1.__assign)({ href: (0, url_1.buildUrl)(app.application, application), rel: 'noopener noreferrer', target: '_blank', onClick: function () { return handleClickApplication(app.application); } }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-icon' }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: app.icon }, void 0) }), void 0), (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-label' }, { children: app.label }), void 0), (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-description' }, { children: app.description }), void 0)] }), app.application) }), app.application));
                 }) }), void 0)] }), void 0));
 };
-export default styles(memo(AdvancedApps));
+exports.default = (0, styles_1.default)((0, react_1.memo)(AdvancedApps));

components/Toolbar/Apps/Advanced/styles.js

@@ -1,5 +0,7 @@
-import { __makeTemplateObject } from "tslib";
-import styled from '@emotion/styled';
-import { TOOLBAR_HEIGHT } from '@/assets/theme';
-export default (function (Component) { return styled(Component)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: 100%;\n  height: calc(100vh - ", "px);\n  top: ", "px;\n  left: 0;\n  position: absolute;\n  background: white;\n  padding: ", "px;\n  overflow: scroll;\n  box-sizing: border-box;\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  z-index: 1099;\n  transition: ", ";\n\n  ", " {\n    padding: ", "px;\n  }\n\n  &.--active {\n    opacity: 1;\n    visibility: visible;\n    user-select: auto;\n  }\n\n  .eduzz-toolbar-advanced-apps-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    width: 100%;\n\n    .eduzz-toolbar-advanced-apps-title {\n      color: #37474f;\n      font-weight: 500;\n    }\n\n    .eduzz-toolbar-advanced-apps-button-close {\n      color: ", ";\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      padding: ", "px ", "px;\n      border-radius: ", "px;\n      transition: ", ";\n      cursor: pointer;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.05);\n      }\n\n      span.houston-icon {\n        margin-left: ", "px;\n      }\n    }\n  }\n\n  .eduzz-toolbar-advanced-apps-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    flex-direction: row;\n    margin-top: ", "px;\n\n    .eduzz-toolbar-advanced-apps-list-apps-item {\n      width: calc(25% - ", "px);\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      cursor: pointer;\n      height: auto;\n\n      ", " {\n        width: calc(50% - ", "px);\n      }\n\n      ", " {\n        width: 100%;\n        margin: ", "px 0;\n        padding: ", "px ", "px;\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      a {\n        padding: ", "px;\n        display: block;\n        text-decoration: none;\n\n        ", " {\n          padding: ", "px 0;\n        }\n      }\n\n      .eduzz-toolbar-icon {\n        margin-bottom: ", "px;\n        text-align: center;\n\n        svg {\n          max-width: 80px;\n        }\n      }\n\n      .eduzz-toolbar-label {\n        margin-bottom: ", "px;\n        color: #37474f;\n        font-weight: 500;\n        font-size: 15px;\n      }\n\n      .eduzz-toolbar-description {\n        font-size: 14px;\n        color: #7c7c7c;\n      }\n    }\n  }\n"], ["\n  width: 100%;\n  height: calc(100vh - ", "px);\n  top: ", "px;\n  left: 0;\n  position: absolute;\n  background: white;\n  padding: ", "px;\n  overflow: scroll;\n  box-sizing: border-box;\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  z-index: 1099;\n  transition: ", ";\n\n  ", " {\n    padding: ", "px;\n  }\n\n  &.--active {\n    opacity: 1;\n    visibility: visible;\n    user-select: auto;\n  }\n\n  .eduzz-toolbar-advanced-apps-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    width: 100%;\n\n    .eduzz-toolbar-advanced-apps-title {\n      color: #37474f;\n      font-weight: 500;\n    }\n\n    .eduzz-toolbar-advanced-apps-button-close {\n      color: ", ";\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      padding: ", "px ", "px;\n      border-radius: ", "px;\n      transition: ", ";\n      cursor: pointer;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.05);\n      }\n\n      span.houston-icon {\n        margin-left: ", "px;\n      }\n    }\n  }\n\n  .eduzz-toolbar-advanced-apps-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    flex-direction: row;\n    margin-top: ", "px;\n\n    .eduzz-toolbar-advanced-apps-list-apps-item {\n      width: calc(25% - ", "px);\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      cursor: pointer;\n      height: auto;\n\n      ", " {\n        width: calc(50% - ", "px);\n      }\n\n      ", " {\n        width: 100%;\n        margin: ", "px 0;\n        padding: ", "px ", "px;\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      a {\n        padding: ", "px;\n        display: block;\n        text-decoration: none;\n\n        ", " {\n          padding: ", "px 0;\n        }\n      }\n\n      .eduzz-toolbar-icon {\n        margin-bottom: ", "px;\n        text-align: center;\n\n        svg {\n          max-width: 80px;\n        }\n      }\n\n      .eduzz-toolbar-label {\n        margin-bottom: ", "px;\n        color: #37474f;\n        font-weight: 500;\n        font-size: 15px;\n      }\n\n      .eduzz-toolbar-description {\n        font-size: 14px;\n        color: #7c7c7c;\n      }\n    }\n  }\n"])), TOOLBAR_HEIGHT, TOOLBAR_HEIGHT, function (_a) {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var styled_1 = (0, tslib_1.__importDefault)(require("@emotion/styled"));
+var theme_1 = require("@/assets/theme");
+exports.default = (function (Component) { return (0, styled_1.default)(Component)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  width: 100%;\n  height: calc(100vh - ", "px);\n  top: ", "px;\n  left: 0;\n  position: absolute;\n  background: white;\n  padding: ", "px;\n  overflow: scroll;\n  box-sizing: border-box;\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  z-index: 1099;\n  transition: ", ";\n\n  ", " {\n    padding: ", "px;\n  }\n\n  &.--active {\n    opacity: 1;\n    visibility: visible;\n    user-select: auto;\n  }\n\n  .eduzz-toolbar-advanced-apps-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    width: 100%;\n\n    .eduzz-toolbar-advanced-apps-title {\n      color: #37474f;\n      font-weight: 500;\n    }\n\n    .eduzz-toolbar-advanced-apps-button-close {\n      color: ", ";\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      padding: ", "px ", "px;\n      border-radius: ", "px;\n      transition: ", ";\n      cursor: pointer;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.05);\n      }\n\n      span.houston-icon {\n        margin-left: ", "px;\n      }\n    }\n  }\n\n  .eduzz-toolbar-advanced-apps-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    flex-direction: row;\n    margin-top: ", "px;\n\n    .eduzz-toolbar-advanced-apps-list-apps-item {\n      width: calc(25% - ", "px);\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      cursor: pointer;\n      height: auto;\n\n      ", " {\n        width: calc(50% - ", "px);\n      }\n\n      ", " {\n        width: 100%;\n        margin: ", "px 0;\n        padding: ", "px ", "px;\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      a {\n        padding: ", "px;\n        display: block;\n        text-decoration: none;\n\n        ", " {\n          padding: ", "px 0;\n        }\n      }\n\n      .eduzz-toolbar-icon {\n        margin-bottom: ", "px;\n        text-align: center;\n\n        svg {\n          max-width: 80px;\n        }\n      }\n\n      .eduzz-toolbar-label {\n        margin-bottom: ", "px;\n        color: #37474f;\n        font-weight: 500;\n        font-size: 15px;\n      }\n\n      .eduzz-toolbar-description {\n        font-size: 14px;\n        color: #7c7c7c;\n      }\n    }\n  }\n"], ["\n  width: 100%;\n  height: calc(100vh - ", "px);\n  top: ", "px;\n  left: 0;\n  position: absolute;\n  background: white;\n  padding: ", "px;\n  overflow: scroll;\n  box-sizing: border-box;\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  z-index: 1099;\n  transition: ", ";\n\n  ", " {\n    padding: ", "px;\n  }\n\n  &.--active {\n    opacity: 1;\n    visibility: visible;\n    user-select: auto;\n  }\n\n  .eduzz-toolbar-advanced-apps-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    width: 100%;\n\n    .eduzz-toolbar-advanced-apps-title {\n      color: #37474f;\n      font-weight: 500;\n    }\n\n    .eduzz-toolbar-advanced-apps-button-close {\n      color: ", ";\n      font-weight: 500;\n      display: flex;\n      align-items: center;\n      padding: ", "px ", "px;\n      border-radius: ", "px;\n      transition: ", ";\n      cursor: pointer;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.05);\n      }\n\n      span.houston-icon {\n        margin-left: ", "px;\n      }\n    }\n  }\n\n  .eduzz-toolbar-advanced-apps-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    flex-direction: row;\n    margin-top: ", "px;\n\n    .eduzz-toolbar-advanced-apps-list-apps-item {\n      width: calc(25% - ", "px);\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      cursor: pointer;\n      height: auto;\n\n      ", " {\n        width: calc(50% - ", "px);\n      }\n\n      ", " {\n        width: 100%;\n        margin: ", "px 0;\n        padding: ", "px ", "px;\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      a {\n        padding: ", "px;\n        display: block;\n        text-decoration: none;\n\n        ", " {\n          padding: ", "px 0;\n        }\n      }\n\n      .eduzz-toolbar-icon {\n        margin-bottom: ", "px;\n        text-align: center;\n\n        svg {\n          max-width: 80px;\n        }\n      }\n\n      .eduzz-toolbar-label {\n        margin-bottom: ", "px;\n        color: #37474f;\n        font-weight: 500;\n        font-size: 15px;\n      }\n\n      .eduzz-toolbar-description {\n        font-size: 14px;\n        color: #7c7c7c;\n      }\n    }\n  }\n"])), theme_1.TOOLBAR_HEIGHT, theme_1.TOOLBAR_HEIGHT, function (_a) {
     var theme = _a.theme;
@@ -6,0 +8,0 @@ return theme.spacing(10);

components/Toolbar/Apps/context.js

@@ -1,6 +0,10 @@
-import { createContext, useContext } from 'react';
-var AppsContext = createContext({});
-export function useAppsContext() {
-    return useContext(AppsContext);
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAppsContext = void 0;
+var react_1 = require("react");
+var AppsContext = (0, react_1.createContext)({});
+function useAppsContext() {
+    return (0, react_1.useContext)(AppsContext);
 }
-export default AppsContext;
+exports.useAppsContext = useAppsContext;
+exports.default = AppsContext;

components/Toolbar/Apps/Dropdown/index.js

@@ -1,19 +0,21 @@
-import { __assign } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useCallback, useEffect, useState } from 'react';
-import ExpandIcon from '@eduzz/houston-icons/Expand';
-import { useAppsContext } from '../context';
-import styles from './styles';
-import { DROPDOWN_WIDTH, TOOLBAR_HEIGHT } from '@/assets/theme';
-import MyIcon from '@/components/Icon';
-import { useToolbarContext } from '@/context';
-import clsx from '@/helpers/className';
-import { buildUrl } from '@/helpers/url';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var Expand_1 = (0, tslib_1.__importDefault)(require("@eduzz/houston-icons/Expand"));
+var context_1 = require("../context");
+var styles_1 = (0, tslib_1.__importDefault)(require("./styles"));
+var theme_1 = require("@/assets/theme");
+var Icon_1 = (0, tslib_1.__importDefault)(require("@/components/Icon"));
+var context_2 = require("@/context");
+var className_1 = (0, tslib_1.__importDefault)(require("@/helpers/className"));
+var url_1 = require("@/helpers/url");
 var DropdownApps = function (_a) {
     var className = _a.className;
-    var application = useToolbarContext().application;
-    var _b = useAppsContext(), applications = _b.applications, opened = _b.opened, setOpenDropdown = _b.setOpenDropdown, setOpenedAdvanced = _b.setOpenedAdvanced;
+    var application = (0, context_2.useToolbarContext)().application;
+    var _b = (0, context_1.useAppsContext)(), applications = _b.applications, opened = _b.opened, setOpenDropdown = _b.setOpenDropdown, setOpenedAdvanced = _b.setOpenedAdvanced;
     var dropdown = opened.dropdown;
-    var _c = useState(), position = _c[0], setPosition = _c[1];
-    var handleClickApplication = useCallback(function (app) {
+    var _c = (0, react_1.useState)(), position = _c[0], setPosition = _c[1];
+    var handleClickApplication = (0, react_1.useCallback)(function (app) {
         if (application !== app) {
@@ -23,7 +25,7 @@ setOpenDropdown(null);
     }, [application, setOpenDropdown]);
-    var handleClickExpand = useCallback(function () {
+    var handleClickExpand = (0, react_1.useCallback)(function () {
         setOpenDropdown(null);
         setOpenedAdvanced(true);
     }, [setOpenDropdown, setOpenedAdvanced]);
-    var handleCalculatePosition = useCallback(function () {
+    var handleCalculatePosition = (0, react_1.useCallback)(function () {
         if (!dropdown) {
@@ -33,5 +35,5 @@ return;
         var right = dropdown.getBoundingClientRect().right;
-        setPosition({ top: TOOLBAR_HEIGHT, right: right - DROPDOWN_WIDTH });
+        setPosition({ top: theme_1.TOOLBAR_HEIGHT, right: right - theme_1.DROPDOWN_WIDTH });
     }, [dropdown]);
-    useEffect(function () {
+    (0, react_1.useEffect)(function () {
         handleCalculatePosition();
@@ -43,7 +45,7 @@ dropdown && window.addEventListener('resize', handleCalculatePosition);
     }, [dropdown, handleCalculatePosition]);
-    return (_jsxs("div", __assign({ className: clsx('eduzz-toolbar-apps-dropdown', className, dropdown && '--opened'), style: position ? { top: position === null || position === void 0 ? void 0 : position.top, left: position === null || position === void 0 ? void 0 : position.right } : {} }, { children: [_jsx("div", __assign({ className: 'eduzz-toolbar-apps-dropdown-list-apps' }, { children: applications.map(function (app) {
+    return ((0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-apps-dropdown', className, dropdown && '--opened'), style: position ? { top: position === null || position === void 0 ? void 0 : position.top, left: position === null || position === void 0 ? void 0 : position.right } : {} }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-apps-dropdown-list-apps' }, { children: applications.map(function (app) {
                     var isActive = app.application === application;
-                    return (_jsx("div", __assign({ className: clsx('eduzz-toolbar-apps-dropdown-item', isActive && '--active') }, { children: _jsxs("a", __assign({ href: buildUrl(app.application, application), rel: 'noopener noreferrer', target: '_blank', onClick: function () { return handleClickApplication(app.application); } }, { children: [_jsx("div", __assign({ className: 'eduzz-toolbar-icon' }, { children: _jsx(MyIcon, { name: app.icon }, void 0) }), void 0), _jsx("div", __assign({ className: 'eduzz-toolbar-label' }, { children: app.label }), void 0)] }), app.application) }), app.application));
-                }) }), void 0), _jsx("div", __assign({ className: 'eduzz-toolbar-apps-dropdown-expand' }, { children: _jsxs("span", __assign({ onClick: handleClickExpand }, { children: [_jsx(ExpandIcon, {}, void 0), " Ver mais"] }), void 0) }), void 0)] }), void 0));
+                    return ((0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-apps-dropdown-item', isActive && '--active') }, { children: (0, jsx_runtime_1.jsxs)("a", (0, tslib_1.__assign)({ href: (0, url_1.buildUrl)(app.application, application), rel: 'noopener noreferrer', target: '_blank', onClick: function () { return handleClickApplication(app.application); } }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-icon' }, { children: (0, jsx_runtime_1.jsx)(Icon_1.default, { name: app.icon }, void 0) }), void 0), (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-label' }, { children: app.label }), void 0)] }), app.application) }), app.application));
+                }) }), void 0), (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-apps-dropdown-expand' }, { children: (0, jsx_runtime_1.jsxs)("span", (0, tslib_1.__assign)({ onClick: handleClickExpand }, { children: [(0, jsx_runtime_1.jsx)(Expand_1.default, {}, void 0), " Ver mais"] }), void 0) }), void 0)] }), void 0));
 };
-export default styles(memo(DropdownApps));
+exports.default = (0, styles_1.default)((0, react_1.memo)(DropdownApps));

components/Toolbar/Apps/Dropdown/styles.js

@@ -1,5 +0,7 @@
-import { __makeTemplateObject } from "tslib";
-import styled from '@emotion/styled';
-import { DROPDOWN_WIDTH } from '@/assets/theme';
-export default (function (Component) { return styled(Component)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: ", "px;\n  position: fixed;\n  padding: ", "px ", "px;\n  background: #fff;\n  box-shadow: ", ";\n  top: 0;\n  right: 0;\n  border-radius: 0 0 ", "px ", "px;\n  z-index: 1099;\n  transition: opacity ", ";\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  box-sizing: border-box;\n\n  ", " {\n    width: calc(100% - ", "px);\n    margin: 0 ", "px;\n    left: auto !important;\n  }\n\n  &.--opened {\n    opacity: 1;\n    visibility: visible;\n    user-select: initial;\n  }\n\n  .eduzz-toolbar-apps-dropdown-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    justify-items: center;\n    box-sizing: border-box;\n\n    .eduzz-toolbar-apps-dropdown-item {\n      width: calc(33% - ", "px);\n      text-align: center;\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      text-decoration: none;\n      cursor: pointer;\n\n      a {\n        text-decoration: none;\n        padding: ", "px ", "px;\n        display: block;\n\n        .eduzz-toolbar-icon {\n          svg {\n            width: ", "px;\n          }\n        }\n\n        .eduzz-toolbar-label {\n          display: block;\n          font-size: 13px;\n          margin-top: ", "px;\n          color: ", ";\n          font-weight: 500;\n          line-height: 1;\n\n          &::selection {\n            background: none;\n          }\n        }\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n    }\n  }\n\n  .eduzz-toolbar-apps-dropdown-expand {\n    text-align: center;\n\n    span:not(.houston-icon) {\n      display: flex;\n      align-items: center;\n      font-size: 13px;\n      cursor: pointer;\n      color: ", ";\n      justify-content: center;\n      transition: ", ";\n      border-radius: ", "px;\n      padding: ", "px 0;\n      font-weight: 500;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      .houston-icon {\n        margin-right: ", "px;\n      }\n    }\n  }\n"], ["\n  width: ", "px;\n  position: fixed;\n  padding: ", "px ", "px;\n  background: #fff;\n  box-shadow: ", ";\n  top: 0;\n  right: 0;\n  border-radius: 0 0 ", "px ", "px;\n  z-index: 1099;\n  transition: opacity ", ";\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  box-sizing: border-box;\n\n  ", " {\n    width: calc(100% - ", "px);\n    margin: 0 ", "px;\n    left: auto !important;\n  }\n\n  &.--opened {\n    opacity: 1;\n    visibility: visible;\n    user-select: initial;\n  }\n\n  .eduzz-toolbar-apps-dropdown-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    justify-items: center;\n    box-sizing: border-box;\n\n    .eduzz-toolbar-apps-dropdown-item {\n      width: calc(33% - ", "px);\n      text-align: center;\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      text-decoration: none;\n      cursor: pointer;\n\n      a {\n        text-decoration: none;\n        padding: ", "px ", "px;\n        display: block;\n\n        .eduzz-toolbar-icon {\n          svg {\n            width: ", "px;\n          }\n        }\n\n        .eduzz-toolbar-label {\n          display: block;\n          font-size: 13px;\n          margin-top: ", "px;\n          color: ", ";\n          font-weight: 500;\n          line-height: 1;\n\n          &::selection {\n            background: none;\n          }\n        }\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n    }\n  }\n\n  .eduzz-toolbar-apps-dropdown-expand {\n    text-align: center;\n\n    span:not(.houston-icon) {\n      display: flex;\n      align-items: center;\n      font-size: 13px;\n      cursor: pointer;\n      color: ", ";\n      justify-content: center;\n      transition: ", ";\n      border-radius: ", "px;\n      padding: ", "px 0;\n      font-weight: 500;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      .houston-icon {\n        margin-right: ", "px;\n      }\n    }\n  }\n"])), DROPDOWN_WIDTH, function (_a) {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var styled_1 = (0, tslib_1.__importDefault)(require("@emotion/styled"));
+var theme_1 = require("@/assets/theme");
+exports.default = (function (Component) { return (0, styled_1.default)(Component)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  width: ", "px;\n  position: fixed;\n  padding: ", "px ", "px;\n  background: #fff;\n  box-shadow: ", ";\n  top: 0;\n  right: 0;\n  border-radius: 0 0 ", "px ", "px;\n  z-index: 1099;\n  transition: opacity ", ";\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  box-sizing: border-box;\n\n  ", " {\n    width: calc(100% - ", "px);\n    margin: 0 ", "px;\n    left: auto !important;\n  }\n\n  &.--opened {\n    opacity: 1;\n    visibility: visible;\n    user-select: initial;\n  }\n\n  .eduzz-toolbar-apps-dropdown-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    justify-items: center;\n    box-sizing: border-box;\n\n    .eduzz-toolbar-apps-dropdown-item {\n      width: calc(33% - ", "px);\n      text-align: center;\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      text-decoration: none;\n      cursor: pointer;\n\n      a {\n        text-decoration: none;\n        padding: ", "px ", "px;\n        display: block;\n\n        .eduzz-toolbar-icon {\n          svg {\n            width: ", "px;\n          }\n        }\n\n        .eduzz-toolbar-label {\n          display: block;\n          font-size: 13px;\n          margin-top: ", "px;\n          color: ", ";\n          font-weight: 500;\n          line-height: 1;\n\n          &::selection {\n            background: none;\n          }\n        }\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n    }\n  }\n\n  .eduzz-toolbar-apps-dropdown-expand {\n    text-align: center;\n\n    span:not(.houston-icon) {\n      display: flex;\n      align-items: center;\n      font-size: 13px;\n      cursor: pointer;\n      color: ", ";\n      justify-content: center;\n      transition: ", ";\n      border-radius: ", "px;\n      padding: ", "px 0;\n      font-weight: 500;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      .houston-icon {\n        margin-right: ", "px;\n      }\n    }\n  }\n"], ["\n  width: ", "px;\n  position: fixed;\n  padding: ", "px ", "px;\n  background: #fff;\n  box-shadow: ", ";\n  top: 0;\n  right: 0;\n  border-radius: 0 0 ", "px ", "px;\n  z-index: 1099;\n  transition: opacity ", ";\n  opacity: 0;\n  visibility: hidden;\n  user-select: none;\n  box-sizing: border-box;\n\n  ", " {\n    width: calc(100% - ", "px);\n    margin: 0 ", "px;\n    left: auto !important;\n  }\n\n  &.--opened {\n    opacity: 1;\n    visibility: visible;\n    user-select: initial;\n  }\n\n  .eduzz-toolbar-apps-dropdown-list-apps {\n    display: flex;\n    flex-wrap: wrap;\n    justify-items: center;\n    box-sizing: border-box;\n\n    .eduzz-toolbar-apps-dropdown-item {\n      width: calc(33% - ", "px);\n      text-align: center;\n      transition: ", ";\n      border-radius: ", "px;\n      margin: ", "px;\n      text-decoration: none;\n      cursor: pointer;\n\n      a {\n        text-decoration: none;\n        padding: ", "px ", "px;\n        display: block;\n\n        .eduzz-toolbar-icon {\n          svg {\n            width: ", "px;\n          }\n        }\n\n        .eduzz-toolbar-label {\n          display: block;\n          font-size: 13px;\n          margin-top: ", "px;\n          color: ", ";\n          font-weight: 500;\n          line-height: 1;\n\n          &::selection {\n            background: none;\n          }\n        }\n      }\n\n      &.--active {\n        background: rgba(0, 0, 0, 0.04);\n\n        a {\n          cursor: no-drop;\n\n          .eduzz-toolbar-label {\n            color: ", ";\n          }\n        }\n      }\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n    }\n  }\n\n  .eduzz-toolbar-apps-dropdown-expand {\n    text-align: center;\n\n    span:not(.houston-icon) {\n      display: flex;\n      align-items: center;\n      font-size: 13px;\n      cursor: pointer;\n      color: ", ";\n      justify-content: center;\n      transition: ", ";\n      border-radius: ", "px;\n      padding: ", "px 0;\n      font-weight: 500;\n\n      &:hover {\n        background: rgba(0, 0, 0, 0.04);\n      }\n\n      .houston-icon {\n        margin-right: ", "px;\n      }\n    }\n  }\n"])), theme_1.DROPDOWN_WIDTH, function (_a) {
     var theme = _a.theme;
@@ -6,0 +8,0 @@ return theme.spacing(2);

components/Toolbar/Apps/index.js

@@ -1,20 +0,22 @@
-import { __assign, __spreadArray } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useCallback, useMemo, useRef, useState } from 'react';
-import AppsIcon from '@eduzz/houston-icons/Apps';
-import Advanced from './Advanced';
-import AppsContext from './context';
-import Dropdown from './Dropdown';
-import styles from './styles';
-import { useToolbarContext } from '@/context';
-import clsx from '@/helpers/className';
-import { useEscapeKey } from '@/hooks/useEscapeKey';
-import { useOutside } from '@/hooks/useOutside';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var Apps_1 = (0, tslib_1.__importDefault)(require("@eduzz/houston-icons/Apps"));
+var Advanced_1 = (0, tslib_1.__importDefault)(require("./Advanced"));
+var context_1 = (0, tslib_1.__importDefault)(require("./context"));
+var Dropdown_1 = (0, tslib_1.__importDefault)(require("./Dropdown"));
+var styles_1 = (0, tslib_1.__importDefault)(require("./styles"));
+var context_2 = require("@/context");
+var className_1 = (0, tslib_1.__importDefault)(require("@/helpers/className"));
+var useEscapeKey_1 = require("@/hooks/useEscapeKey");
+var useOutside_1 = require("@/hooks/useOutside");
 var Apps = function (_a) {
     var className = _a.className;
-    var wrapperDropdownRef = useRef(null);
-    var _b = useToolbarContext(), user = _b.user, applications = _b.applications, application = _b.application;
-    var _c = useState(null), openedDropdown = _c[0], setOpenDropdown = _c[1];
-    var _d = useState(false), openedAdvanced = _d[0], setOpenedAdvanced = _d[1];
-    var handleClickOpenDropdown = useCallback(function (e) {
+    var wrapperDropdownRef = (0, react_1.useRef)(null);
+    var _b = (0, context_2.useToolbarContext)(), user = _b.user, applications = _b.applications, application = _b.application;
+    var _c = (0, react_1.useState)(null), openedDropdown = _c[0], setOpenDropdown = _c[1];
+    var _d = (0, react_1.useState)(false), openedAdvanced = _d[0], setOpenedAdvanced = _d[1];
+    var handleClickOpenDropdown = (0, react_1.useCallback)(function (e) {
         if (openedAdvanced) {
@@ -30,3 +32,3 @@ setOpenedAdvanced(false);
     }, [openedAdvanced, openedDropdown]);
-    var handleClickOutsideWrapper = useCallback(function () {
+    var handleClickOutsideWrapper = (0, react_1.useCallback)(function () {
         if (!openedDropdown) {
@@ -37,8 +39,8 @@ return;
     }, [openedDropdown]);
-    var handlePressEscapeKey = useCallback(function () {
+    var handlePressEscapeKey = (0, react_1.useCallback)(function () {
         setOpenDropdown(null);
         setOpenedAdvanced(false);
     }, []);
-    var isSupport = useMemo(function () { return user === null || user === void 0 ? void 0 : user.isSupport; }, [user === null || user === void 0 ? void 0 : user.isSupport]);
-    var validApplications = useMemo(function () {
+    var isSupport = (0, react_1.useMemo)(function () { return user === null || user === void 0 ? void 0 : user.isSupport; }, [user === null || user === void 0 ? void 0 : user.isSupport]);
+    var validApplications = (0, react_1.useMemo)(function () {
         return applications.reduce(function (acc, app) {
@@ -48,14 +50,14 @@ if (app.beta && application !== app.application && !isSupport) {
             }
-            return (acc = __spreadArray(__spreadArray([], acc, true), [app], false));
+            return (acc = (0, tslib_1.__spreadArray)((0, tslib_1.__spreadArray)([], acc, true), [app], false));
         }, []);
     }, [application, applications, isSupport]);
-    var opened = useMemo(function () { return ({
+    var opened = (0, react_1.useMemo)(function () { return ({
         dropdown: openedDropdown,
         advanced: openedAdvanced
     }); }, [openedAdvanced, openedDropdown]);
-    var isActiveButton = useMemo(function () { return openedDropdown || openedAdvanced; }, [openedAdvanced, openedDropdown]);
-    useOutside(wrapperDropdownRef, handleClickOutsideWrapper);
-    useEscapeKey(handlePressEscapeKey);
-    return (_jsxs(AppsContext.Provider, __assign({ value: { applications: validApplications, opened: opened, setOpenDropdown: setOpenDropdown, setOpenedAdvanced: setOpenedAdvanced } }, { children: [_jsxs("div", __assign({ ref: wrapperDropdownRef, className: clsx('eduzz-toolbar-apps', className) }, { children: [_jsxs("div", __assign({ className: clsx('eduzz-toolbar-apps-button', isActiveButton && '--active'), onClick: handleClickOpenDropdown }, { children: [_jsx("div", __assign({ className: 'eduzz-toolbar-apps-icon' }, { children: _jsx(AppsIcon, { size: 24 }, void 0) }), void 0), _jsx("div", __assign({ className: 'eduzz-toolbar-apps-label' }, { children: "Apps" }), void 0)] }), void 0), _jsx(Dropdown, {}, void 0)] }), void 0), _jsx(Advanced, {}, void 0)] }), void 0));
+    var isActiveButton = (0, react_1.useMemo)(function () { return openedDropdown || openedAdvanced; }, [openedAdvanced, openedDropdown]);
+    (0, useOutside_1.useOutside)(wrapperDropdownRef, handleClickOutsideWrapper);
+    (0, useEscapeKey_1.useEscapeKey)(handlePressEscapeKey);
+    return ((0, jsx_runtime_1.jsxs)(context_1.default.Provider, (0, tslib_1.__assign)({ value: { applications: validApplications, opened: opened, setOpenDropdown: setOpenDropdown, setOpenedAdvanced: setOpenedAdvanced } }, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ ref: wrapperDropdownRef, className: (0, className_1.default)('eduzz-toolbar-apps', className) }, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-apps-button', isActiveButton && '--active'), onClick: handleClickOpenDropdown }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-apps-icon' }, { children: (0, jsx_runtime_1.jsx)(Apps_1.default, { size: 24 }, void 0) }), void 0), (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-apps-label' }, { children: "Apps" }), void 0)] }), void 0), (0, jsx_runtime_1.jsx)(Dropdown_1.default, {}, void 0)] }), void 0), (0, jsx_runtime_1.jsx)(Advanced_1.default, {}, void 0)] }), void 0));
 };
-export default styles(memo(Apps));
+exports.default = (0, styles_1.default)((0, react_1.memo)(Apps));

components/Toolbar/Apps/styles.js

@@ -1,5 +0,7 @@
-import { __makeTemplateObject } from "tslib";
-import styled from '@emotion/styled';
-import { TOOLBAR_HEIGHT } from '@/assets/theme';
-export default (function (Component) { return styled(Component)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: auto;\n  position: relative;\n  box-sizing: border-box;\n\n  .eduzz-toolbar-apps-button {\n    display: flex;\n    align-items: center;\n    cursor: pointer;\n    padding: 0 ", "px;\n    transition: ", ";\n    height: ", "px;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    .eduzz-toolbar-apps-icon {\n      line-height: 0;\n    }\n\n    .eduzz-toolbar-apps-label {\n      font-size: 14px;\n      margin-left: ", "px;\n\n      &::selection {\n        background: transparent;\n      }\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n"], ["\n  width: auto;\n  position: relative;\n  box-sizing: border-box;\n\n  .eduzz-toolbar-apps-button {\n    display: flex;\n    align-items: center;\n    cursor: pointer;\n    padding: 0 ", "px;\n    transition: ", ";\n    height: ", "px;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    .eduzz-toolbar-apps-icon {\n      line-height: 0;\n    }\n\n    .eduzz-toolbar-apps-label {\n      font-size: 14px;\n      margin-left: ", "px;\n\n      &::selection {\n        background: transparent;\n      }\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n"])), function (_a) {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var styled_1 = (0, tslib_1.__importDefault)(require("@emotion/styled"));
+var theme_1 = require("@/assets/theme");
+exports.default = (function (Component) { return (0, styled_1.default)(Component)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  width: auto;\n  position: relative;\n  box-sizing: border-box;\n\n  .eduzz-toolbar-apps-button {\n    display: flex;\n    align-items: center;\n    cursor: pointer;\n    padding: 0 ", "px;\n    transition: ", ";\n    height: ", "px;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    .eduzz-toolbar-apps-icon {\n      line-height: 0;\n    }\n\n    .eduzz-toolbar-apps-label {\n      font-size: 14px;\n      margin-left: ", "px;\n\n      &::selection {\n        background: transparent;\n      }\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n"], ["\n  width: auto;\n  position: relative;\n  box-sizing: border-box;\n\n  .eduzz-toolbar-apps-button {\n    display: flex;\n    align-items: center;\n    cursor: pointer;\n    padding: 0 ", "px;\n    transition: ", ";\n    height: ", "px;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n\n    .eduzz-toolbar-apps-icon {\n      line-height: 0;\n    }\n\n    .eduzz-toolbar-apps-label {\n      font-size: 14px;\n      margin-left: ", "px;\n\n      &::selection {\n        background: transparent;\n      }\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n"])), function (_a) {
     var theme = _a.theme;
@@ -10,3 +12,3 @@ return theme.spacing(3);
     return theme.trasitionDuration;
-}, TOOLBAR_HEIGHT, function (_a) {
+}, theme_1.TOOLBAR_HEIGHT, function (_a) {
     var theme = _a.theme;
@@ -13,0 +15,0 @@ return theme.spacing(2);

components/Toolbar/Belt/index.js

@@ -1,16 +0,18 @@
-import { __assign, __makeTemplateObject } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useEffect, useState } from 'react';
-import styled from '@emotion/styled';
-import { TOOLBAR_HEIGHT } from '@/assets/theme';
-import MyIcon from '@/components/Icon';
-import { useToolbarContext } from '@/context';
-import clsx from '@/helpers/className';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styled_1 = (0, tslib_1.__importDefault)(require("@emotion/styled"));
+var theme_1 = require("@/assets/theme");
+var Icon_1 = (0, tslib_1.__importDefault)(require("@/components/Icon"));
+var context_1 = require("@/context");
+var className_1 = (0, tslib_1.__importDefault)(require("@/helpers/className"));
 var supportedBelts = ['white', 'red', 'orange', 'green', 'black', 'golden'];
 var Belt = function (_a) {
     var className = _a.className;
-    var user = useToolbarContext().user;
-    var _b = useState(''), beltColor = _b[0], setBeltColor = _b[1];
-    var _c = useState(''), beltClass = _c[0], setBeltClass = _c[1];
-    useEffect(function () {
+    var user = (0, context_1.useToolbarContext)().user;
+    var _b = (0, react_1.useState)(''), beltColor = _b[0], setBeltColor = _b[1];
+    var _c = (0, react_1.useState)(''), beltClass = _c[0], setBeltClass = _c[1];
+    (0, react_1.useEffect)(function () {
         if (!(user === null || user === void 0 ? void 0 : user.belt)) {
@@ -33,5 +35,5 @@ setBeltColor('');
     }
-    return (_jsx("div", __assign({ className: clsx(className, beltClass) }, { children: _jsxs("div", __assign({ className: 'eduzz-toolbar-badge' }, { children: [_jsx(MyIcon, { className: 'eduzz-toolbar-icon-elite', name: 'icon-elite' }, void 0), _jsx("span", { children: beltColor }, void 0)] }), void 0) }), void 0));
+    return ((0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)(className, beltClass) }, { children: (0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-badge' }, { children: [(0, jsx_runtime_1.jsx)(Icon_1.default, { className: 'eduzz-toolbar-icon-elite', name: 'icon-elite' }, void 0), (0, jsx_runtime_1.jsx)("span", { children: beltColor }, void 0)] }), void 0) }), void 0));
 };
-export default styled(memo(Belt))(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  color: white;\n  height: ", "px;\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: 0 ", "px;\n\n  &.none {\n    display: none;\n  }\n\n  &.white {\n    background-color: ", ";\n    color: ", ";\n\n    & > .eduzz-toolbar-badge {\n      color: ", ";\n\n      & > svg > path {\n        fill: ", ";\n      }\n    }\n  }\n\n  &.red {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.orange {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.green {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.black {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.golden {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  .eduzz-toolbar-badge {\n    color: white;\n    display: flex;\n    align-items: center;\n\n    & > span {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      max-width: 250px;\n      font-size: 14px;\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n\n  .eduzz-toolbar-icon-elite {\n    height: 18px;\n    min-width: 43px;\n    margin-right: 4px;\n  }\n\n  .eduzz-toolbar-icon-avatar {\n    width: 30px;\n    height: 30px;\n  }\n"], ["\n  color: white;\n  height: ", "px;\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: 0 ", "px;\n\n  &.none {\n    display: none;\n  }\n\n  &.white {\n    background-color: ", ";\n    color: ", ";\n\n    & > .eduzz-toolbar-badge {\n      color: ", ";\n\n      & > svg > path {\n        fill: ", ";\n      }\n    }\n  }\n\n  &.red {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.orange {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.green {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.black {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.golden {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  .eduzz-toolbar-badge {\n    color: white;\n    display: flex;\n    align-items: center;\n\n    & > span {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      max-width: 250px;\n      font-size: 14px;\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n\n  .eduzz-toolbar-icon-elite {\n    height: 18px;\n    min-width: 43px;\n    margin-right: 4px;\n  }\n\n  .eduzz-toolbar-icon-avatar {\n    width: 30px;\n    height: 30px;\n  }\n"])), TOOLBAR_HEIGHT, function (_a) {
+exports.default = (0, styled_1.default)((0, react_1.memo)(Belt))(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  color: white;\n  height: ", "px;\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: 0 ", "px;\n\n  &.none {\n    display: none;\n  }\n\n  &.white {\n    background-color: ", ";\n    color: ", ";\n\n    & > .eduzz-toolbar-badge {\n      color: ", ";\n\n      & > svg > path {\n        fill: ", ";\n      }\n    }\n  }\n\n  &.red {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.orange {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.green {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.black {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.golden {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  .eduzz-toolbar-badge {\n    color: white;\n    display: flex;\n    align-items: center;\n\n    & > span {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      max-width: 250px;\n      font-size: 14px;\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n\n  .eduzz-toolbar-icon-elite {\n    height: 18px;\n    min-width: 43px;\n    margin-right: 4px;\n  }\n\n  .eduzz-toolbar-icon-avatar {\n    width: 30px;\n    height: 30px;\n  }\n"], ["\n  color: white;\n  height: ", "px;\n  display: flex;\n  align-items: center;\n  position: relative;\n  padding: 0 ", "px;\n\n  &.none {\n    display: none;\n  }\n\n  &.white {\n    background-color: ", ";\n    color: ", ";\n\n    & > .eduzz-toolbar-badge {\n      color: ", ";\n\n      & > svg > path {\n        fill: ", ";\n      }\n    }\n  }\n\n  &.red {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.orange {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.green {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.black {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  &.golden {\n    background-color: ", ";\n    color: ", ";\n  }\n\n  .eduzz-toolbar-badge {\n    color: white;\n    display: flex;\n    align-items: center;\n\n    & > span {\n      white-space: nowrap;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      max-width: 250px;\n      font-size: 14px;\n\n      ", " {\n        display: none;\n      }\n    }\n  }\n\n  .eduzz-toolbar-icon-elite {\n    height: 18px;\n    min-width: 43px;\n    margin-right: 4px;\n  }\n\n  .eduzz-toolbar-icon-avatar {\n    width: 30px;\n    height: 30px;\n  }\n"])), theme_1.TOOLBAR_HEIGHT, function (_a) {
     var theme = _a.theme;
@@ -38,0 +40,0 @@ return theme.spacing(3);

components/Toolbar/index.js

@@ -1,16 +0,18 @@
-import { __assign } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useCallback, useEffect, useRef } from 'react';
-import { useTheme } from '@emotion/react';
-import styles from './styles';
-import EduzzLogo from '@/components/EduzzLogo';
-import Belt from '@/components/Toolbar/Belt';
-import { useToolbarContext } from '@/context';
-import clsx from '@/helpers/className';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var react_2 = require("@emotion/react");
+var styles_1 = (0, tslib_1.__importDefault)(require("./styles"));
+var EduzzLogo_1 = (0, tslib_1.__importDefault)(require("@/components/EduzzLogo"));
+var Belt_1 = (0, tslib_1.__importDefault)(require("@/components/Toolbar/Belt"));
+var context_1 = require("@/context");
+var className_1 = (0, tslib_1.__importDefault)(require("@/helpers/className"));
 var Toolbar = function (_a) {
     var className = _a.className, children = _a.children;
-    var user = useToolbarContext().user;
-    var theme = useTheme();
-    var contentClicked = useRef({ clicked: false }).current;
-    var handleDocumentClick = useCallback(function () {
+    var user = (0, context_1.useToolbarContext)().user;
+    var theme = (0, react_2.useTheme)();
+    var contentClicked = (0, react_1.useRef)({ clicked: false }).current;
+    var handleDocumentClick = (0, react_1.useCallback)(function () {
         setTimeout(function () {
@@ -22,3 +24,3 @@ if (contentClicked.clicked) {
     }, [contentClicked]);
-    useEffect(function () {
+    (0, react_1.useEffect)(function () {
         document.body.classList.add('eduzz-toolbar-applied');
@@ -44,5 +46,5 @@ document.body.addEventListener('click', handleDocumentClick);
     }, [handleDocumentClick, theme]);
-    var handleClickContainer = useCallback(function () { return (contentClicked.clicked = true); }, [contentClicked]);
-    return (_jsxs("header", __assign({ className: clsx('eduzz-apps-toolbar', className), onClick: handleClickContainer }, { children: [_jsxs("div", __assign({ className: 'eduzz-toolbar-logo' }, { children: [_jsx(EduzzLogo, {}, void 0), (user === null || user === void 0 ? void 0 : user.isSupport) && _jsx("span", __assign({ className: 'eduzz-toolbar-support' }, { children: "SUPORTE" }), void 0)] }), void 0), _jsxs("div", __assign({ className: 'eduzz-toolbar-quick-access' }, { children: [children, _jsx(Belt, {}, void 0)] }), void 0)] }), void 0));
+    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));
 };
-export default styles(memo(Toolbar));
+exports.default = (0, styles_1.default)((0, react_1.memo)(Toolbar));

components/Toolbar/styles.js

@@ -1,5 +0,7 @@
-import { __makeTemplateObject } from "tslib";
-import styled from '@emotion/styled';
-import { TOOLBAR_HEIGHT } from '@/assets/theme';
-export default (function (Component) { return styled(Component)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  font-family: 'Open Sans', Roboto, Arial, sans-serif;\n  background-color: ", ";\n  color: ", ";\n  position: relative;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", "px;\n  display: flex;\n  justify-content: space-between;\n  z-index: 1101;\n  transition: ", ";\n\n  .eduzz-toolbar-logo {\n    width: 200px;\n    display: flex;\n    align-items: center;\n    padding-left: ", "px;\n\n    ", " {\n      width: 110px;\n    }\n\n    svg {\n      width: 100%;\n      max-width: 90px;\n      margin-right: ", "px;\n\n      ", " {\n        margin-right: ", "px;\n        max-width: 200px;\n      }\n\n      .logo-letter {\n        ", " {\n          display: none;\n        }\n      }\n    }\n\n    .eduzz-toolbar-support {\n      font-size: 12px;\n      font-weight: 600;\n      color: ", ";\n      position: relative;\n      top: 2px;\n    }\n  }\n\n  .eduzz-toolbar-quick-access {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"], ["\n  font-family: 'Open Sans', Roboto, Arial, sans-serif;\n  background-color: ", ";\n  color: ", ";\n  position: relative;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", "px;\n  display: flex;\n  justify-content: space-between;\n  z-index: 1101;\n  transition: ", ";\n\n  .eduzz-toolbar-logo {\n    width: 200px;\n    display: flex;\n    align-items: center;\n    padding-left: ", "px;\n\n    ", " {\n      width: 110px;\n    }\n\n    svg {\n      width: 100%;\n      max-width: 90px;\n      margin-right: ", "px;\n\n      ", " {\n        margin-right: ", "px;\n        max-width: 200px;\n      }\n\n      .logo-letter {\n        ", " {\n          display: none;\n        }\n      }\n    }\n\n    .eduzz-toolbar-support {\n      font-size: 12px;\n      font-weight: 600;\n      color: ", ";\n      position: relative;\n      top: 2px;\n    }\n  }\n\n  .eduzz-toolbar-quick-access {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"])), function (_a) {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var styled_1 = (0, tslib_1.__importDefault)(require("@emotion/styled"));
+var theme_1 = require("@/assets/theme");
+exports.default = (function (Component) { return (0, styled_1.default)(Component)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  font-family: 'Open Sans', Roboto, Arial, sans-serif;\n  background-color: ", ";\n  color: ", ";\n  position: relative;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", "px;\n  display: flex;\n  justify-content: space-between;\n  z-index: 1101;\n  transition: ", ";\n\n  .eduzz-toolbar-logo {\n    width: 200px;\n    display: flex;\n    align-items: center;\n    padding-left: ", "px;\n\n    ", " {\n      width: 110px;\n    }\n\n    svg {\n      width: 100%;\n      max-width: 90px;\n      margin-right: ", "px;\n\n      ", " {\n        margin-right: ", "px;\n        max-width: 200px;\n      }\n\n      .logo-letter {\n        ", " {\n          display: none;\n        }\n      }\n    }\n\n    .eduzz-toolbar-support {\n      font-size: 12px;\n      font-weight: 600;\n      color: ", ";\n      position: relative;\n      top: 2px;\n    }\n  }\n\n  .eduzz-toolbar-quick-access {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"], ["\n  font-family: 'Open Sans', Roboto, Arial, sans-serif;\n  background-color: ", ";\n  color: ", ";\n  position: relative;\n  top: 0;\n  left: 0;\n  right: 0;\n  height: ", "px;\n  display: flex;\n  justify-content: space-between;\n  z-index: 1101;\n  transition: ", ";\n\n  .eduzz-toolbar-logo {\n    width: 200px;\n    display: flex;\n    align-items: center;\n    padding-left: ", "px;\n\n    ", " {\n      width: 110px;\n    }\n\n    svg {\n      width: 100%;\n      max-width: 90px;\n      margin-right: ", "px;\n\n      ", " {\n        margin-right: ", "px;\n        max-width: 200px;\n      }\n\n      .logo-letter {\n        ", " {\n          display: none;\n        }\n      }\n    }\n\n    .eduzz-toolbar-support {\n      font-size: 12px;\n      font-weight: 600;\n      color: ", ";\n      position: relative;\n      top: 2px;\n    }\n  }\n\n  .eduzz-toolbar-quick-access {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n  }\n"])), function (_a) {
     var theme = _a.theme;
@@ -10,3 +12,3 @@ return theme.colors.barBackground;
     return theme.colors.barForeground;
-}, TOOLBAR_HEIGHT, function (_a) {
+}, theme_1.TOOLBAR_HEIGHT, function (_a) {
     var theme = _a.theme;
@@ -13,0 +15,0 @@ return theme.trasitionDuration;

components/Toolbar/User/index.d.ts

@@ -0,3 +1,3 @@
+import { IEduzzToolbarUserMenu } from '@/interfaces';
 import { IStylesProps } from '@/interfaces/styles';
-import { IEduzzToolbarUserMenu } from '@/interfaces/toolbar';
 export interface IEduzzToolbarMenuProps extends IStylesProps {
@@ -4,0 +4,0 @@ menu?: IEduzzToolbarUserMenu[];

components/Toolbar/User/index.js

@@ -1,20 +0,22 @@
-import { __assign, __makeTemplateObject } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useCallback, useMemo, useRef, useState } from 'react';
-import styled from '@emotion/styled';
-import IconChevronDown from '@eduzz/houston-icons/ChevronDown';
-import MenuUser from './Menu';
-import { TOOLBAR_HEIGHT } from '@/assets/theme';
-import { useToolbarContext } from '@/context';
-import clsx from '@/helpers/className';
-import { useEscapeKey } from '@/hooks/useEscapeKey';
-import { useOutside } from '@/hooks/useOutside';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styled_1 = (0, tslib_1.__importDefault)(require("@emotion/styled"));
+var ChevronDown_1 = (0, tslib_1.__importDefault)(require("@eduzz/houston-icons/ChevronDown"));
+var Menu_1 = (0, tslib_1.__importDefault)(require("./Menu"));
+var theme_1 = require("@/assets/theme");
+var context_1 = require("@/context");
+var className_1 = (0, tslib_1.__importDefault)(require("@/helpers/className"));
+var useEscapeKey_1 = require("@/hooks/useEscapeKey");
+var useOutside_1 = require("@/hooks/useOutside");
 var User = function (_a) {
     var className = _a.className, _b = _a.menu, menu = _b === void 0 ? [] : _b;
-    var wrapperMenuUser = useRef(null);
-    var user = useToolbarContext().user;
-    var _c = useState(false), dropdown = _c[0], setDropdown = _c[1];
-    var firstLetter = useMemo(function () { var _a; return ((_a = user === null || user === void 0 ? void 0 : user.name) === null || _a === void 0 ? void 0 : _a.trim()[0]) || ''; }, [user === null || user === void 0 ? void 0 : user.name]);
-    var hasMenu = useMemo(function () { return !!menu.length; }, [menu.length]);
-    var handleClickOpenDropdown = useCallback(function () {
+    var wrapperMenuUser = (0, react_1.useRef)(null);
+    var user = (0, context_1.useToolbarContext)().user;
+    var _c = (0, react_1.useState)(false), dropdown = _c[0], setDropdown = _c[1];
+    var firstLetter = (0, react_1.useMemo)(function () { var _a; return ((_a = user === null || user === void 0 ? void 0 : user.name) === null || _a === void 0 ? void 0 : _a.trim()[0]) || ''; }, [user === null || user === void 0 ? void 0 : user.name]);
+    var hasMenu = (0, react_1.useMemo)(function () { return !!menu.length; }, [menu.length]);
+    var handleClickOpenDropdown = (0, react_1.useCallback)(function () {
         if (!hasMenu) {
@@ -25,14 +27,14 @@ return;
     }, [hasMenu]);
-    var handleClickOutside = useCallback(function () { return hasMenu && setDropdown(false); }, [hasMenu]);
-    useOutside(wrapperMenuUser, handleClickOutside);
-    useEscapeKey(handleClickOutside);
+    var handleClickOutside = (0, react_1.useCallback)(function () { return hasMenu && setDropdown(false); }, [hasMenu]);
+    (0, useOutside_1.useOutside)(wrapperMenuUser, handleClickOutside);
+    (0, useEscapeKey_1.useEscapeKey)(handleClickOutside);
     if (!user) {
         return null;
     }
-    return (_jsxs("div", __assign({ ref: wrapperMenuUser, className: clsx('eduzz-toolbar-user', dropdown && '--active', hasMenu && '--has-menu', className) }, { children: [_jsxs("div", __assign({ className: clsx('eduzz-toolbar-user-label', dropdown && '--active'), onClick: handleClickOpenDropdown }, { children: [_jsx("div", __assign({ className: 'eduzz-toolbar-avatar' }, { children: firstLetter }), void 0), _jsx("div", __assign({ className: 'eduzz-toolbar-user-name' }, { children: user === null || user === void 0 ? void 0 : user.name }), void 0), hasMenu && (_jsx("div", __assign({ className: clsx('eduzz-toolbar-user-menu-arrow', dropdown && '--open') }, { children: _jsx(IconChevronDown, { size: 18 }, void 0) }), void 0))] }), void 0), _jsx(MenuUser, { items: menu, open: dropdown, handleClickOutside: handleClickOutside }, void 0)] }), void 0));
+    return ((0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ ref: wrapperMenuUser, className: (0, className_1.default)('eduzz-toolbar-user', dropdown && '--active', hasMenu && '--has-menu', className) }, { children: [(0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-user-label', dropdown && '--active'), onClick: handleClickOpenDropdown }, { children: [(0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-avatar' }, { children: firstLetter }), void 0), (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-user-name' }, { children: user === null || user === void 0 ? void 0 : user.name }), void 0), hasMenu && ((0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-user-menu-arrow', dropdown && '--open') }, { children: (0, jsx_runtime_1.jsx)(ChevronDown_1.default, { size: 18 }, void 0) }), void 0))] }), void 0), (0, jsx_runtime_1.jsx)(Menu_1.default, { items: menu, open: dropdown, handleClickOutside: handleClickOutside }, void 0)] }), void 0));
 };
-export default styled(memo(User))(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  position: relative;\n  z-index: 1100;\n\n  &.--has-menu {\n    cursor: pointer;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n  }\n\n  .eduzz-toolbar-user-label {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0 ", "px;\n    height: ", "px;\n\n    .eduzz-toolbar-avatar {\n      width: ", "px;\n      height: ", "px;\n      border-radius: 100%;\n      background: #fff;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: ", ";\n      font-weight: 600;\n      margin-right: ", "px;\n      font-size: 14px;\n      line-height: 0;\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-name {\n      font-size: 14px;\n      font-weight: 400;\n\n      ", " {\n        display: none;\n      }\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-menu-arrow {\n      margin-left: ", "px;\n      transition: ", ";\n\n      ", " {\n        margin-left: 0;\n      }\n\n      &.--open {\n        transform: rotate(-180deg);\n      }\n\n      span.houston-icon {\n        line-height: 0;\n        position: relative;\n        top: 2px;\n      }\n    }\n  }\n"], ["\n  position: relative;\n  z-index: 1100;\n\n  &.--has-menu {\n    cursor: pointer;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n  }\n\n  .eduzz-toolbar-user-label {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0 ", "px;\n    height: ", "px;\n\n    .eduzz-toolbar-avatar {\n      width: ", "px;\n      height: ", "px;\n      border-radius: 100%;\n      background: #fff;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: ", ";\n      font-weight: 600;\n      margin-right: ", "px;\n      font-size: 14px;\n      line-height: 0;\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-name {\n      font-size: 14px;\n      font-weight: 400;\n\n      ", " {\n        display: none;\n      }\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-menu-arrow {\n      margin-left: ", "px;\n      transition: ", ";\n\n      ", " {\n        margin-left: 0;\n      }\n\n      &.--open {\n        transform: rotate(-180deg);\n      }\n\n      span.houston-icon {\n        line-height: 0;\n        position: relative;\n        top: 2px;\n      }\n    }\n  }\n"])), function (_a) {
+exports.default = (0, styled_1.default)((0, react_1.memo)(User))(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  position: relative;\n  z-index: 1100;\n\n  &.--has-menu {\n    cursor: pointer;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n  }\n\n  .eduzz-toolbar-user-label {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0 ", "px;\n    height: ", "px;\n\n    .eduzz-toolbar-avatar {\n      width: ", "px;\n      height: ", "px;\n      border-radius: 100%;\n      background: #fff;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: ", ";\n      font-weight: 600;\n      margin-right: ", "px;\n      font-size: 14px;\n      line-height: 0;\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-name {\n      font-size: 14px;\n      font-weight: 400;\n\n      ", " {\n        display: none;\n      }\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-menu-arrow {\n      margin-left: ", "px;\n      transition: ", ";\n\n      ", " {\n        margin-left: 0;\n      }\n\n      &.--open {\n        transform: rotate(-180deg);\n      }\n\n      span.houston-icon {\n        line-height: 0;\n        position: relative;\n        top: 2px;\n      }\n    }\n  }\n"], ["\n  position: relative;\n  z-index: 1100;\n\n  &.--has-menu {\n    cursor: pointer;\n\n    &:hover,\n    &.--active {\n      background: rgba(0, 0, 0, 0.15);\n    }\n  }\n\n  .eduzz-toolbar-user-label {\n    display: flex;\n    align-items: center;\n    justify-content: center;\n    padding: 0 ", "px;\n    height: ", "px;\n\n    .eduzz-toolbar-avatar {\n      width: ", "px;\n      height: ", "px;\n      border-radius: 100%;\n      background: #fff;\n      display: flex;\n      align-items: center;\n      justify-content: center;\n      color: ", ";\n      font-weight: 600;\n      margin-right: ", "px;\n      font-size: 14px;\n      line-height: 0;\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-name {\n      font-size: 14px;\n      font-weight: 400;\n\n      ", " {\n        display: none;\n      }\n\n      &::selection {\n        background: none;\n      }\n    }\n\n    .eduzz-toolbar-user-menu-arrow {\n      margin-left: ", "px;\n      transition: ", ";\n\n      ", " {\n        margin-left: 0;\n      }\n\n      &.--open {\n        transform: rotate(-180deg);\n      }\n\n      span.houston-icon {\n        line-height: 0;\n        position: relative;\n        top: 2px;\n      }\n    }\n  }\n"])), function (_a) {
     var theme = _a.theme;
     return theme.spacing(3);
-}, TOOLBAR_HEIGHT, function (_a) {
+}, theme_1.TOOLBAR_HEIGHT, function (_a) {
     var theme = _a.theme;
@@ -39,0 +41,0 @@ return theme.spacing(7);

components/Toolbar/User/Menu/index.js

@@ -1,12 +0,14 @@
-import { __assign, __makeTemplateObject } from "tslib";
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { memo, useCallback } from 'react';
-import styled from '@emotion/styled';
-import { MENU_WIDTH, TOOLBAR_HEIGHT } from '@/assets/theme';
-import { useToolbarContext } from '@/context';
-import clsx from '@/helpers/className';
-var MenuUser = memo(function (_a) {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styled_1 = (0, tslib_1.__importDefault)(require("@emotion/styled"));
+var theme_1 = require("@/assets/theme");
+var context_1 = require("@/context");
+var className_1 = (0, tslib_1.__importDefault)(require("@/helpers/className"));
+var MenuUser = (0, react_1.memo)(function (_a) {
     var className = _a.className, open = _a.open, handleClickOutside = _a.handleClickOutside, items = _a.items;
-    var user = useToolbarContext().user;
-    var handleClickItem = useCallback(function (item, e) {
+    var user = (0, context_1.useToolbarContext)().user;
+    var handleClickItem = (0, react_1.useCallback)(function (item, e) {
         if (item.disabled) {
@@ -18,7 +20,7 @@ return;
     }, [handleClickOutside, user]);
-    return (_jsx("div", __assign({ className: clsx('eduzz-toolbar-user-menu', open && '--active', className) }, { children: items
+    return ((0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: (0, className_1.default)('eduzz-toolbar-user-menu', open && '--active', className) }, { children: items
             .filter(function (item) { return !item.hidden; })
-            .map(function (item, index) { return (_jsxs("div", __assign({ onClick: function (e) { return handleClickItem(item, e); }, className: clsx('eduzz-toolbar-user-menu-item', (item === null || item === void 0 ? void 0 : item.divider) && '--divider', item.disabled && '--disabled') }, { children: [(item === null || item === void 0 ? void 0 : item.icon) && _jsx("div", __assign({ className: 'eduzz-toolbar-user-menu-item-icon' }, { children: item.icon }), void 0), item.content] }), "user-menu-item-".concat(index))); }) }), void 0));
+            .map(function (item, index) { return ((0, jsx_runtime_1.jsxs)("div", (0, tslib_1.__assign)({ onClick: function (e) { return handleClickItem(item, e); }, className: (0, className_1.default)('eduzz-toolbar-user-menu-item', (item === null || item === void 0 ? void 0 : item.divider) && '--divider', item.disabled && '--disabled') }, { children: [(item === null || item === void 0 ? void 0 : item.icon) && (0, jsx_runtime_1.jsx)("div", (0, tslib_1.__assign)({ className: 'eduzz-toolbar-user-menu-item-icon' }, { children: item.icon }), void 0), item.content] }), "user-menu-item-".concat(index))); }) }), void 0));
 });
-export default styled(MenuUser)(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n  width: ", "px;\n  top: ", "px;\n  position: fixed;\n  right: ", "px;\n  box-shadow: ", ";\n  padding: ", "px;\n  transition: ", ";\n  box-sizing: border-box;\n  visibility: hidden;\n  opacity: 0;\n  user-select: none;\n  background: white;\n  border-radius: 0 0 ", "px ", "px;\n\n  &.--active {\n    visibility: visible;\n    opacity: 1;\n    user-select: auto;\n  }\n\n  & .eduzz-toolbar-user-menu-item {\n    color: ", ";\n    font-weight: 400;\n    font-size: 14px;\n    padding: ", "px;\n    border-radius: ", "px;\n    transition: ", ";\n    display: flex;\n    align-items: center;\n    line-height: 1.2;\n    position: relative;\n\n    &:not(.--disabled):hover {\n      background: rgba(0, 0, 0, 0.04);\n      color: ", ";\n    }\n\n    &.--disabled {\n      color: #b0bec5;\n      cursor: no-drop;\n    }\n\n    &.--divider {\n      margin-top: ", "px;\n\n      &::after {\n        content: ' ';\n        top: -", "px;\n        left: ", "px;\n        width: calc(100% - ", "px);\n        height: 1px;\n        background: #eceff1;\n        position: absolute;\n      }\n    }\n\n    & .eduzz-toolbar-user-menu-item-icon {\n      line-height: 0;\n      margin-right: ", "px;\n      font-size: 18px;\n    }\n  }\n"], ["\n  width: ", "px;\n  top: ", "px;\n  position: fixed;\n  right: ", "px;\n  box-shadow: ", ";\n  padding: ", "px;\n  transition: ", ";\n  box-sizing: border-box;\n  visibility: hidden;\n  opacity: 0;\n  user-select: none;\n  background: white;\n  border-radius: 0 0 ", "px ", "px;\n\n  &.--active {\n    visibility: visible;\n    opacity: 1;\n    user-select: auto;\n  }\n\n  & .eduzz-toolbar-user-menu-item {\n    color: ", ";\n    font-weight: 400;\n    font-size: 14px;\n    padding: ", "px;\n    border-radius: ", "px;\n    transition: ", ";\n    display: flex;\n    align-items: center;\n    line-height: 1.2;\n    position: relative;\n\n    &:not(.--disabled):hover {\n      background: rgba(0, 0, 0, 0.04);\n      color: ", ";\n    }\n\n    &.--disabled {\n      color: #b0bec5;\n      cursor: no-drop;\n    }\n\n    &.--divider {\n      margin-top: ", "px;\n\n      &::after {\n        content: ' ';\n        top: -", "px;\n        left: ", "px;\n        width: calc(100% - ", "px);\n        height: 1px;\n        background: #eceff1;\n        position: absolute;\n      }\n    }\n\n    & .eduzz-toolbar-user-menu-item-icon {\n      line-height: 0;\n      margin-right: ", "px;\n      font-size: 18px;\n    }\n  }\n"])), MENU_WIDTH, TOOLBAR_HEIGHT, function (_a) {
+exports.default = (0, styled_1.default)(MenuUser)(templateObject_1 || (templateObject_1 = (0, tslib_1.__makeTemplateObject)(["\n  width: ", "px;\n  top: ", "px;\n  position: fixed;\n  right: ", "px;\n  box-shadow: ", ";\n  padding: ", "px;\n  transition: ", ";\n  box-sizing: border-box;\n  visibility: hidden;\n  opacity: 0;\n  user-select: none;\n  background: white;\n  border-radius: 0 0 ", "px ", "px;\n\n  &.--active {\n    visibility: visible;\n    opacity: 1;\n    user-select: auto;\n  }\n\n  & .eduzz-toolbar-user-menu-item {\n    color: ", ";\n    font-weight: 400;\n    font-size: 14px;\n    padding: ", "px;\n    border-radius: ", "px;\n    transition: ", ";\n    display: flex;\n    align-items: center;\n    line-height: 1.2;\n    position: relative;\n\n    &:not(.--disabled):hover {\n      background: rgba(0, 0, 0, 0.04);\n      color: ", ";\n    }\n\n    &.--disabled {\n      color: #b0bec5;\n      cursor: no-drop;\n    }\n\n    &.--divider {\n      margin-top: ", "px;\n\n      &::after {\n        content: ' ';\n        top: -", "px;\n        left: ", "px;\n        width: calc(100% - ", "px);\n        height: 1px;\n        background: #eceff1;\n        position: absolute;\n      }\n    }\n\n    & .eduzz-toolbar-user-menu-item-icon {\n      line-height: 0;\n      margin-right: ", "px;\n      font-size: 18px;\n    }\n  }\n"], ["\n  width: ", "px;\n  top: ", "px;\n  position: fixed;\n  right: ", "px;\n  box-shadow: ", ";\n  padding: ", "px;\n  transition: ", ";\n  box-sizing: border-box;\n  visibility: hidden;\n  opacity: 0;\n  user-select: none;\n  background: white;\n  border-radius: 0 0 ", "px ", "px;\n\n  &.--active {\n    visibility: visible;\n    opacity: 1;\n    user-select: auto;\n  }\n\n  & .eduzz-toolbar-user-menu-item {\n    color: ", ";\n    font-weight: 400;\n    font-size: 14px;\n    padding: ", "px;\n    border-radius: ", "px;\n    transition: ", ";\n    display: flex;\n    align-items: center;\n    line-height: 1.2;\n    position: relative;\n\n    &:not(.--disabled):hover {\n      background: rgba(0, 0, 0, 0.04);\n      color: ", ";\n    }\n\n    &.--disabled {\n      color: #b0bec5;\n      cursor: no-drop;\n    }\n\n    &.--divider {\n      margin-top: ", "px;\n\n      &::after {\n        content: ' ';\n        top: -", "px;\n        left: ", "px;\n        width: calc(100% - ", "px);\n        height: 1px;\n        background: #eceff1;\n        position: absolute;\n      }\n    }\n\n    & .eduzz-toolbar-user-menu-item-icon {\n      line-height: 0;\n      margin-right: ", "px;\n      font-size: 18px;\n    }\n  }\n"])), theme_1.MENU_WIDTH, theme_1.TOOLBAR_HEIGHT, function (_a) {
     var theme = _a.theme;
@@ -25,0 +27,0 @@ return theme.spacing(2);

config.d.ts

@@ -1,4 +0,4 @@
-import { IEduzzToolbarSetupParams } from './interfaces/toolbar';
+import { IEduzzToolbarSetupParams } from './interfaces';
 export declare const APPLICATION_URLS: {
     [key in IEduzzToolbarSetupParams['application']]: string;
 };

config.js

@@ -1,2 +0,5 @@
-export var APPLICATION_URLS = {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.APPLICATION_URLS = void 0;
+exports.APPLICATION_URLS = {
     nutror: 'https://my.nutror.com',
@@ -3,0 +6,0 @@ blinket: 'https://app.blinket.com.br?utm_source=eduzz&utm_medium=apps-toolbar',

context.d.ts

 import React from 'react';
+import { IEduzzToolbarSetupParams } from '@/interfaces';
 import { IApplication } from '@/interfaces/applications';
-import { IEduzzToolbarSetupParams } from '@/interfaces/toolbar';
 export interface IConfigContext extends IEduzzToolbarSetupParams {
@@ -5,0 +5,0 @@ applications: IApplication[];

context.js

@@ -1,6 +0,11 @@
-import React, { useContext } from 'react';
-var ConfigContext = React.createContext({});
-export function useToolbarContext() {
-    return useContext(ConfigContext);
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useToolbarContext = void 0;
+var tslib_1 = require("tslib");
+var react_1 = (0, tslib_1.__importStar)(require("react"));
+var ConfigContext = react_1.default.createContext({});
+function useToolbarContext() {
+    return (0, react_1.useContext)(ConfigContext);
 }
-export default ConfigContext;
+exports.useToolbarContext = useToolbarContext;
+exports.default = ConfigContext;

helpers/className.js

@@ -0,1 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
 function clsx() {
@@ -14,2 +16,2 @@ var classes = [];
 }
-export default clsx;
+exports.default = clsx;

helpers/nestedComponent.js

@@ -1,2 +0,4 @@
-export default function nestedComponent(component, nested) {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+function nestedComponent(component, nested) {
     Object.keys(nested).forEach(function (key) {
@@ -7,1 +9,2 @@ component[key] = nested[key];
 }
+exports.default = nestedComponent;

helpers/url.d.ts

@@ -1,2 +0,2 @@
-import { IEduzzToolbarSetupParams } from '@/interfaces/toolbar';
+import { IEduzzToolbarSetupParams } from '@/interfaces';
 export declare function buildUrl(toApplication: IEduzzToolbarSetupParams['application'], application: IEduzzToolbarSetupParams['application']): string;

helpers/url.js

@@ -1,7 +0,11 @@
-import { APPLICATION_URLS } from '@/config';
-export function buildUrl(toApplication, application) {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.buildUrl = void 0;
+var config_1 = require("@/config");
+function buildUrl(toApplication, application) {
     if (toApplication === application) {
         return null;
     }
-    return APPLICATION_URLS[toApplication];
+    return config_1.APPLICATION_URLS[toApplication];
 }
+exports.buildUrl = buildUrl;

hooks/useEscapeKey.js

@@ -1,5 +0,8 @@
-import { useEffect } from 'react';
-export function useEscapeKey(callback) {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useEscapeKey = void 0;
+var react_1 = require("react");
+function useEscapeKey(callback) {
     var ESCAPE_KEY = 'Escape';
-    useEffect(function () {
+    (0, react_1.useEffect)(function () {
         function handlePressKey(event) {
@@ -16,1 +19,2 @@ if (event.key === ESCAPE_KEY) {
 }
+exports.useEscapeKey = useEscapeKey;

hooks/useOutside.js

@@ -1,4 +0,7 @@
-import { useEffect } from 'react';
-export function useOutside(ref, callback) {
-    useEffect(function () {
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useOutside = void 0;
+var react_1 = require("react");
+function useOutside(ref, callback) {
+    (0, react_1.useEffect)(function () {
         function handleClickOutside(event) {
@@ -15,1 +18,2 @@ if (ref.current && !ref.current.contains(event.target)) {
 }
+exports.useOutside = useOutside;

index.d.ts

@@ -1,1 +0,2 @@
-export { default as EduzzToolbar } from './App';
+import EduzzToolbar from './App';
+export default EduzzToolbar;

index.js

@@ -1,1 +0,5 @@
-export { default as EduzzToolbar } from './App';
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+var tslib_1 = require("tslib");
+var App_1 = (0, tslib_1.__importDefault)(require("./App"));
+exports.default = App_1.default;

interfaces/applications.d.ts

@@ -1,2 +0,2 @@
-import { IEduzzToolbarSetupParams } from './toolbar';
+import { IEduzzToolbarSetupParams } from '.';
 import { Icons } from '@/components/Icon/mapper';
@@ -3,0 +3,0 @@ export interface IApplication {

interfaces/applications.js

@@ -1,1 +0,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

interfaces/styles.js

@@ -1,1 +0,2 @@
-export {};
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });

package.json

 {
   "name": "@eduzz/apps-toolbar",
-  "version": "4.0.6",
+  "version": "4.0.9",
   "private": false,
@@ -15,3 +15,3 @@ "author": "Eduzz Team",
     "start": "react-app-rewired start",
-    "clean": "git add . && git clean -x -f",
+    "clean": "sh ./scripts/clean.sh",
     "build": "yarn clean && tsc -p .",
@@ -18,0 +18,0 @@ "lint": "yarn eslint \"./src/**/*.ts\" \"./src/**/*.tsx\"",

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

Lines of code

1631

increased by6.05%

Worsened metrics

Total package byte prevSize

112637

decreased by-20.02%

Number of package files

70

decreased by-26.32%

No dependency changes