@contractspec/lib.design-system 0.0.0-canary-20260113162409

package/dist/platform/withPlatformUI.js

@@ -0,0 +1,31 @@
+'use client';
+
+//#region src/platform/withPlatformUI.ts
+const DEFAULT_BREAKPOINTS = {
+	sm: 640,
+	md: 768,
+	lg: 1024,
+	xl: 1280
+};
+function withPlatformUI(options) {
+	const platform = options.platform ?? "web";
+	const breakpoints = {
+		...DEFAULT_BREAKPOINTS,
+		...options.breakpoints
+	};
+	return {
+		platform,
+		tokens: options.tokens,
+		breakpoints
+	};
+}
+/**
+* Example usage (app-level):
+*
+* const ui = withPlatformUI({ tokens: themeTokens });
+* // pass ui.tokens to DS providers or map classes as needed
+*/
+
+//#endregion
+export { DEFAULT_BREAKPOINTS, withPlatformUI };
+//# sourceMappingURL=withPlatformUI.js.map

package/dist/platform/withPlatformUI.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"withPlatformUI.js","names":[],"sources":["../../src/platform/withPlatformUI.ts"],"sourcesContent":["'use client';\n\n/**\n * withPlatformUI\n * Lightweight adapter inspired by gluestack's withGluestack pattern.\n * It centralizes tokens and responsive options while keeping DS imports\n * pointed at @ui-kit-web. Metro/Webpack aliases can swap to @ui-kit in native.\n */\n\nexport type PlatformKind = 'web' | 'native';\n\nexport interface Breakpoints {\n  sm: number;\n  md: number;\n  lg: number;\n  xl: number;\n}\n\nexport interface WithPlatformUIOptions<\n  TTokens extends Record<string, unknown>,\n> {\n  tokens: TTokens;\n  platform?: PlatformKind;\n  breakpoints?: Partial<Breakpoints>;\n}\n\nexport interface PlatformUI<TTokens> {\n  platform: PlatformKind;\n  tokens: TTokens;\n  breakpoints: Breakpoints;\n}\n\nexport const DEFAULT_BREAKPOINTS: Breakpoints = {\n  sm: 640,\n  md: 768,\n  lg: 1024,\n  xl: 1280,\n};\n\nexport function withPlatformUI<TTokens extends Record<string, unknown>>(\n  options: WithPlatformUIOptions<TTokens>\n): PlatformUI<TTokens> {\n  const platform: PlatformKind = options.platform ?? 'web';\n  const breakpoints: Breakpoints = {\n    ...DEFAULT_BREAKPOINTS,\n    ...options.breakpoints,\n  };\n  return {\n    platform,\n    tokens: options.tokens,\n    breakpoints,\n  };\n}\n\n/**\n * Example usage (app-level):\n *\n * const ui = withPlatformUI({ tokens: themeTokens });\n * // pass ui.tokens to DS providers or map classes as needed\n */\n"],"mappings":";;;AAgCA,MAAa,sBAAmC;CAC9C,IAAI;CACJ,IAAI;CACJ,IAAI;CACJ,IAAI;CACL;AAED,SAAgB,eACd,SACqB;CACrB,MAAM,WAAyB,QAAQ,YAAY;CACnD,MAAM,cAA2B;EAC/B,GAAG;EACH,GAAG,QAAQ;EACZ;AACD,QAAO;EACL;EACA,QAAQ,QAAQ;EAChB;EACD"}

package/dist/renderers/form-contract.d.ts

@@ -0,0 +1,12 @@
+import * as _contractspec_lib_contracts_client_react_form_render0 from "@contractspec/lib.contracts/client/react/form-render";
+import * as react_jsx_runtime113 from "react/jsx-runtime";
+import * as _contractspec_lib_schema0 from "@contractspec/lib.schema";
+import * as _contractspec_lib_contracts_forms0 from "@contractspec/lib.contracts/forms";
+
+//#region src/renderers/form-contract.d.ts
+declare const formRenderer: {
+  render: (spec: _contractspec_lib_contracts_forms0.FormSpec<_contractspec_lib_schema0.AnySchemaModel>, options?: _contractspec_lib_contracts_client_react_form_render0.RenderOptions<unknown> | undefined) => react_jsx_runtime113.JSX.Element;
+};
+//#endregion
+export { formRenderer };
+//# sourceMappingURL=form-contract.d.ts.map

package/dist/renderers/form-contract.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-contract.d.ts","names":[],"sources":["../../src/renderers/form-contract.tsx"],"sourcesContent":[],"mappings":";;;;;;cA+Fa;6DAsBX,yBAAA,CAAA,cAAA"}

package/dist/renderers/form-contract.js

