@appquality/unguess-design-system 2.5.4 → 2.5.7

package/CHANGELOG.md

@@ -1,3 +1,33 @@
+# v2.5.7 (Mon Mar 28 2022)
+
+
+
+---
+
+# v2.5.6 (Mon Mar 28 2022)
+
+#### ⚠️ Pushed to `master`
+
+- fix(spaces): fix spaces between main, body and page title ([@cannarocks](https://github.com/cannarocks))
+
+#### Authors: 1
+
+- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
+
+---
+
+# v2.5.5 (Mon Mar 28 2022)
+
+#### ⚠️ Pushed to `master`
+
+- fix(main): add spaces as described by dressBerry ([@cannarocks](https://github.com/cannarocks))
+
+#### Authors: 1
+
+- Luca Cannarozzo ([@cannarocks](https://github.com/cannarocks))
+
+---
+
 # v2.5.3 (Fri Mar 25 2022)
 
 #### ⚠️ Pushed to `master`

package/build/index.js

@@ -224,8 +224,8 @@ var gradients = {
 
 var theme = __assign(__assign({}, reactTheming.DEFAULT_THEME), { palette: palette, fonts: __assign(__assign({}, reactTheming.DEFAULT_THEME.fonts), { system: '"Poppins",sans-serif,Helvetica,Arial,sans-serif' }), gradients: gradients, components: __assign(__assign({}, reactTheming.DEFAULT_THEME.components), { Headers: __assign(__assign({}, reactTheming.DEFAULT_THEME.components.Headers), { height: "64px" }) }) });
 
-var GlobalStyle = styled.createGlobalStyle(templateObject_1$x || (templateObject_1$x = __makeTemplateObject(["\n  body {\n    font-family: ", ";\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  \n  svg {\n    max-height: 100%;\n  }\n  \n  "], ["\n  body {\n    font-family: ", ";\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  \n  svg {\n    max-height: 100%;\n  }\n  \n  "])), theme.fonts.system);
-var templateObject_1$x;
+var GlobalStyle = styled.createGlobalStyle(templateObject_1$z || (templateObject_1$z = __makeTemplateObject(["\n  body {\n    font-family: ", ";\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  \n  svg {\n    max-height: 100%;\n  }\n  \n  "], ["\n  body {\n    font-family: ", ";\n    -webkit-font-smoothing: antialiased;\n    -moz-osx-font-smoothing: grayscale;\n  }\n  \n  svg {\n    max-height: 100%;\n  }\n  \n  "])), theme.fonts.system);
+var templateObject_1$z;
 
 /**
  * Accordions are headers that can be expanded to reveal content or collapsed to hide it.
@@ -241,7 +241,7 @@ Accordion.Label = reactAccordions.Accordion.Label;
 Accordion.Panel = reactAccordions.Accordion.Panel;
 
 // import useWindowSize from "../../hooks/useWindowSize";
-var UgAvatar = styled__default["default"](reactAvatars.Avatar)(templateObject_1$w || (templateObject_1$w = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (props) {
+var UgAvatar = styled__default["default"](reactAvatars.Avatar)(templateObject_1$y || (templateObject_1$y = __makeTemplateObject(["\n  ", "\n"], ["\n  ", "\n"])), function (props) {
     return "\n    background: ".concat(props.backgroundColor || theme.gradients.dark, ";\n   ");
 });
 /**
@@ -264,7 +264,7 @@ var Avatar = function (props) {
     return (jsxRuntime.jsx(UgAvatar, __assign({}, props, { badge: fixedBadge, children: wrapChildren(props.avatarType || "text"), size: props.size || "small" })));
 };
 Avatar.Text = UgAvatar.Text;
-var templateObject_1$w;
+var templateObject_1$y;
 
 /**
  * Breadcrumbs mark and communicate a user’s location in the product.
@@ -285,7 +285,7 @@ var Breadcrumb = function (props) { return jsxRuntime.jsx(reactBreadcrumbs.Bread
  */
 var Anchor = function (props) { return jsxRuntime.jsx(reactButtons.Anchor, __assign({}, props)); };
 
-var UgButton = styled__default["default"](reactButtons.Button)(templateObject_1$v || (templateObject_1$v = __makeTemplateObject([""], [""])));
+var UgButton = styled__default["default"](reactButtons.Button)(templateObject_1$x || (templateObject_1$x = __makeTemplateObject([""], [""])));
 /**
  * Buttons let users take action quickly.
  * Use a Button to enable actions or decisions that are important to a user’s workflow.
@@ -297,7 +297,7 @@ var UgButton = styled__default["default"](reactButtons.Button)(templateObject_1$
 var Button = function (props) { return jsxRuntime.jsx(UgButton, __assign({}, props)); };
 Button.StartIcon = UgButton.StartIcon;
 Button.EndIcon = UgButton.EndIcon;
-var templateObject_1$v;
+var templateObject_1$x;
 
 /**
 A Button group lets users make a selection from a set of options.
@@ -340,25 +340,25 @@ var Card = function (props) { return jsxRuntime.jsx(reactNotifications.Well, __a
  */
 var Close = function (props) { return jsxRuntime.jsx(reactNotifications.Close, __assign({}, props)); };
 
-var UgField$1 = styled__default["default"](reactDropdowns.Field)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject([""], [""])));
+var UgField$1 = styled__default["default"](reactDropdowns.Field)(templateObject_1$w || (templateObject_1$w = __makeTemplateObject([""], [""])));
 var Field$1 = function (props) { return jsxRuntime.jsx(UgField$1, __assign({}, props)); };
-var templateObject_1$u;
+var templateObject_1$w;
 
 var index$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
     Field: Field$1
 });
 
-var UgItem = styled__default["default"](reactDropdowns.Item)(templateObject_1$t || (templateObject_1$t = __makeTemplateObject([""], [""])));
+var UgItem = styled__default["default"](reactDropdowns.Item)(templateObject_1$v || (templateObject_1$v = __makeTemplateObject([""], [""])));
 var Item = function (props) { return jsxRuntime.jsx(UgItem, __assign({}, props)); };
-var templateObject_1$t;
+var templateObject_1$v;
 
-var UgMenu = styled__default["default"](reactDropdowns.Menu)(templateObject_1$s || (templateObject_1$s = __makeTemplateObject([""], [""])));
+var UgMenu = styled__default["default"](reactDropdowns.Menu)(templateObject_1$u || (templateObject_1$u = __makeTemplateObject([""], [""])));
 /**
    * A Menu is a wrapper for items elements
    **/
 var Menu = function (props) { return jsxRuntime.jsx(UgMenu, __assign({}, props)); };
-var templateObject_1$s;
+var templateObject_1$u;
 
 /**
  * Multiselect lets users select multiple items from a list. Options are dynamically filtered as a user types in the input field and their selections appear as tags in the input field.
@@ -383,7 +383,7 @@ var Select = function (props) { return jsxRuntime.jsx(reactDropdowns.Select, __a
 var Dropdown = function (props) { return jsxRuntime.jsx(reactDropdowns.Dropdown, __assign({}, props)); };
 var Message = function (props) { return jsxRuntime.jsx(reactDropdowns.Message, __assign({}, props)); };
 
-var UgCheckbox = styled__default["default"](reactForms.Checkbox)(templateObject_1$r || (templateObject_1$r = __makeTemplateObject([""], [""])));
+var UgCheckbox = styled__default["default"](reactForms.Checkbox)(templateObject_1$t || (templateObject_1$t = __makeTemplateObject([""], [""])));
 /**
    * A Checkbox lets users select and unselect options from a list.
    * <hr>
@@ -395,21 +395,21 @@ var UgCheckbox = styled__default["default"](reactForms.Checkbox)(templateObject_
    *  - To let users activate an option that takes effect immediately, use a Toggle instead
    **/
 var Checkbox = function (props) { return jsxRuntime.jsx(UgCheckbox, __assign({}, props)); };
-var templateObject_1$r;
+var templateObject_1$t;
 
-var UgField = styled__default["default"](reactForms.Field)(templateObject_1$q || (templateObject_1$q = __makeTemplateObject([""], [""])));
+var UgField = styled__default["default"](reactForms.Field)(templateObject_1$s || (templateObject_1$s = __makeTemplateObject([""], [""])));
 /**
    * A Field is a wrapper for input elements
    **/
 var Field = function (props) { return jsxRuntime.jsx(UgField, __assign({}, props)); };
-var templateObject_1$q;
+var templateObject_1$s;
 
 var index = /*#__PURE__*/Object.freeze({
     __proto__: null,
     Field: Field
 });
 
-var UgInput = styled__default["default"](reactForms.Input)(templateObject_1$p || (templateObject_1$p = __makeTemplateObject([""], [""])));
+var UgInput = styled__default["default"](reactForms.Input)(templateObject_1$r || (templateObject_1$r = __makeTemplateObject([""], [""])));
 /**
    * An Input lets users enter text into a field.
    * <hr>
@@ -418,9 +418,9 @@ var UgInput = styled__default["default"](reactForms.Input)(templateObject_1$p ||
    *  - To enter multiline text, use a Textarea
    **/
 var Input = function (props) { return jsxRuntime.jsx(UgInput, __assign({}, props)); };
-var templateObject_1$p;
+var templateObject_1$r;
 
-var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$o || (templateObject_1$o = __makeTemplateObject([""], [""])));
+var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$q || (templateObject_1$q = __makeTemplateObject([""], [""])));
 /**
    * Radio buttons let users choose a single option among two or more mutually exclusive options.
    * <hr>
@@ -432,9 +432,9 @@ var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$o ||
    *  - To select from a long list of options, use Select instead
    **/
 var Radio = function (props) { return jsxRuntime.jsx(UgRadio, __assign({}, props)); };
-var templateObject_1$o;
+var templateObject_1$q;
 
-var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_1$n || (templateObject_1$n = __makeTemplateObject([""], [""])));
+var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_1$p || (templateObject_1$p = __makeTemplateObject([""], [""])));
 /**
    * A Textarea is a form control for multi-line text.
    * <hr>
@@ -442,9 +442,9 @@ var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_
    *  - To enter multi-line text
    **/
 var Textarea = function (props) { return jsxRuntime.jsx(UgTextarea, __assign({}, props)); };
