@jackbernnie/hiyf 0.1.0

package/dist/components/Separator.d.ts

@@ -0,0 +1,10 @@
+import * as React from 'react';
+export type SeparatorSpacing = 'sm' | 'md' | 'lg';
+export type SeparatorOrientation = 'horizontal' | 'vertical';
+export interface SeparatorProps {
+    /** Axis of the rule. Defaults to 'horizontal'. */
+    orientation?: SeparatorOrientation;
+    /** Enumerated surrounding whitespace. Defaults to 'md'. */
+    spacing?: SeparatorSpacing;
+}
+export declare function Separator({ orientation, spacing, }: SeparatorProps): React.JSX.Element;

package/dist/components/Separator.js

@@ -0,0 +1,30 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { Separator as Separator$1 } from './ui/separator.js';
+
+const SPACING_MAP = {
+  horizontal: {
+    sm: "my-2",
+    md: "my-4",
+    lg: "my-8"
+  },
+  vertical: {
+    sm: "mx-2",
+    md: "mx-4",
+    lg: "mx-8"
+  }
+};
+function Separator({
+  orientation = "horizontal",
+  spacing = "md"
+}) {
+  return /* @__PURE__ */ jsx(
+    Separator$1,
+    {
+      orientation,
+      className: SPACING_MAP[orientation][spacing]
+    }
+  );
+}
+
+export { Separator };

package/dist/components/Sheet.d.ts

@@ -0,0 +1,31 @@
+import * as React from "react";
+/**
+ * Sheet — a closed convenience wrapper over the shadcn Sheet primitives.
+ *
+ * The underlying Sheet passes `className` through to both the overlay and
+ * the slide-in panel, and accepts arbitrary children without structural
+ * guidance. This wrapper closes that:
+ *   - `side` is the only placement control, already enumerated by the
+ *     primitive; the wrapper just keeps callers from reaching past it.
+ *   - Header (title + description) is composed internally from typed props
+ *     rather than left as free-form children, ensuring consistent padding
+ *     and typography every time.
+ *   - No `className` or `style` escape hatch on any public prop.
+ */
+export interface SheetProps {
+    /** Element that opens the sheet (e.g. a Button). */
+    trigger: React.ReactNode;
+    /** Accessible panel title. */
+    title?: string;
+    /** Optional subtitle rendered below the title. */
+    description?: string;
+    /** Edge from which the panel slides in; defaults to 'right'. */
+    side?: "top" | "right" | "bottom" | "left";
+    /** Panel body content. */
+    children?: React.ReactNode;
+    /** Controlled open state. */
+    open?: boolean;
+    /** Called when the open state should change. */
+    onOpenChange?: (open: boolean) => void;
+}
+export declare function Sheet({ trigger, title, description, side, children, open, onOpenChange, }: SheetProps): React.JSX.Element;

package/dist/components/Sheet.js

@@ -0,0 +1,26 @@
+'use client';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Sheet as Sheet$1, SheetTrigger, SheetContent, SheetHeader, SheetTitle, SheetDescription } from './ui/sheet.js';
+
+function Sheet({
+  trigger,
+  title,
+  description,
+  side = "right",
+  children,
+  open,
+  onOpenChange
+}) {
+  return /* @__PURE__ */ jsxs(Sheet$1, { open, onOpenChange, children: [
+    /* @__PURE__ */ jsx(SheetTrigger, { asChild: true, children: trigger }),
+    /* @__PURE__ */ jsxs(SheetContent, { side, children: [
+      (title || description) && /* @__PURE__ */ jsxs(SheetHeader, { children: [
+        title && /* @__PURE__ */ jsx(SheetTitle, { children: title }),
+        description && /* @__PURE__ */ jsx(SheetDescription, { children: description })
+      ] }),
+      children
+    ] })
+  ] });
+}
+
+export { Sheet };

package/dist/components/Sidebar.d.ts