@@ -0,0 +1,76 @@
+'use client';
+
+import { Button } from "../components/atoms/Button.js";
+import { Input } from "../components/atoms/Input.js";
+import { Textarea } from "../components/atoms/Textarea.js";
+import "react";
+import { createFormRenderer } from "@contractspec/lib.contracts/client/react/form-render";
+import { shadcnDriver } from "@contractspec/lib.contracts/client/react/drivers/shadcn";
+import { Field, FieldDescription, FieldError, FieldGroup, FieldLabel } from "@contractspec/lib.ui-kit-web/ui/field";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Switch } from "@contractspec/lib.ui-kit-web/ui/switch";
+import { RadioGroup, RadioGroupItem } from "@contractspec/lib.ui-kit-web/ui/radio-group";
+import { Checkbox } from "@contractspec/lib.ui-kit-web/ui/checkbox";
+import { Select, SelectContent, SelectGroup, SelectItem, SelectTrigger, SelectValue } from "@contractspec/lib.ui-kit-web/ui/select";
+import { Label } from "@contractspec/lib.ui-kit-web/ui/label";
+
+//#region src/renderers/form-contract.tsx
+const Select$1 = (props) => {
+	const { options, value, onChange, ...rest } = props;
+	return /* @__PURE__ */ jsxs(Select, {
+		value: value ?? "",
+		onValueChange: (v) => onChange?.(v),
+		...rest,
+		children: [/* @__PURE__ */ jsx(SelectTrigger, {
+			className: "w-[180px]",
+			children: /* @__PURE__ */ jsx(SelectValue, { placeholder: props.placeholder })
+		}), /* @__PURE__ */ jsx(SelectContent, { children: /* @__PURE__ */ jsx(SelectGroup, { children: options?.map((o, i) => /* @__PURE__ */ jsx(SelectItem, {
+			value: o.value,
+			disabled: o.disabled,
+			children: o.labelI18n
+		}, i)) }) })]
+	});
+};
+const Checkbox$1 = (props) => /* @__PURE__ */ jsx(Checkbox, {
+	checked: !!props.checked,
+	onCheckedChange: (v) => props.onCheckedChange?.(v),
+	...props
+});
+const RadioGroup$1 = (props) => /* @__PURE__ */ jsx(RadioGroup, {
+	...props,
+	children: props.options?.map((o) => /* @__PURE__ */ jsxs("div", {
+		className: "flex items-center gap-3",
+		children: [/* @__PURE__ */ jsx(RadioGroupItem, {
+			value: o.value,
+			id: o.value
+		}), /* @__PURE__ */ jsx(Label, {
+			htmlFor: o.value,
+			children: o.label
+		})]
+	}, o.value))
+});
+const Switch$1 = (props) => /* @__PURE__ */ jsx(Switch, {
+	checked: !!props.checked,
+	onCheckedChange: (v) => props.onCheckedChange?.(v),
+	...props
+});
+const formRenderer = createFormRenderer({ driver: shadcnDriver({
+	Field,
+	FieldLabel,
+	FieldDescription,
+	FieldError,
+	FieldGroup,
+	FieldSet: (p) => /* @__PURE__ */ jsx("fieldset", { ...p }),
+	FieldLegend: (p) => /* @__PURE__ */ jsx("legend", { ...p }),
+	Input,
+	Textarea,
+	Select: Select$1,
+	Checkbox: Checkbox$1,
+	RadioGroup: RadioGroup$1,
+	Switch: Switch$1,
+	Button
+}) });
+
+//#endregion
+export { formRenderer };
+//# sourceMappingURL=form-contract.js.map

