@aesthetic/system - npm Package Compare versions

Comparing version 0.1.0 to 0.1.1

esm/index.js

@@ -64,3 +64,3 @@ import { deepMerge, isObject, toArray, objectLoop, hyphenate } from '@aesthetic/utils';
 function box(vars, size) {
-  return _extends({
+  return Object.assign({
     backgroundColor: vars("palette-neutral-color-" + LAYOUT_SHADES.box)
@@ -149,3 +149,3 @@ }, border(vars, size));
 function heading(vars, level) {
-  return _extends({}, resetTypography(), {
+  return Object.assign(resetTypography(), {
     color: vars("palette-neutral-color-" + LAYOUT_SHADES.text),
@@ -166,3 +166,3 @@ letterSpacing: vars("heading-" + level + "-letter-spacing"),
 function text(vars, level) {
-  return _extends({}, resetTypography(), {
+  return Object.assign(resetTypography(), {
     color: vars("palette-neutral-color-" + LAYOUT_SHADES.text),
@@ -251,2 +251,3 @@ fontFamily: vars('typography-font-text'),
     this.tokens = void 0;
+    this.cachedTokens = void 0;
     this.design = void 0;
@@ -334,3 +335,7 @@
   _proto.toTokens = function toTokens() {
-    return _extends({}, this.design.tokens, {}, this.tokens);
+    if (!this.cachedTokens) {
+      this.cachedTokens = _extends({}, this.design.tokens, {}, this.tokens);
+    }
+
+    return this.cachedTokens;
   };
@@ -376,5 +381,4 @@
     this.name = name;
-    this.tokens = _extends({}, tokens, {
-      depth: DEPTHS
-    });
+    this.tokens = tokens;
+    this.tokens.depth = DEPTHS;
     this.rootLineHeight = tokens.typography.rootLineHeight;
@@ -381,0 +385,0 @@ this.rootTextSize = Number.parseFloat(tokens.typography.rootTextSize);

lib/index.js

@@ -68,3 +68,3 @@ 'use strict';
 function box(vars, size) {
-  return _extends({
+  return Object.assign({
     backgroundColor: vars("palette-neutral-color-" + LAYOUT_SHADES.box)
@@ -153,3 +153,3 @@ }, border(vars, size));
 function heading(vars, level) {
-  return _extends({}, resetTypography(), {
+  return Object.assign(resetTypography(), {
     color: vars("palette-neutral-color-" + LAYOUT_SHADES.text),
@@ -170,3 +170,3 @@ letterSpacing: vars("heading-" + level + "-letter-spacing"),
 function text(vars, level) {
-  return _extends({}, resetTypography(), {
+  return Object.assign(resetTypography(), {
     color: vars("palette-neutral-color-" + LAYOUT_SHADES.text),
@@ -255,2 +255,3 @@ fontFamily: vars('typography-font-text'),
     this.tokens = void 0;
+    this.cachedTokens = void 0;
     this.design = void 0;
@@ -338,3 +339,7 @@
   _proto.toTokens = function toTokens() {
-    return _extends({}, this.design.tokens, {}, this.tokens);
+    if (!this.cachedTokens) {
+      this.cachedTokens = _extends({}, this.design.tokens, {}, this.tokens);
+    }
+
+    return this.cachedTokens;
   };
@@ -380,5 +385,4 @@
     this.name = name;
-    this.tokens = _extends({}, tokens, {
-      depth: DEPTHS
-    });
+    this.tokens = tokens;
+    this.tokens.depth = DEPTHS;
     this.rootLineHeight = tokens.typography.rootLineHeight;
@@ -385,0 +389,0 @@ this.rootTextSize = Number.parseFloat(tokens.typography.rootTextSize);

lib/Theme.d.ts

@@ -10,2 +10,3 @@ import { DeclarationBlock } from '@aesthetic/sss';
     readonly tokens: ThemeTokens;
+    private cachedTokens?;
     private design;
@@ -12,0 +13,0 @@ constructor(options: ThemeOptions, tokens: ThemeTokens, design: Design, parentMixins?: Mixins);

package.json

 {
   "name": "@aesthetic/system",
-  "version": "0.1.0",
+  "version": "0.1.1",
   "description": "Web based building blocks for the Aesthetic design system.",
@@ -30,3 +30,3 @@ "keywords": [
   },
-  "gitHead": "9ec9db033887e32ea1b5d5dfcb4e5c87dad3dfc3"
+  "gitHead": "775b992281d34634f3942bccf61b73883eaa276e"
 }

No alert changes

Improved metrics

Total package byte prevSize

101528

increased by0.27%

Lines of code

3022

increased by0.23%

No dependency changes