@conductor-by-89soone/tokens 0.0.0

package/dist/index.d.ts

@@ -0,0 +1,54 @@
+export { Tokens, tokens } from './tokens.js';
+export { Breakpoints, breakpoints } from './breakpoints.js';
+
+/**
+ * Namespace prefix owned by Conductor (ADR-006).
+ *
+ * CSS custom properties are emitted as `--cdt-<key>` and class selectors as
+ * `cdt-<block>`. Downstream packages read this constant instead of hard-coding
+ * the string so that a rename stays a one-line change.
+ */
+declare const CDT_PREFIX: "cdt-";
+/** Published name of this package. */
+declare const PACKAGE_NAME: "@conductor-by-89soone/tokens";
+
+/**
+ * Static schema shared by the token source and every build artifact.
+ *
+ * Mirrors `docs/30_technical_architecture/conductor_data_model.md`:
+ * ENT-TOK-001 `TokenDefinition`, ENT-TOK-002 `TokenGroup`, ENT-TOK-003 `TokenAlias`.
+ *
+ * Refs: WP-002 FR-TOK-001 FR-TOK-002
+ */
+/** primitive ← semantic ← component. References may only point at the same tier or a lower one. */
+type TokenTier = "primitive" | "semantic" | "component";
+/**
+ * Contrast classification (`srs_final.md` 12.1, tokens spec 5.1).
+ * `body` 4.5:1 · `large` 3:1 · `nonText` 3:1 · `decorative` excluded from `checkContrast`.
+ */
+type TokenUsage = "body" | "large" | "nonText" | "decorative";
+/** ENT-TOK-001. A token carries either a literal `value` or an `alias` to another token key. */
+interface TokenDefinition {
+    /** Dot-notation key, e.g. `surface.raised`. Unique across the whole source. */
+    readonly key: string;
+    readonly tier: TokenTier;
+    /** Literal value. May embed `{other.key}` references, as `elevation.overlay` does. */
+    readonly value?: string | number;
+    /** Whole-value reference to another token key, stored bare (no braces). */
+    readonly alias?: string;
+    readonly usage?: TokenUsage;
+    readonly description: string;
+    /** Excludes the key from the FR-QA-001 cross-theme symmetry check. */
+    readonly themeSpecific?: boolean;
+    /** `lucide-react` icon name. Required and non-empty on `status.*` and `severity.*`. */
+    readonly icon?: string;
+}
+/** ENT-TOK-002. Derived from the first segment of each key; never hand-edited. */
+interface TokenGroup {
+    readonly groupKey: string;
+    readonly tier: TokenTier;
+    readonly memberKeys: readonly string[];
+    readonly order: number;
+}
+
+export { CDT_PREFIX, PACKAGE_NAME, type TokenDefinition, type TokenGroup, type TokenTier, type TokenUsage };

package/dist/index.js