package/dist/renderers/form-contract.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-contract.js","names":["Select","SelectUiKit","Checkbox","CheckboxUiKit","RadioGroup","RadioGroupUiKit","Switch","SwitchUiKit","FieldWrap"],"sources":["../../src/renderers/form-contract.tsx"],"sourcesContent":["'use client';\nimport React from 'react';\nimport { createFormRenderer } from '@contractspec/lib.contracts/client/react/form-render';\nimport { shadcnDriver } from '@contractspec/lib.contracts/client/react/drivers/shadcn';\n\n// Minimal shadcn driver mapping: host must wire its components here.\n// Replace these placeholders with actual shadcn/ui imports in your app.\nimport {\n  Field as FieldWrap,\n  FieldDescription,\n  FieldError,\n  FieldGroup,\n  FieldLabel,\n} from '@contractspec/lib.ui-kit-web/ui/field';\nimport { Button } from '../components/atoms/Button';\nimport { Input } from '../components/atoms/Input';\nimport { Textarea } from '../components/atoms/Textarea';\nimport { Switch as SwitchUiKit } from '@contractspec/lib.ui-kit-web/ui/switch';\nimport {\n  RadioGroup as RadioGroupUiKit,\n  RadioGroupItem,\n} from '@contractspec/lib.ui-kit-web/ui/radio-group';\nimport { Checkbox as CheckboxUiKit } from '@contractspec/lib.ui-kit-web/ui/checkbox';\nimport {\n  Select as SelectUiKit,\n  SelectContent,\n  SelectGroup,\n  SelectItem,\n  SelectTrigger,\n  SelectValue,\n} from '@contractspec/lib.ui-kit-web/ui/select';\nimport { Label } from '@contractspec/lib.ui-kit-web/ui/label';\n\n// Select/Checkbox/Radio/Switch are app-specific; provide thin wrappers.\ninterface FormOption {\n  value: string;\n  label?: string;\n  labelI18n?: string;\n  disabled?: boolean;\n}\n\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst Select = (props: any) => {\n  const { options, value, onChange, ...rest } = props;\n  return (\n    <SelectUiKit\n      value={value ?? ''}\n      onValueChange={(v) => onChange?.(v)}\n      {...rest}\n    >\n      <SelectTrigger className=\"w-[180px]\">\n        <SelectValue placeholder={props.placeholder} />\n      </SelectTrigger>\n      <SelectContent>\n        <SelectGroup>\n          {/* <SelectLabel>Fruits</SelectLabel> */}\n          {/* <SelectItem value=\"\" disabled hidden></SelectItem> */}\n          {(options as FormOption[] | undefined)?.map((o, i) => (\n            <SelectItem key={i} value={o.value} disabled={o.disabled}>\n              {o.labelI18n}\n            </SelectItem>\n          ))}\n        </SelectGroup>\n      </SelectContent>\n    </SelectUiKit>\n  );\n};\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst Checkbox = (props: any) => (\n  <CheckboxUiKit\n    checked={!!props.checked}\n    onCheckedChange={(v) => props.onCheckedChange?.(v)}\n    {...props}\n  />\n);\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst RadioGroup = (props: any) => (\n  <RadioGroupUiKit {...props}>\n    {(props.options as FormOption[] | undefined)?.map((o) => (\n      <div key={o.value} className=\"flex items-center gap-3\">\n        <RadioGroupItem value={o.value} id={o.value} />\n        <Label htmlFor={o.value}>{o.label}</Label>\n      </div>\n    ))}\n  </RadioGroupUiKit>\n);\n// eslint-disable-next-line @typescript-eslint/no-explicit-any\nconst Switch = (props: any) => (\n  <SwitchUiKit\n    checked={!!props.checked}\n    onCheckedChange={(v) => props.onCheckedChange?.(v)}\n    {...props}\n  />\n);\n\nexport const formRenderer = createFormRenderer({\n  driver: shadcnDriver({\n    Field: FieldWrap,\n    FieldLabel: FieldLabel,\n    FieldDescription: FieldDescription,\n    FieldError: FieldError,\n    FieldGroup: FieldGroup,\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    FieldSet: (p: any) => <fieldset {...p} />,\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    FieldLegend: (p: any) => <legend {...p} />,\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    Input: Input as any,\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    Textarea: Textarea as any,\n    Select: Select,\n    Checkbox: Checkbox,\n    RadioGroup: RadioGroup,\n    Switch: Switch,\n    // eslint-disable-next-line @typescript-eslint/no-explicit-any\n    Button: Button as any,\n  }),\n});\n"],"mappings":";;;;;;;;;;;;;;;;;AA0CA,MAAMA,YAAU,UAAe;CAC7B,MAAM,EAAE,SAAS,OAAO,UAAU,GAAG,SAAS;AAC9C,QACE,qBAACC;EACC,OAAO,SAAS;EAChB,gBAAgB,MAAM,WAAW,EAAE;EACnC,GAAI;aAEJ,oBAAC;GAAc,WAAU;aACvB,oBAAC,eAAY,aAAa,MAAM,cAAe;IACjC,EAChB,oBAAC,2BACC,oBAAC,yBAGG,SAAsC,KAAK,GAAG,MAC9C,oBAAC;GAAmB,OAAO,EAAE;GAAO,UAAU,EAAE;aAC7C,EAAE;KADY,EAEJ,CACb,GACU,GACA;GACJ;;AAIlB,MAAMC,cAAY,UAChB,oBAACC;CACC,SAAS,CAAC,CAAC,MAAM;CACjB,kBAAkB,MAAM,MAAM,kBAAkB,EAAE;CAClD,GAAI;EACJ;AAGJ,MAAMC,gBAAc,UAClB,oBAACC;CAAgB,GAAI;WACjB,MAAM,SAAsC,KAAK,MACjD,qBAAC;EAAkB,WAAU;aAC3B,oBAAC;GAAe,OAAO,EAAE;GAAO,IAAI,EAAE;IAAS,EAC/C,oBAAC;GAAM,SAAS,EAAE;aAAQ,EAAE;IAAc;IAFlC,EAAE,MAGN,CACN;EACc;AAGpB,MAAMC,YAAU,UACd,oBAACC;CACC,SAAS,CAAC,CAAC,MAAM;CACjB,kBAAkB,MAAM,MAAM,kBAAkB,EAAE;CAClD,GAAI;EACJ;AAGJ,MAAa,eAAe,mBAAmB,EAC7C,QAAQ,aAAa;CACZC;CACK;CACM;CACN;CACA;CAEZ,WAAW,MAAW,oBAAC,cAAS,GAAI,IAAK;CAEzC,cAAc,MAAW,oBAAC,YAAO,GAAI,IAAK;CAEnC;CAEG;CACV,QAAQR;CACR,UAAUE;CACV,YAAYE;CACZ,QAAQE;CAEA;CACT,CAAC,EACH,CAAC"}

