@nebutra/ui 0.1.0 → 0.2.1

package/dist/typography/index.js

@@ -0,0 +1,374 @@
+// src/typography/fonts.ts
+var fonts = {
+  inter: {
+    family: "Inter",
+    weights: [300, 400, 500, 600, 700],
+    italic: false,
+    display: "swap",
+    variable: true,
+    googleFontsParam: "Inter:wght@300;400;500;600;700",
+    license: "OFL",
+    licenseUrl: "https://github.com/rsms/inter/blob/master/LICENSE.txt"
+  },
+  publicSans: {
+    family: "Public Sans",
+    weights: [300, 400, 500, 600, 700],
+    italic: true,
+    display: "swap",
+    variable: true,
+    googleFontsParam: "Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400;1,500",
+    license: "OFL",
+    licenseUrl: "https://github.com/uswds/public-sans/blob/develop/LICENSE.md"
+  },
+  jetbrainsMono: {
+    family: "JetBrains Mono",
+    weights: [400, 500, 700],
+    italic: false,
+    display: "swap",
+    variable: true,
+    googleFontsParam: "JetBrains+Mono:wght@400;500;700",
+    license: "OFL",
+    licenseUrl: "https://github.com/JetBrains/JetBrainsMono/blob/master/OFL.txt"
+  },
+  sourceHanSans: {
+    family: "Noto Sans SC",
+    weights: [400, 500, 700],
+    italic: false,
+    display: "swap",
+    variable: false,
+    googleFontsParam: "Noto+Sans+SC:wght@400;500;700",
+    license: "OFL",
+    licenseUrl: "https://github.com/adobe-fonts/source-han-sans/blob/master/LICENSE.txt"
+  }
+};
+function getGoogleFontsUrl(fontKeys) {
+  const families = fontKeys.map((key) => fonts[key]?.googleFontsParam).filter(Boolean).join("&family=");
+  if (!families) return "";
+  return `https://fonts.googleapis.com/css2?family=${families}&display=swap`;
+}
+var defaultFonts = ["inter", "jetbrainsMono"];
+var cjkFonts = ["sourceHanSans"];
+var allFonts = [...defaultFonts, ...cjkFonts];
+function getFontPreloadLinks(fontKeys) {
+  return fontKeys.map((key) => {
+    const font = fonts[key];
+    if (!font) return "";
+    const url = getGoogleFontsUrl([key]);
+    return `<link rel="preload" href="${url}" as="style" crossorigin>`;
+  }).filter(Boolean);
+}
+function getGoogleFontsLink(fontKeys) {
+  const url = getGoogleFontsUrl(fontKeys);
+  if (!url) return "";
+  return `<link rel="stylesheet" href="${url}">`;
+}
+async function areFontsLoaded(fontFamilies2) {
+  if (typeof document === "undefined") return false;
+  try {
+    await Promise.all(fontFamilies2.map((family) => document.fonts.load(`16px "${family}"`)));
+    return true;
+  } catch {
+    return false;
+  }
+}
+async function waitForFonts(fontFamilies2, timeout = 3e3) {
+  if (typeof document === "undefined") return false;
+  return new Promise((resolve) => {
+    const timer = setTimeout(() => resolve(false), timeout);
+    areFontsLoaded(fontFamilies2).then((loaded) => {
+      clearTimeout(timer);
+      resolve(loaded);
+    });
+  });
+}
+var fontSmoothing = {
+  WebkitFontSmoothing: "antialiased",
+  MozOsxFontSmoothing: "grayscale",
+  textRendering: "optimizeLegibility"
+};
+var fontFeatureSettings = {
+  /** Enable common ligatures and contextual alternates */
+  normal: '"calt" 1, "liga" 1',
+  /** Enable tabular figures for aligned numbers */
+  tabular: '"tnum" 1, "calt" 1',
+  /** Enable case-sensitive forms */
+  case: '"case" 1',
+  /** Enable stylistic set 01 (alternate digits) */
+  ss01: '"ss01" 1',
+  /** Enable stylistic set 02 (alternate a) */
+  ss02: '"ss02" 1'
+};
+function getFontLicenses() {
+  return Object.values(fonts).map((font) => ({
+    family: font.family,
+    license: font.license,
+    url: font.licenseUrl
+  }));
+}
+var fontLicenseNotice = `
+Fonts used in this project are licensed under open-source licenses:
+
+- Inter: SIL Open Font License 1.1
+- Public Sans: SIL Open Font License 1.1
+- JetBrains Mono: SIL Open Font License 1.1
+- Noto Sans SC (Source Han Sans): SIL Open Font License 1.1
+
+All fonts are free for commercial use. See individual license files for details.
+`.trim();
+
+// src/typography/tokens.ts
+var FONT_FAMILY_PRIMARY = '"Poppins", "vivo Sans", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif';
+var FONT_FAMILY_HEADING = '"Geist", "Poppins", "vivo Sans", "PingFang SC", "Microsoft YaHei", "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif';
+var FONT_FAMILY_MONO = '"JetBrains Mono", "Fira Code", ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, "Liberation Mono", monospace';
+var FONT_FAMILY_CJK = '"vivo Sans", "Source Han Sans SC", "Source Han Sans", "Noto Sans CJK SC", "Noto Sans SC", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif';
+var fontFamilies = {
+  /** Primary UI and body text */
+  primary: FONT_FAMILY_PRIMARY,
+  /** Headings and titles */
+  heading: FONT_FAMILY_HEADING,
+  /** Code and monospace */
+  mono: FONT_FAMILY_MONO,
+  /** CJK-specific fallback */
+  cjk: FONT_FAMILY_CJK,
+  /** Primary with CJK fallback for multilingual content */
+  primaryCJK: `${FONT_FAMILY_PRIMARY}, ${FONT_FAMILY_CJK}`,
+  /** System font stack (fast fallback, no web fonts) */
+  system: '-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif'
+};
+var fontSizes = {
+  /** 12px - Micro text, badges */
+  xs: "0.75rem",
+  /** 14px - Small text, captions, labels */
+  sm: "0.875rem",
+  /** 16px - Base body text */
+  base: "1rem",
+  /** 18px - Lead text, larger body */
+  lg: "1.125rem",
+  /** 20px - Small headings, subtitles */
+  xl: "1.25rem",
+  /** 24px - H4 equivalent */
+  "2xl": "1.5rem",
+  /** 30px - H3 equivalent */
+  "3xl": "1.875rem",
+  /** 36px - H2 equivalent */
+  "4xl": "2.25rem",
+  /** 48px - H1 equivalent */
+  "5xl": "3rem",
+  /** 60px - Display/Hero text */
+  "6xl": "3.75rem",
+  /** 72px - Large display */
+  "7xl": "4.5rem",
+  /** 96px - Extra large display */
+  "8xl": "6rem"
+};
+var fontSizesPx = {
+  xs: 12,
+  sm: 14,
+  base: 16,
+  lg: 18,
+  xl: 20,
+  "2xl": 24,
+  "3xl": 30,
+  "4xl": 36,
+  "5xl": 48,
+  "6xl": 60,
+  "7xl": 72,
+  "8xl": 96
+};
+var lineHeights = {
+  /** 1 - Single line, icons */
+  none: 1,
+  /** 1.25 - Tight, for large headings */
+  tight: 1.25,
+  /** 1.375 - Slightly snug */
+  snug: 1.375,
+  /** 1.5 - Normal body text */
+  normal: 1.5,
+  /** 1.625 - Relaxed reading */
+  relaxed: 1.625,
+  /** 1.75 - Loose, for small text */
+  loose: 1.75,
+  /** 2 - Double spaced */
+  double: 2
+};
+var fontWeights = {
+  /** 100 - Thin (if available) */
+  thin: 100,
+  /** 200 - Extra light */
+  extralight: 200,
+  /** 300 - Light */
+  light: 300,
+  /** 400 - Regular/Normal */
+  normal: 400,
+  /** 500 - Medium */
+  medium: 500,
+  /** 600 - Semibold */
+  semibold: 600,
+  /** 700 - Bold */
+  bold: 700,
+  /** 800 - Extra bold */
+  extrabold: 800,
+  /** 900 - Black */
+  black: 900
+};
+var letterSpacing = {
+  /** -0.05em - Very tight, large display only */
+  tighter: "-0.05em",
+  /** -0.025em - Slightly tight, headings */
+  tight: "-0.025em",
+  /** 0 - Normal */
+  normal: "0",
+  /** 0.025em - Slightly wide */
+  wide: "0.025em",
+  /** 0.05em - Wide, for small caps */
+  wider: "0.05em",
+  /** 0.1em - Very wide, all caps */
+  widest: "0.1em"
+};
+var typeStyles = {
+  /** Hero/Display - Large marketing headlines */
+  display: {
+    fontFamily: fontFamilies.heading,
+    fontSize: fontSizes["6xl"],
+    fontWeight: fontWeights.bold,
+    lineHeight: lineHeights.tight,
+    letterSpacing: letterSpacing.tight
+  },
+  /** H1 - Page titles */
+  h1: {
+    fontFamily: fontFamilies.heading,
+    fontSize: fontSizes["5xl"],
+    fontWeight: fontWeights.bold,
+    lineHeight: lineHeights.tight,
+    letterSpacing: letterSpacing.tight
+  },
+  /** H2 - Section titles */
+  h2: {
+    fontFamily: fontFamilies.heading,
+    fontSize: fontSizes["4xl"],
+    fontWeight: fontWeights.bold,
+    lineHeight: lineHeights.tight,
+    letterSpacing: letterSpacing.tight
+  },
+  /** H3 - Subsection titles */
+  h3: {
+    fontFamily: fontFamilies.heading,
+    fontSize: fontSizes["3xl"],
+    fontWeight: fontWeights.semibold,
+    lineHeight: lineHeights.snug,
+    letterSpacing: letterSpacing.normal
+  },
+  /** H4 - Card titles, small sections */
+  h4: {
+    fontFamily: fontFamilies.heading,
+    fontSize: fontSizes["2xl"],
+    fontWeight: fontWeights.semibold,
+    lineHeight: lineHeights.snug,
+    letterSpacing: letterSpacing.normal
+  },
+  /** H5 - Widget titles */
+  h5: {
+    fontFamily: fontFamilies.heading,
+    fontSize: fontSizes.xl,
+    fontWeight: fontWeights.semibold,
+    lineHeight: lineHeights.normal,
+    letterSpacing: letterSpacing.normal
+  },
+  /** H6 - Smallest heading */
+  h6: {
+    fontFamily: fontFamilies.heading,
+    fontSize: fontSizes.lg,
+    fontWeight: fontWeights.semibold,
+    lineHeight: lineHeights.normal,
+    letterSpacing: letterSpacing.normal
+  },
+  /** Body - Default paragraph text */
+  body: {
+    fontFamily: fontFamilies.primary,
+    fontSize: fontSizes.base,
+    fontWeight: fontWeights.normal,
+    lineHeight: lineHeights.normal,
+    letterSpacing: letterSpacing.normal
+  },
+  /** Body Large - Lead paragraphs */
+  bodyLarge: {
+    fontFamily: fontFamilies.primary,
+    fontSize: fontSizes.lg,
+    fontWeight: fontWeights.normal,
+    lineHeight: lineHeights.relaxed,
+    letterSpacing: letterSpacing.normal
+  },
+  /** Body Small - Secondary text */
+  bodySmall: {
+    fontFamily: fontFamilies.primary,
+    fontSize: fontSizes.sm,
+    fontWeight: fontWeights.normal,
+    lineHeight: lineHeights.normal,
+    letterSpacing: letterSpacing.normal
+  },
+  /** Caption - Image captions, timestamps */
+  caption: {
+    fontFamily: fontFamilies.primary,
+    fontSize: fontSizes.xs,
+    fontWeight: fontWeights.normal,
+    lineHeight: lineHeights.normal,
+    letterSpacing: letterSpacing.wide
+  },
+  /** Label - Form labels, UI labels */
+  label: {
+    fontFamily: fontFamilies.primary,
+    fontSize: fontSizes.sm,
+    fontWeight: fontWeights.medium,
+    lineHeight: lineHeights.tight,
+    letterSpacing: letterSpacing.normal
+  },
+  /** Button - Button text */
+  button: {
+    fontFamily: fontFamilies.primary,
+    fontSize: fontSizes.sm,
+    fontWeight: fontWeights.medium,
+    lineHeight: lineHeights.tight,
+    letterSpacing: letterSpacing.wide
+  },
+  /** Code - Inline code */
+  code: {
+    fontFamily: fontFamilies.mono,
+    fontSize: fontSizes.sm,
+    fontWeight: fontWeights.normal,
+    lineHeight: lineHeights.normal,
+    letterSpacing: letterSpacing.normal
+  },
+  /** Code Block - Code blocks */
+  codeBlock: {
+    fontFamily: fontFamilies.mono,
+    fontSize: fontSizes.sm,
+    fontWeight: fontWeights.normal,
+    lineHeight: lineHeights.relaxed,
+    letterSpacing: letterSpacing.normal
+  },
+  /** Overline - Small caps labels */
+  overline: {
+    fontFamily: fontFamilies.primary,
+    fontSize: fontSizes.xs,
+    fontWeight: fontWeights.semibold,
+    lineHeight: lineHeights.normal,
+    letterSpacing: letterSpacing.widest,
+    textTransform: "uppercase"
+  }
+};
+var fluidFontSizes = {
+  /** Display: 36px to 72px */
+  display: "clamp(2.25rem, 5vw + 1rem, 4.5rem)",
+  /** H1: 30px to 48px */
+  h1: "clamp(1.875rem, 4vw + 0.5rem, 3rem)",
+  /** H2: 24px to 36px */
+  h2: "clamp(1.5rem, 3vw + 0.5rem, 2.25rem)",
+  /** H3: 20px to 30px */
+  h3: "clamp(1.25rem, 2vw + 0.5rem, 1.875rem)",
+  /** Body: 14px to 18px */
+  body: "clamp(0.875rem, 1vw + 0.5rem, 1.125rem)"
+};
+
+export { FONT_FAMILY_CJK, FONT_FAMILY_HEADING, FONT_FAMILY_MONO, FONT_FAMILY_PRIMARY, allFonts, areFontsLoaded, cjkFonts, defaultFonts, fluidFontSizes, fontFamilies, fontFeatureSettings, fontLicenseNotice, fontSizes, fontSizesPx, fontSmoothing, fontWeights, fonts, getFontLicenses, getFontPreloadLinks, getGoogleFontsLink, getGoogleFontsUrl, letterSpacing, lineHeights, typeStyles, waitForFonts };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/typography/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/typography/fonts.ts","../../src/typography/tokens.ts"],"names":["fontFamilies"],"mappings":"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","file":"index.js","sourcesContent":["/**\n * Font Configuration and Loading Utilities\n *\n * Handles web font loading, preloading, and performance optimization.\n */\n\n// ============================================\n// Font Definitions\n// ============================================\n\n/**\n * Font configuration object\n */\nexport interface FontConfig {\n  /** Font family name */\n  family: string;\n  /** Font weights to load */\n  weights: number[];\n  /** Include italic variants */\n  italic?: boolean;\n  /** Font display strategy */\n  display?: \"auto\" | \"block\" | \"swap\" | \"fallback\" | \"optional\";\n  /** Is this a variable font */\n  variable?: boolean;\n  /** Google Fonts URL parameter name */\n  googleFontsParam?: string;\n  /** Self-hosted font URL */\n  selfHostUrl?: string;\n  /** Font license */\n  license: \"OFL\" | \"Apache-2.0\" | \"Ubuntu\" | \"MIT\" | \"Other\";\n  /** Source URL for license */\n  licenseUrl?: string;\n}\n\n/**\n * Registered fonts for the design system\n */\nexport const fonts: Record<string, FontConfig> = {\n  inter: {\n    family: \"Inter\",\n    weights: [300, 400, 500, 600, 700],\n    italic: false,\n    display: \"swap\",\n    variable: true,\n    googleFontsParam: \"Inter:wght@300;400;500;600;700\",\n    license: \"OFL\",\n    licenseUrl: \"https://github.com/rsms/inter/blob/master/LICENSE.txt\",\n  },\n\n  publicSans: {\n    family: \"Public Sans\",\n    weights: [300, 400, 500, 600, 700],\n    italic: true,\n    display: \"swap\",\n    variable: true,\n    googleFontsParam: \"Public+Sans:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400;1,500\",\n    license: \"OFL\",\n    licenseUrl: \"https://github.com/uswds/public-sans/blob/develop/LICENSE.md\",\n  },\n\n  jetbrainsMono: {\n    family: \"JetBrains Mono\",\n    weights: [400, 500, 700],\n    italic: false,\n    display: \"swap\",\n    variable: true,\n    googleFontsParam: \"JetBrains+Mono:wght@400;500;700\",\n    license: \"OFL\",\n    licenseUrl: \"https://github.com/JetBrains/JetBrainsMono/blob/master/OFL.txt\",\n  },\n\n  sourceHanSans: {\n    family: \"Noto Sans SC\",\n    weights: [400, 500, 700],\n    italic: false,\n    display: \"swap\",\n    variable: false,\n    googleFontsParam: \"Noto+Sans+SC:wght@400;500;700\",\n    license: \"OFL\",\n    licenseUrl: \"https://github.com/adobe-fonts/source-han-sans/blob/master/LICENSE.txt\",\n  },\n};\n\n// ============================================\n// Google Fonts URL Builder\n// ============================================\n\n/**\n * Generate Google Fonts URL for specified fonts\n */\nexport function getGoogleFontsUrl(fontKeys: (keyof typeof fonts)[]): string {\n  const families = fontKeys\n    .map((key) => fonts[key]?.googleFontsParam)\n    .filter(Boolean)\n    .join(\"&family=\");\n\n  if (!families) return \"\";\n\n  return `https://fonts.googleapis.com/css2?family=${families}&display=swap`;\n}\n\n/**\n * Default fonts to load\n */\nexport const defaultFonts: (keyof typeof fonts)[] = [\"inter\", \"jetbrainsMono\"];\n\n/**\n * Fonts for CJK (Chinese) support\n */\nexport const cjkFonts: (keyof typeof fonts)[] = [\"sourceHanSans\"];\n\n/**\n * All fonts including CJK\n */\nexport const allFonts: (keyof typeof fonts)[] = [...defaultFonts, ...cjkFonts];\n\n// ============================================\n// Font Loading Utilities\n// ============================================\n\n/**\n * Generate preload link elements for critical fonts\n */\nexport function getFontPreloadLinks(fontKeys: (keyof typeof fonts)[]): string[] {\n  return fontKeys\n    .map((key) => {\n      const font = fonts[key];\n      if (!font) return \"\";\n\n      const url = getGoogleFontsUrl([key]);\n      return `<link rel=\"preload\" href=\"${url}\" as=\"style\" crossorigin>`;\n    })\n    .filter(Boolean);\n}\n\n/**\n * Generate link element for Google Fonts\n */\nexport function getGoogleFontsLink(fontKeys: (keyof typeof fonts)[]): string {\n  const url = getGoogleFontsUrl(fontKeys);\n  if (!url) return \"\";\n\n  return `<link rel=\"stylesheet\" href=\"${url}\">`;\n}\n\n/**\n * Check if fonts are loaded\n */\nexport async function areFontsLoaded(fontFamilies: string[]): Promise<boolean> {\n  if (typeof document === \"undefined\") return false;\n\n  try {\n    await Promise.all(fontFamilies.map((family) => document.fonts.load(`16px \"${family}\"`)));\n    return true;\n  } catch {\n    return false;\n  }\n}\n\n/**\n * Wait for fonts to load with timeout\n */\nexport async function waitForFonts(fontFamilies: string[], timeout = 3000): Promise<boolean> {\n  if (typeof document === \"undefined\") return false;\n\n  return new Promise((resolve) => {\n    const timer = setTimeout(() => resolve(false), timeout);\n\n    areFontsLoaded(fontFamilies).then((loaded) => {\n      clearTimeout(timer);\n      resolve(loaded);\n    });\n  });\n}\n\n// ============================================\n// CSS-in-JS Helpers\n// ============================================\n\n/**\n * Font smoothing CSS for crisp text rendering\n */\nexport const fontSmoothing = {\n  WebkitFontSmoothing: \"antialiased\",\n  MozOsxFontSmoothing: \"grayscale\",\n  textRendering: \"optimizeLegibility\",\n} as const;\n\n/**\n * Font feature settings for Inter\n */\nexport const fontFeatureSettings = {\n  /** Enable common ligatures and contextual alternates */\n  normal: '\"calt\" 1, \"liga\" 1',\n  /** Enable tabular figures for aligned numbers */\n  tabular: '\"tnum\" 1, \"calt\" 1',\n  /** Enable case-sensitive forms */\n  case: '\"case\" 1',\n  /** Enable stylistic set 01 (alternate digits) */\n  ss01: '\"ss01\" 1',\n  /** Enable stylistic set 02 (alternate a) */\n  ss02: '\"ss02\" 1',\n} as const;\n\n// ============================================\n// License Information\n// ============================================\n\n/**\n * Get license information for all used fonts\n */\nexport function getFontLicenses(): Array<{\n  family: string;\n  license: string;\n  url?: string | undefined;\n}> {\n  return Object.values(fonts).map((font) => ({\n    family: font.family,\n    license: font.license,\n    url: font.licenseUrl,\n  }));\n}\n\n/**\n * Font license compliance notice\n */\nexport const fontLicenseNotice = `\nFonts used in this project are licensed under open-source licenses:\n\n- Inter: SIL Open Font License 1.1\n- Public Sans: SIL Open Font License 1.1\n- JetBrains Mono: SIL Open Font License 1.1\n- Noto Sans SC (Source Han Sans): SIL Open Font License 1.1\n\nAll fonts are free for commercial use. See individual license files for details.\n`.trim();\n","/**\n * Typography Tokens\n *\n * Centralized typography configuration for the entire design system.\n * All font-related values should come from here.\n */\n\n// ============================================\n// Font Families\n// ============================================\n\n/**\n * Primary font stack - Used for body text and UI\n *\n * Poppins is the primary font for English text. vivo Sans is for Chinese.\n * Falls back through system fonts for maximum compatibility.\n */\nexport const FONT_FAMILY_PRIMARY =\n  '\"Poppins\", \"vivo Sans\", \"PingFang SC\", \"Microsoft YaHei\", \"Noto Sans SC\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif';\n\n/**\n * Heading font stack - Used for titles and emphasis\n *\n * Geist Sans is the primary display typeface.\n */\nexport const FONT_FAMILY_HEADING =\n  '\"Geist\", \"Poppins\", \"vivo Sans\", \"PingFang SC\", \"Microsoft YaHei\", \"Noto Sans SC\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif';\n\n/**\n * Monospace font stack - Used for code and technical content\n */\nexport const FONT_FAMILY_MONO =\n  '\"JetBrains Mono\", \"Fira Code\", ui-monospace, SFMono-Regular, \"SF Mono\", Menlo, Consolas, \"Liberation Mono\", monospace';\n\n/**\n * CJK (Chinese/Japanese/Korean) fallback stack\n *\n * vivo Sans is the primary Chinese font.\n * Provides consistent rendering for Chinese, Japanese, and Korean text.\n */\nexport const FONT_FAMILY_CJK =\n  '\"vivo Sans\", \"Source Han Sans SC\", \"Source Han Sans\", \"Noto Sans CJK SC\", \"Noto Sans SC\", \"PingFang SC\", \"Hiragino Sans GB\", \"Microsoft YaHei\", sans-serif';\n\n/**\n * Complete font stacks with CJK fallback\n */\nexport const fontFamilies = {\n  /** Primary UI and body text */\n  primary: FONT_FAMILY_PRIMARY,\n\n  /** Headings and titles */\n  heading: FONT_FAMILY_HEADING,\n\n  /** Code and monospace */\n  mono: FONT_FAMILY_MONO,\n\n  /** CJK-specific fallback */\n  cjk: FONT_FAMILY_CJK,\n\n  /** Primary with CJK fallback for multilingual content */\n  primaryCJK: `${FONT_FAMILY_PRIMARY}, ${FONT_FAMILY_CJK}`,\n\n  /** System font stack (fast fallback, no web fonts) */\n  system: '-apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, Helvetica, Arial, sans-serif',\n} as const;\n\n// ============================================\n// Type Scale\n// ============================================\n\n/**\n * Font size scale using rem units for accessibility\n *\n * Base: 16px = 1rem\n * Each step follows a modular scale (~1.25 ratio)\n */\nexport const fontSizes = {\n  /** 12px - Micro text, badges */\n  xs: \"0.75rem\",\n\n  /** 14px - Small text, captions, labels */\n  sm: \"0.875rem\",\n\n  /** 16px - Base body text */\n  base: \"1rem\",\n\n  /** 18px - Lead text, larger body */\n  lg: \"1.125rem\",\n\n  /** 20px - Small headings, subtitles */\n  xl: \"1.25rem\",\n\n  /** 24px - H4 equivalent */\n  \"2xl\": \"1.5rem\",\n\n  /** 30px - H3 equivalent */\n  \"3xl\": \"1.875rem\",\n\n  /** 36px - H2 equivalent */\n  \"4xl\": \"2.25rem\",\n\n  /** 48px - H1 equivalent */\n  \"5xl\": \"3rem\",\n\n  /** 60px - Display/Hero text */\n  \"6xl\": \"3.75rem\",\n\n  /** 72px - Large display */\n  \"7xl\": \"4.5rem\",\n\n  /** 96px - Extra large display */\n  \"8xl\": \"6rem\",\n} as const;\n\n/**\n * Font size in pixels (for cases where rem isn't suitable)\n */\nexport const fontSizesPx = {\n  xs: 12,\n  sm: 14,\n  base: 16,\n  lg: 18,\n  xl: 20,\n  \"2xl\": 24,\n  \"3xl\": 30,\n  \"4xl\": 36,\n  \"5xl\": 48,\n  \"6xl\": 60,\n  \"7xl\": 72,\n  \"8xl\": 96,\n} as const;\n\n// ============================================\n// Line Heights\n// ============================================\n\n/**\n * Line height scale\n *\n * Using unitless values for better inheritance.\n */\nexport const lineHeights = {\n  /** 1 - Single line, icons */\n  none: 1,\n\n  /** 1.25 - Tight, for large headings */\n  tight: 1.25,\n\n  /** 1.375 - Slightly snug */\n  snug: 1.375,\n\n  /** 1.5 - Normal body text */\n  normal: 1.5,\n\n  /** 1.625 - Relaxed reading */\n  relaxed: 1.625,\n\n  /** 1.75 - Loose, for small text */\n  loose: 1.75,\n\n  /** 2 - Double spaced */\n  double: 2,\n} as const;\n\n// ============================================\n// Font Weights\n// ============================================\n\n/**\n * Font weight scale\n *\n * Inter and Public Sans support all these weights.\n * Variable fonts can use any value 100-900.\n */\nexport const fontWeights = {\n  /** 100 - Thin (if available) */\n  thin: 100,\n\n  /** 200 - Extra light */\n  extralight: 200,\n\n  /** 300 - Light */\n  light: 300,\n\n  /** 400 - Regular/Normal */\n  normal: 400,\n\n  /** 500 - Medium */\n  medium: 500,\n\n  /** 600 - Semibold */\n  semibold: 600,\n\n  /** 700 - Bold */\n  bold: 700,\n\n  /** 800 - Extra bold */\n  extrabold: 800,\n\n  /** 900 - Black */\n  black: 900,\n} as const;\n\n// ============================================\n// Letter Spacing (Tracking)\n// ============================================\n\n/**\n * Letter spacing scale\n *\n * Negative values for tight headlines, positive for small caps.\n */\nexport const letterSpacing = {\n  /** -0.05em - Very tight, large display only */\n  tighter: \"-0.05em\",\n\n  /** -0.025em - Slightly tight, headings */\n  tight: \"-0.025em\",\n\n  /** 0 - Normal */\n  normal: \"0\",\n\n  /** 0.025em - Slightly wide */\n  wide: \"0.025em\",\n\n  /** 0.05em - Wide, for small caps */\n  wider: \"0.05em\",\n\n  /** 0.1em - Very wide, all caps */\n  widest: \"0.1em\",\n} as const;\n\n// ============================================\n// Combined Type Styles\n// ============================================\n\n/**\n * Pre-defined typography presets\n *\n * These combine font-family, size, weight, and line-height\n * for common use cases.\n */\nexport const typeStyles = {\n  /** Hero/Display - Large marketing headlines */\n  display: {\n    fontFamily: fontFamilies.heading,\n    fontSize: fontSizes[\"6xl\"],\n    fontWeight: fontWeights.bold,\n    lineHeight: lineHeights.tight,\n    letterSpacing: letterSpacing.tight,\n  },\n\n  /** H1 - Page titles */\n  h1: {\n    fontFamily: fontFamilies.heading,\n    fontSize: fontSizes[\"5xl\"],\n    fontWeight: fontWeights.bold,\n    lineHeight: lineHeights.tight,\n    letterSpacing: letterSpacing.tight,\n  },\n\n  /** H2 - Section titles */\n  h2: {\n    fontFamily: fontFamilies.heading,\n    fontSize: fontSizes[\"4xl\"],\n    fontWeight: fontWeights.bold,\n    lineHeight: lineHeights.tight,\n    letterSpacing: letterSpacing.tight,\n  },\n\n  /** H3 - Subsection titles */\n  h3: {\n    fontFamily: fontFamilies.heading,\n    fontSize: fontSizes[\"3xl\"],\n    fontWeight: fontWeights.semibold,\n    lineHeight: lineHeights.snug,\n    letterSpacing: letterSpacing.normal,\n  },\n\n  /** H4 - Card titles, small sections */\n  h4: {\n    fontFamily: fontFamilies.heading,\n    fontSize: fontSizes[\"2xl\"],\n    fontWeight: fontWeights.semibold,\n    lineHeight: lineHeights.snug,\n    letterSpacing: letterSpacing.normal,\n  },\n\n  /** H5 - Widget titles */\n  h5: {\n    fontFamily: fontFamilies.heading,\n    fontSize: fontSizes.xl,\n    fontWeight: fontWeights.semibold,\n    lineHeight: lineHeights.normal,\n    letterSpacing: letterSpacing.normal,\n  },\n\n  /** H6 - Smallest heading */\n  h6: {\n    fontFamily: fontFamilies.heading,\n    fontSize: fontSizes.lg,\n    fontWeight: fontWeights.semibold,\n    lineHeight: lineHeights.normal,\n    letterSpacing: letterSpacing.normal,\n  },\n\n  /** Body - Default paragraph text */\n  body: {\n    fontFamily: fontFamilies.primary,\n    fontSize: fontSizes.base,\n    fontWeight: fontWeights.normal,\n    lineHeight: lineHeights.normal,\n    letterSpacing: letterSpacing.normal,\n  },\n\n  /** Body Large - Lead paragraphs */\n  bodyLarge: {\n    fontFamily: fontFamilies.primary,\n    fontSize: fontSizes.lg,\n    fontWeight: fontWeights.normal,\n    lineHeight: lineHeights.relaxed,\n    letterSpacing: letterSpacing.normal,\n  },\n\n  /** Body Small - Secondary text */\n  bodySmall: {\n    fontFamily: fontFamilies.primary,\n    fontSize: fontSizes.sm,\n    fontWeight: fontWeights.normal,\n    lineHeight: lineHeights.normal,\n    letterSpacing: letterSpacing.normal,\n  },\n\n  /** Caption - Image captions, timestamps */\n  caption: {\n    fontFamily: fontFamilies.primary,\n    fontSize: fontSizes.xs,\n    fontWeight: fontWeights.normal,\n    lineHeight: lineHeights.normal,\n    letterSpacing: letterSpacing.wide,\n  },\n\n  /** Label - Form labels, UI labels */\n  label: {\n    fontFamily: fontFamilies.primary,\n    fontSize: fontSizes.sm,\n    fontWeight: fontWeights.medium,\n    lineHeight: lineHeights.tight,\n    letterSpacing: letterSpacing.normal,\n  },\n\n  /** Button - Button text */\n  button: {\n    fontFamily: fontFamilies.primary,\n    fontSize: fontSizes.sm,\n    fontWeight: fontWeights.medium,\n    lineHeight: lineHeights.tight,\n    letterSpacing: letterSpacing.wide,\n  },\n\n  /** Code - Inline code */\n  code: {\n    fontFamily: fontFamilies.mono,\n    fontSize: fontSizes.sm,\n    fontWeight: fontWeights.normal,\n    lineHeight: lineHeights.normal,\n    letterSpacing: letterSpacing.normal,\n  },\n\n  /** Code Block - Code blocks */\n  codeBlock: {\n    fontFamily: fontFamilies.mono,\n    fontSize: fontSizes.sm,\n    fontWeight: fontWeights.normal,\n    lineHeight: lineHeights.relaxed,\n    letterSpacing: letterSpacing.normal,\n  },\n\n  /** Overline - Small caps labels */\n  overline: {\n    fontFamily: fontFamilies.primary,\n    fontSize: fontSizes.xs,\n    fontWeight: fontWeights.semibold,\n    lineHeight: lineHeights.normal,\n    letterSpacing: letterSpacing.widest,\n    textTransform: \"uppercase\" as const,\n  },\n} as const;\n\nexport type TypeStyle = keyof typeof typeStyles;\n\n// ============================================\n// Responsive Typography\n// ============================================\n\n/**\n * Fluid typography clamp values\n *\n * Format: clamp(min, preferred, max)\n * Uses viewport width for smooth scaling.\n */\nexport const fluidFontSizes = {\n  /** Display: 36px to 72px */\n  display: \"clamp(2.25rem, 5vw + 1rem, 4.5rem)\",\n\n  /** H1: 30px to 48px */\n  h1: \"clamp(1.875rem, 4vw + 0.5rem, 3rem)\",\n\n  /** H2: 24px to 36px */\n  h2: \"clamp(1.5rem, 3vw + 0.5rem, 2.25rem)\",\n\n  /** H3: 20px to 30px */\n  h3: \"clamp(1.25rem, 2vw + 0.5rem, 1.875rem)\",\n\n  /** Body: 14px to 18px */\n  body: \"clamp(0.875rem, 1vw + 0.5rem, 1.125rem)\",\n} as const;\n\n// ============================================\n// Type Exports\n// ============================================\n\nexport type FontFamily = keyof typeof fontFamilies;\nexport type FontSize = keyof typeof fontSizes;\nexport type LineHeight = keyof typeof lineHeights;\nexport type FontWeight = keyof typeof fontWeights;\nexport type LetterSpacing = keyof typeof letterSpacing;\n"]}

