@tensor_1/react 2.0.0

package/dist/components/Sidebar.d.ts

@@ -0,0 +1,39 @@
+import * as react from 'react';
+import { ReactNode, AnchorHTMLAttributes, HTMLAttributes } from 'react';
+
+interface SidebarProps extends HTMLAttributes<HTMLElement> {
+    collapsed?: boolean;
+    onToggle?: () => void;
+    brand?: ReactNode;
+    toggleIcon?: ReactNode;
+    children?: ReactNode;
+}
+declare function Sidebar({ collapsed, onToggle, brand, toggleIcon, children, className, ...props }: SidebarProps): react.JSX.Element;
+interface SidebarSectionProps {
+    label?: string;
+    children?: ReactNode;
+}
+declare function SidebarSection({ label, children }: SidebarSectionProps): react.JSX.Element;
+interface NavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    icon?: ReactNode;
+    badge?: ReactNode;
+    active?: boolean;
+    as?: 'a' | 'button';
+    children?: ReactNode;
+}
+declare function NavItem({ icon, badge, active, as: Tag, children, className, ...props }: NavItemProps): react.JSX.Element;
+interface NavGroupProps {
+    icon?: ReactNode;
+    label: ReactNode;
+    children?: ReactNode;
+    defaultExpanded?: boolean;
+}
+declare function NavGroup({ icon, label, children, defaultExpanded }: NavGroupProps): react.JSX.Element;
+interface SubNavItemProps extends AnchorHTMLAttributes<HTMLAnchorElement> {
+    active?: boolean;
+    as?: 'a' | 'button';
+    children?: ReactNode;
+}
+declare function SubNavItem({ active, as: Tag, children, className, ...props }: SubNavItemProps): react.JSX.Element;
+
+export { NavGroup, type NavGroupProps, NavItem, type NavItemProps, Sidebar, type SidebarProps, SidebarSection, type SidebarSectionProps, SubNavItem, type SubNavItemProps };

package/dist/components/Sidebar.js