package/dist/renderers/index.d.ts

@@ -0,0 +1 @@
+import { formRenderer } from "./form-contract.js";

package/dist/theme/tokenBridge.d.ts

@@ -0,0 +1,20 @@
+import { ColorTokens, RadiusTokens, SpaceTokens, defaultTokens } from "./tokens.js";
+
+//#region src/theme/tokenBridge.d.ts
+type PlatformKind = 'web' | 'native';
+type WebTokens = typeof defaultTokens;
+interface NativeTokens {
+  colors: ColorTokens;
+  spacing: SpaceTokens;
+  typography: {
+    h1: number;
+    body: number;
+  };
+  radii: RadiusTokens;
+  icons: Record<string, number>;
+}
+type BridgedTokens = WebTokens | NativeTokens;
+declare function mapTokensForPlatform(platform: PlatformKind): BridgedTokens;
+//#endregion
+export { mapTokensForPlatform };
+//# sourceMappingURL=tokenBridge.d.ts.map

package/dist/theme/tokenBridge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokenBridge.d.ts","names":[],"sources":["../../src/theme/tokenBridge.ts"],"sourcesContent":[],"mappings":";;;KASY,YAAA;KAEP,SAAA,UAAmB;AAFxB,UAIU,YAAA,CAJc;EAEnB,MAAA,EAIK,WAJI;EAEJ,OAAA,EAGC,WAHW;EAEZ,UAAA,EAAA;IACC,EAAA,EAAA,MAAA;IAKF,IAAA,EAAA,MAAA;EACA,CAAA;EAAM,KAAA,EADN,YACM;EAGH,KAAA,EAHH,MAGG,CAAA,MAAa,EAAA,MAAA,CAAG;AAE5B;KAFY,aAAA,GAAgB,YAAY;iBAExB,oBAAA,WAA+B,eAAe"}

package/dist/theme/tokenBridge.js

@@ -0,0 +1,25 @@
+'use client';
+
+import { defaultTokens } from "./tokens.js";
+
+//#region src/theme/tokenBridge.ts
+function mapTokensForPlatform(platform) {
+	if (platform === "web") return defaultTokens;
+	const spacing = defaultTokens.space;
+	const radii = defaultTokens.radii;
+	const icons = defaultTokens.icons;
+	return {
+		colors: defaultTokens.colors,
+		spacing,
+		typography: {
+			h1: defaultTokens.typography.h1,
+			body: defaultTokens.typography.body
+		},
+		radii,
+		icons
+	};
+}
+
+//#endregion
+export { mapTokensForPlatform };
+//# sourceMappingURL=tokenBridge.js.map

