@financedistrict/apps-ui 0.1.0

package/dist/dialog.d.ts

@@ -0,0 +1,240 @@
+import * as React from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+interface DialogRootProps {
+    /** Controlled open state. Pair with `onOpenChange`. Omit for uncontrolled. */
+    open?: boolean;
+    /** Initial open state when uncontrolled. Ignored if `open` is provided. */
+    defaultOpen?: boolean;
+    /** Called with the next open state from trigger/close/Escape/backdrop. */
+    onOpenChange?: (open: boolean) => void;
+    /**
+     * Whether Escape and a backdrop click dismiss the dialog. `false` forces the
+     * user through an explicit control (a footer button / the header X, which
+     * always close). Default `true`.
+     */
+    dismissable?: boolean;
+    children?: React.ReactNode;
+}
+/**
+ * State owner + context provider for the compound `Dialog`. Renders no DOM of
+ * its own. Controlled via `open`/`onOpenChange`, or uncontrolled via
+ * `defaultOpen`. Generates the `aria-labelledby`/`aria-describedby` ids that
+ * `Dialog.Header` and `Dialog.Content` share, so the wiring cannot drift.
+ */
+declare function DialogRoot({ open: openProp, defaultOpen, onOpenChange, dismissable, children, }: DialogRootProps): React.JSX.Element;
+interface TriggerLikeProps extends Omit<React.ComponentProps<"button">, "onClick"> {
+    /** Render the single child element as the root instead of a `<button>`. */
+    asChild?: boolean;
+}
+interface DialogTriggerProps extends TriggerLikeProps {
+}
+/**
+ * Optional button that opens the dialog. `asChild` adopts a passed element
+ * (e.g. `<Button>`). Wires `aria-haspopup="dialog"` + `aria-expanded`. Skip it
+ * for pure controlled usage.
+ */
+declare function DialogTrigger({ asChild, ...props }: DialogTriggerProps): React.JSX.Element;
+interface DialogCloseProps extends TriggerLikeProps {
+}
+/**
+ * Optional button that closes the dialog (e.g. wrapping a footer Cancel
+ * button). `asChild` adopts a passed element. Always closes, independent of
+ * `dismissable` (that only gates Escape + backdrop).
+ */
+declare function DialogClose({ asChild, ...props }: DialogCloseProps): React.JSX.Element;
+interface DialogContentProps extends React.ComponentProps<"div"> {
+}
+/**
+ * The portaled overlay layer — mounts via `createPortal` → `document.body`
+ * (escaping `overflow`/stacking ancestors, like `SelectListbox`) only while
+ * open. Renders the backdrop + the centred card, and owns the dialog semantics
+ * (`role="dialog"`, `aria-modal`, `aria-labelledby`/`aria-describedby`), the
+ * focus trap + return + scroll lock (`useFocusTrap`), Escape, and backdrop
+ * dismiss. Forwards `ref` to the card element.
+ */
+declare function DialogContent({ className, children, ref, onKeyDown, ...props }: DialogContentProps): React.ReactPortal | null;
+interface DialogHeaderProps extends Omit<React.ComponentProps<"div">, "title"> {
+    /**
+     * Decorative 32px icon (rendered `aria-hidden`). Hidden when omitted.
+     *
+     * **Rule: use a filled icon here.** The slot defaults Phosphor icons to
+     * `weight="fill"` via `IconContext`, so a plain `<SomeIcon />` renders filled
+     * with no per-call weight needed — matching the dialog's visual language. An
+     * explicit `weight` on the passed icon still wins, but line/regular weights are
+     * off-pattern for this slot. The top-right close (X) button is the sole
+     * exception and stays a regular-weight line icon.
+     */
+    icon?: React.ReactNode;
+    /** Title — becomes the dialog's `aria-labelledby` target (`display-04`). */
+    title: React.ReactNode;
+    /** Optional description — becomes `aria-describedby` (`body-03`, muted). */
+    description?: React.ReactNode;
+    /**
+     * Show the X close button, positioned against the card at 24px from its top and
+     * right (absolute — independent of the icon). Shown by **default**; pass
+     * `false` to hide it. Always closes, independent of `dismissable`.
+     */
+    showClose?: boolean;
+}
+/**
+ * Header block: an optional decorative icon, the title (registers the
+ * `aria-labelledby` id), an optional description (registers `aria-describedby`),
+ * and an optional X close button. Ids come from `Dialog.Root` context so the
+ * ARIA wiring stays in lock-step with `Dialog.Content`.
+ */
+declare function DialogHeader({ icon, title, description, showClose, className, ref, ...props }: DialogHeaderProps): React.JSX.Element;
+interface DialogBodyProps extends React.ComponentProps<"div"> {
+}
+/**
+ * Flexible content slot — inputs or any composition. Sizes to content and, in
+ * the card's bounded flex column, becomes the internal scroll region so the
+ * dialog never exceeds the viewport (custom scrollbar via `scrollbarVariants`).
+ */
+declare function DialogBody({ className, children, ref, ...props }: DialogBodyProps): React.JSX.Element;
+interface DialogFooterProps extends React.ComponentProps<"div"> {
+}
+/**
+ * Action-row slot — a full-width flex row (`gap-2`) whose children stretch to
+ * equal width (Figma's two-button layout). Apps pass `Button`s; a destructive
+ * dialog uses `Button variation="destructive"` here.
+ */
+declare function DialogFooter({ className, children, ref, ...props }: DialogFooterProps): React.JSX.Element;
+/**
+ * Compound modal dialog. Assemble from its namespaced parts:
+ *
+ * ```tsx
+ * <Dialog.Root open={open} onOpenChange={setOpen}>
+ *   <Dialog.Trigger asChild><Button>Open</Button></Dialog.Trigger>
+ *   <Dialog.Content>
+ *     <Dialog.Header icon={<Icon />} title="Title" description="…" showClose />
+ *     <Dialog.Body>{/* content *\/}</Dialog.Body>
+ *     <Dialog.Footer>
+ *       <Dialog.Close asChild><Button variation="secondary">Cancel</Button></Dialog.Close>
+ *       <Button>Confirm</Button>
+ *     </Dialog.Footer>
+ *   </Dialog.Content>
+ * </Dialog.Root>
+ * ```
+ */
+declare const Dialog: {
+    Root: typeof DialogRoot;
+    Trigger: typeof DialogTrigger;
+    Content: typeof DialogContent;
+    Header: typeof DialogHeader;
+    Body: typeof DialogBody;
+    Footer: typeof DialogFooter;
+    Close: typeof DialogClose;
+};
+
+/**
+ * All tabbable descendants of `container`, in DOM order.
+ *
+ * Deliberately does NOT filter by visibility (`offsetParent`/rects): jsdom
+ * performs no layout, so a visibility filter would drop every element under
+ * test. A modal's card rarely contains hidden-but-matching focusables, and the
+ * trap only ever cycles among what it returns, so the DOM-order set is
+ * sufficient. Kept pure (no React) so it is unit-testable in isolation.
+ */
+declare function getFocusableElements(container: HTMLElement): HTMLElement[];
+interface UseFocusTrapOptions {
+    /** Whether the trap is engaged (the dialog is open). */
+    active: boolean;
+    /** Ref to the element that focus is confined within (the dialog card). */
+    containerRef: React.RefObject<HTMLElement | null>;
+}
+/**
+ * Modal focus machinery for `Dialog.Content` — the piece ADR-0013 #2 explicitly
+ * deferred for `Select` (which kept focus on its trigger via
+ * `aria-activedescendant`). Dialog is a true modal, so on open it:
+ *
+ * 1. remembers the element that had focus (typically the trigger),
+ * 2. moves focus into the container (first focusable, else the container
+ *    itself — give it `tabIndex={-1}` for that fallback),
+ * 3. locks body scroll, and
+ * 4. traps `Tab` / `Shift+Tab` so focus cycles within the container and cannot
+ *    escape to the page behind the backdrop.
+ *
+ * On close/unmount it releases the scroll lock and restores focus to the
+ * remembered element. Dependency-free per ADR-0013 (no focus-trap library).
+ */
+declare function useFocusTrap({ active, containerRef, }: UseFocusTrapOptions): void;
+
+/**
+ * Dialog styling — the Figma `Dialog` card (nodes `4985:12074` / `4988:1882`)
+ * plus the overlay plumbing the library owns. Binds ONLY to the semantic token
+ * layer (never primitives, never the mode plumbing); theme switching is
+ * automatic via the `.dark` class, so no `dark:` variants are needed.
+ *
+ * Dialog is presentation-neutral: there is no `variation` prop (see the design
+ * spec / ADR-0022). The "basic" vs "destructive" Figma looks come entirely from
+ * the app-supplied header icon and footer `Button variation`, so these tables
+ * carry no variant axes — they are static class sets composed with `cn`.
+ */
+/**
+ * The full-viewport backdrop. Fixed over everything, flex-centres the card, and
+ * paints the `--overlay` semantic token (a derived-alpha value, ADR-0005 — never
+ * an ad-hoc `bg-black/50`). `p-4` (1rem each side = 2rem total) reserves the
+ * viewport gutter the card's `max-w`/`max-h` calc subtract, so the card never
+ * touches an edge.
+ */
+declare const dialogOverlayVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * The centred card. `w-[438px]` is the Figma-exact default width; there is no
+ * container token at 438px (closest is `--container-md` = 448px) and no width is
+ * expressible on the 4px spacing grid, so an arbitrary value is used
+ * deliberately (same posture as `scrollbarVariants`) and is `className`-
+ * overridable. `max-w`/`max-h` are viewport calcs (no token can express
+ * `100vw − gutter`) that keep the card inside the `p-4` overlay gutter; combined
+ * with the flex column below they let `Dialog.Body` scroll internally rather
+ * than let the card exceed the viewport.
+ */
+declare const dialogContentVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Header block: a stacked 32px decorative icon above the title/description
+ * column. `gap-4` (16px) between them, `items-start` left-aligns children.
+ * `shrink-0` keeps it fixed while the body scrolls. NOT `relative` on purpose —
+ * the close button positions against the card (`Dialog.Content`), so the header
+ * must not become the positioning anchor.
+ */
+declare const dialogHeaderVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/** Decorative 32px icon slot (`aria-hidden` on the element in `Dialog.Header`). */
+declare const dialogHeaderIconVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Title + description column: `gap-2` (8px) between the two, `w-full` so both
+ * span the header width. When the close X is shown on an icon-less header the
+ * component adds `pr-8` here so a long title clears the corner button (with an
+ * icon the title sits below the X, so no reservation is needed).
+ */
+declare const dialogHeaderTextVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * The 16px muted X close button. Absolutely positioned against the card
+ * (`Dialog.Content` is the `relative` anchor) at `top-6 right-6` — always 24px
+ * from the card's top and right regardless of whether the header has an icon, so
+ * it never shifts with header content. Focus ring per ADR-0010.
+ */
+declare const dialogCloseButtonVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Body slot: sizes to content and, inside the card's bounded flex column,
+ * becomes the scroll region (`min-h-0 flex-1 overflow-y-auto`) so overflowing
+ * content scrolls internally and the dialog never exceeds the viewport. Custom
+ * scrollbar is composed in via `scrollbarVariants` in the component.
+ */
+declare const dialogBodyVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/**
+ * Footer action row: full width, `gap-2`, children stretched to equal width
+ * (Figma's two-button layout — each button is `flex: 1 0 0`). `shrink-0` keeps
+ * it pinned while the body scrolls.
+ *
+ * Two-level stretch: `[&>*]:flex-1` grows each direct child equally, but a cut-
+ * corner `Button` renders an `inline-block` wrapper span around its `<button>`,
+ * so the span fills the flex track while the inner button would stay content-
+ * width. `[&_button]:w-full` stretches that inner button to fill the track (a
+ * ghost button, which is the direct flex child, keeps its `flex:1 1 0%` basis).
+ * Targets the element, not `[data-slot=button]`, because a `Dialog.Close asChild`
+ * wrapper overrides the inner button's `data-slot` to `dialog-close`. The
+ * button's own `justify-center` then centers the label, matching Figma.
+ */
+declare const dialogFooterVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+
+export { Dialog, DialogBody, type DialogBodyProps, DialogClose, type DialogCloseProps, DialogContent, type DialogContentProps, DialogFooter, type DialogFooterProps, DialogHeader, type DialogHeaderProps, DialogRoot, type DialogRootProps, DialogTrigger, type DialogTriggerProps, type UseFocusTrapOptions, dialogBodyVariants, dialogCloseButtonVariants, dialogContentVariants, dialogFooterVariants, dialogHeaderIconVariants, dialogHeaderTextVariants, dialogHeaderVariants, dialogOverlayVariants, getFocusableElements, useFocusTrap };

