@airlock-hq/design-system 0.1.0

package/README.md

@@ -0,0 +1,13 @@
+# @airlock-hq/design-system
+
+Airlock's shared design system package for semantic tokens and React primitives.
+
+## Exports
+
+- `@airlock-hq/design-system/react`
+- `@airlock-hq/design-system/theme.css`
+- `@airlock-hq/design-system/styles.css`
+
+## Local usage
+
+In this repository, the Tauri app consumes this package via local path aliases.

package/dist/index.d.ts

@@ -0,0 +1 @@
+export * from './react';

package/dist/index.js

@@ -0,0 +1,50 @@
+import { A as t, a as e, b as o, B as r, c as l, C as i, d as n, e as g, f as D, g as T, h as c, D as S, i as p, j as C, k as d, l as u, m as b, n as B, o as A, p as L, q as V, I as m, L as v, S as x, r as F, s as H, t as I, u as P, v as f, w, x as y, y as G, z as O, E as U, F as h, T as j, G as k, H as q, J as z, K as E, M as J, N as K, O as M, P as N, Q, R, U as W } from "./tooltip-D_CcZ2wZ.js";
+export {
+  t as Alert,
+  e as AlertDescription,
+  o as AlertTitle,
+  r as Badge,
+  l as Button,
+  i as Card,
+  n as CardContent,
+  g as CardDescription,
+  D as CardFooter,
+  T as CardHeader,
+  c as CardTitle,
+  S as Dialog,
+  p as DialogClose,
+  C as DialogContent,
+  d as DialogDescription,
+  u as DialogFooter,
+  b as DialogHeader,
+  B as DialogOverlay,
+  A as DialogPortal,
+  L as DialogTitle,
+  V as DialogTrigger,
+  m as Input,
+  v as Label,
+  x as Select,
+  F as SelectContent,
+  H as SelectGroup,
+  I as SelectItem,
+  P as SelectLabel,
+  f as SelectScrollDownButton,
+  w as SelectScrollUpButton,
+  y as SelectSeparator,
+  G as SelectTrigger,
+  O as SelectValue,
+  U as Separator,
+  h as StatusDot,
+  j as Tabs,
+  k as TabsContent,
+  q as TabsList,
+  z as TabsTrigger,
+  E as Textarea,
+  J as Tooltip,
+  K as TooltipContent,
+  M as TooltipProvider,
+  N as TooltipTrigger,
+  Q as badgeVariants,
+  R as buttonVariants,
+  W as statusDotVariants
+};

package/dist/react/alert.d.ts