-var templateObject_1$n;
+var templateObject_1$p;
 
-var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$m || (templateObject_1$m = __makeTemplateObject([""], [""])));
+var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$o || (templateObject_1$o = __makeTemplateObject([""], [""])));
 /**
    * A Toggle lets users turn something on and off like a light switch. Unlike a Checkbox, which is used for selection, a Toggle is used for activation.
    * <hr>
@@ -455,7 +455,7 @@ var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$m
    *  - To let users select from a list of settings, use Checkboxes instead
    **/
 var Toggle = function (props) { return jsxRuntime.jsx(UgToggle, __assign({}, props)); };
-var templateObject_1$m;
+var templateObject_1$o;
 
 var Col = function (props) { return jsxRuntime.jsx(reactGrid.Col, __assign({}, props)); };
 
@@ -520,7 +520,7 @@ var SvgUgTriangle = function SvgUgTriangle(props) {
   })));
 };
 
-var StyledUgIcon = styled__default["default"].span(templateObject_1$l || (templateObject_1$l = __makeTemplateObject([""], [""])));
+var StyledUgIcon = styled__default["default"].span(templateObject_1$n || (templateObject_1$n = __makeTemplateObject([""], [""])));
 var Icon = function (props) {
     var children = function (type, size) {
         if (size === void 0) { size = 24; }
@@ -533,17 +533,17 @@ var Icon = function (props) {
     };
     return (jsxRuntime.jsx(StyledUgIcon, { children: children(props.type, props.size) }));
 };
-var templateObject_1$l;
+var templateObject_1$n;
 
-var UgLabel = styled__default["default"](reactForms.Label)(templateObject_1$k || (templateObject_1$k = __makeTemplateObject([""], [""])));
+var UgLabel = styled__default["default"](reactForms.Label)(templateObject_1$m || (templateObject_1$m = __makeTemplateObject([""], [""])));
 /**
    * A Label is used to specify a title for an input.
    * <hr>
    **/
 var Label = function (props) { return jsxRuntime.jsx(UgLabel, __assign({}, props)); };
-var templateObject_1$k;
+var templateObject_1$m;
 
-var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObject_1$j || (templateObject_1$j = __makeTemplateObject([""], [""])));
+var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObject_1$l || (templateObject_1$l = __makeTemplateObject([""], [""])));
 /**
  * A Progress loader communicates progress when downloading or uploading content.
  * <hr>
@@ -555,9 +555,9 @@ var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObjec
     - When loading page content, use a Skeleton loader instead
  */
 var Progress = function (props) { return jsxRuntime.jsx(UgProgress, __assign({}, props)); };
