@conveyorhq/arrow-ds 2.0.0-beta.1 → 2.0.0-beta.10

package/public/style-dictionary/src/width.js

@@ -0,0 +1,32 @@
+"use strict";
+const spacing = require("./spacing").spacing;
+module.exports = {
+    width: {
+        ...spacing,
+        "one-half": { value: "50%", tailwindId: "1/2" },
+        "one-third": { value: "33.33333%", tailwindId: "1/3" },
+        "two-thirds": { value: "66.66667%", tailwindId: "2/3" },
+        "one-quarter": { value: "25%", tailwindId: "1/4" },
+        "three-quarters": { value: "75%", tailwindId: "3/4" },
+        "one-fifth": { value: "20%", tailwindId: "1/5" },
+        "two-fifths": { value: "40%", tailwindId: "2/5" },
+        "three-fifths": { value: "60%", tailwindId: "3/5" },
+        "four-fifths": { value: "80%", tailwindId: "4/5" },
+        "one-sixth": { value: "16.66667%", tailwindId: "1/6" },
+        "five-sixths": { value: "83.33333%", tailwindId: "5/6" },
+        auto: { value: "auto" },
+        px: { value: "1px" },
+        full: { value: "100%" },
+        screen: { value: "100vw" },
+        "max-content": { value: "max-content" },
+        xs: { value: "20rem" },
+        sm: { value: "30rem" },
+        md: { value: "40rem" },
+        lg: { value: "50rem" },
+        xl: { value: "60rem" },
+        "two-xl": { value: "70rem", tailwindId: "2xl" },
+        "three-xl": { value: "80rem", tailwindId: "3xl" },
+        "four-xl": { value: "90rem", tailwindId: "4xl" },
+        "five-xl": { value: "100rem", tailwindId: "5xl" },
+    },
+};

package/public/style-dictionary/src/z-index.d.ts

@@ -0,0 +1,53 @@
+export const zIndex: {
+    auto: {
+        value: string;
+    };
+    "0": {
+        value: number;
+    };
+    "10": {
+        value: number;
+    };
+    "20": {
+        value: number;
+    };
+    "30": {
+        value: number;
+    };
+    "40": {
+        value: number;
+    };
+    "50": {
+        value: number;
+    };
+    below: {
+        value: number;
+    };
+    default: {
+        value: number;
+    };
+    popup: {
+        value: number;
+    };
+    dialog: {
+        value: number;
+    };
+    dropdown: {
+        value: number;
+    };
+    overlay: {
+        value: number;
+    };
+    menu: {
+        value: number;
+    };
+    modal: {
+        value: number;
+    };
+    toast: {
+        value: number;
+    };
+    max: {
+        value: number;
+    };
+};

package/public/style-dictionary/src/z-index.js

@@ -0,0 +1,22 @@
+"use strict";
+module.exports = {
+    zIndex: {
+        auto: { value: "auto" },
+        "0": { value: 0 },
+        "10": { value: 10 },
+        "20": { value: 20 },
+        "30": { value: 30 },
+        "40": { value: 40 },
+        "50": { value: 50 },
+        below: { value: -1 },
+        default: { value: 1 },
+        popup: { value: 400 },
+        dialog: { value: 500 },
+        dropdown: { value: 600 },
+        overlay: { value: 700 },
+        menu: { value: 800 },
+        modal: { value: 900 },
+        toast: { value: 1000 },
+        max: { value: 2147483647 },
+    },
+};

package/public/style-dictionary/tailwind.config.d.ts

