kaleido-ui 0.1.0

package/dist/tailwind/index.cjs

@@ -0,0 +1,235 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+
+// src/tailwind/index.ts
+var tailwind_exports = {};
+__export(tailwind_exports, {
+  default: () => tailwind_default
+});
+module.exports = __toCommonJS(tailwind_exports);
+
+// src/tokens/colors.ts
+var colors = {
+  /** Brand */
+  primary: "#2BEE79",
+  primaryDark: "#1FA855",
+  primaryFg: "#102217",
+  /** Surfaces (dark theme — the default) */
+  bgDark: "#102217",
+  surfaceDark: "#162E21",
+  surfaceHighlight: "#243E30",
+  surfaceBorder: "#244A35",
+  surfaceDarker: "#0B1810",
+  /** Surfaces (light theme) */
+  bgLight: "#F6F8F7",
+  surfaceLight: "#FFFFFF",
+  /** Text */
+  textPrimary: "#FFFFFF",
+  textSecondary: "#92C9A8",
+  textMuted: "rgba(255,255,255,0.5)",
+  textDimmed: "rgba(255,255,255,0.35)",
+  /** Semantic */
+  success: "#2BEE79",
+  warning: "#F59E0B",
+  error: "#F94040",
+  info: "#4290FF",
+  /** Network / Layer */
+  network: {
+    bitcoin: "#F7931A",
+    rgb: "#DD352E",
+    arkade: "#7C3AED",
+    spark: "#FF6D00",
+    lightning: "#F6C343"
+  },
+  /** Transaction direction */
+  tx: {
+    sent: "#F94040",
+    receive: "#2BEE79",
+    swap: "#4290FF"
+  }
+};
+
+// src/tokens/typography.ts
+var fontFamily = {
+  display: "'Geist Sans', system-ui, -apple-system, sans-serif",
+  mono: "'Geist Mono', monospace"
+};
+var typeScale = {
+  xxs: ["10px", "14px"],
+  tiny: ["11px", "16px"],
+  caption: ["13px", "18px"],
+  body: ["15px", "22px"],
+  subhead: ["17px", "24px"],
+  title: ["20px", "28px"],
+  headline: ["28px", "34px"],
+  display: ["36px", "40px"]
+};
+
+// src/tokens/radius.ts
+var radius = {
+  sm: "8px",
+  md: "12px",
+  lg: "16px",
+  xl: "20px",
+  card: "20px",
+  panel: "22px",
+  pill: "24px",
+  nav: "14px",
+  full: "9999px"
+};
+
+// src/tokens/shadows.ts
+var shadow = {
+  glow: "0 0 20px rgba(43, 238, 121, 0.15)",
+  glowStrong: "0 0 30px rgba(43, 238, 121, 0.3)",
+  glowSubtle: "0 0 15px rgba(43, 238, 121, 0.15)",
+  glowAccent: "0 4px 30px rgba(43, 238, 121, 0.25)"
+};
+
+// src/tailwind/index.ts
+var preset = {
+  darkMode: ["class"],
+  theme: {
+    extend: {
+      colors: {
+        border: "hsl(var(--border))",
+        input: "hsl(var(--input))",
+        ring: "hsl(var(--ring))",
+        background: "hsl(var(--background))",
+        foreground: "hsl(var(--foreground))",
+        primary: {
+          DEFAULT: colors.primary,
+          foreground: colors.primaryFg,
+          dark: colors.primaryDark
+        },
+        secondary: {
+          DEFAULT: "hsl(var(--secondary))",
+          foreground: "hsl(var(--secondary-foreground))"
+        },
+        destructive: {
+          DEFAULT: "hsl(var(--destructive))",
+          foreground: "hsl(var(--destructive-foreground))"
+        },
+        muted: {
+          DEFAULT: "hsl(var(--muted))",
+          foreground: "hsl(var(--muted-foreground))"
+        },
+        accent: {
+          DEFAULT: "hsl(var(--accent))",
+          foreground: "hsl(var(--accent-foreground))"
+        },
+        popover: {
+          DEFAULT: "hsl(var(--popover))",
+          foreground: "hsl(var(--popover-foreground))"
+        },
+        card: {
+          DEFAULT: "hsl(var(--card))",
+          foreground: "hsl(var(--card-foreground))"
+        },
+        network: colors.network,
+        tx: colors.tx,
+        "background-light": colors.bgLight,
+        "background-dark": colors.bgDark,
+        "surface-dark": colors.surfaceDark,
+        "surface-light": colors.surfaceLight,
+        "surface-highlight": colors.surfaceHighlight,
+        "surface-border": colors.surfaceBorder,
+        "surface-darker": colors.surfaceDarker
+      },
+      fontFamily: {
+        display: fontFamily.display.split(", "),
+        mono: fontFamily.mono.split(", ")
+      },
+      fontSize: Object.fromEntries(
+        Object.entries(typeScale).map(([key, [size, lh]]) => [
+          key,
+          [size, { lineHeight: lh }]
+        ])
+      ),
+      borderRadius: {
+        lg: "var(--radius)",
+        md: "calc(var(--radius) - 2px)",
+        sm: "calc(var(--radius) - 4px)",
+        xl: "0.75rem",
+        "2xl": "1rem",
+        "3xl": "1.5rem",
+        card: radius.card,
+        panel: radius.panel,
+        pill: radius.pill,
+        nav: radius.nav
+      },
+      boxShadow: {
+        glow: shadow.glow,
+        "glow-strong": shadow.glowStrong,
+        "glow-subtle": shadow.glowSubtle
+      },
+      keyframes: {
+        "accordion-down": {
+          from: { height: "0" },
+          to: { height: "var(--radix-accordion-content-height)" }
+        },
+        "accordion-up": {
+          from: { height: "var(--radix-accordion-content-height)" },
+          to: { height: "0" }
+        },
+        "pulse-glow": {
+          "0%, 100%": { boxShadow: "0 0 20px rgba(43, 238, 121, 0.2)" },
+          "50%": { boxShadow: "0 0 30px rgba(43, 238, 121, 0.4)" }
+        },
+        "fade-in": {
+          from: { opacity: "0" },
+          to: { opacity: "1" }
+        },
+        "slide-up": {
+          from: { opacity: "0", transform: "translateY(10px)" },
+          to: { opacity: "1", transform: "translateY(0)" }
+        },
+        "slide-in-from-bottom": {
+          from: { opacity: "0", transform: "translateY(20px)" },
+          to: { opacity: "1", transform: "translateY(0)" }
+        },
+        shimmer: {
+          "0%": { backgroundPosition: "-200% 0" },
+          "100%": { backgroundPosition: "200% 0" }
+        },
+        "stagger-up": {
+          "0%": { opacity: "0", transform: "translateY(15px)" },
+          "100%": { opacity: "1", transform: "translateY(0)" }
+        },
+        "bounce-slight": {
+          "0%, 100%": { transform: "translateY(-5%)" },
+          "50%": { transform: "translateY(0)" }
+        }
+      },
+      animation: {
+        "accordion-down": "accordion-down 0.2s ease-out",
+        "accordion-up": "accordion-up 0.2s ease-out",
+        "pulse-glow": "pulse-glow 2s ease-in-out infinite",
+        "fade-in": "fade-in 0.3s ease-out",
+        "slide-up": "slide-up 0.3s ease-out",
+        "slide-in-from-bottom": "slide-in-from-bottom 0.4s ease-out",
+        "stagger-up": "stagger-up 0.5s cubic-bezier(0.16, 1, 0.3, 1) backwards",
+        shimmer: "shimmer 2s linear infinite",
+        "bounce-slight": "bounce-slight 2s infinite"
+      }
+    }
+  },
+  plugins: []
+};
+var tailwind_default = preset;

