takeat-design-system-ui-kit 0.1.78 → 0.1.79

package/dist/cjs/App.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
+var jsx_runtime_1 = require("react/jsx-runtime");
 require("./App.css");
 function App() {
     return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, {});

package/dist/cjs/UiKitTheme.js

@@ -1,9 +1,10 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const jsx_runtime_1 = require("react/jsx-runtime");
-const styled_components_1 = require("styled-components");
-const consts_1 = require("./utils/consts");
-const UiKitTheme = ({ theme = consts_1.DEFAULT_THEME, children, }) => {
+var jsx_runtime_1 = require("react/jsx-runtime");
+var styled_components_1 = require("styled-components");
+var consts_1 = require("./utils/consts");
+var UiKitTheme = function (_a) {
+    var _b = _a.theme, theme = _b === void 0 ? consts_1.DEFAULT_THEME : _b, children = _a.children;
     return (0, jsx_runtime_1.jsx)(styled_components_1.ThemeProvider, { theme: theme, children: children });
 };
 exports.default = UiKitTheme;

package/dist/cjs/UiKitTheme.js.map

@@ -1 +1 @@
-{"version":3,"file":"UiKitTheme.js","sourceRoot":"","sources":["../../src/UiKitTheme.tsx"],"names":[],"mappings":";;;AACA,yDAAkD;AAClD,2CAAiE;AAMjE,MAAM,UAAU,GAA8B,CAAC,EAC7C,KAAK,GAAG,sBAAa,EACrB,QAAQ,GACT,EAAE,EAAE;IACH,OAAO,uBAAC,iCAAa,IAAC,KAAK,EAAE,KAAK,YAAG,QAAQ,GAAiB,CAAC;AACjE,CAAC,CAAC;AACF,kBAAe,UAAU,CAAC"}
+{"version":3,"file":"UiKitTheme.js","sourceRoot":"","sources":["../../src/UiKitTheme.tsx"],"names":[],"mappings":";;;AACA,uDAAkD;AAClD,yCAAiE;AAMjE,IAAM,UAAU,GAA8B,UAAC,EAG9C;QAFC,aAAqB,EAArB,KAAK,mBAAG,sBAAa,KAAA,EACrB,QAAQ,cAAA;IAER,OAAO,uBAAC,iCAAa,IAAC,KAAK,EAAE,KAAK,YAAG,QAAQ,GAAiB,CAAC;AACjE,CAAC,CAAC;AACF,kBAAe,UAAU,CAAC"}

package/dist/cjs/components/Accordion/Accordion.stories.js

@@ -1,8 +1,8 @@
 "use strict";
 // @ts-nocheck
 Object.defineProperty(exports, "__esModule", { value: true });
-const _1 = require(".");
-const meta = {
+var _1 = require(".");
+var meta = {
     component: _1.Accordion,
     title: "Design System/Accordion",
     tags: ["!autodocs"],

package/dist/cjs/components/Accordion/Accordion.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Accordion.stories.js","sourceRoot":"","sources":["../../../../src/components/Accordion/Accordion.stories.tsx"],"names":[],"mappings":";AAAA,cAAc;;AAGd,wBAA8B;AAE9B,MAAM,IAAI,GAA2B;IACnC,SAAS,EAAE,YAAS;IACpB,KAAK,EAAE,yBAAyB;IAChC,IAAI,EAAE,CAAC,WAAW,CAAC;IACnB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,QAAQ,EAAE,IAAI;SACf;KACF;CACF,CAAC;AAEF,kBAAe,IAAI,CAAC"}
+{"version":3,"file":"Accordion.stories.js","sourceRoot":"","sources":["../../../../src/components/Accordion/Accordion.stories.tsx"],"names":[],"mappings":";AAAA,cAAc;;AAGd,sBAA8B;AAE9B,IAAM,IAAI,GAA2B;IACnC,SAAS,EAAE,YAAS;IACpB,KAAK,EAAE,yBAAyB;IAChC,IAAI,EAAE,CAAC,WAAW,CAAC;IACnB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,QAAQ,EAAE,IAAI;SACf;KACF;CACF,CAAC;AAEF,kBAAe,IAAI,CAAC"}

package/dist/cjs/components/Accordion/index.js

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Accordion = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-exports.Accordion = (0, react_1.forwardRef)(function Accordion({}, ref) {
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+exports.Accordion = (0, react_1.forwardRef)(function Accordion(_a, ref) {
     return (0, jsx_runtime_1.jsx)("div", { ref: ref, children: "Accordion" });
 });
 //# sourceMappingURL=index.js.map

package/dist/cjs/components/Accordion/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Accordion/index.tsx"],"names":[],"mappings":";;;;AAAA,iCAA0C;AAK7B,QAAA,SAAS,GAAG,IAAA,kBAAU,EAAC,SAAS,SAAS,CAAC,EAAmB,EAAE,GAA8B;IACxG,OAAO,gCAAK,GAAG,EAAE,GAAG,0BAAiB,CAAC;AACxC,CAAC,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Accordion/index.tsx"],"names":[],"mappings":";;;;AAAA,+BAA0C;AAK7B,QAAA,SAAS,GAAG,IAAA,kBAAU,EAAC,SAAS,SAAS,CAAC,EAAmB,EAAE,GAA8B;IACxG,OAAO,gCAAK,GAAG,EAAE,GAAG,0BAAiB,CAAC;AACxC,CAAC,CAAC,CAAC"}

package/dist/cjs/components/Badge/Badge.stories.js

@@ -1,8 +1,8 @@
 "use strict";
 // @ts-nocheck
 Object.defineProperty(exports, "__esModule", { value: true });
-const _1 = require(".");
-const meta = {
+var _1 = require(".");
+var meta = {
     component: _1.Badge,
     title: "Design System/Badge",
     tags: ["!autodocs"],

package/dist/cjs/components/Badge/Badge.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Badge.stories.js","sourceRoot":"","sources":["../../../../src/components/Badge/Badge.stories.tsx"],"names":[],"mappings":";AAAA,cAAc;;AAGd,wBAA0B;AAE1B,MAAM,IAAI,GAAuB;IAC/B,SAAS,EAAE,QAAK;IAChB,KAAK,EAAE,qBAAqB;IAC5B,IAAI,EAAE,CAAC,WAAW,CAAC;IACnB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,QAAQ,EAAE,IAAI;SACf;KACF;CACF,CAAC;AAEF,kBAAe,IAAI,CAAC;AAIpB,oCAAoC"}
+{"version":3,"file":"Badge.stories.js","sourceRoot":"","sources":["../../../../src/components/Badge/Badge.stories.tsx"],"names":[],"mappings":";AAAA,cAAc;;AAGd,sBAA0B;AAE1B,IAAM,IAAI,GAAuB;IAC/B,SAAS,EAAE,QAAK;IAChB,KAAK,EAAE,qBAAqB;IAC5B,IAAI,EAAE,CAAC,WAAW,CAAC;IACnB,UAAU,EAAE;QACV,IAAI,EAAE;YACJ,QAAQ,EAAE,IAAI;SACf;KACF;CACF,CAAC;AAEF,kBAAe,IAAI,CAAC;AAIpB,oCAAoC"}

package/dist/cjs/components/Badge/index.js

@@ -1,9 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Badge = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-exports.Badge = (0, react_1.forwardRef)(function Badge({}, ref) {
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+exports.Badge = (0, react_1.forwardRef)(function Badge(_a, ref) {
     return (0, jsx_runtime_1.jsx)("div", { ref: ref, children: "Badge" });
 });
 //# sourceMappingURL=index.js.map

package/dist/cjs/components/Badge/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Badge/index.tsx"],"names":[],"mappings":";;;;AAAA,iCAA0C;AAK7B,QAAA,KAAK,GAAG,IAAA,kBAAU,EAAC,SAAS,KAAK,CAAC,EAAe,EAAE,GAA8B;IAC5F,OAAO,gCAAK,GAAG,EAAE,GAAG,sBAAa,CAAC;AACpC,CAAC,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Badge/index.tsx"],"names":[],"mappings":";;;;AAAA,+BAA0C;AAK7B,QAAA,KAAK,GAAG,IAAA,kBAAU,EAAC,SAAS,KAAK,CAAC,EAAe,EAAE,GAA8B;IAC5F,OAAO,gCAAK,GAAG,EAAE,GAAG,sBAAa,CAAC;AACpC,CAAC,CAAC,CAAC"}

package/dist/cjs/components/Button/Button.stories.js

@@ -1,12 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AllButtons = exports.IconExample = exports.Example = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const _1 = require(".");
-const icons_1 = require("../icons");
-const styles_1 = require("../StoriesComponents/styles");
-const styles_2 = require("./styles");
-const meta = {
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var _1 = require(".");
+var icons_1 = require("../icons");
+var styles_1 = require("../StoriesComponents/styles");
+var styles_2 = require("./styles");
+var meta = {
     title: "Design System/Button",
     component: _1.Button,
     parameters: {
@@ -57,13 +58,13 @@ exports.Example = {
 };
 exports.IconExample = {
     name: "Com ícone",
-    render: (args) => ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(_1.Button, { ...args, icon: (0, jsx_runtime_1.jsx)(icons_1.IconTakeatFilled, {}), onClick: () => console.log("Clicked"), children: "Bot\u00E3o" }) })),
+    render: function (args) { return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: (0, jsx_runtime_1.jsx)(_1.Button, tslib_1.__assign({}, args, { icon: (0, jsx_runtime_1.jsx)(icons_1.IconTakeatFilled, {}), onClick: function () { return console.log("Clicked"); }, children: "Bot\u00E3o" })) })); },
 };
 exports.AllButtons = {
     name: "Todos os botões",
-    render: () => {
-        const keys = Object.keys(_1.BUTTON_OPTIONS);
-        return ((0, jsx_runtime_1.jsxs)(styles_2.AllButtonsTable, { children: [(0, jsx_runtime_1.jsx)("thead", { children: (0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("th", { children: "Text" }), (0, jsx_runtime_1.jsx)("th", { children: "Icon + Text" }), (0, jsx_runtime_1.jsx)("th", { children: "Icon" }), (0, jsx_runtime_1.jsx)("th", { children: "Disabled" })] }) }), (0, jsx_runtime_1.jsx)("tbody", { children: keys.map((key) => ((0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsxs)("td", { children: [(0, jsx_runtime_1.jsx)(_1.Button, { variant: key, onClick: () => console.log(`Clicked ${key}`), children: key.charAt(0).toUpperCase() + key.slice(1) }), (0, jsx_runtime_1.jsx)("div", {})] }), (0, jsx_runtime_1.jsxs)("td", { children: [(0, jsx_runtime_1.jsx)(_1.Button, { variant: key, icon: (0, jsx_runtime_1.jsx)(icons_1.IconTakeatFilled, {}), onClick: () => console.log(`Clicked ${key}`), children: key.charAt(0).toUpperCase() + key.slice(1) }), (0, jsx_runtime_1.jsx)("div", {})] }), (0, jsx_runtime_1.jsxs)("td", { children: [(0, jsx_runtime_1.jsx)(_1.Button, { variant: key, icon: (0, jsx_runtime_1.jsx)(icons_1.IconTakeatFilled, {}), onClick: () => console.log(`Clicked ${key}`) }), (0, jsx_runtime_1.jsx)("div", {})] }), (0, jsx_runtime_1.jsxs)("td", { children: [(0, jsx_runtime_1.jsx)(_1.Button, { variant: key, onClick: () => console.log(`Clicked ${key}`), disabled: true, children: key.charAt(0).toUpperCase() + key.slice(1) }), (0, jsx_runtime_1.jsx)("div", {})] })] }, key))) })] }));
+    render: function () {
+        var keys = Object.keys(_1.BUTTON_OPTIONS);
+        return ((0, jsx_runtime_1.jsxs)(styles_2.AllButtonsTable, { children: [(0, jsx_runtime_1.jsx)("thead", { children: (0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsx)("th", { children: "Text" }), (0, jsx_runtime_1.jsx)("th", { children: "Icon + Text" }), (0, jsx_runtime_1.jsx)("th", { children: "Icon" }), (0, jsx_runtime_1.jsx)("th", { children: "Disabled" })] }) }), (0, jsx_runtime_1.jsx)("tbody", { children: keys.map(function (key) { return ((0, jsx_runtime_1.jsxs)("tr", { children: [(0, jsx_runtime_1.jsxs)("td", { children: [(0, jsx_runtime_1.jsx)(_1.Button, { variant: key, onClick: function () { return console.log("Clicked ".concat(key)); }, children: key.charAt(0).toUpperCase() + key.slice(1) }), (0, jsx_runtime_1.jsx)("div", {})] }), (0, jsx_runtime_1.jsxs)("td", { children: [(0, jsx_runtime_1.jsx)(_1.Button, { variant: key, icon: (0, jsx_runtime_1.jsx)(icons_1.IconTakeatFilled, {}), onClick: function () { return console.log("Clicked ".concat(key)); }, children: key.charAt(0).toUpperCase() + key.slice(1) }), (0, jsx_runtime_1.jsx)("div", {})] }), (0, jsx_runtime_1.jsxs)("td", { children: [(0, jsx_runtime_1.jsx)(_1.Button, { variant: key, icon: (0, jsx_runtime_1.jsx)(icons_1.IconTakeatFilled, {}), onClick: function () { return console.log("Clicked ".concat(key)); } }), (0, jsx_runtime_1.jsx)("div", {})] }), (0, jsx_runtime_1.jsxs)("td", { children: [(0, jsx_runtime_1.jsx)(_1.Button, { variant: key, onClick: function () { return console.log("Clicked ".concat(key)); }, disabled: true, children: key.charAt(0).toUpperCase() + key.slice(1) }), (0, jsx_runtime_1.jsx)("div", {})] })] }, key)); }) })] }));
     },
     // Disable all controls
     argTypes: {

package/dist/cjs/components/Button/Button.stories.js.map

@@ -1 +1 @@
-{"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../../../src/components/Button/Button.stories.tsx"],"names":[],"mappings":"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"}
+{"version":3,"file":"Button.stories.js","sourceRoot":"","sources":["../../../../src/components/Button/Button.stories.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/components/Button/index.js

@@ -1,12 +1,13 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Button = exports.BUTTON_OPTIONS = void 0;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const react_1 = require("react");
-const styles_1 = require("./styles");
-const functions_1 = require("../../utils/functions");
-const Spinner_1 = require("../Spinner");
-const styled_components_1 = require("styled-components");
+var tslib_1 = require("tslib");
+var jsx_runtime_1 = require("react/jsx-runtime");
+var react_1 = require("react");
+var styles_1 = require("./styles");
+var functions_1 = require("../../utils/functions");
+var Spinner_1 = require("../Spinner");
+var styled_components_1 = require("styled-components");
 exports.BUTTON_OPTIONS = {
     primary: styles_1.PrimaryButton,
     outlined: styles_1.OutlineButton,
@@ -14,7 +15,7 @@ exports.BUTTON_OPTIONS = {
     text: styles_1.TextButton,
     segmented: styles_1.SegmentedButton,
 };
-const DEVICE_VARIANTS = {
+var DEVICE_VARIANTS = {
     totem: {
         fontSize: "18px",
         height: "56px",
@@ -32,17 +33,15 @@ const DEVICE_VARIANTS = {
         height: "32px",
     },
 };
-exports.Button = (0, react_1.forwardRef)(function Button({ variant = "primary", icon, customColor, isLoading, isSelected, children, ...props }, ref) {
-    const theme = (0, styled_components_1.useTheme)();
-    const ButtonToRender = exports.BUTTON_OPTIONS[variant];
-    const colorVariants = customColor
-        ? (0, react_1.useMemo)(() => (0, functions_1.generateColorVariants)(customColor), [customColor])
+exports.Button = (0, react_1.forwardRef)(function Button(_a, ref) {
+    var _b = _a.variant, variant = _b === void 0 ? "primary" : _b, icon = _a.icon, customColor = _a.customColor, isLoading = _a.isLoading, isSelected = _a.isSelected, children = _a.children, props = tslib_1.__rest(_a, ["variant", "icon", "customColor", "isLoading", "isSelected", "children"]);
+    var theme = (0, styled_components_1.useTheme)();
+    var ButtonToRender = exports.BUTTON_OPTIONS[variant];
+    var colorVariants = customColor
+        ? (0, react_1.useMemo)(function () { return (0, functions_1.generateColorVariants)(customColor); }, [customColor])
         : undefined;
     // const onlyIcon = !!icon && !children;
-    const textAndIcon = !!icon && !!children;
-    return ((0, jsx_runtime_1.jsx)(ButtonToRender, { ref: ref, hasIcon: !!icon, textAndIcon: textAndIcon, isSelected: isSelected, colorVariants: colorVariants, ...props, style: {
-            ...DEVICE_VARIANTS[theme.device],
-            ...props.style,
-        }, disabled: isLoading || props.disabled, children: isLoading ? ((0, jsx_runtime_1.jsx)(Spinner_1.Spinner, { color: theme.colors.neutral.light })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [icon, children] })) }));
+    var textAndIcon = !!icon && !!children;
+    return ((0, jsx_runtime_1.jsx)(ButtonToRender, tslib_1.__assign({ ref: ref, hasIcon: !!icon, textAndIcon: textAndIcon, isSelected: isSelected, colorVariants: colorVariants }, props, { style: tslib_1.__assign(tslib_1.__assign({}, DEVICE_VARIANTS[theme.device]), props.style), disabled: isLoading || props.disabled, children: isLoading ? ((0, jsx_runtime_1.jsx)(Spinner_1.Spinner, { color: theme.colors.neutral.light })) : ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [icon, children] })) })));
 });
 //# sourceMappingURL=index.js.map

package/dist/cjs/components/Button/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Button/index.tsx"],"names":[],"mappings":";;;;AAAA,iCAAmD;AACnD,qCAMkB;AAClB,qDAA8D;AAC9D,wCAAqC;AACrC,yDAA6C;AAEhC,QAAA,cAAc,GAAG;IAC5B,OAAO,EAAE,sBAAa;IACtB,QAAQ,EAAE,sBAAa;IACvB,KAAK,EAAE,oBAAW;IAClB,IAAI,EAAE,mBAAU;IAChB,SAAS,EAAE,wBAAe;CAC3B,CAAC;AAEF,MAAM,eAAe,GAAG;IACtB,KAAK,EAAE;QACL,QAAQ,EAAE,MAAM;QAChB,MAAM,EAAE,MAAM;KACf;IACD,MAAM,EAAE;QACN,QAAQ,EAAE,MAAM;QAChB,MAAM,EAAE,MAAM;KACf;IACD,OAAO,EAAE;QACP,QAAQ,EAAE,MAAM;QAChB,MAAM,EAAE,MAAM;KACf;IACD,MAAM,EAAE;QACN,QAAQ,EAAE,MAAM;QAChB,MAAM,EAAE,MAAM;KACf;CACF,CAAC;AAWW,QAAA,MAAM,GAAG,IAAA,kBAAU,EAAC,SAAS,MAAM,CAC9C,EACE,OAAO,GAAG,SAAS,EACnB,IAAI,EACJ,WAAW,EACX,SAAS,EACT,UAAU,EACV,QAAQ,EACR,GAAG,KAAK,EACI,EACd,GAAiC;IAEjC,MAAM,KAAK,GAAG,IAAA,4BAAQ,GAAE,CAAC;IACzB,MAAM,cAAc,GAAG,sBAAc,CAAC,OAAO,CAAC,CAAC;IAC/C,MAAM,aAAa,GAAG,WAAW;QAC/B,CAAC,CAAC,IAAA,eAAO,EAAC,GAAG,EAAE,CAAC,IAAA,iCAAqB,EAAC,WAAW,CAAC,EAAE,CAAC,WAAW,CAAC,CAAC;QAClE,CAAC,CAAC,SAAS,CAAC;IAEd,wCAAwC;IACxC,MAAM,WAAW,GAAG,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,QAAQ,CAAC;IAEzC,OAAO,CACL,uBAAC,cAAc,IACb,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,CAAC,CAAC,IAAI,EACf,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,KACxB,KAAK,EACT,KAAK,EAAE;YACL,GAAG,eAAe,CAAC,KAAK,CAAC,MAAsC,CAAC;YAChE,GAAG,KAAK,CAAC,KAAK;SACf,EACD,QAAQ,EAAE,SAAS,IAAI,KAAK,CAAC,QAAQ,YAEpC,SAAS,CAAC,CAAC,CAAC,CACX,uBAAC,iBAAO,IAAC,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,GAAI,CAC/C,CAAC,CAAC,CAAC,CACF,6DACG,IAAI,EACJ,QAAQ,IACR,CACJ,GACc,CAClB,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/Button/index.tsx"],"names":[],"mappings":";;;;;AAAA,+BAAmD;AACnD,mCAMkB;AAClB,mDAA8D;AAC9D,sCAAqC;AACrC,uDAA6C;AAEhC,QAAA,cAAc,GAAG;IAC5B,OAAO,EAAE,sBAAa;IACtB,QAAQ,EAAE,sBAAa;IACvB,KAAK,EAAE,oBAAW;IAClB,IAAI,EAAE,mBAAU;IAChB,SAAS,EAAE,wBAAe;CAC3B,CAAC;AAEF,IAAM,eAAe,GAAG;IACtB,KAAK,EAAE;QACL,QAAQ,EAAE,MAAM;QAChB,MAAM,EAAE,MAAM;KACf;IACD,MAAM,EAAE;QACN,QAAQ,EAAE,MAAM;QAChB,MAAM,EAAE,MAAM;KACf;IACD,OAAO,EAAE;QACP,QAAQ,EAAE,MAAM;QAChB,MAAM,EAAE,MAAM;KACf;IACD,MAAM,EAAE;QACN,QAAQ,EAAE,MAAM;QAChB,MAAM,EAAE,MAAM;KACf;CACF,CAAC;AAWW,QAAA,MAAM,GAAG,IAAA,kBAAU,EAAC,SAAS,MAAM,CAC9C,EAQc,EACd,GAAiC;IAR/B,IAAA,eAAmB,EAAnB,OAAO,mBAAG,SAAS,KAAA,EACnB,IAAI,UAAA,EACJ,WAAW,iBAAA,EACX,SAAS,eAAA,EACT,UAAU,gBAAA,EACV,QAAQ,cAAA,EACL,KAAK,sBAPV,yEAQC,CADS;IAIV,IAAM,KAAK,GAAG,IAAA,4BAAQ,GAAE,CAAC;IACzB,IAAM,cAAc,GAAG,sBAAc,CAAC,OAAO,CAAC,CAAC;IAC/C,IAAM,aAAa,GAAG,WAAW;QAC/B,CAAC,CAAC,IAAA,eAAO,EAAC,cAAM,OAAA,IAAA,iCAAqB,EAAC,WAAW,CAAC,EAAlC,CAAkC,EAAE,CAAC,WAAW,CAAC,CAAC;QAClE,CAAC,CAAC,SAAS,CAAC;IAEd,wCAAwC;IACxC,IAAM,WAAW,GAAG,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,QAAQ,CAAC;IAEzC,OAAO,CACL,uBAAC,cAAc,qBACb,GAAG,EAAE,GAAG,EACR,OAAO,EAAE,CAAC,CAAC,IAAI,EACf,WAAW,EAAE,WAAW,EACxB,UAAU,EAAE,UAAU,EACtB,aAAa,EAAE,aAAa,IACxB,KAAK,IACT,KAAK,wCACA,eAAe,CAAC,KAAK,CAAC,MAAsC,CAAC,GAC7D,KAAK,CAAC,KAAK,GAEhB,QAAQ,EAAE,SAAS,IAAI,KAAK,CAAC,QAAQ,YAEpC,SAAS,CAAC,CAAC,CAAC,CACX,uBAAC,iBAAO,IAAC,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,OAAO,CAAC,KAAK,GAAI,CAC/C,CAAC,CAAC,CAAC,CACF,6DACG,IAAI,EACJ,QAAQ,IACR,CACJ,IACc,CAClB,CAAC;AACJ,CAAC,CAAC,CAAC"}

package/dist/cjs/components/Button/styles.js

@@ -1,191 +1,157 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.AllButtonsTable = exports.SegmentedButton = exports.TextButton = exports.TonalButton = exports.OutlineButton = exports.PrimaryButton = void 0;
-const tslib_1 = require("tslib");
-const styled_components_1 = tslib_1.__importDefault(require("styled-components"));
-exports.PrimaryButton = styled_components_1.default.button `
-  width: fit-content;
-  height: 40px;
-  border: none;
-  // Paddings variations
-  ${({ theme, hasIcon, textAndIcon }) => textAndIcon
-    ? `padding: 0 12px 0 ${theme.spacing.xs};`
-    : hasIcon
-        ? `padding: 0 ${theme.spacing.xs};`
-        : `padding: 0 ${theme.spacing.s};`}
-  background-color: ${({ theme, colorVariants }) => colorVariants?.default || theme.colors.primary.default};
-  border-radius: ${({ theme }) => theme.radius.l};
-  cursor: pointer;
-  display: inline-flex;
-  justify-content: center;
-  align-items: center;
-  gap: ${({ theme }) => theme.spacing.xs};
-  transition: all 0.3s;
-
-  font-family: ${({ theme }) => theme.typography.family.default};
-  font-size: 14px;
-  font-weight: 600;
-  line-height: 16px;
-  letter-spacing: 0.5px;
-  text-align: center;
-  color: #fff;
-
-  svg {
-    font-size: 24px;
-    fill: #fff;
-    flex-shrink: 0;
-    transition: all 0.3s;
-  }
-
-  &:hover {
-    background-color: ${({ theme, colorVariants }) => colorVariants?.dark || theme.colors.primary.dark};
-  }
-
-  &:active {
-    background-color: ${({ theme, colorVariants }) => colorVariants?.darker || theme.colors.primary.darker};
-  }
-
-  &:focus-visible {
-    outline: 1px solid
-      ${({ theme, colorVariants }) => colorVariants?.darker || theme.colors.primary.darker};
-  }
-
-  &:disabled {
-    background-color: ${({ theme }) => theme.colors.neutral.lighter};
-    color: ${({ theme }) => theme.colors.neutral.light};
-    cursor: default;
-
-    svg {
-      fill: ${({ theme }) => theme.colors.neutral.light};
-    }
-  }
-`;
-exports.OutlineButton = (0, styled_components_1.default)(exports.PrimaryButton) `
-  background-color: transparent;
-  border: 1px solid
-    ${({ theme, colorVariants }) => colorVariants?.default || theme.colors.primary.default};
-  color: ${({ theme, colorVariants }) => colorVariants?.default || theme.colors.primary.default};
-
-  svg {
-    fill: ${({ theme, colorVariants }) => colorVariants?.default || theme.colors.primary.default};
-  }
-
-  &:hover {
-    background-color: ${({ theme, colorVariants }) => colorVariants?.lightest || theme.colors.primary.lightest};
-  }
-
-  &:active {
-    background-color: ${({ theme, colorVariants }) => colorVariants?.lighter || theme.colors.primary.lighter};
-  }
-
-  &:disabled {
-    background-color: ${({ theme }) => theme.colors.neutral.lightest};
-    color: ${({ theme }) => theme.colors.neutral.light};
-    border-color: ${({ theme }) => theme.colors.neutral.light};
-  }
-`;
-exports.TonalButton = (0, styled_components_1.default)(exports.PrimaryButton) `
-  background-color: ${({ theme, colorVariants }) => colorVariants?.lightest || theme.colors.primary.lightest};
-  color: ${({ theme, colorVariants }) => colorVariants?.darker || theme.colors.primary.darker};
-
-  svg {
-    fill: ${({ theme }) => theme.colors.primary.darker};
-  }
-
-  &:hover {
-    background-color: ${({ theme, colorVariants }) => colorVariants?.lighter || theme.colors.primary.lighter};
-  }
-
-  &:active {
-    background-color: ${({ theme, colorVariants }) => colorVariants?.light || theme.colors.primary.light};
-  }
-
-  &:disabled {
-    background-color: ${({ theme }) => theme.colors.neutral.lighter};
-    color: ${({ theme }) => theme.colors.neutral.light};
-  }
-`;
-exports.TextButton = (0, styled_components_1.default)(exports.PrimaryButton) `
-  background-color: transparent;
-  color: ${({ theme, colorVariants }) => colorVariants?.default || theme.colors.primary.default};
-
-  svg {
-    fill: ${({ theme, colorVariants }) => colorVariants?.default || theme.colors.primary.default};
-    transition: all 0.3s;
-  }
-
-  &:hover {
-    background-color: transparent;
-    color: ${({ theme, colorVariants }) => colorVariants?.dark || theme.colors.primary.dark};
-    svg {
-      fill: ${({ theme, colorVariants }) => colorVariants?.dark || theme.colors.primary.dark};
-    }
-  }
-
-  &:active {
-    background-color: transparent;
-    color: ${({ theme, colorVariants }) => colorVariants?.darker || theme.colors.primary.darker};
-    svg {
-      fill: ${({ theme, colorVariants }) => colorVariants?.darker || theme.colors.primary.darker};
-    }
-  }
-
-  &:disabled {
-    background-color: transparent;
-    color: ${({ theme }) => theme.colors.neutral.light};
-
-    svg {
-      fill: ${({ theme }) => theme.colors.neutral.light};
-    }
-  }
-`;
-exports.SegmentedButton = (0, styled_components_1.default)(exports.OutlineButton) `
-  border-radius: 0;
-  background-color: ${({ theme, isSelected, colorVariants }) => isSelected
-    ? colorVariants?.default || theme.colors.primary.default
-    : "transparent"};
-  color: ${({ theme, isSelected, colorVariants }) => isSelected
-    ? theme.colors.neutral.lightest
-    : colorVariants?.default || theme.colors.primary.default};
-
-  &:hover {
-    color: ${({ theme, colorVariants }) => colorVariants?.default || theme.colors.primary.default};
-  }
-
-  &:first-child {
-    border-top-left-radius: ${({ theme }) => theme.radius.l};
-    border-bottom-left-radius: ${({ theme }) => theme.radius.l};
-  }
-
-  &:last-child {
-    border-top-right-radius: ${({ theme }) => theme.radius.l};
-    border-bottom-right-radius: ${({ theme }) => theme.radius.l};
-  }
-
-  &:not(:last-child) {
-    border-right: 0;
-  }
-
-  &:disabled {
-    background-color: transparent;
-    color: ${({ theme }) => theme.colors.neutral.light};
-  }
-`;
+var tslib_1 = require("tslib");
+var styled_components_1 = tslib_1.__importDefault(require("styled-components"));
+exports.PrimaryButton = styled_components_1.default.button(templateObject_1 || (templateObject_1 = tslib_1.__makeTemplateObject(["\n  width: fit-content;\n  height: 40px;\n  border: none;\n  // Paddings variations\n  ", "\n  background-color: ", ";\n  border-radius: ", ";\n  cursor: pointer;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  gap: ", ";\n  transition: all 0.3s;\n\n  font-family: ", ";\n  font-size: 14px;\n  font-weight: 600;\n  line-height: 16px;\n  letter-spacing: 0.5px;\n  text-align: center;\n  color: #fff;\n\n  svg {\n    font-size: 24px;\n    fill: #fff;\n    flex-shrink: 0;\n    transition: all 0.3s;\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  &:active {\n    background-color: ", ";\n  }\n\n  &:focus-visible {\n    outline: 1px solid\n      ", ";\n  }\n\n  &:disabled {\n    background-color: ", ";\n    color: ", ";\n    cursor: default;\n\n    svg {\n      fill: ", ";\n    }\n  }\n"], ["\n  width: fit-content;\n  height: 40px;\n  border: none;\n  // Paddings variations\n  ", "\n  background-color: ", ";\n  border-radius: ", ";\n  cursor: pointer;\n  display: inline-flex;\n  justify-content: center;\n  align-items: center;\n  gap: ", ";\n  transition: all 0.3s;\n\n  font-family: ", ";\n  font-size: 14px;\n  font-weight: 600;\n  line-height: 16px;\n  letter-spacing: 0.5px;\n  text-align: center;\n  color: #fff;\n\n  svg {\n    font-size: 24px;\n    fill: #fff;\n    flex-shrink: 0;\n    transition: all 0.3s;\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  &:active {\n    background-color: ", ";\n  }\n\n  &:focus-visible {\n    outline: 1px solid\n      ", ";\n  }\n\n  &:disabled {\n    background-color: ", ";\n    color: ", ";\n    cursor: default;\n\n    svg {\n      fill: ", ";\n    }\n  }\n"])), function (_a) {
+    var theme = _a.theme, hasIcon = _a.hasIcon, textAndIcon = _a.textAndIcon;
+    return textAndIcon
+        ? "padding: 0 12px 0 ".concat(theme.spacing.xs, ";")
+        : hasIcon
+            ? "padding: 0 ".concat(theme.spacing.xs, ";")
+            : "padding: 0 ".concat(theme.spacing.s, ";");
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.default) || theme.colors.primary.default;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.radius.l;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.xs;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.typography.family.default;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.dark) || theme.colors.primary.dark;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.darker) || theme.colors.primary.darker;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.darker) || theme.colors.primary.darker;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.neutral.lighter;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.neutral.light;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.neutral.light;
+});
+exports.OutlineButton = (0, styled_components_1.default)(exports.PrimaryButton)(templateObject_2 || (templateObject_2 = tslib_1.__makeTemplateObject(["\n  background-color: transparent;\n  border: 1px solid\n    ", ";\n  color: ", ";\n\n  svg {\n    fill: ", ";\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  &:active {\n    background-color: ", ";\n  }\n\n  &:disabled {\n    background-color: ", ";\n    color: ", ";\n    border-color: ", ";\n  }\n"], ["\n  background-color: transparent;\n  border: 1px solid\n    ", ";\n  color: ", ";\n\n  svg {\n    fill: ", ";\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  &:active {\n    background-color: ", ";\n  }\n\n  &:disabled {\n    background-color: ", ";\n    color: ", ";\n    border-color: ", ";\n  }\n"])), function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.default) || theme.colors.primary.default;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.default) || theme.colors.primary.default;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.default) || theme.colors.primary.default;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.lightest) || theme.colors.primary.lightest;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.lighter) || theme.colors.primary.lighter;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.neutral.lightest;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.neutral.light;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.neutral.light;
+});
+exports.TonalButton = (0, styled_components_1.default)(exports.PrimaryButton)(templateObject_3 || (templateObject_3 = tslib_1.__makeTemplateObject(["\n  background-color: ", ";\n  color: ", ";\n\n  svg {\n    fill: ", ";\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  &:active {\n    background-color: ", ";\n  }\n\n  &:disabled {\n    background-color: ", ";\n    color: ", ";\n  }\n"], ["\n  background-color: ", ";\n  color: ", ";\n\n  svg {\n    fill: ", ";\n  }\n\n  &:hover {\n    background-color: ", ";\n  }\n\n  &:active {\n    background-color: ", ";\n  }\n\n  &:disabled {\n    background-color: ", ";\n    color: ", ";\n  }\n"])), function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.lightest) || theme.colors.primary.lightest;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.darker) || theme.colors.primary.darker;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.primary.darker;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.lighter) || theme.colors.primary.lighter;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.light) || theme.colors.primary.light;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.neutral.lighter;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.neutral.light;
+});
+exports.TextButton = (0, styled_components_1.default)(exports.PrimaryButton)(templateObject_4 || (templateObject_4 = tslib_1.__makeTemplateObject(["\n  background-color: transparent;\n  color: ", ";\n\n  svg {\n    fill: ", ";\n    transition: all 0.3s;\n  }\n\n  &:hover {\n    background-color: transparent;\n    color: ", ";\n    svg {\n      fill: ", ";\n    }\n  }\n\n  &:active {\n    background-color: transparent;\n    color: ", ";\n    svg {\n      fill: ", ";\n    }\n  }\n\n  &:disabled {\n    background-color: transparent;\n    color: ", ";\n\n    svg {\n      fill: ", ";\n    }\n  }\n"], ["\n  background-color: transparent;\n  color: ", ";\n\n  svg {\n    fill: ", ";\n    transition: all 0.3s;\n  }\n\n  &:hover {\n    background-color: transparent;\n    color: ", ";\n    svg {\n      fill: ", ";\n    }\n  }\n\n  &:active {\n    background-color: transparent;\n    color: ", ";\n    svg {\n      fill: ", ";\n    }\n  }\n\n  &:disabled {\n    background-color: transparent;\n    color: ", ";\n\n    svg {\n      fill: ", ";\n    }\n  }\n"])), function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.default) || theme.colors.primary.default;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.default) || theme.colors.primary.default;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.dark) || theme.colors.primary.dark;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.dark) || theme.colors.primary.dark;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.darker) || theme.colors.primary.darker;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.darker) || theme.colors.primary.darker;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.neutral.light;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.neutral.light;
+});
+exports.SegmentedButton = (0, styled_components_1.default)(exports.OutlineButton)(templateObject_5 || (templateObject_5 = tslib_1.__makeTemplateObject(["\n  border-radius: 0;\n  background-color: ", ";\n  color: ", ";\n\n  &:hover {\n    color: ", ";\n  }\n\n  &:first-child {\n    border-top-left-radius: ", ";\n    border-bottom-left-radius: ", ";\n  }\n\n  &:last-child {\n    border-top-right-radius: ", ";\n    border-bottom-right-radius: ", ";\n  }\n\n  &:not(:last-child) {\n    border-right: 0;\n  }\n\n  &:disabled {\n    background-color: transparent;\n    color: ", ";\n  }\n"], ["\n  border-radius: 0;\n  background-color: ", ";\n  color: ", ";\n\n  &:hover {\n    color: ", ";\n  }\n\n  &:first-child {\n    border-top-left-radius: ", ";\n    border-bottom-left-radius: ", ";\n  }\n\n  &:last-child {\n    border-top-right-radius: ", ";\n    border-bottom-right-radius: ", ";\n  }\n\n  &:not(:last-child) {\n    border-right: 0;\n  }\n\n  &:disabled {\n    background-color: transparent;\n    color: ", ";\n  }\n"])), function (_a) {
+    var theme = _a.theme, isSelected = _a.isSelected, colorVariants = _a.colorVariants;
+    return isSelected
+        ? (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.default) || theme.colors.primary.default
+        : "transparent";
+}, function (_a) {
+    var theme = _a.theme, isSelected = _a.isSelected, colorVariants = _a.colorVariants;
+    return isSelected
+        ? theme.colors.neutral.lightest
+        : (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.default) || theme.colors.primary.default;
+}, function (_a) {
+    var theme = _a.theme, colorVariants = _a.colorVariants;
+    return (colorVariants === null || colorVariants === void 0 ? void 0 : colorVariants.default) || theme.colors.primary.default;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.radius.l;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.radius.l;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.radius.l;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.radius.l;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.neutral.light;
+});
 //Stories