package/dist/theme/tokenBridge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokenBridge.js","names":["themeTokens"],"sources":["../../src/theme/tokenBridge.ts"],"sourcesContent":["'use client';\n\nimport {\n  type ColorTokens,\n  defaultTokens as themeTokens,\n  type RadiusTokens,\n  type SpaceTokens,\n} from './tokens';\n\nexport type PlatformKind = 'web' | 'native';\n\ntype WebTokens = typeof themeTokens;\n\ninterface NativeTokens {\n  // colors: Record<string, string>;\n  colors: ColorTokens;\n  spacing: SpaceTokens;\n  typography: {\n    h1: number;\n    body: number;\n  };\n  radii: RadiusTokens;\n  icons: Record<string, number>;\n}\n\nexport type BridgedTokens = WebTokens | NativeTokens;\n\nexport function mapTokensForPlatform(platform: PlatformKind): BridgedTokens {\n  if (platform === 'web') return themeTokens;\n\n  // Native: use numeric tokens from DS defaults\n  const spacing = themeTokens.space;\n  const radii = themeTokens.radii;\n  const icons = themeTokens.icons;\n\n  return {\n    colors: themeTokens.colors,\n    spacing,\n    typography: {\n      h1: themeTokens.typography.h1,\n      body: themeTokens.typography.body,\n    },\n    radii,\n    icons,\n  } satisfies NativeTokens;\n}\n"],"mappings":";;;;;AA2BA,SAAgB,qBAAqB,UAAuC;AAC1E,KAAI,aAAa,MAAO,QAAOA;CAG/B,MAAM,UAAUA,cAAY;CAC5B,MAAM,QAAQA,cAAY;CAC1B,MAAM,QAAQA,cAAY;AAE1B,QAAO;EACL,QAAQA,cAAY;EACpB;EACA,YAAY;GACV,IAAIA,cAAY,WAAW;GAC3B,MAAMA,cAAY,WAAW;GAC9B;EACD;EACA;EACD"}

package/dist/theme/tokens.d.ts

@@ -0,0 +1,51 @@
+//#region src/theme/tokens.d.ts
+interface ColorTokens {
+  background: string;
+  foreground: string;
+  muted: string;
+  mutedForeground: string;
+  primary: string;
+  primaryForeground: string;
+  accent: string;
+  accentForeground: string;
+  destructive: string;
+  destructiveForeground: string;
+  border: string;
+  ring: string;
+}
+interface RadiusTokens {
+  sm: number;
+  md: number;
+  lg: number;
+  xl: number;
+  full: number;
+}
+interface SpaceTokens {
+  xs: number;
+  sm: number;
+  md: number;
+  lg: number;
+  xl: number;
+}
+interface TypographyTokens {
+  h1: number;
+  h2: number;
+  h3: number;
+  body: number;
+  small: number;
+}
+interface ThemeTokens {
+  colors: ColorTokens;
+  radii: RadiusTokens;
+  space: SpaceTokens;
+  typography: TypographyTokens;
+  icons: {
+    sm: number;
+    md: number;
+    lg: number;
+  };
+}
+declare const defaultTokens: ThemeTokens;
+//#endregion
+export { ColorTokens, RadiusTokens, SpaceTokens, ThemeTokens, TypographyTokens, defaultTokens };
+//# sourceMappingURL=tokens.d.ts.map

package/dist/theme/tokens.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.d.ts","names":[],"sources":["../../src/theme/tokens.ts"],"sourcesContent":[],"mappings":";UAEiB,WAAA;EAAA,UAAA,EAAA,MAAW;EAeX,UAAA,EAAA,MAAY;EAQZ,KAAA,EAAA,MAAA;EAQA,eAAA,EAAA,MAAgB;EAQhB,OAAA,EAAA,MAAW;EAClB,iBAAA,EAAA,MAAA;EACD,MAAA,EAAA,MAAA;EACA,gBAAA,EAAA,MAAA;EACK,WAAA,EAAA,MAAA;EAAgB,qBAAA,EAAA,MAAA;EAIjB,MAAA,EAAA,MAAA;;;UAhCI,YAAA;;;;;;;UAQA,WAAA;;;;;;;UAQA,gBAAA;;;;;;;UAQA,WAAA;UACP;SACD;SACA;cACK;;;;;;;cAID,eAAe"}

package/dist/theme/tokens.js

@@ -0,0 +1,49 @@
+'use client';
+
+//#region src/theme/tokens.ts
+const defaultTokens = {
+	colors: {
+		background: "#ffffff",
+		foreground: "#0a0a0a",
+		muted: "#f4f4f5",
+		mutedForeground: "#71717a",
+		primary: "#0f49a0",
+		primaryForeground: "#ffffff",
+		accent: "#16a34a",
+		accentForeground: "#ffffff",
+		destructive: "#ef4444",
+		destructiveForeground: "#ffffff",
+		border: "#e4e4e7",
+		ring: "#2563eb"
+	},
+	radii: {
+		sm: 4,
+		md: 8,
+		lg: 12,
+		xl: 16,
+		full: 9999
+	},
+	space: {
+		xs: 4,
+		sm: 8,
+		md: 12,
+		lg: 16,
+		xl: 24
+	},
+	typography: {
+		h1: 30,
+		h2: 24,
+		h3: 20,
+		body: 16,
+		small: 14
+	},
+	icons: {
+		sm: 16,
+		md: 20,
+		lg: 24
+	}
+};
+
+//#endregion
+export { defaultTokens };
+//# sourceMappingURL=tokens.js.map

package/dist/theme/tokens.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"tokens.js","names":[],"sources":["../../src/theme/tokens.ts"],"sourcesContent":["'use client';\n\nexport interface ColorTokens {\n  background: string;\n  foreground: string;\n  muted: string;\n  mutedForeground: string;\n  primary: string;\n  primaryForeground: string;\n  accent: string;\n  accentForeground: string;\n  destructive: string;\n  destructiveForeground: string;\n  border: string;\n  ring: string;\n}\n\nexport interface RadiusTokens {\n  sm: number;\n  md: number;\n  lg: number;\n  xl: number;\n  full: number;\n}\n\nexport interface SpaceTokens {\n  xs: number;\n  sm: number;\n  md: number;\n  lg: number;\n  xl: number;\n}\n\nexport interface TypographyTokens {\n  h1: number;\n  h2: number;\n  h3: number;\n  body: number;\n  small: number;\n}\n\nexport interface ThemeTokens {\n  colors: ColorTokens;\n  radii: RadiusTokens;\n  space: SpaceTokens;\n  typography: TypographyTokens;\n  icons: { sm: number; md: number; lg: number };\n}\n\nexport const defaultTokens: ThemeTokens = {\n  colors: {\n    background: '#ffffff',\n    foreground: '#0a0a0a',\n    muted: '#f4f4f5',\n    mutedForeground: '#71717a',\n    primary: '#0f49a0',\n    primaryForeground: '#ffffff',\n    accent: '#16a34a',\n    accentForeground: '#ffffff',\n    destructive: '#ef4444',\n    destructiveForeground: '#ffffff',\n    border: '#e4e4e7',\n    ring: '#2563eb',\n  },\n  radii: { sm: 4, md: 8, lg: 12, xl: 16, full: 9999 },\n  space: { xs: 4, sm: 8, md: 12, lg: 16, xl: 24 },\n  typography: { h1: 30, h2: 24, h3: 20, body: 16, small: 14 },\n  icons: { sm: 16, md: 20, lg: 24 },\n};\n"],"mappings":";;;AAiDA,MAAa,gBAA6B;CACxC,QAAQ;EACN,YAAY;EACZ,YAAY;EACZ,OAAO;EACP,iBAAiB;EACjB,SAAS;EACT,mBAAmB;EACnB,QAAQ;EACR,kBAAkB;EAClB,aAAa;EACb,uBAAuB;EACvB,QAAQ;EACR,MAAM;EACP;CACD,OAAO;EAAE,IAAI;EAAG,IAAI;EAAG,IAAI;EAAI,IAAI;EAAI,MAAM;EAAM;CACnD,OAAO;EAAE,IAAI;EAAG,IAAI;EAAG,IAAI;EAAI,IAAI;EAAI,IAAI;EAAI;CAC/C,YAAY;EAAE,IAAI;EAAI,IAAI;EAAI,IAAI;EAAI,MAAM;EAAI,OAAO;EAAI;CAC3D,OAAO;EAAE,IAAI;EAAI,IAAI;EAAI,IAAI;EAAI;CAClC"}

