@alexgorbatchev/shadcn 0.0.48 → 0.0.50

package/dist/chunk-xfryhw7e.js

@@ -0,0 +1,225 @@
+import {
+  useDensity
+} from "./chunk-e6hk39ev.js";
+import {
+  usePortalContainer2,
+  usePortalNode,
+  PortalProvider2
+} from "./chunk-x90xmrba.js";
+import {
+  cn2
+} from "./chunk-en44w1pn.js";
+import {
+  useAnalyticsCallback
+} from "./chunk-5mydsjp3.js";
+
+// src/components/Select.tsx
+import { Select as SelectPrimitive } from "@base-ui/react/select";
+import { useDirection } from "@base-ui/react/direction-provider";
+import { ChevronDownIcon, CheckIcon, ChevronUpIcon } from "lucide-react";
+import { jsx, jsxs } from "react/jsx-runtime";
+"use client";
+function Select2({
+  analytics,
+  ...props
+}) {
+  const onValueChange = useAnalyticsCallback("Select", analytics, { name: "ui.change-request" }, props.onValueChange);
+  const onOpenChange = useAnalyticsCallback("Select", analytics, (open, _details) => ({ name: "ui.open-request", open }), props.onOpenChange);
+  return /* @__PURE__ */ jsx(SelectPrimitive.Root, {
+    ...props,
+    onValueChange,
+    onOpenChange
+  });
+}
+function SelectGroup2({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx(SelectPrimitive.Group, {
+    "data-density": density,
+    "data-slot": "select-group",
+    className: (state) => cn2("scroll-my-1 p-1", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function SelectValue2({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx(SelectPrimitive.Value, {
+    "data-density": density,
+    "data-slot": "select-value",
+    className: (state) => cn2("flex flex-1 text-start", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function SelectTrigger2({ density, className, size = "default", children, ...props }) {
+  return /* @__PURE__ */ jsxs(SelectPrimitive.Trigger, {
+    "data-density": density,
+    "data-slot": "select-trigger",
+    "data-size": size,
+    className: (state) => cn2("flex w-fit items-center justify-between gap-control-gap rounded-sm border border-input bg-transparent py-2 pe-2 ps-2.5 text-sm whitespace-nowrap transition-colors outline-none select-none focus-visible:border-ring focus-visible:ring-1 focus-visible:ring-ring disabled:cursor-not-allowed disabled:opacity-50 aria-invalid:border-destructive aria-invalid:ring-3 aria-invalid:ring-destructive data-placeholder:text-muted-foreground data-[size=default]:h-control data-[size=sm]:h-control-sm data-[size=sm]:rounded-sm *:data-[slot=select-value]:line-clamp-1 *:data-[slot=select-value]:flex *:data-[slot=select-value]:items-center *:data-[slot=select-value]:gap-control-gap [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
+    ...props,
+    children: [
+      children,
+      /* @__PURE__ */ jsx(SelectPrimitive.Icon, {
+        render: /* @__PURE__ */ jsx(ChevronDownIcon, {
+          className: "pointer-events-none size-4 text-muted-foreground"
+        })
+      })
+    ]
+  });
+}
+function SelectContent2({
+  density,
+  className,
+  children,
+  side = "bottom",
+  sideOffset = 4,
+  align = "center",
+  alignOffset = 0,
+  alignItemWithTrigger = true,
+  ...props
+}) {
+  const resolvedDensity = useDensity(density);
+  const direction = useDirection();
+  const container = usePortalContainer2();
+  const portal = usePortalNode();
+  return /* @__PURE__ */ jsx(SelectPrimitive.Portal, {
+    container,
+    ref: portal.ref,
+    children: /* @__PURE__ */ jsx(PortalProvider2, {
+      container: portal.node,
+      children: /* @__PURE__ */ jsx(SelectPrimitive.Positioner, {
+        side,
+        sideOffset,
+        align,
+        alignOffset,
+        alignItemWithTrigger,
+        className: "isolate ",
+        children: /* @__PURE__ */ jsxs(SelectPrimitive.Popup, {
+          dir: direction,
+          "data-density": resolvedDensity,
+          "data-slot": "select-content",
+          "data-align-trigger": alignItemWithTrigger,
+          className: (state) => cn2("relative isolate max-h-(--available-height) w-(--anchor-width) min-w-36 origin-(--transform-origin) overflow-x-hidden overflow-y-auto rounded-md bg-popover text-popover-foreground border border-frame-edge shadow-frame duration-120 data-[align-trigger=true]:animate-none data-open:animate-in data-open:fade-in-0 data-closed:animate-out data-closed:fade-out-0 motion-reduce:animate-none", typeof className === "function" ? className(state) : className),
+          ...props,
+          children: [
+            /* @__PURE__ */ jsx(SelectScrollUpButton2, {}),
+            /* @__PURE__ */ jsx(SelectPrimitive.List, {
+              children
+            }),
+            /* @__PURE__ */ jsx(SelectScrollDownButton2, {})
+          ]
+        })
+      })
+    })
+  });
+}
+function SelectLabel2({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx(SelectPrimitive.GroupLabel, {
+    "data-density": density,
+    "data-slot": "select-label",
+    className: (state) => cn2("px-1.5 py-1 text-xs text-muted-foreground", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function SelectItem2({ density, className, children, ...props }) {
+  return /* @__PURE__ */ jsxs(SelectPrimitive.Item, {
+    "data-density": density,
+    "data-slot": "select-item",
+    className: (state) => cn2("relative flex w-full cursor-default items-center gap-control-gap rounded-md py-1 pe-8 ps-1.5 text-sm outline-hidden select-none focus:bg-accent focus:text-accent-foreground not-data-[variant=destructive]:focus:**:text-accent-foreground data-disabled:pointer-events-none data-disabled:opacity-50 [&_svg]:pointer-events-none [&_svg]:shrink-0 [&_svg:not([class*='size-'])]:size-4 *:[span]:last:flex *:[span]:last:items-center *:[span]:last:gap-2", typeof className === "function" ? className(state) : className),
+    ...props,
+    children: [
+      /* @__PURE__ */ jsx(SelectPrimitive.ItemText, {
+        className: "flex flex-1 shrink-0 gap-2 whitespace-nowrap",
+        children
+      }),
+      /* @__PURE__ */ jsx(SelectPrimitive.ItemIndicator, {
+        render: /* @__PURE__ */ jsx("span", {
+          className: "pointer-events-none absolute end-2 flex size-4 items-center justify-center"
+        }),
+        children: /* @__PURE__ */ jsx(CheckIcon, {
+          className: "pointer-events-none"
+        })
+      })
+    ]
+  });
+}
+function SelectSeparator2({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx(SelectPrimitive.Separator, {
+    "data-density": density,
+    "data-slot": "select-separator",
+    className: (state) => cn2("pointer-events-none -mx-1 my-1 h-px bg-border", typeof className === "function" ? className(state) : className),
+    ...props
+  });
+}
+function SelectScrollUpButton2({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx(SelectPrimitive.ScrollUpArrow, {
+    "data-density": density,
+    "data-slot": "select-scroll-up-button",
+    className: (state) => cn2("top-0 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
+    ...props,
+    children: /* @__PURE__ */ jsx(ChevronUpIcon, {})
+  });
+}
+function SelectScrollDownButton2({ density, className, ...props }) {
+  return /* @__PURE__ */ jsx(SelectPrimitive.ScrollDownArrow, {
+    "data-density": density,
+    "data-slot": "select-scroll-down-button",
+    className: (state) => cn2("bottom-0 flex w-full cursor-default items-center justify-center bg-popover py-1 [&_svg:not([class*='size-'])]:size-4", typeof className === "function" ? className(state) : className),
+    ...props,
+    children: /* @__PURE__ */ jsx(ChevronDownIcon, {})
+  });
+}
+
+// src/components/OptionSelect.tsx
+import { jsx as jsx2, jsxs as jsxs2 } from "react/jsx-runtime";
+function OptionSelect2({
+  options,
+  value,
+  defaultValue,
+  onValueChange,
+  placeholder,
+  name,
+  id,
+  disabled,
+  required,
+  size = "default",
+  width = "fit",
+  density,
+  analytics,
+  "aria-label": ariaLabel
+}) {
+  return /* @__PURE__ */ jsxs2(Select2, {
+    items: options,
+    analytics,
+    name,
+    disabled,
+    required,
+    ...value === undefined ? {} : { value },
+    ...defaultValue === undefined ? {} : { defaultValue },
+    onValueChange: (next) => {
+      if (next !== null)
+        onValueChange?.(next);
+    },
+    children: [
+      /* @__PURE__ */ jsx2(SelectTrigger2, {
+        id,
+        "aria-label": ariaLabel,
+        density,
+        size,
+        className: cn2(width === "full" && "w-full"),
+        children: /* @__PURE__ */ jsx2(SelectValue2, {
+          placeholder
+        })
+      }),
+      /* @__PURE__ */ jsx2(SelectContent2, {
+        density,
+        children: /* @__PURE__ */ jsx2(SelectGroup2, {
+          children: options.map((option) => /* @__PURE__ */ jsx2(SelectItem2, {
+            value: option.value,
+            disabled: option.disabled,
+            children: option.label
+          }, option.value))
+        })
+      })
+    ]
+  });
+}
+
+export { Select2, SelectGroup2, SelectValue2, SelectTrigger2, SelectContent2, SelectLabel2, SelectItem2, SelectSeparator2, SelectScrollUpButton2, SelectScrollDownButton2, OptionSelect2 };

package/dist/{chunk-k01gpm23.js → chunk-xg439a2k.js}

@@ -1,6 +1,6 @@
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 import {
   deriveVoiceOrbState
 } from "./chunk-vygzdvrk.js";

package/dist/{chunk-2ye8evra.js → chunk-xk5f09gs.js}

@@ -1,6 +1,6 @@
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 import {
   indexIn,
   at

package/dist/{chunk-ynkpdpn0.js → chunk-xw5992sc.js}

@@ -1,6 +1,6 @@
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 
 // src/components/assistant-ui/utils/diffViewer/constants.ts
 import { cva } from "class-variance-authority";

package/dist/{chunk-3b6ws9hk.js → chunk-xywttk96.js}

@@ -6,10 +6,10 @@ import {
   CommandGroup2,
   CommandItem2,
   CommandShortcut2
-} from "./chunk-0twprqdp.js";
+} from "./chunk-5bq2j907.js";
 import {
   Kbd2
-} from "./chunk-vyve5wf3.js";
+} from "./chunk-7vnpp3ya.js";
 
 // src/components/assistant-ui/elements/CommandPalette.tsx
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/{chunk-f28xnx55.js → chunk-y18e8eaz.js}

@@ -1,9 +1,9 @@
 import {
   MermaidZoom2
-} from "./chunk-z8n03ra5.js";
+} from "./chunk-ptdr68cq.js";
 import {
   MermaidDiagram3
-} from "./chunk-m0agthfm.js";
+} from "./chunk-65xd5we6.js";
 
 // src/components/assistant-ui/native/MermaidDiagram.tsx
 import { memo } from "react";

package/dist/{chunk-46tg5t7g.js → chunk-y2dn791x.js}

@@ -1,15 +1,15 @@
 import {
   VoiceStatusDot2
-} from "./chunk-k01gpm23.js";
+} from "./chunk-xg439a2k.js";
 import {
   VoiceConnectButton2
-} from "./chunk-hxg0pkj9.js";
+} from "./chunk-x0212x2e.js";
 import {
   VoiceMuteButton2
-} from "./chunk-05shyxqp.js";
+} from "./chunk-3gxptxxs.js";
 import {
   VoiceDisconnectButton2
-} from "./chunk-c4m53x5s.js";
+} from "./chunk-1wrsg75m.js";
 
 // src/components/assistant-ui/native/VoiceControl.tsx
 import { AuiIf } from "@assistant-ui/react";

package/dist/{chunk-esrypw6g.js → chunk-ya4v4p8k.js}

@@ -1,9 +1,9 @@
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 import {
   Button2
-} from "./chunk-38301e40.js";
+} from "./chunk-bd09gygt.js";
 import {
   take
 } from "./chunk-v8ks0cfq.js";

package/dist/{chunk-kz9np152.js → chunk-ybs1waxw.js}

@@ -1,6 +1,6 @@
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 import {
   paper
 } from "./chunk-fgmcbtyt.js";

package/dist/{chunk-474fgeht.js → chunk-yeht7bxz.js}

@@ -1,9 +1,9 @@
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 import {
   Button2
-} from "./chunk-38301e40.js";
+} from "./chunk-bd09gygt.js";
 
 // src/components/assistant-ui/elements/ConnectionState.tsx
 import { CheckIcon, CloudOffIcon, Loader2Icon } from "lucide-react";

package/dist/{chunk-cy1xv5nz.js → chunk-yrp7xtb5.js}

@@ -1,9 +1,12 @@
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 import {
   buttonVariants2
-} from "./chunk-38301e40.js";
+} from "./chunk-bd09gygt.js";
+import {
+  OptionSelect2
+} from "./chunk-xfryhw7e.js";
 import {
   useAnalyticsCallback
 } from "./chunk-5mydsjp3.js";
@@ -78,6 +81,7 @@ function Calendar2({
     classNames: getCalendarClassNames({ buttonVariant, classNames }),
     components: {
       DayButton: CalendarDayButton2,
+      Dropdown: CalendarDropdown,
       ...components
     },
     ...props,
@@ -97,5 +101,21 @@ function CalendarDayButton2({ className, day, modifiers, ...props }) {
     ...props
   });
 }
+function CalendarDropdown({
+  options,
+  value,
+  onChange,
+  disabled,
+  "aria-label": ariaLabel
+}) {
+  return /* @__PURE__ */ jsx(OptionSelect2, {
+    "aria-label": ariaLabel,
+    disabled,
+    size: "sm",
+    value: String(value),
+    options: (options ?? []).map((option) => ({ ...option, value: String(option.value) })),
+    onValueChange: (next) => onChange?.({ target: { value: next } })
+  });
+}
 
-export { getCalendarClassNames, Calendar2, CalendarDayButton2 };
+export { getCalendarClassNames, Calendar2, CalendarDayButton2, CalendarDropdown };

package/dist/{chunk-4e1eq1t5.js → chunk-z0z9p92d.js}

@@ -1,14 +1,14 @@
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 import {
   Button2
-} from "./chunk-38301e40.js";
+} from "./chunk-bd09gygt.js";
 import {
   InputGroup2,
   InputGroupAddon2,
   InputGroupInput2
-} from "./chunk-14mh00z3.js";
+} from "./chunk-rxjxb4vy.js";
 import {
   field,
   mono

package/dist/{chunk-5myr07fp.js → chunk-z15pn5a5.js}

@@ -1,9 +1,9 @@
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 import {
   Button2
-} from "./chunk-38301e40.js";
+} from "./chunk-bd09gygt.js";
 
 // src/components/assistant-ui/elements/Suggestions.tsx
 import { jsx } from "react/jsx-runtime";

package/dist/{chunk-p5x18ckg.js → chunk-zdp3bb9e.js}

@@ -1,6 +1,6 @@
 import {
   EveAskQuestion2
-} from "./chunk-vg2j5044.js";
+} from "./chunk-t5e0s8q6.js";
 
 // src/components/assistant-ui/eveAskQuestionToolkit.ts
 import { defineToolkit } from "@assistant-ui/react";

package/dist/{chunk-kv1akmf5.js → chunk-zdpm4kf4.js}

@@ -1,13 +1,13 @@
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 import {
   Card2,
   CardHeader2,
   CardTitle2,
   CardDescription2,
   CardContent2
-} from "./chunk-bygq5yqf.js";
+} from "./chunk-k1f35j55.js";
 import {
   codeScroll,
   codeSurface

package/dist/{chunk-ray29hdb.js → chunk-zk8enn91.js}

@@ -3,13 +3,13 @@ import {
 } from "./chunk-tcefvfr8.js";
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 import {
   Popover2,
   PopoverTrigger2,
   PopoverContent2,
   PopoverTitle2
-} from "./chunk-21ab0jsp.js";
+} from "./chunk-bf8kbj33.js";
 
 // src/components/assistant-ui/native/MessageTiming.tsx
 import { useMessageTiming } from "@assistant-ui/react";

package/dist/{chunk-r7mfpkbb.js → chunk-zmygyj8h.js}

@@ -3,18 +3,18 @@ import {
 } from "./chunk-tcefvfr8.js";
 import {
   AnalyticsLink
-} from "./chunk-4710gn6d.js";
+} from "./chunk-m4geb1s5.js";
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 import {
   Button2
-} from "./chunk-38301e40.js";
+} from "./chunk-bd09gygt.js";
 import {
   Dialog2,
   DialogContent2,
   DialogTitle2
-} from "./chunk-jgdpa00w.js";
+} from "./chunk-4t23yhc0.js";
 import {
   safeHref
 } from "./chunk-xhtsnwnb.js";

package/dist/{chunk-m7n2f6nf.js → chunk-zrgacdwr.js}

@@ -1,6 +1,6 @@
 import {
   Button2
-} from "./chunk-38301e40.js";
+} from "./chunk-bd09gygt.js";
 
 // src/components/assistant-ui/elements/ComposerModelTrigger.tsx
 import { ChevronDownIcon } from "lucide-react";

package/dist/{chunk-gbmvkt3q.js → chunk-zs4h45d8.js}

@@ -3,17 +3,16 @@ import {
 } from "./chunk-7ny0vyek.js";
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 import {
   Badge2
-} from "./chunk-wjx6zf94.js";
+} from "./chunk-9t530p75.js";
 import {
   Button2
-} from "./chunk-38301e40.js";
+} from "./chunk-bd09gygt.js";
 import {
-  NativeSelect2,
-  NativeSelectOption2
-} from "./chunk-r4jzz4f2.js";
+  OptionSelect2
+} from "./chunk-xfryhw7e.js";
 import {
   useAnalyticsCallback
 } from "./chunk-5mydsjp3.js";
