@loomhq/lens 10.76.4 → 10.77.1

package/dist/components/avatar/avatar.js

@@ -45,7 +45,7 @@ const AvatarWrapper = styled.span `
   align-items: center;
   justify-content: center;
   line-height: 1;
-  font-weight: var(--lns-fontWeight-medium);
+  font-weight: var(--lns-fontWeight-bold);
   ${props => getAvatarSize(props.size)};
   position: relative;
   z-index: 0;

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

@@ -187,6 +187,7 @@ export { default as SvgVolumeMute } from "./volume-mute.js";
 export { default as SvgVolumeOff } from "./volume-off.js";
 export { default as SvgVolumeUp } from "./volume-up.js";
 export { default as SvgVolumeX } from "./volume-x.js";
+export { default as SvgWarningAlert } from "./warning-alert.js";
 export { default as SvgWarningAmber } from "./warning-amber.js";
 export { default as SvgXCircle } from "./x-circle.js";
 export { default as SvgZap } from "./zap.js";

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

@@ -187,6 +187,7 @@ export { default as SvgVolumeMute } from './volume-mute.js';
 export { default as SvgVolumeOff } from './volume-off.js';
 export { default as SvgVolumeUp } from './volume-up.js';
 export { default as SvgVolumeX } from './volume-x.js';
+export { default as SvgWarningAlert } from './warning-alert.js';
 export { default as SvgWarningAmber } from './warning-amber.js';
 export { default as SvgXCircle } from './x-circle.js';
 export { default as SvgZap } from './zap.js';

package/dist/components/icon/available-icons/warning-alert.d.ts

@@ -0,0 +1,2 @@
+export default SvgWarningAlert;
+declare function SvgWarningAlert(props: any): JSX.Element;

package/dist/components/icon/available-icons/warning-alert.js

@@ -0,0 +1,4 @@
+import React from 'react';
+const SvgWarningAlert = props => (React.createElement("svg", Object.assign({ viewBox: "0 0 24 24", fill: "none" }, props),
+    React.createElement("path", { fill: "currentColor", fillRule: "evenodd", clipRule: "evenodd", d: "M7.42 2.293A1 1 0 0 1 8.127 2h7.245a1 1 0 0 1 .708.293l5.127 5.127a1 1 0 0 1 .293.707v7.245a1 1 0 0 1-.293.708l-5.127 5.127a1 1 0 0 1-.707.293H8.128a1 1 0 0 1-.708-.293L2.293 16.08A1 1 0 0 1 2 15.373V8.128a1 1 0 0 1 .293-.708L7.42 2.293ZM8.542 4 4 8.542v6.416L8.542 19.5h6.416l4.542-4.542V8.542L14.958 4H8.542Zm2.208 11.25a1 1 0 0 1 1-1h.009a1 1 0 1 1 0 2h-.009a1 1 0 0 1-1-1Zm2-7a1 1 0 1 0-2 0v3.5a1 1 0 1 0 2 0v-3.5Z" })));
+export default SvgWarningAlert;

package/dist/components/text/text.d.ts

@@ -11,12 +11,13 @@ export declare const lineHeightToPx: (size: any) => number;
 declare const TextWrapper: import("@emotion/styled-base").StyledComponent<React.DetailedHTMLProps<React.HTMLAttributes<HTMLSpanElement>, HTMLSpanElement>, TextWrapperProps, object>;
 declare const Text: ({ children, size, color, isInline, isDimmed, fontWeight, hasEllipsis, ellipsisLines, variant, htmlTag, alignment, sizeMinMax, ...props }: TextProps & React.ComponentProps<typeof TextWrapper>) => JSX.Element;
 export declare const availableSizes: string[];
+export declare const deprecatedSizes: string[];
 export declare const availableFontWeights: string[];
 export declare const availableHtmlTags: string[];
 export declare const alignments: string[];
 interface TextProps {
-    size?: 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge';
-    fontWeight?: 'regular' | 'medium' | 'bold' | 'black';
+    size?: 'body-sm' | 'body-md' | 'body-lg' | 'heading-sm' | 'heading-md' | 'heading-lg' | 'small' | 'medium' | 'large' | 'xlarge' | 'xxlarge' | 'xxxlarge';
+    fontWeight?: 'book' | 'bold';
     variant?: 'body' | 'title' | 'mainTitle';
     alignment?: 'left' | 'right' | 'center';
     color?: string;

package/dist/components/text/text.js

@@ -17,16 +17,16 @@ import { textIsDimmedDeprecated } from '../../console-messages';
 export const dimAmount = 0.6;
 export const variants = {
     body: {
-        size: 'medium',
-        fontWeight: 'regular',
+        size: 'body-md',
+        fontWeight: 'book',
     },
     title: {
-        size: 'large',
+        size: 'body-lg',
         fontWeight: 'bold',
     },
     mainTitle: {
-        size: 'xxlarge',
-        fontWeight: 'black',
+        size: 'heading-md',
+        fontWeight: 'bold',
     },
 };
 const getTextPxSize = size => textSizes[size].fontSize * unit;
@@ -77,13 +77,21 @@ const TextWrapper = styled.span `
   `}
 `;
 const Text = (_a) => {
-    var { children, size = 'medium', color, isInline, isDimmed, fontWeight = 'regular', hasEllipsis, ellipsisLines, variant, htmlTag = 'span', alignment, sizeMinMax } = _a, props = __rest(_a, ["children", "size", "color", "isInline", "isDimmed", "fontWeight", "hasEllipsis", "ellipsisLines", "variant", "htmlTag", "alignment", "sizeMinMax"]);
+    var { children, size = 'body-md', color, isInline, isDimmed, fontWeight = 'book', hasEllipsis, ellipsisLines, variant, htmlTag = 'span', alignment, sizeMinMax } = _a, props = __rest(_a, ["children", "size", "color", "isInline", "isDimmed", "fontWeight", "hasEllipsis", "ellipsisLines", "variant", "htmlTag", "alignment", "sizeMinMax"]);
     if (isDimmed) {
         console.warn(textIsDimmedDeprecated);
     }
     return (React.createElement(TextWrapper, Object.assign({ size: variant ? variants[variant].size : size, color: color, isInline: isInline, isDimmed: isDimmed, fontWeight: variant ? variants[variant].fontWeight : fontWeight, hasEllipsis: hasEllipsis, ellipsisLines: ellipsisLines, variant: variant, as: htmlTag, alignment: alignment, sizeMinMax: sizeMinMax }, props), children));
 };
 export const availableSizes = [
+    'body-sm',
+    'body-md',
+    'body-lg',
+    'heading-sm',
+    'heading-md',
+    'heading-lg',
+];
+export const deprecatedSizes = [
     'small',
     'medium',
     'large',
@@ -91,7 +99,7 @@ export const availableSizes = [
     'xxlarge',
     'xxxlarge',
 ];
-export const availableFontWeights = ['regular', 'medium'];
+export const availableFontWeights = ['book', 'bold'];
 export const availableHtmlTags = ['h1', 'h2', 'h3', 'h4', 'p', 'span', 'div'];
 export const alignments = ['left', 'right', 'center'];
 export default Text;

package/dist/components/tooltip/tooltip.js

@@ -149,7 +149,7 @@ const Tooltip = (_a) => {
             renderLayer(React.createElement("div", Object.assign({}, layerProps, { style: Object.assign(Object.assign({}, layerProps.style), { zIndex }) }),
                 React.createElement(TooltipBox, Object.assign({ maxWidth: maxWidth, onMouseEnter: () => setIsOverTooltip(true), onMouseLeave: () => setIsOverTooltip(false) }, rest),
                     React.createElement(Arrange, { gap: "small" },
-                        React.createElement(Text, { size: "small", fontWeight: "medium" }, content),
+                        React.createElement(Text, { size: "small", fontWeight: "bold" }, content),
                         shortcut && (React.createElement(Arrange, { gap: "xsmall" }, shortcut.map((char, index) => (React.createElement(ShortcutBox, { key: index }, char)))))))))));
 };
 export const availablePlacements = Object.keys(placements);