package/dist/theme/variants.d.ts

@@ -0,0 +1,22 @@
+import { VariantProps } from "class-variance-authority";
+import * as class_variance_authority_types21 from "class-variance-authority/types";
+
+//#region src/theme/variants.d.ts
+type SizeVariant = 'sm' | 'md' | 'lg';
+type DensityVariant = 'compact' | 'comfortable';
+type ToneVariant = 'neutral' | 'info' | 'success' | 'warning' | 'danger';
+type EmphasisVariant = 'default' | 'subtle' | 'strong';
+/**
+ * Base CVA example to compose in DS components.
+ * Consumers can extend this with component-specific classes.
+ */
+declare const dsBaseVariants: (props?: ({
+  size?: "sm" | "md" | "lg" | null | undefined;
+  density?: "compact" | "comfortable" | null | undefined;
+  tone?: "neutral" | "danger" | "info" | "success" | "warning" | null | undefined;
+  emphasis?: "default" | "strong" | "subtle" | null | undefined;
+} & class_variance_authority_types21.ClassProp) | undefined) => string;
+type DSBaseVariantsProps = VariantProps<typeof dsBaseVariants>;
+//#endregion
+export { DSBaseVariantsProps, DensityVariant, EmphasisVariant, SizeVariant, ToneVariant, dsBaseVariants };
+//# sourceMappingURL=variants.d.ts.map

package/dist/theme/variants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"variants.d.ts","names":[],"sources":["../../src/theme/variants.ts"],"sourcesContent":[],"mappings":";;;;KAIY,WAAA;KACA,cAAA;KACA,WAAA;AAFA,KAGA,eAAA,GAHW,SAAA,GAAA,QAAA,GAAA,QAAA;AACvB;AACA;AACA;AAMA;AAgCY,cAhCC,cAgCkB,EAAA,CAAA,MAAuB,EAAA,CAAA;;;;;IAFpD,gCAAA,CAAA;KAEU,mBAAA,GAAsB,oBAAoB"}

