@loomhq/lens 10.28.0 → 10.29.3

package/dist/components/icon/available-icons/index.d.ts

@@ -19,7 +19,6 @@ export { default as SvgReplay5 } from "./replay-5.js";
 export { default as SvgBack5 } from "./back5.js";
 export { default as SvgForward5 } from "./forward-5.js";
 export { default as SvgBarChart } from "./bar-chart.js";
-export { default as SvgBell } from "./bell.js";
 export { default as SvgBorderColor } from "./border-color.js";
 export { default as SvgBulb } from "./bulb.js";
 export { default as SvgCallToAction } from "./call-to-action.js";
@@ -212,3 +211,4 @@ export { default as PictureInPicture } from "./picture-in-picture.js";
 export { default as FolderPlus } from "./folder-plus.js";
 export { default as SvgPower } from "./power.js";
 export { default as SvgReplay } from "./replay.js";
+export { default as SvgBell } from "./bell.js";

package/dist/components/icon/available-icons/index.js

@@ -19,7 +19,6 @@ export { default as SvgReplay5 } from './replay-5.js';
 export { default as SvgBack5 } from './back5.js';
 export { default as SvgForward5 } from './forward-5.js';
 export { default as SvgBarChart } from './bar-chart.js';
-export { default as SvgBell } from './bell.js';
 export { default as SvgBorderColor } from './border-color.js';
 export { default as SvgBulb } from './bulb.js';
 export { default as SvgCallToAction } from './call-to-action.js';
@@ -212,3 +211,4 @@ export { default as PictureInPicture } from './picture-in-picture.js';
 export { default as FolderPlus } from './folder-plus.js';
 export { default as SvgPower } from './power.js';
 export { default as SvgReplay } from './replay.js';
+export { default as SvgBell } from './bell.js';

package/dist/css-variables/index.d.ts

@@ -7,9 +7,11 @@ export declare const radiusVariables: VarsObject;
 export declare const shadowVariables: VarsObject;
 export declare const spaceVariables: VarsObject;
 export declare const formFieldVariables: VarsObject;
+export declare const getSizingVariablesCssVarsObject: () => VarsObject;
 export declare const getVariablesCssVarsObject: () => VarsObject;
 export declare const getColorsCssVarsObject: () => VarsObject;
 export declare const getThemeStylesString: (customRootElement?: string) => string;
 export declare const getThemeStyles: () => void;
+export declare const getSizingCssVarsDeclarations: () => string;
 export declare const getAllCssVarsString: (customRootElement: any) => string;
 export {};

package/dist/css-variables/index.js

@@ -72,10 +72,19 @@ export const formFieldVariables = getCssVarsFromObject(undefined, {
 });
 const colorVariables = getCssVarsFromObject('color', getColorsObject());
 const themeColorVariables = getCssVarsFromObject(undefined, getThemeColorsObject());
+const sizingVariables = [
+    unitVariables,
+    textSizeVariables,
+    radiusVariables,
+    shadowVariables,
+    spaceVariables,
+    formFieldVariables,
+];
+export const getSizingVariablesCssVarsObject = () => {
+    return Object.assign({}, ...sizingVariables);
+};
 export const getVariablesCssVarsObject = () => {
-    const result = {};
-    Object.assign(result, unitVariables, fontWeightVariables, textSizeVariables, radiusVariables, shadowVariables, spaceVariables, formFieldVariables);
-    return result;
+    return Object.assign({}, fontWeightVariables, ...sizingVariables);
 };
 export const getColorsCssVarsObject = () => {
     return Object.assign(Object.assign({}, colorVariables), themeColorVariables);
@@ -104,6 +113,10 @@ export const getThemeStyles = () => {
     style.innerHTML = getThemeStylesString();
     document.head.appendChild(style);
 };
+export const getSizingCssVarsDeclarations = () => {
+    const result = Object.entries(getSizingVariablesCssVarsObject()).map(cssVar => `${cssVar[0]}:${cssVar[1]};`);
+    return result.join('');
+};
 export const getAllCssVarsString = customRootElement => {
     const result = [];
     const rootElement = customRootElement || ':root';

package/dist/variables.js

@@ -1,3 +1,4 @@
+import { u } from './utilities';
 export const unit = 8;
 export const textSizes = {
     small: {
@@ -32,12 +33,12 @@ export const fontWeights = {
     black: 900,
 };
 export const radii = {
-    medium: '6px',
+    medium: u(0.75),
 };
 export const shadows = {
-    small: '0 4px 10px hsla(0, 0%, 0%, 0.05)',
-    medium: '0 4px 10px hsla(0, 0%, 0%, 0.1)',
-    large: '0 6px 24px hsla(0, 0%, 0%, 0.1)',
+    small: `0 ${u(0.5)} ${u(1.25)} hsla(0, 0%, 0%, 0.05)`,
+    medium: `0 ${u(0.5)} ${u(1.25)} hsla(0, 0%, 0%, 0.1)`,
+    large: `0 ${u(0.75)} ${u(3)} hsla(0, 0%, 0%, 0.1)`,
 };
 export const spaces = {
     xsmall: 0.5,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loomhq/lens",
-  "version": "10.28.0",
+  "version": "10.29.3",
   "scripts": {
     "dev": "next",
     "build:next": "next build",
@@ -22,7 +22,7 @@
     ]
   },
   "dependencies": {
-    "downshift": "^5.0.0",
+    "downshift": "^5.4.7",
     "lodash": "^4.17.21",
     "react-color": "^2.19.3",
     "react-laag": "^2.0.3",