@@ -0,0 +1,392 @@
+declare const colors: {
+    current: string;
+    transparent: string;
+    lighten: {
+        100: string;
+        200: string;
+        300: string;
+    };
+    gray: {
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    brandGreen: {
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    blue: {
+        0: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    green: {
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    gold: {
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    red: {
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    orange: {
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    pink: {
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    cyan: {
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    purple: {
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    white: string;
+    black: string;
+    brandBlack: string;
+    screen: string;
+    success: string;
+    failure: string;
+    caution: string;
+    border: string;
+    placeholder: string;
+    link: string;
+};
+declare const borderColor: {
+    current: string;
+    transparent: string;
+    lighten: {
+        100: string;
+        200: string;
+        300: string;
+    };
+    gray: {
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+        700: string;
+        800: string;
+        900: string;
+    };
+    brandGreen: {
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    blue: {
+        0: string;
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    green: {
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    gold: {
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    red: {
+        100: string;
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    orange: {
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    pink: {
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    cyan: {
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    purple: {
+        200: string;
+        300: string;
+        400: string;
+        500: string;
+        600: string;
+    };
+    white: string;
+    black: string;
+    brandBlack: string;
+    screen: string;
+    success: string;
+    failure: string;
+    caution: string;
+    border: string;
+    placeholder: string;
+    link: string;
+    DEFAULT: string;
+};
+import { borderRadius } from "./dist/tokens.module";
+import { borderWidth } from "./dist/tokens.module";
+import { shadow } from "./dist/tokens.module";
+import { type } from "./dist/tokens.module";
+import { fontSize } from "./dist/tokens.module";
+import { fontWeight } from "./dist/tokens.module";
+import { spacing } from "./dist/tokens.module";
+import { height } from "./dist/tokens.module";
+import { tracking } from "./dist/tokens.module";
+import { leading } from "./dist/tokens.module";
+declare const margin: {
+    auto: string;
+    px: string;
+    0: string;
+    1: string;
+    2: string;
+    3: string;
+    4: string;
+    5: string;
+    6: string;
+    7: string;
+    8: string;
+    9: string;
+    10: string;
+    11: string;
+    12: string;
+    13: string;
+    14: string;
+    15: string;
+    16: string;
+    17: string;
+    18: string;
+    19: string;
+    20: string;
+    21: string;
+    22: string;
+    23: string;
+    24: string;
+    25: string;
+    26: string;
+    27: string;
+    28: string;
+    29: string;
+    30: string;
+    31: string;
+    32: string;
+    33: string;
+    34: string;
+    35: string;
+    36: string;
+    37: string;
+    38: string;
+    39: string;
+    40: string;
+    41: string;
+    42: string;
+    43: string;
+    44: string;
+    45: string;
+    46: string;
+    47: string;
+    48: string;
+    49: string;
+    50: string;
+    51: string;
+    52: string;
+    53: string;
+    54: string;
+    55: string;
+    56: string;
+    57: string;
+    58: string;
+    59: string;
+    60: string;
+    61: string;
+    62: string;
+    63: string;
+    64: string;
+};
+import { width } from "./dist/tokens.module";
+declare const padding: {
+    px: string;
+    0: string;
+    1: string;
+    2: string;
+    3: string;
+    4: string;
+    5: string;
+    6: string;
+    7: string;
+    8: string;
+    9: string;
+    10: string;
+    11: string;
+    12: string;
+    13: string;
+    14: string;
+    15: string;
+    16: string;
+    17: string;
+    18: string;
+    19: string;
+    20: string;
+    21: string;
+    22: string;
+    23: string;
+    24: string;
+    25: string;
+    26: string;
+    27: string;
+    28: string;
+    29: string;
+    30: string;
+    31: string;
+    32: string;
+    33: string;
+    34: string;
+    35: string;
+    36: string;
+    37: string;
+    38: string;
+    39: string;
+    40: string;
+    41: string;
+    42: string;
+    43: string;
+    44: string;
+    45: string;
+    46: string;
+    47: string;
+    48: string;
+    49: string;
+    50: string;
+    51: string;
+    52: string;
+    53: string;
+    54: string;
+    55: string;
+    56: string;
+    57: string;
+    58: string;
+    59: string;
+    60: string;
+    61: string;
+    62: string;
+    63: string;
+    64: string;
+};
+import { screenWidth } from "./dist/tokens.module";
+declare namespace willChange {
+    const auto: string;
+    const scroll: string;
+    const contents: string;
+    const opacity: string;
+    const transform: string;
+}
+import { zIndex } from "./dist/tokens.module";
+declare namespace extend {
+    namespace transitionProperty {
+        const input: string[];
+    }
+}
+export namespace config {
+    const content: never[];
+    namespace theme {
+        export { colors as backgroundColor };
+        export { borderColor };
+        export { borderRadius };
+        export { borderWidth };
+        export { shadow as boxShadow };
+        export { colors };
+        export { type as fontFamily };
+        export { fontSize };
+        export { fontWeight };
+        export { spacing as gap };
+        export { height };
+        export { tracking as letterSpacing };
+        export { leading as lineHeight };
+        export { margin };
+        export { height as maxHeight };
+        export { width as maxWidth };
+        export { height as minHeight };
+        export { width as minWidth };
+        export { padding };
+        export { screenWidth as screens };
+        export { spacing };
+        export { colors as textColor };
+        export { width };
+        export { willChange };
+        export { zIndex };
+        export { extend };
+    }
+    const plugins: never[];
+}
+export {};

package/public/style-dictionary/tailwind.config.js

@@ -0,0 +1,66 @@
+"use strict";
+const { borderRadius, borderWidth, color, fontSize, fontWeight, height, leading, screenWidth, shadow, spacing, tracking, type, width, zIndex, } = require("./dist/tokens.module");
+const colors = {
+    ...color,
+    current: "currentColor",
+    transparent: "transparent",
+};
+const borderColor = {
+    DEFAULT: color.gray[400],
+    ...colors,
+};
+const margin = {
+    ...spacing,
+    auto: "auto",
+    px: "1px",
+};
+const padding = {
+    ...spacing,
+    px: "1px",
+};
+const willChange = {
+    auto: "auto",
+    scroll: "scroll-position",
+    contents: "contents",
+    opacity: "opacity",
+    transform: "transform",
+};
+const extend = {
+    transitionProperty: {
+        input: ["border-color", "box-shadow", "color"],
+    },
+};
+module.exports = {
+    config: {
+        content: [],
+        theme: {
+            backgroundColor: colors,
+            borderColor,
+            borderRadius,
+            borderWidth,
+            boxShadow: shadow,
+            colors,
+            fontFamily: type,
+            fontSize,
+            fontWeight,
+            gap: spacing,
+            height,
+            letterSpacing: tracking,
+            lineHeight: leading,
+            margin,
+            maxHeight: height,
+            maxWidth: width,
+            minHeight: height,
+            minWidth: width,
+            padding,
+            screens: screenWidth,
+            spacing,
+            textColor: colors,
+            width,
+            willChange,
+            zIndex,
+            extend,
+        },
+        plugins: [],
+    },
+};

package/public/tokens/box-shadow.d.ts

@@ -13,4 +13,5 @@ export declare const boxShadow: {
     buttonPrimary: string;
     buttonSecondary: string;
     paper: string;
+    tile: string;
 };

package/public/tokens/box-shadow.js

@@ -2,18 +2,19 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.boxShadow = void 0;
 exports.boxShadow = {
-    DEFAULT: "0 2px 4px 0 rgba(0,0,0,0.10)",
-    up: "0 -2px 4px 0 rgba(0,0,0,0.10)",
-    md: "0 4px 8px 0 rgba(0,0,0,0.12), 0 2px 4px 0 rgba(0,0,0,0.08)",
-    lg: "0 15px 30px 0 rgba(0,0,0,0.11), 0 5px 15px 0 rgba(0,0,0,0.08)",
-    inner: "inset 0 2px 4px 0 rgba(0,0,0,0.06)",
+    DEFAULT: "0 2px 4px 0 rgba(32, 65, 86, 0.10)",
+    up: "0 -2px 4px 0 rgba(32, 65, 86, 0.10)",
+    md: "0 4px 8px 0 rgba(32, 65, 86, 0.12), 0 2px 4px 0 rgba(32, 65, 86, 0.08)",
+    lg: "0 15px 30px 0 rgba(32, 65, 86, 0.11), 0 5px 15px 0 rgba(32, 65, 86, 0.08)",
+    inner: "inset 0 2px 4px 0 rgba(32, 65, 86, 0.06)",
     glow: "rgba(7,114,239,0.2) 0 0 1rem",
     none: "none",
     focus: "rgba(7, 114, 239, 0.2) 0 0 1px 3px",
     focusInside: "rgba(7, 114, 239, 0.2) 0 0 1px 3px inset",
     focusBrand: "rgba(125, 229, 202, 0.2) 0 0 1px 3px",
-    popover: "0 0 3px rgba(0, 0, 0, 0.1), 0 10px 20px rgba(0, 0, 0, 0.1)",
-    buttonPrimary: "0 4px 8px rgba(255, 255, 255, 0.1) inset, 0 2px 5px rgba(0, 0, 0, 0.1)",
-    buttonSecondary: "0 1px 3px rgba(0, 0, 0, 0.05)",
-    paper: "0 0 3px rgba(0,0,0,0.1), 9px 9px rgba(0,0,0,0.04)",
+    popover: "0 0 3px rgba(32, 65, 86, 0.1), 0 10px 20px rgba(32, 65, 86, 0.1)",
+    buttonPrimary: "0 4px 8px rgba(255, 255, 255, 0.1) inset, 0 2px 5px rgba(32, 65, 86, 0.1)",
+    buttonSecondary: "0 1px 3px rgba(32, 65, 86, 0.05)",
+    paper: "0 0 3px rgba(32, 65, 86, 0.1), 9px 9px rgba(32, 65, 86, 0.04)",
+    tile: "0 10px 20px rgba(32, 65, 86, 0.1), 0 0 3px rgba(32, 65, 86, 0.1)",
 };

package/public/tokens/font-family.js

@@ -17,7 +17,7 @@ exports.fontFamily = {
         "Helvetica Neue",
         "sans-serif",
     ],
-    serif: ["IBM Plex Serif", "serif"],
+    serif: ["Copernicus", "serif"],
     mono: [
         "Menlo",
         "Monaco",