@danxbot/ui 13.1.0 → 13.2.0

package/dist/types/components/Button.d.ts

@@ -21,6 +21,7 @@ declare const button: import("tailwind-variants").TVReturnType<{
         md: "h-control-md rounded-md px-5 text-sm";
         lg: "h-control-lg rounded-lg px-6 text-md";
         xl: "h-control-xl rounded-lg px-8 text-lg";
+        list: "h-auto w-full items-start justify-start gap-3 rounded-md px-3 py-2 text-left text-sm whitespace-normal";
     };
     iconOnly: {
         true: "px-0 aspect-square";
@@ -50,6 +51,7 @@ declare const button: import("tailwind-variants").TVReturnType<{
         md: "h-control-md rounded-md px-5 text-sm";
         lg: "h-control-lg rounded-lg px-6 text-md";
         xl: "h-control-xl rounded-lg px-8 text-lg";
+        list: "h-auto w-full items-start justify-start gap-3 rounded-md px-3 py-2 text-left text-sm whitespace-normal";
     };
     iconOnly: {
         true: "px-0 aspect-square";
@@ -79,6 +81,7 @@ declare const button: import("tailwind-variants").TVReturnType<{
         md: "h-control-md rounded-md px-5 text-sm";
         lg: "h-control-lg rounded-lg px-6 text-md";
         xl: "h-control-xl rounded-lg px-8 text-lg";
+        list: "h-auto w-full items-start justify-start gap-3 rounded-md px-3 py-2 text-left text-sm whitespace-normal";
     };
     iconOnly: {
         true: "px-0 aspect-square";
@@ -146,3 +149,42 @@ export interface ButtonProps extends ButtonHTMLAttributes<HTMLButtonElement>, Va
 }
 export declare function Button({ className, variant, size, iconOnly, fullWidth, render, loading, leadingIcon, trailingIcon, disabled, children, onPointerDown, onClick, disabledReason, disabledReasonTooltip, ref, "aria-disabled": ariaDisabled, ...props }: ButtonProps): import("react").JSX.Element;
 export { button as buttonVariants };
+export interface ListItemButtonProps extends Omit<ButtonProps, "size" | "iconOnly" | "fullWidth" | "children"> {
+    /**
+     * The row's bold leading identifier — an actor name, a from-state, a
+     * category label. Always rendered `font-semibold`, on the same wrapping
+     * line as `detail`.
+     */
+    leading: ReactNode;
+    /**
+     * Secondary text following `leading` on the SAME wrapping line — the
+     * action, the target, whatever finishes the sentence `leading` starts.
+     * Rendered `font-normal`; wraps together with `leading` as one line of
+     * text, not as a separate flex item.
+     */
+    detail?: ReactNode;
+    /**
+     * A muted line rendered on its OWN row below `leading`/`detail` — a
+     * trigger, a guard clause, any extra context. Never inlined with the line
+     * above, unlike `detail`.
+     */
+    subline?: ReactNode;
+    /**
+     * Marks this row as the current selection. Stamps `data-selected="true"`
+     * on the rendered `<button>` (omitted entirely, not `"false"`, when unset —
+     * the same convention the native `docs-step-list__item` buttons this
+     * replaces already used, so an existing `[data-selected]` CSS selector
+     * keeps working unchanged) and applies the library's own selected
+     * treatment rather than leaving every consumer to invent one.
+     */
+    selected?: boolean;
+}
+/**
+ * A list-item trigger for multi-line, rich-content rows that `Button`'s
+ * fixed single-line sizes cannot fit — see the file header above.
+ *
+ * `fullWidth` is not a prop here: a list-item row always spans its `<li>`,
+ * which is the entire reason this exists, so it's forced rather than left
+ * for every caller to remember.
+ */
+export declare function ListItemButton({ leading, detail, subline, selected, variant, className, ...props }: ListItemButtonProps): import("react").JSX.Element;

package/dist/types/components/Surface.d.ts

@@ -1,4 +1,5 @@
-import type { ReactNode, Ref } from "react";
+import type { ComponentProps, ReactNode, Ref } from "react";
+import { Collapsible as BaseCollapsible } from "@base-ui/react/collapsible";
 export interface SeparatorProps {
     orientation?: "horizontal" | "vertical";
     /** Text or a chip centred on the line — "or", "Today", a count. */
@@ -33,6 +34,37 @@ export interface ScrollAreaProps {
  * present when you are steering, invisible when you are reading.
  */
 export declare function ScrollArea({ children, maxHeight, className }: ScrollAreaProps): import("react").JSX.Element;
+export interface CollapsibleRootProps extends Omit<ComponentProps<typeof BaseCollapsible.Root>, "render"> {
+}
+/**
+ * Groups a `CollapsibleTrigger` and a `CollapsiblePanel` (or several of
+ * either) that can live anywhere as siblings underneath it — the headless
+ * counterpart to the fully-composed `Collapsible` below. Renders a plain
+ * `<div>` (Base UI's own default); pass `className` for whatever layout the
+ * trigger row and panel need to share, or leave it unset to render no box
+ * at all beyond that default.
+ */
+export declare function CollapsibleRoot({ className, ...props }: CollapsibleRootProps): import("react").JSX.Element;
+export interface CollapsibleTriggerProps extends Omit<ComponentProps<typeof BaseCollapsible.Trigger>, "render"> {
+}
+/**
+ * The bare trigger `<button>` half of the headless `Collapsible` parts —
+ * real Base UI `aria-controls`/`aria-expanded` wiring, zero imposed layout.
+ * Unlike `Collapsible`'s own trigger, this draws no chevron and forces no
+ * flex row: the caller's `children` are the ENTIRE button content, laid out
+ * however the caller wants (e.g. sharing a row with an unrelated `action`
+ * control that is NOT itself part of this button, rendered as a sibling
+ * outside it).
+ */
+export declare function CollapsibleTrigger({ className, ...props }: CollapsibleTriggerProps): import("react").JSX.Element;
+export interface CollapsiblePanelProps extends Omit<ComponentProps<typeof BaseCollapsible.Panel>, "render"> {
+}
+/**
+ * The bare panel half of the headless `Collapsible` parts — same
+ * height-animation recipe `Collapsible`'s own panel uses, with no forced
+ * inner padding wrapper, so the caller controls its own spacing.
+ */
+export declare function CollapsiblePanel({ className, ...props }: CollapsiblePanelProps): import("react").JSX.Element;
 export interface CollapsibleProps {
     /**
      * The trigger's CONTENT — not a button.
@@ -64,7 +96,10 @@ export interface CollapsibleProps {
  * One disclosure, without the accordion around it.
  *
  * Height animates from `--collapsible-panel-height`, which Base UI publishes —
- * no measuring, no effect, no frame of lag on first open.
+ * no measuring, no effect, no frame of lag on first open. Built on the
+ * headless `CollapsibleRoot`/`CollapsibleTrigger`/`CollapsiblePanel` parts
+ * above — see their own doc if this fixed trigger-row-plus-nested-panel
+ * shape doesn't fit your consumer.
  */
 export declare function Collapsible({ trigger, defaultOpen, open, onOpenChange, triggerClassName, chevron, children, className, }: CollapsibleProps): import("react").JSX.Element;
 export interface EmptyStateProps {

package/dist/types/index.d.ts

@@ -13,6 +13,7 @@ export { Icon, type IconProps, type IconSize, type IconName } from "./components
 export { getIcon, hasIcon, iconNames, type IconNode, type IconNodeChild, } from "./lib/icons";
 export { coreIcons, type CoreIconName } from "./icons/data";
 export { Button, type ButtonProps } from "./components/Button";
+export { ListItemButton, type ListItemButtonProps } from "./components/Button";
 export { IconButton, type IconButtonProps, type IconButtonVariant, type IconButtonTone, } from "./components/IconButton";
 export { Badge, type BadgeProps, type BadgeDismiss, } from "./components/Badge";
 export { Callout, type CalloutProps } from "./components/Callout";
@@ -59,7 +60,7 @@ export { PaginationBar, type PaginationBarProps, type PaginationBarMode, } from
 export { Stepper, stepStatus, stepperProgress, advanceBlockReason, assertSteps, type StepperProps, type Step, type StepStatus, type StepperProgress, } from "./components/stepper";
 export { StatusChecklist, tallyChecklist, type StatusChecklistProps, type ChecklistItem, type ChecklistState, type ChecklistTally, } from "./components/checklist";
 export { Toggle, ToggleGroup, Toolbar, ToolbarButton, ToolbarGroup, ToolbarInput, ToolbarSeparator, type ToggleProps, type ToggleGroupProps, type ToolbarProps, type ToolbarButtonProps, type ToolbarGroupProps, type ToolbarInputProps, } from "./components/Toggle";
-export { Separator, ScrollArea, Collapsible, EmptyState, Timeline, type SeparatorProps, type ScrollAreaProps, type CollapsibleProps, type EmptyStateProps, type TimelineProps, type TimelineItem, } from "./components/Surface";
+export { Separator, ScrollArea, Collapsible, CollapsibleRoot, CollapsibleTrigger, CollapsiblePanel, EmptyState, Timeline, type SeparatorProps, type ScrollAreaProps, type CollapsibleProps, type CollapsibleRootProps, type CollapsibleTriggerProps, type CollapsiblePanelProps, type EmptyStateProps, type TimelineProps, type TimelineItem, } from "./components/Surface";
 export { PanelGroup, Panel, PanelResizer, type PanelGroupProps, type PanelProps, type PanelResizerProps, type PanelDirection, type PanelNarrowMode, } from "./components/Panel";
 export { Avatar, AvatarGroup, type AvatarProps, type AvatarGroupProps, type AvatarStatus, } from "./components/Avatar";
 export { Progress, Meter, ProgressRing, type ProgressProps, type MeterProps, type ProgressRingProps, type ProgressRingValueProps, type ProgressRingSegmentsProps, type ProgressRingSegment, type ProgressTone, } from "./components/Progress";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@danxbot/ui",
-  "version": "13.1.0",
+  "version": "13.2.0",
   "type": "module",
   "description": "Danxbot — a domain-agnostic React design system with motion as a first-class primitive.",
   "license": "MIT",