-var templateObject_1$j;
+var templateObject_1$l;
 
-var UgSkeleton = styled__default["default"](reactLoaders.Skeleton)(templateObject_1$i || (templateObject_1$i = __makeTemplateObject([""], [""])));
+var UgSkeleton = styled__default["default"](reactLoaders.Skeleton)(templateObject_1$k || (templateObject_1$k = __makeTemplateObject([""], [""])));
 /**
  * A Skeleton loader shows users a blank version of a page or section of a page into which content is gradually loaded. It provides a visual estimate of the space needed.
  * <hr>
@@ -572,9 +572,9 @@ var UgSkeleton = styled__default["default"](reactLoaders.Skeleton)(templateObjec
    - To communicate a typing status, use Inline instead
  */
 var Skeleton = function (props) { return jsxRuntime.jsx(UgSkeleton, __assign({}, props)); };
-var templateObject_1$i;
+var templateObject_1$k;
 
-var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_1$h || (templateObject_1$h = __makeTemplateObject([""], [""])));
+var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_1$j || (templateObject_1$j = __makeTemplateObject([""], [""])));
 /**
  * Breadcrumbs mark and communicate a user’s location in the product.
  * <hr>
@@ -583,7 +583,7 @@ var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_
     - To provide a quick way to navigate to ancestor pages
  */
 var Spinner = function (props) { return jsxRuntime.jsx(UgSpinner, __assign({}, props)); };