@@ -0,0 +1,89 @@
+"use client";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { cx } from "../cx.js";
+const ChevronIcon = () => /* @__PURE__ */ jsx("svg", { className: "uix-navgroup__chevron", viewBox: "0 0 12 12", fill: "none", stroke: "currentColor", strokeWidth: 1.5, strokeLinecap: "round", "aria-hidden": "true", children: /* @__PURE__ */ jsx("path", { d: "M2 4l4 4 4-4" }) });
+function Sidebar({ collapsed, onToggle, brand, toggleIcon, children, className, ...props }) {
+  return /* @__PURE__ */ jsxs("nav", { className: cx("uix-sidebar", className), "data-collapsed": collapsed || void 0, ...props, children: [
+    (brand != null || onToggle) && /* @__PURE__ */ jsxs("div", { className: "uix-sidebar__head", children: [
+      brand && /* @__PURE__ */ jsx("div", { className: "uix-sidebar__brand", children: brand }),
+      onToggle && /* @__PURE__ */ jsx("button", { className: "uix-sidebar__toggle", onClick: onToggle, "aria-label": collapsed ? "Expand sidebar" : "Collapse sidebar", children: toggleIcon ?? /* @__PURE__ */ jsxs("svg", { width: "18", height: "18", viewBox: "0 0 18 18", fill: "none", stroke: "currentColor", strokeWidth: 1.5, "aria-hidden": "true", children: [
+        /* @__PURE__ */ jsx("rect", { x: "3", y: "4", width: "12", height: "1.5", rx: ".75" }),
+        /* @__PURE__ */ jsx("rect", { x: "3", y: "8.25", width: "8", height: "1.5", rx: ".75" }),
+        /* @__PURE__ */ jsx("rect", { x: "3", y: "12.5", width: "12", height: "1.5", rx: ".75" })
+      ] }) })
+    ] }),
+    children
+  ] });
+}
+function SidebarSection({ label, children }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    label && /* @__PURE__ */ jsx("div", { className: "uix-sidebar__eyebrow", children: label }),
+    children
+  ] });
+}
+function NavItem({ icon, badge, active, as: Tag = "a", children, className, ...props }) {
+  if (Tag === "button") {
+    const { href: _href, ...btnProps } = props;
+    return /* @__PURE__ */ jsxs(
+      "button",
+      {
+        className: cx("uix-navitem", className),
+        "aria-current": active ? "page" : void 0,
+        ...btnProps,
+        children: [
+          icon && /* @__PURE__ */ jsx("span", { className: "uix-navitem__icon", "aria-hidden": "true", children: icon }),
+          /* @__PURE__ */ jsx("span", { className: "uix-navitem__label", children }),
+          badge != null && /* @__PURE__ */ jsx("span", { className: "uix-navitem__badge", children: badge })
+        ]
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxs(
+    "a",
+    {
+      className: cx("uix-navitem", className),
+      "aria-current": active ? "page" : void 0,
+      ...props,
+      children: [
+        icon && /* @__PURE__ */ jsx("span", { className: "uix-navitem__icon", "aria-hidden": "true", children: icon }),
+        /* @__PURE__ */ jsx("span", { className: "uix-navitem__label", children }),
+        badge != null && /* @__PURE__ */ jsx("span", { className: "uix-navitem__badge", children: badge })
+      ]
+    }
+  );
+}
+function NavGroup({ icon, label, children, defaultExpanded = true }) {
+  const [expanded, setExpanded] = useState(defaultExpanded);
+  return /* @__PURE__ */ jsxs("div", { className: "uix-navgroup", children: [
+    /* @__PURE__ */ jsxs(
+      "button",
+      {
+        className: "uix-navitem uix-navgroup__trigger",
+        "aria-expanded": expanded,
+        onClick: () => setExpanded((v) => !v),
+        children: [
+          icon && /* @__PURE__ */ jsx("span", { className: "uix-navitem__icon", "aria-hidden": "true", children: icon }),
+          /* @__PURE__ */ jsx("span", { className: "uix-navitem__label", children: label }),
+          /* @__PURE__ */ jsx(ChevronIcon, {})
+        ]
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { className: "uix-navgroup__panel", children: /* @__PURE__ */ jsx("div", { children }) })
+  ] });
+}
+function SubNavItem({ active, as: Tag = "a", children, className, ...props }) {
+  const cls = cx("uix-navitem uix-subitem", className);
+  if (Tag === "button") {
+    const { href: _href, ...btnProps } = props;
+    return /* @__PURE__ */ jsx("button", { className: cls, "aria-current": active ? "page" : void 0, ...btnProps, children: /* @__PURE__ */ jsx("span", { className: "uix-navitem__label", children }) });
+  }
+  return /* @__PURE__ */ jsx("a", { className: cls, "aria-current": active ? "page" : void 0, ...props, children: /* @__PURE__ */ jsx("span", { className: "uix-navitem__label", children }) });
+}
+export {
+  NavGroup,
+  NavItem,
+  Sidebar,
+  SidebarSection,
+  SubNavItem
+};

package/dist/components/Spinner.d.ts

@@ -0,0 +1,10 @@
+import * as react from 'react';
+import { HTMLAttributes } from 'react';
+
+interface SpinnerProps extends HTMLAttributes<HTMLSpanElement> {
+    size?: 'md' | 'lg';
+    accent?: boolean;
+}
+declare function Spinner({ size, accent, className, ...props }: SpinnerProps): react.JSX.Element;
+
+export { Spinner, type SpinnerProps };

package/dist/components/Spinner.js

@@ -0,0 +1,16 @@
+import { jsx } from "react/jsx-runtime";
+import { cx } from "../cx.js";
+function Spinner({ size = "md", accent, className, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "span",
+    {
+      className: cx("uix-spinner", accent && "uix-spinner--accent", size === "lg" && "uix-spinner--lg", className),
+      role: "status",
+      "aria-label": "Loading",
+      ...props
+    }
+  );
+}
+export {
+  Spinner
+};

package/dist/components/Stat.d.ts

@@ -0,0 +1,21 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+interface StatTrend {
+    direction: 'up' | 'down';
+    label: ReactNode;
+}
+interface StatProps extends HTMLAttributes<HTMLDivElement> {
+    label: ReactNode;
+    value: ReactNode;
+    /** Optional icon shown at the trailing edge of the label row. */
+    icon?: ReactNode;
+    /** Supporting line under the value (e.g. "vs last week"). */
+    meta?: ReactNode;
+    /** Trend chip rendered before the meta text. */
+    trend?: StatTrend;
+}
+/** KPI / stat tile over `.uix-stat`. */
+declare function Stat({ label, value, icon, meta, trend, className, ...props }: StatProps): react.JSX.Element;
+
+export { Stat, type StatProps, type StatTrend };

package/dist/components/Stat.js

@@ -0,0 +1,18 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "../cx.js";
+function Stat({ label, value, icon, meta, trend, className, ...props }) {
+  return /* @__PURE__ */ jsxs("div", { className: cx("uix-stat", className), ...props, children: [
+    /* @__PURE__ */ jsxs("div", { className: "uix-stat__label", children: [
+      /* @__PURE__ */ jsx("span", { children: label }),
+      icon
+    ] }),
+    /* @__PURE__ */ jsx("div", { className: "uix-stat__value", children: value }),
+    (meta != null || trend != null) && /* @__PURE__ */ jsxs("div", { className: "uix-stat__meta", children: [
+      trend != null && /* @__PURE__ */ jsx("span", { className: cx("uix-stat__trend", `uix-stat__trend--${trend.direction}`), children: trend.label }),
+      meta
+    ] })
+  ] });
+}
+export {
+  Stat
+};

package/dist/components/States.d.ts

@@ -0,0 +1,38 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+interface EmptyStateProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    icon?: ReactNode;
+    title?: ReactNode;
+    /** Supporting copy / description. */
+    children?: ReactNode;
+    /** Primary action (e.g. a Button) shown under the body. */
+    action?: ReactNode;
+}
+/** Centered empty state over `.uix-empty`. */
+declare function EmptyState({ icon, title, children, action, className, ...props }: EmptyStateProps): react.JSX.Element;
+interface ErrorStateProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    icon?: ReactNode;
+    title?: ReactNode;
+    /** Error detail / message. */
+    detail?: ReactNode;
+    /** Recovery action (e.g. a Retry Button). */
+    action?: ReactNode;
+}
+/** Error state over `.uix-empty` with a danger-toned icon; `role="alert"`. */
+declare function ErrorState({ icon, title, detail, action, className, ...props }: ErrorStateProps): react.JSX.Element;
+interface SkeletonProps extends HTMLAttributes<HTMLDivElement> {
+    variant?: 'block' | 'text' | 'circle';
+    width?: number | string;
+    height?: number | string;
+}
+/** Shimmer placeholder over `.uix-skeleton`. */
+declare function Skeleton({ variant, width, height, className, style, ...props }: SkeletonProps): react.JSX.Element;
+interface LoadingStateProps extends HTMLAttributes<HTMLDivElement> {
+    /** Number of skeleton rows to render. */
+    rows?: number;
+}
+/** A stack of skeleton rows for list/section loading. `role="status"`. */
+declare function LoadingState({ rows, className, ...props }: LoadingStateProps): react.JSX.Element;
+
+export { EmptyState, type EmptyStateProps, ErrorState, type ErrorStateProps, LoadingState, type LoadingStateProps, Skeleton, type SkeletonProps };

package/dist/components/States.js

@@ -0,0 +1,43 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "../cx.js";
+function EmptyState({ icon, title, children, action, className, ...props }) {
+  return /* @__PURE__ */ jsxs("div", { className: cx("uix-empty", className), ...props, children: [
+    icon != null && /* @__PURE__ */ jsx("div", { className: "uix-empty__icon", children: icon }),
+    title != null && /* @__PURE__ */ jsx("div", { className: "uix-empty__title", children: title }),
+    children,
+    action
+  ] });
+}
+function ErrorState({ icon, title, detail, action, className, ...props }) {
+  return /* @__PURE__ */ jsxs("div", { className: cx("uix-empty", "uix-empty--danger", className), role: "alert", ...props, children: [
+    icon != null && /* @__PURE__ */ jsx("div", { className: "uix-empty__icon uix-empty__icon--danger", children: icon }),
+    title != null && /* @__PURE__ */ jsx("div", { className: "uix-empty__title", children: title }),
+    detail != null && /* @__PURE__ */ jsx("p", { children: detail }),
+    action
+  ] });
+}
+function Skeleton({ variant = "block", width, height, className, style, ...props }) {
+  const dims = { width, height, ...style };
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      className: cx(
+        "uix-skeleton",
+        variant === "text" && "uix-skeleton--text",
+        variant === "circle" && "uix-skeleton--circle",
+        className
+      ),
+      style: dims,
+      ...props
+    }
+  );
+}
+function LoadingState({ rows = 3, className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: cx("uix-stack", className), role: "status", "aria-busy": "true", ...props, children: Array.from({ length: rows }, (_, i) => /* @__PURE__ */ jsx(Skeleton, { variant: "text", width: `${92 - i % 3 * 14}%` }, i)) });
+}
+export {
+  EmptyState,
+  ErrorState,
+  LoadingState,
+  Skeleton
+};

