@sk-web-gui/theme - npm Package Compare versions

Comparing version 0.1.4 to 0.1.5

dist/cjs/colors.js

@@ -35,13 +35,13 @@ "use strict";
   black: {
-    DEFAULT: "#000000",
-    dark: "#000000",
-    light: "#000000",
-    active: "#000000"
+    DEFAULT: '#000000',
+    dark: '#000000',
+    light: '#000000',
+    active: '#000000'
   },
   gray: {
-    DEFAULT: "#4b4b4b",
-    dark: "#4b4b4b",
-    light: "#4b4b4b",
+    DEFAULT: '#4b4b4b',
+    dark: '#4b4b4b',
+    light: '#4b4b4b',
     // lighter: "#F9F9F9",
-    active: "#F4F4F4" // stroke: "#939393",
+    active: '#F4F4F4' // stroke: "#939393",
     // middle: "#ECECEC",
@@ -51,78 +51,78 @@
   'gray-light': {
-    DEFAULT: "#F4F4F4",
-    dark: "#F4F4F4",
-    light: "#F4F4F4",
-    active: "#F4F4F4"
+    DEFAULT: '#F4F4F4',
+    dark: '#F4F4F4',
+    light: '#F4F4F4',
+    active: '#F4F4F4'
   },
   'gray-lighter': {
-    DEFAULT: "#F9F9F9",
-    dark: "#F9F9F9",
-    light: "#F9F9F9",
-    active: "#F9F9F9"
+    DEFAULT: '#F9F9F9',
+    dark: '#F9F9F9',
+    light: '#F9F9F9',
+    active: '#F9F9F9'
   },
   'gray-stroke': {
-    DEFAULT: "#939393",
-    dark: "#939393",
-    light: "#939393",
-    active: "#939393"
+    DEFAULT: '#939393',
+    dark: '#939393',
+    light: '#939393',
+    active: '#939393'
   },
   'gray-middle': {
-    DEFAULT: "#ECECEC",
-    dark: "#ECECEC",
-    light: "#ECECEC",
-    active: "#ECECEC"
+    DEFAULT: '#ECECEC',
+    dark: '#ECECEC',
+    light: '#ECECEC',
+    active: '#ECECEC'
   },
   white: {
-    DEFAULT: "#FFFFFF",
-    dark: "#FFFFFF",
-    light: "#FFFFFF",
-    active: "#FFFFFF"
+    DEFAULT: '#FFFFFF',
+    dark: '#FFFFFF',
+    light: '#FFFFFF',
+    active: '#FFFFFF'
   },
   // Named
   vattjom: {
-    DEFAULT: "#005595",
-    dark: "#005595",
-    light: "#DAEFF1",
-    active: "#2B76B0"
+    DEFAULT: '#005595',
+    dark: '#005595',
+    light: '#DAEFF1',
+    active: '#2B76B0'
   },
   gronsta: {
-    DEFAULT: "#00733B",
-    dark: "#00733B",
-    light: "#E0F6DE",
-    active: "#00994e"
+    DEFAULT: '#00733B',
+    dark: '#00733B',
+    light: '#E0F6DE',
+    active: '#00994e'
   },
   bjornstigen: {
-    DEFAULT: "#5B1F78",
-    dark: "#5B1F78",
-    light: "#D7DBF2",
-    active: "#D7DBF2"
+    DEFAULT: '#5B1F78',
+    dark: '#5B1F78',
+    light: '#D7DBF2',
+    active: '#D7DBF2'
   },
   juniskar: {
-    DEFAULT: "#A90074",
-    dark: "#A90074",
-    light: "#FEDFE2",
-    active: "#FEDFE2"
+    DEFAULT: '#A90074',
+    dark: '#A90074',
+    light: '#FEDFE2',
+    active: '#FEDFE2'
   },
   svartvik: {
-    DEFAULT: "#D4D8DB",
-    dark: "#D4D8DB",
-    light: "#D4D8DB",
-    active: "#D4D8DB",
-    "50": "#D4D8DB",
-    "100": "#C8CFD2",
-    "200": "#B2BBBF",
-    "300": "#9CA7AD",
-    "400": "#86939A",
-    "500": "#707F87",
-    "600": "#576268",
-    "700": "#3D454A",
-    "800": "#24282B",
-    "900": "#0A0C0C"
+    DEFAULT: '#D4D8DB',
+    dark: '#D4D8DB',
+    light: '#D4D8DB',
+    active: '#D4D8DB',
+    '50': '#D4D8DB',
+    '100': '#C8CFD2',
+    '200': '#B2BBBF',
+    '300': '#9CA7AD',
+    '400': '#86939A',
+    '500': '#707F87',
+    '600': '#576268',
+    '700': '#3D454A',
+    '800': '#24282B',
+    '900': '#0A0C0C'
   },
   // Other
   red: {
-    DEFAULT: "#A90000",
-    dark: "#A90000",
-    light: "#A90000",
-    active: "#A90000"
+    DEFAULT: '#A90000',
+    dark: '#A90000',
+    light: '#A90000',
+    active: '#A90000'
   }
@@ -183,12 +183,12 @@ }; // App setup
   hover: {
-    DEFAULT: "#2B76B0",
-    dark: "#2B76B0",
-    light: "#2B76B0",
-    active: "#2B76B0"
+    DEFAULT: '#2B76B0',
+    dark: '#2B76B0',
+    light: '#2B76B0',
+    active: '#2B76B0'
   },
   // ..background
   background: {
-    one: "#D9E6EF",
-    two: "#F4F4F4",
-    three: "#F9F9F9"
+    one: '#D9E6EF',
+    two: '#F4F4F4',
+    three: '#F9F9F9'
   },