@@ -0,0 +1,52 @@
+import * as React from "react";
+/**
+ * Sidebar — closed app-shell wrapper over shadcn's Sidebar primitive family.
+ *
+ * Matches the shadcn "sidebar-07" behaviour from a typed data model:
+ *   - `collapsible="icon"` — collapses to an icon rail (toggle via the trigger,
+ *     the rail edge, or Cmd/Ctrl+B). Labels hide; icons + tooltips remain.
+ *   - items take an `icon`, can be `active`, and may nest `items` to become a
+ *     collapsible sub-menu (chevron expands an indented list).
+ *   - optional `brand` header (icon + title + subtitle) and `user` footer
+ *     (avatar + name + email), both of which also collapse to their icon.
+ *   - `children` is the main inset content; it gets a header with the trigger.
+ *   - No `className`/`style` escape hatch. Need badges or actions? Add typed
+ *     fields to SidebarNavItem here.
+ */
+export interface SidebarNavSubItem {
+    label: string;
+    active?: boolean;
+    onSelect?: () => void;
+}
+export interface SidebarNavItem {
+    label: string;
+    /** Leading icon (e.g. a lucide/hugeicons element). Shown in the icon rail. */
+    icon?: React.ReactNode;
+    active?: boolean;
+    onSelect?: () => void;
+    /** Nested items turn this into a collapsible sub-menu. */
+    items?: SidebarNavSubItem[];
+    /** Whether the sub-menu starts expanded. */
+    defaultOpen?: boolean;
+}
+export interface SidebarNavGroup {
+    label?: string;
+    items: SidebarNavItem[];
+}
+export interface SidebarBrand {
+    icon?: React.ReactNode;
+    title: string;
+    subtitle?: string;
+}
+export interface SidebarUser {
+    name: string;
+    email?: string;
+    avatar?: React.ReactNode;
+}
+export interface SidebarProps {
+    groups: SidebarNavGroup[];
+    brand?: SidebarBrand;
+    user?: SidebarUser;
+    children: React.ReactNode;
+}
+export declare function Sidebar({ groups, brand, user, children }: SidebarProps): React.JSX.Element;

package/dist/components/Sidebar.js