package/dist/dialog.js

@@ -0,0 +1,3 @@
+export { Dialog, DialogBody, DialogClose, DialogContent, DialogFooter, DialogHeader, DialogRoot, DialogTrigger, dialogBodyVariants, dialogCloseButtonVariants, dialogContentVariants, dialogFooterVariants, dialogHeaderIconVariants, dialogHeaderTextVariants, dialogHeaderVariants, dialogOverlayVariants, getFocusableElements, useFocusTrap } from './chunk-WXEBQA7A.js';
+import './chunk-FAOVKDVM.js';
+import './chunk-7EOSDFS3.js';

package/dist/feature-card.cjs

@@ -0,0 +1,182 @@
+'use strict';
+
+var React = require('react');
+var react = require('@phosphor-icons/react');
+var clsx = require('clsx');
+var tailwindMerge = require('tailwind-merge');
+var classVarianceAuthority = require('class-variance-authority');
+var jsxRuntime = require('react/jsx-runtime');
+
+function _interopNamespace(e) {
+  if (e && e.__esModule) return e;
+  var n = Object.create(null);
+  if (e) {
+    Object.keys(e).forEach(function (k) {
+      if (k !== 'default') {
+        var d = Object.getOwnPropertyDescriptor(e, k);
+        Object.defineProperty(n, k, d.get ? d : {
+          enumerable: true,
+          get: function () { return e[k]; }
+        });
+      }
+    });
+  }
+  n.default = e;
+  return Object.freeze(n);
+}
+
+var React__namespace = /*#__PURE__*/_interopNamespace(React);
+
+// src/feature-card/FeatureCard.tsx
+function cn(...inputs) {
+  return tailwindMerge.twMerge(clsx.clsx(inputs));
+}
+var featureCardVariants = classVarianceAuthority.cva(
+  "flex h-16 items-center gap-3 px-4 py-3 bg-card-background no-underline",
+  {
+    variants: {
+      interactive: {
+        true: [
+          "cursor-pointer transition-colors hover:bg-card-accent",
+          "outline-none focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-solid focus-visible:outline-focus"
+        ],
+        false: ""
+      }
+    },
+    defaultVariants: { interactive: false }
+  }
+);
+var featureCardLeadingVariants = classVarianceAuthority.cva(
+  "flex shrink-0 items-center text-card-foreground [&_svg]:size-6 [&_svg]:shrink-0"
+);
+var featureCardTrailingVariants = classVarianceAuthority.cva(
+  "flex shrink-0 items-center text-card-foreground-muted [&_svg]:size-6 [&_svg]:shrink-0"
+);
+var featureCardTextVariants = classVarianceAuthority.cva("flex min-w-0 flex-1 flex-col");
+var featureCardTitleRowVariants = classVarianceAuthority.cva(
+  "flex min-w-0 items-center gap-0.5"
+);
+var featureCardCaretVariants = classVarianceAuthority.cva(
+  "flex shrink-0 items-center text-card-foreground-muted [&_svg]:size-4 [&_svg]:shrink-0"
+);
+function setRef(ref, node) {
+  if (typeof ref === "function") ref(node);
+  else if (ref) ref.current = node;
+}
+function FeatureCard({
+  title,
+  subtitle,
+  leading,
+  trailing,
+  caret = true,
+  asChild = false,
+  href,
+  className,
+  children,
+  ref,
+  ...props
+}) {
+  const interactive = asChild || href != null;
+  const content = /* @__PURE__ */ jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [
+    leading != null && /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        "data-slot": "feature-card-leading",
+        "aria-hidden": "true",
+        className: featureCardLeadingVariants(),
+        children: leading
+      }
+    ),
+    /* @__PURE__ */ jsxRuntime.jsxs("span", { "data-slot": "feature-card-text", className: featureCardTextVariants(), children: [
+      /* @__PURE__ */ jsxRuntime.jsxs("span", { className: featureCardTitleRowVariants(), children: [
+        /* @__PURE__ */ jsxRuntime.jsx("span", { className: "body-02-medium truncate text-card-foreground", children: title }),
+        caret && /* @__PURE__ */ jsxRuntime.jsx(
+          "span",
+          {
+            "data-slot": "feature-card-caret",
+            "aria-hidden": "true",
+            className: featureCardCaretVariants(),
+            children: /* @__PURE__ */ jsxRuntime.jsx(react.CaretRightIcon, {})
+          }
+        )
+      ] }),
+      subtitle != null && /* @__PURE__ */ jsxRuntime.jsx("span", { className: "body-03 truncate text-card-foreground-muted", children: subtitle })
+    ] }),
+    trailing != null && /* @__PURE__ */ jsxRuntime.jsx(
+      "span",
+      {
+        "data-slot": "feature-card-trailing",
+        "aria-hidden": "true",
+        className: featureCardTrailingVariants(),
+        children: trailing
+      }
+    )
+  ] });
+  const rootClassName = cn(featureCardVariants({ interactive }), className);
+  if (asChild) {
+    if (!React__namespace.isValidElement(children)) {
+      throw new Error(
+        "FeatureCard: `asChild` requires a single React element child"
+      );
+    }
+    const child = children;
+    const childProps = child.props;
+    return React__namespace.cloneElement(
+      child,
+      {
+        ...props,
+        ...childProps,
+        "data-slot": "feature-card",
+        ref: (node) => {
+          setRef(ref, node);
+          setRef(childProps.ref, node);
+        },
+        className: cn(
+          rootClassName,
+          childProps.className
+        ),
+        onClick: (event) => {
+          props.onClick?.(event);
+          childProps.onClick?.(event);
+        },
+        style: {
+          ...props.style,
+          ...childProps.style
+        }
+      },
+      content,
+      childProps.children
+    );
+  }
+  if (href != null) {
+    return /* @__PURE__ */ jsxRuntime.jsx(
+      "a",
+      {
+        "data-slot": "feature-card",
+        href,
+        className: rootClassName,
+        ref,
+        ...props,
+        children: content
+      }
+    );
+  }
+  return /* @__PURE__ */ jsxRuntime.jsx(
+    "div",
+    {
+      "data-slot": "feature-card",
+      className: rootClassName,
+      ref,
+      ...props,
+      children: content
+    }
+  );
+}
+
+exports.FeatureCard = FeatureCard;
+exports.featureCardCaretVariants = featureCardCaretVariants;
+exports.featureCardLeadingVariants = featureCardLeadingVariants;
+exports.featureCardTextVariants = featureCardTextVariants;
+exports.featureCardTitleRowVariants = featureCardTitleRowVariants;
+exports.featureCardTrailingVariants = featureCardTrailingVariants;
+exports.featureCardVariants = featureCardVariants;

