@refineui/tokens 1.0.0

package/dist/index.js

@@ -0,0 +1,978 @@
+"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/index.ts
+var index_exports = {};
+__export(index_exports, {
+  SEMANTIC_COLOR_ROWS: () => SEMANTIC_COLOR_ROWS,
+  SEMANTIC_FOCUS_PAIRS: () => SEMANTIC_FOCUS_PAIRS,
+  SEMANTIC_PALETTE_PAIRS: () => SEMANTIC_PALETTE_PAIRS,
+  SEMANTIC_TEXT: () => SEMANTIC_TEXT,
+  borderRadii: () => borderRadii,
+  colors: () => colors,
+  componentSizeFoundationKeys: () => componentSizeFoundationKeys,
+  componentSizes: () => componentSizes,
+  fontFamilies: () => fontFamilies,
+  fontSizes: () => fontSizes,
+  fontWeights: () => fontWeights,
+  foundationSizes: () => foundationSizes,
+  iconSizes: () => iconSizes,
+  lineHeights: () => lineHeights,
+  motion: () => motion,
+  opacities: () => opacities,
+  overlays: () => overlays,
+  semanticColors: () => semanticColors,
+  semanticFocus: () => semanticFocus,
+  semanticInteraction: () => semanticInteraction,
+  semanticShadows: () => semanticShadows,
+  shadow2Lighter: () => shadow2Lighter,
+  shadowColors: () => shadowColors,
+  shadows: () => shadows,
+  spacings: () => spacings,
+  strokeWidths: () => strokeWidths,
+  surfaceOverlayRgba: () => surfaceOverlayRgba,
+  textAlignments: () => textAlignments,
+  toBoxShadow: () => toBoxShadow,
+  typographys: () => typographys,
+  zIndex: () => zIndex
+});
+module.exports = __toCommonJS(index_exports);
+
+// src/global/colors.ts
+var colors = {
+  primaryLightGray: "#E6E6E6",
+  primaryGray: "#D4D4D4",
+  primaryDarkGray: "#4d4d4d",
+  primaryBlack: "#212121",
+  neutralWhite: "#FFFFFF",
+  neutral100: "#F5F5F5",
+  neutral150: "#F0F0F0",
+  neutral200: "#EBEBEB",
+  neutral250: "#E0E0E0",
+  neutral300: "#DBDBDB",
+  neutral350: "#D8D8D8",
+  neutral400: "#CECECE",
+  neutral450: "#BBBBBB",
+  neutral500: "#A4A4A4",
+  neutral550: "#8D8D8D",
+  neutral600: "#6C6C6C",
+  neutral650: "#5B5B5B",
+  neutral700: "#404040",
+  neutral750: "#333333",
+  neutral800: "#2A2A2A",
+  neutral850: "#222222",
+  neutral900: "#1A1A1A",
+  neutral950: "#111111",
+  neutralBlack: "#000000",
+  red100: "#FFDEDE",
+  red200: "#FFC3C3",
+  red300: "#FFA7A7",
+  red400: "#FF8989",
+  red500: "#FF6969",
+  red600: "#F94343",
+  red700: "#D93A3A",
+  red800: "#BA3232",
+  red900: "#9C2929",
+  red1000: "#711e1e",
+  orange100: "#FAE0D1",
+  orange200: "#F6C8AE",
+  orange300: "#F3B08B",
+  orange400: "#EF9664",
+  orange500: "#EB7C3E",
+  orange600: "#D6692C",
+  orange700: "#BA5B26",
+  orange800: "#9F4E21",
+  orange900: "#85411B",
+  orange1000: "#5f2f14",
+  yellow100: "#FFE493",
+  yellow200: "#FFCB2F",
+  yellow300: "#F1B500",
+  yellow400: "#DAA300",
+  yellow500: "#C49200",
+  yellow600: "#AD8100",
+  yellow700: "#967000",
+  yellow800: "#806000",
+  yellow900: "#6B5000",
+  yellow1000: "#564100",
+  lime100: "#C8F46F",
+  lime200: "#A4E61F",
+  lime300: "#95D11C",
+  lime400: "#86BC19",
+  lime500: "#78A917",
+  lime600: "#6A9514",
+  lime700: "#5C8111",
+  lime800: "#4F6E0F",
+  lime900: "#425C0C",
+  lime1000: "#2f4209",
+  green100: "#ADF7B0",
+  green200: "#5BEE62",
+  green300: "#2FDC37",
+  green400: "#2AC632",
+  green500: "#26B12D",
+  green600: "#229D28",
+  green700: "#1D8822",
+  green800: "#19751D",
+  green900: "#156119",
+  green1000: "#0f4612",
+  teal100: "#C9ECF0",
+  teal200: "#9EDDE4",
+  teal300: "#71CDD7",
+  teal400: "#54BAC6",
+  teal500: "#4BA7B1",
+  teal600: "#42949D",
+  teal700: "#398088",
+  teal800: "#316D74",
+  teal900: "#295b61",
+  teal1000: "#1d4145",
+  blue100: "#DEE5FF",
+  blue200: "#C3D0FF",
+  blue300: "#A9BCFF",
+  blue400: "#90A8FF",
+  blue500: "#7694FF",
+  blue600: "#5B7FFF",
+  blue700: "#3E68FF",
+  blue800: "#2351F7",
+  blue900: "#1D44CE",
+  blue1000: "#1837A8",
+  purple100: "#EFDFFF",
+  purple200: "#E3C7FF",
+  purple300: "#D6AEFF",
+  purple400: "#C995FF",
+  purple500: "#BD7BFF",
+  purple600: "#AF60FF",
+  purple700: "#9E3FFF",
+  purple800: "#891CF9",
+  purple900: "#7318D0",
+  purple1000: "#5E13AB",
+  magenta100: "#FCDEEC",
+  magenta200: "#FAC3DC",
+  magenta300: "#F7A7CB",
+  magenta400: "#F58ABA",
+  magenta500: "#F26BA8",
+  magenta600: "#EF4592",
+  magenta700: "#D6327C",
+  magenta800: "#B82B6B",
+  magenta900: "#9A2459",
+  magenta1000: "#7D1E49"
+};
+
+// src/internal/color.ts
+function toKebab(str) {
+  return str.replace(/([a-z0-9])([A-Z])/g, "$1-$2").replace(/([A-Z]+)([A-Z][a-z])/g, "$1-$2").replace(/([a-zA-Z])(\d)/g, "$1-$2").toLowerCase();
+}
+function paletteColorCssVar(name) {
+  return `var(--refineui-color-${toKebab(name)})`;
+}
+function hexToRgba(hex, alpha) {
+  const h = hex.replace("#", "");
+  const r = h.length === 3 ? parseInt(h[0] + h[0], 16) : parseInt(h.slice(0, 2), 16);
+  const g = h.length === 3 ? parseInt(h[1] + h[1], 16) : parseInt(h.slice(2, 4), 16);
+  const b = h.length === 3 ? parseInt(h[2] + h[2], 16) : parseInt(h.slice(4, 6), 16);
+  return `rgba(${r}, ${g}, ${b}, ${alpha})`;
+}
+
+// src/semantic/colors.ts
+var SEMANTIC_PALETTE_PAIRS = {
+  backgroundBrandActive: { light: "neutralBlack", dark: "primaryLightGray" },
+  backgroundBrandDisabled: { light: "neutral150", dark: "neutral650" },
+  backgroundBrandHover: { light: "primaryDarkGray", dark: "primaryLightGray" },
+  backgroundBrandStrong: { light: "primaryDarkGray", dark: "primaryGray" },
+  backgroundBrandSubtle: { light: "primaryLightGray", dark: "neutral800" },
+  backgroundBrand: { light: "primaryBlack", dark: "primaryGray" },
+  backgroundDiscoveryHover: { light: "purple700", dark: "purple300" },
+  backgroundDiscoverySubtle: { light: "purple100", dark: "purple900" },
+  backgroundDiscovery: { light: "purple500", dark: "purple500" },
+  backgroundErrorHover: { light: "red700", dark: "red300" },
+  backgroundErrorSubtle: { light: "red100", dark: "red900" },
+  backgroundError: { light: "red500", dark: "red500" },
+  backgroundInfoHover: { light: "blue700", dark: "blue300" },
+  backgroundInfoSubtle: { light: "blue100", dark: "blue900" },
+  backgroundInfo: { light: "blue500", dark: "blue500" },
+  backgroundPrimaryActive: { light: "neutral150", dark: "neutral800" },
+  backgroundPrimaryHover: { light: "neutral100", dark: "neutral850" },
+  backgroundPrimary: { light: "neutralWhite", dark: "neutral900" },
+  backgroundSuccessHover: { light: "green700", dark: "green300" },
+  backgroundSuccessSubtle: { light: "green100", dark: "green900" },
+  backgroundSuccess: { light: "green500", dark: "green500" },
+  backgroundSurfaceActive: { light: "neutral150", dark: "neutral700" },
+  backgroundSurfaceDisabled: { light: "neutral150", dark: "neutral850" },
+  backgroundSurfaceHover: { light: "neutral100", dark: "neutral750" },
+  backgroundSurfaceSelected: { light: "neutral200", dark: "neutral650" },
+  backgroundSurface: { light: "neutralWhite", dark: "neutral800" },
+  backgroundWarningHover: { light: "yellow500", dark: "yellow200" },
+  backgroundWarningSubtle: { light: "yellow100", dark: "yellow900" },
+  backgroundWarning: { light: "yellow300", dark: "yellow300" },
+  borderDefault: { light: "neutral300", dark: "neutral650" },
+  borderDisabled: { light: "neutral250", dark: "neutral700" },
+  borderDiscovery: { light: "purple500", dark: "purple500" },
+  borderError: { light: "red500", dark: "red500" },
+  borderFocus: { light: "neutral750", dark: "neutral350" },
+  borderHover: { light: "neutral500", dark: "neutral500" },
+  borderInfo: { light: "blue500", dark: "blue500" },
+  borderStrong: { light: "neutral450", dark: "neutral550" },
+  borderSubtle: { light: "neutral200", dark: "neutral750" },
+  borderSuccess: { light: "green500", dark: "green500" },
+  borderWarning: { light: "yellow300", dark: "yellow300" },
+  foregroundBrandStrong: { light: "neutralBlack", dark: "primaryLightGray" },
+  foregroundBrand: { light: "primaryBlack", dark: "primaryGray" },
+  foregroundDisabled: { light: "neutral400", dark: "neutral600" },
+  foregroundDiscovery: { light: "purple700", dark: "purple200" },
+  foregroundError: { light: "red700", dark: "red200" },
+  foregroundInfo: { light: "blue700", dark: "blue200" },
+  foregroundInversed: { light: "neutralWhite", dark: "primaryBlack" },
+  foregroundLinkActive: { light: "blue900", dark: "blue200" },
+  foregroundLinkHover: { light: "blue800", dark: "blue300" },
+  foregroundLinkVisited: { light: "blue500", dark: "blue100" },
+  foregroundLink: { light: "blue700", dark: "blue400" },
+  foregroundOnBrand: { light: "neutralWhite", dark: "neutralBlack" },
+  foregroundOnDiscovery: { light: "neutralWhite", dark: "neutralBlack" },
+  foregroundOnError: { light: "neutralWhite", dark: "neutralBlack" },
+  foregroundOnInfo: { light: "neutralWhite", dark: "neutralBlack" },
+  foregroundOnSuccess: { light: "neutralWhite", dark: "neutralBlack" },
+  foregroundOnWarning: { light: "neutralWhite", dark: "neutralBlack" },
+  foregroundPlaceholder: { light: "neutral450", dark: "neutral500" },
+  foregroundPrimaryHover: { light: "neutralBlack", dark: "neutral100" },
+  foregroundPrimary: { light: "primaryBlack", dark: "neutralWhite" },
+  foregroundSecondary: { light: "neutral600", dark: "neutral350" },
+  foregroundSuccess: { light: "green700", dark: "green200" },
+  foregroundTertiary: { light: "neutral500", dark: "neutral450" },
+  foregroundWarning: { light: "yellow700", dark: "yellow200" },
+  surfaceElevated: { light: "neutralWhite", dark: "neutral700" },
+  surfaceInverse: { light: "neutralBlack", dark: "neutralWhite" },
+  surfacePopover: { light: "neutralWhite", dark: "neutral750" },
+  surfaceSunken: { light: "neutral150", dark: "neutral800" },
+  surfaceTooltip: { light: "neutral750", dark: "neutral300" }
+};
+var SEMANTIC_COLOR_ROWS = [
+  ...Object.entries(SEMANTIC_PALETTE_PAIRS).map(([name, { light, dark }]) => [name, light, dark]),
+  ["surfaceOverlay", "__RGBA__", "__RGBA__"]
+];
+var surfaceOverlayRgba = {
+  light: "rgba(0, 0, 0, 0.2)",
+  dark: "rgba(0, 0, 0, 0.6)"
+};
+function buildSemanticColors() {
+  const out = {};
+  for (const name of Object.keys(SEMANTIC_PALETTE_PAIRS)) {
+    const { light, dark } = SEMANTIC_PALETTE_PAIRS[name];
+    out[name] = {
+      light: paletteColorCssVar(light),
+      dark: paletteColorCssVar(dark)
+    };
+  }
+  out.surfaceOverlay = { light: surfaceOverlayRgba.light, dark: surfaceOverlayRgba.dark };
+  return out;
+}
+var semanticColors = buildSemanticColors();
+
+// src/global/motion.ts
+var motion = {
+  duration: {
+    duration0: "0ms",
+    duration150: "150ms",
+    duration180: "180ms",
+    duration200: "200ms",
+    duration240: "240ms",
+    duration260: "260ms",
+    duration280: "280ms",
+    duration320: "320ms",
+    duration380: "380ms",
+    duration800: "800ms",
+    duration1500: "1500ms"
+  },
+  easing: {
+    /** Material-style standard decelerate */
+    easingStandard: "cubic-bezier(0.2, 0, 0, 1)",
+    /** Emphasized spring-ish settle */
+    easingEmphasized: "cubic-bezier(0.16, 1, 0.3, 1)",
+    /** Large panel / drawer slide */
+    easingPanel: "cubic-bezier(0.32, 0.72, 0, 1)",
+    /** Content cross-fade / height morph */
+    easingContent: "cubic-bezier(0.4, 0, 0.2, 1)",
+    easingLinear: "linear",
+    easingEaseOut: "ease-out",
+    easingEaseInOut: "ease-in-out"
+  },
+  scale: {
+    scale96: "0.96",
+    scale98: "0.98",
+    scale115: "1.15"
+  },
+  distance: {
+    /** Small float offset (enter / pressed nudge) — 4px */
+    distance4: "4px"
+  }
+};
+
+// src/semantic/interaction.ts
+var semanticInteraction = {
+  duration: {
+    instant: motion.duration.duration0,
+    fast: motion.duration.duration150,
+    normal: motion.duration.duration180,
+    medium: motion.duration.duration200,
+    slow: motion.duration.duration240,
+    overlay: motion.duration.duration280,
+    panel: motion.duration.duration320,
+    accordionPanel: motion.duration.duration380,
+    accordionContent: motion.duration.duration260,
+    toastEnter: motion.duration.duration280,
+    toastLeave: motion.duration.duration200,
+    skeleton: motion.duration.duration1500,
+    spinner: motion.duration.duration800
+  },
+  easing: {
+    standard: motion.easing.easingStandard,
+    emphasized: motion.easing.easingEmphasized,
+    panel: motion.easing.easingPanel,
+    content: motion.easing.easingContent,
+    linear: motion.easing.easingLinear,
+    easeOut: motion.easing.easingEaseOut,
+    easeInOut: motion.easing.easingEaseInOut
+  },
+  scale: {
+    /** Dialog / modal enter under-scale */
+    enter: motion.scale.scale96,
+    /** Pressed control squash (Button, Slider thumb active, …) */
+    press: motion.scale.scale98,
+    /** Hover grow (Slider thumb, …) */
+    hoverGrow: motion.scale.scale115,
+    /** Component aliases — same Foundation steps as role keys above */
+    dialogEnter: motion.scale.scale96,
+    buttonActive: motion.scale.scale98,
+    sliderThumbHover: motion.scale.scale115
+  },
+  distance: {
+    float: motion.distance.distance4
+  }
+};
+
+// src/global/spacings.ts
+var spacings = {
+  sizeNone: "0",
+  sizeXXXSmall: "2px",
+  sizeXXSmall: "4px",
+  sizeXSmall: "6px",
+  sizeSmall: "8px",
+  sizeMedium: "10px",
+  sizeLarge: "16px",
+  sizeXLarge: "20px",
+  sizeXXLarge: "24px",
+  sizeXXXLarge: "32px"
+};
+
+// src/global/strokeWidths.ts
+var strokeWidths = {
+  strokeWidthNone: "0",
+  strokeWidthHairline: "0.5px",
+  strokeWidthThin: "1px",
+  strokeWidthThick: "2px",
+  strokeWidthThicker: "4px",
+  strokeWidthThickest: "6px"
+};
+
+// src/semantic/focus.ts
+var SEMANTIC_FOCUS_PAIRS = {
+  ringColor: { light: "neutral750", dark: "neutral350" }
+};
+var semanticFocus = {
+  ring: {
+    color: {
+      light: paletteColorCssVar(SEMANTIC_FOCUS_PAIRS.ringColor.light),
+      dark: paletteColorCssVar(SEMANTIC_FOCUS_PAIRS.ringColor.dark)
+    },
+    width: strokeWidths.strokeWidthThick,
+    offset: spacings.sizeXXXSmall,
+    style: "solid"
+  }
+};
+
+// src/global/shadows.ts
+var SHADOW_BASE_LIGHT = colors.primaryBlack;
+var SHADOW_BASE_DARK = colors.neutralBlack;
+var shadowColors = {
+  shadowColorKeyLighter: hexToRgba(SHADOW_BASE_LIGHT, 0.02),
+  shadowColorKeyLight: hexToRgba(SHADOW_BASE_LIGHT, 0.05),
+  shadowColorKey: hexToRgba(SHADOW_BASE_LIGHT, 0.08),
+  shadowColorKeyDark: hexToRgba(SHADOW_BASE_DARK, 0.2),
+  shadowColorKeyDarker: hexToRgba(SHADOW_BASE_DARK, 0.3),
+  shadowColorAmbientLighter: hexToRgba(SHADOW_BASE_LIGHT, 0.02),
+  shadowColorAmbientLight: hexToRgba(SHADOW_BASE_LIGHT, 0.04),
+  shadowColorAmbient: hexToRgba(SHADOW_BASE_LIGHT, 0.06),
+  shadowColorAmbientDark: hexToRgba(SHADOW_BASE_DARK, 0.15),
+  shadowColorAmbientDarker: hexToRgba(SHADOW_BASE_DARK, 0.25)
+};
+var SHADOW_DIMS = {
+  shadow2: { key: "0 1px 2px 0", ambient: "0 2px 4px 0" },
+  shadow4: { key: "0 2px 2px 0", ambient: "0 4px 8px 0" },
+  shadow8: { key: "0 4px 4px 0", ambient: "0 8px 16px 0" },
+  shadow16: { key: "0 8px 8px 0", ambient: "0 16px 32px 0" },
+  shadow24: { key: "0 12px 12px 0", ambient: "0 24px 48px 0" },
+  shadow32: { key: "0 16px 16px 0", ambient: "0 32px 64px 0" },
+  shadow64: { key: "0 24px 24px 0", ambient: "0 48px 96px 0" }
+};
+var SHADOW4_DARK_AMBIENT = "0 6px 10px 0";
+function shadowLevel(keyDim, ambientDim, keyColor, ambientColor) {
+  return {
+    key: `${keyDim} ${keyColor}`,
+    ambient: `${ambientDim} ${ambientColor}`
+  };
+}
+function toBoxShadow(level) {
+  return `${level.key}, ${level.ambient}`;
+}
+var shadows = {
+  shadow2Light: shadowLevel(
+    SHADOW_DIMS.shadow2.key,
+    SHADOW_DIMS.shadow2.ambient,
+    shadowColors.shadowColorKeyLight,
+    shadowColors.shadowColorAmbientLight
+  ),
+  shadow2Dark: shadowLevel(
+    SHADOW_DIMS.shadow2.key,
+    SHADOW_DIMS.shadow2.ambient,
+    shadowColors.shadowColorKeyDark,
+    shadowColors.shadowColorAmbientDark
+  ),
+  shadow4Light: shadowLevel(
+    SHADOW_DIMS.shadow4.key,
+    SHADOW_DIMS.shadow4.ambient,
+    shadowColors.shadowColorKeyLight,
+    shadowColors.shadowColorAmbientLight
+  ),
+  shadow4Dark: shadowLevel(
+    SHADOW_DIMS.shadow4.key,
+    SHADOW4_DARK_AMBIENT,
+    shadowColors.shadowColorKeyDark,
+    shadowColors.shadowColorAmbientDark
+  ),
+  shadow8Light: shadowLevel(
+    SHADOW_DIMS.shadow8.key,
+    SHADOW_DIMS.shadow8.ambient,
+    shadowColors.shadowColorKeyLight,
+    shadowColors.shadowColorAmbientLight
+  ),
+  shadow8Dark: shadowLevel(
+    SHADOW_DIMS.shadow8.key,
+    SHADOW_DIMS.shadow8.ambient,
+    shadowColors.shadowColorKeyDark,
+    shadowColors.shadowColorAmbientDark
+  ),
+  shadow16Light: shadowLevel(
+    SHADOW_DIMS.shadow16.key,
+    SHADOW_DIMS.shadow16.ambient,
+    shadowColors.shadowColorKeyLight,
+    shadowColors.shadowColorAmbientLight
+  ),
+  shadow16Dark: shadowLevel(
+    SHADOW_DIMS.shadow16.key,
+    SHADOW_DIMS.shadow16.ambient,
+    shadowColors.shadowColorKeyDark,
+    shadowColors.shadowColorAmbientDark
+  ),
+  shadow24Light: shadowLevel(
+    SHADOW_DIMS.shadow24.key,
+    SHADOW_DIMS.shadow24.ambient,
+    shadowColors.shadowColorKeyLight,
+    shadowColors.shadowColorAmbientLight
+  ),
+  shadow24Dark: shadowLevel(
+    SHADOW_DIMS.shadow24.key,
+    SHADOW_DIMS.shadow24.ambient,
+    shadowColors.shadowColorKeyDark,
+    shadowColors.shadowColorAmbientDark
+  ),
+  shadow32Light: shadowLevel(
+    SHADOW_DIMS.shadow32.key,
+    SHADOW_DIMS.shadow32.ambient,
+    shadowColors.shadowColorKeyLight,
+    shadowColors.shadowColorAmbientLight
+  ),
+  shadow32Dark: shadowLevel(
+    SHADOW_DIMS.shadow32.key,
+    SHADOW_DIMS.shadow32.ambient,
+    shadowColors.shadowColorKeyDark,
+    shadowColors.shadowColorAmbientDark
+  ),
+  shadow64Light: shadowLevel(
+    SHADOW_DIMS.shadow64.key,
+    SHADOW_DIMS.shadow64.ambient,
+    shadowColors.shadowColorKeyLight,
+    shadowColors.shadowColorAmbientLight
+  ),
+  shadow64Dark: shadowLevel(
+    SHADOW_DIMS.shadow64.key,
+    SHADOW_DIMS.shadow64.ambient,
+    shadowColors.shadowColorKeyDark,
+    shadowColors.shadowColorAmbientDark
+  )
+};
+var shadow2Lighter = shadowLevel(
+  SHADOW_DIMS.shadow2.key,
+  SHADOW_DIMS.shadow2.ambient,
+  shadowColors.shadowColorKeyLighter,
+  shadowColors.shadowColorAmbientLighter
+);
+
+// src/semantic/shadows.ts
+var semanticShadows = {
+  shadow2: { light: shadows.shadow2Light, dark: shadows.shadow2Dark },
+  shadow4: { light: shadows.shadow4Light, dark: shadows.shadow4Dark },
+  shadow8: { light: shadows.shadow8Light, dark: shadows.shadow8Dark },
+  shadow16: { light: shadows.shadow16Light, dark: shadows.shadow16Dark },
+  shadow24: { light: shadows.shadow24Light, dark: shadows.shadow24Dark },
+  shadow32: { light: shadows.shadow32Light, dark: shadows.shadow32Dark },
+  shadow64: { light: shadows.shadow64Light, dark: shadows.shadow64Dark }
+};
+
+// src/semantic/text.ts
+var SEMANTIC_TEXT = {
+  /** Display / marketing hero */
+  displayLg: "heading1",
+  displayMd: "heading2",
+  displaySm: "heading3",
+  /** Page & section headings */
+  headingLg: "heading2",
+  headingMd: "heading3",
+  headingSm: "heading4",
+  /** Component titles (Card, Dialog header) */
+  titleLg: "title1",
+  titleMd: "title2",
+  titleSm: "title3",
+  /** Emphasized subtitles */
+  subtitleLg: "subTitle1",
+  subtitleMd: "subTitle2",
+  /** Primary reading text */
+  bodyLg: "body1",
+  bodyMd: "body2",
+  bodySm: "body3",
+  bodyXs: "body4",
+  /** Form labels, menu row labels */
+  labelLg: "body1",
+  labelMd: "body2",
+  labelSm: "caption1",
+  /** Metadata, helpers, shortcuts */
+  captionLg: "caption1",
+  captionMd: "caption2",
+  captionSm: "caption3"
+};
+
+// src/global/fonts.ts
+var fontFamilies = {
+  fontFamily: "'Inter', sans-serif"
+};
+var fontSizes = {
+  fontSize100: "10px",
+  fontSize200: "12px",
+  fontSize300: "14px",
+  fontSize400: "16px",
+  fontSize500: "20px",
+  fontSize600: "24px",
+  fontSize700: "28px",
+  fontSize800: "32px",
+  fontSize900: "40px",
+  fontSize1000: "64px"
+};
+var fontWeights = {
+  fontWeightRegular: "400",
+  fontWeightMedium: "500",
+  fontWeightSemibold: "600",
+  fontWeightBold: "700",
+  fontWeightHeavy: "800"
+};
+var lineHeights = {
+  lineHeight100: "14px",
+  lineHeight200: "16px",
+  lineHeight300: "20px",
+  lineHeight400: "24px",
+  lineHeight500: "28px",
+  lineHeight600: "32px",
+  lineHeight700: "36px",
+  lineHeight800: "40px",
+  lineHeight900: "60px",
+  lineHeight1000: "86px"
+};
+
+// src/global/sizes.ts
+var iconSizes = {
+  xxsmall: 12,
+  xsmall: 16,
+  small: 20,
+  medium: 24,
+  large: 28,
+  xlarge: 32,
+  xxlarge: 48
+};
+
+// src/global/foundationSizes.ts
+var foundationSizes = {
+  foundationSize10: "1px",
+  foundationSize20: "2px",
+  foundationSize30: "3px",
+  foundationSize40: "4px",
+  foundationSize60: "6px",
+  foundationSize80: "8px",
+  foundationSize100: "10px",
+  foundationSize120: "12px",
+  /** Divider icon inner circle — Web Kit ≈ 40/3 */
+  foundationSize133: "13.33px",
+  foundationSize140: "14px",
+  foundationSize160: "16px",
+  foundationSize200: "20px",
+  foundationSize240: "24px",
+  foundationSize280: "28px",
+  foundationSize300: "30px",
+  foundationSize320: "32px",
+  foundationSize340: "34px",
+  foundationSize360: "36px",
+  foundationSize400: "40px",
+  foundationSize440: "44px",
+  foundationSize480: "48px",
+  foundationSize520: "52px",
+  foundationSize540: "54px",
+  foundationSize600: "60px",
+  foundationSize800: "80px",
+  foundationSize2000: "200px",
+  foundationSize2440: "244px",
+  foundationSize2560: "256px",
+  foundationSize3000: "300px",
+  foundationSize3200: "320px",
+  foundationSize3250: "325px",
+  foundationSize4500: "450px",
+  foundationSize5750: "575px",
+  foundationSize6000: "600px",
+  foundationSize8500: "850px"
+};
+
+// src/semantic/componentSizes.ts
+var F = foundationSizes;
+var componentSizeFoundationKeys = {
+  avatarStatusXxxlarge: "foundationSize140",
+  buttonMinHeightSm: "foundationSize280",
+  buttonMinHeightMd: "foundationSize360",
+  buttonMinHeightLg: "foundationSize480",
+  chipMinHeightSm: "foundationSize200",
+  chipMinHeightMd: "foundationSize240",
+  chipMinHeightLg: "foundationSize320",
+  controlHeightSm: "foundationSize360",
+  controlHeightMd: "foundationSize440",
+  controlHeightLg: "foundationSize520",
+  controlTouchMin: "foundationSize440",
+  controlCheckbox: "foundationSize200",
+  controlCheckboxRadio: "foundationSize200",
+  controlTextareaMin: "foundationSize800",
+  popoverPanelWidth: "foundationSize3250",
+  popoverBeakInsetFromStartEdge: "foundationSize340",
+  popoverBeakInsetFromEndEdge: "foundationSize300",
+  menuPanelWidth: "foundationSize2440",
+  dropdownMenuWidth: "foundationSize2440",
+  sidebarWidth: "foundationSize2560",
+  toastMinWidth: "foundationSize3250",
+  toastMaxWidth: "foundationSize3250",
+  dialogMaxWidth: "foundationSize6000",
+  dialogWidthSm: "foundationSize3000",
+  drawerWidthSm: "foundationSize3200",
+  drawerWidthMd: "foundationSize5750",
+  drawerWidthLg: "foundationSize8500",
+  calendarMinWidth: "foundationSize2560",
+  calendarDaySize: "foundationSize320",
+  tooltipMaxWidth: "foundationSize2000",
+  spinStepperWidth: "foundationSize320",
+  spinFieldPaddingInlineStart: "foundationSize120",
+  switchWidth: "foundationSize440",
+  switchHeight: "foundationSize240",
+  switchThumb: "foundationSize200",
+  switchPadding: "foundationSize20",
+  progressTrackHeightSm: "foundationSize20",
+  progressTrackHeightLg: "foundationSize40",
+  sliderTrackHeightSm: "foundationSize20",
+  sliderTrackHeightMd: "foundationSize40",
+  sliderInteractionHeight: "foundationSize280",
+  paginationButtonMinWidth: "foundationSize400",
+  skeletonDefaultHeight: "foundationSize200",
+  dividerShortEnd: "foundationSize80",
+  dividerIconSlot: "foundationSize200",
+  dividerIconCircleDiameter: "foundationSize133",
+  dividerIconCircleInset: "foundationSize30",
+  accessibleClip: "foundationSize10",
+  spinnerSizeXSmall: "foundationSize160",
+  spinnerSizeSmall: "foundationSize200",
+  spinnerSizeMedium: "foundationSize240",
+  spinnerSizeLarge: "foundationSize280",
+  spinnerSizeXLarge: "foundationSize320",
+  spinnerSizeXXLarge: "foundationSize480",
+  spinnerRingWidthXSmall: "foundationSize20",
+  spinnerRingWidthSmall: "foundationSize20",
+  spinnerRingWidthMedium: "foundationSize20",
+  spinnerRingWidthLarge: "foundationSize30",
+  spinnerRingWidthXLarge: "foundationSize30",
+  spinnerRingWidthXXLarge: "foundationSize40"
+};
+function fromFoundation(key) {
+  return F[componentSizeFoundationKeys[key]];
+}
+var componentSizes = {
+  avatarStatusXxxlarge: fromFoundation("avatarStatusXxxlarge"),
+  buttonMinHeightSm: fromFoundation("buttonMinHeightSm"),
+  buttonMinHeightMd: fromFoundation("buttonMinHeightMd"),
+  buttonMinHeightLg: fromFoundation("buttonMinHeightLg"),
+  chipMinHeightSm: fromFoundation("chipMinHeightSm"),
+  chipMinHeightMd: fromFoundation("chipMinHeightMd"),
+  chipMinHeightLg: fromFoundation("chipMinHeightLg"),
+  controlHeightSm: fromFoundation("controlHeightSm"),
+  controlHeightMd: fromFoundation("controlHeightMd"),
+  controlHeightLg: fromFoundation("controlHeightLg"),
+  controlTouchMin: fromFoundation("controlTouchMin"),
+  controlCheckbox: fromFoundation("controlCheckbox"),
+  controlCheckboxRadio: fromFoundation("controlCheckboxRadio"),
+  controlTextareaMin: fromFoundation("controlTextareaMin"),
+  popoverPanelWidth: fromFoundation("popoverPanelWidth"),
+  popoverBeakInsetFromStartEdge: fromFoundation("popoverBeakInsetFromStartEdge"),
+  popoverBeakInsetFromEndEdge: fromFoundation("popoverBeakInsetFromEndEdge"),
+  menuPanelWidth: fromFoundation("menuPanelWidth"),
+  /** @deprecated Same as `menuPanelWidth` */
+  dropdownMenuWidth: fromFoundation("dropdownMenuWidth"),
+  sidebarWidth: fromFoundation("sidebarWidth"),
+  toastMinWidth: fromFoundation("toastMinWidth"),
+  toastMaxWidth: fromFoundation("toastMaxWidth"),
+  dialogMaxWidth: fromFoundation("dialogMaxWidth"),
+  /** Viewport-relative — not a Foundation px step */
+  dialogMaxHeightViewport: "90vh",
+  dialogWidthSm: fromFoundation("dialogWidthSm"),
+  drawerWidthSm: fromFoundation("drawerWidthSm"),
+  drawerWidthMd: fromFoundation("drawerWidthMd"),
+  drawerWidthLg: fromFoundation("drawerWidthLg"),
+  calendarMinWidth: fromFoundation("calendarMinWidth"),
+  calendarDaySize: fromFoundation("calendarDaySize"),
+  tooltipMaxWidth: fromFoundation("tooltipMaxWidth"),
+  spinStepperWidth: fromFoundation("spinStepperWidth"),
+  spinFieldPaddingInlineStart: fromFoundation("spinFieldPaddingInlineStart"),
+  switchWidth: fromFoundation("switchWidth"),
+  switchHeight: fromFoundation("switchHeight"),
+  switchThumb: fromFoundation("switchThumb"),
+  switchPadding: fromFoundation("switchPadding"),
+  progressTrackHeightSm: fromFoundation("progressTrackHeightSm"),
+  progressTrackHeightLg: fromFoundation("progressTrackHeightLg"),
+  sliderTrackHeightSm: fromFoundation("sliderTrackHeightSm"),
+  sliderTrackHeightMd: fromFoundation("sliderTrackHeightMd"),
+  sliderInteractionHeight: fromFoundation("sliderInteractionHeight"),
+  paginationButtonMinWidth: fromFoundation("paginationButtonMinWidth"),
+  skeletonDefaultHeight: fromFoundation("skeletonDefaultHeight"),
+  dividerShortEnd: fromFoundation("dividerShortEnd"),
+  dividerIconSlot: fromFoundation("dividerIconSlot"),
+  dividerIconCircleDiameter: fromFoundation("dividerIconCircleDiameter"),
+  dividerIconCircleInset: fromFoundation("dividerIconCircleInset"),
+  accessibleClip: fromFoundation("accessibleClip"),
+  spinnerSizeXSmall: fromFoundation("spinnerSizeXSmall"),
+  spinnerSizeSmall: fromFoundation("spinnerSizeSmall"),
+  spinnerSizeMedium: fromFoundation("spinnerSizeMedium"),
+  spinnerSizeLarge: fromFoundation("spinnerSizeLarge"),
+  spinnerSizeXLarge: fromFoundation("spinnerSizeXLarge"),
+  spinnerSizeXXLarge: fromFoundation("spinnerSizeXXLarge"),
+  spinnerRingWidthXSmall: fromFoundation("spinnerRingWidthXSmall"),
+  spinnerRingWidthSmall: fromFoundation("spinnerRingWidthSmall"),
+  spinnerRingWidthMedium: fromFoundation("spinnerRingWidthMedium"),
+  spinnerRingWidthLarge: fromFoundation("spinnerRingWidthLarge"),
+  spinnerRingWidthXLarge: fromFoundation("spinnerRingWidthXLarge"),
+  spinnerRingWidthXXLarge: fromFoundation("spinnerRingWidthXXLarge")
+};
+
+// src/global/opacities.ts
+var opacities = {
+  opacityFull: "1",
+  opacityDisabled: "0.5",
+  /** Ghost button hover wash (dark) — same alpha as `overlays.ghostButtonHoverDark` */
+  opacityGhostHover: "0.08"
+};
+
+// src/global/overlays.ts
+var overlays = {
+  /** Light-mode scrim snapshot — keep in sync with `surfaceOverlayRgba.light` */
+  backdrop: "rgba(0, 0, 0, 0.2)",
+  /** Dark Ghost button hover */
+  ghostButtonHoverDark: `rgba(255, 255, 255, ${opacities.opacityGhostHover})`
+};
+
+// src/global/borderRadii.ts
+var borderRadii = {
+  roundedNone: "0",
+  roundedXSmall: "2px",
+  roundedSmall: "4px",
+  roundedMedium: "6px",
+  roundedLarge: "8px",
+  roundedXLarge: "12px",
+  roundedXXLarge: "16px",
+  roundedCircle: "9999px"
+};
+
+// src/global/typographys.ts
+var { fontFamily } = fontFamilies;
+var { fontWeightRegular, fontWeightMedium, fontWeightSemibold, fontWeightBold, fontWeightHeavy } = fontWeights;
+var typographys = {
+  heading1: {
+    fontFamily,
+    fontSize: fontSizes.fontSize1000,
+    fontWeight: fontWeightHeavy,
+    lineHeight: lineHeights.lineHeight1000
+  },
+  heading2: {
+    fontFamily,
+    fontSize: fontSizes.fontSize900,
+    fontWeight: fontWeightBold,
+    lineHeight: lineHeights.lineHeight900
+  },
+  heading3: {
+    fontFamily,
+    fontSize: fontSizes.fontSize800,
+    fontWeight: fontWeightBold,
+    lineHeight: lineHeights.lineHeight800
+  },
+  heading4: {
+    fontFamily,
+    fontSize: fontSizes.fontSize700,
+    fontWeight: fontWeightSemibold,
+    lineHeight: lineHeights.lineHeight700
+  },
+  title1: {
+    fontFamily,
+    fontSize: fontSizes.fontSize800,
+    fontWeight: fontWeightSemibold,
+    lineHeight: lineHeights.lineHeight800
+  },
+  title2: {
+    fontFamily,
+    fontSize: fontSizes.fontSize700,
+    fontWeight: fontWeightSemibold,
+    lineHeight: lineHeights.lineHeight700
+  },
+  title3: {
+    fontFamily,
+    fontSize: fontSizes.fontSize600,
+    fontWeight: fontWeightSemibold,
+    lineHeight: lineHeights.lineHeight600
+  },
+  subTitle1: {
+    fontFamily,
+    fontSize: fontSizes.fontSize500,
+    fontWeight: fontWeightSemibold,
+    lineHeight: lineHeights.lineHeight500
+  },
+  subTitle2: {
+    fontFamily,
+    fontSize: fontSizes.fontSize400,
+    fontWeight: fontWeightSemibold,
+    lineHeight: lineHeights.lineHeight400
+  },
+  body1: {
+    fontFamily,
+    fontSize: fontSizes.fontSize400,
+    fontWeight: fontWeightMedium,
+    lineHeight: lineHeights.lineHeight400
+  },
+  body2: {
+    fontFamily,
+    fontSize: fontSizes.fontSize300,
+    fontWeight: fontWeightMedium,
+    lineHeight: lineHeights.lineHeight300
+  },
+  body3: {
+    fontFamily,
+    fontSize: fontSizes.fontSize300,
+    fontWeight: fontWeightRegular,
+    lineHeight: lineHeights.lineHeight300
+  },
+  body4: {
+    fontFamily,
+    fontSize: fontSizes.fontSize200,
+    fontWeight: fontWeightRegular,
+    lineHeight: lineHeights.lineHeight200
+  },
+  caption1: {
+    fontFamily,
+    fontSize: fontSizes.fontSize200,
+    fontWeight: fontWeightMedium,
+    lineHeight: lineHeights.lineHeight200
+  },
+  caption2: {
+    fontFamily,
+    fontSize: fontSizes.fontSize200,
+    fontWeight: fontWeightRegular,
+    lineHeight: lineHeights.lineHeight200
+  },
+  caption3: {
+    fontFamily,
+    fontSize: fontSizes.fontSize100,
+    fontWeight: fontWeightRegular,
+    lineHeight: lineHeights.lineHeight100
+  }
+};
+
+// src/global/zIndex.ts
+var zIndex = {
+  zIndexBackground: "0",
+  zIndexContent: "1",
+  zIndexOverlay: "100",
+  zIndexPopup: "1000",
+  zIndexMessages: "10000",
+  zIndexFloating: "1000",
+  zIndexPriority: "100000",
+  zIndexDebug: "999999"
+};
+
+// src/global/textAlignments.ts
+var textAlignments = {
+  start: "start",
+  center: "center",
+  end: "end",
+  justify: "justify"
+};
+// Annotate the CommonJS export names for ESM import in node:
+0 && (module.exports = {
+  SEMANTIC_COLOR_ROWS,
+  SEMANTIC_FOCUS_PAIRS,
+  SEMANTIC_PALETTE_PAIRS,
+  SEMANTIC_TEXT,
+  borderRadii,
+  colors,
+  componentSizeFoundationKeys,
+  componentSizes,
+  fontFamilies,
+  fontSizes,
+  fontWeights,
+  foundationSizes,
+  iconSizes,
+  lineHeights,
+  motion,
+  opacities,
+  overlays,
+  semanticColors,
+  semanticFocus,
+  semanticInteraction,
+  semanticShadows,
+  shadow2Lighter,
+  shadowColors,
+  shadows,
+  spacings,
+  strokeWidths,
+  surfaceOverlayRgba,
+  textAlignments,
+  toBoxShadow,
+  typographys,
+  zIndex
+});