@@ -203,3 +203,3 @@ // ..headings
   body: {
-    DEFAULT: "#212121",
+    DEFAULT: '#212121',
     two: _colors.black.DEFAULT
@@ -221,6 +221,6 @@ },
   warning: {
-    DEFAULT: "#E8B34D",
-    dark: "#E8B34D",
-    light: "#E8B34D",
-    active: "#E8B34D"
+    DEFAULT: '#E8B34D',
+    dark: '#E8B34D',
+    light: '#E8B34D',
+    active: '#E8B34D'
   },
@@ -227,0 +227,0 @@ error: {

dist/cjs/create-memo-class.js

@@ -10,4 +10,4 @@ "use strict";
   return function useMemoClass(args) {
-    var dependencies = typeof args === "object" && args !== null ? Object.keys(args).filter(function (key) {
-      return key !== "theme";
+    var dependencies = typeof args === 'object' && args !== null ? Object.keys(args).filter(function (key) {
+      return key !== 'theme';
     }).map(function (key) {
@@ -14,0 +14,0 @@ return args[key];

dist/cjs/create-theme-vars/calc.js

@@ -24,3 +24,3 @@ "use strict";
 
-  return operands.map(resolveReference).join(" " + operator + " ").replace(/calc/g, "");
+  return operands.map(resolveReference).join(" " + operator + " ").replace(/calc/g, '');
 };
@@ -33,3 +33,3 @@
 
-  return "calc(" + toExpression.apply(void 0, ["+"].concat(operands)) + ")";
+  return "calc(" + toExpression.apply(void 0, ['+'].concat(operands)) + ")";
 };
@@ -42,3 +42,3 @@
 
-  return "calc(" + toExpression.apply(void 0, ["-"].concat(operands)) + ")";
+  return "calc(" + toExpression.apply(void 0, ['-'].concat(operands)) + ")";
 };
@@ -51,3 +51,3 @@
 
-  return "calc(" + toExpression.apply(void 0, ["*"].concat(operands)) + ")";
+  return "calc(" + toExpression.apply(void 0, ['*'].concat(operands)) + ")";
 };
@@ -60,3 +60,3 @@
 
-  return "calc(" + toExpression.apply(void 0, ["/"].concat(operands)) + ")";
+  return "calc(" + toExpression.apply(void 0, ['/'].concat(operands)) + ")";
 };
@@ -68,3 +68,3 @@
   if (value != null && !Number.isNaN(parseFloat(value))) {
-    return String(value).startsWith("-") ? String(value).slice(1) : "-" + value;
+    return String(value).startsWith('-') ? String(value).slice(1) : "-" + value;
   }
@@ -71,0 +71,0 @@

dist/cjs/create-theme-vars/create-theme-vars.js

@@ -39,4 +39,4 @@ "use strict";
 
-    var lookupKey = keys.join(".");
-    var varKey = keys.join("-");
+    var lookupKey = keys.join('.');
+    var varKey = keys.join('-');
 
@@ -43,0 +43,0 @@ var _cssVar = (0, _cssVar2.cssVar)(varKey, undefined, options.cssVarPrefix),

dist/cjs/create-theme-vars/css-var.js

@@ -11,3 +11,3 @@ "use strict";
   if (replaceValue === void 0) {
-    replaceValue = "-";
+    replaceValue = '-';
   }
@@ -20,5 +20,5 @@
   var valueStr = replaceWhiteSpace(value.toString());
-  if (valueStr.includes("\\.")) return value;
+  if (valueStr.includes('\\.')) return value;
   var isDecimal = !Number.isInteger(parseFloat(value.toString()));
-  return isDecimal ? valueStr.replace(".", "\\.") : value;
+  return isDecimal ? valueStr.replace('.', "\\.") : value;
 }
@@ -28,10 +28,10 @@
   if (prefix === void 0) {
-    prefix = "";
+    prefix = '';
   }
 
