@scattered-light/base-ui-theme 0.1.0

package/dist/styles/theme/theme-spacing.css

@@ -0,0 +1,28 @@
+/* Theme spacing / density — alias base scale for controls and layout. Edit here to tighten or loosen the whole UI. */
+
+:root {
+  --theme-control-height-xs: var(--space-7);
+  --theme-control-height-sm: var(--space-9);
+  --theme-control-height-md: var(--space-11);
+  --theme-control-height-lg: var(--space-13);
+
+  --theme-control-padding-block: var(--space-3);
+  --theme-control-padding-block-xs: var(--space-1);
+  --theme-control-padding-block-sm: var(--space-2);
+  --theme-control-padding-block-lg: var(--space-4);
+
+  --theme-control-padding-inline: var(--space-4);
+  --theme-control-padding-inline-xs: var(--space-2);
+  --theme-control-padding-inline-sm: var(--space-3);
+  --theme-control-padding-inline-lg: var(--space-5);
+
+  --theme-gap-control: var(--space-2);
+  --theme-gap-control-xs: var(--space-1);
+  --theme-gap-control-sm: var(--space-1-5);
+
+  --theme-gap-stack-sm: var(--space-2);
+  --theme-gap-stack-md: var(--space-4);
+  --theme-gap-stack-lg: var(--space-6);
+
+  --theme-inset-popup: var(--space-2);
+}

package/dist/styles/theme/theme-stroke.css

@@ -0,0 +1,7 @@
+/* Theme stroke / border width roles. */
+
+:root {
+  --theme-stroke-default: var(--border-width-thin);
+  --theme-stroke-emphasis: var(--border-width-medium);
+  --theme-stroke-strong: var(--border-width-thick);
+}

package/dist/styles/theme/theme-typography.css