-exports.AllButtonsTable = styled_components_1.default.table `
-  width: 100%;
-  border-collapse: collapse;
-
-  th {
-    border: 1px solid black;
-    padding: ${({ theme }) => theme.spacing.xs};
-    background-color: ${({ theme }) => theme.colors.neutral.lightest};
-  }
-
-  td {
-    border: 1px solid black;
-    padding: ${({ theme }) => theme.spacing.xs};
-    text-align: center;
-  }
-`;
+exports.AllButtonsTable = styled_components_1.default.table(templateObject_6 || (templateObject_6 = tslib_1.__makeTemplateObject(["\n  width: 100%;\n  border-collapse: collapse;\n\n  th {\n    border: 1px solid black;\n    padding: ", ";\n    background-color: ", ";\n  }\n\n  td {\n    border: 1px solid black;\n    padding: ", ";\n    text-align: center;\n  }\n"], ["\n  width: 100%;\n  border-collapse: collapse;\n\n  th {\n    border: 1px solid black;\n    padding: ", ";\n    background-color: ", ";\n  }\n\n  td {\n    border: 1px solid black;\n    padding: ", ";\n    text-align: center;\n  }\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.xs;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.colors.neutral.lightest;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.spacing.xs;
+});
+var templateObject_1, templateObject_2, templateObject_3, templateObject_4, templateObject_5, templateObject_6;
 //# sourceMappingURL=styles.js.map