@vtex/admin-core - npm Package Compare versions

Comparing version 0.6.1 to 0.7.0

CHANGELOG.md

@@ -6,2 +6,13 @@ # Change Log
 
+# [0.7.0](https://github.com/vtex/onda/compare/@vtex/admin-core@0.6.1...@vtex/admin-core@0.7.0) (2021-02-25)
+
+
+### Features
+
+* **theme:** move global styles from core to theme ([416c04b](https://github.com/vtex/onda/commit/416c04bd46e98cb65e428ac017577ac2ec6702ae))
+
+
+
+
+
 ## [0.6.1](https://github.com/vtex/onda/compare/@vtex/admin-core@0.6.0...@vtex/admin-core@0.6.1) (2021-02-12)
@@ -8,0 +19,0 @@

dist/admin-core.cjs.development.js

@@ -67,4 +67,6 @@ 'use strict';
 
+var _theme$global$imports, _theme$global, _theme$global$imports2;
+
 function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n      @import 'https://io.vtex.com.br/fonts/vtex-trust/style.css';\n      body {\n        margin: 0;\n        background-color: ", ";\n        color: ", ";\n      }\n      html,\n      body {\n        font-family: ", " !important;\n        font-variation-settings: ", ";\n      }\n      strong,\n      b {\n        font-family: ", " !important;\n        font-variation-settings: ", ";\n      }\n      pre,\n      code {\n        font-family: ", " !important;\n      }\n      * {\n        font-family: ", " !important;\n        font-variation-settings: ", ";\n      }\n      *,\n      ::before,\n      ::after {\n        box-sizing: border-box;\n        border-width: 0;\n        border-style: solid;\n      }\n      html,\n      body,\n      div,\n      span,\n      applet,\n      object,\n      iframe,\n      h1,\n      h2,\n      h3,\n      h4,\n      h5,\n      h6,\n      p,\n      blockquote,\n      a,\n      abbr,\n      acronym,\n      address,\n      big,\n      cite,\n      del,\n      dfn,\n      em,\n      img,\n      ins,\n      q,\n      s,\n      samp,\n      small,\n      strike,\n      strong,\n      sub,\n      sup,\n      tt,\n      var,\n      b,\n      u,\n      i,\n      center,\n      dl,\n      dt,\n      dd,\n      ol,\n      ul,\n      li,\n      fieldset,\n      form,\n      label,\n      legend,\n      table,\n      caption,\n      tbody,\n      tfoot,\n      thead,\n      tr,\n      th,\n      td,\n      article,\n      aside,\n      canvas,\n      details,\n      embed,\n      figure,\n      figcaption,\n      footer,\n      header,\n      hgroup,\n      menu,\n      nav,\n      output,\n      ruby,\n      section,\n      summary,\n      time,\n      mark,\n      audio,\n      video {\n        margin: 0;\n        padding: 0;\n        border: 0;\n        font-size: 100%;\n        font: inherit;\n        vertical-align: baseline;\n      }\n      /* HTML5 display-role reset for older browsers */\n      article,\n      aside,\n      details,\n      figcaption,\n      figure,\n      footer,\n      header,\n      hgroup,\n      menu,\n      nav,\n      section {\n        display: block;\n      }\n      body {\n        line-height: 1;\n      }\n      blockquote,\n      q {\n        quotes: none;\n      }\n      blockquote:before,\n      blockquote:after,\n      q:before,\n      q:after {\n        content: '';\n        content: none;\n      }\n      table {\n        border-collapse: collapse;\n        border-spacing: 0;\n      }\n    "]);
+  var data = _taggedTemplateLiteralLoose(["\n      ", "\n    "]);
 
@@ -77,8 +79,18 @@ _templateObject = function _templateObject() {
 }
-function GlobalStyles() {
+var imports = (_theme$global$imports = (_theme$global = adminUiTheme.theme.global) === null || _theme$global === void 0 ? void 0 : (_theme$global$imports2 = _theme$global.imports) === null || _theme$global$imports2 === void 0 ? void 0 : /*#__PURE__*/_theme$global$imports2.reduce(function (acc, link) {
+  return acc + " @import '" + link + "';";
+}, '')) !== null && _theme$global$imports !== void 0 ? _theme$global$imports : '';
+function Imports() {
   return adminUiSystem.jsxs(react$1.Global, {
-    styles: react$1.css(_templateObject(), adminUiSystem.get(adminUiTheme.theme, 'colors.light.primary'), adminUiSystem.get(adminUiTheme.theme, 'colors.dark.primary'), adminUiSystem.get(adminUiTheme.theme, 'fonts.sans'), adminUiSystem.get(adminUiTheme.theme, 'fontSettings.regular'), adminUiSystem.get(adminUiTheme.theme, 'fonts.sans'), adminUiSystem.get(adminUiTheme.theme, 'fontSettings.bold'), adminUiSystem.get(adminUiTheme.theme, 'fonts.mono'), adminUiSystem.get(adminUiTheme.theme, 'fonts.sans'), adminUiSystem.get(adminUiTheme.theme, 'fontSettings.regular'))
+    styles: react$1.css(_templateObject(), imports)
   });
 }
+function Styles() {
+  var _theme$global2;
 
+  return adminUiSystem.jsxs(react$1.Global, {
+    styles: adminUiSystem.styles(adminUiTheme.theme === null || adminUiTheme.theme === void 0 ? void 0 : (_theme$global2 = adminUiTheme.theme.global) === null || _theme$global2 === void 0 ? void 0 : _theme$global2.styles)(adminUiTheme.theme)
+  });
+}
+
 var SystemContext = /*#__PURE__*/react.createContext(null);
@@ -93,3 +105,3 @@ function ThemeProvider(props) {
     value: system
-  }].concat([adminUiSystem.jsxs(GlobalStyles, {}), adminUiSystem.jsxs(system.ThemeProvider, {}, children)])));
+  }].concat([adminUiSystem.jsxs(Imports, {}), adminUiSystem.jsxs(Styles, {}), adminUiSystem.jsxs(system.ThemeProvider, {}, children)])));
 }