@@ -0,0 +1,218 @@
+/* Theme typography — full presets (family, size, weight, line-height, letter-spacing). Base scale: ../base/typography.css */
+
+/* Tier vocabulary: minimize (xs) → condense (sm) → base (md UI copy) → magnify (larger body) → maximize (display / marketing). */
+
+/* -------------------------------------------------------------------------- */
+/* Maximize — display family, xs … 4xl (headlines, dialog titles)              */
+/* -------------------------------------------------------------------------- */
+
+:root {
+  --theme-maximize-xs-font-family: var(--font-family-display);
+  --theme-maximize-xs-font-size: var(--font-size-xs);
+  --theme-maximize-xs-font-weight: var(--font-weight-semibold);
+  --theme-maximize-xs-line-height: var(--line-height-taller);
+  --theme-maximize-xs-letter-spacing: var(--letter-spacing-normal);
+
+  --theme-maximize-sm-font-family: var(--font-family-display);
+  --theme-maximize-sm-font-size: var(--font-size-sm);
+  --theme-maximize-sm-font-weight: var(--font-weight-semibold);
+  --theme-maximize-sm-line-height: var(--line-height-tall);
+  --theme-maximize-sm-letter-spacing: var(--letter-spacing-normal);
+
+  --theme-maximize-md-font-family: var(--font-family-display);
+  --theme-maximize-md-font-size: var(--font-size-md);
+  --theme-maximize-md-font-weight: var(--font-weight-semibold);
+  --theme-maximize-md-line-height: var(--line-height-base);
+  --theme-maximize-md-letter-spacing: var(--letter-spacing-normal);
+
+  --theme-maximize-lg-font-family: var(--font-family-display);
+  --theme-maximize-lg-font-size: var(--font-size-lg);
+  --theme-maximize-lg-font-weight: var(--font-weight-semibold);
+  --theme-maximize-lg-line-height: var(--line-height-base);
+  --theme-maximize-lg-letter-spacing: var(--letter-spacing-normal);
+
+  --theme-maximize-xl-font-family: var(--font-family-display);
+  --theme-maximize-xl-font-size: var(--font-size-xl);
+  --theme-maximize-xl-font-weight: var(--font-weight-semibold);
+  --theme-maximize-xl-line-height: var(--line-height-base);
+  --theme-maximize-xl-letter-spacing: var(--letter-spacing-normal);
+
+  --theme-maximize-2xl-font-family: var(--font-family-display);
+  --theme-maximize-2xl-font-size: var(--font-size-2xl);
+  --theme-maximize-2xl-font-weight: var(--font-weight-semibold);
+  --theme-maximize-2xl-line-height: var(--line-height-short);
+  --theme-maximize-2xl-letter-spacing: var(--letter-spacing-normal);
+
+  --theme-maximize-3xl-font-family: var(--font-family-display);
+  --theme-maximize-3xl-font-size: var(--font-size-3xl);
+  --theme-maximize-3xl-font-weight: var(--font-weight-semibold);
+  --theme-maximize-3xl-line-height: var(--line-height-shorter);
+  --theme-maximize-3xl-letter-spacing: var(--letter-spacing-normal);
+
+  --theme-maximize-4xl-font-family: var(--font-family-display);
+  --theme-maximize-4xl-font-size: var(--font-size-4xl);
+  --theme-maximize-4xl-font-weight: var(--font-weight-semibold);
+  --theme-maximize-4xl-line-height: var(--line-height-none);
+  --theme-maximize-4xl-letter-spacing: var(--letter-spacing-normal);
+
+  /* Shorthand: font (weight size/line-height family) — letter-spacing separate */
+  --theme-maximize-xs-font: var(--theme-maximize-xs-font-weight) var(--theme-maximize-xs-font-size) / var(--theme-maximize-xs-line-height) var(--theme-maximize-xs-font-family);
+  --theme-maximize-sm-font: var(--theme-maximize-sm-font-weight) var(--theme-maximize-sm-font-size) / var(--theme-maximize-sm-line-height) var(--theme-maximize-sm-font-family);
+  --theme-maximize-md-font: var(--theme-maximize-md-font-weight) var(--theme-maximize-md-font-size) / var(--theme-maximize-md-line-height) var(--theme-maximize-md-font-family);
+  --theme-maximize-lg-font: var(--theme-maximize-lg-font-weight) var(--theme-maximize-lg-font-size) / var(--theme-maximize-lg-line-height) var(--theme-maximize-lg-font-family);
+  --theme-maximize-xl-font: var(--theme-maximize-xl-font-weight) var(--theme-maximize-xl-font-size) / var(--theme-maximize-xl-line-height) var(--theme-maximize-xl-font-family);
+  --theme-maximize-2xl-font: var(--theme-maximize-2xl-font-weight) var(--theme-maximize-2xl-font-size) / var(--theme-maximize-2xl-line-height) var(--theme-maximize-2xl-font-family);
+  --theme-maximize-3xl-font: var(--theme-maximize-3xl-font-weight) var(--theme-maximize-3xl-font-size) / var(--theme-maximize-3xl-line-height) var(--theme-maximize-3xl-font-family);
+  --theme-maximize-4xl-font: var(--theme-maximize-4xl-font-weight) var(--theme-maximize-4xl-font-size) / var(--theme-maximize-4xl-line-height) var(--theme-maximize-4xl-font-family);
+
+  /* -------------------------------------------------------------------------- */
+  /* Base — default UI copy, inputs, prose                                      */
+  /* -------------------------------------------------------------------------- */
+
+  --theme-font-base-font-family: var(--font-family-body);
+  --theme-font-base-font-size: var(--font-size-md);
+  --theme-font-base-font-weight: var(--font-weight-normal);
+  --theme-font-base-line-height: var(--line-height-base);
+  --theme-font-base-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-base-font: var(--theme-font-base-font-weight) var(--theme-font-base-font-size) / var(--theme-font-base-line-height) var(--theme-font-base-font-family);
+
+  --theme-font-base-subtitle-font-family: var(--font-family-body);
+  --theme-font-base-subtitle-font-size: var(--font-size-md);
+  --theme-font-base-subtitle-font-weight: var(--font-weight-bold);
+  --theme-font-base-subtitle-line-height: var(--line-height-base);
+  --theme-font-base-subtitle-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-base-subtitle-font: var(--theme-font-base-subtitle-font-weight) var(--theme-font-base-subtitle-font-size) / var(--theme-font-base-subtitle-line-height) var(--theme-font-base-subtitle-font-family);
+
+  --theme-font-base-link-font-family: var(--font-family-body);
+  --theme-font-base-link-font-size: var(--font-size-md);
+  --theme-font-base-link-font-weight: var(--font-weight-normal);
+  --theme-font-base-link-line-height: var(--line-height-base);
+  --theme-font-base-link-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-base-link-font: var(--theme-font-base-link-font-weight) var(--theme-font-base-link-font-size) / var(--theme-font-base-link-line-height) var(--theme-font-base-link-font-family);
+
+  /* Base-trigger — primary interactive control (buttons, dense triggers): base metrics + medium weight */
+  --theme-font-base-trigger-font-family: var(--font-family-body);
+  --theme-font-base-trigger-font-size: var(--font-size-md);
+  --theme-font-base-trigger-font-weight: var(--font-weight-medium);
+  --theme-font-base-trigger-line-height: var(--line-height-tall);
+  --theme-font-base-trigger-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-base-trigger-font: var(--theme-font-base-trigger-font-weight) var(--theme-font-base-trigger-font-size) / var(--theme-font-base-trigger-line-height) var(--theme-font-base-trigger-font-family);
+
+  /* Base-label — form / chrome labels (sm + medium) */
+  --theme-font-base-label-font-family: var(--font-family-body);
+  --theme-font-base-label-font-size: var(--font-size-sm);
+  --theme-font-base-label-font-weight: var(--font-weight-medium);
+  --theme-font-base-label-line-height: var(--line-height-tall);
+  --theme-font-base-label-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-base-label-font: var(--theme-font-base-label-font-weight) var(--theme-font-base-label-font-size) / var(--theme-font-base-label-line-height) var(--theme-font-base-label-font-family);
+
+  /* Base-label — active state for tabs*/
+  --theme-font-base-label-active-font-weight: var(--font-weight-semibold);
+
+  /* Base switch */
+  --theme-font-base-switch-font-family: var(--font-family-body);
+  --theme-font-base-switch-font-size: var(--font-size-xs);
+  --theme-font-base-switch-font-weight: var(--font-weight-medium);
+  --theme-font-base-switch-line-height: var(--line-height-tall);
+  --theme-font-base-switch-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-base-switch-font: var(--theme-font-base-switch-font-weight) var(--theme-font-base-switch-font-size) / var(--theme-font-base-switch-line-height) var(--theme-font-base-switch-font-family);
+
+  /* -------------------------------------------------------------------------- */
+  /* Magnify (lg) — larger body (e.g. lg input)                         */
+  /* -------------------------------------------------------------------------- */
+  --theme-font-magnify-font-family: var(--font-family-body);
+  --theme-font-magnify-font-size: var(--font-size-lg);
+  --theme-font-magnify-font-weight: var(--font-weight-normal);
+  --theme-font-magnify-line-height: var(--line-height-base);
+  --theme-font-magnify-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-magnify-font: var(--theme-font-magnify-font-weight) var(--theme-font-magnify-font-size) / var(--theme-font-magnify-line-height) var(--theme-font-magnify-font-family);
+
+  /* Magnify switch text*/
+  --theme-font-magnify-switch-font-family: var(--font-family-body);
+  --theme-font-magnify-switch-font-size: var(--font-size-sm);
+  --theme-font-magnify-switch-font-weight: var(--font-weight-normal);
+  --theme-font-magnify-switch-line-height: var(--line-height-base);
+  --theme-font-magnify-switch-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-magnify-switch-font: var(--theme-font-magnify-switch-font-weight) var(--theme-font-magnify-switch-font-size) / var(--theme-font-magnify-switch-line-height) var(--theme-font-magnify-switch-font-family);
+
+  /* -------------------------------------------------------------------------- */
+  /* Condense (sm) — three weights + uppercase emphasis                         */
+  /* -------------------------------------------------------------------------- */
+
+  --theme-font-condense-font-family: var(--font-family-body);
+  --theme-font-condense-font-size: var(--font-size-sm);
+  --theme-font-condense-font-weight: var(--font-weight-normal);
+  --theme-font-condense-line-height: var(--line-height-tall);
+  --theme-font-condense-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-condense-font: var(--theme-font-condense-font-weight) var(--theme-font-condense-font-size) / var(--theme-font-condense-line-height) var(--theme-font-condense-font-family);
+
+  --theme-font-condense-subtitle-font-family: var(--font-family-body);
+  --theme-font-condense-subtitle-font-size: var(--font-size-sm);
+  --theme-font-condense-subtitle-font-weight: var(--font-weight-bold);
+  --theme-font-condense-subtitle-line-height: var(--line-height-tall);
+  --theme-font-condense-subtitle-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-condense-subtitle-font: var(--theme-font-condense-subtitle-font-weight) var(--theme-font-condense-subtitle-font-size) / var(--theme-font-condense-subtitle-line-height) var(--theme-font-condense-subtitle-font-family);
+
+  --theme-font-condense-subtitle-label-font-family: var(--font-family-body);
+  --theme-font-condense-subtitle-label-font-size: var(--font-size-sm);
+  --theme-font-condense-subtitle-label-font-weight: var(--font-weight-semibold);
+  --theme-font-condense-subtitle-label-line-height: var(--line-height-tall);
+  --theme-font-condense-subtitle-label-letter-spacing: var(--letter-spacing-wider);
+  --theme-font-condense-subtitle-label-font: var(--theme-font-condense-subtitle-label-font-weight) var(--theme-font-condense-subtitle-label-font-size) / var(--theme-font-condense-subtitle-label-line-height) var(--theme-font-condense-subtitle-label-font-family);
+  --theme-font-condense-subtitle-label-text-transform: uppercase;
+
+  --theme-font-condense-link-font-family: var(--font-family-body);
+  --theme-font-condense-link-font-size: var(--font-size-sm);
+  --theme-font-condense-link-font-weight: var(--font-weight-normal);
+  --theme-font-condense-link-line-height: var(--line-height-tall);
+  --theme-font-condense-link-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-condense-link-font: var(--theme-font-condense-link-font-weight) var(--theme-font-condense-link-font-size) / var(--theme-font-condense-link-line-height) var(--theme-font-condense-link-font-family);
+
+  /* Condense switch text*/
+  --theme-font-condense-switch-font-family: var(--font-family-body);
+  --theme-font-condense-switch-font-size: var(--font-size-xxs);
+  --theme-font-condense-switch-font-weight: var(--font-weight-medium);
+  --theme-font-condense-switch-line-height: var(--line-height-tall);
+  --theme-font-condense-switch-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-condense-switch-font: var(--theme-font-condense-switch-font-weight) var(--theme-font-condense-switch-font-size) / var(--theme-font-condense-switch-line-height) var(--theme-font-condense-switch-font-family);
+
+  /* -------------------------------------------------------------------------- */
+  /* Minimize (xs) — three weights + uppercase emphasis                         */
+  /* -------------------------------------------------------------------------- */
+
+  --theme-font-minimize-font-family: var(--font-family-body);
+  --theme-font-minimize-font-size: var(--font-size-xs);
+  --theme-font-minimize-font-weight: var(--font-weight-normal);
+  --theme-font-minimize-line-height: var(--line-height-taller);
+  --theme-font-minimize-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-minimize-font: var(--theme-font-minimize-font-weight) var(--theme-font-minimize-font-size) / var(--theme-font-minimize-line-height) var(--theme-font-minimize-font-family);
+
+  --theme-font-minimize-subtitle-font-family: var(--font-family-body);
+  --theme-font-minimize-subtitle-font-size: var(--font-size-xs);
+  --theme-font-minimize-subtitle-font-weight: var(--font-weight-bold);
+  --theme-font-minimize-subtitle-line-height: var(--line-height-taller);
+  --theme-font-minimize-subtitle-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-minimize-subtitle-font: var(--theme-font-minimize-subtitle-font-weight) var(--theme-font-minimize-subtitle-font-size) / var(--theme-font-minimize-subtitle-line-height) var(--theme-font-minimize-subtitle-font-family);
+
+  --theme-font-minimize-subtitle-label-font-family: var(--font-family-body);
+  --theme-font-minimize-subtitle-label-font-size: var(--font-size-xs);
+  --theme-font-minimize-subtitle-label-font-weight: var(--font-weight-semibold);
+  --theme-font-minimize-subtitle-label-line-height: var(--line-height-taller);
+  --theme-font-minimize-subtitle-label-letter-spacing: var(--letter-spacing-widest);
+  --theme-font-minimize-subtitle-label-font: var(--theme-font-minimize-subtitle-label-font-weight) var(--theme-font-minimize-subtitle-label-font-size) / var(--theme-font-minimize-subtitle-label-line-height) var(--theme-font-minimize-subtitle-label-font-family);
+  --theme-font-minimize-subtitle-label-text-transform: uppercase;
+  
+  --theme-font-minimize-link-font-family: var(--font-family-body);
+  --theme-font-minimize-link-font-size: var(--font-size-xs);
+  --theme-font-minimize-link-font-weight: var(--font-weight-normal);
+  --theme-font-minimize-link-line-height: var(--line-height-taller);
+  --theme-font-minimize-link-letter-spacing: var(--letter-spacing-normal);
+  --theme-font-minimize-link-font: var(--theme-font-minimize-link-font-weight) var(--theme-font-minimize-link-font-size) / var(--theme-font-minimize-link-line-height) var(--theme-font-minimize-link-font-family);
+
+  /* Code / mono */
+  --theme-font-code-font-family: var(--font-family-mono);
+  --theme-font-code-font-size: var(--font-size-sm);
+  --theme-font-code-font-weight: var(--font-weight-normal);
+  --theme-font-code-line-height: var(--line-height-tall);
+  --theme-font-code-letter-spacing: var(--letter-spacing-normal);
+}