package/dist/utils/index.d.ts

@@ -0,0 +1,61 @@
+import { ClassValue } from 'clsx';
+
+declare function cn(...inputs: ClassValue[]): string;
+
+/**
+ * Brand Color Utilities
+ *
+ * Resolves Nebutra brand CSS variables at runtime for components that
+ * require raw hex values (e.g. WebGL shaders, Canvas APIs, animation libraries
+ * that can't consume `var(--token)` strings directly).
+ *
+ * Components that accept CSS color strings (inline styles, gradients, SVG)
+ * should prefer `var(--brand-primary)` / `var(--brand-accent)` directly
+ * instead of calling these helpers.
+ */
+/** SSR / no-DOM fallbacks — only used when `window` is unavailable. */
+declare const BRAND_FALLBACK: {
+    readonly primary: "#0033FE";
+    readonly accent: "#0BF1C3";
+    readonly tertiary: "#5c7cfa";
+    readonly primaryDark: "#002ad4";
+    readonly backDark: "#000830";
+};
+/**
+ * Read a CSS variable from :root and return its trimmed value.
+ * Falls back to `fallback` in SSR/no-DOM environments or when the var
+ * is unresolved (empty string).
+ */
+declare function readCssVar(name: string, fallback: string): string;
+/** Resolve `--brand-primary` to a hex/color string (with SSR fallback). */
+declare function getBrandPrimary(): string;
+/** Resolve `--brand-accent` to a hex/color string (with SSR fallback). */
+declare function getBrandAccent(): string;
+/** Resolve `--brand-tertiary` to a hex/color string (with SSR fallback). */
+declare function getBrandTertiary(): string;
+
+/**
+ * Utility Functions
+ */
+/**
+ * Merge class names — canonical implementation from ./cn.ts
+ * Uses twMerge(clsx(...)) to correctly resolve Tailwind class conflicts.
+ */
+
+/**
+ * Breakpoint values (matches Primer)
+ */
+declare const BREAKPOINTS: {
+    readonly xs: 0;
+    readonly sm: 544;
+    readonly md: 768;
+    readonly lg: 1012;
+    readonly xl: 1280;
+};
+type Breakpoint = keyof typeof BREAKPOINTS;
+/**
+ * Check if viewport is at or above breakpoint
+ */
+declare function isBreakpointUp(breakpoint: Breakpoint): boolean;
+
+export { BRAND_FALLBACK, BREAKPOINTS, type Breakpoint, cn, getBrandAccent, getBrandPrimary, getBrandTertiary, isBreakpointUp, readCssVar };