@@ -272,2 +284,8 @@ function useSystem() {
 });
+Object.defineProperty(exports, 'styles', {
+  enumerable: true,
+  get: function () {
+    return adminUiSystem.styles;
+  }
+});
 Object.defineProperty(exports, 'tint', {
@@ -274,0 +292,0 @@ enumerable: true,

dist/admin-core.cjs.production.min.js

@@ -1,2 +0,2 @@
-"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,n=require("react"),t=require("@vtex/admin-ui-system"),r=(e=require("tiny-invariant"))&&"object"==typeof e&&"default"in e?e.default:e;require("focus-visible/dist/focus-visible");var o=require("@vtex/admin-ui-theme"),i=require("@emotion/react");function s(){return(s=Object.assign||function(e){for(var n=1;n<arguments.length;n++){var t=arguments[n];for(var r in t)Object.prototype.hasOwnProperty.call(t,r)&&(e[r]=t[r])}return e}).apply(this,arguments)}function a(e,n){void 0===n&&(n={overrides:{}});var r=n.components,i=t.merge(o.theme,n.overrides),a=r?Object.assign(i,{components:s({},r,o.theme.components)}):i;return t.createSystem(a,"vtex-"+e)}var u=a("admin-ui");function c(){var e,n,t=(e=["\n      @import 'https://io.vtex.com.br/fonts/vtex-trust/style.css';\n      body {\n        margin: 0;\n        background-color: ",";\n        color: ",";\n      }\n      html,\n      body {\n        font-family: "," !important;\n        font-variation-settings: ",";\n      }\n      strong,\n      b {\n        font-family: "," !important;\n        font-variation-settings: ",";\n      }\n      pre,\n      code {\n        font-family: "," !important;\n      }\n      * {\n        font-family: "," !important;\n        font-variation-settings: ",";\n      }\n      *,\n      ::before,\n      ::after {\n        box-sizing: border-box;\n        border-width: 0;\n        border-style: solid;\n      }\n      html,\n      body,\n      div,\n      span,\n      applet,\n      object,\n      iframe,\n      h1,\n      h2,\n      h3,\n      h4,\n      h5,\n      h6,\n      p,\n      blockquote,\n      a,\n      abbr,\n      acronym,\n      address,\n      big,\n      cite,\n      del,\n      dfn,\n      em,\n      img,\n      ins,\n      q,\n      s,\n      samp,\n      small,\n      strike,\n      strong,\n      sub,\n      sup,\n      tt,\n      var,\n      b,\n      u,\n      i,\n      center,\n      dl,\n      dt,\n      dd,\n      ol,\n      ul,\n      li,\n      fieldset,\n      form,\n      label,\n      legend,\n      table,\n      caption,\n      tbody,\n      tfoot,\n      thead,\n      tr,\n      th,\n      td,\n      article,\n      aside,\n      canvas,\n      details,\n      embed,\n      figure,\n      figcaption,\n      footer,\n      header,\n      hgroup,\n      menu,\n      nav,\n      output,\n      ruby,\n      section,\n      summary,\n      time,\n      mark,\n      audio,\n      video {\n        margin: 0;\n        padding: 0;\n        border: 0;\n        font-size: 100%;\n        font: inherit;\n        vertical-align: baseline;\n      }\n      /* HTML5 display-role reset for older browsers */\n      article,\n      aside,\n      details,\n      figcaption,\n      figure,\n      footer,\n      header,\n      hgroup,\n      menu,\n      nav,\n      section {\n        display: block;\n      }\n      body {\n        line-height: 1;\n      }\n      blockquote,\n      q {\n        quotes: none;\n      }\n      blockquote:before,\n      blockquote:after,\n      q:before,\n      q:after {\n        content: '';\n        content: none;\n      }\n      table {\n        border-collapse: collapse;\n        border-spacing: 0;\n      }\n    "],n||(n=e.slice(0)),e.raw=n,e);return c=function(){return t},t}function f(){return t.jsxs(i.Global,{styles:i.css(c(),t.get(o.theme,"colors.light.primary"),t.get(o.theme,"colors.dark.primary"),t.get(o.theme,"fonts.sans"),t.get(o.theme,"fontSettings.regular"),t.get(o.theme,"fonts.sans"),t.get(o.theme,"fontSettings.bold"),t.get(o.theme,"fonts.mono"),t.get(o.theme,"fonts.sans"),t.get(o.theme,"fontSettings.regular"))})}var l=n.createContext(null);Object.defineProperty(exports,"Global",{enumerable:!0,get:function(){return t.Global}}),Object.defineProperty(exports,"alpha",{enumerable:!0,get:function(){return t.alpha}}),Object.defineProperty(exports,"complement",{enumerable:!0,get:function(){return t.complement}}),Object.defineProperty(exports,"createComponent",{enumerable:!0,get:function(){return t.createComponent}}),Object.defineProperty(exports,"css",{enumerable:!0,get:function(){return t.css}}),Object.defineProperty(exports,"darken",{enumerable:!0,get:function(){return t.darken}}),Object.defineProperty(exports,"desaturate",{enumerable:!0,get:function(){return t.desaturate}}),Object.defineProperty(exports,"forwardRef",{enumerable:!0,get:function(){return t.forwardRef}}),Object.defineProperty(exports,"get",{enumerable:!0,get:function(){return t.get}}),Object.defineProperty(exports,"getColor",{enumerable:!0,get:function(){return t.getColor}}),Object.defineProperty(exports,"grayscale",{enumerable:!0,get:function(){return t.grayscale}}),Object.defineProperty(exports,"hue",{enumerable:!0,get:function(){return t.hue}}),Object.defineProperty(exports,"inlineVariant",{enumerable:!0,get:function(){return t.inlineVariant}}),Object.defineProperty(exports,"invert",{enumerable:!0,get:function(){return t.invert}}),Object.defineProperty(exports,"isFunction",{enumerable:!0,get:function(){return t.isFunction}}),Object.defineProperty(exports,"isObjectEmpty",{enumerable:!0,get:function(){return t.isObjectEmpty}}),Object.defineProperty(exports,"jsxs",{enumerable:!0,get:function(){return t.jsxs}}),Object.defineProperty(exports,"lighten",{enumerable:!0,get:function(){return t.lighten}}),Object.defineProperty(exports,"lightness",{enumerable:!0,get:function(){return t.lightness}}),Object.defineProperty(exports,"merge",{enumerable:!0,get:function(){return t.merge}}),Object.defineProperty(exports,"mix",{enumerable:!0,get:function(){return t.mix}}),Object.defineProperty(exports,"omit",{enumerable:!0,get:function(){return t.omit}}),Object.defineProperty(exports,"pick",{enumerable:!0,get:function(){return t.pick}}),Object.defineProperty(exports,"rotate",{enumerable:!0,get:function(){return t.rotate}}),Object.defineProperty(exports,"saturate",{enumerable:!0,get:function(){return t.saturate}}),Object.defineProperty(exports,"saturation",{enumerable:!0,get:function(){return t.saturation}}),Object.defineProperty(exports,"shade",{enumerable:!0,get:function(){return t.shade}}),Object.defineProperty(exports,"tint",{enumerable:!0,get:function(){return t.tint}}),Object.defineProperty(exports,"transparentize",{enumerable:!0,get:function(){return t.transparentize}}),Object.defineProperty(exports,"useResponsiveValue",{enumerable:!0,get:function(){return t.useResponsiveValue}}),Object.defineProperty(exports,"useTheme",{enumerable:!0,get:function(){return t.useTheme}}),Object.defineProperty(exports,"theme",{enumerable:!0,get:function(){return o.theme}}),exports.ThemeProvider=function(e){var n=e.children,r=e.system,o=void 0===r?u:r;return t.jsxs(t.CacheProvider,{value:o.emotionInstance.cache},t.jsxs.apply(void 0,[l.Provider,{value:o}].concat([t.jsxs(f,{}),t.jsxs(o.ThemeProvider,{},n)])))},exports.createSystem=a,exports.defaultSystem=u,exports.useSystem=function(){var e=n.useContext(l);e||r(!1);var t=e.emotionInstance;return{cn:e.cn,stylesOf:e.stylesOf,keyframes:t.keyframes,cx:t.cx}};
+"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e,t=require("react"),r=require("@vtex/admin-ui-system"),n=(e=require("tiny-invariant"))&&"object"==typeof e&&"default"in e?e.default:e;require("focus-visible/dist/focus-visible");var o=require("@vtex/admin-ui-theme"),u=require("@emotion/react");function i(){return(i=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}function s(e,t){void 0===t&&(t={overrides:{}});var n=t.components,u=r.merge(o.theme,t.overrides),s=n?Object.assign(u,{components:i({},n,o.theme.components)}):u;return r.createSystem(s,"vtex-"+e)}var a,c,p,l=s("admin-ui");function f(){var e,t,r=(e=["\n      ","\n    "],t||(t=e.slice(0)),e.raw=t,e);return f=function(){return r},r}var b=null!==(a=null===(c=o.theme.global)||void 0===c||null===(p=c.imports)||void 0===p?void 0:p.reduce((function(e,t){return e+" @import '"+t+"';"}),""))&&void 0!==a?a:"";function m(){return r.jsxs(u.Global,{styles:u.css(f(),b)})}function d(){var e;return r.jsxs(u.Global,{styles:r.styles(null==o.theme||null===(e=o.theme.global)||void 0===e?void 0:e.styles)(o.theme)})}var y=t.createContext(null);Object.defineProperty(exports,"Global",{enumerable:!0,get:function(){return r.Global}}),Object.defineProperty(exports,"alpha",{enumerable:!0,get:function(){return r.alpha}}),Object.defineProperty(exports,"complement",{enumerable:!0,get:function(){return r.complement}}),Object.defineProperty(exports,"createComponent",{enumerable:!0,get:function(){return r.createComponent}}),Object.defineProperty(exports,"css",{enumerable:!0,get:function(){return r.css}}),Object.defineProperty(exports,"darken",{enumerable:!0,get:function(){return r.darken}}),Object.defineProperty(exports,"desaturate",{enumerable:!0,get:function(){return r.desaturate}}),Object.defineProperty(exports,"forwardRef",{enumerable:!0,get:function(){return r.forwardRef}}),Object.defineProperty(exports,"get",{enumerable:!0,get:function(){return r.get}}),Object.defineProperty(exports,"getColor",{enumerable:!0,get:function(){return r.getColor}}),Object.defineProperty(exports,"grayscale",{enumerable:!0,get:function(){return r.grayscale}}),Object.defineProperty(exports,"hue",{enumerable:!0,get:function(){return r.hue}}),Object.defineProperty(exports,"inlineVariant",{enumerable:!0,get:function(){return r.inlineVariant}}),Object.defineProperty(exports,"invert",{enumerable:!0,get:function(){return r.invert}}),Object.defineProperty(exports,"isFunction",{enumerable:!0,get:function(){return r.isFunction}}),Object.defineProperty(exports,"isObjectEmpty",{enumerable:!0,get:function(){return r.isObjectEmpty}}),Object.defineProperty(exports,"jsxs",{enumerable:!0,get:function(){return r.jsxs}}),Object.defineProperty(exports,"lighten",{enumerable:!0,get:function(){return r.lighten}}),Object.defineProperty(exports,"lightness",{enumerable:!0,get:function(){return r.lightness}}),Object.defineProperty(exports,"merge",{enumerable:!0,get:function(){return r.merge}}),Object.defineProperty(exports,"mix",{enumerable:!0,get:function(){return r.mix}}),Object.defineProperty(exports,"omit",{enumerable:!0,get:function(){return r.omit}}),Object.defineProperty(exports,"pick",{enumerable:!0,get:function(){return r.pick}}),Object.defineProperty(exports,"rotate",{enumerable:!0,get:function(){return r.rotate}}),Object.defineProperty(exports,"saturate",{enumerable:!0,get:function(){return r.saturate}}),Object.defineProperty(exports,"saturation",{enumerable:!0,get:function(){return r.saturation}}),Object.defineProperty(exports,"shade",{enumerable:!0,get:function(){return r.shade}}),Object.defineProperty(exports,"styles",{enumerable:!0,get:function(){return r.styles}}),Object.defineProperty(exports,"tint",{enumerable:!0,get:function(){return r.tint}}),Object.defineProperty(exports,"transparentize",{enumerable:!0,get:function(){return r.transparentize}}),Object.defineProperty(exports,"useResponsiveValue",{enumerable:!0,get:function(){return r.useResponsiveValue}}),Object.defineProperty(exports,"useTheme",{enumerable:!0,get:function(){return r.useTheme}}),Object.defineProperty(exports,"theme",{enumerable:!0,get:function(){return o.theme}}),exports.ThemeProvider=function(e){var t=e.children,n=e.system,o=void 0===n?l:n;return r.jsxs(r.CacheProvider,{value:o.emotionInstance.cache},r.jsxs.apply(void 0,[y.Provider,{value:o}].concat([r.jsxs(m,{}),r.jsxs(d,{}),r.jsxs(o.ThemeProvider,{},t)])))},exports.createSystem=s,exports.defaultSystem=l,exports.useSystem=function(){var e=t.useContext(y);e||n(!1);var r=e.emotionInstance;return{cn:e.cn,stylesOf:e.stylesOf,keyframes:r.keyframes,cx:r.cx}};
 //# sourceMappingURL=admin-core.cjs.production.min.js.map

dist/admin-core.esm.js

 import { useContext, createContext } from 'react';
-import { merge, createSystem as createSystem$1, jsxs, get, CacheProvider } from '@vtex/admin-ui-system';
-export { Global, alpha, complement, createComponent, css, darken, desaturate, forwardRef, get, getColor, grayscale, hue, inlineVariant, invert, isFunction, isObjectEmpty, jsxs, lighten, lightness, merge, mix, omit, pick, rotate, saturate, saturation, shade, tint, transparentize, useResponsiveValue, useTheme } from '@vtex/admin-ui-system';
+import { merge, createSystem as createSystem$1, jsxs, styles, CacheProvider } from '@vtex/admin-ui-system';
+export { Global, alpha, complement, createComponent, css, darken, desaturate, forwardRef, get, getColor, grayscale, hue, inlineVariant, invert, isFunction, isObjectEmpty, jsxs, lighten, lightness, merge, mix, omit, pick, rotate, saturate, saturation, shade, styles, tint, transparentize, useResponsiveValue, useTheme } from '@vtex/admin-ui-system';
 import invariant from 'tiny-invariant';
@@ -63,4 +63,6 @@ import 'focus-visible/dist/focus-visible';
 
+var _theme$global$imports, _theme$global, _theme$global$imports2;
+
 function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n      @import 'https://io.vtex.com.br/fonts/vtex-trust/style.css';\n      body {\n        margin: 0;\n        background-color: ", ";\n        color: ", ";\n      }\n      html,\n      body {\n        font-family: ", " !important;\n        font-variation-settings: ", ";\n      }\n      strong,\n      b {\n        font-family: ", " !important;\n        font-variation-settings: ", ";\n      }\n      pre,\n      code {\n        font-family: ", " !important;\n      }\n      * {\n        font-family: ", " !important;\n        font-variation-settings: ", ";\n      }\n      *,\n      ::before,\n      ::after {\n        box-sizing: border-box;\n        border-width: 0;\n        border-style: solid;\n      }\n      html,\n      body,\n      div,\n      span,\n      applet,\n      object,\n      iframe,\n      h1,\n      h2,\n      h3,\n      h4,\n      h5,\n      h6,\n      p,\n      blockquote,\n      a,\n      abbr,\n      acronym,\n      address,\n      big,\n      cite,\n      del,\n      dfn,\n      em,\n      img,\n      ins,\n      q,\n      s,\n      samp,\n      small,\n      strike,\n      strong,\n      sub,\n      sup,\n      tt,\n      var,\n      b,\n      u,\n      i,\n      center,\n      dl,\n      dt,\n      dd,\n      ol,\n      ul,\n      li,\n      fieldset,\n      form,\n      label,\n      legend,\n      table,\n      caption,\n      tbody,\n      tfoot,\n      thead,\n      tr,\n      th,\n      td,\n      article,\n      aside,\n      canvas,\n      details,\n      embed,\n      figure,\n      figcaption,\n      footer,\n      header,\n      hgroup,\n      menu,\n      nav,\n      output,\n      ruby,\n      section,\n      summary,\n      time,\n      mark,\n      audio,\n      video {\n        margin: 0;\n        padding: 0;\n        border: 0;\n        font-size: 100%;\n        font: inherit;\n        vertical-align: baseline;\n      }\n      /* HTML5 display-role reset for older browsers */\n      article,\n      aside,\n      details,\n      figcaption,\n      figure,\n      footer,\n      header,\n      hgroup,\n      menu,\n      nav,\n      section {\n        display: block;\n      }\n      body {\n        line-height: 1;\n      }\n      blockquote,\n      q {\n        quotes: none;\n      }\n      blockquote:before,\n      blockquote:after,\n      q:before,\n      q:after {\n        content: '';\n        content: none;\n      }\n      table {\n        border-collapse: collapse;\n        border-spacing: 0;\n      }\n    "]);
+  var data = _taggedTemplateLiteralLoose(["\n      ", "\n    "]);
 
@@ -73,8 +75,18 @@ _templateObject = function _templateObject() {
 }
-function GlobalStyles() {
+var imports = (_theme$global$imports = (_theme$global = theme.global) === null || _theme$global === void 0 ? void 0 : (_theme$global$imports2 = _theme$global.imports) === null || _theme$global$imports2 === void 0 ? void 0 : /*#__PURE__*/_theme$global$imports2.reduce(function (acc, link) {
+  return acc + " @import '" + link + "';";
+}, '')) !== null && _theme$global$imports !== void 0 ? _theme$global$imports : '';
+function Imports() {
   return jsxs(Global, {
-    styles: css(_templateObject(), get(theme, 'colors.light.primary'), get(theme, 'colors.dark.primary'), get(theme, 'fonts.sans'), get(theme, 'fontSettings.regular'), get(theme, 'fonts.sans'), get(theme, 'fontSettings.bold'), get(theme, 'fonts.mono'), get(theme, 'fonts.sans'), get(theme, 'fontSettings.regular'))
+    styles: css(_templateObject(), imports)
   });
 }
+function Styles() {
+  var _theme$global2;
 
+  return jsxs(Global, {
+    styles: styles(theme === null || theme === void 0 ? void 0 : (_theme$global2 = theme.global) === null || _theme$global2 === void 0 ? void 0 : _theme$global2.styles)(theme)
+  });
+}
+
 var SystemContext = /*#__PURE__*/createContext(null);
@@ -89,3 +101,3 @@ function ThemeProvider(props) {
     value: system
-  }].concat([jsxs(GlobalStyles, {}), jsxs(system.ThemeProvider, {}, children)])));
+  }].concat([jsxs(Imports, {}), jsxs(Styles, {}), jsxs(system.ThemeProvider, {}, children)])));
 }