package/dist/components/StatusPill.d.ts

@@ -0,0 +1,15 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+type PillTone = 'neutral' | 'success' | 'info' | 'warning' | 'danger' | 'critical' | 'muted';
+type PillTreatment = 'filled' | 'outline';
+interface StatusPillProps extends HTMLAttributes<HTMLSpanElement> {
+    tone?: PillTone;
+    /** 'filled' (default) = tinted wash; 'outline' = transparent fill + tone-tinted border. */
+    treatment?: PillTreatment;
+    dot?: boolean;
+    children?: ReactNode;
+}
+declare function StatusPill({ tone, treatment, dot, children, className, ...props }: StatusPillProps): react.JSX.Element;
+
+export { type PillTone, type PillTreatment, StatusPill, type StatusPillProps };

package/dist/components/StatusPill.js

@@ -0,0 +1,18 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "../cx.js";
+function StatusPill({ tone = "neutral", treatment = "filled", dot, children, className, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      className: cx("uix-pill", `uix-pill--${tone}`, treatment === "outline" && "uix-pill--outline", className),
+      ...props,
+      children: [
+        dot && /* @__PURE__ */ jsx("span", { className: "uix-pill__dot", "aria-hidden": "true" }),
+        children
+      ]
+    }
+  );
+}
+export {
+  StatusPill
+};