package/dist/utils/index.js

@@ -0,0 +1,55 @@
+"use client";
+import { clsx } from 'clsx';
+import { twMerge } from 'tailwind-merge';
+
+// src/utils/cn.ts
+function cn(...inputs) {
+  return twMerge(clsx(inputs));
+}
+
+// src/utils/brand-colors.ts
+var BRAND_FALLBACK = {
+  primary: "#0033FE",
+  // nebutra-blue-500
+  accent: "#0BF1C3",
+  // nebutra-cyan-500
+  tertiary: "#5c7cfa",
+  // nebutra-blue-400
+  primaryDark: "#002ad4",
+  // nebutra-blue-600
+  backDark: "#000830"
+  // nebutra-blue-950
+};
+function readCssVar(name, fallback) {
+  if (typeof window === "undefined" || typeof document === "undefined") {
+    return fallback;
+  }
+  const value = getComputedStyle(document.documentElement).getPropertyValue(name).trim();
+  return value || fallback;
+}
+function getBrandPrimary() {
+  return readCssVar("--brand-primary", BRAND_FALLBACK.primary);
+}
+function getBrandAccent() {
+  return readCssVar("--brand-accent", BRAND_FALLBACK.accent);
+}
+function getBrandTertiary() {
+  return readCssVar("--brand-tertiary", BRAND_FALLBACK.tertiary);
+}
+
+// src/utils/index.ts
+var BREAKPOINTS = {
+  xs: 0,
+  sm: 544,
+  md: 768,
+  lg: 1012,
+  xl: 1280
+};
+function isBreakpointUp(breakpoint) {
+  if (typeof window === "undefined") return true;
+  return window.innerWidth >= BREAKPOINTS[breakpoint];
+}
+
+export { BRAND_FALLBACK, BREAKPOINTS, cn, getBrandAccent, getBrandPrimary, getBrandTertiary, isBreakpointUp, readCssVar };
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/utils/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/utils/cn.ts","../../src/utils/brand-colors.ts","../../src/utils/index.ts"],"names":[],"mappings":";;;;AAGO,SAAS,MAAM,MAAA,EAAsB;AAC1C,EAAA,OAAO,OAAA,CAAQ,IAAA,CAAK,MAAM,CAAC,CAAA;AAC7B;;;ACQO,IAAM,cAAA,GAAiB;AAAA,EAC5B,OAAA,EAAS,SAAA;AAAA;AAAA,EACT,MAAA,EAAQ,SAAA;AAAA;AAAA,EACR,QAAA,EAAU,SAAA;AAAA;AAAA,EACV,WAAA,EAAa,SAAA;AAAA;AAAA,EACb,QAAA,EAAU;AAAA;AACZ;AAOO,SAAS,UAAA,CAAW,MAAc,QAAA,EAA0B;AACjE,EAAA,IAAI,OAAO,MAAA,KAAW,WAAA,IAAe,OAAO,aAAa,WAAA,EAAa;AACpE,IAAA,OAAO,QAAA;AAAA,EACT;AACA,EAAA,MAAM,KAAA,GAAQ,iBAAiB,QAAA,CAAS,eAAe,EAAE,gBAAA,CAAiB,IAAI,EAAE,IAAA,EAAK;AACrF,EAAA,OAAO,KAAA,IAAS,QAAA;AAClB;AAGO,SAAS,eAAA,GAA0B;AACxC,EAAA,OAAO,UAAA,CAAW,iBAAA,EAAmB,cAAA,CAAe,OAAO,CAAA;AAC7D;AAGO,SAAS,cAAA,GAAyB;AACvC,EAAA,OAAO,UAAA,CAAW,gBAAA,EAAkB,cAAA,CAAe,MAAM,CAAA;AAC3D;AAGO,SAAS,gBAAA,GAA2B;AACzC,EAAA,OAAO,UAAA,CAAW,kBAAA,EAAoB,cAAA,CAAe,QAAQ,CAAA;AAC/D;;;AClCO,IAAM,WAAA,GAAc;AAAA,EACzB,EAAA,EAAI,CAAA;AAAA,EACJ,EAAA,EAAI,GAAA;AAAA,EACJ,EAAA,EAAI,GAAA;AAAA,EACJ,EAAA,EAAI,IAAA;AAAA,EACJ,EAAA,EAAI;AACN;AAOO,SAAS,eAAe,UAAA,EAAiC;AAC9D,EAAA,IAAI,OAAO,MAAA,KAAW,WAAA,EAAa,OAAO,IAAA;AAC1C,EAAA,OAAO,MAAA,CAAO,UAAA,IAAc,WAAA,CAAY,UAAU,CAAA;AACpD","file":"index.js","sourcesContent":["import { type ClassValue, clsx } from \"clsx\";\nimport { twMerge } from \"tailwind-merge\";\n\nexport function cn(...inputs: ClassValue[]) {\n  return twMerge(clsx(inputs));\n}\n","/**\n * Brand Color Utilities\n *\n * Resolves Nebutra brand CSS variables at runtime for components that\n * require raw hex values (e.g. WebGL shaders, Canvas APIs, animation libraries\n * that can't consume `var(--token)` strings directly).\n *\n * Components that accept CSS color strings (inline styles, gradients, SVG)\n * should prefer `var(--brand-primary)` / `var(--brand-accent)` directly\n * instead of calling these helpers.\n */\n\n/** SSR / no-DOM fallbacks — only used when `window` is unavailable. */\nexport const BRAND_FALLBACK = {\n  primary: \"#0033FE\", // nebutra-blue-500\n  accent: \"#0BF1C3\", // nebutra-cyan-500\n  tertiary: \"#5c7cfa\", // nebutra-blue-400\n  primaryDark: \"#002ad4\", // nebutra-blue-600\n  backDark: \"#000830\", // nebutra-blue-950\n} as const;\n\n/**\n * Read a CSS variable from :root and return its trimmed value.\n * Falls back to `fallback` in SSR/no-DOM environments or when the var\n * is unresolved (empty string).\n */\nexport function readCssVar(name: string, fallback: string): string {\n  if (typeof window === \"undefined\" || typeof document === \"undefined\") {\n    return fallback;\n  }\n  const value = getComputedStyle(document.documentElement).getPropertyValue(name).trim();\n  return value || fallback;\n}\n\n/** Resolve `--brand-primary` to a hex/color string (with SSR fallback). */\nexport function getBrandPrimary(): string {\n  return readCssVar(\"--brand-primary\", BRAND_FALLBACK.primary);\n}\n\n/** Resolve `--brand-accent` to a hex/color string (with SSR fallback). */\nexport function getBrandAccent(): string {\n  return readCssVar(\"--brand-accent\", BRAND_FALLBACK.accent);\n}\n\n/** Resolve `--brand-tertiary` to a hex/color string (with SSR fallback). */\nexport function getBrandTertiary(): string {\n  return readCssVar(\"--brand-tertiary\", BRAND_FALLBACK.tertiary);\n}\n","/**\n * Utility Functions\n */\n\n/**\n * Merge class names — canonical implementation from ./cn.ts\n * Uses twMerge(clsx(...)) to correctly resolve Tailwind class conflicts.\n */\nexport { cn } from \"./cn\";\n\n/**\n * Breakpoint values (matches Primer)\n */\nexport const BREAKPOINTS = {\n  xs: 0,\n  sm: 544,\n  md: 768,\n  lg: 1012,\n  xl: 1280,\n} as const;\n\nexport type Breakpoint = keyof typeof BREAKPOINTS;\n\n/**\n * Check if viewport is at or above breakpoint\n */\nexport function isBreakpointUp(breakpoint: Breakpoint): boolean {\n  if (typeof window === \"undefined\") return true;\n  return window.innerWidth >= BREAKPOINTS[breakpoint];\n}\n\nexport {\n  BRAND_FALLBACK,\n  getBrandAccent,\n  getBrandPrimary,\n  getBrandTertiary,\n  readCssVar,\n} from \"./brand-colors\";\n"]}

