@zendir/ui 0.1.5 → 0.1.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,7 +1,7 @@
1
1
  import { default as React } from 'react';
2
2
  import { StatusLevel } from '../utils';
3
3
 
4
- export type IconName = 'satellite' | 'satellite-transmit' | 'satellite-receive' | 'satellite-off' | 'antenna' | 'antenna-transmit' | 'antenna-receive' | 'antenna-off' | 'mission' | 'altitude' | 'solar' | 'thermal' | 'propulsion' | 'payload' | 'processor' | 'equipment' | 'netcom' | 'hardware' | 'orbit' | 'ground-station' | 'battery' | 'location' | 'rocket' | 'thermometer' | 'settings' | 'notifications' | 'notifications-off' | 'warning' | 'error' | 'info' | 'check' | 'close' | 'add' | 'remove' | 'edit' | 'delete' | 'search' | 'filter' | 'refresh' | 'sync' | 'download' | 'upload' | 'expand' | 'collapse' | 'fullscreen' | 'fullscreen-exit' | 'visibility' | 'visibility-off' | 'lock' | 'unlock' | 'arrow-up' | 'arrow-down' | 'arrow-left' | 'arrow-right' | 'chevron-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'menu' | 'more-vert' | 'more-horiz' | 'chart' | 'list' | 'grid' | 'timeline' | 'calendar' | 'clock' | 'play' | 'pause' | 'stop' | 'record' | 'link' | 'link-off' | 'send' | 'message' | 'mail' | 'photo-camera' | 'images' | 'error-outline';
4
+ export type IconName = 'satellite' | 'satellite-transmit' | 'satellite-receive' | 'satellite-off' | 'antenna' | 'antenna-transmit' | 'antenna-receive' | 'antenna-off' | 'mission' | 'altitude' | 'solar' | 'thermal' | 'propulsion' | 'payload' | 'processor' | 'equipment' | 'netcom' | 'hardware' | 'orbit' | 'ground-station' | 'battery' | 'location' | 'rocket' | 'thermometer' | 'settings' | 'notifications' | 'notifications-off' | 'warning' | 'error' | 'info' | 'check' | 'close' | 'add' | 'remove' | 'edit' | 'delete' | 'search' | 'filter' | 'refresh' | 'sync' | 'download' | 'upload' | 'expand' | 'collapse' | 'fullscreen' | 'fullscreen-exit' | 'visibility' | 'visibility-off' | 'lock' | 'unlock' | 'arrow-up' | 'arrow-down' | 'arrow-left' | 'arrow-right' | 'chevron-up' | 'chevron-down' | 'chevron-left' | 'chevron-right' | 'menu' | 'more-vert' | 'more-horiz' | 'chart' | 'list' | 'grid' | 'timeline' | 'calendar' | 'clock' | 'play' | 'play-arrow' | 'pause' | 'stop' | 'skip-next' | 'skip-previous' | 'fast-forward' | 'fast-rewind' | 'record' | 'link' | 'link-off' | 'send' | 'message' | 'mail' | 'photo-camera' | 'images' | 'error-outline';
5
5
  export interface IconProps {
6
6
  /** Icon name from the library */
7
7
  name: IconName;
@@ -74,8 +74,13 @@ const ICON_PATHS = {
74
74
  calendar: "M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM9 10H7v2h2v-2zm4 0h-2v2h2v-2zm4 0h-2v2h2v-2z",
75
75
  clock: "M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67z",
76
76
  play: "M8 5v14l11-7z",
77
+ "play-arrow": "M8 5v14l11-7z",
77
78
  pause: "M6 19h4V5H6v14zm8-14v14h4V5h-4z",
78
79
  stop: "M6 6h12v12H6z",
80
+ "skip-next": "M6 18l8.5-6L6 6v12zM16 6v12h2V6h-2z",
81
+ "skip-previous": "M6 6h2v12H6zm3.5 6l8.5 6V6z",
82
+ "fast-forward": "M4 18l8.5-6L4 6v12zm9-12v12l8.5-6L13 6z",
83
+ "fast-rewind": "M11 18V6l-8.5 6 8.5 6zm.5-6l8.5 6V6l-8.5 6z",
79
84
  record: "M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 14c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4z",
80
85
  // === Communication Icons ===
81
86
  link: "M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z",
@@ -1 +1 @@
1
- {"version":3,"file":"Icon.js","sources":["../../../src/react/core/Icon.tsx"],"sourcesContent":["/**\n * @zendir/ui - Icon Component\n * \n * Complete icon library following Astro UX Design System.\n * \n * Astro UX Compliance (https://www.astrouxds.com/components/icons-and-symbols/):\n * - Consistent icon sizing\n * - Accessibility via aria-label\n * - Use with MonitoringIcon for status indication\n * \n * IMPORTANT per Astro UX Guidelines:\n * - Icons themselves should NOT change color based on status\n * - Status is communicated via a separate StatusIndicator/StatusSymbol\n * - Use MonitoringIcon component to combine icon + status + label\n * - The `status` prop is provided for convenience but should be used sparingly\n * \n * @example\n * ```tsx\n * // Standard usage - neutral color\n * <Icon name=\"satellite\" />\n * <Icon name=\"antenna\" size={32} />\n * \n * // Custom color (use sparingly)\n * <Icon name=\"thermal\" color=\"#4dacff\" />\n * \n * // For status indication, use MonitoringIcon instead:\n * <MonitoringIcon icon=\"antenna\" status=\"normal\" label=\"Antenna-1\" />\n * ```\n */\n\nimport React, { memo } from 'react';\nimport { useTheme } from '../theme';\nimport type { StatusLevel } from '../utils';\n\nexport type IconName =\n // Astro Space/Mission Icons\n | 'satellite'\n | 'satellite-transmit'\n | 'satellite-receive'\n | 'satellite-off'\n | 'antenna'\n | 'antenna-transmit'\n | 'antenna-receive'\n | 'antenna-off'\n | 'mission'\n | 'altitude'\n | 'solar'\n | 'thermal'\n | 'propulsion'\n | 'payload'\n | 'processor'\n | 'equipment'\n | 'netcom'\n | 'hardware'\n | 'orbit'\n | 'ground-station'\n | 'battery'\n | 'location'\n | 'rocket'\n | 'thermometer'\n // System Icons\n | 'settings'\n | 'notifications'\n | 'notifications-off'\n | 'warning'\n | 'error'\n | 'info'\n | 'check'\n | 'close'\n | 'add'\n | 'remove'\n | 'edit'\n | 'delete'\n | 'search'\n | 'filter'\n | 'refresh'\n | 'sync'\n | 'download'\n | 'upload'\n | 'expand'\n | 'collapse'\n | 'fullscreen'\n | 'fullscreen-exit'\n | 'visibility'\n | 'visibility-off'\n | 'lock'\n | 'unlock'\n // Navigation Icons\n | 'arrow-up'\n | 'arrow-down'\n | 'arrow-left'\n | 'arrow-right'\n | 'chevron-up'\n | 'chevron-down'\n | 'chevron-left'\n | 'chevron-right'\n | 'menu'\n | 'more-vert'\n | 'more-horiz'\n // Data Icons\n | 'chart'\n | 'list'\n | 'grid'\n | 'timeline'\n | 'calendar'\n | 'clock'\n | 'play'\n | 'pause'\n | 'stop'\n | 'record'\n // Communication Icons\n | 'link'\n | 'link-off'\n | 'send'\n | 'message'\n | 'mail'\n | 'photo-camera'\n | 'images'\n | 'error-outline';\n\nexport interface IconProps {\n /** Icon name from the library */\n name: IconName;\n /** Icon size in pixels (default: 24) */\n size?: number;\n /** Status-based coloring (uses Astro status colors) */\n status?: StatusLevel;\n /** Custom color (overrides status) */\n color?: string;\n /** Custom className */\n className?: string;\n /** Accessibility label */\n 'aria-label'?: string;\n /** Click handler */\n onClick?: () => void;\n /** Custom style */\n style?: React.CSSProperties;\n}\n\n/**\n * Complete Astro UX Icon Library\n * SVG paths for 24x24 viewBox\n */\nconst ICON_PATHS: Record<IconName, string | string[]> = {\n // === Astro Space/Mission Icons ===\n satellite: 'M8.87867 11.7071C8.09762 10.9261 8.09762 9.65973 8.87867 8.87868C9.65972 8.09763 10.926 8.09763 11.7071 8.87868L13.1213 10.2929C13.9024 11.0739 13.9024 12.3403 13.1213 13.1213C12.3403 13.9024 11.0739 13.9024 10.2929 13.1213L8.87867 11.7071ZM4.05653 16.7845C3.61958 16.3475 3.67956 15.6228 4.1824 15.2636L8.17156 12.4142L9.58578 13.8284L6.73637 17.8176C6.3772 18.3204 5.65248 18.3804 5.21553 17.9435L4.05653 16.7845ZM15.2636 4.1824C15.6228 3.67956 16.3475 3.61958 16.7844 4.05653L17.9435 5.21554C18.3804 5.65249 18.3204 6.37721 17.8176 6.73638L13.8284 9.58578L12.4142 8.17157L15.2636 4.1824Z',\n 'satellite-transmit': 'M8.87871 8.87868C9.65976 8.09763 10.9261 8.09763 11.7071 8.87868L13.1213 10.2929C13.9024 11.0739 13.9024 12.3403 13.1213 13.1213C12.3403 13.9024 11.074 13.9024 10.2929 13.1213L8.87871 11.7071C8.09766 10.9261 8.09766 9.65973 8.87871 8.87868ZM4.05657 15.3702C4.09551 15.3313 4.13761 15.2956 4.18243 15.2636L8.1716 12.4142L9.58581 13.8284L6.73641 17.8176C6.4154 18.267 5.79085 18.3711 5.34144 18.0501C5.29662 18.0181 5.25452 17.9824 5.21557 17.9435L4.05657 16.7845C3.66604 16.3939 3.66604 15.7608 4.05657 15.3702ZM20.9898 11C21.5828 11 22.0551 11.5125 21.9948 12.1055C21.4823 17.3315 17.3416 21.4721 12.1156 21.9947C11.5226 22.055 11 21.5927 11 20.9998C11 20.4973 11.3719 20.0551 11.8744 20.0048C16.1658 19.5928 19.5828 16.1757 19.9949 11.8844C20.0451 11.3819 20.4773 11 20.9898 11ZM16.9776 11C17.5946 11 18.08 11.546 17.989 12.1527C17.5035 15.1355 15.1469 17.5015 12.1531 17.9868C11.5462 18.088 11 17.5925 11 16.9757C11 16.4803 11.3641 16.0657 11.8597 15.9848C13.8884 15.6338 15.5032 14.0794 15.9425 12.083L15.9864 11.8595C16.0673 11.364 16.482 11 16.9776 11ZM16.6903 3.97335L16.7845 4.05653L17.9435 5.21554C17.9824 5.25449 18.0181 5.29659 18.0501 5.34141C18.3464 5.75625 18.2805 6.32032 17.9152 6.65713L17.8176 6.73638L13.8285 9.58578L12.4142 8.17157L15.2636 4.1824C15.2957 4.13758 15.3313 4.09548 15.3703 4.05653C15.7308 3.69605 16.298 3.66832 16.6903 3.97335Z',\n 'satellite-receive': 'M19.5 18C20.3285 18 21 18.6716 21 19.5C21 20.3284 20.3285 21 19.5 21C18.6716 21 18 20.3284 18 19.5C18 18.6716 18.6716 18 19.5 18ZM8.1716 12.4142L9.58581 13.8284L6.73641 17.8176C6.4154 18.267 5.79085 18.3711 5.34144 18.0501C5.29662 18.0181 5.25452 17.9824 5.21557 17.9435L4.05657 16.7845C3.66604 16.3939 3.66604 15.7608 4.05657 15.3702C4.09551 15.3313 4.13761 15.2956 4.18243 15.2636L8.1716 12.4142ZM17 16C17.5523 16 18 16.4477 18 17C18 17.5523 17.5523 18 17 18C16.4477 18 16 17.5523 16 17C16 16.4477 16.4477 16 17 16ZM15 14C15.5523 14 16 14.4477 16 15C16 15.5523 15.5523 16 15 16C14.4477 16 14 15.5523 14 15C14 14.4477 14.4477 14 15 14ZM11.7071 8.87868L13.1213 10.2929C13.9024 11.0739 13.9024 12.3403 13.1213 13.1213C12.3403 13.9024 11.074 13.9024 10.2929 13.1213L8.87871 11.7071C8.09766 10.9261 8.09766 9.65973 8.87871 8.87868C9.65976 8.09763 10.9261 8.09763 11.7071 8.87868ZM16.6903 3.97335L16.7845 4.05653L17.9435 5.21554C17.9824 5.25449 18.0181 5.29659 18.0501 5.34141C18.3464 5.75625 18.2805 6.32032 17.9152 6.65713L17.8176 6.73638L13.8285 9.58578L12.4142 8.17157L15.2636 4.1824C15.2957 4.13758 15.3313 4.09548 15.3703 4.05653C15.7007 3.72609 16.2049 3.67525 16.5888 3.90402L16.6903 3.97335Z',\n 'satellite-off': 'M8.87867 11.7071C8.09762 10.9261 8.09762 9.65973 8.87867 8.87868C9.65972 8.09763 10.926 8.09763 11.7071 8.87868L13.1213 10.2929C13.9024 11.0739 13.9024 12.3403 13.1213 13.1213C12.3403 13.9024 11.0739 13.9024 10.2929 13.1213L8.87867 11.7071ZM4.05653 16.7845C3.61958 16.3475 3.67956 15.6228 4.1824 15.2636L8.17156 12.4142L9.58578 13.8284L6.73637 17.8176C6.3772 18.3204 5.65248 18.3804 5.21553 17.9435L4.05653 16.7845ZM15.2636 4.1824C15.6228 3.67956 16.3475 3.61958 16.7844 4.05653L17.9435 5.21554C18.3804 5.65249 18.3204 6.37721 17.8176 6.73638L13.8284 9.58578L12.4142 8.17157L15.2636 4.1824Z',\n antenna: 'M12.5 8C13.6506 8 14.5833 8.89543 14.5833 10C14.5833 10.7398 14.1649 11.3858 13.5428 11.7318L13.5416 22H11.4583L11.4582 11.7324C10.8356 11.3866 10.4166 10.7403 10.4166 10C10.4166 8.89543 11.3494 8 12.5 8ZM6.63099 2.32732C6.98124 2.70075 7.0016 3.27819 6.64763 3.65177C3.61283 6.82949 3.34936 11.6553 6.02151 15.1201C6.33286 15.5271 6.26451 16.1001 5.86774 16.4431C5.40872 16.8398 4.68582 16.775 4.3192 16.294C1.13831 12.1519 1.38131 6.45292 4.85709 2.56983L5.07393 2.33438L5.1678 2.24643C5.59314 1.89421 6.24722 1.91815 6.63099 2.32732ZM19.9142 2.24643L20.0081 2.33438C23.6894 6.21966 24.0087 12.0674 20.7628 16.294C20.3962 16.775 19.6733 16.8398 19.2143 16.4431C18.8175 16.1001 18.7492 15.5271 19.0605 15.1201C21.7327 11.6553 21.4692 6.82949 18.4344 3.65177C18.0804 3.27819 18.1008 2.70075 18.4511 2.32732C18.8348 1.91815 19.4889 1.89421 19.9142 2.24643ZM9.8013 5.34518C10.1466 5.71337 10.1537 6.26509 9.82646 6.65682C8.45162 8.33503 8.32337 10.6773 9.50741 12.4838C9.79011 12.9062 9.72281 13.4541 9.33916 13.7858C8.86156 14.1986 8.10517 14.1177 7.75278 13.6059C6.10277 11.1439 6.21558 7.93692 8.0237 5.58971L8.20397 5.3653L8.28854 5.2755C8.70418 4.88648 9.40006 4.91737 9.8013 5.34518ZM16.7935 5.2755L16.8781 5.3653C18.8573 7.72924 19.0325 11.0644 17.3292 13.6059C16.9769 14.1177 16.2205 14.1986 15.7429 13.7858C15.3592 13.4541 15.2919 12.9062 15.5746 12.4838C16.7586 10.6773 16.6304 8.33503 15.2556 6.65682C14.9283 6.26509 14.9354 5.71337 15.2807 5.34518C15.682 4.91737 16.3778 4.88648 16.7935 5.2755Z',\n 'antenna-transmit': 'M5.53115 17.8387L6.58945 18.8268L8.92522 18.6021L9.83101 20.4262C9.89964 20.5644 9.93535 20.7167 9.93535 20.871C9.93535 21.3838 9.54931 21.8065 9.05197 21.8642L8.93535 21.871H4.20497C3.9626 21.871 3.72849 21.783 3.54616 21.6233C3.16263 21.2874 3.09746 20.7233 3.37588 20.3117L3.45266 20.2122L5.53115 17.8387ZM7.09757 10.0443C7.33377 10.0636 7.55543 10.1662 7.72301 10.3338L10.042 12.6529L12 12L11.347 13.9579L13.2146 15.8254C13.6051 16.2159 13.6051 16.8491 13.2146 17.2396C13.047 17.4072 12.8253 17.5098 12.5891 17.5291L7.30432 17.9622C7.01163 17.9862 6.7232 17.8803 6.51554 17.6726L5.87575 17.0328C5.66809 16.8252 5.56221 16.5368 5.58619 16.2441L6.01924 10.9593C6.06434 10.4088 6.54713 9.99916 7.09757 10.0443ZM12.0401 6.00108L12.153 6.01316C15.1469 6.4985 17.5035 8.86452 17.989 11.8473C18.08 12.454 17.5945 13 16.9776 13C16.5201 13 16.1315 12.6898 16.0108 12.2524L15.9864 12.1406C15.6222 10.0374 13.9635 8.37918 11.8597 8.01518C11.3641 7.93429 11 7.51973 11 7.02428C11 6.4846 11.4182 6.03781 11.9292 6.00228L12.0401 6.00108ZM11.998 2.00009L12.1156 2.0053C17.3416 2.5279 21.4822 6.6685 21.9948 11.8945C22.0551 12.4875 21.5827 13 20.9898 13C20.4772 13 20.0451 12.6181 19.9948 12.1156C19.5828 7.82425 16.1657 4.40725 11.8744 3.9952C11.3719 3.94495 11 3.50275 11 3.00025C11 2.48636 11.3925 2.0706 11.8832 2.00812L11.998 2.00009Z',\n 'antenna-receive': 'M5.53115 17.8387L6.58945 18.8268L8.92522 18.602L9.83101 20.4262C9.89964 20.5644 9.93535 20.7167 9.93535 20.871C9.93535 21.3838 9.54931 21.8065 9.05197 21.8642L8.93535 21.871H4.20497C3.9626 21.871 3.72849 21.7829 3.54616 21.6233C3.16263 21.2874 3.09746 20.7233 3.37588 20.3117L3.45266 20.2122L5.53115 17.8387ZM7.09757 10.0443C7.33377 10.0636 7.55543 10.1662 7.72301 10.3338L10.042 12.653L12 12L11.347 13.958L13.2146 15.8254C13.6051 16.2159 13.6051 16.8491 13.2146 17.2396C13.047 17.4072 12.8253 17.5098 12.5891 17.5291L7.30432 17.9622C7.01163 17.9862 6.7232 17.8803 6.51554 17.6726L5.87575 17.0328C5.66809 16.8252 5.56221 16.5368 5.58619 16.2441L6.01924 10.9593C6.06434 10.4088 6.54713 9.99916 7.09757 10.0443ZM14 9C14.5523 9 15 9.44772 15 10C15 10.5523 14.5523 11 14 11C13.4477 11 13 10.5523 13 10C13 9.44772 13.4477 9 14 9ZM16 7C16.5523 7 17 7.44772 17 8C17 8.55228 16.5523 9 16 9C15.4477 9 15 8.55228 15 8C15 7.44772 15.4477 7 16 7ZM18.5 4C19.3284 4 20 4.67157 20 5.5C20 6.32843 19.3284 7 18.5 7C17.6716 7 17 6.32843 17 5.5C17 4.67157 17.6716 4 18.5 4Z',\n 'antenna-off': 'M5.53115 17.8387L6.58945 18.8268L8.92522 18.602L9.83101 20.4262C9.89964 20.5644 9.93535 20.7167 9.93535 20.871C9.93535 21.3838 9.54931 21.8065 9.05197 21.8642L8.93535 21.871H4.20497C3.9626 21.871 3.72849 21.7829 3.54616 21.6233C3.16263 21.2874 3.09746 20.7232 3.37588 20.3117L3.45266 20.2122L5.53115 17.8387ZM7.09757 10.0443C7.33377 10.0636 7.55543 10.1662 7.72301 10.3338L10.042 12.653L12 12L11.347 13.958L13.2146 15.8254C13.6051 16.2159 13.6051 16.8491 13.2146 17.2396C13.047 17.4072 12.8253 17.5098 12.5891 17.5291L7.30432 17.9622C7.01163 17.9862 6.7232 17.8803 6.51554 17.6726L5.87575 17.0328C5.66809 16.8252 5.56221 16.5367 5.58619 16.2441L6.01924 10.9592C6.06434 10.4088 6.54713 9.99915 7.09757 10.0443Z',\n mission: 'M12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2ZM12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4ZM18 12C18 8.68629 15.3137 6 12 6C8.68629 6 6 8.68629 6 12C6 15.3137 8.68629 18 12 18C15.3137 18 18 15.3137 18 12ZM12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8ZM14 12C14 10.8954 13.1046 10 12 10C10.8954 10 10 10.8954 10 12C10 13.1046 10.8954 14 12 14C13.1046 14 14 13.1046 14 12Z',\n altitude: 'M12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2ZM12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4ZM14 18C14 17.4477 13.5523 17 13 17H11C10.4477 17 10 17.4477 10 18C10 18.5523 10.4477 19 11 19H13C13.5523 19 14 18.5523 14 18ZM14 14C14.5523 14 15 14.4477 15 15C15 15.5523 14.5523 16 14 16H10C9.44772 16 9 15.5523 9 15C9 14.4477 9.44772 14 10 14H14ZM16 12L19 14V10L16 12ZM5 10L8 12L5 14V10ZM14 12C14 11.4477 13.5523 11 13 11H11C10.4477 11 10 11.4477 10 12C10 12.5523 10.4477 13 11 13H13C13.5523 13 14 12.5523 14 12ZM14 8C14.5523 8 15 8.44772 15 9C15 9.55228 14.5523 10 14 10H10C9.44772 10 9 9.55228 9 9C9 8.44772 9.44772 8 10 8H14ZM14 6C14 5.44772 13.5523 5 13 5H11C10.4477 5 10 5.44772 10 6C10 6.55228 10.4477 7 11 7H13C13.5523 7 14 6.55228 14 6Z',\n solar: 'M19.5385 4C20.3456 4 21 4.67008 21 5.49666V17.5033C21 18.3299 20.3456 19 19.5385 19H3.46154C2.65436 19 2 18.3299 2 17.5033V5.49666C2 4.67008 2.65436 4 3.46154 4H19.5385ZM7 6H4V11H7V6ZM11 6H8V11H11V6ZM15 6H12V11H15V6ZM19 6H16V11H19V6ZM7 12H4V17H7V12ZM11 12H8V17H11V12ZM15 12H12V17H15V12ZM19 12H16V17H19V12Z',\n thermal: 'M10.5 2C12.433 2 14 3.567 14 5.5L14.0005 12.2576C15.2217 13.2664 16 14.7923 16 16.5C16 19.5376 13.5376 22 10.5 22C7.46243 22 5 19.5376 5 16.5C5 14.7919 5.77868 13.2656 7.00044 12.2568L7 5.5C7 3.567 8.567 2 10.5 2ZM10.5 4C9.7203 4 9.07955 4.59489 9.00687 5.35543L9 5.49987L9.0005 13.199L8.27384 13.799C7.47135 14.4616 7 15.4402 7 16.5C7 18.433 8.567 20 10.5 20C12.433 20 14 18.433 14 16.5C14 15.5111 13.5896 14.593 12.8828 13.9362L12.7268 13.7995L12.0006 13.1997L12 5.5C12 4.7203 11.4051 4.07955 10.6445 4.00687L10.5 4ZM11 5.5C11 5.22386 10.7761 5 10.5 5C10.2239 5 10 5.22386 10 5.5L10.0006 14.0499C8.85917 14.2813 8 15.2903 8 16.5C8 17.8807 9.11929 19 10.5 19C11.8807 19 13 17.8807 13 16.5C13 15.2907 12.1413 14.2819 11.0004 14.0501L11 5.5ZM20 11C20.5523 11 21 11.4477 21 12C21 12.5523 20.5523 13 20 13H17C16.4477 13 16 12.5523 16 12C16 11.4477 16.4477 11 17 11H20ZM19 9C19 8.44772 18.5523 8 18 8H17C16.4477 8 16 8.44772 16 9C16 9.55228 16.4477 10 17 10H18C18.5523 10 19 9.55228 19 9ZM20 5C20.5523 5 21 5.44772 21 6C21 6.55228 20.5523 7 20 7H17C16.4477 7 16 6.55228 16 6C16 5.44772 16.4477 5 17 5H20ZM19 3C19 2.44772 18.5523 2 18 2H17C16.4477 2 16 2.44772 16 3C16 3.55228 16.4477 4 17 4H18C18.5523 4 19 3.55228 19 3Z',\n propulsion: 'M16 2C17.1046 2 18 2.89543 18 4V20C18 21.1046 17.1046 22 16 22H9C7.89543 22 7 21.1046 7 20V4C7 2.89543 7.89543 2 9 2H16ZM13.8115 5.69961C13.8115 5.00797 12.9835 4.75858 12.631 5.27555L12.5794 5.36359L9.0799 12.364C8.8597 12.8083 9.11904 13.3258 9.55954 13.3928L9.6566 13.4001H11.1901V18.3004C11.1901 18.992 12.0181 19.2414 12.3706 18.7245L12.4222 18.6364L15.9217 11.636C16.1419 11.1917 15.8711 10.6742 15.4398 10.6072L15.345 10.5999H13.8115V5.69961Z',\n payload: 'M12.6802 2.24483L12.8418 2.31637L20.8418 6.31637C21.4305 6.6107 21.819 7.18871 21.8753 7.83667L21.8824 8V16C21.8824 16.6581 21.5391 17.2641 20.9848 17.6043L20.8418 17.6836L12.8418 21.6836C12.3649 21.9221 11.812 21.9459 11.3198 21.7552L11.1582 21.6836L3.15821 17.6836C2.56956 17.3893 2.18104 16.8113 2.12475 16.1633L2.11768 16V8C2.11768 7.34186 2.46091 6.73586 3.0153 6.39574L3.15821 6.31637L3.4276 6.17973C3.50773 6.12386 3.59511 6.0805 3.6866 6.05036L11.1582 2.31637C11.5822 2.1044 12.0662 2.062 12.5141 2.18919L12.6802 2.24483ZM3.99968 8.17865L4.00003 16L10.9997 19.4996V12.5536L3.99968 8.17865ZM12.9997 12.6176L19.9997 9.11765L20 16L12.9997 19.4996V12.6176ZM18.5 15C18.7762 15 19 15.2239 19 15.5C19 15.7761 18.7762 16 18.5 16C18.2239 16 18 15.7761 18 15.5C18 15.2239 18.2239 15 18.5 15ZM6.00003 15.5C6.00003 15.2239 5.77617 15 5.50003 15C5.22389 15 5.00003 15.2239 5.00003 15.5C5.00003 15.7761 5.22389 16 5.50003 16C5.77617 16 6.00003 15.7761 6.00003 15.5ZM16.5 14C16.7762 14 17 14.2239 17 14.5C17 14.7761 16.7762 15 16.5 15C16.2239 15 16 14.7761 16 14.5C16 14.2239 16.2239 14 16.5 14ZM8.00003 14.5C8.00003 14.2239 7.77617 14 7.50003 14C7.22389 14 7.00003 14.2239 7.00003 14.5C7.00003 14.7761 7.22389 15 7.50003 15C7.77617 15 8.00003 14.7761 8.00003 14.5ZM9.50003 13C9.77617 13 10 13.2239 10 13.5C10 13.7761 9.77617 14 9.50003 14C9.22389 14 9.00003 13.7761 9.00003 13.5C9.00003 13.2239 9.22389 13 9.50003 13ZM15 13.5C15 13.2239 14.7762 13 14.5 13C14.2239 13 14 13.2239 14 13.5C14 13.7761 14.2239 14 14.5 14C14.7762 14 15 13.7761 15 13.5ZM12 4L5.93668 7.03065L12.053 10.854L18.8807 7.44065L12 4ZM12.5 9.5C12.5 9.22386 12.2762 9 12 9C11.7239 9 11.5 9.22386 11.5 9.5C11.5 9.77614 11.7239 10 12 10C12.2762 10 12.5 9.77614 12.5 9.5ZM12 7C12.2762 7 12.5 7.22386 12.5 7.5C12.5 7.77614 12.2762 8 12 8C11.7239 8 11.5 7.77614 11.5 7.5C11.5 7.22386 11.7239 7 12 7ZM12.5 5.5C12.5 5.22386 12.2762 5 12 5C11.7239 5 11.5 5.22386 11.5 5.5C11.5 5.77614 11.7239 6 12 6C12.2762 6 12.5 5.77614 12.5 5.5Z',\n processor: 'M9 20V22H7V20H9ZM13 20V22H11V20H13ZM17 20V22H15V20H17ZM17 5C18.1046 5 19 5.89543 19 7V17C19 18.1046 18.1046 19 17 19H7C5.89543 19 5 18.1046 5 17V7C5 5.89543 5.89543 5 7 5H17ZM17 16C16.4477 16 16 16.4477 16 17C16 17.5523 16.4477 18 17 18C17.5523 18 18 17.5523 18 17C18 16.4477 17.5523 16 17 16ZM4 15V17H2V15H4ZM22 15V17H20V15H22ZM4 11V13H2V11H4ZM22 11V13H20V11H22ZM4 7V9H2V7H4ZM22 7V9H20V7H22ZM7 6C6.44772 6 6 6.44772 6 7C6 7.55228 6.44772 8 7 8C7.55228 8 8 7.55228 8 7C8 6.44772 7.55228 6 7 6ZM9 2V4H7V2H9ZM13 2V4H11V2H13ZM17 2V4H15V2H17Z',\n equipment: 'M22 5C22 3.89543 21.1046 3 20 3H4C2.89543 3 2 3.89543 2 5V9C2 10.1046 2.89543 11 4 11H20C21.1046 11 22 10.1046 22 9V5ZM22 15C22 13.8954 21.1046 13 20 13H4C2.89543 13 2 13.8954 2 15V19C2 20.1046 2.89543 21 4 21H20C21.1046 21 22 20.1046 22 19V15ZM4 15H20V19H4V15ZM7 16V18H5V16H7ZM10 18V16H8V18H10ZM13 16V18H11V16H13ZM20 5H4V9H20V5ZM7 8V6H5V8H7ZM10 6V8H8V6H10ZM13 8V6H11V8H13Z',\n netcom: 'M16 2C17.6569 2 19 3.34315 19 5C19 6.65685 17.6569 8 16 8C15.8259 8 15.6553 7.98518 15.4894 7.95672L14.8034 9.14676C15.3137 9.64825 15.6902 10.2856 15.874 11.0002L18.2676 10.9999C18.6134 10.4022 19.2597 10 20 10C21.1046 10 22 10.8954 22 12C22 13.1046 21.1046 14 20 14C19.2602 14 18.6142 13.5983 18.2682 13.0011L15.8738 13.0008C15.6717 13.7853 15.2375 14.4767 14.6488 14.9974L15.2128 16.1044C15.4637 16.0363 15.7276 16 16 16C17.6569 16 19 17.3431 19 19C19 20.6569 17.6569 22 16 22C14.3431 22 13 20.6569 13 19C13 18.3508 13.2062 17.7498 13.5567 17.2589L12.8669 15.9058C12.5878 15.9675 12.2977 16 12 16C11.2582 16 10.5635 15.7981 9.96801 15.4462L7.75736 17.6569L7.59355 17.4912C7.85196 17.9345 8 18.4499 8 19C8 20.6569 6.65685 22 5 22C3.34315 22 2 20.6569 2 19C2 17.3431 3.34315 16 5 16C5.55006 16 6.06555 16.148 6.50879 16.4065L6.34315 16.2426L8.55383 14.032C8.20193 13.4365 8 12.7418 8 12C8 9.79086 9.79086 8 12 8C12.3705 8 12.7293 8.05038 13.0698 8.14467L13.7446 6.97823C13.281 6.45014 13 5.75789 13 5C13 3.34315 14.3431 2 16 2ZM12 10C10.8954 10 10 10.8954 10 12C10 13.1046 10.8954 14 12 14C13.1046 14 14 13.1046 14 12C14 10.8954 13.1046 10 12 10Z',\n hardware: 'M4 17.8247V10.4692H20V17.8247H4ZM2 9.77297C2 9.05293 2.58371 8.46922 3.30375 8.46922H20.6962C21.4163 8.46922 22 9.05293 22 9.77298V18.5209C22 19.241 21.4163 19.8247 20.6962 19.8247H3.30375C2.58371 19.8247 2 19.241 2 18.5209V9.77297ZM8.99573 13.637H4.99573V11.637H8.99573V13.637ZM8.99573 16.642H4.99573V14.642H8.99573V16.642ZM10 13.637H14V11.637H10V13.637ZM14 16.642H10V14.642H14V16.642ZM14.9987 13.637H18.9987V11.637H14.9987V13.637ZM18.9987 16.6424H14.9987V14.6424H18.9987V16.6424Z',\n orbit: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm0-14c-3.31 0-6 2.69-6 6s2.69 6 6 6 6-2.69 6-6-2.69-6-6-6zm0 10c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4z',\n 'ground-station': 'M12 3L2 12h3v8h6v-6h2v6h6v-8h3L12 3zm0 11.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5z',\n battery: 'M15.67 4H14V3C14 2.45 13.55 2 13 2H11C10.45 2 10 2.45 10 3V4H8.33C7.6 4 7 4.6 7 5.33V20.66C7 21.4 7.6 22 8.34 22H15.66C16.4 22 17 21.4 17 20.67V5.33C17 4.6 16.4 4 15.67 4Z',\n location: 'M5 9C5 5.13 8.13 2 12 2C15.87 2 19 5.13 19 9C19 13.17 14.58 18.92 12.77 21.11C12.37 21.59 11.64 21.59 11.24 21.11C9.42 18.92 5 13.17 5 9ZM9.5 9C9.5 10.38 10.62 11.5 12 11.5C13.38 11.5 14.5 10.38 14.5 9C14.5 7.62 13.38 6.5 12 6.5C10.62 6.5 9.5 7.62 9.5 9Z',\n rocket: 'M12 2c0 0-6.5 5-6.5 12 0 2.5.5 4 1 5.5l5.5-3 5.5 3c.5-1.5 1-3 1-5.5C18.5 7 12 2 12 2zm0 13c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zM7 22l1.5-1.5L10 22l2-2 2 2 1.5-1.5L17 22l-2.5-2.5-2.5 2.5-2.5-2.5L7 22z',\n thermometer: 'M10.5 2C12.433 2 14 3.567 14 5.5L14.0005 12.2576C15.2217 13.2664 16 14.7923 16 16.5C16 19.5376 13.5376 22 10.5 22C7.46243 22 5 19.5376 5 16.5C5 14.7919 5.77868 13.2656 7.00044 12.2568L7 5.5C7 3.567 8.567 2 10.5 2ZM10.5 4C9.7203 4 9.07955 4.59489 9.00687 5.35543L9 5.49987L9.0005 13.199L8.27384 13.799C7.47135 14.4616 7 15.4402 7 16.5C7 18.433 8.567 20 10.5 20C12.433 20 14 18.433 14 16.5C14 15.5111 13.5896 14.593 12.8828 13.9362L12.7268 13.7995L12.0006 13.1997L12 5.5C12 4.7203 11.4051 4.07955 10.6445 4.00687L10.5 4ZM11 5.5C11 5.22386 10.7761 5 10.5 5C10.2239 5 10 5.22386 10 5.5L10.0006 14.0499C8.85917 14.2813 8 15.2903 8 16.5C8 17.8807 9.11929 19 10.5 19C11.8807 19 13 17.8807 13 16.5C13 15.2907 12.1413 14.2819 11.0004 14.0501L11 5.5ZM20 11C20.5523 11 21 11.4477 21 12C21 12.5523 20.5523 13 20 13H17C16.4477 13 16 12.5523 16 12C16 11.4477 16.4477 11 17 11H20ZM19 9C19 8.44772 18.5523 8 18 8H17C16.4477 8 16 8.44772 16 9C16 9.55228 16.4477 10 17 10H18C18.5523 10 19 9.55228 19 9ZM20 5C20.5523 5 21 5.44772 21 6C21 6.55228 20.5523 7 20 7H17C16.4477 7 16 6.55228 16 6C16 5.44772 16.4477 5 17 5H20ZM19 3C19 2.44772 18.5523 2 18 2H17C16.4477 2 16 2.44772 16 3C16 3.55228 16.4477 4 17 4H18C18.5523 4 19 3.55228 19 3Z',\n \n // === System Icons ===\n settings: 'M19.5 12C19.5 12.34 19.47 12.66 19.43 12.98L21.54 14.63C21.73 14.78 21.78 15.05 21.66 15.27L19.66 18.73C19.54 18.95 19.28 19.04 19.05 18.95L16.56 17.95C16.04 18.34 15.48 18.68 14.87 18.93L14.49 21.58C14.46 21.82 14.25 22 14 22H10C9.75002 22 9.54002 21.82 9.51002 21.58L9.13002 18.93C8.52002 18.68 7.96002 18.35 7.44002 17.95L4.95002 18.95C4.73002 19.03 4.46002 18.95 4.34002 18.73L2.34002 15.27C2.22002 15.05 2.27002 14.78 2.46002 14.63L4.57002 12.98C4.53002 12.66 4.50002 12.33 4.50002 12C4.50002 11.67 4.53002 11.34 4.57002 11.02L2.46002 9.37C2.27002 9.22 2.21002 8.95 2.34002 8.73L4.34002 5.27C4.46002 5.05 4.72002 4.96 4.95002 5.05L7.44002 6.05C7.96002 5.66 8.52002 5.32 9.13002 5.07L9.51002 2.42C9.54002 2.18 9.75002 2 10 2H14C14.25 2 14.46 2.18 14.49 2.42L14.87 5.07C15.48 5.32 16.04 5.65 16.56 6.05L19.05 5.05C19.27 4.97 19.54 5.05 19.66 5.27L21.66 8.73C21.78 8.95 21.73 9.22 21.54 9.37L19.43 11.02C19.47 11.34 19.5 11.66 19.5 12ZM8.50002 12C8.50002 13.93 10.07 15.5 12 15.5C13.93 15.5 15.5 13.93 15.5 12C15.5 10.07 13.93 8.5 12 8.5C10.07 8.5 8.50002 10.07 8.50002 12Z',\n notifications: 'M18 11V16L19.29 17.29C19.92 17.92 19.47 19 18.58 19H5.40999C4.51999 19 4.07999 17.92 4.70999 17.29L5.99999 16V11C5.99999 7.92 7.62999 5.36 10.5 4.68V4C10.5 3.17 11.17 2.5 12 2.5C12.83 2.5 13.5 3.17 13.5 4V4.68C16.36 5.36 18 7.93 18 11ZM14 20C14 21.1 13.1 22 12 22C10.89 22 9.99999 21.1 9.99999 20H14Z',\n 'notifications-off': 'M20 18.69L7.84 6.14 5.27 3.49 4 4.76l2.8 2.8v.01c-.52.99-.8 2.16-.8 3.42v5l-2 2v1h13.73l2 2L21 19.72l-1-1.03zM12 22c1.11 0 2-.89 2-2h-4c0 1.11.89 2 2 2zm6-7.32V11c0-3.08-1.64-5.64-4.5-6.32V4c0-.83-.67-1.5-1.5-1.5s-1.5.67-1.5 1.5v.68c-.15.03-.29.08-.42.12-.1.03-.2.07-.3.11h-.01c-.01 0-.01 0-.02.01-.23.09-.46.2-.68.31 0 0-.01 0-.01.01L18 14.68z',\n warning: 'M19.53 21.0001C21.07 21.0001 22.03 19.3301 21.26 18.0001L13.73 4.99005C12.96 3.66005 11.04 3.66005 10.27 4.99005L2.74 18.0001C1.97 19.3301 2.93 21.0001 4.47 21.0001H19.53ZM12 14.0001C11.45 14.0001 11 13.5501 11 13.0001V11.0001C11 10.4501 11.45 10.0001 12 10.0001C12.55 10.0001 13 10.4501 13 11.0001V13.0001C13 13.5501 12.55 14.0001 12 14.0001ZM11 16.0001V18.0001H13V16.0001H11Z',\n error: 'M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM12 13C11.45 13 11 12.55 11 12V8C11 7.45 11.45 7 12 7C12.55 7 13 7.45 13 8V12C13 12.55 12.55 13 12 13ZM11 15V17H13V15H11Z',\n info: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z',\n check: 'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z',\n close: 'M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z',\n add: 'M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z',\n remove: 'M19 13H5v-2h14v2z',\n edit: 'M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z',\n delete: 'M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z',\n search: 'M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z',\n filter: 'M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z',\n refresh: 'M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z',\n sync: 'M12 4V1L8 5l4 4V6c3.31 0 6 2.69 6 6 0 1.01-.25 1.97-.7 2.8l1.46 1.46C19.54 15.03 20 13.57 20 12c0-4.42-3.58-8-8-8zm0 14c-3.31 0-6-2.69-6-6 0-1.01.25-1.97.7-2.8L5.24 7.74C4.46 8.97 4 10.43 4 12c0 4.42 3.58 8 8 8v3l4-4-4-4v3z',\n download: 'M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z',\n upload: 'M9 16h6v-6h4l-7-7-7 7h4v6zm-4 2h14v2H5v-2z',\n expand: 'M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z',\n collapse: 'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z',\n fullscreen: 'M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z',\n 'fullscreen-exit': 'M5 16h3v3h2v-5H5v2zm3-8H5v2h5V5H8v3zm6 11h2v-3h3v-2h-5v5zm2-11V5h-2v5h5V8h-3z',\n visibility: 'M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z',\n 'visibility-off': 'M12 7c2.76 0 5 2.24 5 5 0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7zM2 4.27l2.28 2.28.46.46C3.08 8.3 1.78 10.02 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22 21 20.73 3.27 3 2 4.27zM7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65 0 1.66 1.34 3 3 3 .22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53-2.76 0-5-2.24-5-5 0-.79.2-1.53.53-2.2zm4.31-.78l3.15 3.15.02-.16c0-1.66-1.34-3-3-3l-.17.01z',\n lock: 'M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm-6 9c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2z',\n unlock: 'M12 17c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm6-9h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6h1.9c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm0 12H6V10h12v10z',\n \n // === Navigation Icons ===\n 'arrow-up': 'M4 12l1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8-8 8z',\n 'arrow-down': 'M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z',\n 'arrow-left': 'M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z',\n 'arrow-right': 'M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8-8-8z',\n 'chevron-up': 'M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z',\n 'chevron-down': 'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z',\n 'chevron-left': 'M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z',\n 'chevron-right': 'M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z',\n menu: 'M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z',\n 'more-vert': 'M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z',\n 'more-horiz': 'M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z',\n \n // === Data Icons ===\n chart: 'M3.5 18.49l6-6.01 4 4L22 6.92l-1.41-1.41-7.09 7.97-4-4L2 16.99z',\n list: 'M3 13h2v-2H3v2zm0 4h2v-2H3v2zm0-8h2V7H3v2zm4 4h14v-2H7v2zm0 4h14v-2H7v2zM7 7v2h14V7H7z',\n grid: 'M3 3h8v8H3V3zm0 10h8v8H3v-8zm10-10h8v8h-8V3zm0 10h8v8h-8v-8z',\n timeline: 'M23 8c0 1.1-.9 2-2 2-.18 0-.35-.02-.51-.07l-3.56 3.55c.05.16.07.34.07.52 0 1.1-.9 2-2 2s-2-.9-2-2c0-.18.02-.36.07-.52l-2.55-2.55c-.16.05-.34.07-.52.07s-.36-.02-.52-.07l-4.55 4.56c.05.16.07.33.07.51 0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2c.18 0 .35.02.51.07l4.56-4.55C8.02 9.36 8 9.18 8 9c0-1.1.9-2 2-2s2 .9 2 2c0 .18-.02.36-.07.52l2.55 2.55c.16-.05.34-.07.52-.07s.36.02.52.07l3.55-3.56C19.02 8.35 19 8.18 19 8c0-1.1.9-2 2-2s2 .9 2 2z',\n calendar: 'M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM9 10H7v2h2v-2zm4 0h-2v2h2v-2zm4 0h-2v2h2v-2z',\n clock: 'M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67z',\n play: 'M8 5v14l11-7z',\n pause: 'M6 19h4V5H6v14zm8-14v14h4V5h-4z',\n stop: 'M6 6h12v12H6z',\n record: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 14c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4z',\n \n // === Communication Icons ===\n link: 'M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z',\n 'link-off': 'M17 7h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1 0 1.43-.98 2.63-2.31 2.98l1.46 1.46C20.88 15.61 22 13.95 22 12c0-2.76-2.24-5-5-5zm-1 4h-2.19l2 2H16v-2zM2 4.27l3.11 3.11C3.29 8.12 2 9.91 2 12c0 2.76 2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1 0-1.59 1.21-2.9 2.76-3.07L8.73 11H8v2h2.73L13 15.27V17h1.73l4.01 4L20 19.74 3.27 3 2 4.27z',\n send: 'M2.01 21L23 12 2.01 3 2 10l15 2-15 2z',\n message: 'M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z',\n mail: 'M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z',\n 'photo-camera': 'M12 12m-3.2 0a3.2 3.2 0 1 0 6.4 0 3.2 3.2 0 1 0-6.4 0M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z',\n images: 'M22 16V4c0-1.1-.9-2-2-2H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2zm-11-4l2.03 2.71L16 11l4 5H8l3-4zM2 6v14c0 1.1.9 2 2 2h14v-2H4V6H2z',\n 'error-outline': 'M11 15h2v2h-2v-2zm0-8h2v6h-2V7zm.99-5C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z',\n};\n\nexport const Icon = memo(function Icon({\n name,\n size = 24,\n status,\n color,\n className = '',\n 'aria-label': ariaLabel,\n onClick,\n style,\n}: IconProps): React.ReactElement {\n const { tokens } = useTheme();\n \n // Determine color: custom > status > default\n const iconColor = color \n ?? (status ? tokens.colors.status[status] : tokens.colors.text.primary);\n \n const pathData = ICON_PATHS[name];\n const isInteractive = !!onClick;\n \n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width={size}\n height={size}\n viewBox=\"0 0 24 24\"\n fill={iconColor}\n className={className}\n role={ariaLabel ? 'img' : 'presentation'}\n aria-label={ariaLabel ?? name}\n aria-hidden={!ariaLabel}\n onClick={onClick}\n onKeyDown={onClick ? (e: React.KeyboardEvent) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); onClick(); } } : undefined}\n tabIndex={isInteractive ? 0 : undefined}\n style={{\n cursor: isInteractive ? 'pointer' : 'default',\n flexShrink: 0,\n transition: `fill ${tokens.animation.fast}`,\n ...style,\n }}\n >\n {Array.isArray(pathData) ? (\n pathData.map((d, i) => <path key={i} d={d} fillRule=\"evenodd\" clipRule=\"evenodd\" />)\n ) : (\n <path d={pathData} fillRule=\"evenodd\" clipRule=\"evenodd\" />\n )}\n </svg>\n );\n});\n\n/**\n * Get all available icon names\n */\nexport function getIconNames(): IconName[] {\n return Object.keys(ICON_PATHS) as IconName[];\n}\n\n/**\n * Check if an icon name exists\n */\nexport function isValidIconName(name: string): name is IconName {\n return name in ICON_PATHS;\n}\n\nexport default Icon;\n"],"names":["Icon"],"mappings":"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"}
1
+ {"version":3,"file":"Icon.js","sources":["../../../src/react/core/Icon.tsx"],"sourcesContent":["/**\n * @zendir/ui - Icon Component\n * \n * Complete icon library following Astro UX Design System.\n * \n * Astro UX Compliance (https://www.astrouxds.com/components/icons-and-symbols/):\n * - Consistent icon sizing\n * - Accessibility via aria-label\n * - Use with MonitoringIcon for status indication\n * \n * IMPORTANT per Astro UX Guidelines:\n * - Icons themselves should NOT change color based on status\n * - Status is communicated via a separate StatusIndicator/StatusSymbol\n * - Use MonitoringIcon component to combine icon + status + label\n * - The `status` prop is provided for convenience but should be used sparingly\n * \n * @example\n * ```tsx\n * // Standard usage - neutral color\n * <Icon name=\"satellite\" />\n * <Icon name=\"antenna\" size={32} />\n * \n * // Custom color (use sparingly)\n * <Icon name=\"thermal\" color=\"#4dacff\" />\n * \n * // For status indication, use MonitoringIcon instead:\n * <MonitoringIcon icon=\"antenna\" status=\"normal\" label=\"Antenna-1\" />\n * ```\n */\n\nimport React, { memo } from 'react';\nimport { useTheme } from '../theme';\nimport type { StatusLevel } from '../utils';\n\nexport type IconName =\n // Astro Space/Mission Icons\n | 'satellite'\n | 'satellite-transmit'\n | 'satellite-receive'\n | 'satellite-off'\n | 'antenna'\n | 'antenna-transmit'\n | 'antenna-receive'\n | 'antenna-off'\n | 'mission'\n | 'altitude'\n | 'solar'\n | 'thermal'\n | 'propulsion'\n | 'payload'\n | 'processor'\n | 'equipment'\n | 'netcom'\n | 'hardware'\n | 'orbit'\n | 'ground-station'\n | 'battery'\n | 'location'\n | 'rocket'\n | 'thermometer'\n // System Icons\n | 'settings'\n | 'notifications'\n | 'notifications-off'\n | 'warning'\n | 'error'\n | 'info'\n | 'check'\n | 'close'\n | 'add'\n | 'remove'\n | 'edit'\n | 'delete'\n | 'search'\n | 'filter'\n | 'refresh'\n | 'sync'\n | 'download'\n | 'upload'\n | 'expand'\n | 'collapse'\n | 'fullscreen'\n | 'fullscreen-exit'\n | 'visibility'\n | 'visibility-off'\n | 'lock'\n | 'unlock'\n // Navigation Icons\n | 'arrow-up'\n | 'arrow-down'\n | 'arrow-left'\n | 'arrow-right'\n | 'chevron-up'\n | 'chevron-down'\n | 'chevron-left'\n | 'chevron-right'\n | 'menu'\n | 'more-vert'\n | 'more-horiz'\n // Data Icons\n | 'chart'\n | 'list'\n | 'grid'\n | 'timeline'\n | 'calendar'\n | 'clock'\n | 'play'\n | 'play-arrow'\n | 'pause'\n | 'stop'\n | 'skip-next'\n | 'skip-previous'\n | 'fast-forward'\n | 'fast-rewind'\n | 'record'\n // Communication Icons\n | 'link'\n | 'link-off'\n | 'send'\n | 'message'\n | 'mail'\n | 'photo-camera'\n | 'images'\n | 'error-outline';\n\nexport interface IconProps {\n /** Icon name from the library */\n name: IconName;\n /** Icon size in pixels (default: 24) */\n size?: number;\n /** Status-based coloring (uses Astro status colors) */\n status?: StatusLevel;\n /** Custom color (overrides status) */\n color?: string;\n /** Custom className */\n className?: string;\n /** Accessibility label */\n 'aria-label'?: string;\n /** Click handler */\n onClick?: () => void;\n /** Custom style */\n style?: React.CSSProperties;\n}\n\n/**\n * Complete Astro UX Icon Library\n * SVG paths for 24x24 viewBox\n */\nconst ICON_PATHS: Record<IconName, string | string[]> = {\n // === Astro Space/Mission Icons ===\n satellite: 'M8.87867 11.7071C8.09762 10.9261 8.09762 9.65973 8.87867 8.87868C9.65972 8.09763 10.926 8.09763 11.7071 8.87868L13.1213 10.2929C13.9024 11.0739 13.9024 12.3403 13.1213 13.1213C12.3403 13.9024 11.0739 13.9024 10.2929 13.1213L8.87867 11.7071ZM4.05653 16.7845C3.61958 16.3475 3.67956 15.6228 4.1824 15.2636L8.17156 12.4142L9.58578 13.8284L6.73637 17.8176C6.3772 18.3204 5.65248 18.3804 5.21553 17.9435L4.05653 16.7845ZM15.2636 4.1824C15.6228 3.67956 16.3475 3.61958 16.7844 4.05653L17.9435 5.21554C18.3804 5.65249 18.3204 6.37721 17.8176 6.73638L13.8284 9.58578L12.4142 8.17157L15.2636 4.1824Z',\n 'satellite-transmit': 'M8.87871 8.87868C9.65976 8.09763 10.9261 8.09763 11.7071 8.87868L13.1213 10.2929C13.9024 11.0739 13.9024 12.3403 13.1213 13.1213C12.3403 13.9024 11.074 13.9024 10.2929 13.1213L8.87871 11.7071C8.09766 10.9261 8.09766 9.65973 8.87871 8.87868ZM4.05657 15.3702C4.09551 15.3313 4.13761 15.2956 4.18243 15.2636L8.1716 12.4142L9.58581 13.8284L6.73641 17.8176C6.4154 18.267 5.79085 18.3711 5.34144 18.0501C5.29662 18.0181 5.25452 17.9824 5.21557 17.9435L4.05657 16.7845C3.66604 16.3939 3.66604 15.7608 4.05657 15.3702ZM20.9898 11C21.5828 11 22.0551 11.5125 21.9948 12.1055C21.4823 17.3315 17.3416 21.4721 12.1156 21.9947C11.5226 22.055 11 21.5927 11 20.9998C11 20.4973 11.3719 20.0551 11.8744 20.0048C16.1658 19.5928 19.5828 16.1757 19.9949 11.8844C20.0451 11.3819 20.4773 11 20.9898 11ZM16.9776 11C17.5946 11 18.08 11.546 17.989 12.1527C17.5035 15.1355 15.1469 17.5015 12.1531 17.9868C11.5462 18.088 11 17.5925 11 16.9757C11 16.4803 11.3641 16.0657 11.8597 15.9848C13.8884 15.6338 15.5032 14.0794 15.9425 12.083L15.9864 11.8595C16.0673 11.364 16.482 11 16.9776 11ZM16.6903 3.97335L16.7845 4.05653L17.9435 5.21554C17.9824 5.25449 18.0181 5.29659 18.0501 5.34141C18.3464 5.75625 18.2805 6.32032 17.9152 6.65713L17.8176 6.73638L13.8285 9.58578L12.4142 8.17157L15.2636 4.1824C15.2957 4.13758 15.3313 4.09548 15.3703 4.05653C15.7308 3.69605 16.298 3.66832 16.6903 3.97335Z',\n 'satellite-receive': 'M19.5 18C20.3285 18 21 18.6716 21 19.5C21 20.3284 20.3285 21 19.5 21C18.6716 21 18 20.3284 18 19.5C18 18.6716 18.6716 18 19.5 18ZM8.1716 12.4142L9.58581 13.8284L6.73641 17.8176C6.4154 18.267 5.79085 18.3711 5.34144 18.0501C5.29662 18.0181 5.25452 17.9824 5.21557 17.9435L4.05657 16.7845C3.66604 16.3939 3.66604 15.7608 4.05657 15.3702C4.09551 15.3313 4.13761 15.2956 4.18243 15.2636L8.1716 12.4142ZM17 16C17.5523 16 18 16.4477 18 17C18 17.5523 17.5523 18 17 18C16.4477 18 16 17.5523 16 17C16 16.4477 16.4477 16 17 16ZM15 14C15.5523 14 16 14.4477 16 15C16 15.5523 15.5523 16 15 16C14.4477 16 14 15.5523 14 15C14 14.4477 14.4477 14 15 14ZM11.7071 8.87868L13.1213 10.2929C13.9024 11.0739 13.9024 12.3403 13.1213 13.1213C12.3403 13.9024 11.074 13.9024 10.2929 13.1213L8.87871 11.7071C8.09766 10.9261 8.09766 9.65973 8.87871 8.87868C9.65976 8.09763 10.9261 8.09763 11.7071 8.87868ZM16.6903 3.97335L16.7845 4.05653L17.9435 5.21554C17.9824 5.25449 18.0181 5.29659 18.0501 5.34141C18.3464 5.75625 18.2805 6.32032 17.9152 6.65713L17.8176 6.73638L13.8285 9.58578L12.4142 8.17157L15.2636 4.1824C15.2957 4.13758 15.3313 4.09548 15.3703 4.05653C15.7007 3.72609 16.2049 3.67525 16.5888 3.90402L16.6903 3.97335Z',\n 'satellite-off': 'M8.87867 11.7071C8.09762 10.9261 8.09762 9.65973 8.87867 8.87868C9.65972 8.09763 10.926 8.09763 11.7071 8.87868L13.1213 10.2929C13.9024 11.0739 13.9024 12.3403 13.1213 13.1213C12.3403 13.9024 11.0739 13.9024 10.2929 13.1213L8.87867 11.7071ZM4.05653 16.7845C3.61958 16.3475 3.67956 15.6228 4.1824 15.2636L8.17156 12.4142L9.58578 13.8284L6.73637 17.8176C6.3772 18.3204 5.65248 18.3804 5.21553 17.9435L4.05653 16.7845ZM15.2636 4.1824C15.6228 3.67956 16.3475 3.61958 16.7844 4.05653L17.9435 5.21554C18.3804 5.65249 18.3204 6.37721 17.8176 6.73638L13.8284 9.58578L12.4142 8.17157L15.2636 4.1824Z',\n antenna: 'M12.5 8C13.6506 8 14.5833 8.89543 14.5833 10C14.5833 10.7398 14.1649 11.3858 13.5428 11.7318L13.5416 22H11.4583L11.4582 11.7324C10.8356 11.3866 10.4166 10.7403 10.4166 10C10.4166 8.89543 11.3494 8 12.5 8ZM6.63099 2.32732C6.98124 2.70075 7.0016 3.27819 6.64763 3.65177C3.61283 6.82949 3.34936 11.6553 6.02151 15.1201C6.33286 15.5271 6.26451 16.1001 5.86774 16.4431C5.40872 16.8398 4.68582 16.775 4.3192 16.294C1.13831 12.1519 1.38131 6.45292 4.85709 2.56983L5.07393 2.33438L5.1678 2.24643C5.59314 1.89421 6.24722 1.91815 6.63099 2.32732ZM19.9142 2.24643L20.0081 2.33438C23.6894 6.21966 24.0087 12.0674 20.7628 16.294C20.3962 16.775 19.6733 16.8398 19.2143 16.4431C18.8175 16.1001 18.7492 15.5271 19.0605 15.1201C21.7327 11.6553 21.4692 6.82949 18.4344 3.65177C18.0804 3.27819 18.1008 2.70075 18.4511 2.32732C18.8348 1.91815 19.4889 1.89421 19.9142 2.24643ZM9.8013 5.34518C10.1466 5.71337 10.1537 6.26509 9.82646 6.65682C8.45162 8.33503 8.32337 10.6773 9.50741 12.4838C9.79011 12.9062 9.72281 13.4541 9.33916 13.7858C8.86156 14.1986 8.10517 14.1177 7.75278 13.6059C6.10277 11.1439 6.21558 7.93692 8.0237 5.58971L8.20397 5.3653L8.28854 5.2755C8.70418 4.88648 9.40006 4.91737 9.8013 5.34518ZM16.7935 5.2755L16.8781 5.3653C18.8573 7.72924 19.0325 11.0644 17.3292 13.6059C16.9769 14.1177 16.2205 14.1986 15.7429 13.7858C15.3592 13.4541 15.2919 12.9062 15.5746 12.4838C16.7586 10.6773 16.6304 8.33503 15.2556 6.65682C14.9283 6.26509 14.9354 5.71337 15.2807 5.34518C15.682 4.91737 16.3778 4.88648 16.7935 5.2755Z',\n 'antenna-transmit': 'M5.53115 17.8387L6.58945 18.8268L8.92522 18.6021L9.83101 20.4262C9.89964 20.5644 9.93535 20.7167 9.93535 20.871C9.93535 21.3838 9.54931 21.8065 9.05197 21.8642L8.93535 21.871H4.20497C3.9626 21.871 3.72849 21.783 3.54616 21.6233C3.16263 21.2874 3.09746 20.7233 3.37588 20.3117L3.45266 20.2122L5.53115 17.8387ZM7.09757 10.0443C7.33377 10.0636 7.55543 10.1662 7.72301 10.3338L10.042 12.6529L12 12L11.347 13.9579L13.2146 15.8254C13.6051 16.2159 13.6051 16.8491 13.2146 17.2396C13.047 17.4072 12.8253 17.5098 12.5891 17.5291L7.30432 17.9622C7.01163 17.9862 6.7232 17.8803 6.51554 17.6726L5.87575 17.0328C5.66809 16.8252 5.56221 16.5368 5.58619 16.2441L6.01924 10.9593C6.06434 10.4088 6.54713 9.99916 7.09757 10.0443ZM12.0401 6.00108L12.153 6.01316C15.1469 6.4985 17.5035 8.86452 17.989 11.8473C18.08 12.454 17.5945 13 16.9776 13C16.5201 13 16.1315 12.6898 16.0108 12.2524L15.9864 12.1406C15.6222 10.0374 13.9635 8.37918 11.8597 8.01518C11.3641 7.93429 11 7.51973 11 7.02428C11 6.4846 11.4182 6.03781 11.9292 6.00228L12.0401 6.00108ZM11.998 2.00009L12.1156 2.0053C17.3416 2.5279 21.4822 6.6685 21.9948 11.8945C22.0551 12.4875 21.5827 13 20.9898 13C20.4772 13 20.0451 12.6181 19.9948 12.1156C19.5828 7.82425 16.1657 4.40725 11.8744 3.9952C11.3719 3.94495 11 3.50275 11 3.00025C11 2.48636 11.3925 2.0706 11.8832 2.00812L11.998 2.00009Z',\n 'antenna-receive': 'M5.53115 17.8387L6.58945 18.8268L8.92522 18.602L9.83101 20.4262C9.89964 20.5644 9.93535 20.7167 9.93535 20.871C9.93535 21.3838 9.54931 21.8065 9.05197 21.8642L8.93535 21.871H4.20497C3.9626 21.871 3.72849 21.7829 3.54616 21.6233C3.16263 21.2874 3.09746 20.7233 3.37588 20.3117L3.45266 20.2122L5.53115 17.8387ZM7.09757 10.0443C7.33377 10.0636 7.55543 10.1662 7.72301 10.3338L10.042 12.653L12 12L11.347 13.958L13.2146 15.8254C13.6051 16.2159 13.6051 16.8491 13.2146 17.2396C13.047 17.4072 12.8253 17.5098 12.5891 17.5291L7.30432 17.9622C7.01163 17.9862 6.7232 17.8803 6.51554 17.6726L5.87575 17.0328C5.66809 16.8252 5.56221 16.5368 5.58619 16.2441L6.01924 10.9593C6.06434 10.4088 6.54713 9.99916 7.09757 10.0443ZM14 9C14.5523 9 15 9.44772 15 10C15 10.5523 14.5523 11 14 11C13.4477 11 13 10.5523 13 10C13 9.44772 13.4477 9 14 9ZM16 7C16.5523 7 17 7.44772 17 8C17 8.55228 16.5523 9 16 9C15.4477 9 15 8.55228 15 8C15 7.44772 15.4477 7 16 7ZM18.5 4C19.3284 4 20 4.67157 20 5.5C20 6.32843 19.3284 7 18.5 7C17.6716 7 17 6.32843 17 5.5C17 4.67157 17.6716 4 18.5 4Z',\n 'antenna-off': 'M5.53115 17.8387L6.58945 18.8268L8.92522 18.602L9.83101 20.4262C9.89964 20.5644 9.93535 20.7167 9.93535 20.871C9.93535 21.3838 9.54931 21.8065 9.05197 21.8642L8.93535 21.871H4.20497C3.9626 21.871 3.72849 21.7829 3.54616 21.6233C3.16263 21.2874 3.09746 20.7232 3.37588 20.3117L3.45266 20.2122L5.53115 17.8387ZM7.09757 10.0443C7.33377 10.0636 7.55543 10.1662 7.72301 10.3338L10.042 12.653L12 12L11.347 13.958L13.2146 15.8254C13.6051 16.2159 13.6051 16.8491 13.2146 17.2396C13.047 17.4072 12.8253 17.5098 12.5891 17.5291L7.30432 17.9622C7.01163 17.9862 6.7232 17.8803 6.51554 17.6726L5.87575 17.0328C5.66809 16.8252 5.56221 16.5367 5.58619 16.2441L6.01924 10.9592C6.06434 10.4088 6.54713 9.99915 7.09757 10.0443Z',\n mission: 'M12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2ZM12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4ZM18 12C18 8.68629 15.3137 6 12 6C8.68629 6 6 8.68629 6 12C6 15.3137 8.68629 18 12 18C15.3137 18 18 15.3137 18 12ZM12 8C9.79086 8 8 9.79086 8 12C8 14.2091 9.79086 16 12 16C14.2091 16 16 14.2091 16 12C16 9.79086 14.2091 8 12 8ZM14 12C14 10.8954 13.1046 10 12 10C10.8954 10 10 10.8954 10 12C10 13.1046 10.8954 14 12 14C13.1046 14 14 13.1046 14 12Z',\n altitude: 'M12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2ZM12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4ZM14 18C14 17.4477 13.5523 17 13 17H11C10.4477 17 10 17.4477 10 18C10 18.5523 10.4477 19 11 19H13C13.5523 19 14 18.5523 14 18ZM14 14C14.5523 14 15 14.4477 15 15C15 15.5523 14.5523 16 14 16H10C9.44772 16 9 15.5523 9 15C9 14.4477 9.44772 14 10 14H14ZM16 12L19 14V10L16 12ZM5 10L8 12L5 14V10ZM14 12C14 11.4477 13.5523 11 13 11H11C10.4477 11 10 11.4477 10 12C10 12.5523 10.4477 13 11 13H13C13.5523 13 14 12.5523 14 12ZM14 8C14.5523 8 15 8.44772 15 9C15 9.55228 14.5523 10 14 10H10C9.44772 10 9 9.55228 9 9C9 8.44772 9.44772 8 10 8H14ZM14 6C14 5.44772 13.5523 5 13 5H11C10.4477 5 10 5.44772 10 6C10 6.55228 10.4477 7 11 7H13C13.5523 7 14 6.55228 14 6Z',\n solar: 'M19.5385 4C20.3456 4 21 4.67008 21 5.49666V17.5033C21 18.3299 20.3456 19 19.5385 19H3.46154C2.65436 19 2 18.3299 2 17.5033V5.49666C2 4.67008 2.65436 4 3.46154 4H19.5385ZM7 6H4V11H7V6ZM11 6H8V11H11V6ZM15 6H12V11H15V6ZM19 6H16V11H19V6ZM7 12H4V17H7V12ZM11 12H8V17H11V12ZM15 12H12V17H15V12ZM19 12H16V17H19V12Z',\n thermal: 'M10.5 2C12.433 2 14 3.567 14 5.5L14.0005 12.2576C15.2217 13.2664 16 14.7923 16 16.5C16 19.5376 13.5376 22 10.5 22C7.46243 22 5 19.5376 5 16.5C5 14.7919 5.77868 13.2656 7.00044 12.2568L7 5.5C7 3.567 8.567 2 10.5 2ZM10.5 4C9.7203 4 9.07955 4.59489 9.00687 5.35543L9 5.49987L9.0005 13.199L8.27384 13.799C7.47135 14.4616 7 15.4402 7 16.5C7 18.433 8.567 20 10.5 20C12.433 20 14 18.433 14 16.5C14 15.5111 13.5896 14.593 12.8828 13.9362L12.7268 13.7995L12.0006 13.1997L12 5.5C12 4.7203 11.4051 4.07955 10.6445 4.00687L10.5 4ZM11 5.5C11 5.22386 10.7761 5 10.5 5C10.2239 5 10 5.22386 10 5.5L10.0006 14.0499C8.85917 14.2813 8 15.2903 8 16.5C8 17.8807 9.11929 19 10.5 19C11.8807 19 13 17.8807 13 16.5C13 15.2907 12.1413 14.2819 11.0004 14.0501L11 5.5ZM20 11C20.5523 11 21 11.4477 21 12C21 12.5523 20.5523 13 20 13H17C16.4477 13 16 12.5523 16 12C16 11.4477 16.4477 11 17 11H20ZM19 9C19 8.44772 18.5523 8 18 8H17C16.4477 8 16 8.44772 16 9C16 9.55228 16.4477 10 17 10H18C18.5523 10 19 9.55228 19 9ZM20 5C20.5523 5 21 5.44772 21 6C21 6.55228 20.5523 7 20 7H17C16.4477 7 16 6.55228 16 6C16 5.44772 16.4477 5 17 5H20ZM19 3C19 2.44772 18.5523 2 18 2H17C16.4477 2 16 2.44772 16 3C16 3.55228 16.4477 4 17 4H18C18.5523 4 19 3.55228 19 3Z',\n propulsion: 'M16 2C17.1046 2 18 2.89543 18 4V20C18 21.1046 17.1046 22 16 22H9C7.89543 22 7 21.1046 7 20V4C7 2.89543 7.89543 2 9 2H16ZM13.8115 5.69961C13.8115 5.00797 12.9835 4.75858 12.631 5.27555L12.5794 5.36359L9.0799 12.364C8.8597 12.8083 9.11904 13.3258 9.55954 13.3928L9.6566 13.4001H11.1901V18.3004C11.1901 18.992 12.0181 19.2414 12.3706 18.7245L12.4222 18.6364L15.9217 11.636C16.1419 11.1917 15.8711 10.6742 15.4398 10.6072L15.345 10.5999H13.8115V5.69961Z',\n payload: 'M12.6802 2.24483L12.8418 2.31637L20.8418 6.31637C21.4305 6.6107 21.819 7.18871 21.8753 7.83667L21.8824 8V16C21.8824 16.6581 21.5391 17.2641 20.9848 17.6043L20.8418 17.6836L12.8418 21.6836C12.3649 21.9221 11.812 21.9459 11.3198 21.7552L11.1582 21.6836L3.15821 17.6836C2.56956 17.3893 2.18104 16.8113 2.12475 16.1633L2.11768 16V8C2.11768 7.34186 2.46091 6.73586 3.0153 6.39574L3.15821 6.31637L3.4276 6.17973C3.50773 6.12386 3.59511 6.0805 3.6866 6.05036L11.1582 2.31637C11.5822 2.1044 12.0662 2.062 12.5141 2.18919L12.6802 2.24483ZM3.99968 8.17865L4.00003 16L10.9997 19.4996V12.5536L3.99968 8.17865ZM12.9997 12.6176L19.9997 9.11765L20 16L12.9997 19.4996V12.6176ZM18.5 15C18.7762 15 19 15.2239 19 15.5C19 15.7761 18.7762 16 18.5 16C18.2239 16 18 15.7761 18 15.5C18 15.2239 18.2239 15 18.5 15ZM6.00003 15.5C6.00003 15.2239 5.77617 15 5.50003 15C5.22389 15 5.00003 15.2239 5.00003 15.5C5.00003 15.7761 5.22389 16 5.50003 16C5.77617 16 6.00003 15.7761 6.00003 15.5ZM16.5 14C16.7762 14 17 14.2239 17 14.5C17 14.7761 16.7762 15 16.5 15C16.2239 15 16 14.7761 16 14.5C16 14.2239 16.2239 14 16.5 14ZM8.00003 14.5C8.00003 14.2239 7.77617 14 7.50003 14C7.22389 14 7.00003 14.2239 7.00003 14.5C7.00003 14.7761 7.22389 15 7.50003 15C7.77617 15 8.00003 14.7761 8.00003 14.5ZM9.50003 13C9.77617 13 10 13.2239 10 13.5C10 13.7761 9.77617 14 9.50003 14C9.22389 14 9.00003 13.7761 9.00003 13.5C9.00003 13.2239 9.22389 13 9.50003 13ZM15 13.5C15 13.2239 14.7762 13 14.5 13C14.2239 13 14 13.2239 14 13.5C14 13.7761 14.2239 14 14.5 14C14.7762 14 15 13.7761 15 13.5ZM12 4L5.93668 7.03065L12.053 10.854L18.8807 7.44065L12 4ZM12.5 9.5C12.5 9.22386 12.2762 9 12 9C11.7239 9 11.5 9.22386 11.5 9.5C11.5 9.77614 11.7239 10 12 10C12.2762 10 12.5 9.77614 12.5 9.5ZM12 7C12.2762 7 12.5 7.22386 12.5 7.5C12.5 7.77614 12.2762 8 12 8C11.7239 8 11.5 7.77614 11.5 7.5C11.5 7.22386 11.7239 7 12 7ZM12.5 5.5C12.5 5.22386 12.2762 5 12 5C11.7239 5 11.5 5.22386 11.5 5.5C11.5 5.77614 11.7239 6 12 6C12.2762 6 12.5 5.77614 12.5 5.5Z',\n processor: 'M9 20V22H7V20H9ZM13 20V22H11V20H13ZM17 20V22H15V20H17ZM17 5C18.1046 5 19 5.89543 19 7V17C19 18.1046 18.1046 19 17 19H7C5.89543 19 5 18.1046 5 17V7C5 5.89543 5.89543 5 7 5H17ZM17 16C16.4477 16 16 16.4477 16 17C16 17.5523 16.4477 18 17 18C17.5523 18 18 17.5523 18 17C18 16.4477 17.5523 16 17 16ZM4 15V17H2V15H4ZM22 15V17H20V15H22ZM4 11V13H2V11H4ZM22 11V13H20V11H22ZM4 7V9H2V7H4ZM22 7V9H20V7H22ZM7 6C6.44772 6 6 6.44772 6 7C6 7.55228 6.44772 8 7 8C7.55228 8 8 7.55228 8 7C8 6.44772 7.55228 6 7 6ZM9 2V4H7V2H9ZM13 2V4H11V2H13ZM17 2V4H15V2H17Z',\n equipment: 'M22 5C22 3.89543 21.1046 3 20 3H4C2.89543 3 2 3.89543 2 5V9C2 10.1046 2.89543 11 4 11H20C21.1046 11 22 10.1046 22 9V5ZM22 15C22 13.8954 21.1046 13 20 13H4C2.89543 13 2 13.8954 2 15V19C2 20.1046 2.89543 21 4 21H20C21.1046 21 22 20.1046 22 19V15ZM4 15H20V19H4V15ZM7 16V18H5V16H7ZM10 18V16H8V18H10ZM13 16V18H11V16H13ZM20 5H4V9H20V5ZM7 8V6H5V8H7ZM10 6V8H8V6H10ZM13 8V6H11V8H13Z',\n netcom: 'M16 2C17.6569 2 19 3.34315 19 5C19 6.65685 17.6569 8 16 8C15.8259 8 15.6553 7.98518 15.4894 7.95672L14.8034 9.14676C15.3137 9.64825 15.6902 10.2856 15.874 11.0002L18.2676 10.9999C18.6134 10.4022 19.2597 10 20 10C21.1046 10 22 10.8954 22 12C22 13.1046 21.1046 14 20 14C19.2602 14 18.6142 13.5983 18.2682 13.0011L15.8738 13.0008C15.6717 13.7853 15.2375 14.4767 14.6488 14.9974L15.2128 16.1044C15.4637 16.0363 15.7276 16 16 16C17.6569 16 19 17.3431 19 19C19 20.6569 17.6569 22 16 22C14.3431 22 13 20.6569 13 19C13 18.3508 13.2062 17.7498 13.5567 17.2589L12.8669 15.9058C12.5878 15.9675 12.2977 16 12 16C11.2582 16 10.5635 15.7981 9.96801 15.4462L7.75736 17.6569L7.59355 17.4912C7.85196 17.9345 8 18.4499 8 19C8 20.6569 6.65685 22 5 22C3.34315 22 2 20.6569 2 19C2 17.3431 3.34315 16 5 16C5.55006 16 6.06555 16.148 6.50879 16.4065L6.34315 16.2426L8.55383 14.032C8.20193 13.4365 8 12.7418 8 12C8 9.79086 9.79086 8 12 8C12.3705 8 12.7293 8.05038 13.0698 8.14467L13.7446 6.97823C13.281 6.45014 13 5.75789 13 5C13 3.34315 14.3431 2 16 2ZM12 10C10.8954 10 10 10.8954 10 12C10 13.1046 10.8954 14 12 14C13.1046 14 14 13.1046 14 12C14 10.8954 13.1046 10 12 10Z',\n hardware: 'M4 17.8247V10.4692H20V17.8247H4ZM2 9.77297C2 9.05293 2.58371 8.46922 3.30375 8.46922H20.6962C21.4163 8.46922 22 9.05293 22 9.77298V18.5209C22 19.241 21.4163 19.8247 20.6962 19.8247H3.30375C2.58371 19.8247 2 19.241 2 18.5209V9.77297ZM8.99573 13.637H4.99573V11.637H8.99573V13.637ZM8.99573 16.642H4.99573V14.642H8.99573V16.642ZM10 13.637H14V11.637H10V13.637ZM14 16.642H10V14.642H14V16.642ZM14.9987 13.637H18.9987V11.637H14.9987V13.637ZM18.9987 16.6424H14.9987V14.6424H18.9987V16.6424Z',\n orbit: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 18c-4.41 0-8-3.59-8-8s3.59-8 8-8 8 3.59 8 8-3.59 8-8 8zm0-14c-3.31 0-6 2.69-6 6s2.69 6 6 6 6-2.69 6-6-2.69-6-6-6zm0 10c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4z',\n 'ground-station': 'M12 3L2 12h3v8h6v-6h2v6h6v-8h3L12 3zm0 11.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5z',\n battery: 'M15.67 4H14V3C14 2.45 13.55 2 13 2H11C10.45 2 10 2.45 10 3V4H8.33C7.6 4 7 4.6 7 5.33V20.66C7 21.4 7.6 22 8.34 22H15.66C16.4 22 17 21.4 17 20.67V5.33C17 4.6 16.4 4 15.67 4Z',\n location: 'M5 9C5 5.13 8.13 2 12 2C15.87 2 19 5.13 19 9C19 13.17 14.58 18.92 12.77 21.11C12.37 21.59 11.64 21.59 11.24 21.11C9.42 18.92 5 13.17 5 9ZM9.5 9C9.5 10.38 10.62 11.5 12 11.5C13.38 11.5 14.5 10.38 14.5 9C14.5 7.62 13.38 6.5 12 6.5C10.62 6.5 9.5 7.62 9.5 9Z',\n rocket: 'M12 2c0 0-6.5 5-6.5 12 0 2.5.5 4 1 5.5l5.5-3 5.5 3c.5-1.5 1-3 1-5.5C18.5 7 12 2 12 2zm0 13c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zM7 22l1.5-1.5L10 22l2-2 2 2 1.5-1.5L17 22l-2.5-2.5-2.5 2.5-2.5-2.5L7 22z',\n thermometer: 'M10.5 2C12.433 2 14 3.567 14 5.5L14.0005 12.2576C15.2217 13.2664 16 14.7923 16 16.5C16 19.5376 13.5376 22 10.5 22C7.46243 22 5 19.5376 5 16.5C5 14.7919 5.77868 13.2656 7.00044 12.2568L7 5.5C7 3.567 8.567 2 10.5 2ZM10.5 4C9.7203 4 9.07955 4.59489 9.00687 5.35543L9 5.49987L9.0005 13.199L8.27384 13.799C7.47135 14.4616 7 15.4402 7 16.5C7 18.433 8.567 20 10.5 20C12.433 20 14 18.433 14 16.5C14 15.5111 13.5896 14.593 12.8828 13.9362L12.7268 13.7995L12.0006 13.1997L12 5.5C12 4.7203 11.4051 4.07955 10.6445 4.00687L10.5 4ZM11 5.5C11 5.22386 10.7761 5 10.5 5C10.2239 5 10 5.22386 10 5.5L10.0006 14.0499C8.85917 14.2813 8 15.2903 8 16.5C8 17.8807 9.11929 19 10.5 19C11.8807 19 13 17.8807 13 16.5C13 15.2907 12.1413 14.2819 11.0004 14.0501L11 5.5ZM20 11C20.5523 11 21 11.4477 21 12C21 12.5523 20.5523 13 20 13H17C16.4477 13 16 12.5523 16 12C16 11.4477 16.4477 11 17 11H20ZM19 9C19 8.44772 18.5523 8 18 8H17C16.4477 8 16 8.44772 16 9C16 9.55228 16.4477 10 17 10H18C18.5523 10 19 9.55228 19 9ZM20 5C20.5523 5 21 5.44772 21 6C21 6.55228 20.5523 7 20 7H17C16.4477 7 16 6.55228 16 6C16 5.44772 16.4477 5 17 5H20ZM19 3C19 2.44772 18.5523 2 18 2H17C16.4477 2 16 2.44772 16 3C16 3.55228 16.4477 4 17 4H18C18.5523 4 19 3.55228 19 3Z',\n \n // === System Icons ===\n settings: 'M19.5 12C19.5 12.34 19.47 12.66 19.43 12.98L21.54 14.63C21.73 14.78 21.78 15.05 21.66 15.27L19.66 18.73C19.54 18.95 19.28 19.04 19.05 18.95L16.56 17.95C16.04 18.34 15.48 18.68 14.87 18.93L14.49 21.58C14.46 21.82 14.25 22 14 22H10C9.75002 22 9.54002 21.82 9.51002 21.58L9.13002 18.93C8.52002 18.68 7.96002 18.35 7.44002 17.95L4.95002 18.95C4.73002 19.03 4.46002 18.95 4.34002 18.73L2.34002 15.27C2.22002 15.05 2.27002 14.78 2.46002 14.63L4.57002 12.98C4.53002 12.66 4.50002 12.33 4.50002 12C4.50002 11.67 4.53002 11.34 4.57002 11.02L2.46002 9.37C2.27002 9.22 2.21002 8.95 2.34002 8.73L4.34002 5.27C4.46002 5.05 4.72002 4.96 4.95002 5.05L7.44002 6.05C7.96002 5.66 8.52002 5.32 9.13002 5.07L9.51002 2.42C9.54002 2.18 9.75002 2 10 2H14C14.25 2 14.46 2.18 14.49 2.42L14.87 5.07C15.48 5.32 16.04 5.65 16.56 6.05L19.05 5.05C19.27 4.97 19.54 5.05 19.66 5.27L21.66 8.73C21.78 8.95 21.73 9.22 21.54 9.37L19.43 11.02C19.47 11.34 19.5 11.66 19.5 12ZM8.50002 12C8.50002 13.93 10.07 15.5 12 15.5C13.93 15.5 15.5 13.93 15.5 12C15.5 10.07 13.93 8.5 12 8.5C10.07 8.5 8.50002 10.07 8.50002 12Z',\n notifications: 'M18 11V16L19.29 17.29C19.92 17.92 19.47 19 18.58 19H5.40999C4.51999 19 4.07999 17.92 4.70999 17.29L5.99999 16V11C5.99999 7.92 7.62999 5.36 10.5 4.68V4C10.5 3.17 11.17 2.5 12 2.5C12.83 2.5 13.5 3.17 13.5 4V4.68C16.36 5.36 18 7.93 18 11ZM14 20C14 21.1 13.1 22 12 22C10.89 22 9.99999 21.1 9.99999 20H14Z',\n 'notifications-off': 'M20 18.69L7.84 6.14 5.27 3.49 4 4.76l2.8 2.8v.01c-.52.99-.8 2.16-.8 3.42v5l-2 2v1h13.73l2 2L21 19.72l-1-1.03zM12 22c1.11 0 2-.89 2-2h-4c0 1.11.89 2 2 2zm6-7.32V11c0-3.08-1.64-5.64-4.5-6.32V4c0-.83-.67-1.5-1.5-1.5s-1.5.67-1.5 1.5v.68c-.15.03-.29.08-.42.12-.1.03-.2.07-.3.11h-.01c-.01 0-.01 0-.02.01-.23.09-.46.2-.68.31 0 0-.01 0-.01.01L18 14.68z',\n warning: 'M19.53 21.0001C21.07 21.0001 22.03 19.3301 21.26 18.0001L13.73 4.99005C12.96 3.66005 11.04 3.66005 10.27 4.99005L2.74 18.0001C1.97 19.3301 2.93 21.0001 4.47 21.0001H19.53ZM12 14.0001C11.45 14.0001 11 13.5501 11 13.0001V11.0001C11 10.4501 11.45 10.0001 12 10.0001C12.55 10.0001 13 10.4501 13 11.0001V13.0001C13 13.5501 12.55 14.0001 12 14.0001ZM11 16.0001V18.0001H13V16.0001H11Z',\n error: 'M12 2C6.48 2 2 6.48 2 12C2 17.52 6.48 22 12 22C17.52 22 22 17.52 22 12C22 6.48 17.52 2 12 2ZM12 13C11.45 13 11 12.55 11 12V8C11 7.45 11.45 7 12 7C12.55 7 13 7.45 13 8V12C13 12.55 12.55 13 12 13ZM11 15V17H13V15H11Z',\n info: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm1 15h-2v-6h2v6zm0-8h-2V7h2v2z',\n check: 'M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z',\n close: 'M19 6.41L17.59 5 12 10.59 6.41 5 5 6.41 10.59 12 5 17.59 6.41 19 12 13.41 17.59 19 19 17.59 13.41 12z',\n add: 'M19 13h-6v6h-2v-6H5v-2h6V5h2v6h6v2z',\n remove: 'M19 13H5v-2h14v2z',\n edit: 'M3 17.25V21h3.75L17.81 9.94l-3.75-3.75L3 17.25zM20.71 7.04c.39-.39.39-1.02 0-1.41l-2.34-2.34c-.39-.39-1.02-.39-1.41 0l-1.83 1.83 3.75 3.75 1.83-1.83z',\n delete: 'M6 19c0 1.1.9 2 2 2h8c1.1 0 2-.9 2-2V7H6v12zM19 4h-3.5l-1-1h-5l-1 1H5v2h14V4z',\n search: 'M15.5 14h-.79l-.28-.27C15.41 12.59 16 11.11 16 9.5 16 5.91 13.09 3 9.5 3S3 5.91 3 9.5 5.91 16 9.5 16c1.61 0 3.09-.59 4.23-1.57l.27.28v.79l5 4.99L20.49 19l-4.99-5zm-6 0C7.01 14 5 11.99 5 9.5S7.01 5 9.5 5 14 7.01 14 9.5 11.99 14 9.5 14z',\n filter: 'M10 18h4v-2h-4v2zM3 6v2h18V6H3zm3 7h12v-2H6v2z',\n refresh: 'M17.65 6.35C16.2 4.9 14.21 4 12 4c-4.42 0-7.99 3.58-7.99 8s3.57 8 7.99 8c3.73 0 6.84-2.55 7.73-6h-2.08c-.82 2.33-3.04 4-5.65 4-3.31 0-6-2.69-6-6s2.69-6 6-6c1.66 0 3.14.69 4.22 1.78L13 11h7V4l-2.35 2.35z',\n sync: 'M12 4V1L8 5l4 4V6c3.31 0 6 2.69 6 6 0 1.01-.25 1.97-.7 2.8l1.46 1.46C19.54 15.03 20 13.57 20 12c0-4.42-3.58-8-8-8zm0 14c-3.31 0-6-2.69-6-6 0-1.01.25-1.97.7-2.8L5.24 7.74C4.46 8.97 4 10.43 4 12c0 4.42 3.58 8 8 8v3l4-4-4-4v3z',\n download: 'M19 9h-4V3H9v6H5l7 7 7-7zM5 18v2h14v-2H5z',\n upload: 'M9 16h6v-6h4l-7-7-7 7h4v6zm-4 2h14v2H5v-2z',\n expand: 'M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z',\n collapse: 'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z',\n fullscreen: 'M7 14H5v5h5v-2H7v-3zm-2-4h2V7h3V5H5v5zm12 7h-3v2h5v-5h-2v3zM14 5v2h3v3h2V5h-5z',\n 'fullscreen-exit': 'M5 16h3v3h2v-5H5v2zm3-8H5v2h5V5H8v3zm6 11h2v-3h3v-2h-5v5zm2-11V5h-2v5h5V8h-3z',\n visibility: 'M12 4.5C7 4.5 2.73 7.61 1 12c1.73 4.39 6 7.5 11 7.5s9.27-3.11 11-7.5c-1.73-4.39-6-7.5-11-7.5zM12 17c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5zm0-8c-1.66 0-3 1.34-3 3s1.34 3 3 3 3-1.34 3-3-1.34-3-3-3z',\n 'visibility-off': 'M12 7c2.76 0 5 2.24 5 5 0 .65-.13 1.26-.36 1.83l2.92 2.92c1.51-1.26 2.7-2.89 3.43-4.75-1.73-4.39-6-7.5-11-7.5-1.4 0-2.74.25-3.98.7l2.16 2.16C10.74 7.13 11.35 7 12 7zM2 4.27l2.28 2.28.46.46C3.08 8.3 1.78 10.02 1 12c1.73 4.39 6 7.5 11 7.5 1.55 0 3.03-.3 4.38-.84l.42.42L19.73 22 21 20.73 3.27 3 2 4.27zM7.53 9.8l1.55 1.55c-.05.21-.08.43-.08.65 0 1.66 1.34 3 3 3 .22 0 .44-.03.65-.08l1.55 1.55c-.67.33-1.41.53-2.2.53-2.76 0-5-2.24-5-5 0-.79.2-1.53.53-2.2zm4.31-.78l3.15 3.15.02-.16c0-1.66-1.34-3-3-3l-.17.01z',\n lock: 'M18 8h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm-6 9c-1.1 0-2-.9-2-2s.9-2 2-2 2 .9 2 2-.9 2-2 2zm3.1-9H8.9V6c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2z',\n unlock: 'M12 17c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm6-9h-1V6c0-2.76-2.24-5-5-5S7 3.24 7 6h1.9c0-1.71 1.39-3.1 3.1-3.1 1.71 0 3.1 1.39 3.1 3.1v2H6c-1.1 0-2 .9-2 2v10c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2V10c0-1.1-.9-2-2-2zm0 12H6V10h12v10z',\n \n // === Navigation Icons ===\n 'arrow-up': 'M4 12l1.41 1.41L11 7.83V20h2V7.83l5.58 5.59L20 12l-8-8-8 8z',\n 'arrow-down': 'M20 12l-1.41-1.41L13 16.17V4h-2v12.17l-5.58-5.59L4 12l8 8 8-8z',\n 'arrow-left': 'M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z',\n 'arrow-right': 'M12 4l-1.41 1.41L16.17 11H4v2h12.17l-5.58 5.59L12 20l8-8-8-8z',\n 'chevron-up': 'M12 8l-6 6 1.41 1.41L12 10.83l4.59 4.58L18 14z',\n 'chevron-down': 'M16.59 8.59L12 13.17 7.41 8.59 6 10l6 6 6-6z',\n 'chevron-left': 'M15.41 7.41L14 6l-6 6 6 6 1.41-1.41L10.83 12z',\n 'chevron-right': 'M10 6L8.59 7.41 13.17 12l-4.58 4.59L10 18l6-6z',\n menu: 'M3 18h18v-2H3v2zm0-5h18v-2H3v2zm0-7v2h18V6H3z',\n 'more-vert': 'M12 8c1.1 0 2-.9 2-2s-.9-2-2-2-2 .9-2 2 .9 2 2 2zm0 2c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm0 6c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z',\n 'more-horiz': 'M6 10c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm12 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zm-6 0c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z',\n \n // === Data Icons ===\n chart: 'M3.5 18.49l6-6.01 4 4L22 6.92l-1.41-1.41-7.09 7.97-4-4L2 16.99z',\n list: 'M3 13h2v-2H3v2zm0 4h2v-2H3v2zm0-8h2V7H3v2zm4 4h14v-2H7v2zm0 4h14v-2H7v2zM7 7v2h14V7H7z',\n grid: 'M3 3h8v8H3V3zm0 10h8v8H3v-8zm10-10h8v8h-8V3zm0 10h8v8h-8v-8z',\n timeline: 'M23 8c0 1.1-.9 2-2 2-.18 0-.35-.02-.51-.07l-3.56 3.55c.05.16.07.34.07.52 0 1.1-.9 2-2 2s-2-.9-2-2c0-.18.02-.36.07-.52l-2.55-2.55c-.16.05-.34.07-.52.07s-.36-.02-.52-.07l-4.55 4.56c.05.16.07.33.07.51 0 1.1-.9 2-2 2s-2-.9-2-2 .9-2 2-2c.18 0 .35.02.51.07l4.56-4.55C8.02 9.36 8 9.18 8 9c0-1.1.9-2 2-2s2 .9 2 2c0 .18-.02.36-.07.52l2.55 2.55c.16-.05.34-.07.52-.07s.36.02.52.07l3.55-3.56C19.02 8.35 19 8.18 19 8c0-1.1.9-2 2-2s2 .9 2 2z',\n calendar: 'M19 3h-1V1h-2v2H8V1H6v2H5c-1.11 0-1.99.9-1.99 2L3 19c0 1.1.89 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 16H5V8h14v11zM9 10H7v2h2v-2zm4 0h-2v2h2v-2zm4 0h-2v2h2v-2z',\n clock: 'M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8zm.5-13H11v6l5.25 3.15.75-1.23-4.5-2.67z',\n play: 'M8 5v14l11-7z',\n 'play-arrow': 'M8 5v14l11-7z',\n pause: 'M6 19h4V5H6v14zm8-14v14h4V5h-4z',\n stop: 'M6 6h12v12H6z',\n 'skip-next': 'M6 18l8.5-6L6 6v12zM16 6v12h2V6h-2z',\n 'skip-previous': 'M6 6h2v12H6zm3.5 6l8.5 6V6z',\n 'fast-forward': 'M4 18l8.5-6L4 6v12zm9-12v12l8.5-6L13 6z',\n 'fast-rewind': 'M11 18V6l-8.5 6 8.5 6zm.5-6l8.5 6V6l-8.5 6z',\n record: 'M12 2C6.48 2 2 6.48 2 12s4.48 10 10 10 10-4.48 10-10S17.52 2 12 2zm0 14c-2.21 0-4-1.79-4-4s1.79-4 4-4 4 1.79 4 4-1.79 4-4 4z',\n \n // === Communication Icons ===\n link: 'M3.9 12c0-1.71 1.39-3.1 3.1-3.1h4V7H7c-2.76 0-5 2.24-5 5s2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1zM8 13h8v-2H8v2zm9-6h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1s-1.39 3.1-3.1 3.1h-4V17h4c2.76 0 5-2.24 5-5s-2.24-5-5-5z',\n 'link-off': 'M17 7h-4v1.9h4c1.71 0 3.1 1.39 3.1 3.1 0 1.43-.98 2.63-2.31 2.98l1.46 1.46C20.88 15.61 22 13.95 22 12c0-2.76-2.24-5-5-5zm-1 4h-2.19l2 2H16v-2zM2 4.27l3.11 3.11C3.29 8.12 2 9.91 2 12c0 2.76 2.24 5 5 5h4v-1.9H7c-1.71 0-3.1-1.39-3.1-3.1 0-1.59 1.21-2.9 2.76-3.07L8.73 11H8v2h2.73L13 15.27V17h1.73l4.01 4L20 19.74 3.27 3 2 4.27z',\n send: 'M2.01 21L23 12 2.01 3 2 10l15 2-15 2z',\n message: 'M20 2H4c-1.1 0-1.99.9-1.99 2L2 22l4-4h14c1.1 0 2-.9 2-2V4c0-1.1-.9-2-2-2zm-2 12H6v-2h12v2zm0-3H6V9h12v2zm0-3H6V6h12v2z',\n mail: 'M20 4H4c-1.1 0-1.99.9-1.99 2L2 18c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2zm0 4l-8 5-8-5V6l8 5 8-5v2z',\n 'photo-camera': 'M12 12m-3.2 0a3.2 3.2 0 1 0 6.4 0 3.2 3.2 0 1 0-6.4 0M9 2L7.17 4H4c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h16c1.1 0 2-.9 2-2V6c0-1.1-.9-2-2-2h-3.17L15 2H9zm3 15c-2.76 0-5-2.24-5-5s2.24-5 5-5 5 2.24 5 5-2.24 5-5 5z',\n images: 'M22 16V4c0-1.1-.9-2-2-2H8c-1.1 0-2 .9-2 2v12c0 1.1.9 2 2 2h12c1.1 0 2-.9 2-2zm-11-4l2.03 2.71L16 11l4 5H8l3-4zM2 6v14c0 1.1.9 2 2 2h14v-2H4V6H2z',\n 'error-outline': 'M11 15h2v2h-2v-2zm0-8h2v6h-2V7zm.99-5C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zM12 20c-4.42 0-8-3.58-8-8s3.58-8 8-8 8 3.58 8 8-3.58 8-8 8z',\n};\n\nexport const Icon = memo(function Icon({\n name,\n size = 24,\n status,\n color,\n className = '',\n 'aria-label': ariaLabel,\n onClick,\n style,\n}: IconProps): React.ReactElement {\n const { tokens } = useTheme();\n \n // Determine color: custom > status > default\n const iconColor = color \n ?? (status ? tokens.colors.status[status] : tokens.colors.text.primary);\n \n const pathData = ICON_PATHS[name];\n const isInteractive = !!onClick;\n \n return (\n <svg\n xmlns=\"http://www.w3.org/2000/svg\"\n width={size}\n height={size}\n viewBox=\"0 0 24 24\"\n fill={iconColor}\n className={className}\n role={ariaLabel ? 'img' : 'presentation'}\n aria-label={ariaLabel ?? name}\n aria-hidden={!ariaLabel}\n onClick={onClick}\n onKeyDown={onClick ? (e: React.KeyboardEvent) => { if (e.key === 'Enter' || e.key === ' ') { e.preventDefault(); onClick(); } } : undefined}\n tabIndex={isInteractive ? 0 : undefined}\n style={{\n cursor: isInteractive ? 'pointer' : 'default',\n flexShrink: 0,\n transition: `fill ${tokens.animation.fast}`,\n ...style,\n }}\n >\n {Array.isArray(pathData) ? (\n pathData.map((d, i) => <path key={i} d={d} fillRule=\"evenodd\" clipRule=\"evenodd\" />)\n ) : (\n <path d={pathData} fillRule=\"evenodd\" clipRule=\"evenodd\" />\n )}\n </svg>\n );\n});\n\n/**\n * Get all available icon names\n */\nexport function getIconNames(): IconName[] {\n return Object.keys(ICON_PATHS) as IconName[];\n}\n\n/**\n * Check if an icon name exists\n */\nexport function isValidIconName(name: string): name is IconName {\n return name in ICON_PATHS;\n}\n\nexport default Icon;\n"],"names":["Icon"],"mappings":"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"}
@@ -43,7 +43,7 @@ export interface TypographyProps {
43
43
  * Standard font family fallback stack per AstroUXDS
44
44
  * Roboto is the primary font for all Astro applications
45
45
  */
46
- export declare const FONT_FAMILY_PRIMARY = "\"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif";
46
+ export declare const FONT_FAMILY_PRIMARY = "var(--font-family-primary, \"Public Sans\", \"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif)";
47
47
  /**
48
48
  * Monospace font stack for tabular data and code
49
49
  * Roboto Mono is the primary monospace font for Astro
@@ -1,6 +1,6 @@
1
1
  import { jsx } from "react/jsx-runtime";
2
2
  import { useTheme } from "../theme/ThemeProvider.js";
3
- const FONT_FAMILY_PRIMARY = '"Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif';
3
+ const FONT_FAMILY_PRIMARY = 'var(--font-family-primary, "Public Sans", "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif)';
4
4
  const FONT_FAMILY_MONO = '"Roboto Mono", "SF Mono", "Consolas", "Liberation Mono", monospace';
5
5
  const FONT_WEIGHTS = {
6
6
  light: 300,
@@ -11,16 +11,16 @@ const FONT_WEIGHTS = {
11
11
  function getTypographyStyles(variant) {
12
12
  const styles = {
13
13
  // Display variants
14
- display1: { fontSize: "3.75rem", fontWeight: 300, lineHeight: "4.375rem", letterSpacing: "-0.5px" },
15
- display2: { fontSize: "3rem", fontWeight: 400, lineHeight: "3.5rem", letterSpacing: "0" },
14
+ display1: { fontSize: "3.75rem", fontWeight: 300, lineHeight: "4.375rem", letterSpacing: "-0.5px", fontFamily: 'var(--font-family-heading, "Sora", "Roboto", sans-serif)' },
15
+ display2: { fontSize: "3rem", fontWeight: 400, lineHeight: "3.5rem", letterSpacing: "0", fontFamily: 'var(--font-family-heading, "Sora", "Roboto", sans-serif)' },
16
16
  // Heading variants
17
- h1: { fontSize: "2.125rem", fontWeight: 400, lineHeight: "2.5rem", letterSpacing: "0.25px" },
18
- h1Bold: { fontSize: "2.125rem", fontWeight: 700, lineHeight: "2.5rem", letterSpacing: "0.25px" },
19
- h2: { fontSize: "1.5rem", fontWeight: 400, lineHeight: "1.75rem", letterSpacing: "0" },
20
- h3: { fontSize: "1.25rem", fontWeight: 500, lineHeight: "1.5rem", letterSpacing: "0.15px" },
21
- h4: { fontSize: "1.25rem", fontWeight: 300, lineHeight: "1.5rem", letterSpacing: "0.15px" },
22
- h5: { fontSize: "1.125rem", fontWeight: 400, lineHeight: "1.5rem", letterSpacing: "0" },
23
- h6: { fontSize: "1.125rem", fontWeight: 300, lineHeight: "1.5rem", letterSpacing: "0" },
17
+ h1: { fontSize: "2.125rem", fontWeight: 400, lineHeight: "2.5rem", letterSpacing: "0.25px", fontFamily: 'var(--font-family-heading, "Sora", "Roboto", sans-serif)' },
18
+ h1Bold: { fontSize: "2.125rem", fontWeight: 700, lineHeight: "2.5rem", letterSpacing: "0.25px", fontFamily: 'var(--font-family-heading, "Sora", "Roboto", sans-serif)' },
19
+ h2: { fontSize: "1.5rem", fontWeight: 400, lineHeight: "1.75rem", letterSpacing: "0", fontFamily: 'var(--font-family-heading, "Sora", "Roboto", sans-serif)' },
20
+ h3: { fontSize: "1.25rem", fontWeight: 500, lineHeight: "1.5rem", letterSpacing: "0.15px", fontFamily: 'var(--font-family-heading, "Sora", "Roboto", sans-serif)' },
21
+ h4: { fontSize: "1.25rem", fontWeight: 300, lineHeight: "1.5rem", letterSpacing: "0.15px", fontFamily: 'var(--font-family-heading, "Sora", "Roboto", sans-serif)' },
22
+ h5: { fontSize: "1.125rem", fontWeight: 400, lineHeight: "1.5rem", letterSpacing: "0", fontFamily: 'var(--font-family-heading, "Sora", "Roboto", sans-serif)' },
23
+ h6: { fontSize: "1.125rem", fontWeight: 300, lineHeight: "1.5rem", letterSpacing: "0", fontFamily: 'var(--font-family-heading, "Sora", "Roboto", sans-serif)' },
24
24
  // Body variants
25
25
  body1: { fontSize: "1rem", fontWeight: 400, lineHeight: "1.5rem", letterSpacing: "0.5px" },
26
26
  body1Bold: { fontSize: "1rem", fontWeight: 700, lineHeight: "1.5rem", letterSpacing: "0.5px" },
@@ -1 +1 @@
1
- {"version":3,"file":"Typography.js","sources":["../../../src/react/core/Typography.tsx"],"sourcesContent":["/**\r\n * @zendir/ui - Typography Component\r\n * \r\n * AstroUXDS-compliant typography component providing consistent text styling\r\n * across the design system. All sizing uses rem units per Astro specifications.\r\n * \r\n * Typography Scale (Astro UX Design System):\r\n * - Display: Large hero text (display1, display2)\r\n * - Heading: Section headers (h1-h6)\r\n * - Body: Content text (body1, body2, body3)\r\n * - Control: UI element labels\r\n * - Mono: Tabular/code data\r\n * \r\n * @see https://www.astrouxds.com/foundations/typography/\r\n */\r\n\r\nimport React from 'react';\r\nimport { useTheme } from '../theme/ThemeProvider';\r\n\r\n// ============================================================================\r\n// Typography Variants (AstroUXDS Compliant)\r\n// ============================================================================\r\n\r\n/**\r\n * Typography variant following Astro UX Design System\r\n * Maps directly to official Astro typography tokens\r\n */\r\nexport type TypographyVariant =\r\n // Display - Large hero text\r\n | 'display1'\r\n | 'display2'\r\n // Headings\r\n | 'h1'\r\n | 'h1Bold'\r\n | 'h2'\r\n | 'h3'\r\n | 'h4'\r\n | 'h5'\r\n | 'h6'\r\n // Body text\r\n | 'body1'\r\n | 'body1Bold'\r\n | 'body2'\r\n | 'body2Bold'\r\n | 'body3'\r\n | 'body3Bold'\r\n // Control (UI labels)\r\n | 'control1'\r\n | 'control1Bold'\r\n // Compact variants for dense UIs (cards, badges)\r\n | 'compact' // 10px - for tight spaces\r\n | 'compactBold'\r\n | 'micro' // 9px - for very tight spaces\r\n | 'microBold'\r\n // Monospace for data/code\r\n | 'mono'\r\n | 'monoSmall'\r\n | 'monoCompact';\r\n\r\n/**\r\n * Semantic element to render\r\n */\r\nexport type TypographyElement =\r\n | 'h1'\r\n | 'h2'\r\n | 'h3'\r\n | 'h4'\r\n | 'h5'\r\n | 'h6'\r\n | 'p'\r\n | 'span'\r\n | 'div'\r\n | 'label'\r\n | 'code'\r\n | 'pre';\r\n\r\n/**\r\n * Text color variants\r\n */\r\nexport type TypographyColor =\r\n | 'primary'\r\n | 'secondary'\r\n | 'tertiary'\r\n | 'muted'\r\n | 'inverse'\r\n | 'inherit'\r\n // Status colors\r\n | 'normal'\r\n | 'standby'\r\n | 'caution'\r\n | 'serious'\r\n | 'critical'\r\n | 'off';\r\n\r\nexport interface TypographyProps {\r\n /** Typography variant (required) */\r\n variant: TypographyVariant;\r\n /** HTML element to render */\r\n as?: TypographyElement;\r\n /** Text color */\r\n color?: TypographyColor;\r\n /** Enable tabular figures for numeric alignment */\r\n tabular?: boolean;\r\n /** Truncate with ellipsis */\r\n truncate?: boolean;\r\n /** Text alignment */\r\n align?: 'left' | 'center' | 'right';\r\n /** Disable text wrapping */\r\n noWrap?: boolean;\r\n /** Transform text case */\r\n transform?: 'none' | 'uppercase' | 'lowercase' | 'capitalize';\r\n /** Additional CSS styles */\r\n style?: React.CSSProperties;\r\n /** Additional CSS class */\r\n className?: string;\r\n /** Children */\r\n children?: React.ReactNode;\r\n /** Test ID */\r\n 'data-testid'?: string;\r\n}\r\n\r\n// ============================================================================\r\n// AstroUXDS Font Stack (Standardized)\r\n// ============================================================================\r\n\r\n/**\r\n * Standard font family fallback stack per AstroUXDS\r\n * Roboto is the primary font for all Astro applications\r\n */\r\nexport const FONT_FAMILY_PRIMARY = '\"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif';\r\n\r\n/**\r\n * Monospace font stack for tabular data and code\r\n * Roboto Mono is the primary monospace font for Astro\r\n */\r\nexport const FONT_FAMILY_MONO = '\"Roboto Mono\", \"SF Mono\", \"Consolas\", \"Liberation Mono\", monospace';\r\n\r\n// ============================================================================\r\n// AstroUXDS Font Weights\r\n// Official weights: 300 (Light), 400 (Regular), 500 (Medium), 700 (Bold)\r\n// Note: Astro does NOT use 600 (semibold) - use 500 or 700 instead\r\n// ============================================================================\r\n\r\nexport const FONT_WEIGHTS = {\r\n light: 300,\r\n regular: 400,\r\n medium: 500,\r\n bold: 700,\r\n} as const;\r\n\r\n// ============================================================================\r\n// Typography Style Definitions\r\n// ============================================================================\r\n\r\ninterface TypographyStyleDef {\r\n fontSize: string;\r\n fontWeight: number;\r\n lineHeight: string;\r\n letterSpacing: string;\r\n fontFamily?: string;\r\n}\r\n\r\n/**\r\n * Get typography styles for a variant\r\n * All sizes in rem for Astro compliance\r\n */\r\nfunction getTypographyStyles(variant: TypographyVariant): TypographyStyleDef {\r\n const styles: Record<TypographyVariant, TypographyStyleDef> = {\r\n // Display variants\r\n display1: { fontSize: '3.75rem', fontWeight: 300, lineHeight: '4.375rem', letterSpacing: '-0.5px' },\r\n display2: { fontSize: '3rem', fontWeight: 400, lineHeight: '3.5rem', letterSpacing: '0' },\r\n \r\n // Heading variants\r\n h1: { fontSize: '2.125rem', fontWeight: 400, lineHeight: '2.5rem', letterSpacing: '0.25px' },\r\n h1Bold: { fontSize: '2.125rem', fontWeight: 700, lineHeight: '2.5rem', letterSpacing: '0.25px' },\r\n h2: { fontSize: '1.5rem', fontWeight: 400, lineHeight: '1.75rem', letterSpacing: '0' },\r\n h3: { fontSize: '1.25rem', fontWeight: 500, lineHeight: '1.5rem', letterSpacing: '0.15px' },\r\n h4: { fontSize: '1.25rem', fontWeight: 300, lineHeight: '1.5rem', letterSpacing: '0.15px' },\r\n h5: { fontSize: '1.125rem', fontWeight: 400, lineHeight: '1.5rem', letterSpacing: '0' },\r\n h6: { fontSize: '1.125rem', fontWeight: 300, lineHeight: '1.5rem', letterSpacing: '0' },\r\n \r\n // Body variants\r\n body1: { fontSize: '1rem', fontWeight: 400, lineHeight: '1.5rem', letterSpacing: '0.5px' },\r\n body1Bold: { fontSize: '1rem', fontWeight: 700, lineHeight: '1.5rem', letterSpacing: '0.5px' },\r\n body2: { fontSize: '0.875rem', fontWeight: 400, lineHeight: '1.25rem', letterSpacing: '0.5px' },\r\n body2Bold: { fontSize: '0.875rem', fontWeight: 700, lineHeight: '1.25rem', letterSpacing: '0.5px' },\r\n body3: { fontSize: '0.75rem', fontWeight: 400, lineHeight: '1rem', letterSpacing: '0' },\r\n body3Bold: { fontSize: '0.75rem', fontWeight: 700, lineHeight: '1rem', letterSpacing: '0' },\r\n \r\n // Control variants (UI labels)\r\n control1: { fontSize: '1rem', fontWeight: 400, lineHeight: '1.25rem', letterSpacing: '0.5px' },\r\n control1Bold: { fontSize: '1rem', fontWeight: 700, lineHeight: '1.25rem', letterSpacing: '0.5px' },\r\n \r\n // Compact variants for dense UIs (cards, badges, data labels)\r\n compact: { fontSize: '0.625rem', fontWeight: 400, lineHeight: '0.875rem', letterSpacing: '0' }, // 10px\r\n compactBold: { fontSize: '0.625rem', fontWeight: 500, lineHeight: '0.875rem', letterSpacing: '0' },\r\n micro: { fontSize: '0.5625rem', fontWeight: 400, lineHeight: '0.75rem', letterSpacing: '0' }, // 9px\r\n microBold: { fontSize: '0.5625rem', fontWeight: 500, lineHeight: '0.75rem', letterSpacing: '0' },\r\n \r\n // Monospace variants for data/code\r\n mono: { fontSize: '0.875rem', fontWeight: 400, lineHeight: '1.25rem', letterSpacing: '0', fontFamily: FONT_FAMILY_MONO },\r\n monoSmall: { fontSize: '0.75rem', fontWeight: 400, lineHeight: '1rem', letterSpacing: '0', fontFamily: FONT_FAMILY_MONO },\r\n monoCompact: { fontSize: '0.625rem', fontWeight: 400, lineHeight: '0.875rem', letterSpacing: '0', fontFamily: FONT_FAMILY_MONO },\r\n };\r\n \r\n return styles[variant];\r\n}\r\n\r\n/**\r\n * Get default HTML element for variant\r\n */\r\nfunction getDefaultElement(variant: TypographyVariant): TypographyElement {\r\n if (variant.startsWith('display')) return 'h1';\r\n if (variant.startsWith('h1')) return 'h1';\r\n if (variant.startsWith('h2')) return 'h2';\r\n if (variant.startsWith('h3')) return 'h3';\r\n if (variant.startsWith('h4')) return 'h4';\r\n if (variant.startsWith('h5')) return 'h5';\r\n if (variant.startsWith('h6')) return 'h6';\r\n if (variant.startsWith('mono')) return 'code';\r\n if (variant.startsWith('control')) return 'label';\r\n return 'span';\r\n}\r\n\r\n// ============================================================================\r\n// Typography Component\r\n// ============================================================================\r\n\r\n/**\r\n * Typography component providing AstroUXDS-compliant text styling.\r\n * \r\n * @example\r\n * ```tsx\r\n * // Heading\r\n * <Typography variant=\"h3\">Section Title</Typography>\r\n * \r\n * // Body text\r\n * <Typography variant=\"body1\" color=\"secondary\">Description text</Typography>\r\n * \r\n * // Monospace data with tabular figures\r\n * <Typography variant=\"mono\" tabular>123.456</Typography>\r\n * \r\n * // Compact label for cards\r\n * <Typography variant=\"compact\" color=\"tertiary\">LABEL</Typography>\r\n * ```\r\n */\r\nexport const Typography: React.FC<TypographyProps> = ({\r\n variant,\r\n as,\r\n color = 'primary',\r\n tabular = false,\r\n truncate = false,\r\n align,\r\n noWrap = false,\r\n transform,\r\n style,\r\n className,\r\n children,\r\n 'data-testid': testId,\r\n}) => {\r\n const { tokens } = useTheme();\r\n \r\n const typographyStyles = getTypographyStyles(variant);\r\n const Element = as || getDefaultElement(variant);\r\n \r\n // Resolve color\r\n const getColor = (): string | undefined => {\r\n if (color === 'inherit') return 'inherit';\r\n if (color === 'primary') return tokens.colors.text.primary;\r\n if (color === 'secondary') return tokens.colors.text.secondary;\r\n if (color === 'tertiary') return tokens.colors.text.tertiary;\r\n if (color === 'muted') return tokens.colors.text.muted || tokens.colors.text.tertiary;\r\n if (color === 'inverse') return tokens.colors.text.inverse;\r\n // Status colors\r\n if (color === 'normal') return tokens.colors.status.normal;\r\n if (color === 'standby') return tokens.colors.status.standby;\r\n if (color === 'caution') return tokens.colors.status.caution;\r\n if (color === 'serious') return tokens.colors.status.serious;\r\n if (color === 'critical') return tokens.colors.status.critical;\r\n if (color === 'off') return tokens.colors.status.off;\r\n return undefined;\r\n };\r\n \r\n const combinedStyle: React.CSSProperties = {\r\n fontFamily: typographyStyles.fontFamily || FONT_FAMILY_PRIMARY,\r\n fontSize: typographyStyles.fontSize,\r\n fontWeight: typographyStyles.fontWeight,\r\n lineHeight: typographyStyles.lineHeight,\r\n letterSpacing: typographyStyles.letterSpacing,\r\n color: getColor(),\r\n margin: 0,\r\n padding: 0,\r\n // Tabular figures for numeric alignment\r\n ...(tabular && {\r\n fontVariantNumeric: 'tabular-nums',\r\n fontFeatureSettings: '\"tnum\"',\r\n }),\r\n // Truncation\r\n ...(truncate && {\r\n overflow: 'hidden',\r\n textOverflow: 'ellipsis',\r\n whiteSpace: 'nowrap',\r\n }),\r\n // No wrap\r\n ...(noWrap && !truncate && {\r\n whiteSpace: 'nowrap',\r\n }),\r\n // Text alignment\r\n ...(align && { textAlign: align }),\r\n // Text transform\r\n ...(transform && { textTransform: transform }),\r\n // Custom styles (can override defaults)\r\n ...style,\r\n };\r\n \r\n return (\r\n <Element\r\n className={className}\r\n style={combinedStyle}\r\n data-testid={testId}\r\n >\r\n {children}\r\n </Element>\r\n );\r\n};\r\n\r\n// ============================================================================\r\n// Convenience Components\r\n// ============================================================================\r\n\r\n/** Display 1 - Largest display text */\r\nexport const Display1: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\r\n <Typography variant=\"display1\" {...props} />\r\n);\r\n\r\n/** Display 2 - Large display text */\r\nexport const Display2: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\r\n <Typography variant=\"display2\" {...props} />\r\n);\r\n\r\n/** Heading 1 */\r\nexport const H1: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\r\n <Typography variant={bold ? 'h1Bold' : 'h1'} {...props} />\r\n);\r\n\r\n/** Heading 2 */\r\nexport const H2: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\r\n <Typography variant=\"h2\" {...props} />\r\n);\r\n\r\n/** Heading 3 */\r\nexport const H3: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\r\n <Typography variant=\"h3\" {...props} />\r\n);\r\n\r\n/** Heading 4 */\r\nexport const H4: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\r\n <Typography variant=\"h4\" {...props} />\r\n);\r\n\r\n/** Heading 5 */\r\nexport const H5: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\r\n <Typography variant=\"h5\" {...props} />\r\n);\r\n\r\n/** Heading 6 */\r\nexport const H6: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\r\n <Typography variant=\"h6\" {...props} />\r\n);\r\n\r\n/** Body text level 1 (16px) */\r\nexport const Body1: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\r\n <Typography variant={bold ? 'body1Bold' : 'body1'} {...props} />\r\n);\r\n\r\n/** Body text level 2 (14px) */\r\nexport const Body2: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\r\n <Typography variant={bold ? 'body2Bold' : 'body2'} {...props} />\r\n);\r\n\r\n/** Body text level 3 (12px) */\r\nexport const Body3: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\r\n <Typography variant={bold ? 'body3Bold' : 'body3'} {...props} />\r\n);\r\n\r\n/** Compact text for dense UIs (10px) */\r\nexport const Compact: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\r\n <Typography variant={bold ? 'compactBold' : 'compact'} {...props} />\r\n);\r\n\r\n/** Micro text for very tight spaces (9px) */\r\nexport const Micro: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\r\n <Typography variant={bold ? 'microBold' : 'micro'} {...props} />\r\n);\r\n\r\n/** Monospace text for data/code */\r\nexport const Mono: React.FC<Omit<TypographyProps, 'variant'> & { size?: 'normal' | 'small' | 'compact' }> = ({ \r\n size = 'normal', \r\n tabular = true, // Default to tabular for mono\r\n ...props \r\n}) => {\r\n const variant = size === 'compact' ? 'monoCompact' : size === 'small' ? 'monoSmall' : 'mono';\r\n return <Typography variant={variant} tabular={tabular} {...props} />;\r\n};\r\n\r\n/** Data value text - monospace with tabular figures (for numeric displays) */\r\nexport const DataText: React.FC<Omit<TypographyProps, 'variant' | 'tabular'> & { \r\n size?: 'large' | 'normal' | 'small' | 'compact';\r\n}> = ({ size = 'normal', ...props }) => {\r\n const variantMap: Record<string, TypographyVariant> = {\r\n large: 'mono',\r\n normal: 'mono',\r\n small: 'monoSmall',\r\n compact: 'monoCompact',\r\n };\r\n return <Typography variant={variantMap[size]} tabular {...props} />;\r\n};\r\n\r\n/** Label text for form controls and card headers */\r\nexport const Label: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\r\n <Typography variant={bold ? 'control1Bold' : 'control1'} as=\"label\" {...props} />\r\n);\r\n\r\nexport default Typography;\r\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Typography.js","sources":["../../../src/react/core/Typography.tsx"],"sourcesContent":["/**\n * @zendir/ui - Typography Component\n * \n * AstroUXDS-compliant typography component providing consistent text styling\n * across the design system. All sizing uses rem units per Astro specifications.\n * \n * Typography Scale (Astro UX Design System):\n * - Display: Large hero text (display1, display2)\n * - Heading: Section headers (h1-h6)\n * - Body: Content text (body1, body2, body3)\n * - Control: UI element labels\n * - Mono: Tabular/code data\n * \n * @see https://www.astrouxds.com/foundations/typography/\n */\n\nimport React from 'react';\nimport { useTheme } from '../theme/ThemeProvider';\n\n// ============================================================================\n// Typography Variants (AstroUXDS Compliant)\n// ============================================================================\n\n/**\n * Typography variant following Astro UX Design System\n * Maps directly to official Astro typography tokens\n */\nexport type TypographyVariant =\n // Display - Large hero text\n | 'display1'\n | 'display2'\n // Headings\n | 'h1'\n | 'h1Bold'\n | 'h2'\n | 'h3'\n | 'h4'\n | 'h5'\n | 'h6'\n // Body text\n | 'body1'\n | 'body1Bold'\n | 'body2'\n | 'body2Bold'\n | 'body3'\n | 'body3Bold'\n // Control (UI labels)\n | 'control1'\n | 'control1Bold'\n // Compact variants for dense UIs (cards, badges)\n | 'compact' // 10px - for tight spaces\n | 'compactBold'\n | 'micro' // 9px - for very tight spaces\n | 'microBold'\n // Monospace for data/code\n | 'mono'\n | 'monoSmall'\n | 'monoCompact';\n\n/**\n * Semantic element to render\n */\nexport type TypographyElement =\n | 'h1'\n | 'h2'\n | 'h3'\n | 'h4'\n | 'h5'\n | 'h6'\n | 'p'\n | 'span'\n | 'div'\n | 'label'\n | 'code'\n | 'pre';\n\n/**\n * Text color variants\n */\nexport type TypographyColor =\n | 'primary'\n | 'secondary'\n | 'tertiary'\n | 'muted'\n | 'inverse'\n | 'inherit'\n // Status colors\n | 'normal'\n | 'standby'\n | 'caution'\n | 'serious'\n | 'critical'\n | 'off';\n\nexport interface TypographyProps {\n /** Typography variant (required) */\n variant: TypographyVariant;\n /** HTML element to render */\n as?: TypographyElement;\n /** Text color */\n color?: TypographyColor;\n /** Enable tabular figures for numeric alignment */\n tabular?: boolean;\n /** Truncate with ellipsis */\n truncate?: boolean;\n /** Text alignment */\n align?: 'left' | 'center' | 'right';\n /** Disable text wrapping */\n noWrap?: boolean;\n /** Transform text case */\n transform?: 'none' | 'uppercase' | 'lowercase' | 'capitalize';\n /** Additional CSS styles */\n style?: React.CSSProperties;\n /** Additional CSS class */\n className?: string;\n /** Children */\n children?: React.ReactNode;\n /** Test ID */\n 'data-testid'?: string;\n}\n\n// ============================================================================\n// AstroUXDS Font Stack (Standardized)\n// ============================================================================\n\n/**\n * Standard font family fallback stack per AstroUXDS\n * Roboto is the primary font for all Astro applications\n */\nexport const FONT_FAMILY_PRIMARY = 'var(--font-family-primary, \"Public Sans\", \"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif)';\n\n/**\n * Monospace font stack for tabular data and code\n * Roboto Mono is the primary monospace font for Astro\n */\nexport const FONT_FAMILY_MONO = '\"Roboto Mono\", \"SF Mono\", \"Consolas\", \"Liberation Mono\", monospace';\n\n// ============================================================================\n// AstroUXDS Font Weights\n// Official weights: 300 (Light), 400 (Regular), 500 (Medium), 700 (Bold)\n// Note: Astro does NOT use 600 (semibold) - use 500 or 700 instead\n// ============================================================================\n\nexport const FONT_WEIGHTS = {\n light: 300,\n regular: 400,\n medium: 500,\n bold: 700,\n} as const;\n\n// ============================================================================\n// Typography Style Definitions\n// ============================================================================\n\ninterface TypographyStyleDef {\n fontSize: string;\n fontWeight: number;\n lineHeight: string;\n letterSpacing: string;\n fontFamily?: string;\n}\n\n/**\n * Get typography styles for a variant\n * All sizes in rem for Astro compliance\n */\nfunction getTypographyStyles(variant: TypographyVariant): TypographyStyleDef {\n const styles: Record<TypographyVariant, TypographyStyleDef> = {\n // Display variants\n display1: { fontSize: '3.75rem', fontWeight: 300, lineHeight: '4.375rem', letterSpacing: '-0.5px', fontFamily: 'var(--font-family-heading, \"Sora\", \"Roboto\", sans-serif)' },\n display2: { fontSize: '3rem', fontWeight: 400, lineHeight: '3.5rem', letterSpacing: '0', fontFamily: 'var(--font-family-heading, \"Sora\", \"Roboto\", sans-serif)' },\n \n // Heading variants\n h1: { fontSize: '2.125rem', fontWeight: 400, lineHeight: '2.5rem', letterSpacing: '0.25px', fontFamily: 'var(--font-family-heading, \"Sora\", \"Roboto\", sans-serif)' },\n h1Bold: { fontSize: '2.125rem', fontWeight: 700, lineHeight: '2.5rem', letterSpacing: '0.25px', fontFamily: 'var(--font-family-heading, \"Sora\", \"Roboto\", sans-serif)' },\n h2: { fontSize: '1.5rem', fontWeight: 400, lineHeight: '1.75rem', letterSpacing: '0', fontFamily: 'var(--font-family-heading, \"Sora\", \"Roboto\", sans-serif)' },\n h3: { fontSize: '1.25rem', fontWeight: 500, lineHeight: '1.5rem', letterSpacing: '0.15px', fontFamily: 'var(--font-family-heading, \"Sora\", \"Roboto\", sans-serif)' },\n h4: { fontSize: '1.25rem', fontWeight: 300, lineHeight: '1.5rem', letterSpacing: '0.15px', fontFamily: 'var(--font-family-heading, \"Sora\", \"Roboto\", sans-serif)' },\n h5: { fontSize: '1.125rem', fontWeight: 400, lineHeight: '1.5rem', letterSpacing: '0', fontFamily: 'var(--font-family-heading, \"Sora\", \"Roboto\", sans-serif)' },\n h6: { fontSize: '1.125rem', fontWeight: 300, lineHeight: '1.5rem', letterSpacing: '0', fontFamily: 'var(--font-family-heading, \"Sora\", \"Roboto\", sans-serif)' },\n \n // Body variants\n body1: { fontSize: '1rem', fontWeight: 400, lineHeight: '1.5rem', letterSpacing: '0.5px' },\n body1Bold: { fontSize: '1rem', fontWeight: 700, lineHeight: '1.5rem', letterSpacing: '0.5px' },\n body2: { fontSize: '0.875rem', fontWeight: 400, lineHeight: '1.25rem', letterSpacing: '0.5px' },\n body2Bold: { fontSize: '0.875rem', fontWeight: 700, lineHeight: '1.25rem', letterSpacing: '0.5px' },\n body3: { fontSize: '0.75rem', fontWeight: 400, lineHeight: '1rem', letterSpacing: '0' },\n body3Bold: { fontSize: '0.75rem', fontWeight: 700, lineHeight: '1rem', letterSpacing: '0' },\n \n // Control variants (UI labels)\n control1: { fontSize: '1rem', fontWeight: 400, lineHeight: '1.25rem', letterSpacing: '0.5px' },\n control1Bold: { fontSize: '1rem', fontWeight: 700, lineHeight: '1.25rem', letterSpacing: '0.5px' },\n \n // Compact variants for dense UIs (cards, badges, data labels)\n compact: { fontSize: '0.625rem', fontWeight: 400, lineHeight: '0.875rem', letterSpacing: '0' }, // 10px\n compactBold: { fontSize: '0.625rem', fontWeight: 500, lineHeight: '0.875rem', letterSpacing: '0' },\n micro: { fontSize: '0.5625rem', fontWeight: 400, lineHeight: '0.75rem', letterSpacing: '0' }, // 9px\n microBold: { fontSize: '0.5625rem', fontWeight: 500, lineHeight: '0.75rem', letterSpacing: '0' },\n \n // Monospace variants for data/code\n mono: { fontSize: '0.875rem', fontWeight: 400, lineHeight: '1.25rem', letterSpacing: '0', fontFamily: FONT_FAMILY_MONO },\n monoSmall: { fontSize: '0.75rem', fontWeight: 400, lineHeight: '1rem', letterSpacing: '0', fontFamily: FONT_FAMILY_MONO },\n monoCompact: { fontSize: '0.625rem', fontWeight: 400, lineHeight: '0.875rem', letterSpacing: '0', fontFamily: FONT_FAMILY_MONO },\n };\n \n return styles[variant];\n}\n\n/**\n * Get default HTML element for variant\n */\nfunction getDefaultElement(variant: TypographyVariant): TypographyElement {\n if (variant.startsWith('display')) return 'h1';\n if (variant.startsWith('h1')) return 'h1';\n if (variant.startsWith('h2')) return 'h2';\n if (variant.startsWith('h3')) return 'h3';\n if (variant.startsWith('h4')) return 'h4';\n if (variant.startsWith('h5')) return 'h5';\n if (variant.startsWith('h6')) return 'h6';\n if (variant.startsWith('mono')) return 'code';\n if (variant.startsWith('control')) return 'label';\n return 'span';\n}\n\n// ============================================================================\n// Typography Component\n// ============================================================================\n\n/**\n * Typography component providing AstroUXDS-compliant text styling.\n * \n * @example\n * ```tsx\n * // Heading\n * <Typography variant=\"h3\">Section Title</Typography>\n * \n * // Body text\n * <Typography variant=\"body1\" color=\"secondary\">Description text</Typography>\n * \n * // Monospace data with tabular figures\n * <Typography variant=\"mono\" tabular>123.456</Typography>\n * \n * // Compact label for cards\n * <Typography variant=\"compact\" color=\"tertiary\">LABEL</Typography>\n * ```\n */\nexport const Typography: React.FC<TypographyProps> = ({\n variant,\n as,\n color = 'primary',\n tabular = false,\n truncate = false,\n align,\n noWrap = false,\n transform,\n style,\n className,\n children,\n 'data-testid': testId,\n}) => {\n const { tokens } = useTheme();\n \n const typographyStyles = getTypographyStyles(variant);\n const Element = as || getDefaultElement(variant);\n \n // Resolve color\n const getColor = (): string | undefined => {\n if (color === 'inherit') return 'inherit';\n if (color === 'primary') return tokens.colors.text.primary;\n if (color === 'secondary') return tokens.colors.text.secondary;\n if (color === 'tertiary') return tokens.colors.text.tertiary;\n if (color === 'muted') return tokens.colors.text.muted || tokens.colors.text.tertiary;\n if (color === 'inverse') return tokens.colors.text.inverse;\n // Status colors\n if (color === 'normal') return tokens.colors.status.normal;\n if (color === 'standby') return tokens.colors.status.standby;\n if (color === 'caution') return tokens.colors.status.caution;\n if (color === 'serious') return tokens.colors.status.serious;\n if (color === 'critical') return tokens.colors.status.critical;\n if (color === 'off') return tokens.colors.status.off;\n return undefined;\n };\n \n const combinedStyle: React.CSSProperties = {\n fontFamily: typographyStyles.fontFamily || FONT_FAMILY_PRIMARY,\n fontSize: typographyStyles.fontSize,\n fontWeight: typographyStyles.fontWeight,\n lineHeight: typographyStyles.lineHeight,\n letterSpacing: typographyStyles.letterSpacing,\n color: getColor(),\n margin: 0,\n padding: 0,\n // Tabular figures for numeric alignment\n ...(tabular && {\n fontVariantNumeric: 'tabular-nums',\n fontFeatureSettings: '\"tnum\"',\n }),\n // Truncation\n ...(truncate && {\n overflow: 'hidden',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n }),\n // No wrap\n ...(noWrap && !truncate && {\n whiteSpace: 'nowrap',\n }),\n // Text alignment\n ...(align && { textAlign: align }),\n // Text transform\n ...(transform && { textTransform: transform }),\n // Custom styles (can override defaults)\n ...style,\n };\n \n return (\n <Element\n className={className}\n style={combinedStyle}\n data-testid={testId}\n >\n {children}\n </Element>\n );\n};\n\n// ============================================================================\n// Convenience Components\n// ============================================================================\n\n/** Display 1 - Largest display text */\nexport const Display1: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\n <Typography variant=\"display1\" {...props} />\n);\n\n/** Display 2 - Large display text */\nexport const Display2: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\n <Typography variant=\"display2\" {...props} />\n);\n\n/** Heading 1 */\nexport const H1: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\n <Typography variant={bold ? 'h1Bold' : 'h1'} {...props} />\n);\n\n/** Heading 2 */\nexport const H2: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\n <Typography variant=\"h2\" {...props} />\n);\n\n/** Heading 3 */\nexport const H3: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\n <Typography variant=\"h3\" {...props} />\n);\n\n/** Heading 4 */\nexport const H4: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\n <Typography variant=\"h4\" {...props} />\n);\n\n/** Heading 5 */\nexport const H5: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\n <Typography variant=\"h5\" {...props} />\n);\n\n/** Heading 6 */\nexport const H6: React.FC<Omit<TypographyProps, 'variant'>> = (props) => (\n <Typography variant=\"h6\" {...props} />\n);\n\n/** Body text level 1 (16px) */\nexport const Body1: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\n <Typography variant={bold ? 'body1Bold' : 'body1'} {...props} />\n);\n\n/** Body text level 2 (14px) */\nexport const Body2: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\n <Typography variant={bold ? 'body2Bold' : 'body2'} {...props} />\n);\n\n/** Body text level 3 (12px) */\nexport const Body3: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\n <Typography variant={bold ? 'body3Bold' : 'body3'} {...props} />\n);\n\n/** Compact text for dense UIs (10px) */\nexport const Compact: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\n <Typography variant={bold ? 'compactBold' : 'compact'} {...props} />\n);\n\n/** Micro text for very tight spaces (9px) */\nexport const Micro: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\n <Typography variant={bold ? 'microBold' : 'micro'} {...props} />\n);\n\n/** Monospace text for data/code */\nexport const Mono: React.FC<Omit<TypographyProps, 'variant'> & { size?: 'normal' | 'small' | 'compact' }> = ({ \n size = 'normal', \n tabular = true, // Default to tabular for mono\n ...props \n}) => {\n const variant = size === 'compact' ? 'monoCompact' : size === 'small' ? 'monoSmall' : 'mono';\n return <Typography variant={variant} tabular={tabular} {...props} />;\n};\n\n/** Data value text - monospace with tabular figures (for numeric displays) */\nexport const DataText: React.FC<Omit<TypographyProps, 'variant' | 'tabular'> & { \n size?: 'large' | 'normal' | 'small' | 'compact';\n}> = ({ size = 'normal', ...props }) => {\n const variantMap: Record<string, TypographyVariant> = {\n large: 'mono',\n normal: 'mono',\n small: 'monoSmall',\n compact: 'monoCompact',\n };\n return <Typography variant={variantMap[size]} tabular {...props} />;\n};\n\n/** Label text for form controls and card headers */\nexport const Label: React.FC<Omit<TypographyProps, 'variant'> & { bold?: boolean }> = ({ bold, ...props }) => (\n <Typography variant={bold ? 'control1Bold' : 'control1'} as=\"label\" {...props} />\n);\n\nexport default Typography;\n"],"names":[],"mappings":"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"}
@@ -1015,6 +1015,7 @@ function ThemeProvider({
1015
1015
  root.style.setProperty("--color-accent-primary", colors.accent.primary);
1016
1016
  root.style.setProperty("--color-accent-secondary", colors.accent.secondary);
1017
1017
  root.style.setProperty("--color-accent-tertiary", colors.accent.tertiary);
1018
+ root.style.setProperty("--font-family-heading", typography.fontFamily.heading || typography.fontFamily.primary);
1018
1019
  root.style.setProperty("--font-family-primary", typography.fontFamily.primary);
1019
1020
  root.style.setProperty("--font-family-mono", typography.fontFamily.mono);
1020
1021
  root.style.setProperty("--spacing-xxs", spacing.xxs);
@@ -1072,8 +1073,8 @@ function ThemeProvider({
1072
1073
  }
1073
1074
  }`;
1074
1075
  return /* @__PURE__ */ jsxs(ThemeContext.Provider, { value, children: [
1075
- /* @__PURE__ */ jsx("style", { "data-zendir-scrollbar": "", children: scrollbarCSS }),
1076
- /* @__PURE__ */ jsx("style", { "data-zendir-reduced-motion": "", children: reducedMotionCSS }),
1076
+ /* @__PURE__ */ jsx("style", { "data-zendir-scrollbar": "", dangerouslySetInnerHTML: { __html: scrollbarCSS } }),
1077
+ /* @__PURE__ */ jsx("style", { "data-zendir-reduced-motion": "", dangerouslySetInnerHTML: { __html: reducedMotionCSS } }),
1077
1078
  children
1078
1079
  ] });
1079
1080
  }
@@ -1 +1 @@
1
- {"version":3,"file":"ThemeProvider.js","sources":["../../../src/react/theme/ThemeProvider.tsx"],"sourcesContent":["/**\n * @zendir/ui - Theme Provider\n * \n * Enterprise-grade theming system supporting Astro UX Design System and Zendir themes.\n * Full Tier 3 compliance with official Astro tokens (dark + light themes).\n * \n * Features:\n * - Multiple theme variants (Zen Hybrid default, astro, purple-hue, transparent)\n * - Light and dark modes\n * - Animation tokens with reduced-motion support\n * - Focus ring styles for accessibility\n * - CSS variable injection\n * - Local storage persistence\n */\n\nimport React, { createContext, useContext, useState, useEffect, useMemo, ReactNode } from 'react';\n\nfunction adjustHexBrightness(hex: string, factor: number): string {\n const normalized = hex.replace('#', '').trim();\n const expanded = normalized.length === 3\n ? normalized.split('').map(ch => ch + ch).join('')\n : normalized;\n\n if (!/^[0-9a-fA-F]{6}$/.test(expanded)) {\n return hex;\n }\n\n const clamp = (value: number) => Math.max(0, Math.min(255, Math.round(value)));\n const r = clamp(parseInt(expanded.slice(0, 2), 16) * factor);\n const g = clamp(parseInt(expanded.slice(2, 4), 16) * factor);\n const b = clamp(parseInt(expanded.slice(4, 6), 16) * factor);\n\n const toHex = (value: number) => value.toString(16).padStart(2, '0');\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport type ThemeVariant = 'astro' | 'purple-hue' | 'hybrid' | 'transparent' | 'transparent-bold' | 'transparent-minimal';\nexport type ThemeMode = 'light' | 'dark';\n\nexport interface ThemeColors {\n background: {\n base: string;\n surface: string;\n elevated: string;\n overlay: string;\n };\n border: {\n default: string;\n muted: string;\n focus: string;\n /** Transparent theme: thin faded top-to-bottom border (box-shadow, use with border: 'none') */\n fadedBoxShadow?: string;\n /** Card border style (computed from theme – solid or transparent faded). Use ...tokens.colors.border.cardStyle */\n cardStyle?: React.CSSProperties;\n /** Card border for dashed/empty state. Use ...tokens.colors.border.cardStyleDashed */\n cardStyleDashed?: React.CSSProperties;\n /** Card border using default color (e.g. NavBall, EclipseTimer). Use ...tokens.colors.border.cardStyleDefault */\n cardStyleDefault?: React.CSSProperties;\n };\n text: {\n primary: string;\n secondary: string;\n tertiary: string;\n /** Muted/placeholder text (alias for tertiary when not set) */\n muted?: string;\n inverse: string;\n };\n status: {\n normal: string;\n standby: string;\n caution: string;\n serious: string;\n critical: string;\n off: string;\n };\n semantic: {\n success: string;\n warning: string;\n error: string;\n info: string;\n };\n accent: {\n primary: string;\n secondary: string;\n tertiary: string;\n };\n interactive: {\n default: string;\n hover: string;\n active: string;\n disabled: string;\n /** Transparent theme: button/control bg (low opacity purple) when not hovered */\n transparentDefault?: string;\n /** Transparent theme: button/control bg on hover (higher opacity purple) */\n transparentHover?: string;\n /** Transparent theme: input field bg (semi-transparent purple tint) */\n transparentInputBg?: string;\n };\n}\n\nexport interface ThemeAnimation {\n /** Fast transitions (hover states) - 150ms */\n fast: string;\n /** Normal transitions (most interactions) - 250ms */\n normal: string;\n /** Slow transitions (page/mode changes) - 400ms */\n slow: string;\n /** Spring animation for playful interactions */\n spring: string;\n /** Easing function */\n easing: {\n default: string;\n in: string;\n out: string;\n inOut: string;\n };\n /** Duration values in milliseconds */\n duration: {\n instant: number;\n fast: number;\n normal: number;\n slow: number;\n };\n}\n\nexport interface ThemeFocus {\n /** Focus ring color */\n color: string;\n /** Focus ring width */\n width: string;\n /** Focus ring offset */\n offset: string;\n /** Full focus ring CSS */\n ring: string;\n /** Focus ring style object */\n style: React.CSSProperties;\n}\n\n/**\n * Astro UX Typography Style Token\n * Based on https://www.astrouxds.com/foundations/typography/\n */\nexport interface TypographyStyle {\n fontSize: string;\n fontWeight: number;\n letterSpacing: string;\n lineHeight: string;\n}\n\nexport interface ThemeTokens {\n colors: ThemeColors;\n spacing: {\n /** 2px — micro adjustments, decorative offsets */\n xxs: string;\n /** 4px — tight gaps, icon padding */\n xs: string;\n /** 8px — compact spacing, small gaps */\n sm: string;\n /** 12px — form fields, compact cards (between sm and md) */\n smd: string;\n /** 16px — default card padding, section gaps */\n md: string;\n /** 20px — slightly generous spacing */\n mdl: string;\n /** 24px — generous spacing, content area padding */\n lg: string;\n /** 32px — large section gaps */\n xl: string;\n /** 48px — extra large spacing */\n xxl: string;\n };\n borderRadius: {\n none: string;\n /** 1px — very subtle rounding */\n xs: string;\n /** 2px — small elements, badges, tooltips */\n sm: string;\n /** 4px — inputs, selects, standard controls */\n md: string;\n /** 8px — cards, containers */\n lg: string;\n /** 12px — prominent surfaces, modals */\n xl: string;\n /** 9999px — pills, fully rounded */\n full: string;\n };\n /** Standardised element heights for interactive controls */\n elementSize: {\n /** 28px — compact controls */\n sm: string;\n /** 36px — default controls */\n md: string;\n /** 44px — prominent controls, touch targets */\n lg: string;\n };\n typography: {\n fontFamily: {\n primary: string;\n mono: string;\n };\n // Astro UX Typography Tokens (rem-based)\n // https://www.astrouxds.com/foundations/typography/\n display: {\n 1: TypographyStyle;\n 2: TypographyStyle;\n };\n heading: {\n 1: TypographyStyle;\n '1Bold': TypographyStyle;\n 2: TypographyStyle;\n 3: TypographyStyle;\n 4: TypographyStyle;\n 5: TypographyStyle;\n 6: TypographyStyle;\n };\n body: {\n 1: TypographyStyle;\n '1Bold': TypographyStyle;\n 2: TypographyStyle;\n '2Bold': TypographyStyle;\n 3: TypographyStyle;\n '3Bold': TypographyStyle;\n };\n control: {\n 1: TypographyStyle;\n '1Bold': TypographyStyle;\n };\n // Legacy/convenience tokens (keeping for backward compatibility)\n fontSize: {\n micro: string; // 9px - very tight spaces\n xxs: string; // 10px - compact labels\n xs: string;\n sm: string;\n base: string;\n md: string;\n lg: string;\n xl: string;\n xxl: string;\n xxxl: string;\n };\n fontWeight: {\n light: number;\n normal: number;\n medium: number;\n semibold: number;\n bold: number;\n };\n lineHeight: {\n tight: string;\n normal: string;\n relaxed: string;\n };\n letterSpacing: {\n tight: string;\n normal: string;\n wide: string;\n };\n };\n shadows: {\n none: string;\n sm: string;\n md: string;\n lg: string;\n xl: string;\n glow: (color: string) => string;\n };\n animation: ThemeAnimation;\n focus: ThemeFocus;\n /** Semantic layout tokens for consistent spacing across cards, forms, and sections */\n layout: LayoutTokens;\n /** Semantic border tokens for consistent element styling (derived from theme colors) */\n borders: BorderTokens;\n}\n\n// ============================================================================\n// Layout Tokens Interface\n// Semantic spacing for cards, sections, forms, and nested surfaces.\n// These decouple layout intent from raw pixel values, enabling consistent\n// spacing across all consuming applications.\n// ============================================================================\n\nexport interface LayoutTokens {\n /** Card / panel container spacing */\n card: {\n /** Internal padding of card containers */\n padding: string;\n /** Gap between cards in grid layouts (desktop) */\n gap: string;\n /** Gap between cards in grid layouts (mobile / compact) */\n gapCompact: string;\n /** Card heading: icon size, title typography, gap — single system for all cards/charts */\n heading: {\n iconSize: number;\n iconSizeCompact: number;\n titleFontSize: string;\n /** Smaller title for chart headers (e.g. Power Trends) so they match card visual weight */\n titleFontSizeChart: string;\n titleFontWeight: number;\n gap: number;\n };\n };\n /** Section heading spacing (heading + divider + content) */\n section: {\n /** Padding below heading text, above the divider border */\n headerPaddingBottom: string;\n /** Margin below the divider border, before content */\n headerMarginBottom: string;\n /** Padding above the first content element after heading */\n contentPaddingTop: string;\n };\n /** Form and input field spacing */\n form: {\n /** Vertical gap between stacked form fields */\n fieldGap: string;\n /** Horizontal gap between side-by-side inline fields */\n inlineGap: string;\n /** Padding inside grouped / nested field containers */\n groupPadding: string;\n /** Gap between items within a field group */\n groupGap: string;\n /** Gap between label text and helper icons (e.g. tooltip) */\n labelGap: string;\n };\n /** Nested surface / panel spacing (e.g. grouped fields within a card) */\n surface: {\n /** Internal padding of nested surfaces */\n padding: string;\n /** Border radius of nested surfaces */\n borderRadius: string;\n /** Gap between items in compact nested surfaces */\n gap: string;\n };\n}\n\n// ============================================================================\n// Border Tokens Interface\n// Standardised border widths, element borders, focus rings, and dividers.\n// These are DERIVED from theme colors at runtime via computeBorderTokens().\n// ============================================================================\n\nexport interface BorderTokens {\n /** Border widths — standardised across all interactive elements */\n width: {\n /** Thin (1px) — inputs, cards, dividers, dropdowns */\n thin: string;\n /** Medium (1.5px) — secondary buttons, emphasised inputs */\n medium: string;\n /** Thick (2px) — checkboxes, accent borders, active tabs */\n thick: string;\n };\n /** Pre-computed input / control borders (width + style + color) */\n input: {\n /** Default resting state */\n default: string;\n /** Hover state (accent at 50% opacity) */\n hover: string;\n /** Focused state (full accent) */\n focus: string;\n /** Error / critical state */\n error: string;\n };\n /** Focus ring box-shadow values for interactive elements */\n focusRing: {\n /** Standard ring for inputs and selects */\n default: string;\n /** Ring for buttons (double-ring pattern) */\n button: string;\n /** Subtle ring for checkboxes, tabs, toggles */\n subtle: string;\n };\n /** Section divider border (headings, dialog headers/footers, tab bars) */\n divider: string;\n /** Dropdown / popover container border */\n dropdown: string;\n /** Separator line inside elements (unit separators, table rows) */\n separator: string;\n}\n\n/**\n * Derives border tokens from a theme's resolved colors.\n * Called once per theme change inside the ThemeProvider useMemo.\n */\nfunction computeBorderTokens(colors: ThemeColors): BorderTokens {\n const thin = '1px';\n const medium = '1.5px';\n const thick = '2px';\n const accent = colors.accent.primary;\n const muted = colors.border.muted;\n const critical = colors.status.critical;\n const bgBase = colors.background.base;\n\n return {\n width: { thin, medium, thick },\n input: {\n default: `${thin} solid ${muted}`,\n hover: `${thin} solid ${accent}80`,\n focus: `${thin} solid ${accent}`,\n error: `${thin} solid ${critical}`,\n },\n focusRing: {\n // WCAG 2.4.13: focus indicators ≥ 3:1 contrast — raised from 20%/30% to 50%/60%\n default: `0 0 0 3px ${accent}50, 0 0 20px ${accent}15`,\n button: `0 0 0 2px ${bgBase}, 0 0 0 4px ${accent}`,\n subtle: `0 0 0 2px ${accent}60`,\n },\n divider: `${thin} solid ${muted}`,\n dropdown: `${thin} solid ${accent}30`,\n separator: `${thin} solid ${muted}`,\n };\n}\n\n/**\n * Base theme type used for static theme definitions.\n * `borders` is omitted because it is derived from colors at runtime\n * inside the ThemeProvider useMemo (see computeBorderTokens).\n */\ntype ThemeTokensBase = Omit<ThemeTokens, 'borders'>;\n\n// ============================================================================\n// Animation Tokens (Shared)\n// ============================================================================\n\nconst animationTokens: ThemeAnimation = {\n fast: 'all 150ms cubic-bezier(0.4, 0, 0.2, 1)',\n normal: 'all 250ms cubic-bezier(0.4, 0, 0.2, 1)',\n slow: 'all 400ms cubic-bezier(0.4, 0, 0.2, 1)',\n spring: 'all 300ms cubic-bezier(0.34, 1.56, 0.64, 1)',\n easing: {\n default: 'cubic-bezier(0.4, 0, 0.2, 1)',\n in: 'ease-in',\n out: 'ease-out',\n inOut: 'ease-in-out',\n },\n duration: {\n instant: 0,\n fast: 150,\n normal: 250,\n slow: 400,\n },\n};\n\n// ============================================================================\n// Focus Tokens (Dark)\n// ============================================================================\n\nconst focusTokensDark: ThemeFocus = {\n color: '#4dacff',\n width: '2px',\n offset: '2px',\n ring: '0 0 0 2px #4dacff',\n style: {\n outline: '2px solid #4dacff',\n outlineOffset: '2px',\n },\n};\n\nconst focusTokensLight: ThemeFocus = {\n color: '#0066cc',\n width: '2px',\n offset: '2px',\n ring: '0 0 0 2px #0066cc',\n style: {\n outline: '2px solid #0066cc',\n outlineOffset: '2px',\n },\n};\n\n// ============================================================================\n// Shadow Tokens\n// ============================================================================\n\nconst shadowsDark = {\n none: 'none',\n sm: '0 1px 2px rgba(0, 0, 0, 0.3)',\n md: '0 4px 8px rgba(0, 0, 0, 0.4)',\n lg: '0 8px 16px rgba(0, 0, 0, 0.5)',\n xl: '0 16px 32px rgba(0, 0, 0, 0.6)',\n glow: (color: string) => `0 0 20px ${color}40, 0 0 40px ${color}20`,\n};\n\nconst shadowsLight = {\n none: 'none',\n sm: '0 1px 2px rgba(0, 0, 0, 0.1)',\n md: '0 4px 8px rgba(0, 0, 0, 0.15)',\n lg: '0 8px 16px rgba(0, 0, 0, 0.2)',\n xl: '0 16px 32px rgba(0, 0, 0, 0.25)',\n glow: (color: string) => `0 0 20px ${color}30, 0 0 40px ${color}15`,\n};\n\n// ============================================================================\n// Layout Tokens (Shared)\n// Semantic layout spacing based on 4px grid. Shared across all themes.\n// ============================================================================\n\nconst layoutTokens: LayoutTokens = {\n card: {\n padding: '16px', // 4 × 4px\n gap: '24px', // 6 × 4px — desktop grid gap (matches outer padding)\n gapCompact: '16px', // 4 × 4px — mobile grid gap\n heading: {\n iconSize: 18, // default card header icon (px) — matches ISS/Telemetry card header size\n iconSizeCompact: 16, // compact (e.g. chart inline header)\n titleFontSize: '1rem', // card titles (ISS, Telemetry, Mission) — reduced from 1.125rem\n titleFontSizeChart: '0.875rem', // chart titles (Power Trends) — slightly smaller\n titleFontWeight: 500,\n gap: 8, // gap between icon and title (px)\n },\n },\n section: {\n headerPaddingBottom: '8px', // 2 × 4px\n headerMarginBottom: '0px',\n contentPaddingTop: '8px', // 2 × 4px\n },\n form: {\n fieldGap: '12px', // 3 × 4px — between stacked fields\n inlineGap: '12px', // 3 × 4px — between side-by-side fields\n groupPadding: '12px', // 3 × 4px — inside grouped containers\n groupGap: '12px', // 3 × 4px — within group items\n labelGap: '3px', // label text ↔ tooltip icon\n },\n surface: {\n padding: '12px', // 3 × 4px\n borderRadius: '12px', // 3 × 4px\n gap: '8px', // 2 × 4px\n },\n};\n\n// ============================================================================\n// Astro UX Dark Theme\n// ============================================================================\n\nconst astroThemeDark: ThemeTokensBase = {\n colors: {\n background: {\n base: '#101923',\n surface: '#1b2d3e',\n elevated: '#243b53',\n overlay: 'rgba(16, 25, 35, 0.95)',\n },\n border: {\n default: '#2b659b',\n muted: '#172635',\n focus: '#4dacff',\n },\n text: {\n primary: '#ffffff',\n secondary: '#b7c5d3',\n tertiary: '#8fa4b7',\n muted: '#8fa4b7',\n inverse: '#1b2d3e',\n },\n status: {\n normal: '#56f000',\n standby: '#2dccff',\n caution: '#fce83a',\n serious: '#ffb302',\n critical: '#ff3838',\n off: '#a4abb6',\n },\n semantic: {\n success: '#56f000',\n warning: '#fce83a',\n error: '#ff3838',\n info: '#4dacff',\n },\n accent: {\n primary: '#4dacff',\n secondary: '#56f000',\n tertiary: '#a371f7',\n },\n interactive: {\n default: '#4dacff',\n hover: '#92cbff',\n active: '#0066cc',\n disabled: '#6b7280',\n },\n },\n spacing: {\n xxs: '2px',\n xs: '4px',\n sm: '8px',\n smd: '12px',\n md: '16px',\n mdl: '20px',\n lg: '24px',\n xl: '32px',\n xxl: '48px',\n },\n borderRadius: {\n none: '0',\n xs: '1px',\n sm: '2px',\n md: '4px',\n lg: '8px',\n xl: '12px',\n full: '9999px',\n },\n elementSize: {\n sm: '28px',\n md: '36px',\n lg: '44px',\n },\n typography: {\n /**\n * Font families per AstroUXDS specification\n * @see https://www.astrouxds.com/foundations/typography/\n */\n fontFamily: {\n /** Primary font: Roboto with comprehensive system fallbacks */\n primary: '\"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif',\n /** Monospace font: Roboto Mono for data/code with system fallbacks */\n mono: '\"Roboto Mono\", \"SF Mono\", \"Consolas\", \"Liberation Mono\", monospace',\n },\n // Astro UX Display Styles\n // https://www.astrouxds.com/foundations/typography/\n display: {\n 1: { fontSize: '3.75rem', fontWeight: 300, letterSpacing: '-0.5px', lineHeight: '4.375rem' },\n 2: { fontSize: '3rem', fontWeight: 400, letterSpacing: '0', lineHeight: '3.5rem' },\n },\n // Astro UX Heading Styles\n heading: {\n 1: { fontSize: '2.125rem', fontWeight: 400, letterSpacing: '0.25px', lineHeight: '2.5rem' },\n '1Bold': { fontSize: '2.125rem', fontWeight: 700, letterSpacing: '0.25px', lineHeight: '2rem' },\n 2: { fontSize: '1.5rem', fontWeight: 400, letterSpacing: '0', lineHeight: '1.75rem' },\n 3: { fontSize: '1.25rem', fontWeight: 500, letterSpacing: '0.15px', lineHeight: '1.5rem' },\n 4: { fontSize: '1.25rem', fontWeight: 300, letterSpacing: '0.15px', lineHeight: '1.5rem' },\n 5: { fontSize: '1.125rem', fontWeight: 400, letterSpacing: '0', lineHeight: '1.5rem' },\n 6: { fontSize: '1.125rem', fontWeight: 300, letterSpacing: '0', lineHeight: '1.5rem' },\n },\n // Astro UX Body Styles\n body: {\n 1: { fontSize: '1rem', fontWeight: 400, letterSpacing: '0.5px', lineHeight: '1.5rem' },\n '1Bold': { fontSize: '1rem', fontWeight: 700, letterSpacing: '0.5px', lineHeight: '1.5rem' },\n 2: { fontSize: '0.875rem', fontWeight: 400, letterSpacing: '0.5px', lineHeight: '1.25rem' },\n '2Bold': { fontSize: '0.875rem', fontWeight: 700, letterSpacing: '0.5px', lineHeight: '1.25rem' },\n 3: { fontSize: '0.75rem', fontWeight: 400, letterSpacing: '0', lineHeight: '1rem' },\n '3Bold': { fontSize: '0.75rem', fontWeight: 700, letterSpacing: '0', lineHeight: '1rem' },\n },\n // Astro UX Control Body Styles\n control: {\n 1: { fontSize: '1rem', fontWeight: 400, letterSpacing: '0.5px', lineHeight: '1.25rem' },\n '1Bold': { fontSize: '1rem', fontWeight: 700, letterSpacing: '0.5px', lineHeight: '1.25rem' },\n },\n // Legacy convenience tokens (rem-based for Astro compliance)\n // Note: Use Typography component for new code\n fontSize: {\n micro: '0.5625rem', // 9px - very tight spaces\n xxs: '0.625rem', // 10px - compact labels (xs in old system)\n xs: '0.625rem', // 10px - compact (kept for backward compatibility)\n sm: '0.75rem', // 12px (Body 3)\n base: '0.875rem', // 14px (Body 2)\n md: '0.875rem', // 14px (Body 2)\n lg: '1rem', // 16px (Body 1)\n xl: '1.25rem', // 20px (Heading 3/4)\n xxl: '1.5rem', // 24px (Heading 2)\n xxxl: '2.125rem', // 34px (Heading 1)\n },\n /**\n * Font weights per AstroUXDS specification\n * Only 300, 400, 500, 700 are officially supported\n * @see https://www.astrouxds.com/foundations/typography/\n */\n fontWeight: {\n light: 300,\n normal: 400,\n medium: 500,\n /** @deprecated Use medium (500) instead - Astro spec only supports 300, 400, 500, 700 */\n semibold: 500, // Changed from 600 to 500 for Astro compliance\n bold: 700,\n },\n lineHeight: {\n tight: '1.25rem',\n normal: '1.5rem',\n relaxed: '1.75rem',\n },\n letterSpacing: {\n tight: '-0.5px',\n normal: '0',\n wide: '0.5px',\n },\n },\n shadows: shadowsDark,\n animation: animationTokens,\n focus: focusTokensDark,\n layout: layoutTokens,\n};\n\n// ============================================================================\n// Astro UX Light Theme\n// ============================================================================\n\nconst astroThemeLight: ThemeTokensBase = {\n colors: {\n background: {\n base: '#eaeef4',\n surface: '#f5f8fc',\n elevated: '#ffffff',\n overlay: 'rgba(234, 238, 244, 0.95)',\n },\n border: {\n default: '#2b659b',\n muted: '#d1d5db',\n focus: '#0066cc',\n },\n text: {\n primary: '#1b2d3e',\n secondary: '#51667c',\n tertiary: '#556a7c', // WCAG AA: 4.81:1 on #eaeef4, 5.24:1 on #f5f8fc, 5.61:1 on #fff (was #8fa4b7 → 2.25:1 FAIL)\n muted: '#556a7c', // WCAG AA compliant (was #8fa4b7)\n inverse: '#ffffff',\n },\n status: {\n normal: '#56f000',\n standby: '#2dccff',\n caution: '#fce83a',\n serious: '#ffb302',\n critical: '#ff3838',\n off: '#a4abb6',\n },\n semantic: {\n success: '#56f000',\n warning: '#fce83a',\n error: '#ff3838',\n info: '#4dacff',\n },\n accent: {\n primary: '#0066cc',\n secondary: '#56f000',\n tertiary: '#7c3aed',\n },\n interactive: {\n default: '#0066cc',\n hover: '#0052a3',\n active: '#003d7a',\n disabled: '#a4abb6',\n },\n },\n spacing: astroThemeDark.spacing,\n borderRadius: astroThemeDark.borderRadius,\n elementSize: astroThemeDark.elementSize,\n typography: astroThemeDark.typography,\n shadows: shadowsLight,\n animation: animationTokens,\n focus: focusTokensLight,\n layout: layoutTokens,\n};\n\n// ============================================================================\n// Hybrid Theme (Zendir Background + Astro Status + Purple Accents)\n// Modern, award-winning design with Zendir purple personality\n// ============================================================================\n\nconst focusTokensPurpleHue: ThemeFocus = {\n color: '#8b5cf6',\n width: '2px',\n offset: '2px',\n ring: '0 0 0 2px #8b5cf6',\n style: {\n outline: '2px solid #8b5cf6',\n outlineOffset: '2px',\n },\n};\n\nconst hybridTheme: ThemeTokensBase = {\n colors: {\n background: {\n base: '#09090b',\n surface: 'rgba(24, 24, 27, 0.98)',\n elevated: 'rgba(39, 39, 42, 0.98)',\n overlay: 'rgba(0, 0, 0, 0.85)',\n },\n border: {\n default: 'rgba(139, 92, 246, 0.3)', // Purple tint\n muted: 'rgba(63, 63, 70, 0.5)',\n focus: '#8b5cf6', // Zendir purple\n },\n text: {\n primary: '#ffffff',\n secondary: '#a1a1aa',\n tertiary: '#8e8e96', // WCAG AA: 6.12:1 on #09090b, 5.45:1 on #18181b, 4.58:1 on #27272a (was #71717a → 4.07:1 FAIL)\n muted: '#8e8e96', // WCAG AA compliant (was #71717a)\n inverse: '#09090b',\n },\n // Astro UXD Status Colors (unchanged for compliance)\n status: {\n normal: '#56f000',\n standby: '#2dccff',\n caution: '#fce83a',\n serious: '#ffb302',\n critical: '#ff3838',\n off: '#a4abb6',\n },\n semantic: {\n success: '#56f000',\n warning: '#fce83a',\n error: '#ff3838',\n info: '#8b5cf6', // Purple for info\n },\n // Zendir Purple Accent Palette\n accent: {\n primary: '#8b5cf6', // Vibrant purple\n secondary: '#a78bfa', // Light purple\n tertiary: '#7c3aed', // Deep purple\n },\n interactive: {\n default: '#8b5cf6',\n hover: '#a78bfa',\n active: '#7c3aed',\n disabled: '#52525b',\n },\n },\n spacing: astroThemeDark.spacing,\n borderRadius: {\n none: '0',\n xs: '2px',\n sm: '4px',\n md: '6px',\n lg: '10px',\n xl: '14px',\n full: '9999px',\n },\n elementSize: astroThemeDark.elementSize,\n typography: astroThemeDark.typography,\n shadows: {\n ...shadowsDark,\n glow: (color: string) => `0 0 20px ${color}50, 0 0 40px ${color}25, 0 4px 12px ${color}20`,\n },\n animation: animationTokens,\n focus: focusTokensPurpleHue,\n layout: layoutTokens,\n};\n\n// ============================================================================\n// Purple-Hue Theme - Full Purple Personality\n// Award-winning dark theme with purple accents\n// ============================================================================\n\nconst purpleHueTheme: ThemeTokensBase = {\n colors: {\n background: {\n base: '#0a0a0f',\n surface: 'rgba(18, 18, 28, 0.98)',\n elevated: 'rgba(28, 28, 42, 0.98)',\n overlay: 'rgba(0, 0, 0, 0.9)',\n },\n border: {\n default: 'rgba(139, 92, 246, 0.25)',\n muted: 'rgba(55, 48, 82, 0.5)',\n focus: '#8b5cf6',\n },\n text: {\n primary: '#fafafa',\n secondary: '#a1a1aa',\n tertiary: '#8e8e96', // WCAG AA: 6.08:1 on #0a0a0f, 5.02:1 on elevated (was #71717a → 4.05:1 FAIL)\n muted: '#8e8e96', // WCAG AA compliant (was #71717a)\n inverse: '#0a0a0f',\n },\n // Astro UXD Status Colors (for compliance)\n status: {\n normal: '#56f000',\n standby: '#2dccff',\n caution: '#fce83a',\n serious: '#ffb302',\n critical: '#ff3838',\n off: '#a4abb6',\n },\n semantic: {\n success: '#56f000',\n warning: '#fce83a',\n error: '#ff3838',\n info: '#a78bfa',\n },\n // Zendir Purple Accent Palette\n accent: {\n primary: '#8b5cf6', // Vibrant purple\n secondary: '#a78bfa', // Light purple\n tertiary: '#7c3aed', // Deep purple\n },\n interactive: {\n default: '#8b5cf6',\n hover: '#a78bfa',\n active: '#7c3aed',\n disabled: '#52525b',\n },\n },\n spacing: astroThemeDark.spacing,\n borderRadius: {\n none: '0',\n xs: '2px',\n sm: '4px',\n md: '6px',\n lg: '10px',\n xl: '14px',\n full: '9999px',\n },\n elementSize: astroThemeDark.elementSize,\n // Same typography as hybrid (Astro UX font stack with full fallbacks) for consistent card font across themes\n typography: astroThemeDark.typography,\n shadows: {\n ...shadowsDark,\n glow: (color: string) => `0 0 25px ${color}60, 0 0 50px ${color}30, 0 4px 16px ${color}25`,\n },\n animation: animationTokens,\n focus: {\n ...focusTokensPurpleHue,\n },\n layout: layoutTokens,\n};\n\n// ============================================================================\n// Transparent Purple-Hue Theme - Glassmorphic Panels\n// Optimized for glass card overlays with transparent backgrounds\n// ============================================================================\n\nconst transparentTheme: ThemeTokensBase = {\n colors: {\n background: {\n // Highly transparent backgrounds for glass effect\n base: 'rgba(8, 12, 20, 0.95)',\n surface: 'rgba(15, 20, 35, 0.85)',\n elevated: 'rgba(25, 35, 55, 0.80)',\n overlay: 'rgba(0, 0, 0, 0.75)',\n },\n border: {\n // Purple accent borders (Zendir brand)\n default: 'rgba(139, 92, 246, 0.25)',\n muted: 'rgba(139, 92, 246, 0.15)',\n focus: '#8b5cf6',\n // Thin faded card border with purple hint\n fadedBoxShadow: 'inset 0 1px 0 rgba(139, 92, 246, 0.12), inset 0 -1px 0 rgba(0, 0, 0, 0.05), inset 1px 0 0 rgba(139, 92, 246, 0.06), inset -1px 0 0 rgba(139, 92, 246, 0.06)',\n },\n text: {\n primary: '#f0f4f8',\n secondary: '#94a3b8',\n tertiary: '#7b8da1', // WCAG AA: 5.71:1 on base, 5.34:1 on elevated (was #64748b → 3.66:1 FAIL)\n muted: '#7b8da1', // WCAG AA compliant (was #64748b)\n inverse: '#0f172a',\n },\n // Astro UXD Status Colors\n status: {\n normal: '#56f000',\n standby: '#2dccff',\n caution: '#fce83a',\n serious: '#ffb302',\n critical: '#ff3838',\n off: '#a4abb6',\n },\n semantic: {\n success: '#56f000',\n warning: '#fce83a',\n error: '#ff3838',\n info: '#8b5cf6',\n },\n // Purple accent (matching hybrid theme for consistency)\n accent: {\n primary: '#8b5cf6', // Vibrant purple\n secondary: '#a78bfa', // Light purple\n tertiary: '#7c3aed', // Deep purple\n },\n interactive: {\n default: '#8b5cf6', // Purple for interactive elements\n hover: '#a78bfa', // Light purple on hover\n active: '#7c3aed', // Deep purple on active\n disabled: '#475569',\n // Purple-hue transparent backgrounds for buttons/inputs (transparent + transparent-bold)\n transparentDefault: 'rgba(139, 92, 246, 0.12)',\n transparentHover: 'rgba(139, 92, 246, 0.32)',\n transparentInputBg: 'rgba(139, 92, 246, 0.08)',\n },\n },\n spacing: astroThemeDark.spacing,\n borderRadius: {\n none: '0',\n xs: '2px',\n sm: '4px',\n md: '8px',\n lg: '12px',\n xl: '16px',\n full: '9999px',\n },\n elementSize: astroThemeDark.elementSize,\n // Same typography as hybrid for consistent card font across themes\n typography: astroThemeDark.typography,\n shadows: {\n ...shadowsDark,\n // Enhanced glow shadows for glass effect\n glow: (color: string) => `0 0 30px ${color}50, 0 0 60px ${color}25, 0 4px 20px rgba(0,0,0,0.4)`,\n },\n animation: animationTokens,\n focus: {\n color: '#8b5cf6', // Purple focus ring\n width: '2px',\n offset: '2px',\n ring: '0 0 0 2px #8b5cf6',\n style: {\n outline: '2px solid #8b5cf6',\n outlineOffset: '2px',\n },\n },\n layout: layoutTokens,\n};\n\n// ============================================================================\n// Transparent Minimal Theme - Ultra-clean glassmorphic panels\n// Extremely subtle borders, minimal visual noise, clean dark surfaces\n// ============================================================================\n\nconst transparentMinimalTheme: ThemeTokensBase = {\n colors: {\n background: {\n // Same as transparent theme\n base: 'rgba(8, 12, 20, 0.95)',\n surface: 'rgba(15, 20, 35, 0.85)',\n elevated: 'rgba(25, 35, 55, 0.80)',\n overlay: 'rgba(0, 0, 0, 0.75)',\n },\n border: {\n // Accent-colored borders for minimal theme (Zendir purple)\n default: 'rgba(139, 92, 246, 0.25)',\n muted: 'rgba(139, 92, 246, 0.15)',\n focus: '#8b5cf6',\n // Subtle card border using accent color\n fadedBoxShadow: 'inset 0 1px 0 rgba(139, 92, 246, 0.1), inset 0 -1px 0 rgba(0, 0, 0, 0.1), inset 1px 0 0 rgba(139, 92, 246, 0.05), inset -1px 0 0 rgba(139, 92, 246, 0.05)',\n },\n text: {\n primary: '#f0f4f8',\n secondary: '#94a3b8',\n tertiary: '#7b8da1', // WCAG AA: 5.71:1 on base, 5.34:1 on elevated (was #64748b → 3.66:1 FAIL)\n muted: '#7b8da1', // WCAG AA compliant (was #64748b)\n inverse: '#0f172a',\n },\n // Astro UXD Status Colors\n status: {\n normal: '#56f000',\n standby: '#2dccff',\n caution: '#fce83a',\n serious: '#ffb302',\n critical: '#ff3838',\n off: '#a4abb6',\n },\n semantic: {\n success: '#56f000',\n warning: '#fce83a',\n error: '#ff3838',\n info: '#8b5cf6',\n },\n // Purple accent (matching transparent theme for consistency)\n accent: {\n primary: '#8b5cf6', // Vibrant purple\n secondary: '#a78bfa', // Light purple\n tertiary: '#7c3aed', // Deep purple\n },\n interactive: {\n default: '#8b5cf6', // Purple for interactive elements\n hover: '#a78bfa', // Light purple on hover\n active: '#7c3aed', // Deep purple on active\n disabled: '#475569',\n // Purple-hue transparent backgrounds for buttons/inputs (same as transparent theme)\n transparentDefault: 'rgba(139, 92, 246, 0.12)',\n transparentHover: 'rgba(139, 92, 246, 0.32)',\n transparentInputBg: 'rgba(139, 92, 246, 0.08)',\n },\n },\n spacing: astroThemeDark.spacing,\n borderRadius: {\n none: '0',\n xs: '2px',\n sm: '4px',\n md: '8px',\n lg: '12px',\n xl: '16px',\n full: '9999px',\n },\n elementSize: astroThemeDark.elementSize,\n // Same typography as hybrid for consistent card font across themes\n typography: astroThemeDark.typography,\n shadows: {\n ...shadowsDark,\n // Same glow as transparent theme\n glow: (color: string) => `0 0 30px ${color}50, 0 0 60px ${color}25, 0 4px 20px rgba(0,0,0,0.4)`,\n },\n animation: animationTokens,\n focus: {\n color: '#8b5cf6', // Purple focus ring\n width: '2px',\n offset: '2px',\n ring: '0 0 0 2px #8b5cf6',\n style: {\n outline: '2px solid #8b5cf6',\n outlineOffset: '2px',\n },\n },\n layout: layoutTokens,\n};\n\n// ============================================================================\n// Theme Context\n// ============================================================================\n\nexport interface ThemeContextValue {\n theme: ThemeVariant;\n mode: ThemeMode;\n tokens: ThemeTokens;\n prefersReducedMotion: boolean;\n /** Custom accent color override (null = use theme default) */\n accentColor: string | null;\n setTheme: (theme: ThemeVariant) => void;\n setMode: (mode: ThemeMode) => void;\n toggleMode: () => void;\n /** Override the accent color for the current theme */\n setAccentColor: (color: string | null) => void;\n}\n\nconst ThemeContext = createContext<ThemeContextValue | undefined>(undefined);\n\nexport interface ThemeProviderProps {\n children: ReactNode;\n /** Default theme variant */\n theme?: ThemeVariant;\n /** Default color mode */\n mode?: ThemeMode;\n /** Persist preferences to localStorage */\n persist?: boolean;\n}\n\n// ============================================================================\n// Scrollbar Styling System\n// ============================================================================\n// Generates global CSS for thin, elegant, theme-aware scrollbars.\n//\n// Features:\n// - Ultra-thin (6px) scrollbar tracks with soft border radius\n// - Accent-colored thumb with hover/active brightness shifts\n// - Semi-transparent track that blends into the surface\n// - Auto-hide behaviour on modern browsers (overlay mode)\n// - Firefox support via scrollbar-width / scrollbar-color\n// - WCAG 2.1 AA compliant: sufficient contrast, respects reduced-motion\n// - Smooth transitions (disabled when prefers-reduced-motion)\n// - Scoped .zendir-scroll utility class for individual containers\n// ============================================================================\n\n/**\n * Converts a hex color to an rgba string helper.\n * Accepts 3/6/8-char hex codes (#rgb, #rrggbb, #rrggbbaa).\n */\nfunction hexToRgba(hex: string, alpha: number): string {\n const clean = hex.replace('#', '');\n let r: number, g: number, b: number;\n if (clean.length === 3) {\n r = parseInt(clean[0] + clean[0], 16);\n g = parseInt(clean[1] + clean[1], 16);\n b = parseInt(clean[2] + clean[2], 16);\n } else {\n r = parseInt(clean.slice(0, 2), 16);\n g = parseInt(clean.slice(2, 4), 16);\n b = parseInt(clean.slice(4, 6), 16);\n }\n return `rgba(${r}, ${g}, ${b}, ${alpha})`;\n}\n\nfunction buildScrollbarCSS(tokens: ThemeTokens, mode: ThemeMode, reducedMotion: boolean): string {\n const accent = tokens.colors.accent.primary;\n const _surface = tokens.colors.background.surface; // eslint-disable-line @typescript-eslint/no-unused-vars -- reserved for future scrollbar track customisation\n const _base = tokens.colors.background.base; // eslint-disable-line @typescript-eslint/no-unused-vars -- reserved for future scrollbar corner styling\n const isLight = mode === 'light';\n\n // Thumb colors: accent-tinted, low opacity at rest, stronger on hover/active\n const thumbRest = isLight ? hexToRgba(accent, 0.28) : hexToRgba(accent, 0.35);\n const thumbHover = isLight ? hexToRgba(accent, 0.48) : hexToRgba(accent, 0.55);\n const thumbActive = isLight ? hexToRgba(accent, 0.64) : hexToRgba(accent, 0.72);\n\n // Track: nearly invisible surface blend\n const trackColor = isLight ? hexToRgba(accent, 0.04) : hexToRgba(accent, 0.06);\n const trackHover = isLight ? hexToRgba(accent, 0.08) : hexToRgba(accent, 0.10);\n\n const transition = reducedMotion ? 'none' : 'background-color 200ms ease, width 200ms ease, opacity 200ms ease';\n const thumbRadius = '9999px'; // pill shape\n\n // Firefox colors (two-value syntax: thumb track)\n const ffThumb = thumbRest;\n const ffTrack = trackColor;\n\n return `\n/* ═══════════════════════════════════════════════════════════════════════════\n Zendir Scrollbar System — Thin · Elegant · Theme-Connected\n ═══════════════════════════════════════════════════════════════════════════ */\n\n/* ── Firefox ────────────────────────────────────────────────────────────── */\n*,\n.zendir-scroll {\n scrollbar-width: thin;\n scrollbar-color: ${ffThumb} ${ffTrack};\n}\n\n/* ── Webkit / Blink (Chrome, Edge, Safari, Opera) ───────────────────────── */\n\n/* Global thin scrollbar */\n::-webkit-scrollbar {\n width: 6px;\n height: 6px;\n background: transparent;\n}\n\n/* Track — nearly invisible, subtle on hover */\n::-webkit-scrollbar-track {\n background: ${trackColor};\n border-radius: ${thumbRadius};\n margin: 2px;\n}\n::-webkit-scrollbar-track:hover {\n background: ${trackHover};\n}\n\n/* Thumb — accent-tinted pill */\n::-webkit-scrollbar-thumb {\n background: ${thumbRest};\n border-radius: ${thumbRadius};\n border: 1px solid transparent;\n background-clip: padding-box;\n transition: ${transition};\n min-height: 32px;\n}\n::-webkit-scrollbar-thumb:hover {\n background: ${thumbHover};\n border-color: transparent;\n background-clip: padding-box;\n}\n::-webkit-scrollbar-thumb:active {\n background: ${thumbActive};\n border-color: transparent;\n background-clip: padding-box;\n}\n\n/* Corner — where horizontal & vertical scrollbars meet */\n::-webkit-scrollbar-corner {\n background: transparent;\n}\n\n/* ── Utility class: zendir-scroll ────────────────────────────────────────\n Apply to individual containers for scoped thin scrollbar.\n Also enables overlay behaviour where supported.\n e.g. <div className=\"zendir-scroll\" style={{overflow:'auto'}}>…</div>\n ─────────────────────────────────────────────────────────────────────── */\n.zendir-scroll {\n overflow: auto;\n overflow: overlay; /* Chrome / Edge: auto-hide scrollbar */\n}\n.zendir-scroll::-webkit-scrollbar {\n width: 5px;\n height: 5px;\n}\n.zendir-scroll::-webkit-scrollbar-track {\n background: transparent;\n border-radius: ${thumbRadius};\n}\n.zendir-scroll::-webkit-scrollbar-thumb {\n background: ${thumbRest};\n border-radius: ${thumbRadius};\n transition: ${transition};\n}\n.zendir-scroll::-webkit-scrollbar-thumb:hover {\n background: ${thumbHover};\n}\n.zendir-scroll::-webkit-scrollbar-thumb:active {\n background: ${thumbActive};\n}\n\n/* ── Utility: zendir-scroll--hidden ─────────────────────────────────────\n Hides scrollbar visually but keeps scroll behaviour (accessible).\n Content remains scrollable via mouse wheel / touch / keyboard.\n ─────────────────────────────────────────────────────────────────────── */\n.zendir-scroll--hidden {\n overflow: auto;\n -ms-overflow-style: none;\n scrollbar-width: none;\n}\n.zendir-scroll--hidden::-webkit-scrollbar {\n display: none;\n}\n\n/* ── Focus-visible: keyboard users can still scroll with focus ─────────── */\n.zendir-scroll:focus-visible {\n outline: 2px solid ${accent};\n outline-offset: -2px;\n border-radius: ${tokens.borderRadius.md};\n}\n\n/* ── Reduced Motion: disable scrollbar transitions ─────────────────────── */\n@media (prefers-reduced-motion: reduce) {\n ::-webkit-scrollbar-thumb,\n .zendir-scroll::-webkit-scrollbar-thumb {\n transition: none !important;\n }\n}\n\n/* ── High Contrast Mode: ensure scrollbar is visible ───────────────────── */\n@media (forced-colors: active) {\n ::-webkit-scrollbar-thumb {\n background: ButtonText !important;\n }\n ::-webkit-scrollbar-track {\n background: Canvas !important;\n }\n}\n`.trim();\n}\n\n/**\n * useScrollbarStyles — returns inline React.CSSProperties for a\n * scrollable container that matches the current Zendir theme.\n *\n * Use when you need programmatic control rather than the\n * `zendir-scroll` CSS class.\n *\n * @example\n * ```tsx\n * const scrollStyle = useScrollbarStyles();\n * <div style={{ maxHeight: 400, ...scrollStyle }}>…</div>\n * ```\n */\nexport function useScrollbarStyles(): React.CSSProperties {\n const { tokens, mode } = useTheme();\n return useMemo((): React.CSSProperties => {\n const accent = tokens.colors.accent.primary;\n const isLight = mode === 'light';\n const thumbColor = isLight ? hexToRgba(accent, 0.28) : hexToRgba(accent, 0.35);\n const trackColor = isLight ? hexToRgba(accent, 0.04) : hexToRgba(accent, 0.06);\n return {\n // Firefox\n scrollbarWidth: 'thin' as const,\n scrollbarColor: `${thumbColor} ${trackColor}`,\n overflow: 'auto',\n };\n }, [tokens, mode]);\n}\n\n/**\n * ThemeProvider - Enterprise theme context provider\n * \n * Provides theme tokens, mode switching, and accessibility features\n * to all child components.\n * \n * @example\n * ```tsx\n * <ThemeProvider theme=\"hybrid\" mode=\"dark\"> // Zen (Hybrid) is the default\n * <App />\n * </ThemeProvider>\n * ```\n */\nexport function ThemeProvider({\n children,\n theme: defaultTheme = 'hybrid',\n mode: defaultMode = 'dark',\n persist = true,\n}: ThemeProviderProps): React.ReactElement {\n // Initialize theme from localStorage or defaults\n const [theme, setThemeState] = useState<ThemeVariant>(() => {\n if (persist && typeof window !== 'undefined') {\n const saved = localStorage.getItem('zendir-ui-theme');\n if (saved === 'astro' || saved === 'zendir' || saved === 'hybrid' || saved === 'transparent' || saved === 'transparent-bold' || saved === 'transparent-minimal') {\n return saved as ThemeVariant;\n }\n }\n return defaultTheme;\n });\n\n const [mode, setModeState] = useState<ThemeMode>(() => {\n if (persist && typeof window !== 'undefined') {\n const saved = localStorage.getItem('zendir-ui-mode');\n if (saved === 'light' || saved === 'dark') {\n return saved;\n }\n }\n return defaultMode;\n });\n\n // Detect reduced motion preference\n const [prefersReducedMotion, setPrefersReducedMotion] = useState(false);\n\n useEffect(() => {\n if (typeof window === 'undefined') return;\n\n const mediaQuery = window.matchMedia('(prefers-reduced-motion: reduce)');\n setPrefersReducedMotion(mediaQuery.matches);\n\n const handler = (e: MediaQueryListEvent) => setPrefersReducedMotion(e.matches);\n mediaQuery.addEventListener('change', handler);\n return () => mediaQuery.removeEventListener('change', handler);\n }, []);\n\n // Theme setters\n const setTheme = (newTheme: ThemeVariant) => {\n setThemeState(newTheme);\n if (persist && typeof window !== 'undefined') {\n localStorage.setItem('zendir-ui-theme', newTheme);\n }\n };\n\n const setMode = (newMode: ThemeMode) => {\n setModeState(newMode);\n if (persist && typeof window !== 'undefined') {\n localStorage.setItem('zendir-ui-mode', newMode);\n }\n };\n\n const toggleMode = () => {\n setMode(mode === 'dark' ? 'light' : 'dark');\n };\n\n // Accent color override\n const [accentColor, setAccentColorState] = useState<string | null>(() => {\n if (persist && typeof window !== 'undefined') {\n return localStorage.getItem('zendir-ui-accent') || null;\n }\n return null;\n });\n\n const setAccentColor = (color: string | null) => {\n setAccentColorState(color);\n if (persist && typeof window !== 'undefined') {\n if (color) {\n localStorage.setItem('zendir-ui-accent', color);\n } else {\n localStorage.removeItem('zendir-ui-accent');\n }\n }\n };\n\n // Get theme tokens (card border styles computed so all cards use theme-driven borders)\n const tokens = useMemo((): ThemeTokens => {\n // If light mode is selected, always use Astro Light theme (unified light mode)\n // regardless of the selected theme variant\n const base =\n mode === 'light'\n ? astroThemeLight\n : theme === 'astro'\n ? astroThemeDark\n : theme === 'hybrid'\n ? hybridTheme\n : theme === 'transparent' || theme === 'transparent-bold'\n ? transparentTheme\n : theme === 'transparent-minimal'\n ? transparentMinimalTheme\n : purpleHueTheme;\n const isTransparent =\n theme === 'transparent' || theme === 'transparent-bold' || theme === 'transparent-minimal';\n const isMinimal = theme === 'transparent-minimal';\n \n // For transparent-minimal: use visible accent-colored borders.\n // For other transparent themes: use subtle fadedBoxShadow.\n // Accent overrides are intentionally scoped to transparent variants only,\n // so switching to Astro/Hybrid/Purple-Hue restores each theme's native accent.\n const resolvedAccent = (isTransparent && accentColor)\n ? {\n primary: accentColor,\n secondary: adjustHexBrightness(accentColor, 1.2),\n tertiary: adjustHexBrightness(accentColor, 0.85),\n }\n : base.colors.accent;\n\n const accentPrimary = resolvedAccent.primary;\n const accentBorderMuted = `${accentPrimary}40`; // 25% opacity\n const accentBorderDefault = `${accentPrimary}66`; // 40% opacity\n const accentFadedBoxShadow = `inset 0 1px 0 ${hexToRgba(accentPrimary, 0.12)}, inset 0 -1px 0 rgba(0, 0, 0, 0.05), inset 1px 0 0 ${hexToRgba(accentPrimary, 0.06)}, inset -1px 0 0 ${hexToRgba(accentPrimary, 0.06)}`;\n \n const cardStyle = isMinimal\n ? { border: `1px solid ${accentBorderMuted}` }\n : isTransparent\n ? { border: 'none' as const, boxShadow: accentFadedBoxShadow }\n : { border: `1px solid ${base.colors.border.muted}` };\n const cardStyleDashed = isMinimal\n ? { border: `1px dashed ${accentBorderMuted}` }\n : isTransparent\n ? { border: 'none' as const, boxShadow: accentFadedBoxShadow }\n : { border: `1px dashed ${base.colors.border.muted}` };\n const cardStyleDefault = isMinimal\n ? { border: `1px solid ${accentBorderDefault}` }\n : isTransparent\n ? { border: 'none' as const, boxShadow: accentFadedBoxShadow }\n : { border: `1px solid ${base.colors.border.default}` };\n // Compute border tokens from the resolved theme colors\n const resolvedColors: ThemeColors = {\n ...base.colors,\n accent: resolvedAccent,\n border: {\n ...base.colors.border,\n cardStyle,\n cardStyleDashed,\n cardStyleDefault,\n },\n };\n\n return {\n ...base,\n colors: resolvedColors,\n borders: computeBorderTokens(resolvedColors),\n } as ThemeTokens;\n }, [theme, mode, accentColor]);\n\n // Apply CSS variables to document\n useEffect(() => {\n if (typeof document === 'undefined') return;\n\n const root = document.documentElement;\n const { colors, typography, spacing, borderRadius, animation, focus, shadows } = tokens;\n\n // Theme mode attribute\n root.setAttribute('data-theme', mode);\n root.setAttribute('data-variant', theme);\n\n // Background colors\n root.style.setProperty('--color-background-base', colors.background.base);\n root.style.setProperty('--color-background-surface', colors.background.surface);\n root.style.setProperty('--color-background-elevated', colors.background.elevated);\n root.style.setProperty('--color-background-overlay', colors.background.overlay);\n\n // Border colors\n root.style.setProperty('--color-border', colors.border.default);\n root.style.setProperty('--color-border-muted', colors.border.muted);\n root.style.setProperty('--color-border-focus', colors.border.focus);\n\n // Text colors\n root.style.setProperty('--color-text-primary', colors.text.primary);\n root.style.setProperty('--color-text-secondary', colors.text.secondary);\n root.style.setProperty('--color-text-tertiary', colors.text.tertiary);\n root.style.setProperty('--color-text-inverse', colors.text.inverse);\n\n // Status colors\n root.style.setProperty('--color-status-normal', colors.status.normal);\n root.style.setProperty('--color-status-standby', colors.status.standby);\n root.style.setProperty('--color-status-caution', colors.status.caution);\n root.style.setProperty('--color-status-serious', colors.status.serious);\n root.style.setProperty('--color-status-critical', colors.status.critical);\n root.style.setProperty('--color-status-off', colors.status.off);\n\n // Interactive colors\n root.style.setProperty('--color-interactive-default', colors.interactive.default);\n root.style.setProperty('--color-interactive-hover', colors.interactive.hover);\n root.style.setProperty('--color-interactive-active', colors.interactive.active);\n root.style.setProperty('--color-interactive-disabled', colors.interactive.disabled);\n\n // Accent colors\n root.style.setProperty('--color-accent-primary', colors.accent.primary);\n root.style.setProperty('--color-accent-secondary', colors.accent.secondary);\n root.style.setProperty('--color-accent-tertiary', colors.accent.tertiary);\n\n // Typography\n root.style.setProperty('--font-family-primary', typography.fontFamily.primary);\n root.style.setProperty('--font-family-mono', typography.fontFamily.mono);\n\n // Spacing (full scale so CSS and layout can pull from SDK)\n root.style.setProperty('--spacing-xxs', spacing.xxs);\n root.style.setProperty('--spacing-xs', spacing.xs);\n root.style.setProperty('--spacing-sm', spacing.sm);\n root.style.setProperty('--spacing-smd', spacing.smd);\n root.style.setProperty('--spacing-md', spacing.md);\n root.style.setProperty('--spacing-mdl', spacing.mdl);\n root.style.setProperty('--spacing-lg', spacing.lg);\n root.style.setProperty('--spacing-xl', spacing.xl);\n root.style.setProperty('--spacing-xxl', spacing.xxl);\n\n // Border radius\n root.style.setProperty('--radius-sm', borderRadius.sm);\n root.style.setProperty('--radius-md', borderRadius.md);\n root.style.setProperty('--radius-lg', borderRadius.lg);\n root.style.setProperty('--radius-xl', borderRadius.xl);\n\n // Animation (respect reduced motion)\n const motionMultiplier = prefersReducedMotion ? 0 : 1;\n root.style.setProperty('--animation-fast', prefersReducedMotion ? 'none' : animation.fast);\n root.style.setProperty('--animation-normal', prefersReducedMotion ? 'none' : animation.normal);\n root.style.setProperty('--animation-slow', prefersReducedMotion ? 'none' : animation.slow);\n root.style.setProperty('--duration-fast', `${animation.duration.fast * motionMultiplier}ms`);\n root.style.setProperty('--duration-normal', `${animation.duration.normal * motionMultiplier}ms`);\n root.style.setProperty('--duration-slow', `${animation.duration.slow * motionMultiplier}ms`);\n\n // Focus\n root.style.setProperty('--focus-ring-color', focus.color);\n root.style.setProperty('--focus-ring-width', focus.width);\n root.style.setProperty('--focus-ring-offset', focus.offset);\n\n // Shadows\n root.style.setProperty('--shadow-sm', shadows.sm);\n root.style.setProperty('--shadow-md', shadows.md);\n root.style.setProperty('--shadow-lg', shadows.lg);\n root.style.setProperty('--shadow-xl', shadows.xl);\n\n // Apply base styles to body\n document.body.style.backgroundColor = colors.background.base;\n document.body.style.color = colors.text.primary;\n document.body.style.fontFamily = typography.fontFamily.primary;\n }, [tokens, theme, mode, prefersReducedMotion]);\n\n // ──────────────────────────────────────────────────────────────────────────\n // Scrollbar Styles — thin, elegant, theme-connected, fully accessible\n // ──────────────────────────────────────────────────────────────────────────\n const scrollbarCSS = useMemo(() => buildScrollbarCSS(tokens, mode, prefersReducedMotion), [tokens, mode, prefersReducedMotion]);\n\n const value: ThemeContextValue = useMemo(\n () => ({\n theme,\n mode,\n tokens,\n prefersReducedMotion,\n accentColor,\n setTheme,\n setMode,\n toggleMode,\n setAccentColor,\n }),\n [theme, mode, tokens, prefersReducedMotion, accentColor]\n );\n\n // Global reduced-motion rule — ensures ALL animations and transitions across\n // every Zendir component respect the OS preference (WCAG 2.3.3).\n // Uses 0.01ms (not 0) so animation-end events still fire correctly.\n const reducedMotionCSS = `@media (prefers-reduced-motion: reduce) {\n *, *::before, *::after {\n animation-duration: 0.01ms !important;\n animation-iteration-count: 1 !important;\n transition-duration: 0.01ms !important;\n scroll-behavior: auto !important;\n }\n}`;\n\n return (\n <ThemeContext.Provider value={value}>\n <style data-zendir-scrollbar=\"\">{scrollbarCSS}</style>\n <style data-zendir-reduced-motion=\"\">{reducedMotionCSS}</style>\n {children}\n </ThemeContext.Provider>\n );\n}\n\n/**\n * useTheme - Access theme context\n * \n * @throws Error if used outside ThemeProvider\n * \n * @example\n * ```tsx\n * const { tokens, mode, toggleMode } = useTheme();\n * ```\n */\nexport function useTheme(): ThemeContextValue {\n const context = useContext(ThemeContext);\n if (!context) {\n throw new Error('useTheme must be used within a ThemeProvider');\n }\n return context;\n}\n\n/**\n * useThemeTokens - Access only theme tokens (for memoization)\n */\nexport function useThemeTokens(): ThemeTokens {\n return useTheme().tokens;\n}\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"ThemeProvider.js","sources":["../../../src/react/theme/ThemeProvider.tsx"],"sourcesContent":["/**\n * @zendir/ui - Theme Provider\n * \n * Enterprise-grade theming system supporting Astro UX Design System and Zendir themes.\n * Full Tier 3 compliance with official Astro tokens (dark + light themes).\n * \n * Features:\n * - Multiple theme variants (Zen Hybrid default, astro, purple-hue, transparent)\n * - Light and dark modes\n * - Animation tokens with reduced-motion support\n * - Focus ring styles for accessibility\n * - CSS variable injection\n * - Local storage persistence\n */\n\nimport React, { createContext, useContext, useState, useEffect, useMemo, ReactNode } from 'react';\n\nfunction adjustHexBrightness(hex: string, factor: number): string {\n const normalized = hex.replace('#', '').trim();\n const expanded = normalized.length === 3\n ? normalized.split('').map(ch => ch + ch).join('')\n : normalized;\n\n if (!/^[0-9a-fA-F]{6}$/.test(expanded)) {\n return hex;\n }\n\n const clamp = (value: number) => Math.max(0, Math.min(255, Math.round(value)));\n const r = clamp(parseInt(expanded.slice(0, 2), 16) * factor);\n const g = clamp(parseInt(expanded.slice(2, 4), 16) * factor);\n const b = clamp(parseInt(expanded.slice(4, 6), 16) * factor);\n\n const toHex = (value: number) => value.toString(16).padStart(2, '0');\n return `#${toHex(r)}${toHex(g)}${toHex(b)}`;\n}\n\nexport type ThemeVariant = 'astro' | 'purple-hue' | 'hybrid' | 'transparent' | 'transparent-bold' | 'transparent-minimal';\nexport type ThemeMode = 'light' | 'dark';\n\nexport interface ThemeColors {\n background: {\n base: string;\n surface: string;\n elevated: string;\n overlay: string;\n };\n border: {\n default: string;\n muted: string;\n focus: string;\n /** Transparent theme: thin faded top-to-bottom border (box-shadow, use with border: 'none') */\n fadedBoxShadow?: string;\n /** Card border style (computed from theme – solid or transparent faded). Use ...tokens.colors.border.cardStyle */\n cardStyle?: React.CSSProperties;\n /** Card border for dashed/empty state. Use ...tokens.colors.border.cardStyleDashed */\n cardStyleDashed?: React.CSSProperties;\n /** Card border using default color (e.g. NavBall, EclipseTimer). Use ...tokens.colors.border.cardStyleDefault */\n cardStyleDefault?: React.CSSProperties;\n };\n text: {\n primary: string;\n secondary: string;\n tertiary: string;\n /** Muted/placeholder text (alias for tertiary when not set) */\n muted?: string;\n inverse: string;\n };\n status: {\n normal: string;\n standby: string;\n caution: string;\n serious: string;\n critical: string;\n off: string;\n };\n semantic: {\n success: string;\n warning: string;\n error: string;\n info: string;\n };\n accent: {\n primary: string;\n secondary: string;\n tertiary: string;\n };\n interactive: {\n default: string;\n hover: string;\n active: string;\n disabled: string;\n /** Transparent theme: button/control bg (low opacity purple) when not hovered */\n transparentDefault?: string;\n /** Transparent theme: button/control bg on hover (higher opacity purple) */\n transparentHover?: string;\n /** Transparent theme: input field bg (semi-transparent purple tint) */\n transparentInputBg?: string;\n };\n}\n\nexport interface ThemeAnimation {\n /** Fast transitions (hover states) - 150ms */\n fast: string;\n /** Normal transitions (most interactions) - 250ms */\n normal: string;\n /** Slow transitions (page/mode changes) - 400ms */\n slow: string;\n /** Spring animation for playful interactions */\n spring: string;\n /** Easing function */\n easing: {\n default: string;\n in: string;\n out: string;\n inOut: string;\n };\n /** Duration values in milliseconds */\n duration: {\n instant: number;\n fast: number;\n normal: number;\n slow: number;\n };\n}\n\nexport interface ThemeFocus {\n /** Focus ring color */\n color: string;\n /** Focus ring width */\n width: string;\n /** Focus ring offset */\n offset: string;\n /** Full focus ring CSS */\n ring: string;\n /** Focus ring style object */\n style: React.CSSProperties;\n}\n\n/**\n * Astro UX Typography Style Token\n * Based on https://www.astrouxds.com/foundations/typography/\n */\nexport interface TypographyStyle {\n fontSize: string;\n fontWeight: number;\n letterSpacing: string;\n lineHeight: string;\n}\n\nexport interface ThemeTokens {\n colors: ThemeColors;\n spacing: {\n /** 2px — micro adjustments, decorative offsets */\n xxs: string;\n /** 4px — tight gaps, icon padding */\n xs: string;\n /** 8px — compact spacing, small gaps */\n sm: string;\n /** 12px — form fields, compact cards (between sm and md) */\n smd: string;\n /** 16px — default card padding, section gaps */\n md: string;\n /** 20px — slightly generous spacing */\n mdl: string;\n /** 24px — generous spacing, content area padding */\n lg: string;\n /** 32px — large section gaps */\n xl: string;\n /** 48px — extra large spacing */\n xxl: string;\n };\n borderRadius: {\n none: string;\n /** 1px — very subtle rounding */\n xs: string;\n /** 2px — small elements, badges, tooltips */\n sm: string;\n /** 4px — inputs, selects, standard controls */\n md: string;\n /** 8px — cards, containers */\n lg: string;\n /** 12px — prominent surfaces, modals */\n xl: string;\n /** 9999px — pills, fully rounded */\n full: string;\n };\n /** Standardised element heights for interactive controls */\n elementSize: {\n /** 28px — compact controls */\n sm: string;\n /** 36px — default controls */\n md: string;\n /** 44px — prominent controls, touch targets */\n lg: string;\n };\n typography: {\n fontFamily: {\n primary: string;\n mono: string;\n };\n // Astro UX Typography Tokens (rem-based)\n // https://www.astrouxds.com/foundations/typography/\n display: {\n 1: TypographyStyle;\n 2: TypographyStyle;\n };\n heading: {\n 1: TypographyStyle;\n '1Bold': TypographyStyle;\n 2: TypographyStyle;\n 3: TypographyStyle;\n 4: TypographyStyle;\n 5: TypographyStyle;\n 6: TypographyStyle;\n };\n body: {\n 1: TypographyStyle;\n '1Bold': TypographyStyle;\n 2: TypographyStyle;\n '2Bold': TypographyStyle;\n 3: TypographyStyle;\n '3Bold': TypographyStyle;\n };\n control: {\n 1: TypographyStyle;\n '1Bold': TypographyStyle;\n };\n // Legacy/convenience tokens (keeping for backward compatibility)\n fontSize: {\n micro: string; // 9px - very tight spaces\n xxs: string; // 10px - compact labels\n xs: string;\n sm: string;\n base: string;\n md: string;\n lg: string;\n xl: string;\n xxl: string;\n xxxl: string;\n };\n fontWeight: {\n light: number;\n normal: number;\n medium: number;\n semibold: number;\n bold: number;\n };\n lineHeight: {\n tight: string;\n normal: string;\n relaxed: string;\n };\n letterSpacing: {\n tight: string;\n normal: string;\n wide: string;\n };\n };\n shadows: {\n none: string;\n sm: string;\n md: string;\n lg: string;\n xl: string;\n glow: (color: string) => string;\n };\n animation: ThemeAnimation;\n focus: ThemeFocus;\n /** Semantic layout tokens for consistent spacing across cards, forms, and sections */\n layout: LayoutTokens;\n /** Semantic border tokens for consistent element styling (derived from theme colors) */\n borders: BorderTokens;\n}\n\n// ============================================================================\n// Layout Tokens Interface\n// Semantic spacing for cards, sections, forms, and nested surfaces.\n// These decouple layout intent from raw pixel values, enabling consistent\n// spacing across all consuming applications.\n// ============================================================================\n\nexport interface LayoutTokens {\n /** Card / panel container spacing */\n card: {\n /** Internal padding of card containers */\n padding: string;\n /** Gap between cards in grid layouts (desktop) */\n gap: string;\n /** Gap between cards in grid layouts (mobile / compact) */\n gapCompact: string;\n /** Card heading: icon size, title typography, gap — single system for all cards/charts */\n heading: {\n iconSize: number;\n iconSizeCompact: number;\n titleFontSize: string;\n /** Smaller title for chart headers (e.g. Power Trends) so they match card visual weight */\n titleFontSizeChart: string;\n titleFontWeight: number;\n gap: number;\n };\n };\n /** Section heading spacing (heading + divider + content) */\n section: {\n /** Padding below heading text, above the divider border */\n headerPaddingBottom: string;\n /** Margin below the divider border, before content */\n headerMarginBottom: string;\n /** Padding above the first content element after heading */\n contentPaddingTop: string;\n };\n /** Form and input field spacing */\n form: {\n /** Vertical gap between stacked form fields */\n fieldGap: string;\n /** Horizontal gap between side-by-side inline fields */\n inlineGap: string;\n /** Padding inside grouped / nested field containers */\n groupPadding: string;\n /** Gap between items within a field group */\n groupGap: string;\n /** Gap between label text and helper icons (e.g. tooltip) */\n labelGap: string;\n };\n /** Nested surface / panel spacing (e.g. grouped fields within a card) */\n surface: {\n /** Internal padding of nested surfaces */\n padding: string;\n /** Border radius of nested surfaces */\n borderRadius: string;\n /** Gap between items in compact nested surfaces */\n gap: string;\n };\n}\n\n// ============================================================================\n// Border Tokens Interface\n// Standardised border widths, element borders, focus rings, and dividers.\n// These are DERIVED from theme colors at runtime via computeBorderTokens().\n// ============================================================================\n\nexport interface BorderTokens {\n /** Border widths — standardised across all interactive elements */\n width: {\n /** Thin (1px) — inputs, cards, dividers, dropdowns */\n thin: string;\n /** Medium (1.5px) — secondary buttons, emphasised inputs */\n medium: string;\n /** Thick (2px) — checkboxes, accent borders, active tabs */\n thick: string;\n };\n /** Pre-computed input / control borders (width + style + color) */\n input: {\n /** Default resting state */\n default: string;\n /** Hover state (accent at 50% opacity) */\n hover: string;\n /** Focused state (full accent) */\n focus: string;\n /** Error / critical state */\n error: string;\n };\n /** Focus ring box-shadow values for interactive elements */\n focusRing: {\n /** Standard ring for inputs and selects */\n default: string;\n /** Ring for buttons (double-ring pattern) */\n button: string;\n /** Subtle ring for checkboxes, tabs, toggles */\n subtle: string;\n };\n /** Section divider border (headings, dialog headers/footers, tab bars) */\n divider: string;\n /** Dropdown / popover container border */\n dropdown: string;\n /** Separator line inside elements (unit separators, table rows) */\n separator: string;\n}\n\n/**\n * Derives border tokens from a theme's resolved colors.\n * Called once per theme change inside the ThemeProvider useMemo.\n */\nfunction computeBorderTokens(colors: ThemeColors): BorderTokens {\n const thin = '1px';\n const medium = '1.5px';\n const thick = '2px';\n const accent = colors.accent.primary;\n const muted = colors.border.muted;\n const critical = colors.status.critical;\n const bgBase = colors.background.base;\n\n return {\n width: { thin, medium, thick },\n input: {\n default: `${thin} solid ${muted}`,\n hover: `${thin} solid ${accent}80`,\n focus: `${thin} solid ${accent}`,\n error: `${thin} solid ${critical}`,\n },\n focusRing: {\n // WCAG 2.4.13: focus indicators ≥ 3:1 contrast — raised from 20%/30% to 50%/60%\n default: `0 0 0 3px ${accent}50, 0 0 20px ${accent}15`,\n button: `0 0 0 2px ${bgBase}, 0 0 0 4px ${accent}`,\n subtle: `0 0 0 2px ${accent}60`,\n },\n divider: `${thin} solid ${muted}`,\n dropdown: `${thin} solid ${accent}30`,\n separator: `${thin} solid ${muted}`,\n };\n}\n\n/**\n * Base theme type used for static theme definitions.\n * `borders` is omitted because it is derived from colors at runtime\n * inside the ThemeProvider useMemo (see computeBorderTokens).\n */\ntype ThemeTokensBase = Omit<ThemeTokens, 'borders'>;\n\n// ============================================================================\n// Animation Tokens (Shared)\n// ============================================================================\n\nconst animationTokens: ThemeAnimation = {\n fast: 'all 150ms cubic-bezier(0.4, 0, 0.2, 1)',\n normal: 'all 250ms cubic-bezier(0.4, 0, 0.2, 1)',\n slow: 'all 400ms cubic-bezier(0.4, 0, 0.2, 1)',\n spring: 'all 300ms cubic-bezier(0.34, 1.56, 0.64, 1)',\n easing: {\n default: 'cubic-bezier(0.4, 0, 0.2, 1)',\n in: 'ease-in',\n out: 'ease-out',\n inOut: 'ease-in-out',\n },\n duration: {\n instant: 0,\n fast: 150,\n normal: 250,\n slow: 400,\n },\n};\n\n// ============================================================================\n// Focus Tokens (Dark)\n// ============================================================================\n\nconst focusTokensDark: ThemeFocus = {\n color: '#4dacff',\n width: '2px',\n offset: '2px',\n ring: '0 0 0 2px #4dacff',\n style: {\n outline: '2px solid #4dacff',\n outlineOffset: '2px',\n },\n};\n\nconst focusTokensLight: ThemeFocus = {\n color: '#0066cc',\n width: '2px',\n offset: '2px',\n ring: '0 0 0 2px #0066cc',\n style: {\n outline: '2px solid #0066cc',\n outlineOffset: '2px',\n },\n};\n\n// ============================================================================\n// Shadow Tokens\n// ============================================================================\n\nconst shadowsDark = {\n none: 'none',\n sm: '0 1px 2px rgba(0, 0, 0, 0.3)',\n md: '0 4px 8px rgba(0, 0, 0, 0.4)',\n lg: '0 8px 16px rgba(0, 0, 0, 0.5)',\n xl: '0 16px 32px rgba(0, 0, 0, 0.6)',\n glow: (color: string) => `0 0 20px ${color}40, 0 0 40px ${color}20`,\n};\n\nconst shadowsLight = {\n none: 'none',\n sm: '0 1px 2px rgba(0, 0, 0, 0.1)',\n md: '0 4px 8px rgba(0, 0, 0, 0.15)',\n lg: '0 8px 16px rgba(0, 0, 0, 0.2)',\n xl: '0 16px 32px rgba(0, 0, 0, 0.25)',\n glow: (color: string) => `0 0 20px ${color}30, 0 0 40px ${color}15`,\n};\n\n// ============================================================================\n// Layout Tokens (Shared)\n// Semantic layout spacing based on 4px grid. Shared across all themes.\n// ============================================================================\n\nconst layoutTokens: LayoutTokens = {\n card: {\n padding: '16px', // 4 × 4px\n gap: '24px', // 6 × 4px — desktop grid gap (matches outer padding)\n gapCompact: '16px', // 4 × 4px — mobile grid gap\n heading: {\n iconSize: 18, // default card header icon (px) — matches ISS/Telemetry card header size\n iconSizeCompact: 16, // compact (e.g. chart inline header)\n titleFontSize: '1rem', // card titles (ISS, Telemetry, Mission) — reduced from 1.125rem\n titleFontSizeChart: '0.875rem', // chart titles (Power Trends) — slightly smaller\n titleFontWeight: 500,\n gap: 8, // gap between icon and title (px)\n },\n },\n section: {\n headerPaddingBottom: '8px', // 2 × 4px\n headerMarginBottom: '0px',\n contentPaddingTop: '8px', // 2 × 4px\n },\n form: {\n fieldGap: '12px', // 3 × 4px — between stacked fields\n inlineGap: '12px', // 3 × 4px — between side-by-side fields\n groupPadding: '12px', // 3 × 4px — inside grouped containers\n groupGap: '12px', // 3 × 4px — within group items\n labelGap: '3px', // label text ↔ tooltip icon\n },\n surface: {\n padding: '12px', // 3 × 4px\n borderRadius: '12px', // 3 × 4px\n gap: '8px', // 2 × 4px\n },\n};\n\n// ============================================================================\n// Astro UX Dark Theme\n// ============================================================================\n\nconst astroThemeDark: ThemeTokensBase = {\n colors: {\n background: {\n base: '#101923',\n surface: '#1b2d3e',\n elevated: '#243b53',\n overlay: 'rgba(16, 25, 35, 0.95)',\n },\n border: {\n default: '#2b659b',\n muted: '#172635',\n focus: '#4dacff',\n },\n text: {\n primary: '#ffffff',\n secondary: '#b7c5d3',\n tertiary: '#8fa4b7',\n muted: '#8fa4b7',\n inverse: '#1b2d3e',\n },\n status: {\n normal: '#56f000',\n standby: '#2dccff',\n caution: '#fce83a',\n serious: '#ffb302',\n critical: '#ff3838',\n off: '#a4abb6',\n },\n semantic: {\n success: '#56f000',\n warning: '#fce83a',\n error: '#ff3838',\n info: '#4dacff',\n },\n accent: {\n primary: '#4dacff',\n secondary: '#56f000',\n tertiary: '#a371f7',\n },\n interactive: {\n default: '#4dacff',\n hover: '#92cbff',\n active: '#0066cc',\n disabled: '#6b7280',\n },\n },\n spacing: {\n xxs: '2px',\n xs: '4px',\n sm: '8px',\n smd: '12px',\n md: '16px',\n mdl: '20px',\n lg: '24px',\n xl: '32px',\n xxl: '48px',\n },\n borderRadius: {\n none: '0',\n xs: '1px',\n sm: '2px',\n md: '4px',\n lg: '8px',\n xl: '12px',\n full: '9999px',\n },\n elementSize: {\n sm: '28px',\n md: '36px',\n lg: '44px',\n },\n typography: {\n /**\n * Font families per AstroUXDS specification\n * @see https://www.astrouxds.com/foundations/typography/\n */\n fontFamily: {\n /** Primary font: Roboto with comprehensive system fallbacks */\n primary: '\"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif',\n /** Monospace font: Roboto Mono for data/code with system fallbacks */\n mono: '\"Roboto Mono\", \"SF Mono\", \"Consolas\", \"Liberation Mono\", monospace',\n },\n // Astro UX Display Styles\n // https://www.astrouxds.com/foundations/typography/\n display: {\n 1: { fontSize: '3.75rem', fontWeight: 300, letterSpacing: '-0.5px', lineHeight: '4.375rem' },\n 2: { fontSize: '3rem', fontWeight: 400, letterSpacing: '0', lineHeight: '3.5rem' },\n },\n // Astro UX Heading Styles\n heading: {\n 1: { fontSize: '2.125rem', fontWeight: 400, letterSpacing: '0.25px', lineHeight: '2.5rem' },\n '1Bold': { fontSize: '2.125rem', fontWeight: 700, letterSpacing: '0.25px', lineHeight: '2rem' },\n 2: { fontSize: '1.5rem', fontWeight: 400, letterSpacing: '0', lineHeight: '1.75rem' },\n 3: { fontSize: '1.25rem', fontWeight: 500, letterSpacing: '0.15px', lineHeight: '1.5rem' },\n 4: { fontSize: '1.25rem', fontWeight: 300, letterSpacing: '0.15px', lineHeight: '1.5rem' },\n 5: { fontSize: '1.125rem', fontWeight: 400, letterSpacing: '0', lineHeight: '1.5rem' },\n 6: { fontSize: '1.125rem', fontWeight: 300, letterSpacing: '0', lineHeight: '1.5rem' },\n },\n // Astro UX Body Styles\n body: {\n 1: { fontSize: '1rem', fontWeight: 400, letterSpacing: '0.5px', lineHeight: '1.5rem' },\n '1Bold': { fontSize: '1rem', fontWeight: 700, letterSpacing: '0.5px', lineHeight: '1.5rem' },\n 2: { fontSize: '0.875rem', fontWeight: 400, letterSpacing: '0.5px', lineHeight: '1.25rem' },\n '2Bold': { fontSize: '0.875rem', fontWeight: 700, letterSpacing: '0.5px', lineHeight: '1.25rem' },\n 3: { fontSize: '0.75rem', fontWeight: 400, letterSpacing: '0', lineHeight: '1rem' },\n '3Bold': { fontSize: '0.75rem', fontWeight: 700, letterSpacing: '0', lineHeight: '1rem' },\n },\n // Astro UX Control Body Styles\n control: {\n 1: { fontSize: '1rem', fontWeight: 400, letterSpacing: '0.5px', lineHeight: '1.25rem' },\n '1Bold': { fontSize: '1rem', fontWeight: 700, letterSpacing: '0.5px', lineHeight: '1.25rem' },\n },\n // Legacy convenience tokens (rem-based for Astro compliance)\n // Note: Use Typography component for new code\n fontSize: {\n micro: '0.5625rem', // 9px - very tight spaces\n xxs: '0.625rem', // 10px - compact labels (xs in old system)\n xs: '0.625rem', // 10px - compact (kept for backward compatibility)\n sm: '0.75rem', // 12px (Body 3)\n base: '0.875rem', // 14px (Body 2)\n md: '0.875rem', // 14px (Body 2)\n lg: '1rem', // 16px (Body 1)\n xl: '1.25rem', // 20px (Heading 3/4)\n xxl: '1.5rem', // 24px (Heading 2)\n xxxl: '2.125rem', // 34px (Heading 1)\n },\n /**\n * Font weights per AstroUXDS specification\n * Only 300, 400, 500, 700 are officially supported\n * @see https://www.astrouxds.com/foundations/typography/\n */\n fontWeight: {\n light: 300,\n normal: 400,\n medium: 500,\n /** @deprecated Use medium (500) instead - Astro spec only supports 300, 400, 500, 700 */\n semibold: 500, // Changed from 600 to 500 for Astro compliance\n bold: 700,\n },\n lineHeight: {\n tight: '1.25rem',\n normal: '1.5rem',\n relaxed: '1.75rem',\n },\n letterSpacing: {\n tight: '-0.5px',\n normal: '0',\n wide: '0.5px',\n },\n },\n shadows: shadowsDark,\n animation: animationTokens,\n focus: focusTokensDark,\n layout: layoutTokens,\n};\n\n// ============================================================================\n// Astro UX Light Theme\n// ============================================================================\n\nconst astroThemeLight: ThemeTokensBase = {\n colors: {\n background: {\n base: '#eaeef4',\n surface: '#f5f8fc',\n elevated: '#ffffff',\n overlay: 'rgba(234, 238, 244, 0.95)',\n },\n border: {\n default: '#2b659b',\n muted: '#d1d5db',\n focus: '#0066cc',\n },\n text: {\n primary: '#1b2d3e',\n secondary: '#51667c',\n tertiary: '#556a7c', // WCAG AA: 4.81:1 on #eaeef4, 5.24:1 on #f5f8fc, 5.61:1 on #fff (was #8fa4b7 → 2.25:1 FAIL)\n muted: '#556a7c', // WCAG AA compliant (was #8fa4b7)\n inverse: '#ffffff',\n },\n status: {\n normal: '#56f000',\n standby: '#2dccff',\n caution: '#fce83a',\n serious: '#ffb302',\n critical: '#ff3838',\n off: '#a4abb6',\n },\n semantic: {\n success: '#56f000',\n warning: '#fce83a',\n error: '#ff3838',\n info: '#4dacff',\n },\n accent: {\n primary: '#0066cc',\n secondary: '#56f000',\n tertiary: '#7c3aed',\n },\n interactive: {\n default: '#0066cc',\n hover: '#0052a3',\n active: '#003d7a',\n disabled: '#a4abb6',\n },\n },\n spacing: astroThemeDark.spacing,\n borderRadius: astroThemeDark.borderRadius,\n elementSize: astroThemeDark.elementSize,\n typography: astroThemeDark.typography,\n shadows: shadowsLight,\n animation: animationTokens,\n focus: focusTokensLight,\n layout: layoutTokens,\n};\n\n// ============================================================================\n// Hybrid Theme (Zendir Background + Astro Status + Purple Accents)\n// Modern, award-winning design with Zendir purple personality\n// ============================================================================\n\nconst focusTokensPurpleHue: ThemeFocus = {\n color: '#8b5cf6',\n width: '2px',\n offset: '2px',\n ring: '0 0 0 2px #8b5cf6',\n style: {\n outline: '2px solid #8b5cf6',\n outlineOffset: '2px',\n },\n};\n\nconst hybridTheme: ThemeTokensBase = {\n colors: {\n background: {\n base: '#09090b',\n surface: 'rgba(24, 24, 27, 0.98)',\n elevated: 'rgba(39, 39, 42, 0.98)',\n overlay: 'rgba(0, 0, 0, 0.85)',\n },\n border: {\n default: 'rgba(139, 92, 246, 0.3)', // Purple tint\n muted: 'rgba(63, 63, 70, 0.5)',\n focus: '#8b5cf6', // Zendir purple\n },\n text: {\n primary: '#ffffff',\n secondary: '#a1a1aa',\n tertiary: '#8e8e96', // WCAG AA: 6.12:1 on #09090b, 5.45:1 on #18181b, 4.58:1 on #27272a (was #71717a → 4.07:1 FAIL)\n muted: '#8e8e96', // WCAG AA compliant (was #71717a)\n inverse: '#09090b',\n },\n // Astro UXD Status Colors (unchanged for compliance)\n status: {\n normal: '#56f000',\n standby: '#2dccff',\n caution: '#fce83a',\n serious: '#ffb302',\n critical: '#ff3838',\n off: '#a4abb6',\n },\n semantic: {\n success: '#56f000',\n warning: '#fce83a',\n error: '#ff3838',\n info: '#8b5cf6', // Purple for info\n },\n // Zendir Purple Accent Palette\n accent: {\n primary: '#8b5cf6', // Vibrant purple\n secondary: '#a78bfa', // Light purple\n tertiary: '#7c3aed', // Deep purple\n },\n interactive: {\n default: '#8b5cf6',\n hover: '#a78bfa',\n active: '#7c3aed',\n disabled: '#52525b',\n },\n },\n spacing: astroThemeDark.spacing,\n borderRadius: {\n none: '0',\n xs: '2px',\n sm: '4px',\n md: '6px',\n lg: '10px',\n xl: '14px',\n full: '9999px',\n },\n elementSize: astroThemeDark.elementSize,\n typography: astroThemeDark.typography,\n shadows: {\n ...shadowsDark,\n glow: (color: string) => `0 0 20px ${color}50, 0 0 40px ${color}25, 0 4px 12px ${color}20`,\n },\n animation: animationTokens,\n focus: focusTokensPurpleHue,\n layout: layoutTokens,\n};\n\n// ============================================================================\n// Purple-Hue Theme - Full Purple Personality\n// Award-winning dark theme with purple accents\n// ============================================================================\n\nconst purpleHueTheme: ThemeTokensBase = {\n colors: {\n background: {\n base: '#0a0a0f',\n surface: 'rgba(18, 18, 28, 0.98)',\n elevated: 'rgba(28, 28, 42, 0.98)',\n overlay: 'rgba(0, 0, 0, 0.9)',\n },\n border: {\n default: 'rgba(139, 92, 246, 0.25)',\n muted: 'rgba(55, 48, 82, 0.5)',\n focus: '#8b5cf6',\n },\n text: {\n primary: '#fafafa',\n secondary: '#a1a1aa',\n tertiary: '#8e8e96', // WCAG AA: 6.08:1 on #0a0a0f, 5.02:1 on elevated (was #71717a → 4.05:1 FAIL)\n muted: '#8e8e96', // WCAG AA compliant (was #71717a)\n inverse: '#0a0a0f',\n },\n // Astro UXD Status Colors (for compliance)\n status: {\n normal: '#56f000',\n standby: '#2dccff',\n caution: '#fce83a',\n serious: '#ffb302',\n critical: '#ff3838',\n off: '#a4abb6',\n },\n semantic: {\n success: '#56f000',\n warning: '#fce83a',\n error: '#ff3838',\n info: '#a78bfa',\n },\n // Zendir Purple Accent Palette\n accent: {\n primary: '#8b5cf6', // Vibrant purple\n secondary: '#a78bfa', // Light purple\n tertiary: '#7c3aed', // Deep purple\n },\n interactive: {\n default: '#8b5cf6',\n hover: '#a78bfa',\n active: '#7c3aed',\n disabled: '#52525b',\n },\n },\n spacing: astroThemeDark.spacing,\n borderRadius: {\n none: '0',\n xs: '2px',\n sm: '4px',\n md: '6px',\n lg: '10px',\n xl: '14px',\n full: '9999px',\n },\n elementSize: astroThemeDark.elementSize,\n // Same typography as hybrid (Astro UX font stack with full fallbacks) for consistent card font across themes\n typography: astroThemeDark.typography,\n shadows: {\n ...shadowsDark,\n glow: (color: string) => `0 0 25px ${color}60, 0 0 50px ${color}30, 0 4px 16px ${color}25`,\n },\n animation: animationTokens,\n focus: {\n ...focusTokensPurpleHue,\n },\n layout: layoutTokens,\n};\n\n// ============================================================================\n// Transparent Purple-Hue Theme - Glassmorphic Panels\n// Optimized for glass card overlays with transparent backgrounds\n// ============================================================================\n\nconst transparentTheme: ThemeTokensBase = {\n colors: {\n background: {\n // Highly transparent backgrounds for glass effect\n base: 'rgba(8, 12, 20, 0.95)',\n surface: 'rgba(15, 20, 35, 0.85)',\n elevated: 'rgba(25, 35, 55, 0.80)',\n overlay: 'rgba(0, 0, 0, 0.75)',\n },\n border: {\n // Purple accent borders (Zendir brand)\n default: 'rgba(139, 92, 246, 0.25)',\n muted: 'rgba(139, 92, 246, 0.15)',\n focus: '#8b5cf6',\n // Thin faded card border with purple hint\n fadedBoxShadow: 'inset 0 1px 0 rgba(139, 92, 246, 0.12), inset 0 -1px 0 rgba(0, 0, 0, 0.05), inset 1px 0 0 rgba(139, 92, 246, 0.06), inset -1px 0 0 rgba(139, 92, 246, 0.06)',\n },\n text: {\n primary: '#f0f4f8',\n secondary: '#94a3b8',\n tertiary: '#7b8da1', // WCAG AA: 5.71:1 on base, 5.34:1 on elevated (was #64748b → 3.66:1 FAIL)\n muted: '#7b8da1', // WCAG AA compliant (was #64748b)\n inverse: '#0f172a',\n },\n // Astro UXD Status Colors\n status: {\n normal: '#56f000',\n standby: '#2dccff',\n caution: '#fce83a',\n serious: '#ffb302',\n critical: '#ff3838',\n off: '#a4abb6',\n },\n semantic: {\n success: '#56f000',\n warning: '#fce83a',\n error: '#ff3838',\n info: '#8b5cf6',\n },\n // Purple accent (matching hybrid theme for consistency)\n accent: {\n primary: '#8b5cf6', // Vibrant purple\n secondary: '#a78bfa', // Light purple\n tertiary: '#7c3aed', // Deep purple\n },\n interactive: {\n default: '#8b5cf6', // Purple for interactive elements\n hover: '#a78bfa', // Light purple on hover\n active: '#7c3aed', // Deep purple on active\n disabled: '#475569',\n // Purple-hue transparent backgrounds for buttons/inputs (transparent + transparent-bold)\n transparentDefault: 'rgba(139, 92, 246, 0.12)',\n transparentHover: 'rgba(139, 92, 246, 0.32)',\n transparentInputBg: 'rgba(139, 92, 246, 0.08)',\n },\n },\n spacing: astroThemeDark.spacing,\n borderRadius: {\n none: '0',\n xs: '2px',\n sm: '4px',\n md: '8px',\n lg: '12px',\n xl: '16px',\n full: '9999px',\n },\n elementSize: astroThemeDark.elementSize,\n // Same typography as hybrid for consistent card font across themes\n typography: astroThemeDark.typography,\n shadows: {\n ...shadowsDark,\n // Enhanced glow shadows for glass effect\n glow: (color: string) => `0 0 30px ${color}50, 0 0 60px ${color}25, 0 4px 20px rgba(0,0,0,0.4)`,\n },\n animation: animationTokens,\n focus: {\n color: '#8b5cf6', // Purple focus ring\n width: '2px',\n offset: '2px',\n ring: '0 0 0 2px #8b5cf6',\n style: {\n outline: '2px solid #8b5cf6',\n outlineOffset: '2px',\n },\n },\n layout: layoutTokens,\n};\n\n// ============================================================================\n// Transparent Minimal Theme - Ultra-clean glassmorphic panels\n// Extremely subtle borders, minimal visual noise, clean dark surfaces\n// ============================================================================\n\nconst transparentMinimalTheme: ThemeTokensBase = {\n colors: {\n background: {\n // Same as transparent theme\n base: 'rgba(8, 12, 20, 0.95)',\n surface: 'rgba(15, 20, 35, 0.85)',\n elevated: 'rgba(25, 35, 55, 0.80)',\n overlay: 'rgba(0, 0, 0, 0.75)',\n },\n border: {\n // Accent-colored borders for minimal theme (Zendir purple)\n default: 'rgba(139, 92, 246, 0.25)',\n muted: 'rgba(139, 92, 246, 0.15)',\n focus: '#8b5cf6',\n // Subtle card border using accent color\n fadedBoxShadow: 'inset 0 1px 0 rgba(139, 92, 246, 0.1), inset 0 -1px 0 rgba(0, 0, 0, 0.1), inset 1px 0 0 rgba(139, 92, 246, 0.05), inset -1px 0 0 rgba(139, 92, 246, 0.05)',\n },\n text: {\n primary: '#f0f4f8',\n secondary: '#94a3b8',\n tertiary: '#7b8da1', // WCAG AA: 5.71:1 on base, 5.34:1 on elevated (was #64748b → 3.66:1 FAIL)\n muted: '#7b8da1', // WCAG AA compliant (was #64748b)\n inverse: '#0f172a',\n },\n // Astro UXD Status Colors\n status: {\n normal: '#56f000',\n standby: '#2dccff',\n caution: '#fce83a',\n serious: '#ffb302',\n critical: '#ff3838',\n off: '#a4abb6',\n },\n semantic: {\n success: '#56f000',\n warning: '#fce83a',\n error: '#ff3838',\n info: '#8b5cf6',\n },\n // Purple accent (matching transparent theme for consistency)\n accent: {\n primary: '#8b5cf6', // Vibrant purple\n secondary: '#a78bfa', // Light purple\n tertiary: '#7c3aed', // Deep purple\n },\n interactive: {\n default: '#8b5cf6', // Purple for interactive elements\n hover: '#a78bfa', // Light purple on hover\n active: '#7c3aed', // Deep purple on active\n disabled: '#475569',\n // Purple-hue transparent backgrounds for buttons/inputs (same as transparent theme)\n transparentDefault: 'rgba(139, 92, 246, 0.12)',\n transparentHover: 'rgba(139, 92, 246, 0.32)',\n transparentInputBg: 'rgba(139, 92, 246, 0.08)',\n },\n },\n spacing: astroThemeDark.spacing,\n borderRadius: {\n none: '0',\n xs: '2px',\n sm: '4px',\n md: '8px',\n lg: '12px',\n xl: '16px',\n full: '9999px',\n },\n elementSize: astroThemeDark.elementSize,\n // Same typography as hybrid for consistent card font across themes\n typography: astroThemeDark.typography,\n shadows: {\n ...shadowsDark,\n // Same glow as transparent theme\n glow: (color: string) => `0 0 30px ${color}50, 0 0 60px ${color}25, 0 4px 20px rgba(0,0,0,0.4)`,\n },\n animation: animationTokens,\n focus: {\n color: '#8b5cf6', // Purple focus ring\n width: '2px',\n offset: '2px',\n ring: '0 0 0 2px #8b5cf6',\n style: {\n outline: '2px solid #8b5cf6',\n outlineOffset: '2px',\n },\n },\n layout: layoutTokens,\n};\n\n// ============================================================================\n// Theme Context\n// ============================================================================\n\nexport interface ThemeContextValue {\n theme: ThemeVariant;\n mode: ThemeMode;\n tokens: ThemeTokens;\n prefersReducedMotion: boolean;\n /** Custom accent color override (null = use theme default) */\n accentColor: string | null;\n setTheme: (theme: ThemeVariant) => void;\n setMode: (mode: ThemeMode) => void;\n toggleMode: () => void;\n /** Override the accent color for the current theme */\n setAccentColor: (color: string | null) => void;\n}\n\nconst ThemeContext = createContext<ThemeContextValue | undefined>(undefined);\n\nexport interface ThemeProviderProps {\n children: ReactNode;\n /** Default theme variant */\n theme?: ThemeVariant;\n /** Default color mode */\n mode?: ThemeMode;\n /** Persist preferences to localStorage */\n persist?: boolean;\n}\n\n// ============================================================================\n// Scrollbar Styling System\n// ============================================================================\n// Generates global CSS for thin, elegant, theme-aware scrollbars.\n//\n// Features:\n// - Ultra-thin (6px) scrollbar tracks with soft border radius\n// - Accent-colored thumb with hover/active brightness shifts\n// - Semi-transparent track that blends into the surface\n// - Auto-hide behaviour on modern browsers (overlay mode)\n// - Firefox support via scrollbar-width / scrollbar-color\n// - WCAG 2.1 AA compliant: sufficient contrast, respects reduced-motion\n// - Smooth transitions (disabled when prefers-reduced-motion)\n// - Scoped .zendir-scroll utility class for individual containers\n// ============================================================================\n\n/**\n * Converts a hex color to an rgba string helper.\n * Accepts 3/6/8-char hex codes (#rgb, #rrggbb, #rrggbbaa).\n */\nfunction hexToRgba(hex: string, alpha: number): string {\n const clean = hex.replace('#', '');\n let r: number, g: number, b: number;\n if (clean.length === 3) {\n r = parseInt(clean[0] + clean[0], 16);\n g = parseInt(clean[1] + clean[1], 16);\n b = parseInt(clean[2] + clean[2], 16);\n } else {\n r = parseInt(clean.slice(0, 2), 16);\n g = parseInt(clean.slice(2, 4), 16);\n b = parseInt(clean.slice(4, 6), 16);\n }\n return `rgba(${r}, ${g}, ${b}, ${alpha})`;\n}\n\nfunction buildScrollbarCSS(tokens: ThemeTokens, mode: ThemeMode, reducedMotion: boolean): string {\n const accent = tokens.colors.accent.primary;\n const _surface = tokens.colors.background.surface; // eslint-disable-line @typescript-eslint/no-unused-vars -- reserved for future scrollbar track customisation\n const _base = tokens.colors.background.base; // eslint-disable-line @typescript-eslint/no-unused-vars -- reserved for future scrollbar corner styling\n const isLight = mode === 'light';\n\n // Thumb colors: accent-tinted, low opacity at rest, stronger on hover/active\n const thumbRest = isLight ? hexToRgba(accent, 0.28) : hexToRgba(accent, 0.35);\n const thumbHover = isLight ? hexToRgba(accent, 0.48) : hexToRgba(accent, 0.55);\n const thumbActive = isLight ? hexToRgba(accent, 0.64) : hexToRgba(accent, 0.72);\n\n // Track: nearly invisible surface blend\n const trackColor = isLight ? hexToRgba(accent, 0.04) : hexToRgba(accent, 0.06);\n const trackHover = isLight ? hexToRgba(accent, 0.08) : hexToRgba(accent, 0.10);\n\n const transition = reducedMotion ? 'none' : 'background-color 200ms ease, width 200ms ease, opacity 200ms ease';\n const thumbRadius = '9999px'; // pill shape\n\n // Firefox colors (two-value syntax: thumb track)\n const ffThumb = thumbRest;\n const ffTrack = trackColor;\n\n return `\n/* ═══════════════════════════════════════════════════════════════════════════\n Zendir Scrollbar System — Thin · Elegant · Theme-Connected\n ═══════════════════════════════════════════════════════════════════════════ */\n\n/* ── Firefox ────────────────────────────────────────────────────────────── */\n*,\n.zendir-scroll {\n scrollbar-width: thin;\n scrollbar-color: ${ffThumb} ${ffTrack};\n}\n\n/* ── Webkit / Blink (Chrome, Edge, Safari, Opera) ───────────────────────── */\n\n/* Global thin scrollbar */\n::-webkit-scrollbar {\n width: 6px;\n height: 6px;\n background: transparent;\n}\n\n/* Track — nearly invisible, subtle on hover */\n::-webkit-scrollbar-track {\n background: ${trackColor};\n border-radius: ${thumbRadius};\n margin: 2px;\n}\n::-webkit-scrollbar-track:hover {\n background: ${trackHover};\n}\n\n/* Thumb — accent-tinted pill */\n::-webkit-scrollbar-thumb {\n background: ${thumbRest};\n border-radius: ${thumbRadius};\n border: 1px solid transparent;\n background-clip: padding-box;\n transition: ${transition};\n min-height: 32px;\n}\n::-webkit-scrollbar-thumb:hover {\n background: ${thumbHover};\n border-color: transparent;\n background-clip: padding-box;\n}\n::-webkit-scrollbar-thumb:active {\n background: ${thumbActive};\n border-color: transparent;\n background-clip: padding-box;\n}\n\n/* Corner — where horizontal & vertical scrollbars meet */\n::-webkit-scrollbar-corner {\n background: transparent;\n}\n\n/* ── Utility class: zendir-scroll ────────────────────────────────────────\n Apply to individual containers for scoped thin scrollbar.\n Also enables overlay behaviour where supported.\n e.g. <div className=\"zendir-scroll\" style={{overflow:'auto'}}>…</div>\n ─────────────────────────────────────────────────────────────────────── */\n.zendir-scroll {\n overflow: auto;\n overflow: overlay; /* Chrome / Edge: auto-hide scrollbar */\n}\n.zendir-scroll::-webkit-scrollbar {\n width: 5px;\n height: 5px;\n}\n.zendir-scroll::-webkit-scrollbar-track {\n background: transparent;\n border-radius: ${thumbRadius};\n}\n.zendir-scroll::-webkit-scrollbar-thumb {\n background: ${thumbRest};\n border-radius: ${thumbRadius};\n transition: ${transition};\n}\n.zendir-scroll::-webkit-scrollbar-thumb:hover {\n background: ${thumbHover};\n}\n.zendir-scroll::-webkit-scrollbar-thumb:active {\n background: ${thumbActive};\n}\n\n/* ── Utility: zendir-scroll--hidden ─────────────────────────────────────\n Hides scrollbar visually but keeps scroll behaviour (accessible).\n Content remains scrollable via mouse wheel / touch / keyboard.\n ─────────────────────────────────────────────────────────────────────── */\n.zendir-scroll--hidden {\n overflow: auto;\n -ms-overflow-style: none;\n scrollbar-width: none;\n}\n.zendir-scroll--hidden::-webkit-scrollbar {\n display: none;\n}\n\n/* ── Focus-visible: keyboard users can still scroll with focus ─────────── */\n.zendir-scroll:focus-visible {\n outline: 2px solid ${accent};\n outline-offset: -2px;\n border-radius: ${tokens.borderRadius.md};\n}\n\n/* ── Reduced Motion: disable scrollbar transitions ─────────────────────── */\n@media (prefers-reduced-motion: reduce) {\n ::-webkit-scrollbar-thumb,\n .zendir-scroll::-webkit-scrollbar-thumb {\n transition: none !important;\n }\n}\n\n/* ── High Contrast Mode: ensure scrollbar is visible ───────────────────── */\n@media (forced-colors: active) {\n ::-webkit-scrollbar-thumb {\n background: ButtonText !important;\n }\n ::-webkit-scrollbar-track {\n background: Canvas !important;\n }\n}\n`.trim();\n}\n\n/**\n * useScrollbarStyles — returns inline React.CSSProperties for a\n * scrollable container that matches the current Zendir theme.\n *\n * Use when you need programmatic control rather than the\n * `zendir-scroll` CSS class.\n *\n * @example\n * ```tsx\n * const scrollStyle = useScrollbarStyles();\n * <div style={{ maxHeight: 400, ...scrollStyle }}>…</div>\n * ```\n */\nexport function useScrollbarStyles(): React.CSSProperties {\n const { tokens, mode } = useTheme();\n return useMemo((): React.CSSProperties => {\n const accent = tokens.colors.accent.primary;\n const isLight = mode === 'light';\n const thumbColor = isLight ? hexToRgba(accent, 0.28) : hexToRgba(accent, 0.35);\n const trackColor = isLight ? hexToRgba(accent, 0.04) : hexToRgba(accent, 0.06);\n return {\n // Firefox\n scrollbarWidth: 'thin' as const,\n scrollbarColor: `${thumbColor} ${trackColor}`,\n overflow: 'auto',\n };\n }, [tokens, mode]);\n}\n\n/**\n * ThemeProvider - Enterprise theme context provider\n * \n * Provides theme tokens, mode switching, and accessibility features\n * to all child components.\n * \n * @example\n * ```tsx\n * <ThemeProvider theme=\"hybrid\" mode=\"dark\"> // Zen (Hybrid) is the default\n * <App />\n * </ThemeProvider>\n * ```\n */\nexport function ThemeProvider({\n children,\n theme: defaultTheme = 'hybrid',\n mode: defaultMode = 'dark',\n persist = true,\n}: ThemeProviderProps): React.ReactElement {\n // Initialize theme from localStorage or defaults\n const [theme, setThemeState] = useState<ThemeVariant>(() => {\n if (persist && typeof window !== 'undefined') {\n const saved = localStorage.getItem('zendir-ui-theme');\n if (saved === 'astro' || saved === 'zendir' || saved === 'hybrid' || saved === 'transparent' || saved === 'transparent-bold' || saved === 'transparent-minimal') {\n return saved as ThemeVariant;\n }\n }\n return defaultTheme;\n });\n\n const [mode, setModeState] = useState<ThemeMode>(() => {\n if (persist && typeof window !== 'undefined') {\n const saved = localStorage.getItem('zendir-ui-mode');\n if (saved === 'light' || saved === 'dark') {\n return saved;\n }\n }\n return defaultMode;\n });\n\n // Detect reduced motion preference\n const [prefersReducedMotion, setPrefersReducedMotion] = useState(false);\n\n useEffect(() => {\n if (typeof window === 'undefined') return;\n\n const mediaQuery = window.matchMedia('(prefers-reduced-motion: reduce)');\n setPrefersReducedMotion(mediaQuery.matches);\n\n const handler = (e: MediaQueryListEvent) => setPrefersReducedMotion(e.matches);\n mediaQuery.addEventListener('change', handler);\n return () => mediaQuery.removeEventListener('change', handler);\n }, []);\n\n // Theme setters\n const setTheme = (newTheme: ThemeVariant) => {\n setThemeState(newTheme);\n if (persist && typeof window !== 'undefined') {\n localStorage.setItem('zendir-ui-theme', newTheme);\n }\n };\n\n const setMode = (newMode: ThemeMode) => {\n setModeState(newMode);\n if (persist && typeof window !== 'undefined') {\n localStorage.setItem('zendir-ui-mode', newMode);\n }\n };\n\n const toggleMode = () => {\n setMode(mode === 'dark' ? 'light' : 'dark');\n };\n\n // Accent color override\n const [accentColor, setAccentColorState] = useState<string | null>(() => {\n if (persist && typeof window !== 'undefined') {\n return localStorage.getItem('zendir-ui-accent') || null;\n }\n return null;\n });\n\n const setAccentColor = (color: string | null) => {\n setAccentColorState(color);\n if (persist && typeof window !== 'undefined') {\n if (color) {\n localStorage.setItem('zendir-ui-accent', color);\n } else {\n localStorage.removeItem('zendir-ui-accent');\n }\n }\n };\n\n // Get theme tokens (card border styles computed so all cards use theme-driven borders)\n const tokens = useMemo((): ThemeTokens => {\n // If light mode is selected, always use Astro Light theme (unified light mode)\n // regardless of the selected theme variant\n const base =\n mode === 'light'\n ? astroThemeLight\n : theme === 'astro'\n ? astroThemeDark\n : theme === 'hybrid'\n ? hybridTheme\n : theme === 'transparent' || theme === 'transparent-bold'\n ? transparentTheme\n : theme === 'transparent-minimal'\n ? transparentMinimalTheme\n : purpleHueTheme;\n const isTransparent =\n theme === 'transparent' || theme === 'transparent-bold' || theme === 'transparent-minimal';\n const isMinimal = theme === 'transparent-minimal';\n \n // For transparent-minimal: use visible accent-colored borders.\n // For other transparent themes: use subtle fadedBoxShadow.\n // Accent overrides are intentionally scoped to transparent variants only,\n // so switching to Astro/Hybrid/Purple-Hue restores each theme's native accent.\n const resolvedAccent = (isTransparent && accentColor)\n ? {\n primary: accentColor,\n secondary: adjustHexBrightness(accentColor, 1.2),\n tertiary: adjustHexBrightness(accentColor, 0.85),\n }\n : base.colors.accent;\n\n const accentPrimary = resolvedAccent.primary;\n const accentBorderMuted = `${accentPrimary}40`; // 25% opacity\n const accentBorderDefault = `${accentPrimary}66`; // 40% opacity\n const accentFadedBoxShadow = `inset 0 1px 0 ${hexToRgba(accentPrimary, 0.12)}, inset 0 -1px 0 rgba(0, 0, 0, 0.05), inset 1px 0 0 ${hexToRgba(accentPrimary, 0.06)}, inset -1px 0 0 ${hexToRgba(accentPrimary, 0.06)}`;\n \n const cardStyle = isMinimal\n ? { border: `1px solid ${accentBorderMuted}` }\n : isTransparent\n ? { border: 'none' as const, boxShadow: accentFadedBoxShadow }\n : { border: `1px solid ${base.colors.border.muted}` };\n const cardStyleDashed = isMinimal\n ? { border: `1px dashed ${accentBorderMuted}` }\n : isTransparent\n ? { border: 'none' as const, boxShadow: accentFadedBoxShadow }\n : { border: `1px dashed ${base.colors.border.muted}` };\n const cardStyleDefault = isMinimal\n ? { border: `1px solid ${accentBorderDefault}` }\n : isTransparent\n ? { border: 'none' as const, boxShadow: accentFadedBoxShadow }\n : { border: `1px solid ${base.colors.border.default}` };\n // Compute border tokens from the resolved theme colors\n const resolvedColors: ThemeColors = {\n ...base.colors,\n accent: resolvedAccent,\n border: {\n ...base.colors.border,\n cardStyle,\n cardStyleDashed,\n cardStyleDefault,\n },\n };\n\n return {\n ...base,\n colors: resolvedColors,\n borders: computeBorderTokens(resolvedColors),\n } as ThemeTokens;\n }, [theme, mode, accentColor]);\n\n // Apply CSS variables to document\n useEffect(() => {\n if (typeof document === 'undefined') return;\n\n const root = document.documentElement;\n const { colors, typography, spacing, borderRadius, animation, focus, shadows } = tokens;\n\n // Theme mode attribute\n root.setAttribute('data-theme', mode);\n root.setAttribute('data-variant', theme);\n\n // Background colors\n root.style.setProperty('--color-background-base', colors.background.base);\n root.style.setProperty('--color-background-surface', colors.background.surface);\n root.style.setProperty('--color-background-elevated', colors.background.elevated);\n root.style.setProperty('--color-background-overlay', colors.background.overlay);\n\n // Border colors\n root.style.setProperty('--color-border', colors.border.default);\n root.style.setProperty('--color-border-muted', colors.border.muted);\n root.style.setProperty('--color-border-focus', colors.border.focus);\n\n // Text colors\n root.style.setProperty('--color-text-primary', colors.text.primary);\n root.style.setProperty('--color-text-secondary', colors.text.secondary);\n root.style.setProperty('--color-text-tertiary', colors.text.tertiary);\n root.style.setProperty('--color-text-inverse', colors.text.inverse);\n\n // Status colors\n root.style.setProperty('--color-status-normal', colors.status.normal);\n root.style.setProperty('--color-status-standby', colors.status.standby);\n root.style.setProperty('--color-status-caution', colors.status.caution);\n root.style.setProperty('--color-status-serious', colors.status.serious);\n root.style.setProperty('--color-status-critical', colors.status.critical);\n root.style.setProperty('--color-status-off', colors.status.off);\n\n // Interactive colors\n root.style.setProperty('--color-interactive-default', colors.interactive.default);\n root.style.setProperty('--color-interactive-hover', colors.interactive.hover);\n root.style.setProperty('--color-interactive-active', colors.interactive.active);\n root.style.setProperty('--color-interactive-disabled', colors.interactive.disabled);\n\n // Accent colors\n root.style.setProperty('--color-accent-primary', colors.accent.primary);\n root.style.setProperty('--color-accent-secondary', colors.accent.secondary);\n root.style.setProperty('--color-accent-tertiary', colors.accent.tertiary);\n\n // Typography\n // @ts-expect-error - heading may not be strictly typed on older builds\n root.style.setProperty('--font-family-heading', typography.fontFamily.heading || typography.fontFamily.primary);\n root.style.setProperty('--font-family-primary', typography.fontFamily.primary);\n root.style.setProperty('--font-family-mono', typography.fontFamily.mono);\n\n // Spacing (full scale so CSS and layout can pull from SDK)\n root.style.setProperty('--spacing-xxs', spacing.xxs);\n root.style.setProperty('--spacing-xs', spacing.xs);\n root.style.setProperty('--spacing-sm', spacing.sm);\n root.style.setProperty('--spacing-smd', spacing.smd);\n root.style.setProperty('--spacing-md', spacing.md);\n root.style.setProperty('--spacing-mdl', spacing.mdl);\n root.style.setProperty('--spacing-lg', spacing.lg);\n root.style.setProperty('--spacing-xl', spacing.xl);\n root.style.setProperty('--spacing-xxl', spacing.xxl);\n\n // Border radius\n root.style.setProperty('--radius-sm', borderRadius.sm);\n root.style.setProperty('--radius-md', borderRadius.md);\n root.style.setProperty('--radius-lg', borderRadius.lg);\n root.style.setProperty('--radius-xl', borderRadius.xl);\n\n // Animation (respect reduced motion)\n const motionMultiplier = prefersReducedMotion ? 0 : 1;\n root.style.setProperty('--animation-fast', prefersReducedMotion ? 'none' : animation.fast);\n root.style.setProperty('--animation-normal', prefersReducedMotion ? 'none' : animation.normal);\n root.style.setProperty('--animation-slow', prefersReducedMotion ? 'none' : animation.slow);\n root.style.setProperty('--duration-fast', `${animation.duration.fast * motionMultiplier}ms`);\n root.style.setProperty('--duration-normal', `${animation.duration.normal * motionMultiplier}ms`);\n root.style.setProperty('--duration-slow', `${animation.duration.slow * motionMultiplier}ms`);\n\n // Focus\n root.style.setProperty('--focus-ring-color', focus.color);\n root.style.setProperty('--focus-ring-width', focus.width);\n root.style.setProperty('--focus-ring-offset', focus.offset);\n\n // Shadows\n root.style.setProperty('--shadow-sm', shadows.sm);\n root.style.setProperty('--shadow-md', shadows.md);\n root.style.setProperty('--shadow-lg', shadows.lg);\n root.style.setProperty('--shadow-xl', shadows.xl);\n\n // Apply base styles to body\n document.body.style.backgroundColor = colors.background.base;\n document.body.style.color = colors.text.primary;\n document.body.style.fontFamily = typography.fontFamily.primary;\n }, [tokens, theme, mode, prefersReducedMotion]);\n\n // ──────────────────────────────────────────────────────────────────────────\n // Scrollbar Styles — thin, elegant, theme-connected, fully accessible\n // ──────────────────────────────────────────────────────────────────────────\n const scrollbarCSS = useMemo(() => buildScrollbarCSS(tokens, mode, prefersReducedMotion), [tokens, mode, prefersReducedMotion]);\n\n const value: ThemeContextValue = useMemo(\n () => ({\n theme,\n mode,\n tokens,\n prefersReducedMotion,\n accentColor,\n setTheme,\n setMode,\n toggleMode,\n setAccentColor,\n }),\n [theme, mode, tokens, prefersReducedMotion, accentColor]\n );\n\n // Global reduced-motion rule — ensures ALL animations and transitions across\n // every Zendir component respect the OS preference (WCAG 2.3.3).\n // Uses 0.01ms (not 0) so animation-end events still fire correctly.\n const reducedMotionCSS = `@media (prefers-reduced-motion: reduce) {\n *, *::before, *::after {\n animation-duration: 0.01ms !important;\n animation-iteration-count: 1 !important;\n transition-duration: 0.01ms !important;\n scroll-behavior: auto !important;\n }\n}`;\n\n return (\n <ThemeContext.Provider value={value}>\n <style data-zendir-scrollbar=\"\" dangerouslySetInnerHTML={{ __html: scrollbarCSS }} />\n <style data-zendir-reduced-motion=\"\" dangerouslySetInnerHTML={{ __html: reducedMotionCSS }} />\n {children}\n </ThemeContext.Provider>\n );\n}\n\n/**\n * useTheme - Access theme context\n * \n * @throws Error if used outside ThemeProvider\n * \n * @example\n * ```tsx\n * const { tokens, mode, toggleMode } = useTheme();\n * ```\n */\nexport function useTheme(): ThemeContextValue {\n const context = useContext(ThemeContext);\n if (!context) {\n throw new Error('useTheme must be used within a ThemeProvider');\n }\n return context;\n}\n\n/**\n * useThemeTokens - Access only theme tokens (for memoization)\n */\nexport function useThemeTokens(): ThemeTokens {\n return useTheme().tokens;\n}\n"],"names":[],"mappings":";;AAiBA,SAAS,oBAAoB,KAAa,QAAwB;AAChE,QAAM,aAAa,IAAI,QAAQ,KAAK,EAAE,EAAE,KAAA;AACxC,QAAM,WAAW,WAAW,WAAW,IACnC,WAAW,MAAM,EAAE,EAAE,IAAI,QAAM,KAAK,EAAE,EAAE,KAAK,EAAE,IAC/C;AAEJ,MAAI,CAAC,mBAAmB,KAAK,QAAQ,GAAG;AACtC,WAAO;AAAA,EACT;AAEA,QAAM,QAAQ,CAAC,UAAkB,KAAK,IAAI,GAAG,KAAK,IAAI,KAAK,KAAK,MAAM,KAAK,CAAC,CAAC;AAC7E,QAAM,IAAI,MAAM,SAAS,SAAS,MAAM,GAAG,CAAC,GAAG,EAAE,IAAI,MAAM;AAC3D,QAAM,IAAI,MAAM,SAAS,SAAS,MAAM,GAAG,CAAC,GAAG,EAAE,IAAI,MAAM;AAC3D,QAAM,IAAI,MAAM,SAAS,SAAS,MAAM,GAAG,CAAC,GAAG,EAAE,IAAI,MAAM;AAE3D,QAAM,QAAQ,CAAC,UAAkB,MAAM,SAAS,EAAE,EAAE,SAAS,GAAG,GAAG;AACnE,SAAO,IAAI,MAAM,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC,GAAG,MAAM,CAAC,CAAC;AAC3C;AA4VA,SAAS,oBAAoB,QAAmC;AAC9D,QAAM,OAAQ;AACd,QAAM,SAAS;AACf,QAAM,QAAQ;AACd,QAAM,SAAS,OAAO,OAAO;AAC7B,QAAM,QAAS,OAAO,OAAO;AAC7B,QAAM,WAAW,OAAO,OAAO;AAC/B,QAAM,SAAS,OAAO,WAAW;AAEjC,SAAO;AAAA,IACL,OAAO,EAAE,MAAM,QAAQ,MAAA;AAAA,IACvB,OAAO;AAAA,MACL,SAAS,GAAG,IAAI,UAAU,KAAK;AAAA,MAC/B,OAAS,GAAG,IAAI,UAAU,MAAM;AAAA,MAChC,OAAS,GAAG,IAAI,UAAU,MAAM;AAAA,MAChC,OAAS,GAAG,IAAI,UAAU,QAAQ;AAAA,IAAA;AAAA,IAEpC,WAAW;AAAA;AAAA,MAET,SAAS,aAAa,MAAM,gBAAgB,MAAM;AAAA,MAClD,QAAS,aAAa,MAAM,eAAe,MAAM;AAAA,MACjD,QAAS,aAAa,MAAM;AAAA,IAAA;AAAA,IAE9B,SAAW,GAAG,IAAI,UAAU,KAAK;AAAA,IACjC,UAAW,GAAG,IAAI,UAAU,MAAM;AAAA,IAClC,WAAW,GAAG,IAAI,UAAU,KAAK;AAAA,EAAA;AAErC;AAaA,MAAM,kBAAkC;AAAA,EACtC,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,QAAQ;AAAA,EACR,QAAQ;AAAA,IACN,SAAS;AAAA,IACT,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,OAAO;AAAA,EAAA;AAAA,EAET,UAAU;AAAA,IACR,SAAS;AAAA,IACT,MAAM;AAAA,IACN,QAAQ;AAAA,IACR,MAAM;AAAA,EAAA;AAEV;AAMA,MAAM,kBAA8B;AAAA,EAClC,OAAO;AAAA,EACP,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,IACL,SAAS;AAAA,IACT,eAAe;AAAA,EAAA;AAEnB;AAEA,MAAM,mBAA+B;AAAA,EACnC,OAAO;AAAA,EACP,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,IACL,SAAS;AAAA,IACT,eAAe;AAAA,EAAA;AAEnB;AAMA,MAAM,cAAc;AAAA,EAClB,MAAM;AAAA,EACN,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM,CAAC,UAAkB,YAAY,KAAK,gBAAgB,KAAK;AACjE;AAEA,MAAM,eAAe;AAAA,EACnB,MAAM;AAAA,EACN,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,IAAI;AAAA,EACJ,MAAM,CAAC,UAAkB,YAAY,KAAK,gBAAgB,KAAK;AACjE;AAOA,MAAM,eAA6B;AAAA,EACjC,MAAM;AAAA,IACJ,SAAS;AAAA;AAAA,IACT,KAAK;AAAA;AAAA,IACL,YAAY;AAAA;AAAA,IACZ,SAAS;AAAA,MACP,UAAU;AAAA;AAAA,MACV,iBAAiB;AAAA;AAAA,MACjB,eAAe;AAAA;AAAA,MACf,oBAAoB;AAAA;AAAA,MACpB,iBAAiB;AAAA,MACjB,KAAK;AAAA;AAAA,IAAA;AAAA,EACP;AAAA,EAEF,SAAS;AAAA,IACP,qBAAqB;AAAA;AAAA,IACrB,oBAAoB;AAAA,IACpB,mBAAmB;AAAA;AAAA,EAAA;AAAA,EAErB,MAAM;AAAA,IACJ,UAAU;AAAA;AAAA,IACV,WAAW;AAAA;AAAA,IACX,cAAc;AAAA;AAAA,IACd,UAAU;AAAA;AAAA,IACV,UAAU;AAAA;AAAA,EAAA;AAAA,EAEZ,SAAS;AAAA,IACP,SAAS;AAAA;AAAA,IACT,cAAc;AAAA;AAAA,IACd,KAAK;AAAA;AAAA,EAAA;AAET;AAMA,MAAM,iBAAkC;AAAA,EACtC,QAAQ;AAAA,IACN,YAAY;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU;AAAA,MACV,SAAS;AAAA,IAAA;AAAA,IAEX,QAAQ;AAAA,MACN,SAAS;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA,IAAA;AAAA,IAET,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,WAAW;AAAA,MACX,UAAU;AAAA,MACV,OAAO;AAAA,MACP,SAAS;AAAA,IAAA;AAAA,IAEX,QAAQ;AAAA,MACN,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,UAAU;AAAA,MACV,KAAK;AAAA,IAAA;AAAA,IAEP,UAAU;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,MACP,MAAM;AAAA,IAAA;AAAA,IAER,QAAQ;AAAA,MACN,SAAS;AAAA,MACT,WAAW;AAAA,MACX,UAAU;AAAA,IAAA;AAAA,IAEZ,aAAa;AAAA,MACX,SAAS;AAAA,MACT,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,UAAU;AAAA,IAAA;AAAA,EACZ;AAAA,EAEF,SAAS;AAAA,IACP,KAAK;AAAA,IACL,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,IAAI;AAAA,IACJ,KAAK;AAAA,IACL,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,KAAK;AAAA,EAAA;AAAA,EAEP,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,aAAa;AAAA,IACX,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,EAAA;AAAA,EAEN,YAAY;AAAA;AAAA;AAAA;AAAA;AAAA,IAKV,YAAY;AAAA;AAAA,MAEV,SAAS;AAAA;AAAA,MAET,MAAM;AAAA,IAAA;AAAA;AAAA;AAAA,IAIR,SAAS;AAAA,MACP,GAAG,EAAE,UAAU,WAAW,YAAY,KAAK,eAAe,UAAU,YAAY,WAAA;AAAA,MAChF,GAAG,EAAE,UAAU,QAAQ,YAAY,KAAK,eAAe,KAAK,YAAY,SAAA;AAAA,IAAS;AAAA;AAAA,IAGnF,SAAS;AAAA,MACP,GAAG,EAAE,UAAU,YAAY,YAAY,KAAK,eAAe,UAAU,YAAY,SAAA;AAAA,MACjF,SAAS,EAAE,UAAU,YAAY,YAAY,KAAK,eAAe,UAAU,YAAY,OAAA;AAAA,MACvF,GAAG,EAAE,UAAU,UAAU,YAAY,KAAK,eAAe,KAAK,YAAY,UAAA;AAAA,MAC1E,GAAG,EAAE,UAAU,WAAW,YAAY,KAAK,eAAe,UAAU,YAAY,SAAA;AAAA,MAChF,GAAG,EAAE,UAAU,WAAW,YAAY,KAAK,eAAe,UAAU,YAAY,SAAA;AAAA,MAChF,GAAG,EAAE,UAAU,YAAY,YAAY,KAAK,eAAe,KAAK,YAAY,SAAA;AAAA,MAC5E,GAAG,EAAE,UAAU,YAAY,YAAY,KAAK,eAAe,KAAK,YAAY,SAAA;AAAA,IAAS;AAAA;AAAA,IAGvF,MAAM;AAAA,MACJ,GAAG,EAAE,UAAU,QAAQ,YAAY,KAAK,eAAe,SAAS,YAAY,SAAA;AAAA,MAC5E,SAAS,EAAE,UAAU,QAAQ,YAAY,KAAK,eAAe,SAAS,YAAY,SAAA;AAAA,MAClF,GAAG,EAAE,UAAU,YAAY,YAAY,KAAK,eAAe,SAAS,YAAY,UAAA;AAAA,MAChF,SAAS,EAAE,UAAU,YAAY,YAAY,KAAK,eAAe,SAAS,YAAY,UAAA;AAAA,MACtF,GAAG,EAAE,UAAU,WAAW,YAAY,KAAK,eAAe,KAAK,YAAY,OAAA;AAAA,MAC3E,SAAS,EAAE,UAAU,WAAW,YAAY,KAAK,eAAe,KAAK,YAAY,OAAA;AAAA,IAAO;AAAA;AAAA,IAG1F,SAAS;AAAA,MACP,GAAG,EAAE,UAAU,QAAQ,YAAY,KAAK,eAAe,SAAS,YAAY,UAAA;AAAA,MAC5E,SAAS,EAAE,UAAU,QAAQ,YAAY,KAAK,eAAe,SAAS,YAAY,UAAA;AAAA,IAAU;AAAA;AAAA;AAAA,IAI9F,UAAU;AAAA,MACR,OAAO;AAAA;AAAA,MACP,KAAK;AAAA;AAAA,MACL,IAAI;AAAA;AAAA,MACJ,IAAI;AAAA;AAAA,MACJ,MAAM;AAAA;AAAA,MACN,IAAI;AAAA;AAAA,MACJ,IAAI;AAAA;AAAA,MACJ,IAAI;AAAA;AAAA,MACJ,KAAK;AAAA;AAAA,MACL,MAAM;AAAA;AAAA,IAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,IAOR,YAAY;AAAA,MACV,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,QAAQ;AAAA;AAAA,MAER,UAAU;AAAA;AAAA,MACV,MAAM;AAAA,IAAA;AAAA,IAER,YAAY;AAAA,MACV,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,SAAS;AAAA,IAAA;AAAA,IAEX,eAAe;AAAA,MACb,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,MAAM;AAAA,IAAA;AAAA,EACR;AAAA,EAEF,SAAS;AAAA,EACT,WAAW;AAAA,EACX,OAAO;AAAA,EACP,QAAQ;AACV;AAMA,MAAM,kBAAmC;AAAA,EACvC,QAAQ;AAAA,IACN,YAAY;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU;AAAA,MACV,SAAS;AAAA,IAAA;AAAA,IAEX,QAAQ;AAAA,MACN,SAAS;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA,IAAA;AAAA,IAET,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,WAAW;AAAA,MACX,UAAU;AAAA;AAAA,MACV,OAAO;AAAA;AAAA,MACP,SAAS;AAAA,IAAA;AAAA,IAEX,QAAQ;AAAA,MACN,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,UAAU;AAAA,MACV,KAAK;AAAA,IAAA;AAAA,IAEP,UAAU;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,MACP,MAAM;AAAA,IAAA;AAAA,IAER,QAAQ;AAAA,MACN,SAAS;AAAA,MACT,WAAW;AAAA,MACX,UAAU;AAAA,IAAA;AAAA,IAEZ,aAAa;AAAA,MACX,SAAS;AAAA,MACT,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,UAAU;AAAA,IAAA;AAAA,EACZ;AAAA,EAEF,SAAS,eAAe;AAAA,EACxB,cAAc,eAAe;AAAA,EAC7B,aAAa,eAAe;AAAA,EAC5B,YAAY,eAAe;AAAA,EAC3B,SAAS;AAAA,EACT,WAAW;AAAA,EACX,OAAO;AAAA,EACP,QAAQ;AACV;AAOA,MAAM,uBAAmC;AAAA,EACvC,OAAO;AAAA,EACP,OAAO;AAAA,EACP,QAAQ;AAAA,EACR,MAAM;AAAA,EACN,OAAO;AAAA,IACL,SAAS;AAAA,IACT,eAAe;AAAA,EAAA;AAEnB;AAEA,MAAM,cAA+B;AAAA,EACnC,QAAQ;AAAA,IACN,YAAY;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU;AAAA,MACV,SAAS;AAAA,IAAA;AAAA,IAEX,QAAQ;AAAA,MACN,SAAS;AAAA;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA;AAAA,IAAA;AAAA,IAET,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,WAAW;AAAA,MACX,UAAU;AAAA;AAAA,MACV,OAAO;AAAA;AAAA,MACP,SAAS;AAAA,IAAA;AAAA;AAAA,IAGX,QAAQ;AAAA,MACN,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,UAAU;AAAA,MACV,KAAK;AAAA,IAAA;AAAA,IAEP,UAAU;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,MACP,MAAM;AAAA;AAAA,IAAA;AAAA;AAAA,IAGR,QAAQ;AAAA,MACN,SAAS;AAAA;AAAA,MACT,WAAW;AAAA;AAAA,MACX,UAAU;AAAA;AAAA,IAAA;AAAA,IAEZ,aAAa;AAAA,MACX,SAAS;AAAA,MACT,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,UAAU;AAAA,IAAA;AAAA,EACZ;AAAA,EAEF,SAAS,eAAe;AAAA,EACxB,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,aAAa,eAAe;AAAA,EAC5B,YAAY,eAAe;AAAA,EAC3B,SAAS;AAAA,IACP,GAAG;AAAA,IACH,MAAM,CAAC,UAAkB,YAAY,KAAK,gBAAgB,KAAK,kBAAkB,KAAK;AAAA,EAAA;AAAA,EAExF,WAAW;AAAA,EACX,OAAO;AAAA,EACP,QAAQ;AACV;AAOA,MAAM,iBAAkC;AAAA,EACtC,QAAQ;AAAA,IACN,YAAY;AAAA,MACV,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU;AAAA,MACV,SAAS;AAAA,IAAA;AAAA,IAEX,QAAQ;AAAA,MACN,SAAS;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA,IAAA;AAAA,IAET,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,WAAW;AAAA,MACX,UAAU;AAAA;AAAA,MACV,OAAO;AAAA;AAAA,MACP,SAAS;AAAA,IAAA;AAAA;AAAA,IAGX,QAAQ;AAAA,MACN,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,UAAU;AAAA,MACV,KAAK;AAAA,IAAA;AAAA,IAEP,UAAU;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,MACP,MAAM;AAAA,IAAA;AAAA;AAAA,IAGR,QAAQ;AAAA,MACN,SAAS;AAAA;AAAA,MACT,WAAW;AAAA;AAAA,MACX,UAAU;AAAA;AAAA,IAAA;AAAA,IAEZ,aAAa;AAAA,MACX,SAAS;AAAA,MACT,OAAO;AAAA,MACP,QAAQ;AAAA,MACR,UAAU;AAAA,IAAA;AAAA,EACZ;AAAA,EAEF,SAAS,eAAe;AAAA,EACxB,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,aAAa,eAAe;AAAA;AAAA,EAE5B,YAAY,eAAe;AAAA,EAC3B,SAAS;AAAA,IACP,GAAG;AAAA,IACH,MAAM,CAAC,UAAkB,YAAY,KAAK,gBAAgB,KAAK,kBAAkB,KAAK;AAAA,EAAA;AAAA,EAExF,WAAW;AAAA,EACX,OAAO;AAAA,IACL,GAAG;AAAA,EAAA;AAAA,EAEL,QAAQ;AACV;AAOA,MAAM,mBAAoC;AAAA,EACxC,QAAQ;AAAA,IACN,YAAY;AAAA;AAAA,MAEV,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU;AAAA,MACV,SAAS;AAAA,IAAA;AAAA,IAEX,QAAQ;AAAA;AAAA,MAEN,SAAS;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA;AAAA,MAEP,gBAAgB;AAAA,IAAA;AAAA,IAElB,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,WAAW;AAAA,MACX,UAAU;AAAA;AAAA,MACV,OAAO;AAAA;AAAA,MACP,SAAS;AAAA,IAAA;AAAA;AAAA,IAGX,QAAQ;AAAA,MACN,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,UAAU;AAAA,MACV,KAAK;AAAA,IAAA;AAAA,IAEP,UAAU;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,MACP,MAAM;AAAA,IAAA;AAAA;AAAA,IAGR,QAAQ;AAAA,MACN,SAAS;AAAA;AAAA,MACT,WAAW;AAAA;AAAA,MACX,UAAU;AAAA;AAAA,IAAA;AAAA,IAEZ,aAAa;AAAA,MACX,SAAS;AAAA;AAAA,MACT,OAAO;AAAA;AAAA,MACP,QAAQ;AAAA;AAAA,MACR,UAAU;AAAA;AAAA,MAEV,oBAAoB;AAAA,MACpB,kBAAkB;AAAA,MAClB,oBAAoB;AAAA,IAAA;AAAA,EACtB;AAAA,EAEF,SAAS,eAAe;AAAA,EACxB,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,aAAa,eAAe;AAAA;AAAA,EAE5B,YAAY,eAAe;AAAA,EAC3B,SAAS;AAAA,IACP,GAAG;AAAA;AAAA,IAEH,MAAM,CAAC,UAAkB,YAAY,KAAK,gBAAgB,KAAK;AAAA,EAAA;AAAA,EAEjE,WAAW;AAAA,EACX,OAAO;AAAA,IACL,OAAO;AAAA;AAAA,IACP,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,OAAO;AAAA,MACL,SAAS;AAAA,MACT,eAAe;AAAA,IAAA;AAAA,EACjB;AAAA,EAEF,QAAQ;AACV;AAOA,MAAM,0BAA2C;AAAA,EAC/C,QAAQ;AAAA,IACN,YAAY;AAAA;AAAA,MAEV,MAAM;AAAA,MACN,SAAS;AAAA,MACT,UAAU;AAAA,MACV,SAAS;AAAA,IAAA;AAAA,IAEX,QAAQ;AAAA;AAAA,MAEN,SAAS;AAAA,MACT,OAAO;AAAA,MACP,OAAO;AAAA;AAAA,MAEP,gBAAgB;AAAA,IAAA;AAAA,IAElB,MAAM;AAAA,MACJ,SAAS;AAAA,MACT,WAAW;AAAA,MACX,UAAU;AAAA;AAAA,MACV,OAAO;AAAA;AAAA,MACP,SAAS;AAAA,IAAA;AAAA;AAAA,IAGX,QAAQ;AAAA,MACN,QAAQ;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,SAAS;AAAA,MACT,UAAU;AAAA,MACV,KAAK;AAAA,IAAA;AAAA,IAEP,UAAU;AAAA,MACR,SAAS;AAAA,MACT,SAAS;AAAA,MACT,OAAO;AAAA,MACP,MAAM;AAAA,IAAA;AAAA;AAAA,IAGR,QAAQ;AAAA,MACN,SAAS;AAAA;AAAA,MACT,WAAW;AAAA;AAAA,MACX,UAAU;AAAA;AAAA,IAAA;AAAA,IAEZ,aAAa;AAAA,MACX,SAAS;AAAA;AAAA,MACT,OAAO;AAAA;AAAA,MACP,QAAQ;AAAA;AAAA,MACR,UAAU;AAAA;AAAA,MAEV,oBAAoB;AAAA,MACpB,kBAAkB;AAAA,MAClB,oBAAoB;AAAA,IAAA;AAAA,EACtB;AAAA,EAEF,SAAS,eAAe;AAAA,EACxB,cAAc;AAAA,IACZ,MAAM;AAAA,IACN,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,IAAI;AAAA,IACJ,MAAM;AAAA,EAAA;AAAA,EAER,aAAa,eAAe;AAAA;AAAA,EAE5B,YAAY,eAAe;AAAA,EAC3B,SAAS;AAAA,IACP,GAAG;AAAA;AAAA,IAEH,MAAM,CAAC,UAAkB,YAAY,KAAK,gBAAgB,KAAK;AAAA,EAAA;AAAA,EAEjE,WAAW;AAAA,EACX,OAAO;AAAA,IACL,OAAO;AAAA;AAAA,IACP,OAAO;AAAA,IACP,QAAQ;AAAA,IACR,MAAM;AAAA,IACN,OAAO;AAAA,MACL,SAAS;AAAA,MACT,eAAe;AAAA,IAAA;AAAA,EACjB;AAAA,EAEF,QAAQ;AACV;AAoBA,MAAM,eAAe,cAA6C,MAAS;AAgC3E,SAAS,UAAU,KAAa,OAAuB;AACrD,QAAM,QAAQ,IAAI,QAAQ,KAAK,EAAE;AACjC,MAAI,GAAW,GAAW;AAC1B,MAAI,MAAM,WAAW,GAAG;AACtB,QAAI,SAAS,MAAM,CAAC,IAAI,MAAM,CAAC,GAAG,EAAE;AACpC,QAAI,SAAS,MAAM,CAAC,IAAI,MAAM,CAAC,GAAG,EAAE;AACpC,QAAI,SAAS,MAAM,CAAC,IAAI,MAAM,CAAC,GAAG,EAAE;AAAA,EACtC,OAAO;AACL,QAAI,SAAS,MAAM,MAAM,GAAG,CAAC,GAAG,EAAE;AAClC,QAAI,SAAS,MAAM,MAAM,GAAG,CAAC,GAAG,EAAE;AAClC,QAAI,SAAS,MAAM,MAAM,GAAG,CAAC,GAAG,EAAE;AAAA,EACpC;AACA,SAAO,QAAQ,CAAC,KAAK,CAAC,KAAK,CAAC,KAAK,KAAK;AACxC;AAEA,SAAS,kBAAkB,QAAqB,MAAiB,eAAgC;AAC/F,QAAM,SAAS,OAAO,OAAO,OAAO;AACnB,SAAO,OAAO,WAAW;AAC5B,SAAO,OAAO,WAAW;AACvC,QAAM,UAAU,SAAS;AAGzB,QAAM,YAAgB,UAAU,UAAU,QAAQ,IAAI,IAAI,UAAU,QAAQ,IAAI;AAChF,QAAM,aAAgB,UAAU,UAAU,QAAQ,IAAI,IAAI,UAAU,QAAQ,IAAI;AAChF,QAAM,cAAgB,UAAU,UAAU,QAAQ,IAAI,IAAI,UAAU,QAAQ,IAAI;AAGhF,QAAM,aAAgB,UAAU,UAAU,QAAQ,IAAI,IAAI,UAAU,QAAQ,IAAI;AAChF,QAAM,aAAgB,UAAU,UAAU,QAAQ,IAAI,IAAI,UAAU,QAAQ,GAAI;AAEhF,QAAM,aAAa,gBAAgB,SAAS;AAC5C,QAAM,cAAc;AAGpB,QAAM,UAAU;AAChB,QAAM,UAAU;AAEhB,SAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,qBASY,OAAO,IAAI,OAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,gBAcvB,UAAU;AAAA,mBACP,WAAW;AAAA;AAAA;AAAA;AAAA,gBAId,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,gBAKV,SAAS;AAAA,mBACN,WAAW;AAAA;AAAA;AAAA,gBAGd,UAAU;AAAA;AAAA;AAAA;AAAA,gBAIV,UAAU;AAAA;AAAA;AAAA;AAAA;AAAA,gBAKV,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,mBAyBR,WAAW;AAAA;AAAA;AAAA,gBAGd,SAAS;AAAA,mBACN,WAAW;AAAA,gBACd,UAAU;AAAA;AAAA;AAAA,gBAGV,UAAU;AAAA;AAAA;AAAA,gBAGV,WAAW;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,uBAkBJ,MAAM;AAAA;AAAA,mBAEV,OAAO,aAAa,EAAE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAoBvC,KAAA;AACF;AAeO,SAAS,qBAA0C;AACxD,QAAM,EAAE,QAAQ,KAAA,IAAS,SAAA;AACzB,SAAO,QAAQ,MAA2B;AACxC,UAAM,SAAS,OAAO,OAAO,OAAO;AACpC,UAAM,UAAU,SAAS;AACzB,UAAM,aAAa,UAAU,UAAU,QAAQ,IAAI,IAAI,UAAU,QAAQ,IAAI;AAC7E,UAAM,aAAa,UAAU,UAAU,QAAQ,IAAI,IAAI,UAAU,QAAQ,IAAI;AAC7E,WAAO;AAAA;AAAA,MAEL,gBAAgB;AAAA,MAChB,gBAAgB,GAAG,UAAU,IAAI,UAAU;AAAA,MAC3C,UAAU;AAAA,IAAA;AAAA,EAEd,GAAG,CAAC,QAAQ,IAAI,CAAC;AACnB;AAeO,SAAS,cAAc;AAAA,EAC5B;AAAA,EACA,OAAO,eAAe;AAAA,EACtB,MAAM,cAAc;AAAA,EACpB,UAAU;AACZ,GAA2C;AAEzC,QAAM,CAAC,OAAO,aAAa,IAAI,SAAuB,MAAM;AAC1D,QAAI,WAAW,OAAO,WAAW,aAAa;AAC5C,YAAM,QAAQ,aAAa,QAAQ,iBAAiB;AACpD,UAAI,UAAU,WAAW,UAAU,YAAY,UAAU,YAAY,UAAU,iBAAiB,UAAU,sBAAsB,UAAU,uBAAuB;AAC/J,eAAO;AAAA,MACT;AAAA,IACF;AACA,WAAO;AAAA,EACT,CAAC;AAED,QAAM,CAAC,MAAM,YAAY,IAAI,SAAoB,MAAM;AACrD,QAAI,WAAW,OAAO,WAAW,aAAa;AAC5C,YAAM,QAAQ,aAAa,QAAQ,gBAAgB;AACnD,UAAI,UAAU,WAAW,UAAU,QAAQ;AACzC,eAAO;AAAA,MACT;AAAA,IACF;AACA,WAAO;AAAA,EACT,CAAC;AAGD,QAAM,CAAC,sBAAsB,uBAAuB,IAAI,SAAS,KAAK;AAEtE,YAAU,MAAM;AACd,QAAI,OAAO,WAAW,YAAa;AAEnC,UAAM,aAAa,OAAO,WAAW,kCAAkC;AACvE,4BAAwB,WAAW,OAAO;AAE1C,UAAM,UAAU,CAAC,MAA2B,wBAAwB,EAAE,OAAO;AAC7E,eAAW,iBAAiB,UAAU,OAAO;AAC7C,WAAO,MAAM,WAAW,oBAAoB,UAAU,OAAO;AAAA,EAC/D,GAAG,CAAA,CAAE;AAGL,QAAM,WAAW,CAAC,aAA2B;AAC3C,kBAAc,QAAQ;AACtB,QAAI,WAAW,OAAO,WAAW,aAAa;AAC5C,mBAAa,QAAQ,mBAAmB,QAAQ;AAAA,IAClD;AAAA,EACF;AAEA,QAAM,UAAU,CAAC,YAAuB;AACtC,iBAAa,OAAO;AACpB,QAAI,WAAW,OAAO,WAAW,aAAa;AAC5C,mBAAa,QAAQ,kBAAkB,OAAO;AAAA,IAChD;AAAA,EACF;AAEA,QAAM,aAAa,MAAM;AACvB,YAAQ,SAAS,SAAS,UAAU,MAAM;AAAA,EAC5C;AAGA,QAAM,CAAC,aAAa,mBAAmB,IAAI,SAAwB,MAAM;AACvE,QAAI,WAAW,OAAO,WAAW,aAAa;AAC5C,aAAO,aAAa,QAAQ,kBAAkB,KAAK;AAAA,IACrD;AACA,WAAO;AAAA,EACT,CAAC;AAED,QAAM,iBAAiB,CAAC,UAAyB;AAC/C,wBAAoB,KAAK;AACzB,QAAI,WAAW,OAAO,WAAW,aAAa;AAC5C,UAAI,OAAO;AACT,qBAAa,QAAQ,oBAAoB,KAAK;AAAA,MAChD,OAAO;AACL,qBAAa,WAAW,kBAAkB;AAAA,MAC5C;AAAA,IACF;AAAA,EACF;AAGA,QAAM,SAAS,QAAQ,MAAmB;AAGxC,UAAM,OACJ,SAAS,UACL,kBACA,UAAU,UACR,iBACA,UAAU,WACR,cACA,UAAU,iBAAiB,UAAU,qBACnC,mBACA,UAAU,wBACR,0BACA;AACd,UAAM,gBACJ,UAAU,iBAAiB,UAAU,sBAAsB,UAAU;AACvE,UAAM,YAAY,UAAU;AAM5B,UAAM,iBAAkB,iBAAiB,cACrC;AAAA,MACE,SAAS;AAAA,MACT,WAAW,oBAAoB,aAAa,GAAG;AAAA,MAC/C,UAAU,oBAAoB,aAAa,IAAI;AAAA,IAAA,IAEjD,KAAK,OAAO;AAEhB,UAAM,gBAAgB,eAAe;AACrC,UAAM,oBAAoB,GAAG,aAAa;AAC1C,UAAM,sBAAsB,GAAG,aAAa;AAC5C,UAAM,uBAAuB,iBAAiB,UAAU,eAAe,IAAI,CAAC,uDAAuD,UAAU,eAAe,IAAI,CAAC,oBAAoB,UAAU,eAAe,IAAI,CAAC;AAEnN,UAAM,YAAY,YACd,EAAE,QAAQ,aAAa,iBAAiB,GAAA,IACxC,gBACE,EAAE,QAAQ,QAAiB,WAAW,qBAAA,IACtC,EAAE,QAAQ,aAAa,KAAK,OAAO,OAAO,KAAK,GAAA;AACrD,UAAM,kBAAkB,YACpB,EAAE,QAAQ,cAAc,iBAAiB,GAAA,IACzC,gBACE,EAAE,QAAQ,QAAiB,WAAW,qBAAA,IACtC,EAAE,QAAQ,cAAc,KAAK,OAAO,OAAO,KAAK,GAAA;AACtD,UAAM,mBAAmB,YACrB,EAAE,QAAQ,aAAa,mBAAmB,GAAA,IAC1C,gBACE,EAAE,QAAQ,QAAiB,WAAW,qBAAA,IACtC,EAAE,QAAQ,aAAa,KAAK,OAAO,OAAO,OAAO,GAAA;AAEvD,UAAM,iBAA8B;AAAA,MAClC,GAAG,KAAK;AAAA,MACR,QAAQ;AAAA,MACR,QAAQ;AAAA,QACN,GAAG,KAAK,OAAO;AAAA,QACf;AAAA,QACA;AAAA,QACA;AAAA,MAAA;AAAA,IACF;AAGF,WAAO;AAAA,MACL,GAAG;AAAA,MACH,QAAQ;AAAA,MACR,SAAS,oBAAoB,cAAc;AAAA,IAAA;AAAA,EAE/C,GAAG,CAAC,OAAO,MAAM,WAAW,CAAC;AAG7B,YAAU,MAAM;AACd,QAAI,OAAO,aAAa,YAAa;AAErC,UAAM,OAAO,SAAS;AACtB,UAAM,EAAE,QAAQ,YAAY,SAAS,cAAc,WAAW,OAAO,YAAY;AAGjF,SAAK,aAAa,cAAc,IAAI;AACpC,SAAK,aAAa,gBAAgB,KAAK;AAGvC,SAAK,MAAM,YAAY,2BAA2B,OAAO,WAAW,IAAI;AACxE,SAAK,MAAM,YAAY,8BAA8B,OAAO,WAAW,OAAO;AAC9E,SAAK,MAAM,YAAY,+BAA+B,OAAO,WAAW,QAAQ;AAChF,SAAK,MAAM,YAAY,8BAA8B,OAAO,WAAW,OAAO;AAG9E,SAAK,MAAM,YAAY,kBAAkB,OAAO,OAAO,OAAO;AAC9D,SAAK,MAAM,YAAY,wBAAwB,OAAO,OAAO,KAAK;AAClE,SAAK,MAAM,YAAY,wBAAwB,OAAO,OAAO,KAAK;AAGlE,SAAK,MAAM,YAAY,wBAAwB,OAAO,KAAK,OAAO;AAClE,SAAK,MAAM,YAAY,0BAA0B,OAAO,KAAK,SAAS;AACtE,SAAK,MAAM,YAAY,yBAAyB,OAAO,KAAK,QAAQ;AACpE,SAAK,MAAM,YAAY,wBAAwB,OAAO,KAAK,OAAO;AAGlE,SAAK,MAAM,YAAY,yBAAyB,OAAO,OAAO,MAAM;AACpE,SAAK,MAAM,YAAY,0BAA0B,OAAO,OAAO,OAAO;AACtE,SAAK,MAAM,YAAY,0BAA0B,OAAO,OAAO,OAAO;AACtE,SAAK,MAAM,YAAY,0BAA0B,OAAO,OAAO,OAAO;AACtE,SAAK,MAAM,YAAY,2BAA2B,OAAO,OAAO,QAAQ;AACxE,SAAK,MAAM,YAAY,sBAAsB,OAAO,OAAO,GAAG;AAG9D,SAAK,MAAM,YAAY,+BAA+B,OAAO,YAAY,OAAO;AAChF,SAAK,MAAM,YAAY,6BAA6B,OAAO,YAAY,KAAK;AAC5E,SAAK,MAAM,YAAY,8BAA8B,OAAO,YAAY,MAAM;AAC9E,SAAK,MAAM,YAAY,gCAAgC,OAAO,YAAY,QAAQ;AAGlF,SAAK,MAAM,YAAY,0BAA0B,OAAO,OAAO,OAAO;AACtE,SAAK,MAAM,YAAY,4BAA4B,OAAO,OAAO,SAAS;AAC1E,SAAK,MAAM,YAAY,2BAA2B,OAAO,OAAO,QAAQ;AAIxE,SAAK,MAAM,YAAY,yBAAyB,WAAW,WAAW,WAAW,WAAW,WAAW,OAAO;AAC9G,SAAK,MAAM,YAAY,yBAAyB,WAAW,WAAW,OAAO;AAC7E,SAAK,MAAM,YAAY,sBAAsB,WAAW,WAAW,IAAI;AAGvE,SAAK,MAAM,YAAY,iBAAiB,QAAQ,GAAG;AACnD,SAAK,MAAM,YAAY,gBAAgB,QAAQ,EAAE;AACjD,SAAK,MAAM,YAAY,gBAAgB,QAAQ,EAAE;AACjD,SAAK,MAAM,YAAY,iBAAiB,QAAQ,GAAG;AACnD,SAAK,MAAM,YAAY,gBAAgB,QAAQ,EAAE;AACjD,SAAK,MAAM,YAAY,iBAAiB,QAAQ,GAAG;AACnD,SAAK,MAAM,YAAY,gBAAgB,QAAQ,EAAE;AACjD,SAAK,MAAM,YAAY,gBAAgB,QAAQ,EAAE;AACjD,SAAK,MAAM,YAAY,iBAAiB,QAAQ,GAAG;AAGnD,SAAK,MAAM,YAAY,eAAe,aAAa,EAAE;AACrD,SAAK,MAAM,YAAY,eAAe,aAAa,EAAE;AACrD,SAAK,MAAM,YAAY,eAAe,aAAa,EAAE;AACrD,SAAK,MAAM,YAAY,eAAe,aAAa,EAAE;AAGrD,UAAM,mBAAmB,uBAAuB,IAAI;AACpD,SAAK,MAAM,YAAY,oBAAoB,uBAAuB,SAAS,UAAU,IAAI;AACzF,SAAK,MAAM,YAAY,sBAAsB,uBAAuB,SAAS,UAAU,MAAM;AAC7F,SAAK,MAAM,YAAY,oBAAoB,uBAAuB,SAAS,UAAU,IAAI;AACzF,SAAK,MAAM,YAAY,mBAAmB,GAAG,UAAU,SAAS,OAAO,gBAAgB,IAAI;AAC3F,SAAK,MAAM,YAAY,qBAAqB,GAAG,UAAU,SAAS,SAAS,gBAAgB,IAAI;AAC/F,SAAK,MAAM,YAAY,mBAAmB,GAAG,UAAU,SAAS,OAAO,gBAAgB,IAAI;AAG3F,SAAK,MAAM,YAAY,sBAAsB,MAAM,KAAK;AACxD,SAAK,MAAM,YAAY,sBAAsB,MAAM,KAAK;AACxD,SAAK,MAAM,YAAY,uBAAuB,MAAM,MAAM;AAG1D,SAAK,MAAM,YAAY,eAAe,QAAQ,EAAE;AAChD,SAAK,MAAM,YAAY,eAAe,QAAQ,EAAE;AAChD,SAAK,MAAM,YAAY,eAAe,QAAQ,EAAE;AAChD,SAAK,MAAM,YAAY,eAAe,QAAQ,EAAE;AAGhD,aAAS,KAAK,MAAM,kBAAkB,OAAO,WAAW;AACxD,aAAS,KAAK,MAAM,QAAQ,OAAO,KAAK;AACxC,aAAS,KAAK,MAAM,aAAa,WAAW,WAAW;AAAA,EACzD,GAAG,CAAC,QAAQ,OAAO,MAAM,oBAAoB,CAAC;AAK9C,QAAM,eAAe,QAAQ,MAAM,kBAAkB,QAAQ,MAAM,oBAAoB,GAAG,CAAC,QAAQ,MAAM,oBAAoB,CAAC;AAE9H,QAAM,QAA2B;AAAA,IAC/B,OAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,IAAA;AAAA,IAEF,CAAC,OAAO,MAAM,QAAQ,sBAAsB,WAAW;AAAA,EAAA;AAMzD,QAAM,mBAAmB;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AASzB,SACE,qBAAC,aAAa,UAAb,EAAsB,OACrB,UAAA;AAAA,IAAA,oBAAC,WAAM,yBAAsB,IAAG,yBAAyB,EAAE,QAAQ,gBAAgB;AAAA,IACnF,oBAAC,WAAM,8BAA2B,IAAG,yBAAyB,EAAE,QAAQ,oBAAoB;AAAA,IAC3F;AAAA,EAAA,GACH;AAEJ;AAYO,SAAS,WAA8B;AAC5C,QAAM,UAAU,WAAW,YAAY;AACvC,MAAI,CAAC,SAAS;AACZ,UAAM,IAAI,MAAM,8CAA8C;AAAA,EAChE;AACA,SAAO;AACT;AAKO,SAAS,iBAA8B;AAC5C,SAAO,WAAW;AACpB;"}
@@ -100,8 +100,10 @@ export declare const borderRadius: {
100
100
  */
101
101
  export declare const typography: {
102
102
  readonly fontFamily: {
103
- /** Primary font: Roboto (AstroUXDS standard) */
104
- readonly primary: "\"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif";
103
+ /** Heading font: Sora (Zendir Brand Standard) */
104
+ readonly heading: "\"Sora\", \"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif";
105
+ /** Primary font: Public Sans (Zendir Brand Standard) */
106
+ readonly primary: "\"Public Sans\", \"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif";
105
107
  /** Monospace font: Roboto Mono for data/code */
106
108
  readonly mono: "\"Roboto Mono\", \"SF Mono\", \"Consolas\", \"Liberation Mono\", monospace";
107
109
  };
@@ -241,8 +243,10 @@ declare const _default: {
241
243
  };
242
244
  typography: {
243
245
  readonly fontFamily: {
244
- /** Primary font: Roboto (AstroUXDS standard) */
245
- readonly primary: "\"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif";
246
+ /** Heading font: Sora (Zendir Brand Standard) */
247
+ readonly heading: "\"Sora\", \"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif";
248
+ /** Primary font: Public Sans (Zendir Brand Standard) */
249
+ readonly primary: "\"Public Sans\", \"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif";
246
250
  /** Monospace font: Roboto Mono for data/code */
247
251
  readonly mono: "\"Roboto Mono\", \"SF Mono\", \"Consolas\", \"Liberation Mono\", monospace";
248
252
  };
@@ -94,8 +94,10 @@ const borderRadius = {
94
94
  };
95
95
  const typography = {
96
96
  fontFamily: {
97
- /** Primary font: Roboto (AstroUXDS standard) */
98
- primary: '"Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif',
97
+ /** Heading font: Sora (Zendir Brand Standard) */
98
+ heading: '"Sora", "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif',
99
+ /** Primary font: Public Sans (Zendir Brand Standard) */
100
+ primary: '"Public Sans", "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", "Helvetica Neue", Arial, sans-serif',
99
101
  /** Monospace font: Roboto Mono for data/code */
100
102
  mono: '"Roboto Mono", "SF Mono", "Consolas", "Liberation Mono", monospace'
101
103
  },
@@ -1 +1 @@
1
- {"version":3,"file":"index.js","sources":["../../src/tokens/index.ts"],"sourcesContent":["/**\n * @zendir/ui - Design Tokens\n * \n * Exportable design tokens for use in CSS and JavaScript.\n * Based on Astro UX Design System.\n */\n\nexport const colors = {\n // Status Colors (Dark Theme)\n status: {\n critical: '#ff3838',\n serious: '#ffb302',\n caution: '#fce83a',\n normal: '#56f000',\n standby: '#2dccff',\n off: '#a4abb6',\n },\n \n // Status Colors (Light Theme - Fill)\n statusLightFill: {\n critical: '#ff2a04',\n serious: '#ffaf3d',\n caution: '#fad800',\n normal: '#00e200',\n standby: '#64d9ff',\n off: '#7b8089',\n },\n \n // Status Colors (Light Theme - Border)\n statusLightBorder: {\n critical: '#661102',\n serious: '#664618',\n caution: '#645600',\n normal: '#005a00',\n standby: '#285766',\n off: '#3c3e42',\n },\n \n // Background Colors\n background: {\n dark: {\n base: '#101923',\n surface: '#1b2d3e',\n elevated: '#243647',\n overlay: 'rgba(0, 0, 0, 0.7)',\n },\n light: {\n base: '#f5f6f9',\n surface: '#ffffff',\n elevated: '#ffffff',\n overlay: 'rgba(0, 0, 0, 0.5)',\n },\n },\n \n // Text Colors\n text: {\n dark: {\n primary: '#ffffff',\n secondary: '#9ea7ad',\n tertiary: '#6b7175',\n muted: '#52595f',\n },\n light: {\n primary: '#1b2d3e',\n secondary: '#4c5a67',\n tertiary: '#7a8891',\n muted: '#a4adb5',\n },\n },\n \n // Accent Colors\n accent: {\n primary: '#4dacff',\n secondary: '#3d8ddb',\n tertiary: '#2e6eb3',\n },\n \n // Border Colors\n border: {\n dark: {\n default: '#3c4b5a',\n muted: '#2b3d4e',\n focus: '#4dacff',\n },\n light: {\n default: '#c4c8cc',\n muted: '#e1e4e8',\n focus: '#4dacff',\n },\n },\n} as const;\n\nexport const spacing = {\n xs: '4px',\n sm: '8px',\n md: '16px',\n lg: '24px',\n xl: '32px',\n xxl: '48px',\n} as const;\n\nexport const borderRadius = {\n none: '0',\n sm: '2px',\n md: '4px',\n lg: '8px',\n xl: '16px',\n full: '9999px',\n} as const;\n\n/**\n * Typography tokens following AstroUXDS Design System\n * @see https://www.astrouxds.com/foundations/typography/\n * \n * Font weights per Astro spec: 300 (Light), 400 (Regular), 500 (Medium), 700 (Bold)\n * Note: Astro does NOT use 600 (semibold) - use 500 (medium) or 700 (bold) instead\n */\nexport const typography = {\n fontFamily: {\n /** Primary font: Roboto (AstroUXDS standard) */\n primary: '\"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif',\n /** Monospace font: Roboto Mono for data/code */\n mono: '\"Roboto Mono\", \"SF Mono\", \"Consolas\", \"Liberation Mono\", monospace',\n },\n fontSize: {\n // Compact sizes for dense UIs (cards, badges, data labels)\n micro: '0.5625rem', // 9px - very tight spaces\n xxs: '0.625rem', // 10px - compact labels\n // Standard sizes\n xs: '0.75rem', // 12px - small text, body3\n sm: '0.875rem', // 14px - body2\n base: '1rem', // 16px - body1\n md: '1.125rem', // 18px - h5/h6\n lg: '1.25rem', // 20px - h3/h4\n xl: '1.5rem', // 24px - h2\n xxl: '2.125rem', // 34px - h1\n xxxl: '3rem', // 48px - display2\n display: '3.75rem', // 60px - display1\n },\n /**\n * Font weights per AstroUXDS specification\n * Only 300, 400, 500, 700 are officially supported\n */\n fontWeight: {\n light: 300,\n normal: 400,\n regular: 400, // Alias for normal\n medium: 500,\n bold: 700,\n // DEPRECATED: semibold is not in Astro spec, use medium (500) instead\n /** @deprecated Use medium (500) instead - Astro spec only supports 300, 400, 500, 700 */\n semibold: 500,\n },\n lineHeight: {\n tight: 1.25,\n normal: 1.5,\n relaxed: 1.75,\n },\n} as const;\n\nexport const shadows = {\n none: 'none',\n sm: '0 1px 2px rgba(0, 0, 0, 0.3)',\n md: '0 2px 8px rgba(0, 0, 0, 0.3)',\n lg: '0 4px 16px rgba(0, 0, 0, 0.3)',\n xl: '0 8px 32px rgba(0, 0, 0, 0.4)',\n glow: '0 0 20px rgba(77, 172, 255, 0.4)',\n} as const;\n\nexport const animation = {\n fast: '150ms ease',\n normal: '250ms ease',\n slow: '400ms ease',\n} as const;\n\n// CSS Custom Properties generator\nexport function generateCSSVariables(mode: 'dark' | 'light' = 'dark'): string {\n const bg = colors.background[mode];\n const txt = colors.text[mode];\n const bdr = colors.border[mode];\n \n return `\n:root {\n /* Status Colors */\n --zendir-status-critical: ${colors.status.critical};\n --zendir-status-serious: ${colors.status.serious};\n --zendir-status-caution: ${colors.status.caution};\n --zendir-status-normal: ${colors.status.normal};\n --zendir-status-standby: ${colors.status.standby};\n --zendir-status-off: ${colors.status.off};\n \n /* Background */\n --zendir-bg-base: ${bg.base};\n --zendir-bg-surface: ${bg.surface};\n --zendir-bg-elevated: ${bg.elevated};\n --zendir-bg-overlay: ${bg.overlay};\n \n /* Text */\n --zendir-text-primary: ${txt.primary};\n --zendir-text-secondary: ${txt.secondary};\n --zendir-text-tertiary: ${txt.tertiary};\n --zendir-text-muted: ${txt.muted};\n \n /* Accent */\n --zendir-accent-primary: ${colors.accent.primary};\n --zendir-accent-secondary: ${colors.accent.secondary};\n --zendir-accent-tertiary: ${colors.accent.tertiary};\n \n /* Border */\n --zendir-border-default: ${bdr.default};\n --zendir-border-muted: ${bdr.muted};\n --zendir-border-focus: ${bdr.focus};\n \n /* Spacing */\n --zendir-spacing-xs: ${spacing.xs};\n --zendir-spacing-sm: ${spacing.sm};\n --zendir-spacing-md: ${spacing.md};\n --zendir-spacing-lg: ${spacing.lg};\n --zendir-spacing-xl: ${spacing.xl};\n --zendir-spacing-xxl: ${spacing.xxl};\n \n /* Border Radius */\n --zendir-radius-sm: ${borderRadius.sm};\n --zendir-radius-md: ${borderRadius.md};\n --zendir-radius-lg: ${borderRadius.lg};\n --zendir-radius-xl: ${borderRadius.xl};\n --zendir-radius-full: ${borderRadius.full};\n \n /* Typography - AstroUXDS Compliant */\n --zendir-font-primary: ${typography.fontFamily.primary};\n --zendir-font-mono: ${typography.fontFamily.mono};\n --zendir-font-size-micro: ${typography.fontSize.micro};\n --zendir-font-size-xxs: ${typography.fontSize.xxs};\n --zendir-font-size-xs: ${typography.fontSize.xs};\n --zendir-font-size-sm: ${typography.fontSize.sm};\n --zendir-font-size-base: ${typography.fontSize.base};\n --zendir-font-size-md: ${typography.fontSize.md};\n --zendir-font-size-lg: ${typography.fontSize.lg};\n --zendir-font-size-xl: ${typography.fontSize.xl};\n --zendir-font-size-xxl: ${typography.fontSize.xxl};\n --zendir-font-weight-light: ${typography.fontWeight.light};\n --zendir-font-weight-normal: ${typography.fontWeight.normal};\n --zendir-font-weight-medium: ${typography.fontWeight.medium};\n --zendir-font-weight-bold: ${typography.fontWeight.bold};\n \n /* Shadows */\n --zendir-shadow-sm: ${shadows.sm};\n --zendir-shadow-md: ${shadows.md};\n --zendir-shadow-lg: ${shadows.lg};\n --zendir-shadow-xl: ${shadows.xl};\n --zendir-shadow-glow: ${shadows.glow};\n \n /* Animation */\n --zendir-animation-fast: ${animation.fast};\n --zendir-animation-normal: ${animation.normal};\n --zendir-animation-slow: ${animation.slow};\n}\n`.trim();\n}\n\nexport default {\n colors,\n spacing,\n borderRadius,\n typography,\n shadows,\n animation,\n generateCSSVariables,\n};\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"index.js","sources":["../../src/tokens/index.ts"],"sourcesContent":["/**\n * @zendir/ui - Design Tokens\n * \n * Exportable design tokens for use in CSS and JavaScript.\n * Based on Astro UX Design System.\n */\n\nexport const colors = {\n // Status Colors (Dark Theme)\n status: {\n critical: '#ff3838',\n serious: '#ffb302',\n caution: '#fce83a',\n normal: '#56f000',\n standby: '#2dccff',\n off: '#a4abb6',\n },\n \n // Status Colors (Light Theme - Fill)\n statusLightFill: {\n critical: '#ff2a04',\n serious: '#ffaf3d',\n caution: '#fad800',\n normal: '#00e200',\n standby: '#64d9ff',\n off: '#7b8089',\n },\n \n // Status Colors (Light Theme - Border)\n statusLightBorder: {\n critical: '#661102',\n serious: '#664618',\n caution: '#645600',\n normal: '#005a00',\n standby: '#285766',\n off: '#3c3e42',\n },\n \n // Background Colors\n background: {\n dark: {\n base: '#101923',\n surface: '#1b2d3e',\n elevated: '#243647',\n overlay: 'rgba(0, 0, 0, 0.7)',\n },\n light: {\n base: '#f5f6f9',\n surface: '#ffffff',\n elevated: '#ffffff',\n overlay: 'rgba(0, 0, 0, 0.5)',\n },\n },\n \n // Text Colors\n text: {\n dark: {\n primary: '#ffffff',\n secondary: '#9ea7ad',\n tertiary: '#6b7175',\n muted: '#52595f',\n },\n light: {\n primary: '#1b2d3e',\n secondary: '#4c5a67',\n tertiary: '#7a8891',\n muted: '#a4adb5',\n },\n },\n \n // Accent Colors\n accent: {\n primary: '#4dacff',\n secondary: '#3d8ddb',\n tertiary: '#2e6eb3',\n },\n \n // Border Colors\n border: {\n dark: {\n default: '#3c4b5a',\n muted: '#2b3d4e',\n focus: '#4dacff',\n },\n light: {\n default: '#c4c8cc',\n muted: '#e1e4e8',\n focus: '#4dacff',\n },\n },\n} as const;\n\nexport const spacing = {\n xs: '4px',\n sm: '8px',\n md: '16px',\n lg: '24px',\n xl: '32px',\n xxl: '48px',\n} as const;\n\nexport const borderRadius = {\n none: '0',\n sm: '2px',\n md: '4px',\n lg: '8px',\n xl: '16px',\n full: '9999px',\n} as const;\n\n/**\n * Typography tokens following AstroUXDS Design System\n * @see https://www.astrouxds.com/foundations/typography/\n * \n * Font weights per Astro spec: 300 (Light), 400 (Regular), 500 (Medium), 700 (Bold)\n * Note: Astro does NOT use 600 (semibold) - use 500 (medium) or 700 (bold) instead\n */\nexport const typography = {\n fontFamily: {\n /** Heading font: Sora (Zendir Brand Standard) */\n heading: '\"Sora\", \"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif',\n /** Primary font: Public Sans (Zendir Brand Standard) */\n primary: '\"Public Sans\", \"Roboto\", -apple-system, BlinkMacSystemFont, \"Segoe UI\", \"Helvetica Neue\", Arial, sans-serif',\n /** Monospace font: Roboto Mono for data/code */\n mono: '\"Roboto Mono\", \"SF Mono\", \"Consolas\", \"Liberation Mono\", monospace',\n },\n fontSize: {\n // Compact sizes for dense UIs (cards, badges, data labels)\n micro: '0.5625rem', // 9px - very tight spaces\n xxs: '0.625rem', // 10px - compact labels\n // Standard sizes\n xs: '0.75rem', // 12px - small text, body3\n sm: '0.875rem', // 14px - body2\n base: '1rem', // 16px - body1\n md: '1.125rem', // 18px - h5/h6\n lg: '1.25rem', // 20px - h3/h4\n xl: '1.5rem', // 24px - h2\n xxl: '2.125rem', // 34px - h1\n xxxl: '3rem', // 48px - display2\n display: '3.75rem', // 60px - display1\n },\n /**\n * Font weights per AstroUXDS specification\n * Only 300, 400, 500, 700 are officially supported\n */\n fontWeight: {\n light: 300,\n normal: 400,\n regular: 400, // Alias for normal\n medium: 500,\n bold: 700,\n // DEPRECATED: semibold is not in Astro spec, use medium (500) instead\n /** @deprecated Use medium (500) instead - Astro spec only supports 300, 400, 500, 700 */\n semibold: 500,\n },\n lineHeight: {\n tight: 1.25,\n normal: 1.5,\n relaxed: 1.75,\n },\n} as const;\n\nexport const shadows = {\n none: 'none',\n sm: '0 1px 2px rgba(0, 0, 0, 0.3)',\n md: '0 2px 8px rgba(0, 0, 0, 0.3)',\n lg: '0 4px 16px rgba(0, 0, 0, 0.3)',\n xl: '0 8px 32px rgba(0, 0, 0, 0.4)',\n glow: '0 0 20px rgba(77, 172, 255, 0.4)',\n} as const;\n\nexport const animation = {\n fast: '150ms ease',\n normal: '250ms ease',\n slow: '400ms ease',\n} as const;\n\n// CSS Custom Properties generator\nexport function generateCSSVariables(mode: 'dark' | 'light' = 'dark'): string {\n const bg = colors.background[mode];\n const txt = colors.text[mode];\n const bdr = colors.border[mode];\n \n return `\n:root {\n /* Status Colors */\n --zendir-status-critical: ${colors.status.critical};\n --zendir-status-serious: ${colors.status.serious};\n --zendir-status-caution: ${colors.status.caution};\n --zendir-status-normal: ${colors.status.normal};\n --zendir-status-standby: ${colors.status.standby};\n --zendir-status-off: ${colors.status.off};\n \n /* Background */\n --zendir-bg-base: ${bg.base};\n --zendir-bg-surface: ${bg.surface};\n --zendir-bg-elevated: ${bg.elevated};\n --zendir-bg-overlay: ${bg.overlay};\n \n /* Text */\n --zendir-text-primary: ${txt.primary};\n --zendir-text-secondary: ${txt.secondary};\n --zendir-text-tertiary: ${txt.tertiary};\n --zendir-text-muted: ${txt.muted};\n \n /* Accent */\n --zendir-accent-primary: ${colors.accent.primary};\n --zendir-accent-secondary: ${colors.accent.secondary};\n --zendir-accent-tertiary: ${colors.accent.tertiary};\n \n /* Border */\n --zendir-border-default: ${bdr.default};\n --zendir-border-muted: ${bdr.muted};\n --zendir-border-focus: ${bdr.focus};\n \n /* Spacing */\n --zendir-spacing-xs: ${spacing.xs};\n --zendir-spacing-sm: ${spacing.sm};\n --zendir-spacing-md: ${spacing.md};\n --zendir-spacing-lg: ${spacing.lg};\n --zendir-spacing-xl: ${spacing.xl};\n --zendir-spacing-xxl: ${spacing.xxl};\n \n /* Border Radius */\n --zendir-radius-sm: ${borderRadius.sm};\n --zendir-radius-md: ${borderRadius.md};\n --zendir-radius-lg: ${borderRadius.lg};\n --zendir-radius-xl: ${borderRadius.xl};\n --zendir-radius-full: ${borderRadius.full};\n \n /* Typography - AstroUXDS Compliant */\n --zendir-font-primary: ${typography.fontFamily.primary};\n --zendir-font-mono: ${typography.fontFamily.mono};\n --zendir-font-size-micro: ${typography.fontSize.micro};\n --zendir-font-size-xxs: ${typography.fontSize.xxs};\n --zendir-font-size-xs: ${typography.fontSize.xs};\n --zendir-font-size-sm: ${typography.fontSize.sm};\n --zendir-font-size-base: ${typography.fontSize.base};\n --zendir-font-size-md: ${typography.fontSize.md};\n --zendir-font-size-lg: ${typography.fontSize.lg};\n --zendir-font-size-xl: ${typography.fontSize.xl};\n --zendir-font-size-xxl: ${typography.fontSize.xxl};\n --zendir-font-weight-light: ${typography.fontWeight.light};\n --zendir-font-weight-normal: ${typography.fontWeight.normal};\n --zendir-font-weight-medium: ${typography.fontWeight.medium};\n --zendir-font-weight-bold: ${typography.fontWeight.bold};\n \n /* Shadows */\n --zendir-shadow-sm: ${shadows.sm};\n --zendir-shadow-md: ${shadows.md};\n --zendir-shadow-lg: ${shadows.lg};\n --zendir-shadow-xl: ${shadows.xl};\n --zendir-shadow-glow: ${shadows.glow};\n \n /* Animation */\n --zendir-animation-fast: ${animation.fast};\n --zendir-animation-normal: ${animation.normal};\n --zendir-animation-slow: ${animation.slow};\n}\n`.trim();\n}\n\nexport default {\n colors,\n spacing,\n borderRadius,\n typography,\n shadows,\n animation,\n generateCSSVariables,\n};\n"],"names":[],"mappings":"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"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@zendir/ui",
3
- "version": "0.1.5",
3
+ "version": "0.1.7",
4
4
  "description": "React UI components for space operations, built on the Astro UX Design System",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -16,7 +16,7 @@
16
16
  },
17
17
  "./react": {
18
18
  "types": "./dist/react/index.d.ts",
19
- "import": "./dist/react/index.js"
19
+ "import": "./dist/react.js"
20
20
  },
21
21
  "./react/core": {
22
22
  "types": "./dist/react/core/index.d.ts",
@@ -38,6 +38,86 @@
38
38
  "types": "./dist/react/chatgpt/index.d.ts",
39
39
  "import": "./dist/react/chatgpt/index.js"
40
40
  },
41
+ "./react/theme": {
42
+ "types": "./dist/react/theme/ThemeProvider.d.ts",
43
+ "import": "./dist/react/theme/ThemeProvider.js"
44
+ },
45
+ "./react/core/GlassCard": {
46
+ "types": "./dist/react/core/GlassCard.d.ts",
47
+ "import": "./dist/react/core/GlassCard.js"
48
+ },
49
+ "./react/core/Button": {
50
+ "types": "./dist/react/core/Button.d.ts",
51
+ "import": "./dist/react/core/Button.js"
52
+ },
53
+ "./react/core/Input": {
54
+ "types": "./dist/react/core/Input.d.ts",
55
+ "import": "./dist/react/core/Input.js"
56
+ },
57
+ "./react/core/Select": {
58
+ "types": "./dist/react/core/Select.d.ts",
59
+ "import": "./dist/react/core/Select.js"
60
+ },
61
+ "./react/core/Checkbox": {
62
+ "types": "./dist/react/core/Checkbox.d.ts",
63
+ "import": "./dist/react/core/Checkbox.js"
64
+ },
65
+ "./react/core/Badge": {
66
+ "types": "./dist/react/core/Badge.d.ts",
67
+ "import": "./dist/react/core/Badge.js"
68
+ },
69
+ "./react/core/Typography": {
70
+ "types": "./dist/react/core/Typography.d.ts",
71
+ "import": "./dist/react/core/Typography.js"
72
+ },
73
+ "./react/core/Dialog": {
74
+ "types": "./dist/react/core/Dialog.d.ts",
75
+ "import": "./dist/react/core/Dialog.js"
76
+ },
77
+ "./react/core/ConfirmDialog": {
78
+ "types": "./dist/react/core/ConfirmDialog.d.ts",
79
+ "import": "./dist/react/core/ConfirmDialog.js"
80
+ },
81
+ "./react/core/Tabs": {
82
+ "types": "./dist/react/core/Tabs.d.ts",
83
+ "import": "./dist/react/core/Tabs.js"
84
+ },
85
+ "./react/core/Toggle": {
86
+ "types": "./dist/react/core/Toggle.d.ts",
87
+ "import": "./dist/react/core/Toggle.js"
88
+ },
89
+ "./react/core/Tooltip": {
90
+ "types": "./dist/react/core/Tooltip.d.ts",
91
+ "import": "./dist/react/core/Tooltip.js"
92
+ },
93
+ "./react/core/Popover": {
94
+ "types": "./dist/react/core/Popover.d.ts",
95
+ "import": "./dist/react/core/Popover.js"
96
+ },
97
+ "./react/core/Toast": {
98
+ "types": "./dist/react/core/Toast.d.ts",
99
+ "import": "./dist/react/core/Toast.js"
100
+ },
101
+ "./react/core/NumberInput": {
102
+ "types": "./dist/react/core/NumberInput.d.ts",
103
+ "import": "./dist/react/core/NumberInput.js"
104
+ },
105
+ "./react/core/PinInput": {
106
+ "types": "./dist/react/core/PinInput.d.ts",
107
+ "import": "./dist/react/core/PinInput.js"
108
+ },
109
+ "./react/core/SideNav": {
110
+ "types": "./dist/react/core/SideNav.d.ts",
111
+ "import": "./dist/react/core/SideNav.js"
112
+ },
113
+ "./react/layout/Flex": {
114
+ "types": "./dist/react/core/layout/Flex.d.ts",
115
+ "import": "./dist/react/core/layout/Flex.js"
116
+ },
117
+ "./react/layout/Grid": {
118
+ "types": "./dist/react/core/layout/Grid.d.ts",
119
+ "import": "./dist/react/core/layout/Grid.js"
120
+ },
41
121
  "./tokens": {
42
122
  "types": "./dist/tokens/index.d.ts",
43
123
  "import": "./dist/tokens/index.js"