package/dist/tailwind/index.d.cts

@@ -0,0 +1,182 @@
+declare const preset: {
+    darkMode: readonly ["class"];
+    theme: {
+        extend: {
+            colors: {
+                border: string;
+                input: string;
+                ring: string;
+                background: string;
+                foreground: string;
+                primary: {
+                    DEFAULT: "#2BEE79";
+                    foreground: "#102217";
+                    dark: "#1FA855";
+                };
+                secondary: {
+                    DEFAULT: string;
+                    foreground: string;
+                };
+                destructive: {
+                    DEFAULT: string;
+                    foreground: string;
+                };
+                muted: {
+                    DEFAULT: string;
+                    foreground: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    foreground: string;
+                };
+                popover: {
+                    DEFAULT: string;
+                    foreground: string;
+                };
+                card: {
+                    DEFAULT: string;
+                    foreground: string;
+                };
+                network: {
+                    readonly bitcoin: "#F7931A";
+                    readonly rgb: "#DD352E";
+                    readonly arkade: "#7C3AED";
+                    readonly spark: "#FF6D00";
+                    readonly lightning: "#F6C343";
+                };
+                tx: {
+                    readonly sent: "#F94040";
+                    readonly receive: "#2BEE79";
+                    readonly swap: "#4290FF";
+                };
+                'background-light': "#F6F8F7";
+                'background-dark': "#102217";
+                'surface-dark': "#162E21";
+                'surface-light': "#FFFFFF";
+                'surface-highlight': "#243E30";
+                'surface-border': "#244A35";
+                'surface-darker': "#0B1810";
+            };
+            fontFamily: {
+                display: string[];
+                mono: string[];
+            };
+            fontSize: {
+                [k: string]: ("10px" | "11px" | "13px" | "15px" | "17px" | "20px" | "28px" | "36px" | {
+                    lineHeight: "14px" | "16px" | "18px" | "22px" | "24px" | "28px" | "34px" | "40px";
+                })[];
+            };
+            borderRadius: {
+                lg: string;
+                md: string;
+                sm: string;
+                xl: string;
+                '2xl': string;
+                '3xl': string;
+                card: "20px";
+                panel: "22px";
+                pill: "24px";
+                nav: "14px";
+            };
+            boxShadow: {
+                glow: "0 0 20px rgba(43, 238, 121, 0.15)";
+                'glow-strong': "0 0 30px rgba(43, 238, 121, 0.3)";
+                'glow-subtle': "0 0 15px rgba(43, 238, 121, 0.15)";
+            };
+            keyframes: {
+                'accordion-down': {
+                    from: {
+                        height: string;
+                    };
+                    to: {
+                        height: string;
+                    };
+                };
+                'accordion-up': {
+                    from: {
+                        height: string;
+                    };
+                    to: {
+                        height: string;
+                    };
+                };
+                'pulse-glow': {
+                    '0%, 100%': {
+                        boxShadow: string;
+                    };
+                    '50%': {
+                        boxShadow: string;
+                    };
+                };
+                'fade-in': {
+                    from: {
+                        opacity: string;
+                    };
+                    to: {
+                        opacity: string;
+                    };
+                };
+                'slide-up': {
+                    from: {
+                        opacity: string;
+                        transform: string;
+                    };
+                    to: {
+                        opacity: string;
+                        transform: string;
+                    };
+                };
+                'slide-in-from-bottom': {
+                    from: {
+                        opacity: string;
+                        transform: string;
+                    };
+                    to: {
+                        opacity: string;
+                        transform: string;
+                    };
+                };
+                shimmer: {
+                    '0%': {
+                        backgroundPosition: string;
+                    };
+                    '100%': {
+                        backgroundPosition: string;
+                    };
+                };
+                'stagger-up': {
+                    '0%': {
+                        opacity: string;
+                        transform: string;
+                    };
+                    '100%': {
+                        opacity: string;
+                        transform: string;
+                    };
+                };
+                'bounce-slight': {
+                    '0%, 100%': {
+                        transform: string;
+                    };
+                    '50%': {
+                        transform: string;
+                    };
+                };
+            };
+            animation: {
+                'accordion-down': string;
+                'accordion-up': string;
+                'pulse-glow': string;
+                'fade-in': string;
+                'slide-up': string;
+                'slide-in-from-bottom': string;
+                'stagger-up': string;
+                shimmer: string;
+                'bounce-slight': string;
+            };
+        };
+    };
+    plugins: any[];
+};
+
+export { preset as default };