package/dist/variables.d.ts

@@ -1,84 +1,90 @@
 export const unit: 8;
-export namespace textSizes {
-    namespace small {
-        const fontSize: number;
-        const lineHeight: number;
-    }
-    namespace medium {
-        const fontSize_1: number;
-        export { fontSize_1 as fontSize };
-        const lineHeight_1: number;
-        export { lineHeight_1 as lineHeight };
-    }
-    namespace large {
-        const fontSize_2: number;
-        export { fontSize_2 as fontSize };
-        const lineHeight_2: number;
-        export { lineHeight_2 as lineHeight };
-    }
-    namespace xlarge {
-        const fontSize_3: number;
-        export { fontSize_3 as fontSize };
-        const lineHeight_3: number;
-        export { lineHeight_3 as lineHeight };
-    }
-    namespace xxlarge {
-        const fontSize_4: number;
-        export { fontSize_4 as fontSize };
-        const lineHeight_4: number;
-        export { lineHeight_4 as lineHeight };
-    }
-    namespace xxxlarge {
-        const fontSize_5: number;
-        export { fontSize_5 as fontSize };
-        const lineHeight_5: number;
-        export { lineHeight_5 as lineHeight };
-    }
-}
+export const textSizes: {
+    small: {
+        fontSize: number;
+        lineHeight: number;
+    };
+    'body-sm': {
+        fontSize: number;
+        lineHeight: number;
+    };
+    medium: {
+        fontSize: number;
+        lineHeight: number;
+    };
+    'body-md': {
+        fontSize: number;
+        lineHeight: number;
+    };
+    large: {
+        fontSize: number;
+        lineHeight: number;
+    };
+    'body-lg': {
+        fontSize: number;
+        lineHeight: number;
+    };
+    xlarge: {
+        fontSize: number;
+        lineHeight: number;
+    };
+    'heading-sm': {
+        fontSize: number;
+        lineHeight: number;
+    };
+    xxlarge: {
+        fontSize: number;
+        lineHeight: number;
+    };
+    'heading-md': {
+        fontSize: number;
+        lineHeight: number;
+    };
+    xxxlarge: {
+        fontSize: number;
+        lineHeight: number;
+    };
+    'heading-lg': {
+        fontSize: number;
+        lineHeight: number;
+    };
+};
 export namespace fontWeights {
-    export const regular: number;
-    const medium_1: number;
-    export { medium_1 as medium };
-    export const bold: number;
-    export const black: number;
+    const book: number;
+    const bold: number;
 }
 export namespace radii {
-    const medium_2: string;
-    export { medium_2 as medium };
-    const large_1: string;
-    export { large_1 as large };
-    const xlarge_1: string;
-    export { xlarge_1 as xlarge };
-    export const full: string;
+    const medium: string;
+    const large: string;
+    const xlarge: string;
+    const full: string;
 }
 export namespace shadows {
-    const small_1: string;
-    export { small_1 as small };
-    const medium_3: string;
-    export { medium_3 as medium };
-    const large_2: string;
-    export { large_2 as large };
+    export const small: string;
+    const medium_1: string;
+    export { medium_1 as medium };
+    const large_1: string;
+    export { large_1 as large };
 }
 export namespace spaces {
     export const xsmall: number;
-    const small_2: number;
-    export { small_2 as small };
-    const medium_4: number;
-    export { medium_4 as medium };
-    const large_3: number;
-    export { large_3 as large };
-    const xlarge_2: number;
-    export { xlarge_2 as xlarge };
-    const xxlarge_1: number;
-    export { xxlarge_1 as xxlarge };
+    const small_1: number;
+    export { small_1 as small };
+    const medium_2: number;
+    export { medium_2 as medium };
+    const large_2: number;
+    export { large_2 as large };
+    const xlarge_1: number;
+    export { xlarge_1 as xlarge };
+    export const xxlarge: number;
 }
 export namespace breakpoints {
     const xsmall_1: string;
     export { xsmall_1 as xsmall };
-    const small_3: string;
-    export { small_3 as small };
-    const medium_5: string;
-    export { medium_5 as medium };
-    const large_4: string;
-    export { large_4 as large };
+    const small_2: string;
+    export { small_2 as small };
+    const medium_3: string;
+    export { medium_3 as medium };
+    const large_3: string;
+    export { large_3 as large };
 }