package/dist/theme/variants.js

@@ -0,0 +1,44 @@
+'use client';
+
+import { cva } from "class-variance-authority";
+
+//#region src/theme/variants.ts
+/**
+* Base CVA example to compose in DS components.
+* Consumers can extend this with component-specific classes.
+*/
+const dsBaseVariants = cva("", {
+	variants: {
+		size: {
+			sm: "",
+			md: "",
+			lg: ""
+		},
+		density: {
+			compact: "",
+			comfortable: ""
+		},
+		tone: {
+			neutral: "",
+			info: "",
+			success: "",
+			warning: "",
+			danger: ""
+		},
+		emphasis: {
+			default: "",
+			subtle: "",
+			strong: ""
+		}
+	},
+	defaultVariants: {
+		size: "md",
+		density: "comfortable",
+		tone: "neutral",
+		emphasis: "default"
+	}
+});
+
+//#endregion
+export { dsBaseVariants };
+//# sourceMappingURL=variants.js.map

package/dist/theme/variants.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"variants.js","names":[],"sources":["../../src/theme/variants.ts"],"sourcesContent":["'use client';\n\nimport { cva, type VariantProps } from 'class-variance-authority';\n\nexport type SizeVariant = 'sm' | 'md' | 'lg';\nexport type DensityVariant = 'compact' | 'comfortable';\nexport type ToneVariant = 'neutral' | 'info' | 'success' | 'warning' | 'danger';\nexport type EmphasisVariant = 'default' | 'subtle' | 'strong';\n\n/**\n * Base CVA example to compose in DS components.\n * Consumers can extend this with component-specific classes.\n */\nexport const dsBaseVariants = cva('', {\n  variants: {\n    size: {\n      sm: '',\n      md: '',\n      lg: '',\n    },\n    density: {\n      compact: '',\n      comfortable: '',\n    },\n    tone: {\n      neutral: '',\n      info: '',\n      success: '',\n      warning: '',\n      danger: '',\n    },\n    emphasis: {\n      default: '',\n      subtle: '',\n      strong: '',\n    },\n  },\n  defaultVariants: {\n    size: 'md',\n    density: 'comfortable',\n    tone: 'neutral',\n    emphasis: 'default',\n  },\n});\n\nexport type DSBaseVariantsProps = VariantProps<typeof dsBaseVariants>;\n"],"mappings":";;;;;;;;;AAaA,MAAa,iBAAiB,IAAI,IAAI;CACpC,UAAU;EACR,MAAM;GACJ,IAAI;GACJ,IAAI;GACJ,IAAI;GACL;EACD,SAAS;GACP,SAAS;GACT,aAAa;GACd;EACD,MAAM;GACJ,SAAS;GACT,MAAM;GACN,SAAS;GACT,SAAS;GACT,QAAQ;GACT;EACD,UAAU;GACR,SAAS;GACT,QAAQ;GACR,QAAQ;GACT;EACF;CACD,iBAAiB;EACf,MAAM;EACN,SAAS;EACT,MAAM;EACN,UAAU;EACX;CACF,CAAC"}

package/dist/types/navigation.d.ts

@@ -0,0 +1,45 @@
+import * as React from "react";
+
+//#region src/types/navigation.d.ts
+interface NavLink {
+  label: React.ReactNode;
+  href: string;
+  icon?: React.ReactNode;
+  badge?: string | number;
+  target?: '_self' | '_blank';
+  ariaLabel?: string;
+  external?: boolean;
+  description?: React.ReactNode;
+  imageSrc?: string;
+  imageAlt?: string;
+  categories?: string[];
+}
+interface NavSection {
+  title?: React.ReactNode;
+  items: NavLink[];
+}
+interface UserMenuItem {
+  label: React.ReactNode;
+  href?: string;
+  onClick?: () => void;
+  icon?: React.ReactNode;
+  danger?: boolean;
+}
+interface HeaderNavItem {
+  label: React.ReactNode;
+  href?: string;
+  description?: React.ReactNode;
+  key?: string;
+  items?: NavLink[];
+  match?: 'exact' | 'startsWith';
+}
+interface CtaAction {
+  label: React.ReactNode;
+  href?: string;
+  onClick?: () => void;
+  variant?: 'default' | 'secondary' | 'outline' | 'ghost' | 'destructive';
+  size?: 'default' | 'sm' | 'lg' | 'icon';
+}
+//#endregion
+export { CtaAction, HeaderNavItem, NavLink, NavSection, UserMenuItem };
+//# sourceMappingURL=navigation.d.ts.map