package/dist/styles/utilities/color-styles.css

@@ -0,0 +1,34 @@
+
+/* Utility classes for colors */
+.bg-primary {
+  background-color: var(--surface-base);
+}
+
+.bg-raised {
+  background-color: var(--surface-raised);
+}
+
+.bg-accent {
+  background-color: var(--interactive-default);
+  color: var(--text-on-accent);
+}
+
+.text-primary {
+  color: var(--text-primary);
+}
+
+.text-secondary {
+  color: var(--text-secondary);
+}
+
+.text-accent {
+  color: var(--text-accent);
+}
+
+.border-default {
+  border-color: var(--border-default);
+}
+
+.border-accent {
+  border-color: var(--border-accent);
+}

package/dist/styles/utilities/layout-styles.css

@@ -0,0 +1,19 @@
+
+/* Responsive visibility utilities */
+@media (max-width: 29.99em) {
+  .hide-on-mobile {
+    display: none !important;
+  }
+}
+
+@media (min-width: 30em) and (max-width: 47.99em) {
+  .hide-on-tablet {
+    display: none !important;
+  }
+}
+
+@media (min-width: 48em) {
+  .hide-on-desktop {
+    display: none !important;
+  }
+}

package/dist/styles/utilities/text-styles.css

@@ -0,0 +1,102 @@
+/* Text style utilities — theme presets from theme/theme-typography.css (tiers: minimize → condense → base → magnify → maximize). */
+
+/* Maximize (display / marketing) */
+.text-style-maximize-4xl {
+  font: var(--theme-maximize-4xl-font);
+  letter-spacing: var(--theme-maximize-4xl-letter-spacing);
+}
+
+.text-style-maximize-3xl {
+  font: var(--theme-maximize-3xl-font);
+  letter-spacing: var(--theme-maximize-3xl-letter-spacing);
+}
+
+.text-style-maximize-2xl {
+  font: var(--theme-maximize-2xl-font);
+  letter-spacing: var(--theme-maximize-2xl-letter-spacing);
+}
+
+.text-style-maximize-xl {
+  font: var(--theme-maximize-xl-font);
+  letter-spacing: var(--theme-maximize-xl-letter-spacing);
+}
+
+.text-style-maximize-lg {
+  font: var(--theme-maximize-lg-font);
+  letter-spacing: var(--theme-maximize-lg-letter-spacing);
+}
+
+.text-style-maximize-md {
+  font: var(--theme-maximize-md-font);
+  letter-spacing: var(--theme-maximize-md-letter-spacing);
+}
+
+.text-style-maximize-sm {
+  font: var(--theme-maximize-sm-font);
+  letter-spacing: var(--theme-maximize-sm-letter-spacing);
+}
+
+.text-style-maximize-xs {
+  font: var(--theme-maximize-xs-font);
+  letter-spacing: var(--theme-maximize-xs-letter-spacing);
+}
+
+/* Base */
+.text-style-base-subtitle {
+  font: var(--theme-font-base-subtitle-font);
+  letter-spacing: var(--theme-font-base-subtitle-letter-spacing);
+}
+
+.text-style-base {
+  font: var(--theme-font-base-font);
+  letter-spacing: var(--theme-font-base-letter-spacing);
+}
+
+.text-style-base-link {
+  font: var(--theme-font-base-link-font);
+  letter-spacing: var(--theme-font-base-link-letter-spacing);
+}
+
+/* Condense (sm) */
+.text-style-condense-subtitle {
+  font: var(--theme-font-condense-subtitle-font);
+  letter-spacing: var(--theme-font-condense-subtitle-letter-spacing);
+}
+
+.text-style-condense {
+  font: var(--theme-font-condense-font);
+  letter-spacing: var(--theme-font-condense-letter-spacing);
+}
+
+.text-style-condense-link {
+  font: var(--theme-font-condense-link-font);
+  letter-spacing: var(--theme-font-condense-link-letter-spacing);
+}
+
+.text-style-condense-subtitle-label {
+  font: var(--theme-font-condense-subtitle-label-font);
+  letter-spacing: var(--theme-font-condense-subtitle-label-letter-spacing);
+  text-transform: var(--theme-font-condense-subtitle-label-text-transform);
+}
+
+/* Minimize (xs) */
+.text-style-minimize-subtitle {
+  font: var(--theme-font-minimize-subtitle-font);
+  letter-spacing: var(--theme-font-minimize-subtitle-letter-spacing);
+}
+
+.text-style-minimize {
+  font: var(--theme-font-minimize-font);
+  letter-spacing: var(--theme-font-minimize-letter-spacing);
+}
+
+.text-style-minimize-link {
+  font: var(--theme-font-minimize-link-font);
+  letter-spacing: var(--theme-font-minimize-link-letter-spacing);
+}
+
+.text-style-minimize-subtitle-label {
+  font: var(--theme-font-minimize-subtitle-label-font);
+  letter-spacing: var(--theme-font-minimize-subtitle-label-letter-spacing);
+  text-transform: var(--theme-font-minimize-subtitle-label-text-transform);
+}