package/dist/components/Switch.d.ts

@@ -0,0 +1,9 @@
+import * as react from 'react';
+import { InputHTMLAttributes, ReactNode } from 'react';
+
+interface SwitchProps extends Omit<InputHTMLAttributes<HTMLInputElement>, 'type'> {
+    label?: ReactNode;
+}
+declare const Switch: react.ForwardRefExoticComponent<SwitchProps & react.RefAttributes<HTMLInputElement>>;
+
+export { Switch, type SwitchProps };

package/dist/components/Switch.js

@@ -0,0 +1,14 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { cx } from "../cx.js";
+const Switch = forwardRef(
+  ({ label, className, ...props }, ref) => /* @__PURE__ */ jsxs("label", { className: cx("uix-switch", className), children: [
+    /* @__PURE__ */ jsx("input", { type: "checkbox", role: "switch", ref, ...props }),
+    /* @__PURE__ */ jsx("span", { className: "uix-switch__track" }),
+    label
+  ] })
+);
+Switch.displayName = "Switch";
+export {
+  Switch
+};

package/dist/components/Table.d.ts

@@ -0,0 +1,34 @@
+import * as react from 'react';
+import { TableHTMLAttributes, HTMLAttributes, ReactNode, TdHTMLAttributes, ThHTMLAttributes } from 'react';
+
+interface TableWrapProps extends HTMLAttributes<HTMLDivElement> {
+    children?: ReactNode;
+}
+declare function TableWrap({ children, className, ...props }: TableWrapProps): react.JSX.Element;
+type TableDensity = 'compact' | 'standard' | 'comfortable';
+type SortDirection = 'ascending' | 'descending' | 'none';
+interface TableProps extends TableHTMLAttributes<HTMLTableElement> {
+    density?: TableDensity;
+    zebra?: boolean;
+    pinnedCol?: boolean;
+    rowPeek?: boolean;
+    v2?: boolean;
+}
+declare function Table({ density, zebra, pinnedCol, rowPeek, v2, className, children, ...props }: TableProps): react.JSX.Element;
+interface ThProps extends ThHTMLAttributes<HTMLTableCellElement> {
+    sortable?: boolean;
+    sortDirection?: SortDirection;
+    onSort?: () => void;
+}
+declare function Th({ sortable, sortDirection, onSort, className, children, onClick, ...props }: ThProps): react.JSX.Element;
+interface TdProps extends TdHTMLAttributes<HTMLTableCellElement> {
+    pinned?: boolean;
+}
+declare function Td({ pinned, className, children, ...props }: TdProps): react.JSX.Element;
+interface TrProps extends HTMLAttributes<HTMLTableRowElement> {
+    selected?: boolean;
+    pinned?: boolean;
+}
+declare function Tr({ selected, pinned, className, children, ...props }: TrProps): react.JSX.Element;
+
+export { type SortDirection, Table, type TableDensity, type TableProps, TableWrap, type TableWrapProps, Td, type TdProps, Th, type ThProps, Tr, type TrProps };