package/dist/feature-card.d.cts

@@ -0,0 +1,54 @@
+import * as React from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+interface FeatureCardProps extends Omit<React.ComponentProps<"a">, "title" | "ref"> {
+    /** Title line (`body-02-medium`). Accessible name of an interactive card. */
+    title: React.ReactNode;
+    /** Optional subtitle line (`body-03`, muted). */
+    subtitle?: React.ReactNode;
+    /** Optional 24px leading icon slot (decorative, `aria-hidden`). */
+    leading?: React.ReactNode;
+    /** Optional 24px trailing icon slot (decorative, `aria-hidden`). */
+    trailing?: React.ReactNode;
+    /** Show the inline caret after the title. Default `true` (matches Figma). */
+    caret?: boolean;
+    /**
+     * Render the single element child as the root (a router `<Link>` / `<a>`),
+     * keeping all card styling. Requires exactly one valid element child.
+     */
+    asChild?: boolean;
+    /** Ref forwarded to the root element. */
+    ref?: React.Ref<HTMLElement>;
+}
+declare function FeatureCard({ title, subtitle, leading, trailing, caret, asChild, href, className, children, ref, ...props }: FeatureCardProps): React.JSX.Element;
+
+/**
+ * FeatureCard styling — the Figma `feature-card` (node `4854:144741`). Binds
+ * ONLY to the `card-*` semantic token layer (never primitives / mode
+ * plumbing); theme switching is automatic via `.dark`, so no `dark:` variants.
+ *
+ * `feature-card` is a navigation card: the whole surface is the click target.
+ * The Figma `border-r` divider is NOT baked in — grouping/dividers are a
+ * consumer layout concern (a standalone card carries no stray border).
+ */
+/**
+ * The card row. `h-16`=64px, `gap-3`=12px, `px-4`=16px, `py-3`=12px.
+ * `no-underline` strips the default `<a>` underline (the root may be an anchor
+ * or a cloned link). Interactive roots add hover accent + the ADR-0010 focus
+ * ring; a presentational root stays static.
+ */
+declare const featureCardVariants: (props?: ({
+    interactive?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+/** Leading 24px decorative icon slot (`foreground`). */
+declare const featureCardLeadingVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/** Trailing 24px decorative icon slot (`foreground-muted`). */
+declare const featureCardTrailingVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/** Title + subtitle column. `min-w-0` + `flex-1` enable text truncation. */
+declare const featureCardTextVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/** Title + inline caret row. `gap-0.5`=2px; `min-w-0` lets the title truncate. */
+declare const featureCardTitleRowVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/** Inline 16px muted caret slot. */
+declare const featureCardCaretVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+
+export { FeatureCard, type FeatureCardProps, featureCardCaretVariants, featureCardLeadingVariants, featureCardTextVariants, featureCardTitleRowVariants, featureCardTrailingVariants, featureCardVariants };

package/dist/feature-card.d.ts

@@ -0,0 +1,54 @@
+import * as React from 'react';
+import * as class_variance_authority_types from 'class-variance-authority/types';
+
+interface FeatureCardProps extends Omit<React.ComponentProps<"a">, "title" | "ref"> {
+    /** Title line (`body-02-medium`). Accessible name of an interactive card. */
+    title: React.ReactNode;
+    /** Optional subtitle line (`body-03`, muted). */
+    subtitle?: React.ReactNode;
+    /** Optional 24px leading icon slot (decorative, `aria-hidden`). */
+    leading?: React.ReactNode;
+    /** Optional 24px trailing icon slot (decorative, `aria-hidden`). */
+    trailing?: React.ReactNode;
+    /** Show the inline caret after the title. Default `true` (matches Figma). */
+    caret?: boolean;
+    /**
+     * Render the single element child as the root (a router `<Link>` / `<a>`),
+     * keeping all card styling. Requires exactly one valid element child.
+     */
+    asChild?: boolean;
+    /** Ref forwarded to the root element. */
+    ref?: React.Ref<HTMLElement>;
+}
+declare function FeatureCard({ title, subtitle, leading, trailing, caret, asChild, href, className, children, ref, ...props }: FeatureCardProps): React.JSX.Element;
+
+/**
+ * FeatureCard styling — the Figma `feature-card` (node `4854:144741`). Binds
+ * ONLY to the `card-*` semantic token layer (never primitives / mode
+ * plumbing); theme switching is automatic via `.dark`, so no `dark:` variants.
+ *
+ * `feature-card` is a navigation card: the whole surface is the click target.
+ * The Figma `border-r` divider is NOT baked in — grouping/dividers are a
+ * consumer layout concern (a standalone card carries no stray border).
+ */
+/**
+ * The card row. `h-16`=64px, `gap-3`=12px, `px-4`=16px, `py-3`=12px.
+ * `no-underline` strips the default `<a>` underline (the root may be an anchor
+ * or a cloned link). Interactive roots add hover accent + the ADR-0010 focus
+ * ring; a presentational root stays static.
+ */
+declare const featureCardVariants: (props?: ({
+    interactive?: boolean | null | undefined;
+} & class_variance_authority_types.ClassProp) | undefined) => string;
+/** Leading 24px decorative icon slot (`foreground`). */
+declare const featureCardLeadingVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/** Trailing 24px decorative icon slot (`foreground-muted`). */
+declare const featureCardTrailingVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/** Title + subtitle column. `min-w-0` + `flex-1` enable text truncation. */
+declare const featureCardTextVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/** Title + inline caret row. `gap-0.5`=2px; `min-w-0` lets the title truncate. */
+declare const featureCardTitleRowVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+/** Inline 16px muted caret slot. */
+declare const featureCardCaretVariants: (props?: class_variance_authority_types.ClassProp | undefined) => string;
+
+export { FeatureCard, type FeatureCardProps, featureCardCaretVariants, featureCardLeadingVariants, featureCardTextVariants, featureCardTitleRowVariants, featureCardTrailingVariants, featureCardVariants };

package/dist/feature-card.js

@@ -0,0 +1,2 @@
+export { FeatureCard, featureCardCaretVariants, featureCardLeadingVariants, featureCardTextVariants, featureCardTitleRowVariants, featureCardTrailingVariants, featureCardVariants } from './chunk-EOAB6G2D.js';
+import './chunk-7EOSDFS3.js';