@@ -92,0 +104,0 @@ function useSystem() {

dist/global.d.ts

 /// <reference types="react" />
-export declare function GlobalStyles(): import("react").ReactElement<{
+export declare function Imports(): import("react").ReactElement<{
     styles: import("@emotion/react").SerializedStyles;
 }, string | ((props: any) => import("react").ReactElement<any, string | any | (new (props: any) => import("react").Component<any, any, any>)> | null) | (new (props: any) => import("react").Component<any, any, any>)>;
+export declare function Styles(): import("react").ReactElement<{
+    styles: import("@emotion/react").CSSObject;
+}, string | ((props: any) => import("react").ReactElement<any, string | any | (new (props: any) => import("react").Component<any, any, any>)> | null) | (new (props: any) => import("react").Component<any, any, any>)>;

dist/system.d.ts

@@ -1,3 +0,2 @@
-import { Theme } from '@vtex/admin-ui-theme';
-import { StyleObject } from '@vtex/admin-ui-system';
+import { StyleObject, Theme } from '@vtex/admin-ui-system';
 interface ThemeOptions {
@@ -15,2 +14,2 @@ overrides?: Partial<Theme>;
 export declare const defaultSystem: import("@vtex/admin-ui-system").CreateSystemReturn;
-export { Global, css, jsxs, createComponent, isFunction, useTheme, useResponsiveValue, get, pick, omit, isObjectEmpty, merge, forwardRef, inlineVariant, StyleProp, StyleObject, ResponsiveValue, darken, lighten, grayscale, getColor, rotate, hue, saturation, lightness, saturate, desaturate, shade, tint, transparentize, alpha, mix, complement, invert, Colors, } from '@vtex/admin-ui-system';
+export { styles, Global, css, jsxs, createComponent, isFunction, useTheme, useResponsiveValue, get, pick, omit, isObjectEmpty, merge, forwardRef, inlineVariant, StyleProp, StyleObject, ResponsiveValue, darken, lighten, grayscale, getColor, rotate, hue, saturation, lightness, saturate, desaturate, shade, tint, transparentize, alpha, mix, complement, invert, Theme, Colors, } from '@vtex/admin-ui-system';

dist/theme.d.ts

@@ -1,1 +0,1 @@
-export { theme, Sizes, FontSizes, BorderRadius, BorderWidths, LineHeights, ZIndexes, Theme, Space, } from '@vtex/admin-ui-theme';
+export { theme, Sizes, FontSizes, BorderRadius, BorderWidths, LineHeights, ZIndexes, Space, } from '@vtex/admin-ui-theme';

package.json

 {
   "name": "@vtex/admin-core",
-  "version": "0.6.1",
+  "version": "0.7.0",
   "main": "dist/index.js",
@@ -38,4 +38,4 @@ "module": "dist/admin-core.esm.js",
   "dependencies": {
-    "@vtex/admin-ui-system": "^0.13.1",
-    "@vtex/admin-ui-theme": "^0.18.2",
+    "@vtex/admin-ui-system": "^0.14.0",
+    "@vtex/admin-ui-theme": "^0.19.0",
     "deepmerge": "^4.2.2",
@@ -46,3 +46,3 @@ "focus-visible": "^5.1.0",
   },
-  "gitHead": "e19e9009635a69e317580cae4583e36fb42d33ad"
+  "gitHead": "252316f75c393c193615af7567395c48122b8487"
 }

src/core.ts

@@ -8,3 +8,3 @@ import { createContext, ReactNode, useContext } from 'react'
 import { createSystem, jsxs, defaultSystem } from './system'
-import { GlobalStyles } from './global'
+import { Styles, Imports } from './global'
 
@@ -24,3 +24,7 @@ const SystemContext = createContext<ReturnType<typeof createSystem> | null>(
       { value: system },
-      ...[jsxs(GlobalStyles, {}), jsxs(system.ThemeProvider, {}, children)]
+      ...[
+        jsxs(Imports, {}),
+        jsxs(Styles, {}),
+        jsxs(system.ThemeProvider, {}, children),
+      ]
     )
@@ -27,0 +31,0 @@ )

src/global.ts

 import { theme } from '@vtex/admin-ui-theme'
 import { Global, css } from '@emotion/react'
-import { get, jsxs } from './system'
+import { jsxs, styles } from './system'
 
-export function GlobalStyles() {
+const imports =
+  theme.global?.imports?.reduce(
+    (acc, link) => `${acc} @import '${link}';`,
+    ''
+  ) ?? ''
+
+export function Imports() {
   return jsxs(Global, {
     styles: css`
-      @import 'https://io.vtex.com.br/fonts/vtex-trust/style.css';
-      body {
-        margin: 0;
-        background-color: ${get(theme, 'colors.light.primary')};
-        color: ${get(theme, 'colors.dark.primary')};
-      }
-      html,
-      body {
-        font-family: ${get(theme, 'fonts.sans')} !important;
-        font-variation-settings: ${get(theme, 'fontSettings.regular')};
-      }
-      strong,
-      b {
-        font-family: ${get(theme, 'fonts.sans')} !important;
-        font-variation-settings: ${get(theme, 'fontSettings.bold')};
-      }
-      pre,
-      code {
-        font-family: ${get(theme, 'fonts.mono')} !important;
-      }
-      * {
-        font-family: ${get(theme, 'fonts.sans')} !important;
-        font-variation-settings: ${get(theme, 'fontSettings.regular')};
-      }
-      *,
-      ::before,
-      ::after {
-        box-sizing: border-box;
-        border-width: 0;
-        border-style: solid;
-      }
-      html,
-      body,
-      div,
-      span,
-      applet,
-      object,
-      iframe,
-      h1,
-      h2,
-      h3,
-      h4,
-      h5,
-      h6,
-      p,
-      blockquote,
-      a,
-      abbr,
-      acronym,
-      address,
-      big,
-      cite,
-      del,
-      dfn,
-      em,
-      img,
-      ins,
-      q,
-      s,
-      samp,
-      small,
-      strike,
-      strong,
-      sub,
-      sup,
-      tt,
-      var,
-      b,
-      u,
-      i,
-      center,
-      dl,
-      dt,
-      dd,
-      ol,
-      ul,
-      li,
-      fieldset,
-      form,
-      label,
-      legend,
-      table,
-      caption,
-      tbody,
-      tfoot,
-      thead,
-      tr,
-      th,
-      td,
-      article,
-      aside,
-      canvas,
-      details,
-      embed,
-      figure,
-      figcaption,
-      footer,
-      header,
-      hgroup,
-      menu,
-      nav,
-      output,
-      ruby,
-      section,
-      summary,
-      time,
-      mark,
-      audio,
-      video {
-        margin: 0;
-        padding: 0;
-        border: 0;
-        font-size: 100%;
-        font: inherit;
-        vertical-align: baseline;
-      }
-      /* HTML5 display-role reset for older browsers */
-      article,
-      aside,
-      details,
-      figcaption,
-      figure,
-      footer,
-      header,
-      hgroup,
-      menu,
-      nav,
-      section {
-        display: block;
-      }
-      body {
-        line-height: 1;
-      }
-      blockquote,
-      q {
-        quotes: none;
-      }
-      blockquote:before,
-      blockquote:after,
-      q:before,
-      q:after {
-        content: '';
-        content: none;
-      }
-      table {
-        border-collapse: collapse;
-        border-spacing: 0;
-      }
+      ${imports}
     `,
   })
 }
+
+export function Styles() {
+  return jsxs(Global, {
+    styles: styles(theme?.global?.styles)(theme),
+  })
+}

src/system.ts

@@ -1,2 +0,2 @@
-import { theme, Theme } from '@vtex/admin-ui-theme'
+import { theme } from '@vtex/admin-ui-theme'
 import {
@@ -6,2 +6,3 @@ createSystem as baseCreateSystem,
   StyleObject,
+  Theme
 } from '@vtex/admin-ui-system'
@@ -44,2 +45,3 @@
 export {
+  styles,
   Global,
@@ -79,3 +81,4 @@ css,
   invert,
+  Theme,
   Colors,
 } from '@vtex/admin-ui-system'

src/theme.ts

@@ -9,4 +9,3 @@ export {
   ZIndexes,
-  Theme,
   Space,
 } from '@vtex/admin-ui-theme'

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Number of low supply chain risk alerts

2

decreased by-60%

Worsened metrics

Total package byte prevSize

44361

decreased by-25.23%

Number of downloads

33

decreased by-74.02%

Lines of code

625

decreased by-16.11%

Dependency changes

• + Added@babel/code-frame@7.24.7(transitive)

• + Added@babel/generator@7.25.6(transitive)

• + Added@babel/helper-module-imports@7.24.7(transitive)

• + Added@babel/helper-string-parser@7.24.8(transitive)

• + Added@babel/helper-validator-identifier@7.24.7(transitive)

• + Added@babel/highlight@7.24.7(transitive)

• + Added@babel/parser@7.25.6(transitive)

• + Added@babel/runtime@7.25.6(transitive)

• + Added@babel/template@7.25.0(transitive)

• + Added@babel/traverse@7.25.6(transitive)

• + Added@babel/types@7.25.6(transitive)

• + Added@vtex/admin-styles@0.2.0(transitive)

• + Added@vtex/admin-ui-system@0.14.0(transitive)

• + Added@vtex/admin-ui-theme@0.19.3(transitive)

• + Addedjsesc@2.5.2(transitive)

• - Removed@babel/code-frame@7.25.7(transitive)

• - Removed@babel/generator@7.25.7(transitive)

• - Removed@babel/helper-module-imports@7.25.7(transitive)

• - Removed@babel/helper-string-parser@7.25.7(transitive)

• - Removed@babel/helper-validator-identifier@7.25.7(transitive)

• - Removed@babel/highlight@7.25.7(transitive)

• - Removed@babel/parser@7.25.7(transitive)

• - Removed@babel/runtime@7.25.7(transitive)

• - Removed@babel/template@7.25.7(transitive)

• - Removed@babel/traverse@7.25.7(transitive)

• - Removed@babel/types@7.25.7(transitive)

• - Removed@vtex/admin-ui-theme@0.18.2(transitive)

• - Removedjsesc@3.0.2(transitive)

• Updated@vtex/admin-ui-system@^0.14.0

• Updated@vtex/admin-ui-theme@^0.19.0