-  return [prefix, escape(value)].filter(Boolean).join("-");
+  return [prefix, escape(value)].filter(Boolean).join('-');
 }
 
 function toVarReference(name, fallback) {
-  return "var(" + escape(name) + (fallback ? ", " + fallback : "") + ")";
+  return "var(" + escape(name) + (fallback ? ", " + fallback : '') + ")";
 }
@@ -41,3 +41,3 @@
   if (prefix === void 0) {
-    prefix = "";
+    prefix = '';
   }
@@ -44,0 +44,0 @@

dist/cjs/create-theme-vars/theme-tokens.js

@@ -13,3 +13,3 @@ "use strict";
 
-var tokens = ["colors", "cursor", "rounded"];
+var tokens = ['colors', 'cursor', 'rounded'];
 
@@ -16,0 +16,0 @@ function extractTokens(theme) {

dist/cjs/create-theme-vars/to-css-var.js

@@ -20,3 +20,3 @@ "use strict";
   var tokens = (0, _themeTokens.extractTokens)(theme);
-  var cssVarPrefix = ((_theme$config = theme.config) == null ? void 0 : _theme$config.cssVarPrefix) || "vc";
+  var cssVarPrefix = ((_theme$config = theme.config) == null ? void 0 : _theme$config.cssVarPrefix) || 'vc';
 
@@ -23,0 +23,0 @@ var _createThemeVars = (0, _createThemeVars2.createThemeVars)(tokens, {

dist/cjs/default-theme.js

@@ -12,12 +12,12 @@ "use strict";
 var lightScheme = {
-  id: "light",
-  type: "light",
+  id: 'light',
+  type: 'light',
   colors: _extends({}, _colors.colors, {
     bg: {
-      base: "#ffffff",
+      base: '#ffffff',
       fill: _colors.colors.background.two
     },
     text: {
-      foreground: "#000000",
-      muted: "#E4E4E5"
+      foreground: '#000000',
+      muted: '#E4E4E5'
     }
@@ -29,12 +29,12 @@ })
 var darkScheme = {
-  id: "dark",
-  type: "dark",
+  id: 'dark',
+  type: 'dark',
   colors: _extends({}, _colors.colors, {
     bg: {
-      base: "#ffffff",
+      base: '#ffffff',
       fill: _colors.colors.background.two
     },
     text: {
-      foreground: _colors.colors.svartvik["100"],
-      muted: _colors.colors.svartvik["300"]
+      foreground: _colors.colors.svartvik['100'],
+      muted: _colors.colors.svartvik['300']
     }
@@ -45,4 +45,4 @@ })
 var defaultTheme = {
-  cursor: "pointer",
-  rounded: "0.375rem",
+  cursor: 'pointer',
+  rounded: '0.375rem',
   // md
@@ -49,0 +49,0 @@ colorSchemes: {

dist/cjs/gui-provider.js

@@ -33,3 +33,3 @@ "use strict";
 exports.GuiContext = GuiContext;
-GuiContext.displayName = "GuiContext";
+GuiContext.displayName = 'GuiContext';
 
@@ -40,6 +40,6 @@ function GuiProvider(_ref) {
       _ref$colorScheme = _ref.colorScheme,
-      colorScheme = _ref$colorScheme === void 0 ? "light" : _ref$colorScheme,
+      colorScheme = _ref$colorScheme === void 0 ? 'light' : _ref$colorScheme,
       children = _ref.children;
   var computedTheme = (0, React.useMemo)(function () {
-    var omittedTheme = (0, _utils.omit)(theme, ["colorSchemes"]);
+    var omittedTheme = (0, _utils.omit)(theme, ['colorSchemes']);
 
@@ -51,9 +51,9 @@ var _ref2 = theme.colorSchemes[colorScheme] || {},
     if (_utils2.isBrowser) {
-      if (type === "dark") document.documentElement.classList.add("dark");else document.documentElement.classList.remove("dark");
+      if (type === 'dark') document.documentElement.classList.add('dark');else document.documentElement.classList.remove('dark');
     }
 
     (0, _utils.walkObject)(colors, function (value, path) {
-      if (typeof value !== "string") return;
+      if (typeof value !== 'string') return;
       var rgb = (0, _utils.toRGB)(value);
-      if (rgb) (0, _lodash["default"])(colors, path, rgb.join(","));
+      if (rgb) (0, _lodash["default"])(colors, path, rgb.join(','));
     });
@@ -86,3 +86,3 @@
 function updateStyleHelper(_themeKey, style) {
-  var themeKey = _themeKey.startsWith("--") ? _themeKey : "--" + _themeKey;
+  var themeKey = _themeKey.startsWith('--') ? _themeKey : "--" + _themeKey;
   setStyleVariable(themeKey, style);
@@ -103,3 +103,3 @@ }
   if (!theme) {
-    throw Error("useGui: `theme` is undefined. Seems you forgot to wrap your app in `<GuiProvider />`");
+    throw Error('useGui: `theme` is undefined. Seems you forgot to wrap your app in `<GuiProvider />`');
   }
@@ -106,0 +106,0 @@

dist/cjs/utils.js

@@ -5,4 +5,4 @@ "use strict";
 exports.isBrowser = void 0;
-var isBrowser = typeof document !== "undefined";
+var isBrowser = typeof document !== 'undefined';
 exports.isBrowser = isBrowser;
 //# sourceMappingURL=utils.js.map

dist/esm/colors.js

@@ -30,13 +30,13 @@ function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
   black: {
-    DEFAULT: "#000000",
-    dark: "#000000",
-    light: "#000000",
-    active: "#000000"
+    DEFAULT: '#000000',
+    dark: '#000000',
+    light: '#000000',
+    active: '#000000'
   },
   gray: {
-    DEFAULT: "#4b4b4b",
-    dark: "#4b4b4b",
-    light: "#4b4b4b",
+    DEFAULT: '#4b4b4b',
+    dark: '#4b4b4b',
+    light: '#4b4b4b',
     // lighter: "#F9F9F9",
-    active: "#F4F4F4" // stroke: "#939393",
+    active: '#F4F4F4' // stroke: "#939393",
     // middle: "#ECECEC",
@@ -46,78 +46,78 @@
   'gray-light': {
-    DEFAULT: "#F4F4F4",
-    dark: "#F4F4F4",
-    light: "#F4F4F4",
-    active: "#F4F4F4"
+    DEFAULT: '#F4F4F4',
+    dark: '#F4F4F4',
+    light: '#F4F4F4',
+    active: '#F4F4F4'
   },
   'gray-lighter': {
-    DEFAULT: "#F9F9F9",
-    dark: "#F9F9F9",
-    light: "#F9F9F9",
-    active: "#F9F9F9"
+    DEFAULT: '#F9F9F9',
+    dark: '#F9F9F9',
+    light: '#F9F9F9',
+    active: '#F9F9F9'
   },
   'gray-stroke': {
-    DEFAULT: "#939393",
-    dark: "#939393",
-    light: "#939393",
-    active: "#939393"
+    DEFAULT: '#939393',
+    dark: '#939393',
+    light: '#939393',
+    active: '#939393'
   },
   'gray-middle': {
-    DEFAULT: "#ECECEC",
-    dark: "#ECECEC",
-    light: "#ECECEC",
-    active: "#ECECEC"
+    DEFAULT: '#ECECEC',
+    dark: '#ECECEC',
+    light: '#ECECEC',
+    active: '#ECECEC'
   },
   white: {
-    DEFAULT: "#FFFFFF",
-    dark: "#FFFFFF",
-    light: "#FFFFFF",
-    active: "#FFFFFF"
+    DEFAULT: '#FFFFFF',
+    dark: '#FFFFFF',
+    light: '#FFFFFF',
+    active: '#FFFFFF'
   },
   // Named
   vattjom: {
-    DEFAULT: "#005595",
-    dark: "#005595",
-    light: "#DAEFF1",
-    active: "#2B76B0"
+    DEFAULT: '#005595',
+    dark: '#005595',
+    light: '#DAEFF1',
+    active: '#2B76B0'
   },
   gronsta: {
-    DEFAULT: "#00733B",
-    dark: "#00733B",
-    light: "#E0F6DE",
-    active: "#00994e"
+    DEFAULT: '#00733B',
+    dark: '#00733B',
+    light: '#E0F6DE',
+    active: '#00994e'
   },
   bjornstigen: {
-    DEFAULT: "#5B1F78",
-    dark: "#5B1F78",
-    light: "#D7DBF2",
-    active: "#D7DBF2"
+    DEFAULT: '#5B1F78',
+    dark: '#5B1F78',
+    light: '#D7DBF2',
+    active: '#D7DBF2'
   },
   juniskar: {
-    DEFAULT: "#A90074",
-    dark: "#A90074",
-    light: "#FEDFE2",
-    active: "#FEDFE2"
+    DEFAULT: '#A90074',
+    dark: '#A90074',
+    light: '#FEDFE2',
+    active: '#FEDFE2'
   },
   svartvik: {
-    DEFAULT: "#D4D8DB",
-    dark: "#D4D8DB",
-    light: "#D4D8DB",
-    active: "#D4D8DB",
-    "50": "#D4D8DB",
-    "100": "#C8CFD2",
-    "200": "#B2BBBF",
-    "300": "#9CA7AD",
-    "400": "#86939A",
-    "500": "#707F87",
-    "600": "#576268",
-    "700": "#3D454A",
-    "800": "#24282B",
-    "900": "#0A0C0C"
+    DEFAULT: '#D4D8DB',
+    dark: '#D4D8DB',
+    light: '#D4D8DB',
+    active: '#D4D8DB',
+    '50': '#D4D8DB',
+    '100': '#C8CFD2',
+    '200': '#B2BBBF',
+    '300': '#9CA7AD',
+    '400': '#86939A',
+    '500': '#707F87',
+    '600': '#576268',
+    '700': '#3D454A',
+    '800': '#24282B',
+    '900': '#0A0C0C'
   },
   // Other
   red: {
-    DEFAULT: "#A90000",
-    dark: "#A90000",
-    light: "#A90000",
-    active: "#A90000"
+    DEFAULT: '#A90000',
+    dark: '#A90000',
+    light: '#A90000',
+    active: '#A90000'
   }
@@ -176,12 +176,12 @@ }; // App setup
   hover: {
-    DEFAULT: "#2B76B0",
-    dark: "#2B76B0",
-    light: "#2B76B0",
-    active: "#2B76B0"
+    DEFAULT: '#2B76B0',
+    dark: '#2B76B0',
+    light: '#2B76B0',
+    active: '#2B76B0'
   },
   // ..background
   background: {
-    one: "#D9E6EF",
-    two: "#F4F4F4",
-    three: "#F9F9F9"
+    one: '#D9E6EF',
+    two: '#F4F4F4',
+    three: '#F9F9F9'
   },
@@ -196,3 +196,3 @@ // ..headings
   body: {
-    DEFAULT: "#212121",
+    DEFAULT: '#212121',
     two: _colors.black.DEFAULT
@@ -214,6 +214,6 @@ },
   warning: {
-    DEFAULT: "#E8B34D",
-    dark: "#E8B34D",
-    light: "#E8B34D",
-    active: "#E8B34D"
+    DEFAULT: '#E8B34D',
+    dark: '#E8B34D',
+    light: '#E8B34D',
+    active: '#E8B34D'
   },
@@ -220,0 +220,0 @@ error: {

dist/esm/create-memo-class.js

@@ -1,5 +0,5 @@
-import { useMemo } from "react";
+import { useMemo } from 'react';
 export function createMemoClass(func) {
   return function useMemoClass(args) {
-    var dependencies = typeof args === "object" && args !== null ? Object.keys(args).filter(key => key !== "theme").map(key => args[key]) : [];
+    var dependencies = typeof args === 'object' && args !== null ? Object.keys(args).filter(key => key !== 'theme').map(key => args[key]) : [];
     return useMemo(() => func(args), dependencies);
@@ -6,0 +6,0 @@ };

dist/esm/create-theme-vars/calc.js

 /**
  * Thank you @markdalgleish for this piece of art!
  */
-import { isObject } from "@sk-web-gui/utils";
+import { isObject } from '@sk-web-gui/utils';
 
@@ -19,3 +19,3 @@ function resolveReference(operand) {
 
-  return operands.map(resolveReference).join(" " + operator + " ").replace(/calc/g, "");
+  return operands.map(resolveReference).join(" " + operator + " ").replace(/calc/g, '');
 };
@@ -28,3 +28,3 @@
 
-  return "calc(" + toExpression("+", ...operands) + ")";
+  return "calc(" + toExpression('+', ...operands) + ")";
 };
@@ -37,3 +37,3 @@
 
-  return "calc(" + toExpression("-", ...operands) + ")";
+  return "calc(" + toExpression('-', ...operands) + ")";
 };
@@ -46,3 +46,3 @@
 
-  return "calc(" + toExpression("*", ...operands) + ")";
+  return "calc(" + toExpression('*', ...operands) + ")";
 };
@@ -55,3 +55,3 @@
 
-  return "calc(" + toExpression("/", ...operands) + ")";
+  return "calc(" + toExpression('/', ...operands) + ")";
 };
@@ -63,3 +63,3 @@
   if (value != null && !Number.isNaN(parseFloat(value))) {
-    return String(value).startsWith("-") ? String(value).slice(1) : "-" + value;
+    return String(value).startsWith('-') ? String(value).slice(1) : "-" + value;
   }
@@ -66,0 +66,0 @@

dist/esm/create-theme-vars/create-theme-vars.js

@@ -1,3 +0,3 @@
-import { walkObject } from "@sk-web-gui/utils";
-import { cssVar } from "./css-var";
+import { walkObject } from '@sk-web-gui/utils';
+import { cssVar } from './css-var';
 export function createThemeVars(target, options) {
@@ -29,4 +29,4 @@ var context = {
   defaultHandler: (keys, value, options) => {
-    var lookupKey = keys.join(".");
-    var varKey = keys.join("-");
+    var lookupKey = keys.join('.');
+    var varKey = keys.join('-');
     var {
@@ -33,0 +33,0 @@ variable,

dist/esm/create-theme-vars/css-var.js

 function replaceWhiteSpace(value, replaceValue) {
   if (replaceValue === void 0) {
-    replaceValue = "-";
+    replaceValue = '-';
   }
@@ -11,5 +11,5 @@
   var valueStr = replaceWhiteSpace(value.toString());
-  if (valueStr.includes("\\.")) return value;
+  if (valueStr.includes('\\.')) return value;
   var isDecimal = !Number.isInteger(parseFloat(value.toString()));
-  return isDecimal ? valueStr.replace(".", "\\.") : value;
+  return isDecimal ? valueStr.replace('.', "\\.") : value;
 }
@@ -19,13 +19,13 @@
   if (prefix === void 0) {
-    prefix = "";
+    prefix = '';
   }
 
-  return [prefix, escape(value)].filter(Boolean).join("-");
+  return [prefix, escape(value)].filter(Boolean).join('-');
 }
 export function toVarReference(name, fallback) {
-  return "var(" + escape(name) + (fallback ? ", " + fallback : "") + ")";
+  return "var(" + escape(name) + (fallback ? ", " + fallback : '') + ")";
 }
 export function toVarDefinition(value, prefix) {
   if (prefix === void 0) {
-    prefix = "";
+    prefix = '';
   }
@@ -32,0 +32,0 @@

dist/esm/create-theme-vars/index.js

@@ -1,5 +0,5 @@
-export * from "./calc";
-export * from "./css-var";
-export * from "./to-css-var";
+export * from './calc';
+export * from './css-var';
+export * from './to-css-var';
 export {};
 //# sourceMappingURL=index.js.map

dist/esm/create-theme-vars/theme-tokens.js

@@ -5,4 +5,4 @@ var _excluded = ["__cssMap", "__cssVars", "__breakpoints"];
 
-import { pick } from "@sk-web-gui/utils";
-var tokens = ["colors", "cursor", "rounded"];
+import { pick } from '@sk-web-gui/utils';
+var tokens = ['colors', 'cursor', 'rounded'];
 export function extractTokens(theme) {
@@ -9,0 +9,0 @@ var _tokens = tokens;

dist/esm/create-theme-vars/to-css-var.js

@@ -1,3 +0,3 @@
-import { createThemeVars } from "./create-theme-vars";
-import { extractTokens, omitVars } from "./theme-tokens";
+import { createThemeVars } from './create-theme-vars';
+import { extractTokens, omitVars } from './theme-tokens';
 export function toCSSVar(rawTheme) {
@@ -13,3 +13,3 @@ var _theme$config;
   var tokens = extractTokens(theme);
-  var cssVarPrefix = ((_theme$config = theme.config) == null ? void 0 : _theme$config.cssVarPrefix) || "vc";
+  var cssVarPrefix = ((_theme$config = theme.config) == null ? void 0 : _theme$config.cssVarPrefix) || 'vc';
   var {
@@ -16,0 +16,0 @@ /**

dist/esm/default-theme.js

 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-import { colors } from "./colors";
+import { colors } from './colors';
 // light theme
 export var lightScheme = {
-  id: "light",
-  type: "light",
+  id: 'light',
+  type: 'light',
   colors: _extends({}, colors, {
     bg: {
-      base: "#ffffff",
+      base: '#ffffff',
       fill: colors.background.two
     },
     text: {
-      foreground: "#000000",
-      muted: "#E4E4E5"
+      foreground: '#000000',
+      muted: '#E4E4E5'
     }
@@ -21,12 +21,12 @@ })
 export var darkScheme = {
-  id: "dark",
-  type: "dark",
+  id: 'dark',
+  type: 'dark',
   colors: _extends({}, colors, {
     bg: {
-      base: "#ffffff",
+      base: '#ffffff',
       fill: colors.background.two
     },
     text: {
-      foreground: colors.svartvik["100"],
-      muted: colors.svartvik["300"]
+      foreground: colors.svartvik['100'],
+      muted: colors.svartvik['300']
     }
@@ -36,4 +36,4 @@ })
 export var defaultTheme = {
-  cursor: "pointer",
-  rounded: "0.375rem",
+  cursor: 'pointer',
+  rounded: '0.375rem',
   // md
@@ -40,0 +40,0 @@ colorSchemes: {

dist/esm/gui-provider.js

 function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-import { walkObject, omit, toRGB, deepmerge } from "@sk-web-gui/utils";
-import * as React from "react";
-import { createContext, useContext, useMemo } from "react";
-import set from "lodash.set";
-import { defaultTheme } from "./default-theme";
-import { toCSSVar } from "./create-theme-vars";
-import { useSafeEffect } from "./use-safe-effect";
-import { isBrowser } from "./utils";
+import { walkObject, omit, toRGB, deepmerge } from '@sk-web-gui/utils';
+import * as React from 'react';
+import { createContext, useContext, useMemo } from 'react';
+import set from 'lodash.set';
+import { defaultTheme } from './default-theme';
+import { toCSSVar } from './create-theme-vars';
+import { useSafeEffect } from './use-safe-effect';
+import { isBrowser } from './utils';
 export var GuiContext = /*#__PURE__*/createContext(undefined);
-GuiContext.displayName = "GuiContext";
+GuiContext.displayName = 'GuiContext';
 export function GuiProvider(_ref) {
   var {
     theme = defaultTheme,
-    colorScheme = "light",
+    colorScheme = 'light',
     children
   } = _ref;
   var computedTheme = useMemo(() => {
-    var omittedTheme = omit(theme, ["colorSchemes"]);
+    var omittedTheme = omit(theme, ['colorSchemes']);
     var {
@@ -27,9 +27,9 @@ colors,
     if (isBrowser) {
-      if (type === "dark") document.documentElement.classList.add("dark");else document.documentElement.classList.remove("dark");
+      if (type === 'dark') document.documentElement.classList.add('dark');else document.documentElement.classList.remove('dark');
     }
 
     walkObject(colors, (value, path) => {
-      if (typeof value !== "string") return;
+      if (typeof value !== 'string') return;
       var rgb = toRGB(value);
-      if (rgb) set(colors, path, rgb.join(","));
+      if (rgb) set(colors, path, rgb.join(','));
     });
@@ -60,3 +60,3 @@
 function updateStyleHelper(_themeKey, style) {
-  var themeKey = _themeKey.startsWith("--") ? _themeKey : "--" + _themeKey;
+  var themeKey = _themeKey.startsWith('--') ? _themeKey : "--" + _themeKey;
   setStyleVariable(themeKey, style);
@@ -76,3 +76,3 @@ }
   if (!theme) {
-    throw Error("useGui: `theme` is undefined. Seems you forgot to wrap your app in `<GuiProvider />`");
+    throw Error('useGui: `theme` is undefined. Seems you forgot to wrap your app in `<GuiProvider />`');
   }
@@ -79,0 +79,0 @@

dist/esm/index.js

@@ -1,7 +0,7 @@
-export * from "./gui-provider";
-export * from "./create-memo-class";
-export * from "./create-theme-vars";
-export * from "./default-theme";
-export * from "./colors";
-export * from "./types";
+export * from './gui-provider';
+export * from './create-memo-class';
+export * from './create-theme-vars';
+export * from './default-theme';
+export * from './colors';
+export * from './types';
 //# sourceMappingURL=index.js.map

dist/esm/use-safe-effect.js

@@ -1,4 +0,4 @@
-import { useLayoutEffect, useEffect } from "react";
-import { isBrowser } from "./utils";
+import { useLayoutEffect, useEffect } from 'react';
+import { isBrowser } from './utils';
 export var useSafeEffect = isBrowser ? useLayoutEffect : useEffect;
 //# sourceMappingURL=use-safe-effect.js.map

dist/esm/utils.js

@@ -1,2 +0,2 @@
-export var isBrowser = typeof document !== "undefined";
+export var isBrowser = typeof document !== 'undefined';
 //# sourceMappingURL=utils.js.map

dist/types/colors.d.ts

@@ -73,12 +73,12 @@ export declare const _colors: {
         active: string;
-        "50": string;
-        "100": string;
-        "200": string;
-        "300": string;
-        "400": string;
-        "500": string;
-        "600": string;
-        "700": string;
-        "800": string;
-        "900": string;
+        '50': string;
+        '100': string;
+        '200': string;
+        '300': string;
+        '400': string;
+        '500': string;
+        '600': string;
+        '700': string;
+        '800': string;
+        '900': string;
     };
@@ -256,12 +256,12 @@ red: {
         active: string;
-        "50": string;
-        "100": string;
-        "200": string;
-        "300": string;
-        "400": string;
-        "500": string;
-        "600": string;
-        "700": string;
-        "800": string;
-        "900": string;
+        '50': string;
+        '100': string;
+        '200': string;
+        '300': string;
+        '400': string;
+        '500': string;
+        '600': string;
+        '700': string;
+        '800': string;
+        '900': string;
     };
@@ -268,0 +268,0 @@ red: {

dist/types/create-theme-vars/create-theme-vars.d.ts

@@ -1,2 +0,2 @@
-import { Dict } from "@sk-web-gui/utils";
+import { Dict } from '@sk-web-gui/utils';
 export interface CreateThemeVarsOptions {
@@ -3,0 +3,0 @@ cssVarPrefix?: string;

dist/types/create-theme-vars/index.d.ts

@@ -1,4 +0,4 @@
-export * from "./calc";
-export * from "./css-var";
-export * from "./to-css-var";
-export type { ThemeScale } from "./theme-tokens";
+export * from './calc';
+export * from './css-var';
+export * from './to-css-var';
+export type { ThemeScale } from './theme-tokens';

dist/types/create-theme-vars/theme-tokens.d.ts

@@ -1,4 +0,4 @@
-import { Dict } from "@sk-web-gui/utils";
+import { Dict } from '@sk-web-gui/utils';
 declare const tokens: readonly ["colors", "cursor", "rounded"];
-export declare type ThemeScale = typeof tokens[number] | "transition.duration" | "transition.property" | "transition.easing";
+export declare type ThemeScale = typeof tokens[number] | 'transition.duration' | 'transition.property' | 'transition.easing';
 export declare function extractTokens(theme: Dict): {
@@ -5,0 +5,0 @@ [x: string]: any;

dist/types/create-theme-vars/to-css-var.d.ts

@@ -1,2 +0,2 @@
-import type { WithCSSVar, Dict } from "@sk-web-gui/utils";
+import type { WithCSSVar, Dict } from '@sk-web-gui/utils';
 export declare function toCSSVar<T extends Dict>(rawTheme: T): WithCSSVar<T>;

dist/types/default-theme.d.ts

@@ -1,4 +0,4 @@
-import { GuiTheme, ColorScheme } from "./types";
+import { GuiTheme, ColorScheme } from './types';
 export declare const lightScheme: ColorScheme;
 export declare const darkScheme: ColorScheme;
 export declare const defaultTheme: GuiTheme;

dist/types/gui-provider.d.ts

@@ -1,4 +0,4 @@
-import { WithCSSVar, Dict } from "@sk-web-gui/utils";
-import * as React from "react";
-import { GuiTheme, GuiThemeOverride } from "./types";
+import { WithCSSVar, Dict } from '@sk-web-gui/utils';
+import * as React from 'react';
+import { GuiTheme, GuiThemeOverride } from './types';
 interface DictGuiTheme extends Dict {
@@ -14,5 +14,5 @@ }
 }
-export declare function GuiProvider({ theme, colorScheme, children, }: GuiProviderProps): JSX.Element;
+export declare function GuiProvider({ theme, colorScheme, children }: GuiProviderProps): JSX.Element;
 export declare function useGui<T extends object = Dict>(): WithCSSVar<T>;
 export declare function extendTheme(themeOverride: GuiThemeOverride): GuiTheme;
 export {};

dist/types/index.d.ts

@@ -1,6 +0,6 @@
-export * from "./gui-provider";
-export * from "./create-memo-class";
-export * from "./create-theme-vars";
-export * from "./default-theme";
-export * from "./colors";
-export * from "./types";
+export * from './gui-provider';
+export * from './create-memo-class';
+export * from './create-theme-vars';
+export * from './default-theme';
+export * from './colors';
+export * from './types';

dist/types/types.d.ts

@@ -1,2 +0,2 @@
-import { DeepPartial } from "@sk-web-gui/utils";
+import { DeepPartial } from '@sk-web-gui/utils';
 export declare type RecursiveProperty<Nested = string | number> = RecursiveObject<Nested> | Nested;
@@ -27,3 +27,3 @@ export interface RecursiveObject<Nested = string | number> {
     id: string;
-    type: "light" | "dark";
+    type: 'light' | 'dark';
     colors: {
@@ -49,3 +49,3 @@ bg: {
 export interface GuiTheme {
-    readonly cursor: "default" | "pointer";
+    readonly cursor: 'default' | 'pointer';
     readonly rounded: string;
@@ -52,0 +52,0 @@ readonly colorSchemes: Record<string, ColorScheme>;

dist/types/use-safe-effect.d.ts

@@ -1,2 +0,2 @@
-import { useLayoutEffect } from "react";
+import { useLayoutEffect } from 'react';
 export declare const useSafeEffect: typeof useLayoutEffect;

package.json

 {
   "name": "@sk-web-gui/theme",
-  "version": "0.1.4",
+  "version": "0.1.5",
   "sideEffects": false,
@@ -41,3 +41,3 @@ "license": "MIT",
   "dependencies": {
-    "@sk-web-gui/utils": "0.1.3",
+    "@sk-web-gui/utils": "0.1.4",
     "lodash.set": "^4.3.2"
@@ -48,3 +48,3 @@ },
   },
-  "gitHead": "98dc00be73bb80955d4b41dd19c98b8ee44fceb7"
+  "gitHead": "7f394c9a25f1bd8bcd43d4b259ad025c146b1527"
 }

README.md

@@ -5,2 +5,2 @@ ## Installation
 yarn add @sk-web-gui/theme
-```
+```

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Number of lines in readme file

6

increased by20%

Worsened metrics

Total package byte prevSize

125389

decreased by-0.7%

Dependency changes

• + Added@sk-web-gui/utils@0.1.4(transitive)

• - Removed@sk-web-gui/utils@0.1.3(transitive)

• Updated@sk-web-gui/utils@0.1.4