package/dist/variables.js

@@ -5,32 +5,54 @@ export const textSizes = {
         fontSize: 1.5,
         lineHeight: 1.5,
     },
+    'body-sm': {
+        fontSize: 1.5,
+        lineHeight: 1.5,
+    },
     medium: {
         fontSize: 1.75,
         lineHeight: 1.6,
     },
+    'body-md': {
+        fontSize: 1.75,
+        lineHeight: 1.6,
+    },
     large: {
         fontSize: 2.25,
         lineHeight: 1.45,
     },
+    'body-lg': {
+        fontSize: 2.25,
+        lineHeight: 1.45,
+    },
     xlarge: {
         fontSize: 3,
         lineHeight: 1.35,
     },
+    'heading-sm': {
+        fontSize: 3,
+        lineHeight: 1.35,
+    },
     xxlarge: {
         fontSize: 4,
         lineHeight: 1.2,
     },
+    'heading-md': {
+        fontSize: 4,
+        lineHeight: 1.2,
+    },
     xxxlarge: {
         fontSize: 6,
         lineHeight: 1.15,
     },
+    'heading-lg': {
+        fontSize: 6,
+        lineHeight: 1.15,
+    },
 };
 export const fontWeights = {
-    regular: 400,
-    medium: 500,
+    book: 400,
     bold: 700,
-    black: 900,
 };
 export const radii = {
     medium: u(1),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@loomhq/lens",
-  "version": "10.76.4",
+  "version": "10.77.1",
   "scripts": {
     "dev": "next",
     "build:next": "next build",