package/dist/tailwind/index.d.ts

@@ -0,0 +1,182 @@
+declare const preset: {
+    darkMode: readonly ["class"];
+    theme: {
+        extend: {
+            colors: {
+                border: string;
+                input: string;
+                ring: string;
+                background: string;
+                foreground: string;
+                primary: {
+                    DEFAULT: "#2BEE79";
+                    foreground: "#102217";
+                    dark: "#1FA855";
+                };
+                secondary: {
+                    DEFAULT: string;
+                    foreground: string;
+                };
+                destructive: {
+                    DEFAULT: string;
+                    foreground: string;
+                };
+                muted: {
+                    DEFAULT: string;
+                    foreground: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    foreground: string;
+                };
+                popover: {
+                    DEFAULT: string;
+                    foreground: string;
+                };
+                card: {
+                    DEFAULT: string;
+                    foreground: string;
+                };
+                network: {
+                    readonly bitcoin: "#F7931A";
+                    readonly rgb: "#DD352E";
+                    readonly arkade: "#7C3AED";
+                    readonly spark: "#FF6D00";
+                    readonly lightning: "#F6C343";
+                };
+                tx: {
+                    readonly sent: "#F94040";
+                    readonly receive: "#2BEE79";
+                    readonly swap: "#4290FF";
+                };
+                'background-light': "#F6F8F7";
+                'background-dark': "#102217";
+                'surface-dark': "#162E21";
+                'surface-light': "#FFFFFF";
+                'surface-highlight': "#243E30";
+                'surface-border': "#244A35";
+                'surface-darker': "#0B1810";
+            };
+            fontFamily: {
+                display: string[];
+                mono: string[];
+            };
+            fontSize: {
+                [k: string]: ("10px" | "11px" | "13px" | "15px" | "17px" | "20px" | "28px" | "36px" | {
+                    lineHeight: "14px" | "16px" | "18px" | "22px" | "24px" | "28px" | "34px" | "40px";
+                })[];
+            };
+            borderRadius: {
+                lg: string;
+                md: string;
+                sm: string;
+                xl: string;
+                '2xl': string;
+                '3xl': string;
+                card: "20px";
+                panel: "22px";
+                pill: "24px";
+                nav: "14px";
+            };
+            boxShadow: {
+                glow: "0 0 20px rgba(43, 238, 121, 0.15)";
+                'glow-strong': "0 0 30px rgba(43, 238, 121, 0.3)";
+                'glow-subtle': "0 0 15px rgba(43, 238, 121, 0.15)";
+            };
+            keyframes: {
+                'accordion-down': {
+                    from: {
+                        height: string;
+                    };
+                    to: {
+                        height: string;
+                    };
+                };
+                'accordion-up': {
+                    from: {
+                        height: string;
+                    };
+                    to: {
+                        height: string;
+                    };
+                };
+                'pulse-glow': {
+                    '0%, 100%': {
+                        boxShadow: string;
+                    };
+                    '50%': {
+                        boxShadow: string;
+                    };
+                };
+                'fade-in': {
+                    from: {
+                        opacity: string;
+                    };
+                    to: {
+                        opacity: string;
+                    };
+                };
+                'slide-up': {
+                    from: {
+                        opacity: string;
+                        transform: string;
+                    };
+                    to: {
+                        opacity: string;
+                        transform: string;
+                    };
+                };
+                'slide-in-from-bottom': {
+                    from: {
+                        opacity: string;
+                        transform: string;
+                    };
+                    to: {
+                        opacity: string;
+                        transform: string;
+                    };
+                };
+                shimmer: {
+                    '0%': {
+                        backgroundPosition: string;
+                    };
+                    '100%': {
+                        backgroundPosition: string;
+                    };
+                };
+                'stagger-up': {
+                    '0%': {
+                        opacity: string;
+                        transform: string;
+                    };
+                    '100%': {
+                        opacity: string;
+                        transform: string;
+                    };
+                };
+                'bounce-slight': {
+                    '0%, 100%': {
+                        transform: string;
+                    };
+                    '50%': {
+                        transform: string;
+                    };
+                };
+            };
+            animation: {
+                'accordion-down': string;
+                'accordion-up': string;
+                'pulse-glow': string;
+                'fade-in': string;
+                'slide-up': string;
+                'slide-in-from-bottom': string;
+                'stagger-up': string;
+                shimmer: string;
+                'bounce-slight': string;
+            };
+        };
+    };
+    plugins: any[];
+};
+
+export { preset as default };