package/package.json

@@ -1,9 +1,9 @@
 {
   "name": "@nebutra/ui",
-  "version": "0.1.0",
+  "version": "0.2.1",
   "description": "Unified UI component library — Lobe UI + Radix + HeroUI + layout components",
   "private": false,
-  "license": "AGPL-3.0",
+  "license": "MIT",
   "type": "module",
   "sideEffects": false,
   "exports": {
@@ -68,6 +68,7 @@
     "@lobehub/fluent-emoji": "^4.1.0",
     "@lobehub/icons": "^5.0.1",
     "@lobehub/ui": "^5.4.0",
+    "@xyflow/react": "^12.10.2",
     "@number-flow/react": "^0.5.5",
     "@paper-design/shaders-react": "^0.0.71",
     "@phosphor-icons/react": "^2.1.10",
@@ -90,8 +91,10 @@
     "react-ascii-text": "*",
     "react-dom": "^19.2.4",
     "react-hook-form": "^7.71.2",
+    "react-markdown": "^10.1.0",
     "react-resizable-panels": "^4.7.1",
     "react-syntax-highlighter": "^16.1.1",
+    "remark-gfm": "^4.0.1",
     "react-tweet": "^3.3.0",
     "react-use-measure": "^2.1.7",
     "recharts": "^3.7.0",
@@ -101,14 +104,16 @@
     "tailwind-merge": "^3.5.0",
     "usehooks-ts": "^3.1.1",
     "vaul": "^1.1.2",
-    "@nebutra/brand": "0.1.0",
-    "@nebutra/icons": "0.1.0"
+    "@nebutra/brand": "0.1.1",
+    "@nebutra/graph-model": "0.2.1",
+    "@nebutra/icons": "0.1.1",
+    "@nebutra/tokens": "0.1.1"
   },
   "peerDependencies": {
     "@clerk/nextjs": ">=5.0.0",
     "next": ">=14.0.0",
-    "react": "^18.0.0 || ^19.0.0",
-    "react-dom": "^18.0.0 || ^19.0.0"
+    "react": ">=19.0.0",
+    "react-dom": ">=19.0.0"
   },
   "peerDependenciesMeta": {
     "@clerk/nextjs": {
@@ -120,6 +125,8 @@
   },
   "devDependencies": {
     "@storybook/test": "^8.6.17",
+    "@testing-library/jest-dom": "^6.9.1",
+    "@testing-library/react": "^16.3.2",
     "@types/canvas-confetti": "^1.9.0",
     "@types/node": "^22.19.15",
     "@types/react": "^19.2.14",
@@ -127,10 +134,12 @@
     "@types/three": "^0.183.1",
     "next": "^16.2.6",
     "storybook": "^8.6.17",
+    "@vitejs/plugin-react": "^4.3.4",
     "tsup": "^8.5.1",
     "tsx": "^4.21.0",
     "typescript": "^5.9.3",
-    "@nebutra/design-tokens": "0.1.0"
+    "vitest": "^4.0.18",
+    "@nebutra/design-tokens": "0.1.1"
   },
   "homepage": "https://github.com/Nebutra/Nebutra-Sailor/tree/main/packages/design/ui#readme",
   "repository": {
@@ -149,9 +158,10 @@
     "three": "^0.183.2"
   },
   "scripts": {
+    "test": "vitest run",
     "typecheck": "tsc --noEmit",
     "build:registry": "tsx scripts/build-registry.ts",
-    "build": "tsup && tsx scripts/build-registry.ts",
+    "build": "NODE_OPTIONS='--max-old-space-size=6144' tsup && tsx scripts/build-registry.ts",
     "dev": "tsup --watch"
   }
 }