-var templateObject_1$h;
+var templateObject_1$j;
 
 /**
  * Title is a basic component used to display a title. Often used in card headers.
@@ -637,7 +637,7 @@ var Logo = function (props) {
         }[props.type] })));
 };
 
-var ugModalBody = styled__default["default"](reactModals.Body)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
+var ugModalBody = styled__default["default"](reactModals.Body)(templateObject_1$i || (templateObject_1$i = __makeTemplateObject(["\n  color: ", ";\n"], ["\n  color: ", ";\n"])), function (_a) {
     var theme = _a.theme;
     return theme.palette.grey["800"];
 });
@@ -646,21 +646,26 @@ var FooterItem = reactModals.FooterItem;
 Modal.Header = reactModals.Header;
 Modal.Body = ugModalBody;
 Modal.Footer = reactModals.Footer;
-var templateObject_1$g;
+var templateObject_1$i;
 
+var UgBody = styled__default["default"](reactChrome.Body)(templateObject_1$h || (templateObject_1$h = __makeTemplateObject(["\n  background-color: ", ";\n"], ["\n  background-color: ", ";\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.palette.white;
+});
 /**
  * A Body defines the main content of an HTML document which displays on the browser
  */
-var Body$1 = function (props) { return jsxRuntime.jsx(reactChrome.Body, __assign({}, props)); };
+var Body$1 = function (props) { return jsxRuntime.jsx(UgBody, __assign({}, props)); };
+var templateObject_1$h;
 
 /**
  * A Content defines the main content of an HTML document which displays on the browser
  */
 var Content = function (props) { return jsxRuntime.jsx(reactChrome.Content, __assign({}, props)); };
 