package/dist/components/Table.js

@@ -0,0 +1,62 @@
+import { jsx } from "react/jsx-runtime";
+import { cx } from "../cx.js";
+function TableWrap({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: cx("uix-table-wrap", className), ...props, children });
+}
+function Table({
+  density = "standard",
+  zebra = true,
+  pinnedCol,
+  rowPeek,
+  v2,
+  className,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsx(
+    "table",
+    {
+      className: cx("uix-table", !zebra && "uix-table--no-zebra", pinnedCol && "uix-table--pinned-col", className),
+      "data-density": density !== "standard" ? density : void 0,
+      "data-uix-rowpeek": rowPeek || void 0,
+      "data-uix-table-v2": v2 || void 0,
+      ...props,
+      children
+    }
+  );
+}
+function Th({ sortable, sortDirection, onSort, className, children, onClick, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "th",
+    {
+      className,
+      "data-sort": sortable || void 0,
+      "aria-sort": sortDirection && sortDirection !== "none" ? sortDirection : void 0,
+      onClick: sortable ? onSort ?? onClick : onClick,
+      ...props,
+      children
+    }
+  );
+}
+function Td({ pinned, className, children, ...props }) {
+  return /* @__PURE__ */ jsx("td", { className, "data-pinned": pinned || void 0, ...props, children });
+}
+function Tr({ selected, pinned, className, children, ...props }) {
+  return /* @__PURE__ */ jsx(
+    "tr",
+    {
+      className,
+      "aria-selected": selected || void 0,
+      "data-pinned": pinned || void 0,
+      ...props,
+      children
+    }
+  );
+}
+export {
+  Table,
+  TableWrap,
+  Td,
+  Th,
+  Tr
+};

package/dist/components/Tabs.d.ts

@@ -0,0 +1,19 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+interface TabsProps {
+    variant?: 'line' | 'enclosed' | 'pill';
+    value?: string;
+    onChange?: (value: string) => void;
+    children?: ReactNode;
+    className?: string;
+}
+declare function Tabs({ variant, value, onChange, children, className }: TabsProps): react.JSX.Element;
+interface TabProps extends Omit<HTMLAttributes<HTMLButtonElement>, 'onChange'> {
+    value: string;
+    children?: ReactNode;
+    disabled?: boolean;
+}
+declare function Tab({ value, children, disabled, className, onClick, ...props }: TabProps): react.JSX.Element;
+
+export { Tab, type TabProps, Tabs, type TabsProps };

package/dist/components/Tabs.js

@@ -0,0 +1,31 @@
+"use client";
+import { jsx } from "react/jsx-runtime";
+import { createContext, useContext } from "react";
+import { cx } from "../cx.js";
+const TabsCtx = createContext({});
+function Tabs({ variant = "line", value, onChange, children, className }) {
+  return /* @__PURE__ */ jsx(TabsCtx.Provider, { value: { value, onChange }, children: /* @__PURE__ */ jsx("div", { role: "tablist", className: cx("uix-tabs", `uix-tabs--${variant}`, className), children }) });
+}
+function Tab({ value, children, disabled, className, onClick, ...props }) {
+  const ctx = useContext(TabsCtx);
+  const selected = ctx.value === value;
+  return /* @__PURE__ */ jsx(
+    "button",
+    {
+      role: "tab",
+      className: cx("uix-tab", className),
+      "aria-selected": selected,
+      disabled,
+      onClick: (e) => {
+        ctx.onChange?.(value);
+        onClick?.(e);
+      },
+      ...props,
+      children
+    }
+  );
+}
+export {
+  Tab,
+  Tabs
+};

package/dist/components/Textarea.d.ts

@@ -0,0 +1,9 @@
+import * as react from 'react';
+import { TextareaHTMLAttributes } from 'react';
+
+interface TextareaProps extends TextareaHTMLAttributes<HTMLTextAreaElement> {
+    invalid?: boolean;
+}
+declare const Textarea: react.ForwardRefExoticComponent<TextareaProps & react.RefAttributes<HTMLTextAreaElement>>;
+
+export { Textarea, type TextareaProps };

package/dist/components/Textarea.js

@@ -0,0 +1,18 @@
+import { jsx } from "react/jsx-runtime";
+import { forwardRef } from "react";
+import { cx } from "../cx.js";
+const Textarea = forwardRef(
+  ({ invalid, className, ...props }, ref) => /* @__PURE__ */ jsx(
+    "textarea",
+    {
+      ref,
+      className: cx("uix-textarea", className),
+      "aria-invalid": invalid || void 0,
+      ...props
+    }
+  )
+);
+Textarea.displayName = "Textarea";
+export {
+  Textarea
+};

package/dist/components/Timeline.d.ts

@@ -0,0 +1,16 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+interface TimelineProps extends HTMLAttributes<HTMLDivElement> {
+    children?: ReactNode;
+}
+/** Activity timeline container over `.uix-timeline`. */
+declare function Timeline({ children, className, ...props }: TimelineProps): react.JSX.Element;
+interface TimelineItemProps extends HTMLAttributes<HTMLDivElement> {
+    meta?: ReactNode;
+    children?: ReactNode;
+}
+/** A timeline entry over `.uix-timeline__item` (node + connecting line + body). */
+declare function TimelineItem({ meta, children, className, ...props }: TimelineItemProps): react.JSX.Element;
+
+export { Timeline, TimelineItem, type TimelineItemProps, type TimelineProps };

package/dist/components/Timeline.js

@@ -0,0 +1,21 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "../cx.js";
+function Timeline({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: cx("uix-timeline", className), ...props, children });
+}
+function TimelineItem({ meta, children, className, ...props }) {
+  return /* @__PURE__ */ jsxs("div", { className: cx("uix-timeline__item", className), ...props, children: [
+    /* @__PURE__ */ jsxs("div", { className: "uix-timeline__rail", children: [
+      /* @__PURE__ */ jsx("span", { className: "uix-timeline__node" }),
+      /* @__PURE__ */ jsx("span", { className: "uix-timeline__line" })
+    ] }),
+    /* @__PURE__ */ jsxs("div", { className: "uix-timeline__body", children: [
+      meta != null && /* @__PURE__ */ jsx("div", { className: "uix-timeline__meta", children: meta }),
+      children
+    ] })
+  ] });
+}
+export {
+  Timeline,
+  TimelineItem
+};