@@ -0,0 +1,96 @@
+'use client';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { SidebarProvider, Sidebar as Sidebar$1, SidebarHeader, SidebarMenu, SidebarMenuItem, SidebarMenuButton, SidebarContent, SidebarGroup, SidebarGroupLabel, SidebarFooter, SidebarRail, SidebarInset, SidebarTrigger, SidebarMenuSub, SidebarMenuSubItem, SidebarMenuSubButton } from './ui/sidebar.js';
+import { Collapsible, CollapsibleTrigger, CollapsibleContent } from './ui/collapsible.js';
+import { TooltipProvider } from './ui/tooltip.js';
+
+function Chevron() {
+  return /* @__PURE__ */ jsx(
+    "svg",
+    {
+      className: "ml-auto size-4 shrink-0 text-sidebar-foreground/60 transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      stroke: "currentColor",
+      strokeWidth: "2",
+      strokeLinecap: "round",
+      strokeLinejoin: "round",
+      "aria-hidden": "true",
+      children: /* @__PURE__ */ jsx("path", { d: "m9 18 6-6-6-6" })
+    }
+  );
+}
+function NavItem({ item }) {
+  if (item.items && item.items.length > 0) {
+    return /* @__PURE__ */ jsx(
+      Collapsible,
+      {
+        asChild: true,
+        defaultOpen: item.defaultOpen ?? item.active,
+        className: "group/collapsible",
+        children: /* @__PURE__ */ jsxs(SidebarMenuItem, { children: [
+          /* @__PURE__ */ jsx(CollapsibleTrigger, { asChild: true, children: /* @__PURE__ */ jsxs(SidebarMenuButton, { tooltip: item.label, isActive: item.active, children: [
+            item.icon,
+            /* @__PURE__ */ jsx("span", { children: item.label }),
+            /* @__PURE__ */ jsx(Chevron, {})
+          ] }) }),
+          /* @__PURE__ */ jsx(CollapsibleContent, { children: /* @__PURE__ */ jsx(SidebarMenuSub, { children: item.items.map((sub) => /* @__PURE__ */ jsx(SidebarMenuSubItem, { children: /* @__PURE__ */ jsx(
+            SidebarMenuSubButton,
+            {
+              isActive: sub.active,
+              onClick: sub.onSelect,
+              children: /* @__PURE__ */ jsx("span", { children: sub.label })
+            }
+          ) }, sub.label)) }) })
+        ] })
+      }
+    );
+  }
+  return /* @__PURE__ */ jsx(SidebarMenuItem, { children: /* @__PURE__ */ jsxs(
+    SidebarMenuButton,
+    {
+      tooltip: item.label,
+      isActive: item.active,
+      onClick: item.onSelect,
+      children: [
+        item.icon,
+        /* @__PURE__ */ jsx("span", { children: item.label })
+      ]
+    }
+  ) });
+}
+function Sidebar({ groups, brand, user, children }) {
+  return (
+    // The icon-rail tooltips on SidebarMenuButton need a TooltipProvider; this
+    // shadcn build's SidebarProvider doesn't include one, so we add it.
+    /* @__PURE__ */ jsx(TooltipProvider, { delayDuration: 0, children: /* @__PURE__ */ jsxs(SidebarProvider, { className: "h-full min-h-0", children: [
+      /* @__PURE__ */ jsxs(Sidebar$1, { collapsible: "icon", children: [
+        brand && /* @__PURE__ */ jsx(SidebarHeader, { children: /* @__PURE__ */ jsx(SidebarMenu, { children: /* @__PURE__ */ jsx(SidebarMenuItem, { children: /* @__PURE__ */ jsxs(SidebarMenuButton, { size: "lg", children: [
+          brand.icon && /* @__PURE__ */ jsx("div", { className: "flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground", children: brand.icon }),
+          /* @__PURE__ */ jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
+            /* @__PURE__ */ jsx("span", { className: "truncate font-semibold", children: brand.title }),
+            brand.subtitle && /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-sidebar-foreground/70", children: brand.subtitle })
+          ] })
+        ] }) }) }) }),
+        /* @__PURE__ */ jsx(SidebarContent, { children: groups.map((group, groupIndex) => /* @__PURE__ */ jsxs(SidebarGroup, { children: [
+          group.label && /* @__PURE__ */ jsx(SidebarGroupLabel, { children: group.label }),
+          /* @__PURE__ */ jsx(SidebarMenu, { children: group.items.map((item) => /* @__PURE__ */ jsx(NavItem, { item }, item.label)) })
+        ] }, groupIndex)) }),
+        user && /* @__PURE__ */ jsx(SidebarFooter, { children: /* @__PURE__ */ jsx(SidebarMenu, { children: /* @__PURE__ */ jsx(SidebarMenuItem, { children: /* @__PURE__ */ jsxs(SidebarMenuButton, { size: "lg", children: [
+          user.avatar && /* @__PURE__ */ jsx("div", { className: "size-8 shrink-0 overflow-hidden rounded-lg", children: user.avatar }),
+          /* @__PURE__ */ jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [
+            /* @__PURE__ */ jsx("span", { className: "truncate font-semibold", children: user.name }),
+            user.email && /* @__PURE__ */ jsx("span", { className: "truncate text-xs text-sidebar-foreground/70", children: user.email })
+          ] })
+        ] }) }) }) }),
+        /* @__PURE__ */ jsx(SidebarRail, {})
+      ] }),
+      /* @__PURE__ */ jsxs(SidebarInset, { children: [
+        /* @__PURE__ */ jsx("header", { className: "flex h-14 shrink-0 items-center gap-2 border-b border-border px-4", children: /* @__PURE__ */ jsx(SidebarTrigger, { className: "-ml-1" }) }),
+        children
+      ] })
+    ] }) })
+  );
+}
+
+export { Sidebar };

package/dist/components/Skeleton.d.ts