@@ -0,0 +1,8 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const Alert: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & VariantProps<(props?: ({
+    variant?: "default" | "danger" | "destructive" | "warning" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
+declare const AlertTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const AlertDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+export { Alert, AlertTitle, AlertDescription };

package/dist/react/badge.d.ts

@@ -0,0 +1,9 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const badgeVariants: (props?: ({
+    variant?: "default" | "danger" | "destructive" | "warning" | "signal" | "secondary" | "outline" | "success" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {
+}
+declare function Badge({ className, variant, ...props }: BadgeProps): import("react/jsx-runtime").JSX.Element;
+export { Badge, badgeVariants };

package/dist/react/button.d.ts

@@ -0,0 +1,11 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const buttonVariants: (props?: ({
+    variant?: "default" | "danger" | "destructive" | "link" | "signal" | "secondary" | "outline" | "ghost" | null | undefined;
+    size?: "default" | "sm" | "lg" | "icon" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
+    asChild?: boolean;
+}
+declare const Button: React.ForwardRefExoticComponent<ButtonProps & React.RefAttributes<HTMLButtonElement>>;
+export { Button, buttonVariants };

package/dist/react/card.d.ts

@@ -0,0 +1,8 @@
+import * as React from 'react';
+declare const Card: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardHeader: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardTitle: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLHeadingElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const CardDescription: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLParagraphElement> & React.RefAttributes<HTMLParagraphElement>>;
+declare const CardContent: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+declare const CardFooter: React.ForwardRefExoticComponent<React.HTMLAttributes<HTMLDivElement> & React.RefAttributes<HTMLDivElement>>;
+export { Card, CardHeader, CardFooter, CardTitle, CardDescription, CardContent };

package/dist/react/dialog.d.ts

@@ -0,0 +1,19 @@
+import * as React from 'react';
+import * as DialogPrimitive from '@radix-ui/react-dialog';
+declare const Dialog: React.FC<DialogPrimitive.DialogProps>;
+declare const DialogTrigger: React.ForwardRefExoticComponent<DialogPrimitive.DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogPortal: React.FC<DialogPrimitive.DialogPortalProps>;
+declare const DialogClose: React.ForwardRefExoticComponent<DialogPrimitive.DialogCloseProps & React.RefAttributes<HTMLButtonElement>>;
+declare const DialogOverlay: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogOverlayProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DialogContent: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const DialogHeader: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const DialogFooter: {
+    ({ className, ...props }: React.HTMLAttributes<HTMLDivElement>): import("react/jsx-runtime").JSX.Element;
+    displayName: string;
+};
+declare const DialogTitle: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogTitleProps & React.RefAttributes<HTMLHeadingElement>, "ref"> & React.RefAttributes<HTMLHeadingElement>>;
+declare const DialogDescription: React.ForwardRefExoticComponent<Omit<DialogPrimitive.DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>, "ref"> & React.RefAttributes<HTMLParagraphElement>>;
+export { Dialog, DialogPortal, DialogOverlay, DialogTrigger, DialogClose, DialogContent, DialogHeader, DialogFooter, DialogTitle, DialogDescription, };

package/dist/react/index.d.ts

@@ -0,0 +1,13 @@
+export * from './alert';
+export * from './badge';
+export * from './button';
+export * from './card';
+export * from './dialog';
+export * from './input';
+export * from './label';
+export * from './select';
+export * from './separator';
+export * from './status-dot';
+export * from './tabs';
+export * from './textarea';
+export * from './tooltip';

package/dist/react/input.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const Input: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & React.RefAttributes<HTMLInputElement>>;
+export { Input };

package/dist/react/label.d.ts

@@ -0,0 +1,5 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+import * as LabelPrimitive from '@radix-ui/react-label';
+declare const Label: React.ForwardRefExoticComponent<Omit<LabelPrimitive.LabelProps & React.RefAttributes<HTMLLabelElement>, "ref"> & VariantProps<(props?: import('class-variance-authority/types').ClassProp | undefined) => string> & React.RefAttributes<HTMLLabelElement>>;
+export { Label };

package/dist/react/select.d.ts

@@ -0,0 +1,13 @@
+import * as React from 'react';
+import * as SelectPrimitive from '@radix-ui/react-select';
+declare const Select: React.FC<SelectPrimitive.SelectProps>;
+declare const SelectGroup: React.ForwardRefExoticComponent<SelectPrimitive.SelectGroupProps & React.RefAttributes<HTMLDivElement>>;
+declare const SelectValue: React.ForwardRefExoticComponent<SelectPrimitive.SelectValueProps & React.RefAttributes<HTMLSpanElement>>;
+declare const SelectTrigger: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & React.RefAttributes<HTMLButtonElement>>;
+declare const SelectScrollUpButton: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectScrollUpButtonProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectScrollDownButton: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectScrollDownButtonProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectContent: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectLabel: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectLabelProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectItem: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectItemProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+declare const SelectSeparator: React.ForwardRefExoticComponent<Omit<SelectPrimitive.SelectSeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Select, SelectGroup, SelectValue, SelectTrigger, SelectContent, SelectLabel, SelectItem, SelectSeparator, SelectScrollUpButton, SelectScrollDownButton, };

package/dist/react/separator.d.ts

@@ -0,0 +1,4 @@
+import * as React from 'react';
+import * as SeparatorPrimitive from '@radix-ui/react-separator';
+declare const Separator: React.ForwardRefExoticComponent<Omit<SeparatorPrimitive.SeparatorProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Separator };

package/dist/react/status-dot.d.ts

@@ -0,0 +1,11 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+declare const statusDotVariants: (props?: ({
+    variant?: "danger" | "warning" | "signal" | "success" | "muted" | null | undefined;
+    size?: "sm" | "md" | null | undefined;
+    pulse?: boolean | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string;
+export interface StatusDotProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof statusDotVariants> {
+}
+declare function StatusDot({ className, variant, size, pulse, ...props }: StatusDotProps): import("react/jsx-runtime").JSX.Element;
+export { StatusDot, statusDotVariants };

package/dist/react/tabs.d.ts

@@ -0,0 +1,12 @@
+import { VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+declare const Tabs: React.ForwardRefExoticComponent<TabsPrimitive.TabsProps & React.RefAttributes<HTMLDivElement>>;
+declare const TabsList: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsListProps & React.RefAttributes<HTMLDivElement>, "ref"> & VariantProps<(props?: ({
+    variant?: "default" | "line" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string> & React.RefAttributes<HTMLDivElement>>;
+declare const TabsTrigger: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsTriggerProps & React.RefAttributes<HTMLButtonElement>, "ref"> & VariantProps<(props?: ({
+    variant?: "default" | "line" | null | undefined;
+} & import('class-variance-authority/types').ClassProp) | undefined) => string> & React.RefAttributes<HTMLButtonElement>>;
+declare const TabsContent: React.ForwardRefExoticComponent<Omit<TabsPrimitive.TabsContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Tabs, TabsList, TabsTrigger, TabsContent };

package/dist/react/textarea.d.ts

@@ -0,0 +1,3 @@
+import * as React from 'react';
+declare const Textarea: React.ForwardRefExoticComponent<Omit<React.DetailedHTMLProps<React.TextareaHTMLAttributes<HTMLTextAreaElement>, HTMLTextAreaElement>, "ref"> & React.RefAttributes<HTMLTextAreaElement>>;
+export { Textarea };

package/dist/react/tooltip.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+import * as TooltipPrimitive from '@radix-ui/react-tooltip';
+declare const TooltipProvider: React.FC<TooltipPrimitive.TooltipProviderProps>;
+declare const Tooltip: React.FC<TooltipPrimitive.TooltipProps>;
+declare const TooltipTrigger: React.ForwardRefExoticComponent<TooltipPrimitive.TooltipTriggerProps & React.RefAttributes<HTMLButtonElement>>;
+declare const TooltipContent: React.ForwardRefExoticComponent<Omit<TooltipPrimitive.TooltipContentProps & React.RefAttributes<HTMLDivElement>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+export { Tooltip, TooltipTrigger, TooltipContent, TooltipProvider };

package/dist/react.js

@@ -0,0 +1,50 @@
+import { A as t, a as e, b as o, B as r, c as l, C as i, d as n, e as g, f as D, g as T, h as c, D as S, i as p, j as C, k as d, l as u, m as b, n as B, o as A, p as L, q as V, I as m, L as v, S as x, r as F, s as H, t as I, u as P, v as f, w, x as y, y as G, z as O, E as U, F as h, T as j, G as k, H as q, J as z, K as E, M as J, N as K, O as M, P as N, Q, R, U as W } from "./tooltip-D_CcZ2wZ.js";
+export {
+  t as Alert,
+  e as AlertDescription,
+  o as AlertTitle,
+  r as Badge,
+  l as Button,
+  i as Card,
+  n as CardContent,
+  g as CardDescription,
+  D as CardFooter,
+  T as CardHeader,
+  c as CardTitle,
+  S as Dialog,
+  p as DialogClose,
+  C as DialogContent,
+  d as DialogDescription,
+  u as DialogFooter,
+  b as DialogHeader,
+  B as DialogOverlay,
+  A as DialogPortal,
+  L as DialogTitle,
+  V as DialogTrigger,
+  m as Input,
+  v as Label,
+  x as Select,
+  F as SelectContent,
+  H as SelectGroup,
+  I as SelectItem,
+  P as SelectLabel,
+  f as SelectScrollDownButton,
+  w as SelectScrollUpButton,
+  y as SelectSeparator,
+  G as SelectTrigger,
+  O as SelectValue,
+  U as Separator,
+  h as StatusDot,
+  j as Tabs,
+  k as TabsContent,
+  q as TabsList,
+  z as TabsTrigger,
+  E as Textarea,
+  J as Tooltip,
+  K as TooltipContent,
+  M as TooltipProvider,
+  N as TooltipTrigger,
+  Q as badgeVariants,
+  R as buttonVariants,
+  W as statusDotVariants
+};

package/dist/theme.css

@@ -0,0 +1,69 @@
+@import 'tw-animate-css';
+@import './tokens.css';
+
+@theme {
+  --font-sans: var(--font-sans);
+  --font-mono: var(--font-mono);
+
+  --text-display: var(--text-display);
+  --text-display--line-height: var(--text-display-line-height);
+  --text-display--letter-spacing: var(--text-display-letter-spacing);
+  --text-h1: var(--text-h1);
+  --text-h1--line-height: var(--text-h1-line-height);
+  --text-h2: var(--text-h2);
+  --text-h2--line-height: var(--text-h2-line-height);
+  --text-body: var(--text-body);
+  --text-body--line-height: var(--text-body-line-height);
+  --text-small: var(--text-small);
+  --text-small--line-height: var(--text-small-line-height);
+  --text-micro: var(--text-micro);
+  --text-micro--line-height: var(--text-micro-line-height);
+  --text-micro--letter-spacing: var(--text-micro-letter-spacing);
+
+  --color-background: hsl(var(--background));
+  --color-surface: hsl(var(--surface));
+  --color-surface-elevated: hsl(var(--surface-elevated));
+  --color-foreground: hsl(var(--foreground));
+  --color-foreground-muted: hsl(var(--foreground-muted));
+  --color-border: hsl(var(--border));
+  --color-border-subtle: hsl(var(--border-subtle));
+  --color-signal: hsl(var(--signal));
+  --color-signal-subtle: hsl(var(--signal-subtle));
+  --color-signal-glow: hsl(var(--signal-glow));
+  --color-signal-active: hsl(var(--signal-active));
+  --color-signal-focus: hsl(var(--signal-focus));
+  --color-signal-attention: hsl(var(--signal-attention));
+  --color-success: hsl(var(--success));
+  --color-warning: hsl(var(--warning));
+  --color-danger: hsl(var(--danger));
+  --color-destructive: hsl(var(--danger));
+  --color-ring: hsl(var(--ring));
+  --color-atmosphere-orbit-line: hsl(var(--atmosphere-orbit-line));
+  --color-terminal: hsl(var(--terminal));
+  --color-terminal-foreground: hsl(var(--terminal-foreground));
+  --color-terminal-muted: hsl(var(--terminal-muted));
+  --color-terminal-border: hsl(var(--terminal-border));
+
+  --radius-lg: var(--radius);
+  --radius-md: calc(var(--radius) - 2px);
+  --radius-sm: calc(var(--radius) - 4px);
+
+  @keyframes accordion-down {
+    from {
+      height: 0;
+    }
+    to {
+      height: var(--radix-accordion-content-height);
+    }
+  }
+  @keyframes accordion-up {
+    from {
+      height: var(--radix-accordion-content-height);
+    }
+    to {
+      height: 0;
+    }
+  }
+  --animate-accordion-down: accordion-down 0.2s ease-out;
+  --animate-accordion-up: accordion-up 0.2s ease-out;
+}

package/dist/tokens.css

@@ -0,0 +1,72 @@
+@import '@fontsource-variable/inter';
+@import '@fontsource-variable/jetbrains-mono';
+
+:root {
+  --radius: 0.625rem;
+
+  /* Typography */
+  --font-sans:
+    'Inter Variable', Inter, ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, Arial, 'Apple Color Emoji',
+    'Segoe UI Emoji';
+  --font-mono:
+    'JetBrains Mono Variable', 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas,
+    'Liberation Mono', 'Courier New', monospace;
+
+  /* Type scale */
+  --text-display: 3rem;
+  --text-display-line-height: 3.5rem;
+  --text-display-letter-spacing: -0.02em;
+  --text-h1: 2rem;
+  --text-h1-line-height: 2.5rem;
+  --text-h2: 1.5rem;
+  --text-h2-line-height: 2rem;
+  --text-body: 1rem;
+  --text-body-line-height: 1.5rem;
+  --text-small: 0.875rem;
+  --text-small-line-height: 1.25rem;
+  --text-micro: 0.75rem;
+  --text-micro-line-height: 1rem;
+  --text-micro-letter-spacing: 0.08em;
+
+  /* Surfaces (cooled for NASA lab vibe) */
+  --background: 0 0% 100%;
+  --surface: 220 25% 98%;
+  --surface-elevated: 220 25% 96%;
+
+  /* Text */
+  --foreground: 220 30% 10%;
+  --foreground-muted: 220 15% 45%;
+
+  /* Borders */
+  --border: 220 20% 88%;
+  --border-subtle: 220 20% 92%;
+
+  /* Orbital violet signal */
+  --signal: 250 55% 55%;
+  --signal-subtle: 250 60% 96%;
+  --signal-glow: 250 70% 65%;
+
+  /* Signal state variants */
+  --signal-active: 250 55% 55%;
+  --signal-focus: 250 55% 55%;
+  --signal-attention: 250 60% 50%;
+
+  /* Status */
+  --success: 145 60% 40%;
+  --warning: 38 90% 50%;
+  --danger: 0 70% 50%;
+
+  /* Focus */
+  --ring: 250 55% 55%;
+
+  /* Atmosphere (landing / decorative layers) */
+  --atmosphere-orbit-line: 220 20% 90%;
+  --atmosphere-glow-opacity: 0.08;
+  --atmosphere-particle-opacity: 0.12;
+
+  /* Log/terminal */
+  --terminal: 220 20% 9%;
+  --terminal-foreground: 220 15% 92%;
+  --terminal-muted: 220 15% 16%;
+  --terminal-border: 220 15% 22%;
+}

package/dist/tooltip-D_CcZ2wZ.js

@@ -0,0 +1,426 @@
+import { jsx as r, jsxs as g } from "react/jsx-runtime";
+import * as o from "react";
+import { cva as c } from "class-variance-authority";
+import { Slot as w } from "@radix-ui/react-slot";
+import * as d from "@radix-ui/react-dialog";
+import { X as N, ChevronDown as m, ChevronUp as R, Check as C } from "lucide-react";
+import * as p from "@radix-ui/react-label";
+import * as i from "@radix-ui/react-select";
+import * as b from "@radix-ui/react-separator";
+import * as f from "@radix-ui/react-tabs";
+import * as u from "@radix-ui/react-tooltip";
+import { clsx as T } from "clsx";
+import { twMerge as D } from "tailwind-merge";
+function s(...e) {
+  return D(T(e));
+}
+const S = c(
+  "relative w-full rounded-lg border px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground [&>svg~*]:pl-7",
+  {
+    variants: {
+      variant: {
+        default: "bg-background text-foreground",
+        danger: "border-danger/30 bg-danger/5 text-danger [&>svg]:text-danger",
+        destructive: "border-danger/30 bg-danger/5 text-danger [&>svg]:text-danger",
+        warning: "border-warning/30 bg-warning/10 text-warning [&>svg]:text-warning"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+), k = o.forwardRef(({ className: e, variant: a, ...t }, n) => /* @__PURE__ */ r("div", { ref: n, role: "alert", className: s(S({ variant: a }), e), ...t }));
+k.displayName = "Alert";
+const V = o.forwardRef(
+  ({ className: e, ...a }, t) => /* @__PURE__ */ r("h5", { ref: t, className: s("mb-1 leading-none font-medium tracking-tight", e), ...a })
+);
+V.displayName = "AlertTitle";
+const z = o.forwardRef(
+  ({ className: e, ...a }, t) => /* @__PURE__ */ r("div", { ref: t, className: s("text-sm [&_p]:leading-relaxed", e), ...a })
+);
+z.displayName = "AlertDescription";
+const P = c(
+  "inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-hidden focus:ring-2 focus:ring-ring focus:ring-offset-2",
+  {
+    variants: {
+      variant: {
+        default: "border-border-subtle bg-surface text-foreground hover:bg-surface-elevated",
+        signal: "border-transparent bg-signal-subtle text-signal hover:bg-signal-subtle/70",
+        secondary: "border-transparent bg-surface-elevated text-foreground hover:bg-surface",
+        danger: "border-transparent bg-danger/10 text-danger hover:bg-danger/20",
+        destructive: "border-transparent bg-danger/10 text-danger hover:bg-danger/20",
+        outline: "text-foreground",
+        success: "border-transparent bg-success/10 text-success hover:bg-success/20",
+        warning: "border-transparent bg-warning/10 text-warning hover:bg-warning/20"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+);
+function be({ className: e, variant: a, ...t }) {
+  return /* @__PURE__ */ r("div", { className: s(P({ variant: a }), e), ...t });
+}
+const j = c(
+  "inline-flex cursor-pointer items-center justify-center whitespace-nowrap rounded-md text-sm font-medium ring-offset-background transition-colors focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+  {
+    variants: {
+      variant: {
+        default: "bg-surface text-foreground hover:bg-surface-elevated",
+        signal: "border border-border bg-background text-foreground hover:border-signal hover:shadow-[0_0_12px_hsl(var(--signal-glow)/0.3)] hover:text-signal",
+        danger: "bg-danger text-background hover:opacity-90",
+        destructive: "bg-danger text-background hover:opacity-90",
+        outline: "border border-border-subtle bg-background hover:bg-surface hover:text-foreground",
+        secondary: "bg-surface-elevated text-foreground hover:bg-surface",
+        ghost: "hover:bg-surface-elevated hover:text-foreground",
+        link: "text-signal underline-offset-4 hover:underline"
+      },
+      size: {
+        default: "h-10 px-4 py-2",
+        sm: "h-9 rounded-md px-3",
+        lg: "h-11 rounded-md px-8",
+        icon: "h-10 w-10"
+      }
+    },
+    defaultVariants: {
+      variant: "default",
+      size: "default"
+    }
+  }
+), B = o.forwardRef(
+  ({ className: e, variant: a, size: t, asChild: n = !1, ...l }, y) => /* @__PURE__ */ r(n ? w : "button", { className: s(j({ variant: a, size: t, className: e })), ref: y, ...l })
+);
+B.displayName = "Button";
+const I = o.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(
+  "div",
+  {
+    ref: t,
+    className: s("border-border-subtle bg-surface text-foreground rounded-lg border shadow-xs", e),
+    ...a
+  }
+));
+I.displayName = "Card";
+const L = o.forwardRef(
+  ({ className: e, ...a }, t) => /* @__PURE__ */ r("div", { ref: t, className: s("flex flex-col space-y-1.5 p-6", e), ...a })
+);
+L.displayName = "CardHeader";
+const A = o.forwardRef(
+  ({ className: e, ...a }, t) => /* @__PURE__ */ r("h3", { ref: t, className: s("text-2xl leading-none font-semibold tracking-tight", e), ...a })
+);
+A.displayName = "CardTitle";
+const F = o.forwardRef(
+  ({ className: e, ...a }, t) => /* @__PURE__ */ r("p", { ref: t, className: s("text-foreground-muted text-sm", e), ...a })
+);
+F.displayName = "CardDescription";
+const H = o.forwardRef(
+  ({ className: e, ...a }, t) => /* @__PURE__ */ r("div", { ref: t, className: s("p-6 pt-0", e), ...a })
+);
+H.displayName = "CardContent";
+const U = o.forwardRef(
+  ({ className: e, ...a }, t) => /* @__PURE__ */ r("div", { ref: t, className: s("flex items-center p-6 pt-0", e), ...a })
+);
+U.displayName = "CardFooter";
+const xe = d.Root, ve = d.Trigger, O = d.Portal, he = d.Close, x = o.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(
+  d.Overlay,
+  {
+    ref: t,
+    className: s(
+      "bg-foreground/25 data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50",
+      e
+    ),
+    ...a
+  }
+));
+x.displayName = d.Overlay.displayName;
+const _ = o.forwardRef(({ className: e, children: a, ...t }, n) => /* @__PURE__ */ g(O, { children: [
+  /* @__PURE__ */ r(x, {}),
+  /* @__PURE__ */ g(
+    d.Content,
+    {
+      ref: n,
+      className: s(
+        "border-border-subtle bg-background data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed top-[50%] left-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200",
+        e
+      ),
+      ...t,
+      children: [
+        a,
+        /* @__PURE__ */ g(d.Close, { className: "ring-offset-background focus:ring-ring data-[state=open]:bg-surface-elevated data-[state=open]:text-foreground-muted absolute top-4 right-4 rounded-xs opacity-70 transition-opacity hover:opacity-100 focus:ring-2 focus:ring-offset-2 focus:outline-hidden disabled:pointer-events-none", children: [
+          /* @__PURE__ */ r(N, { className: "h-4 w-4" }),
+          /* @__PURE__ */ r("span", { className: "sr-only", children: "Close" })
+        ] })
+      ]
+    }
+  )
+] }));
+_.displayName = d.Content.displayName;
+const G = ({ className: e, ...a }) => /* @__PURE__ */ r("div", { className: s("flex flex-col space-y-1.5 text-center sm:text-left", e), ...a });
+G.displayName = "DialogHeader";
+const M = ({ className: e, ...a }) => /* @__PURE__ */ r("div", { className: s("flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2", e), ...a });
+M.displayName = "DialogFooter";
+const q = o.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(
+  d.Title,
+  {
+    ref: t,
+    className: s("text-lg leading-none font-semibold tracking-tight", e),
+    ...a
+  }
+));
+q.displayName = d.Title.displayName;
+const E = o.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(d.Description, { ref: t, className: s("text-foreground-muted text-sm", e), ...a }));
+E.displayName = d.Description.displayName;
+const J = o.forwardRef(
+  ({ className: e, type: a, ...t }, n) => /* @__PURE__ */ r(
+    "input",
+    {
+      type: a,
+      className: s(
+        "border-border-subtle bg-background file:text-foreground placeholder:text-foreground-muted focus-visible:ring-ring flex h-9 w-full rounded-md border px-3 py-1 text-base shadow-xs transition-colors file:border-0 file:bg-transparent file:text-sm file:font-medium focus-visible:ring-1 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        e
+      ),
+      ref: n,
+      ...t
+    }
+  )
+);
+J.displayName = "Input";
+const K = c("text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"), Q = o.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(p.Root, { ref: t, className: s(K(), e), ...a }));
+Q.displayName = p.Root.displayName;
+const ye = i.Root, we = i.Group, Ne = i.Value, X = o.forwardRef(({ className: e, children: a, ...t }, n) => /* @__PURE__ */ g(
+  i.Trigger,
+  {
+    ref: n,
+    className: s(
+      "border-border-subtle bg-background ring-offset-background focus:ring-ring data-[placeholder]:text-foreground-muted flex h-9 w-full items-center justify-between rounded-md border px-3 py-2 text-sm whitespace-nowrap shadow-xs focus:ring-1 focus:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1",
+      e
+    ),
+    ...t,
+    children: [
+      a,
+      /* @__PURE__ */ r(i.Icon, { asChild: !0, children: /* @__PURE__ */ r(m, { className: "h-4 w-4 opacity-50" }) })
+    ]
+  }
+));
+X.displayName = i.Trigger.displayName;
+const v = o.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(
+  i.ScrollUpButton,
+  {
+    ref: t,
+    className: s("flex cursor-default items-center justify-center py-1", e),
+    ...a,
+    children: /* @__PURE__ */ r(R, { className: "h-4 w-4" })
+  }
+));
+v.displayName = i.ScrollUpButton.displayName;
+const h = o.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(
+  i.ScrollDownButton,
+  {
+    ref: t,
+    className: s("flex cursor-default items-center justify-center py-1", e),
+    ...a,
+    children: /* @__PURE__ */ r(m, { className: "h-4 w-4" })
+  }
+));
+h.displayName = i.ScrollDownButton.displayName;
+const W = o.forwardRef(({ className: e, children: a, position: t = "popper", ...n }, l) => /* @__PURE__ */ r(i.Portal, { children: /* @__PURE__ */ g(
+  i.Content,
+  {
+    ref: l,
+    className: s(
+      "border-border-subtle bg-surface-elevated text-foreground data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 relative z-50 max-h-[--radix-select-content-available-height] min-w-[8rem] origin-[--radix-select-content-transform-origin] overflow-x-hidden overflow-y-auto rounded-md border shadow-md",
+      t === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
+      e
+    ),
+    position: t,
+    ...n,
+    children: [
+      /* @__PURE__ */ r(v, {}),
+      /* @__PURE__ */ r(
+        i.Viewport,
+        {
+          className: s(
+            "p-1",
+            t === "popper" && "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
+          ),
+          children: a
+        }
+      ),
+      /* @__PURE__ */ r(h, {})
+    ]
+  }
+) }));
+W.displayName = i.Content.displayName;
+const Y = o.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(i.Label, { ref: t, className: s("px-2 py-1.5 text-sm font-semibold", e), ...a }));
+Y.displayName = i.Label.displayName;
+const Z = o.forwardRef(({ className: e, children: a, ...t }, n) => /* @__PURE__ */ g(
+  i.Item,
+  {
+    ref: n,
+    className: s(
+      "focus:bg-surface focus:text-foreground relative flex w-full cursor-default items-center rounded-xs py-1.5 pr-8 pl-2 text-sm outline-hidden select-none data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
+      e
+    ),
+    ...t,
+    children: [
+      /* @__PURE__ */ r("span", { className: "absolute right-2 flex h-3.5 w-3.5 items-center justify-center", children: /* @__PURE__ */ r(i.ItemIndicator, { children: /* @__PURE__ */ r(C, { className: "h-4 w-4" }) }) }),
+      /* @__PURE__ */ r(i.ItemText, { children: a })
+    ]
+  }
+));
+Z.displayName = i.Item.displayName;
+const $ = o.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(i.Separator, { ref: t, className: s("bg-border-subtle -mx-1 my-1 h-px", e), ...a }));
+$.displayName = i.Separator.displayName;
+const ee = o.forwardRef(({ className: e, orientation: a = "horizontal", decorative: t = !0, ...n }, l) => /* @__PURE__ */ r(
+  b.Root,
+  {
+    ref: l,
+    decorative: t,
+    orientation: a,
+    className: s("bg-border shrink-0", a === "horizontal" ? "h-[1px] w-full" : "h-full w-[1px]", e),
+    ...n
+  }
+));
+ee.displayName = b.Root.displayName;
+const ae = c("shrink-0 rounded-full", {
+  variants: {
+    variant: {
+      success: "bg-success",
+      danger: "bg-danger",
+      warning: "bg-warning",
+      signal: "bg-signal",
+      muted: "bg-foreground-muted"
+    },
+    size: {
+      sm: "h-1.5 w-1.5",
+      md: "h-2 w-2"
+    },
+    pulse: {
+      true: "animate-pulse",
+      false: ""
+    }
+  },
+  defaultVariants: {
+    variant: "muted",
+    size: "sm",
+    pulse: !1
+  }
+});
+function Re({ className: e, variant: a, size: t, pulse: n, ...l }) {
+  return /* @__PURE__ */ r("div", { className: s(ae({ variant: a, size: t, pulse: n }), e), ...l });
+}
+const Ce = f.Root, te = c("inline-flex items-center justify-center", {
+  variants: {
+    variant: {
+      default: "h-9 rounded-lg bg-surface p-1 text-foreground-muted",
+      line: "h-auto gap-4 border-b border-border bg-transparent p-0 text-foreground-muted"
+    }
+  },
+  defaultVariants: {
+    variant: "default"
+  }
+}), re = o.forwardRef(({ className: e, variant: a, ...t }, n) => /* @__PURE__ */ r(f.List, { ref: n, className: s(te({ variant: a }), e), ...t }));
+re.displayName = f.List.displayName;
+const se = c(
+  "inline-flex cursor-pointer items-center justify-center whitespace-nowrap text-sm font-medium ring-offset-background transition-all focus-visible:outline-hidden focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",
+  {
+    variants: {
+      variant: {
+        default: "rounded-md px-3 py-1 data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",
+        line: "rounded-none border-b border-transparent px-2 pb-3 pt-2 data-[state=active]:border-signal data-[state=active]:text-foreground"
+      }
+    },
+    defaultVariants: {
+      variant: "default"
+    }
+  }
+), oe = o.forwardRef(({ className: e, variant: a, ...t }, n) => /* @__PURE__ */ r(f.Trigger, { ref: n, className: s(se({ variant: a }), e), ...t }));
+oe.displayName = f.Trigger.displayName;
+const ne = o.forwardRef(({ className: e, ...a }, t) => /* @__PURE__ */ r(
+  f.Content,
+  {
+    ref: t,
+    className: s(
+      "ring-offset-background focus-visible:ring-ring mt-2 focus-visible:ring-2 focus-visible:ring-offset-2 focus-visible:outline-hidden",
+      e
+    ),
+    ...a
+  }
+));
+ne.displayName = f.Content.displayName;
+const ie = o.forwardRef(
+  ({ className: e, ...a }, t) => /* @__PURE__ */ r(
+    "textarea",
+    {
+      className: s(
+        "border-border-subtle bg-background placeholder:text-foreground-muted focus-visible:ring-ring flex min-h-[60px] w-full rounded-md border px-3 py-2 text-base shadow-xs focus-visible:ring-1 focus-visible:outline-hidden disabled:cursor-not-allowed disabled:opacity-50 md:text-sm",
+        e
+      ),
+      ref: t,
+      ...a
+    }
+  )
+);
+ie.displayName = "Textarea";
+const Te = u.Provider, De = u.Root, Se = u.Trigger, de = o.forwardRef(({ className: e, sideOffset: a = 4, ...t }, n) => /* @__PURE__ */ r(u.Portal, { children: /* @__PURE__ */ r(
+  u.Content,
+  {
+    ref: n,
+    sideOffset: a,
+    className: s(
+      "bg-foreground text-background animate-in fade-in-0 zoom-in-95 data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=closed]:zoom-out-95 z-50 origin-[--radix-tooltip-content-transform-origin] overflow-hidden rounded-md px-3 py-1.5 text-xs",
+      e
+    ),
+    ...t
+  }
+) }));
+de.displayName = u.Content.displayName;
+export {
+  k as A,
+  be as B,
+  I as C,
+  xe as D,
+  ee as E,
+  Re as F,
+  ne as G,
+  re as H,
+  J as I,
+  oe as J,
+  ie as K,
+  Q as L,
+  De as M,
+  de as N,
+  Te as O,
+  Se as P,
+  P as Q,
+  j as R,
+  ye as S,
+  Ce as T,
+  ae as U,
+  z as a,
+  V as b,
+  B as c,
+  H as d,
+  F as e,
+  U as f,
+  L as g,
+  A as h,
+  he as i,
+  _ as j,
+  E as k,
+  M as l,
+  G as m,
+  x as n,
+  O as o,
+  q as p,
+  ve as q,
+  W as r,
+  we as s,
+  Z as t,
+  Y as u,
+  h as v,
+  v as w,
+  $ as x,
+  X as y,
+  Ne as z
+};

package/dist/utils/cn.d.ts

@@ -0,0 +1,2 @@
+import { ClassValue } from 'clsx';
+export declare function cn(...inputs: ClassValue[]): string;

package/package.json

@@ -0,0 +1,59 @@
+{
+  "name": "@airlock-hq/design-system",
+  "version": "0.1.0",
+  "type": "module",
+  "files": [
+    "dist"
+  ],
+  "main": "./dist/index.js",
+  "module": "./dist/index.js",
+  "types": "./dist/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/index.d.ts",
+      "import": "./dist/index.js"
+    },
+    "./react": {
+      "types": "./dist/react/index.d.ts",
+      "import": "./dist/react.js"
+    },
+    "./theme.css": "./dist/theme.css",
+    "./styles.css": "./dist/tokens.css"
+  },
+  "peerDependencies": {
+    "react": "^19.0.0",
+    "react-dom": "^19.0.0"
+  },
+  "dependencies": {
+    "@fontsource-variable/inter": "^5.2.8",
+    "@fontsource-variable/jetbrains-mono": "^5.2.8",
+    "@radix-ui/react-dialog": "^1.1.15",
+    "@radix-ui/react-label": "^2.1.8",
+    "@radix-ui/react-select": "^2.2.6",
+    "@radix-ui/react-separator": "^1.1.8",
+    "@radix-ui/react-slot": "^1.2.4",
+    "@radix-ui/react-tabs": "^1.1.13",
+    "@radix-ui/react-tooltip": "^1.2.8",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "lucide-react": "^0.562.0",
+    "tailwind-merge": "^3.4.0"
+  },
+  "devDependencies": {
+    "@storybook/react-vite": "^9.1.17",
+    "@tailwindcss/vite": "^4.0.0",
+    "@types/react": "^19.2.5",
+    "@types/react-dom": "^19.2.3",
+    "storybook": "^9.1.17",
+    "tailwindcss": "^4.0.0",
+    "tw-animate-css": "^1.0.0",
+    "typescript": "~5.9.3",
+    "vite": "^7.2.4",
+    "vite-plugin-dts": "^4.5.4"
+  },
+  "scripts": {
+    "build": "vite build && cp src/styles/tokens.css dist/tokens.css && cp src/styles/theme.css dist/theme.css",
+    "storybook": "storybook dev -p 6006",
+    "build-storybook": "storybook build"
+  }
+}