@@ -0,0 +1,388 @@
+// src/constants.ts
+var CDT_PREFIX = "cdt-";
+var PACKAGE_NAME = "@conductor-by-89soone/tokens";
+
+// src/tokens.ts
+var tokens = {
+  surface: {
+    base: "var(--cdt-surface-base)",
+    canvas: "var(--cdt-surface-canvas)",
+    subtle: "var(--cdt-surface-subtle)",
+    "2": "var(--cdt-surface-2)",
+    raised: "var(--cdt-surface-raised)",
+    elevated: "var(--cdt-surface-elevated)",
+    overlay: "var(--cdt-surface-overlay)",
+    glass: "var(--cdt-surface-glass)",
+    timeline: "var(--cdt-surface-timeline)",
+    track: "var(--cdt-surface-track)"
+  },
+  text: {
+    primary: "var(--cdt-text-primary)",
+    secondary: "var(--cdt-text-secondary)",
+    muted: "var(--cdt-text-muted)",
+    faint: "var(--cdt-text-faint)",
+    inverse: "var(--cdt-text-inverse)",
+    monoPayload: "var(--cdt-text-mono-payload)"
+  },
+  border: {
+    subtle: "var(--cdt-border-subtle)",
+    default: "var(--cdt-border-default)",
+    strong: "var(--cdt-border-strong)",
+    control: "var(--cdt-border-control)",
+    DEFAULT: "var(--cdt-border)"
+  },
+  accent: {
+    DEFAULT: "var(--cdt-accent)",
+    strong: "var(--cdt-accent-strong)",
+    soft: "var(--cdt-accent-soft)",
+    glow: "var(--cdt-accent-glow)"
+  },
+  status: {
+    queued: "var(--cdt-status-queued)",
+    running: "var(--cdt-status-running)",
+    waiting: "var(--cdt-status-waiting)",
+    success: "var(--cdt-status-success)",
+    partial: "var(--cdt-status-partial)",
+    danger: "var(--cdt-status-danger)",
+    neutralEnd: "var(--cdt-status-neutral-end)"
+  },
+  meter: {
+    normal: "var(--cdt-meter-normal)",
+    warning: "var(--cdt-meter-warning)",
+    exceeded: "var(--cdt-meter-exceeded)"
+  },
+  severity: {
+    read: "var(--cdt-severity-read)",
+    write: "var(--cdt-severity-write)",
+    destructive: "var(--cdt-severity-destructive)",
+    blocked: "var(--cdt-severity-blocked)"
+  },
+  font: {
+    sans: "var(--cdt-font-sans)",
+    mono: "var(--cdt-font-mono)",
+    size: {
+      "2xs": "var(--cdt-font-size-2xs)",
+      xs: "var(--cdt-font-size-xs)",
+      sm: "var(--cdt-font-size-sm)",
+      base: "var(--cdt-font-size-base)",
+      md: "var(--cdt-font-size-md)",
+      lg: "var(--cdt-font-size-lg)",
+      xl: "var(--cdt-font-size-xl)"
+    },
+    lineHeight: {
+      "2xs": "var(--cdt-font-line-height-2xs)",
+      xs: "var(--cdt-font-line-height-xs)",
+      sm: "var(--cdt-font-line-height-sm)",
+      base: "var(--cdt-font-line-height-base)",
+      md: "var(--cdt-font-line-height-md)",
+      lg: "var(--cdt-font-line-height-lg)",
+      xl: "var(--cdt-font-line-height-xl)"
+    },
+    weight: {
+      sectionLabel: "var(--cdt-font-weight-section-label)"
+    }
+  },
+  elevation: {
+    raised: "var(--cdt-elevation-raised)",
+    hover: "var(--cdt-elevation-hover)",
+    overlay: "var(--cdt-elevation-overlay)"
+  },
+  focusRing: "var(--cdt-focus-ring)",
+  state: {
+    hover: "var(--cdt-state-hover)",
+    selected: "var(--cdt-state-selected)",
+    disabled: "var(--cdt-state-disabled)",
+    disabledPolicy: "var(--cdt-state-disabled-policy)"
+  },
+  space: {
+    "1": "var(--cdt-space-1)",
+    "2": "var(--cdt-space-2)",
+    "3": "var(--cdt-space-3)",
+    "4": "var(--cdt-space-4)",
+    "5": "var(--cdt-space-5)",
+    "6": "var(--cdt-space-6)",
+    "7": "var(--cdt-space-7)",
+    "8": "var(--cdt-space-8)"
+  },
+  radius: {
+    xs: "var(--cdt-radius-xs)",
+    sm: "var(--cdt-radius-sm)",
+    md: "var(--cdt-radius-md)",
+    lg: "var(--cdt-radius-lg)",
+    xl: "var(--cdt-radius-xl)",
+    pill: "var(--cdt-radius-pill)"
+  },
+  z: {
+    base: "var(--cdt-z-base)",
+    raised: "var(--cdt-z-raised)",
+    sticky: "var(--cdt-z-sticky)",
+    drawer: "var(--cdt-z-drawer)",
+    overlay: "var(--cdt-z-overlay)",
+    popover: "var(--cdt-z-popover)"
+  },
+  breakpoint: {
+    sm: "var(--cdt-breakpoint-sm)",
+    md: "var(--cdt-breakpoint-md)",
+    lg: "var(--cdt-breakpoint-lg)"
+  },
+  motion: {
+    fast: "var(--cdt-motion-fast)",
+    standard: "var(--cdt-motion-standard)",
+    bounce: "var(--cdt-motion-bounce)"
+  },
+  button: {
+    minHeight: "var(--cdt-button-min-height)",
+    minHeightCompact: "var(--cdt-button-min-height-compact)",
+    paddingBlock: "var(--cdt-button-padding-block)",
+    paddingInline: "var(--cdt-button-padding-inline)",
+    radius: "var(--cdt-button-radius)",
+    fontSize: "var(--cdt-button-font-size)",
+    gap: "var(--cdt-button-gap)",
+    transition: "var(--cdt-button-transition)",
+    primary: {
+      background: "var(--cdt-button-primary-background)",
+      backgroundHover: "var(--cdt-button-primary-background-hover)",
+      text: "var(--cdt-button-primary-text)",
+      border: "var(--cdt-button-primary-border)",
+      shadow: "var(--cdt-button-primary-shadow)",
+      shadowHover: "var(--cdt-button-primary-shadow-hover)"
+    },
+    secondary: {
+      background: "var(--cdt-button-secondary-background)",
+      backgroundHover: "var(--cdt-button-secondary-background-hover)",
+      text: "var(--cdt-button-secondary-text)",
+      border: "var(--cdt-button-secondary-border)",
+      borderHover: "var(--cdt-button-secondary-border-hover)"
+    },
+    ghost: {
+      background: "var(--cdt-button-ghost-background)",
+      backgroundHover: "var(--cdt-button-ghost-background-hover)",
+      text: "var(--cdt-button-ghost-text)",
+      textHover: "var(--cdt-button-ghost-text-hover)",
+      border: "var(--cdt-button-ghost-border)"
+    },
+    disabled: {
+      background: "var(--cdt-button-disabled-background)",
+      text: "var(--cdt-button-disabled-text)",
+      border: "var(--cdt-button-disabled-border)"
+    },
+    policyDisabled: {
+      background: "var(--cdt-button-policy-disabled-background)",
+      text: "var(--cdt-button-policy-disabled-text)",
+      border: "var(--cdt-button-policy-disabled-border)"
+    },
+    focusRing: "var(--cdt-button-focus-ring)"
+  },
+  card: {
+    background: "var(--cdt-card-background)",
+    border: "var(--cdt-card-border)",
+    radius: "var(--cdt-card-radius)",
+    radiusCompact: "var(--cdt-card-radius-compact)",
+    padding: "var(--cdt-card-padding)",
+    paddingCompact: "var(--cdt-card-padding-compact)",
+    shadow: "var(--cdt-card-shadow)",
+    interactive: {
+      borderHover: "var(--cdt-card-interactive-border-hover)",
+      shadowHover: "var(--cdt-card-interactive-shadow-hover)",
+      translateHover: "var(--cdt-card-interactive-translate-hover)",
+      transition: "var(--cdt-card-interactive-transition)"
+    },
+    grid: {
+      minColumn: "var(--cdt-card-grid-min-column)",
+      minColumnCompact: "var(--cdt-card-grid-min-column-compact)",
+      gap: "var(--cdt-card-grid-gap)"
+    }
+  },
+  badge: {
+    radius: "var(--cdt-badge-radius)",
+    paddingBlock: "var(--cdt-badge-padding-block)",
+    paddingInline: "var(--cdt-badge-padding-inline)",
+    fontSize: "var(--cdt-badge-font-size)",
+    lineHeight: "var(--cdt-badge-line-height)",
+    gap: "var(--cdt-badge-gap)",
+    iconSize: "var(--cdt-badge-icon-size)",
+    fill: {
+      text: "var(--cdt-badge-fill-text)"
+    },
+    marker: {
+      background: "var(--cdt-badge-marker-background)",
+      text: "var(--cdt-badge-marker-text)",
+      border: "var(--cdt-badge-marker-border)",
+      dotSize: "var(--cdt-badge-marker-dot-size)",
+      dotRing: "var(--cdt-badge-marker-dot-ring)",
+      dotRingWidth: "var(--cdt-badge-marker-dot-ring-width)"
+    },
+    severity: {
+      text: "var(--cdt-badge-severity-text)"
+    }
+  },
+  table: {
+    headerText: "var(--cdt-table-header-text)",
+    headerFontSize: "var(--cdt-table-header-font-size)",
+    headerBorder: "var(--cdt-table-header-border)",
+    headerBorderWidth: "var(--cdt-table-header-border-width)",
+    cellBorder: "var(--cdt-table-cell-border)",
+    cellPaddingBlock: "var(--cdt-table-cell-padding-block)",
+    cellPaddingInline: "var(--cdt-table-cell-padding-inline)",
+    rowBackgroundHover: "var(--cdt-table-row-background-hover)",
+    rowTransition: "var(--cdt-table-row-transition)",
+    linkText: "var(--cdt-table-link-text)",
+    linkTextHover: "var(--cdt-table-link-text-hover)",
+    numFontFamily: "var(--cdt-table-num-font-family)",
+    scrollBreakpoint: "var(--cdt-table-scroll-breakpoint)"
+  },
+  timeline: {
+    background: "var(--cdt-timeline-background)",
+    border: "var(--cdt-timeline-border)",
+    stepBackgroundHover: "var(--cdt-timeline-step-background-hover)",
+    markerBackground: "var(--cdt-timeline-marker-background)",
+    markerRing: "var(--cdt-timeline-marker-ring)",
+    markerBorder: "var(--cdt-timeline-marker-border)"
+  },
+  codeBlock: {
+    background: "var(--cdt-code-block-background)",
+    border: "var(--cdt-code-block-border)",
+    text: "var(--cdt-code-block-text)"
+  },
+  kbd: {
+    background: "var(--cdt-kbd-background)",
+    border: "var(--cdt-kbd-border)",
+    borderBottom: "var(--cdt-kbd-border-bottom)",
+    text: "var(--cdt-kbd-text)"
+  },
+  banner: {
+    info: {
+      background: "var(--cdt-banner-info-background)",
+      border: "var(--cdt-banner-info-border)",
+      text: "var(--cdt-banner-info-text)"
+    },
+    warning: {
+      background: "var(--cdt-banner-warning-background)",
+      border: "var(--cdt-banner-warning-border)",
+      text: "var(--cdt-banner-warning-text)"
+    },
+    danger: {
+      background: "var(--cdt-banner-danger-background)",
+      border: "var(--cdt-banner-danger-border)",
+      text: "var(--cdt-banner-danger-text)"
+    }
+  },
+  emptyState: {
+    titleText: "var(--cdt-empty-state-title-text)",
+    descriptionText: "var(--cdt-empty-state-description-text)",
+    padding: "var(--cdt-empty-state-padding)"
+  },
+  feedbackMeter: {
+    trackBackground: "var(--cdt-feedback-meter-track-background)",
+    fillNormal: "var(--cdt-feedback-meter-fill-normal)",
+    fillWarning: "var(--cdt-feedback-meter-fill-warning)",
+    fillExceeded: "var(--cdt-feedback-meter-fill-exceeded)",
+    height: "var(--cdt-feedback-meter-height)"
+  },
+  progressRing: {
+    trackStroke: "var(--cdt-progress-ring-track-stroke)",
+    indicatorStroke: "var(--cdt-progress-ring-indicator-stroke)",
+    labelText: "var(--cdt-progress-ring-label-text)",
+    size: "var(--cdt-progress-ring-size)",
+    sizeCompact: "var(--cdt-progress-ring-size-compact)"
+  },
+  spinner: {
+    trackStroke: "var(--cdt-spinner-track-stroke)",
+    indicatorStroke: "var(--cdt-spinner-indicator-stroke)",
+    size: "var(--cdt-spinner-size)",
+    sizeCompact: "var(--cdt-spinner-size-compact)"
+  },
+  input: {
+    minHeight: "var(--cdt-input-min-height)",
+    minHeightCompact: "var(--cdt-input-min-height-compact)",
+    background: "var(--cdt-input-background)",
+    backgroundFocus: "var(--cdt-input-background-focus)",
+    text: "var(--cdt-input-text)",
+    placeholder: "var(--cdt-input-placeholder)",
+    border: "var(--cdt-input-border)",
+    borderHover: "var(--cdt-input-border-hover)",
+    borderFocus: "var(--cdt-input-border-focus)",
+    borderInvalid: "var(--cdt-input-border-invalid)",
+    radius: "var(--cdt-input-radius)",
+    paddingBlock: "var(--cdt-input-padding-block)",
+    paddingInline: "var(--cdt-input-padding-inline)",
+    focusRing: "var(--cdt-input-focus-ring)",
+    label: {
+      text: "var(--cdt-input-label-text)",
+      fontSize: "var(--cdt-input-label-font-size)"
+    },
+    error: {
+      text: "var(--cdt-input-error-text)"
+    },
+    transition: "var(--cdt-input-transition)"
+  },
+  overlay: {
+    scrim: "var(--cdt-overlay-scrim)",
+    scrimBlur: "var(--cdt-overlay-scrim-blur)",
+    scrimZ: "var(--cdt-overlay-scrim-z)",
+    background: "var(--cdt-overlay-background)",
+    backgroundBlur: "var(--cdt-overlay-background-blur)",
+    border: "var(--cdt-overlay-border)",
+    radius: "var(--cdt-overlay-radius)",
+    shadow: "var(--cdt-overlay-shadow)",
+    contentZ: "var(--cdt-overlay-content-z)",
+    drawerZ: "var(--cdt-overlay-drawer-z)",
+    drawerBackground: "var(--cdt-overlay-drawer-background)",
+    drawerWidth: "var(--cdt-overlay-drawer-width)",
+    enter: "var(--cdt-overlay-enter)",
+    exit: "var(--cdt-overlay-exit)"
+  },
+  page: {
+    headingSize: "var(--cdt-page-heading-size)",
+    headingLineHeight: "var(--cdt-page-heading-line-height)",
+    stackGap: "var(--cdt-page-stack-gap)",
+    stackGapCompact: "var(--cdt-page-stack-gap-compact)",
+    contentStackGap: "var(--cdt-page-content-stack-gap)",
+    splitBreakpoint: "var(--cdt-page-split-breakpoint)",
+    splitAsideWidth: "var(--cdt-page-split-aside-width)",
+    shellNavWidth: "var(--cdt-page-shell-nav-width)",
+    shellNavWidthCompact: "var(--cdt-page-shell-nav-width-compact)",
+    topbarZ: "var(--cdt-page-topbar-z)",
+    navZ: "var(--cdt-page-nav-z)",
+    skipLinkZ: "var(--cdt-page-skip-link-z)"
+  },
+  appShell: {
+    navWidth: "var(--cdt-app-shell-nav-width)",
+    mainMaxWidth: "var(--cdt-app-shell-main-max-width)",
+    overlayBackground: "var(--cdt-app-shell-overlay-background)"
+  },
+  skipLink: {
+    background: "var(--cdt-skip-link-background)",
+    text: "var(--cdt-skip-link-text)"
+  },
+  navList: {
+    background: "var(--cdt-nav-list-background)",
+    border: "var(--cdt-nav-list-border)"
+  },
+  navItem: {
+    text: "var(--cdt-nav-item-text)",
+    textActive: "var(--cdt-nav-item-text-active)",
+    backgroundHover: "var(--cdt-nav-item-background-hover)",
+    backgroundActive: "var(--cdt-nav-item-background-active)",
+    indicator: "var(--cdt-nav-item-indicator)"
+  },
+  navSectionLabel: {
+    text: "var(--cdt-nav-section-label-text)"
+  },
+  topBar: {
+    background: "var(--cdt-top-bar-background)",
+    border: "var(--cdt-top-bar-border)",
+    eyebrowText: "var(--cdt-top-bar-eyebrow-text)",
+    titleText: "var(--cdt-top-bar-title-text)",
+    minHeight: "var(--cdt-top-bar-min-height)"
+  }
+};
+
+// src/breakpoints.ts
+var breakpoints = {
+  sm: 560,
+  md: 800,
+  lg: 1080
+};
+
+export { CDT_PREFIX, PACKAGE_NAME, breakpoints, tokens };