@appquality/unguess-design-system 2.5.6 → 2.5.7

package/CHANGELOG.md

@@ -1,3 +1,9 @@
+# v2.5.7 (Mon Mar 28 2022)
+
+
+
+---
+
 # v2.5.6 (Mon Mar 28 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$y || (templateObject_1$y = __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$y;
+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$x || (templateObject_1$x = __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$x;
+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$w || (templateObject_1$w = __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$w;
+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$v || (templateObject_1$v = __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$v;
+var templateObject_1$w;
 
 var index$1 = /*#__PURE__*/Object.freeze({
     __proto__: null,
     Field: Field$1
 });
 
-var UgItem = styled__default["default"](reactDropdowns.Item)(templateObject_1$u || (templateObject_1$u = __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$u;
+var templateObject_1$v;
 
-var UgMenu = styled__default["default"](reactDropdowns.Menu)(templateObject_1$t || (templateObject_1$t = __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$t;
+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$s || (templateObject_1$s = __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$s;
+var templateObject_1$t;
 
-var UgField = styled__default["default"](reactForms.Field)(templateObject_1$r || (templateObject_1$r = __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$r;
+var templateObject_1$s;
 
 var index = /*#__PURE__*/Object.freeze({
     __proto__: null,
     Field: Field
 });
 
-var UgInput = styled__default["default"](reactForms.Input)(templateObject_1$q || (templateObject_1$q = __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$q ||
    *  - To enter multiline text, use a Textarea
    **/
 var Input = function (props) { return jsxRuntime.jsx(UgInput, __assign({}, props)); };
-var templateObject_1$q;
+var templateObject_1$r;
 
-var UgRadio = styled__default["default"](reactForms.Radio)(templateObject_1$p || (templateObject_1$p = __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$p ||
    *  - To select from a long list of options, use Select instead
    **/
 var Radio = function (props) { return jsxRuntime.jsx(UgRadio, __assign({}, props)); };
-var templateObject_1$p;
+var templateObject_1$q;
 
-var UgTextarea = styled__default["default"](reactForms.Textarea)(templateObject_1$o || (templateObject_1$o = __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$o;
+var templateObject_1$p;
 
-var UgToggle = styled__default["default"](reactForms.Toggle)(templateObject_1$n || (templateObject_1$n = __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$n
    *  - 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$n;
+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$m || (templateObject_1$m = __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$m;
+var templateObject_1$n;
 
-var UgLabel = styled__default["default"](reactForms.Label)(templateObject_1$l || (templateObject_1$l = __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$l;
+var templateObject_1$m;
 
-var UgProgress = styled__default["default"](reactLoaders.Progress)(templateObject_1$k || (templateObject_1$k = __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$k;
+var templateObject_1$l;
 
-var UgSkeleton = styled__default["default"](reactLoaders.Skeleton)(templateObject_1$j || (templateObject_1$j = __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$j;
+var templateObject_1$k;
 
-var UgSpinner = styled__default["default"](reactLoaders.Spinner)(templateObject_1$i || (templateObject_1$i = __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$i;
+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$h || (templateObject_1$h = __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,12 +646,17 @@ var FooterItem = reactModals.FooterItem;
 Modal.Header = reactModals.Header;
 Modal.Body = ugModalBody;
 Modal.Footer = reactModals.Footer;
-var templateObject_1$h;
+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
@@ -771,7 +776,7 @@ var AppHeader = function (_a) {
 };
 var templateObject_1$d;
 
-var UgMain = styled__default["default"](reactChrome.Main)(templateObject_1$c || (templateObject_1$c = __makeTemplateObject(["\n  @media (max-width: ", ") {\n    margin: 0 ", "\n  }\n"], ["\n  @media (max-width: ", ") {\n    margin: 0 ", "\n  }\n"])), function (_a) {
+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) {

package/package.json

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