package/dist/components/Toast.d.ts

@@ -0,0 +1,19 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+type ToastTone = 'success' | 'danger' | 'info';
+interface ToastProps extends Omit<HTMLAttributes<HTMLDivElement>, 'title'> {
+    title?: ReactNode;
+    message?: ReactNode;
+    tone?: ToastTone;
+    icon?: ReactNode;
+    onClose?: () => void;
+    leaving?: boolean;
+}
+declare function Toast({ title, message, tone, icon, onClose, leaving, className, ...props }: ToastProps): react.JSX.Element;
+interface ToasterProps extends HTMLAttributes<HTMLDivElement> {
+    children?: ReactNode;
+}
+declare function Toaster({ children, className, ...props }: ToasterProps): react.JSX.Element;
+
+export { Toast, type ToastProps, type ToastTone, Toaster, type ToasterProps };

package/dist/components/Toast.js

@@ -0,0 +1,29 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { cx } from "../cx.js";
+function Toast({ title, message, tone, icon, onClose, leaving, className, ...props }) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      className: cx("uix-toast", tone && `uix-toast--${tone}`, className),
+      "data-leaving": leaving || void 0,
+      role: "status",
+      "aria-live": "polite",
+      ...props,
+      children: [
+        icon && /* @__PURE__ */ jsx("div", { className: "uix-toast__icon", children: icon }),
+        /* @__PURE__ */ jsxs("div", { className: "uix-toast__body", children: [
+          title && /* @__PURE__ */ jsx("div", { className: "uix-toast__title", children: title }),
+          message && /* @__PURE__ */ jsx("div", { className: "uix-toast__msg", children: message })
+        ] }),
+        onClose && /* @__PURE__ */ jsx("button", { className: "uix-toast__close", onClick: onClose, "aria-label": "Dismiss", children: "\xD7" })
+      ]
+    }
+  );
+}
+function Toaster({ children, className, ...props }) {
+  return /* @__PURE__ */ jsx("div", { className: cx("uix-toaster", className), "aria-live": "polite", "aria-atomic": "false", ...props, children });
+}
+export {
+  Toast,
+  Toaster
+};

package/dist/components/Tooltip.d.ts

@@ -0,0 +1,16 @@
+import * as react from 'react';
+import { HTMLAttributes, ReactNode } from 'react';
+
+interface TooltipProps extends HTMLAttributes<HTMLSpanElement> {
+    /** Tooltip text. Rendered via the CSS `[data-uix-tip]` hover/focus tooltip. */
+    label: string;
+    children?: ReactNode;
+}
+/**
+ * Thin wrapper over the CSS-only tooltip (`[data-uix-tip]`). Wraps its children
+ * in a span carrying the attribute; the bubble is drawn entirely in CSS on
+ * hover/focus. For keyboard reveal, ensure a focusable child or pass `tabIndex`.
+ */
+declare function Tooltip({ label, children, ...props }: TooltipProps): react.JSX.Element;
+
+export { Tooltip, type TooltipProps };

package/dist/components/Tooltip.js

@@ -0,0 +1,7 @@
+import { jsx } from "react/jsx-runtime";
+function Tooltip({ label, children, ...props }) {
+  return /* @__PURE__ */ jsx("span", { "data-uix-tip": label, ...props, children });
+}
+export {
+  Tooltip
+};