-var UgHeaderItem = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n  ", ";\n"], ["\n  ", ";\n"])), function (props) { return props.hasLogo && "border-right: none"; });
+var UgHeaderItem = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$g || (templateObject_1$g = __makeTemplateObject(["\n  ", ";\n"], ["\n  ", ";\n"])), function (props) { return props.hasLogo && "border-right: none"; });
 var HeaderItem = function (props) { return jsxRuntime.jsx(UgHeaderItem, __assign({}, props)); };
-var templateObject_1$f;
+var templateObject_1$g;
 
 var HeaderItemText = function (props) { return jsxRuntime.jsx(reactChrome.HeaderItemText, __assign({}, props)); };
 
@@ -685,7 +690,7 @@ var SvgMenuStroke = function SvgMenuStroke(props) {
   })));
 };
 
-var LogoIconContainer = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n  margin-right: 2px;\n  border-right: none;\n  @media (max-width: ", ") {\n    right: 0;\n    left: 0;\n    margin-right: auto;\n    margin-left: auto;\n    position: absolute;\n  }\n"], ["\n  margin-right: 2px;\n  border-right: none;\n  @media (max-width: ", ") {\n    right: 0;\n    left: 0;\n    margin-right: auto;\n    margin-left: auto;\n    position: absolute;\n  }\n"])), function (_a) {
+var LogoIconContainer = styled__default["default"](reactChrome.HeaderItem)(templateObject_1$f || (templateObject_1$f = __makeTemplateObject(["\n  margin-right: 2px;\n  border-right: none;\n  @media (max-width: ", ") {\n    right: 0;\n    left: 0;\n    margin-right: auto;\n    margin-left: auto;\n    position: absolute;\n  }\n"], ["\n  margin-right: 2px;\n  border-right: none;\n  @media (max-width: ", ") {\n    right: 0;\n    left: 0;\n    margin-right: auto;\n    margin-left: auto;\n    position: absolute;\n  }\n"])), function (_a) {
     var theme = _a.theme;
     return theme.breakpoints.sm;
 });
@@ -706,9 +711,9 @@ var MenuItem = styled__default["default"](reactChrome.HeaderItem)(templateObject
 var BrandItem = function (props) {
     return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs(MenuItem, __assign({}, props, { onClick: props.toggleMenu }, { children: [jsxRuntime.jsx(HeaderItemIcon, { children: jsxRuntime.jsx(SvgMenuStroke, {}) }), props.menuLabel && jsxRuntime.jsx(HeaderItemText, { children: props.menuLabel })] })), jsxRuntime.jsx(LogoIconContainer, __assign({}, props, { hasLogo: true }, { children: jsxRuntime.jsx(HeaderItemIcon, { children: jsxRuntime.jsx(Logo, { type: "icon", size: 150 }) }) })), props.brandName && (jsxRuntime.jsx(BrandName, __assign({}, props, { children: jsxRuntime.jsx(HeaderItemText, { children: props.brandName }) })))] }));
 };
-var templateObject_1$e, templateObject_2$3, templateObject_3;
+var templateObject_1$f, templateObject_2$3, templateObject_3;
 