@@ -395,16 +394,16 @@ function Kanban2({
                         /* @__PURE__ */ jsxs3("div", {
                           className: "flex items-center gap-1",
                           children: [
-                            /* @__PURE__ */ jsx4(NativeSelect2, {
+                            /* @__PURE__ */ jsx4(OptionSelect2, {
                               "aria-label": `Move ${item.title} to`,
                               value: column.id,
                               disabled,
-                              onChange: (event) => move(item.id, event.target.value),
-                              children: columns.map((target) => /* @__PURE__ */ jsx4(NativeSelectOption2, {
+                              onValueChange: (next) => move(item.id, next),
+                              options: columns.map((target) => ({
                                 value: target.id,
-                                disabled: Boolean(canMove && !canMove(item, target.id)),
-                                children: target.label
-                              }, target.id))
+                                label: target.label,
+                                disabled: Boolean(canMove && !canMove(item, target.id))
+                              }))
                             }),
                             /* @__PURE__ */ jsx4(Button2, {
                               type: "button",

package/dist/{chunk-cvg5366s.js → chunk-zthc8ajd.js}

@@ -1,6 +1,6 @@
 import {
   CommandEmpty2
-} from "./chunk-0twprqdp.js";
+} from "./chunk-5bq2j907.js";
 
 // src/components/assistant-ui/elements/ModelSelectorEmpty.tsx
 import { jsx } from "react/jsx-runtime";

package/dist/{chunk-3g8p9apn.js → chunk-zyxzn7xf.js}

@@ -1,6 +1,6 @@
 import {
   cn2
-} from "./chunk-cp2m7y7v.js";
+} from "./chunk-en44w1pn.js";
 
 // src/components/assistant-ui/elements/ReasoningFade.tsx
 import { jsx } from "react/jsx-runtime";

package/dist/components/AppShell.d.ts

@@ -3,10 +3,21 @@ import type { IDensityProps } from "../density/types.js";
 type AppShellNavigationItem = {
     id: string;
     label: string;
-    href: string;
     icon?: ReactNode;
     active?: boolean;
-};
+} & ({
+    href: string;
+    render?: never;
+} | {
+    href?: never;
+    /** A router link element, such as `<Link to="/settings" />`; it owns the destination and navigation. */
+    render: ReactElement;
+});
+/**
+ * - `scroll`: children scroll in a padded column.
+ * - `fill`: children fill the remaining area without padding or scrolling and own their overflow.
+ */
+type AppShellContent = "scroll" | "fill";
 type AppShellProps = IDensityProps & {
     navigation: readonly AppShellNavigationItem[];
     brand: ReactNode;
@@ -17,7 +28,8 @@ type AppShellProps = IDensityProps & {
     height?: CSSProperties["height"];
     defaultSidebarOpen?: boolean;
     label?: string;
+    content?: AppShellContent;
 };
-declare function AppShell({ navigation, brand, children, header, sidebarFooter, footer, height, defaultSidebarOpen, label, density, }: AppShellProps): ReactElement;
+declare function AppShell({ navigation, brand, children, header, sidebarFooter, footer, height, defaultSidebarOpen, label, content, density, }: AppShellProps): ReactElement;
 export { AppShell };
-export type { AppShellNavigationItem, AppShellProps };
+export type { AppShellContent, AppShellNavigationItem, AppShellProps };

package/dist/components/Container.d.ts

@@ -0,0 +1,13 @@
+import type { ReactElement } from "react";
+import { useRender } from "@base-ui/react/use-render";
+import type { IDensityProps } from "../density/types.js";
+import type { ContainerWidth, LayoutSpacing, LayoutState } from "../layout/types.js";
+type ContainerProps = useRender.ComponentProps<"div", LayoutState> & IDensityProps & {
+    /** Maximum inline size: `xs` 20rem, `sm` 24rem, `md` 42rem, `lg` 64rem, `xl` 80rem, or `full`. */
+    width?: ContainerWidth;
+    padding?: LayoutSpacing;
+};
+/** Horizontally centered column with a maximum width. Use `render` for a semantic element such as `main`. */
+declare function Container({ width, padding, density, className, render, ...props }: ContainerProps): ReactElement;
+export { Container };
+export type { ContainerProps };

package/dist/components/Grid.d.ts

@@ -0,0 +1,27 @@
+import type { ReactElement } from "react";
+import { useRender } from "@base-ui/react/use-render";
+import type { IDensityProps } from "../density/types.js";
+import type { GridAlign, GridColumns, GridMinColumnWidth, GridSpan, LayoutHeight, LayoutSpacing, LayoutState, ResponsiveValue } from "../layout/types.js";
+type GridProps = useRender.ComponentProps<"div", LayoutState> & IDensityProps & {
+    /** Column count, optionally per viewport breakpoint, such as `{ base: 1, md: 2, xl: 4 }`. */
+    columns?: ResponsiveValue<GridColumns>;
+    /** Fit as many equal columns of at least this width as the grid's own width allows; replaces `columns`. */
+    minColumnWidth?: GridMinColumnWidth;
+    gap?: LayoutSpacing;
+    padding?: LayoutSpacing;
+    /** Block-axis alignment of items within their rows. */
+    align?: GridAlign;
+    /** Take the remaining space of a parent Stack; content may shrink below its intrinsic size. */
+    grow?: boolean;
+    height?: LayoutHeight;
+};
+/** CSS grid with breakpoint or intrinsic columns and density-aware spacing. Use `render` for a semantic element. */
+declare function Grid({ columns, minColumnWidth, gap, padding, align, grow, height, density, className, render, ...props }: GridProps): ReactElement;
+type GridItemProps = useRender.ComponentProps<"div", LayoutState> & IDensityProps & {
+    /** Columns to span, optionally per viewport breakpoint; `full` spans every column at any count. */
+    span?: ResponsiveValue<GridSpan>;
+};
+/** A grid cell that spans several columns. Use `render` for a semantic element. */
+declare function GridItem({ span, density, className, render, ...props }: GridItemProps): ReactElement;
+export { Grid, GridItem };
+export type { GridProps, GridItemProps };

package/dist/components/Heading.d.ts

@@ -0,0 +1,21 @@
+import type { ReactElement } from "react";
+import { useRender } from "@base-ui/react/use-render";
+import type { Density, IDensityProps } from "../density/types.js";
+type HeadingLevel = 1 | 2 | 3 | 4 | 5 | 6;
+type HeadingSize = "sm" | "base" | "lg" | "xl";
+type HeadingState = {
+    slot: "heading";
+    level: HeadingLevel;
+    density?: Density;
+};
+type HeadingProps = useRender.ComponentProps<"h2", HeadingState> & IDensityProps & {
+    /** Document outline level; it selects the `h1`–`h6` element. */
+    level: HeadingLevel;
+    /** Visual size, independent of the outline level. Defaults by level. */
+    size?: HeadingSize;
+    truncate?: boolean;
+};
+/** Section heading whose outline level and visual size are chosen independently. */
+declare function Heading({ level, size, truncate, density, className, render, ...props }: HeadingProps): ReactElement;
+export { Heading };
+export type { HeadingProps, HeadingLevel, HeadingSize };