@@ -0,0 +1,40 @@
+import * as React from 'react';
+/**
+ * Skeleton — a closed wrapper over shadcn's Skeleton primitive.
+ *
+ * shadcn's <Skeleton> accepts arbitrary `className` for width/height/shape,
+ * making every usage a one-off. This wrapper closes it:
+ *   - `width` and `height` are enumerated tokens mapped to fixed Tailwind
+ *     classes — the only expressible sizes are correct, system-sanctioned ones.
+ *   - `shape` ('line'|'circle'|'block') controls border-radius declaratively.
+ *   - NO `className`/`style` escape hatch. Every skeleton on screen is one of
+ *     a finite, on-brand set of shapes.
+ *   - Need a new size step? Add it to the token maps here.
+ */
+declare const WIDTH_MAP: {
+    readonly xs: "w-10";
+    readonly sm: "w-20";
+    readonly md: "w-40";
+    readonly lg: "w-64";
+    readonly full: "w-full";
+};
+declare const HEIGHT_MAP: {
+    readonly xs: "h-3";
+    readonly sm: "h-4";
+    readonly md: "h-6";
+    readonly lg: "h-10";
+    readonly full: "h-full";
+};
+export type SkeletonWidth = keyof typeof WIDTH_MAP;
+export type SkeletonHeight = keyof typeof HEIGHT_MAP;
+export type SkeletonShape = 'line' | 'circle' | 'block';
+export interface SkeletonProps {
+    /** Enumerated width token. Defaults to 'full'. */
+    width?: SkeletonWidth;
+    /** Enumerated height token. Defaults to 'sm'. */
+    height?: SkeletonHeight;
+    /** Shape treatment: line = rounded bar, circle = pill/avatar, block = card. */
+    shape?: SkeletonShape;
+}
+export declare function Skeleton({ width, height, shape, }: SkeletonProps): React.JSX.Element;
+export {};

package/dist/components/Skeleton.js

@@ -0,0 +1,42 @@
+import { jsx } from 'react/jsx-runtime';
+import { cva } from 'class-variance-authority';
+
+const WIDTH_MAP = {
+  xs: "w-10",
+  sm: "w-20",
+  md: "w-40",
+  lg: "w-64",
+  full: "w-full"
+};
+const HEIGHT_MAP = {
+  xs: "h-3",
+  sm: "h-4",
+  md: "h-6",
+  lg: "h-10",
+  full: "h-full"
+};
+const shapeVariants = cva("animate-pulse bg-muted", {
+  variants: {
+    shape: {
+      line: "rounded-md",
+      circle: "rounded-full",
+      block: "rounded-lg"
+    }
+  },
+  defaultVariants: { shape: "line" }
+});
+function Skeleton({
+  width = "full",
+  height = "sm",
+  shape = "line"
+}) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "data-slot": "skeleton",
+      className: `${shapeVariants({ shape })} ${WIDTH_MAP[width]} ${HEIGHT_MAP[height]}`
+    }
+  );
+}
+
+export { Skeleton };

package/dist/components/Slider.d.ts

@@ -0,0 +1,26 @@
+import * as React from 'react';
+/**
+ * Slider — closed wrapper over shadcn's <Slider>.
+ *
+ * shadcn's Slider accepts `className`, which lets callers restyle the track,
+ * range fill, and thumb arbitrarily. This wrapper closes every visual escape
+ * hatch while keeping the full behavioural surface:
+ *   - value, defaultValue, min, max, step, and onValueChange all pass through.
+ *   - there is NO `className` / `style` prop. Track colour, thumb size, and
+ *     focus ring are fixed to the design system's token values.
+ *   - need a coloured range (e.g. warning-amber)? Add a `color` prop here —
+ *     a deliberate, reviewable change — rather than a one-off class.
+ */
+export interface SliderProps {
+    value?: number[];
+    defaultValue?: number[];
+    min?: number;
+    max?: number;
+    step?: number;
+    onValueChange?: (value: number[]) => void;
+    disabled?: boolean;
+    id?: string;
+    name?: string;
+    orientation?: 'horizontal' | 'vertical';
+}
+export declare function Slider({ ...props }: SliderProps): React.JSX.Element;

package/dist/components/Slider.js

@@ -0,0 +1,9 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { Slider as Slider$1 } from './ui/slider.js';
+
+function Slider({ ...props }) {
+  return /* @__PURE__ */ jsx(Slider$1, { ...props });
+}
+
+export { Slider };

package/dist/components/Spinner.d.ts