-var UgHeader = styled__default["default"](reactChrome.Header)(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n    height: ", ";\n"], ["\n    height: ", ";\n"])), theme.components.Headers.height);
+var UgHeader = styled__default["default"](reactChrome.Header)(templateObject_1$e || (templateObject_1$e = __makeTemplateObject(["\n    height: ", ";\n"], ["\n    height: ", ";\n"])), theme.components.Headers.height);
 /**
  * An Header is a visual way to display general information.
  * This can include navList Items, modal, profile settings.
@@ -717,7 +722,7 @@ var Header = function (props) { return jsxRuntime.jsx(UgHeader, __assign({}, pro
 Header.HeaderItem = HeaderItem;
 Header.HeaderItemText = HeaderItemText;
 Header.HeaderItemIcon = HeaderItemIcon;
-var templateObject_1$d;
+var templateObject_1$e;
 
 var _path$5, _path2;
 
@@ -757,7 +762,7 @@ var SvgChevronDownStroke = function SvgChevronDownStroke(props) {
   })));
 };
 
-var ChevronButton = styled__default["default"](IconButton)(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n  @media (max-width: ", ") {\n    display: none;\n  }\n"], ["\n  @media (max-width: ", ") {\n    display: none;\n  }\n"])), function (_a) {
+var ChevronButton = styled__default["default"](IconButton)(templateObject_1$d || (templateObject_1$d = __makeTemplateObject(["\n  @media (max-width: ", ") {\n    display: none;\n  }\n"], ["\n  @media (max-width: ", ") {\n    display: none;\n  }\n"])), function (_a) {
     var theme = _a.theme;
     return theme.breakpoints.sm;
 });
@@ -769,12 +774,20 @@ var AppHeader = function (_a) {
     var brand = _a.brand, avatar = _a.avatar, args = __rest(_a, ["brand", "avatar"]);
     return (jsxRuntime.jsxs(Header, __assign({}, args, { children: [jsxRuntime.jsx(BrandItem, __assign({}, brand, { toggleMenu: args.onSidebarMenuToggle })), args.hasChangelog && (jsxRuntime.jsx(HeaderItem, __assign({ onClick: args.onChangelogClick, style: { marginRight: "-" + theme.space.sm } }, { children: jsxRuntime.jsx(HeaderItemIcon, { children: jsxRuntime.jsx(SvgMegaphoneStroke, {}) }) }))), jsxRuntime.jsx(HeaderItem, __assign({ isRound: true, onClick: avatar === null || avatar === void 0 ? void 0 : avatar.onProfileModalToggle }, { children: jsxRuntime.jsx(HeaderItemIcon, { children: jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx(Avatar, __assign({}, avatar)), jsxRuntime.jsx(ChevronButton, __assign({ size: "small" }, { children: jsxRuntime.jsx(SvgChevronDownStroke, {}) }))] }) }) }))] })));
 };
-var templateObject_1$c;
+var templateObject_1$d;
 
+var UgMain = styled__default["default"](reactChrome.Main)(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n  @media (min-width: ", ") {\n    margin: ", "\n  }\n"], ["\n  @media (min-width: ", ") {\n    margin: ", "\n  }\n"])), function (_a) {
+    var theme = _a.theme;
+    return theme.breakpoints.sm;
+}, function (_a) {
+    var theme = _a.theme;
+    return theme.space.xxl;
+});
 /**
  * A Main defines the main content of an HTML document which displays on the browser
  */
-var Main = function (props) { return jsxRuntime.jsx(reactChrome.Main, __assign({}, props)); };
+var Main = function (props) { return jsxRuntime.jsx(UgMain, __assign({}, props)); };
+var templateObject_1$c;
 
 var UgNav = styled__default["default"](reactChrome.Nav)(templateObject_1$b || (templateObject_1$b = __makeTemplateObject(["\n  border-right: ", ";\n  border-color: ", ";\n  ", "\n  transition: width 0.25s ease-in-out;\n  padding-top: ", ";\n  padding-left: ", ";\n"], ["\n  border-right: ", ";\n  border-color: ", ";\n  ", "\n  transition: width 0.25s ease-in-out;\n  padding-top: ", ";\n  padding-left: ", ";\n"])), function (_a) {
     var theme = _a.theme;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@appquality/unguess-design-system",
-  "version": "2.5.4",
+  "version": "2.5.7",
   "dependencies": {
     "@zendeskgarden/react-accordions": "^8.49.0",
     "@zendeskgarden/react-avatars": "^8.49.0",