package/dist/types/navigation.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"navigation.d.ts","names":[],"sources":["../../src/types/navigation.ts"],"sourcesContent":[],"mappings":";;;UAEiB,OAAA;SACR,KAAA,CAAM;EADE,IAAA,EAAA,MAAO;EACf,IAAM,CAAA,EAEN,KAAA,CAAM,SAFA;EAEN,KAAM,CAAA,EAAA,MAAA,GAAA,MAAA;EAKC,MAAM,CAAA,EAAA,OAAA,GAAA,QAAA;EAAS,SAAA,CAAA,EAAA,MAAA;EAMd,QAAA,CAAA,EAAA,OAAU;EAKV,WAAA,CAAA,EAXD,KAAA,CAAM,SAYb;EAOQ,QAAA,CAAA,EAAA,MAAa;EACrB,QAAM,CAAA,EAAA,MAAA;EAEC,UAAM,CAAA,EAAA,MAAA,EAAA;;AAEL,UAlBA,UAAA,CAkBA;EAIA,KAAA,CAAA,EArBP,KAAA,CAAM,SAsBP;SArBA;;UAGQ,YAAA;SACR,KAAA,CAAM;;;SAGN,KAAA,CAAM;;;UAIE,aAAA;SACR,KAAA,CAAM;;gBAEC,KAAA,CAAM;;UAEZ;;;UAIO,SAAA;SACR,KAAA,CAAM"}

package/package.json

@@ -0,0 +1,84 @@
+{
+  "name": "@contractspec/lib.design-system",
+  "version": "0.0.0-canary-20260113162409",
+  "description": "Design tokens and theming primitives",
+  "keywords": [
+    "contractspec",
+    "design-system",
+    "tokens",
+    "theming",
+    "ui",
+    "typescript"
+  ],
+  "scripts": {
+    "publish:pkg": "bun publish --tolerate-republish --ignore-scripts --verbose",
+    "publish:pkg:canary": "bun publish:pkg --tag canary",
+    "build": "bun build:types && bun build:bundle",
+    "build:bundle": "tsdown",
+    "build:types": "tsc --noEmit -p tsconfig.build.json",
+    "dev": "bun run build:bundle --watch",
+    "registry:build": "bun run scripts/build-registry.ts",
+    "test": "bun test src/**/*.test.ts src/**/*.test.tsx",
+    "lint": "bun run lint:fix",
+    "lint:fix": "eslint src --fix",
+    "lint:check": "eslint src"
+  },
+  "type": "module",
+  "types": "./dist/index.d.ts",
+  "sideEffects": false,
+  "tree-shake": true,
+  "dependencies": {
+    "@contractspec/lib.ai-agent": "0.0.0-canary-20260113162409",
+    "@contractspec/lib.contracts": "0.0.0-canary-20260113162409",
+    "@contractspec/lib.ui-kit": "0.0.0-canary-20260113162409",
+    "@contractspec/lib.ui-kit-web": "0.0.0-canary-20260113162409",
+    "@hookform/resolvers": "5.2.2",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "lucide-react": "^0.562.0",
+    "next": "16.1.1",
+    "react": "19.2.3",
+    "react-dom": "19.2.3",
+    "react-hook-form": "^7.70.0",
+    "shiki": "^3.21.0",
+    "tailwind-merge": "^3.3.1",
+    "tailwindcss-animate": "^1.0.7",
+    "zod": "^4.3.5"
+  },
+  "devDependencies": {
+    "@contractspec/tool.tsdown": "0.0.0-canary-20260113162409",
+    "@contractspec/tool.typescript": "0.0.0-canary-20260113162409",
+    "@types/node": "^25.0.6",
+    "@types/react-dom": "^19.0.14",
+    "postcss": "^8.5",
+    "postcss-load-config": "^6.0.1",
+    "react-native": "^0.81.4",
+    "react-native-css": "^3.0.0",
+    "tailwindcss": "4.1.18",
+    "tsdown": "^0.19.0",
+    "typescript": "^5.9.3"
+  },
+  "files": [
+    "dist",
+    "README.md"
+  ],
+  "exports": {
+    ".": "./dist/index.js",
+    "./*": "./*"
+  },
+  "publishConfig": {
+    "access": "public",
+    "exports": {
+      ".": "./dist/index.js",
+      "./*": "./*"
+    },
+    "registry": "https://registry.npmjs.org/"
+  },
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/lssm-tech/contractspec.git",
+    "directory": "packages/libs/design-system"
+  },
+  "homepage": "https://contractspec.io"
+}