@@ -0,0 +1,7 @@
+import * as React from 'react';
+export interface SpinnerProps {
+    /** Enumerated size. Defaults to 'md'. */
+    size?: 'sm' | 'md' | 'lg';
+}
+/** Closed loading spinner — no className/style. */
+export declare function Spinner({ size }: SpinnerProps): React.JSX.Element;

package/dist/components/Spinner.js

@@ -0,0 +1,13 @@
+import { jsx } from 'react/jsx-runtime';
+import { Spinner as Spinner$1 } from './ui/spinner.js';
+
+const SIZE_CLASS = {
+  sm: "size-3",
+  md: "size-4",
+  lg: "size-6"
+};
+function Spinner({ size = "md" }) {
+  return /* @__PURE__ */ jsx(Spinner$1, { className: SIZE_CLASS[size] });
+}
+
+export { Spinner };

package/dist/components/Status.d.ts

@@ -0,0 +1,30 @@
+import { type VariantProps } from 'class-variance-authority';
+/**
+ * Status — an EXEMPLAR of the HIYF philosophy applied to the shadcn base.
+ *
+ * shadcn's <Badge> is open: it takes arbitrary `className`, a `variant` named by
+ * appearance (default/secondary/destructive/outline), and any children. This
+ * wrapper closes it down:
+ *   - `color` is named by INTENT (success/warning/danger/info/neutral), not by
+ *     appearance — the same idea as HIYF's "tokens as intent".
+ *   - there is NO `className` / `style` escape hatch, so every Status on screen
+ *     is one of a handful of correct, on-brand treatments. An off-brand status
+ *     chip is simply not expressible.
+ *   - need another treatment? Add a `color` here — a deliberate, reviewable
+ *     change to the design system — rather than passing a one-off class.
+ *
+ * Copy this shape to wrap any other shadcn primitive in lockdown style.
+ */
+declare const statusVariants: (props?: ({
+    color?: "danger" | "warning" | "success" | "neutral" | "info" | null | undefined;
+    size?: "sm" | "md" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export type StatusColor = NonNullable<VariantProps<typeof statusVariants>['color']>;
+export interface StatusProps {
+    children: React.ReactNode;
+    /** Named by intent, not appearance. */
+    color?: StatusColor;
+    size?: 'sm' | 'md';
+}
+export declare function Status({ children, color, size }: StatusProps): import("react").JSX.Element;
+export {};

package/dist/components/Status.js

@@ -0,0 +1,27 @@
+import { jsx } from 'react/jsx-runtime';
+import { cva } from 'class-variance-authority';
+
+const statusVariants = cva(
+  "inline-flex w-fit items-center gap-1.5 rounded-full border border-transparent font-medium",
+  {
+    variants: {
+      color: {
+        neutral: "bg-muted text-muted-foreground",
+        success: "bg-emerald-500/10 text-emerald-600 dark:text-emerald-400",
+        warning: "bg-amber-500/10 text-amber-600 dark:text-amber-400",
+        danger: "bg-destructive/10 text-destructive",
+        info: "bg-blue-500/10 text-blue-600 dark:text-blue-400"
+      },
+      size: {
+        sm: "px-2 py-0.5 text-xs",
+        md: "px-2.5 py-1 text-sm"
+      }
+    },
+    defaultVariants: { color: "neutral", size: "sm" }
+  }
+);
+function Status({ children, color, size }) {
+  return /* @__PURE__ */ jsx("span", { className: statusVariants({ color, size }), children });
+}
+
+export { Status };

package/dist/components/Switch.d.ts

@@ -0,0 +1,27 @@
+import * as React from 'react';
+/**
+ * Switch — closed wrapper over shadcn's <Switch>.
+ *
+ * shadcn's Switch accepts `className` and an internal `size` prop that spans
+ * both layout and visual scale. This wrapper closes the className escape hatch
+ * while keeping `size` as the only sanctioned scale variant:
+ *   - `size` maps directly to the base component's two options (sm / md),
+ *     renamed to match HIYF conventions.
+ *   - there is NO `className` / `style` prop. The checked colour, thumb shape,
+ *     and animation are fixed to the design system's token values.
+ *   - need a third size? Add it here — a deliberate, reviewable change.
+ */
+export interface SwitchProps {
+    /** Controls the track and thumb scale. Defaults to 'md'. */
+    size?: 'sm' | 'md';
+    checked?: boolean;
+    defaultChecked?: boolean;
+    onCheckedChange?: (checked: boolean) => void;
+    disabled?: boolean;
+    /** For associating with a <Label htmlFor={id}>. */
+    id?: string;
+    name?: string;
+    value?: string;
+    required?: boolean;
+}
+export declare function Switch({ size, ...props }: SwitchProps): React.JSX.Element;

package/dist/components/Switch.js

@@ -0,0 +1,9 @@
+'use client';
+import { jsx } from 'react/jsx-runtime';
+import { Switch as Switch$1 } from './ui/switch.js';
+
+function Switch({ size = "md", ...props }) {
+  return /* @__PURE__ */ jsx(Switch$1, { size: size === "md" ? "default" : "sm", ...props });
+}
+
+export { Switch };

package/dist/components/Table.d.ts

@@ -0,0 +1,39 @@
+import * as React from 'react';
+/**
+ * Table — a closed generic data table wrapper over shadcn's Table primitive family.
+ *
+ * shadcn's Table passes `className` to every sub-part, leaving consumers free to
+ * apply arbitrary one-off styles and compose rows however they like. This wrapper
+ * closes it:
+ *   - `columns` is a typed column descriptor array with `key`, `header`, `align`,
+ *     and an optional `render` function; no className escapes.
+ *   - `data` is a generic array of row objects; the type parameter `T` flows
+ *     through so column keys and render callbacks are fully type-checked.
+ *   - `caption` is an optional accessible table caption.
+ *   - NO `className`/`style` escape hatch. Every table on screen is rendered by
+ *     the same correct, on-brand structure.
+ *   - Need a new alignment or row variant? Add it to the column descriptor here.
+ */
+export interface TableColumn<T> {
+    /** Property key on each data row (used as default cell content). */
+    key: string;
+    /** Column header label. */
+    header: string;
+    /** Text alignment for both the header and cells. Defaults to 'left'. */
+    align?: 'left' | 'right' | 'center';
+    /**
+     * Optional custom renderer for this column's cell.
+     * Receives the full row object and returns a React node.
+     */
+    render?: (row: T) => React.ReactNode;
+}
+export interface TableProps<T> {
+    /** Column definitions — header labels, keys, alignment, and optional renderers. */
+    columns: TableColumn<T>[];
+    /** Array of data rows to render. */
+    data: T[];
+    /** Optional accessible caption rendered below the table. */
+    caption?: string;
+}
+/** Closed generic data table — no className/style. */
+export declare function Table<T extends Record<string, unknown>>({ columns, data, caption, }: TableProps<T>): React.JSX.Element;

package/dist/components/Table.js

@@ -0,0 +1,22 @@
+'use client';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Table as Table$1, TableCaption, TableHeader, TableRow, TableHead, TableBody, TableCell } from './ui/table.js';
+
+const ALIGN_CLASS = {
+  left: "text-left",
+  right: "text-right",
+  center: "text-center"
+};
+function Table({
+  columns,
+  data,
+  caption
+}) {
+  return /* @__PURE__ */ jsxs(Table$1, { children: [
+    caption && /* @__PURE__ */ jsx(TableCaption, { children: caption }),
+    /* @__PURE__ */ jsx(TableHeader, { children: /* @__PURE__ */ jsx(TableRow, { children: columns.map((col) => /* @__PURE__ */ jsx(TableHead, { className: ALIGN_CLASS[col.align ?? "left"], children: col.header }, col.key)) }) }),
+    /* @__PURE__ */ jsx(TableBody, { children: data.map((row, rowIndex) => /* @__PURE__ */ jsx(TableRow, { children: columns.map((col) => /* @__PURE__ */ jsx(TableCell, { className: ALIGN_CLASS[col.align ?? "left"], children: col.render ? col.render(row) : String(row[col.key] ?? "") }, col.key)) }, rowIndex)) })
+  ] });
+}
+
+export { Table };

package/dist/components/Tabs.d.ts

@@ -0,0 +1,32 @@
+import * as React from "react";
+/**
+ * Tabs — closed wrapper over shadcn's composable Tabs parts.
+ *
+ * The raw parts accept arbitrary className and free-form children. This
+ * wrapper closes that down by driving the tab strip and panels from a
+ * typed `tabs` data model:
+ *   - `tabs` is the only way to populate tabs; no ad-hoc TabsTrigger /
+ *     TabsContent imports needed (or possible) from consumer code.
+ *   - Controlled and uncontrolled modes are supported via `value` /
+ *     `onValueChange` / `defaultValue`, matching the Radix root contract.
+ *   - No `className` or `style` escape hatch on the public API.
+ */
+export interface TabItem {
+    /** Unique identifier for the tab; used as the Radix `value`. */
+    value: string;
+    /** Label rendered in the tab trigger button. */
+    label: string;
+    /** Content rendered in the corresponding tab panel. */
+    content: React.ReactNode;
+}
+export interface TabsProps {
+    /** Ordered list of tab definitions. */
+    tabs: TabItem[];
+    /** Tab value selected on first render (uncontrolled). */
+    defaultValue?: string;
+    /** Controlled selected tab value. */
+    value?: string;
+    /** Called when the selected tab changes. */
+    onValueChange?: (value: string) => void;
+}
+export declare function Tabs({ tabs, defaultValue, value, onValueChange }: TabsProps): React.JSX.Element;

package/dist/components/Tabs.js

@@ -0,0 +1,21 @@
+'use client';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Tabs as Tabs$1, TabsList, TabsTrigger, TabsContent } from './ui/tabs.js';
+
+function Tabs({ tabs, defaultValue, value, onValueChange }) {
+  const resolvedDefault = defaultValue ?? tabs[0]?.value;
+  return /* @__PURE__ */ jsxs(
+    Tabs$1,
+    {
+      defaultValue: resolvedDefault,
+      value,
+      onValueChange,
+      children: [
+        /* @__PURE__ */ jsx(TabsList, { children: tabs.map((tab) => /* @__PURE__ */ jsx(TabsTrigger, { value: tab.value, children: tab.label }, tab.value)) }),
+        tabs.map((tab) => /* @__PURE__ */ jsx(TabsContent, { value: tab.value, children: tab.content }, tab.value))
+      ]
+    }
+  );
+}
+
+export { Tabs };

package/dist/components/Text.d.ts

@@ -0,0 +1,2 @@
+export declare const Text: typeof import("../primitives/createText").Text;
+export type { TextColor, TextStyleProps, TextVariant, } from '../primitives/createText';

package/dist/components/Text.js

@@ -0,0 +1,5 @@
+import { createText } from '../primitives/createText.js';
+
+const Text = createText();
+
+export { Text };

package/dist/components/Textarea.d.ts

@@ -0,0 +1,32 @@
+import * as React from 'react';
+/**
+ * Textarea — closed wrapper over shadcn's <Textarea>.
+ *
+ * shadcn's Textarea accepts arbitrary `className`, leaving visual treatment
+ * entirely up to the caller. This wrapper closes that escape hatch:
+ *   - `invalid` is the only expressible state variation; it wires up
+ *     `aria-invalid` so the base component's built-in error ring activates.
+ *   - `rows` controls height for fixed-size scenarios (the base uses
+ *     field-sizing: content by default; setting rows overrides that).
+ *   - there is NO `className` / `style` prop.
+ *   - standard behaviour props pass through unchanged.
+ *   - need a resize mode or other treatment? Add a prop here.
+ */
+export interface TextareaProps {
+    /** Activates the error ring. Prefer pairing with a <Label> and error text. */
+    invalid?: boolean;
+    /** Fixed row height. Omit to use content-sized auto-grow. */
+    rows?: number;
+    placeholder?: string;
+    value?: string;
+    defaultValue?: string;
+    onChange?: React.ChangeEventHandler<HTMLTextAreaElement>;
+    disabled?: boolean;
+    id?: string;
+    name?: string;
+    readOnly?: boolean;
+    required?: boolean;
+    autoFocus?: boolean;
+    autoComplete?: string;
+}
+export declare function Textarea({ invalid, rows, ...rest }: TextareaProps): React.JSX.Element;