package/package.json

@@ -0,0 +1,75 @@
+{
+  "name": "@scattered-light/base-ui-theme",
+  "version": "0.1.0",
+  "description": "Base UI primitives with Mojave design tokens (React).",
+  "type": "module",
+  "private": false,
+  "sideEffects": false,
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js",
+      "default": "./dist/index.js"
+    },
+    "./styles.css": "./dist/styles/index.css",
+    "./package.json": "./package.json"
+  },
+  "files": [
+    "dist"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "dev": "vite",
+    "build": "tsc && vite build",
+    "build:lib": "tsup && node scripts/copy-lib-assets.mjs",
+    "prepack": "npm run build:lib",
+    "preview": "vite preview",
+    "lint": "eslint \"src/**/*.{ts,tsx}\"",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  },
+  "peerDependencies": {
+    "@base-ui/react": "^1.3.0",
+    "@material-symbols/font-400": "^0.39.0",
+    "react": "^18.0.0",
+    "react-dom": "^18.0.0"
+  },
+  "devDependencies": {
+    "@axe-core/react": "^4.10.1",
+    "@base-ui/react": "^1.3.0",
+    "@eslint/js": "^9.17.0",
+    "@material-symbols/font-400": "^0.39.4",
+    "@storybook/addon-a11y": "8.4.7",
+    "@storybook/addon-essentials": "^8.4.7",
+    "@storybook/addon-interactions": "^8.4.7",
+    "@storybook/addon-links": "^8.4.7",
+    "@storybook/addon-themes": "^8.4.7",
+    "@storybook/blocks": "^8.4.7",
+    "@storybook/react": "^8.4.7",
+    "@storybook/react-vite": "^8.4.7",
+    "@types/node": "^22.10.0",
+    "@types/react": "^18.2.43",
+    "@types/react-dom": "^18.2.17",
+    "@vitejs/plugin-react": "^4.2.1",
+    "ag-grid-community": "^35.0.0",
+    "ag-grid-react": "^35.0.0",
+    "eslint": "^9.17.0",
+    "eslint-plugin-jsx-a11y": "^6.10.2",
+    "eslint-plugin-react": "^7.37.2",
+    "eslint-plugin-react-hooks": "^5.0.0",
+    "eslint-plugin-react-refresh": "^0.4.16",
+    "react": "^18.2.0",
+    "react-dom": "^18.2.0",
+    "storybook": "^8.4.7",
+    "storybook-addon-tag-badges": "^1.4.0",
+    "tsup": "^8.3.5",
+    "typescript": "^5.3.3",
+    "typescript-eslint": "^8.18.0",
+    "vite": "^5.0.8"
+  }
+}