alinea 2.0.0-preview.9 → 2.0.0-rc2

package/dist/components/Tree.js

@@ -1,144 +1,276 @@
 import {
+  $143fb904d86051ce$export$89be5a243e59c4b2,
   $7705c033048f6da7$export$353f5b6fc5456de1,
   $89d060d8eb451127$export$4b687e3f663d618c,
   $89d060d8eb451127$export$53d36ab85dc89436,
-  $89d060d8eb451127$export$7fbedc92909ed28e
-} from "../chunks/chunk-OFEKTDRF.js";
-import "../chunks/chunk-NIVGVRDS.js";
-import "../chunks/chunk-IYAQC63Y.js";
-import "../chunks/chunk-DNJX6CRV.js";
-import "../chunks/chunk-AC4U3IMS.js";
-import "../chunks/chunk-D6RGFNUW.js";
+  $89d060d8eb451127$export$7fbedc92909ed28e,
+  $942f06a693c162e2$export$cacbb3924155d68e
+} from "../chunks/chunk-7DDPSWRY.js";
+import "../chunks/chunk-NUFRM6SI.js";
+import {
+  $42ceafc619f9c3ba$export$fb8073518f34e6ec
+} from "../chunks/chunk-PMGIIYDD.js";
 import "../chunks/chunk-RKDPDEF7.js";
-import "../chunks/chunk-SJBZFMQ2.js";
-import "../chunks/chunk-S4AU6SRS.js";
+import "../chunks/chunk-PSSMQKAH.js";
 import {
   dist_default
 } from "../chunks/chunk-I4OYYAX5.js";
 import "../chunks/chunk-CQ52GEHY.js";
 
 // src/components/Tree.tsx
-import { memo } from "react";
-import { Checkbox } from "./Checkbox.js";
 import { FoldIcon } from "./FoldIcon.js";
 import { Icon } from "./Icon.js";
+import { SelectionCheckbox } from "./internal/SelectionCheckbox.js";
+import { useDragDrop } from "./internal/useDragDrop.js";
 
 // src/components/Tree.module.css
 var Tree_default = {
+  "TreeItem-icon": "alinea-TreeItem-icon",
+  "TreeItemIcon": "alinea-TreeItem-icon",
+  "Tree": "alinea-Tree",
+  "is-allowsDragging": "alinea-is-allowsDragging",
+  "isAllowsDragging": "alinea-is-allowsDragging",
+  "is-dropTarget": "alinea-is-dropTarget",
+  "isDropTarget": "alinea-is-dropTarget",
+  "TreeItem-dragHandle": "alinea-TreeItem-dragHandle",
+  "TreeItemDragHandle": "alinea-TreeItem-dragHandle",
+  "is-invisible": "alinea-is-invisible",
+  "isInvisible": "alinea-is-invisible",
+  "is-dragging": "alinea-is-dragging",
+  "isDragging": "alinea-is-dragging",
+  "is-expanded": "alinea-is-expanded",
+  "isExpanded": "alinea-is-expanded",
+  "TreeItem-label": "alinea-TreeItem-label",
+  "TreeItemLabel": "alinea-TreeItem-label",
+  "TreeItem-chevron": "alinea-TreeItem-chevron",
+  "TreeItemChevron": "alinea-TreeItem-chevron",
+  "TreeItem-labelLink": "alinea-TreeItem-labelLink",
+  "TreeItemLabelLink": "alinea-TreeItem-labelLink",
+  "TreeItem": "alinea-TreeItem",
+  "Tree-empty": "alinea-Tree-empty",
+  "TreeEmpty": "alinea-Tree-empty",
+  "TreeItem-controls": "alinea-TreeItem-controls",
+  "TreeItemControls": "alinea-TreeItem-controls",
+  "is-active": "alinea-is-active",
+  "isActive": "alinea-is-active",
+  "is-expandable": "alinea-is-expandable",
+  "isExpandable": "alinea-is-expandable",
   "TreeItem-foldIcon": "alinea-TreeItem-foldIcon",
   "TreeItemFoldIcon": "alinea-TreeItem-foldIcon",
+  "Tree-dropIndicator": "alinea-Tree-dropIndicator",
+  "TreeDropIndicator": "alinea-Tree-dropIndicator",
   "TreeItem-iconLink": "alinea-TreeItem-iconLink",
   "TreeItemIconLink": "alinea-TreeItem-iconLink",
-  "TreeItem": "alinea-TreeItem",
-  "TreeItem-controls": "alinea-TreeItem-controls",
-  "TreeItemControls": "alinea-TreeItem-controls",
-  "Tree": "alinea-Tree",
-  "TreeItem-chevron": "alinea-TreeItem-chevron",
-  "TreeItemChevron": "alinea-TreeItem-chevron",
-  "TreeItem-dragHandle": "alinea-TreeItem-dragHandle",
-  "TreeItemDragHandle": "alinea-TreeItem-dragHandle"
+  "TreeItem-suffix": "alinea-TreeItem-suffix",
+  "TreeItemSuffix": "alinea-TreeItem-suffix"
 };
 
 // src/components/Tree.tsx
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+import { createElement } from "react";
 var styles = dist_default(Tree_default);
-function Tree(props) {
-  const { className, ...rest } = props;
-  return /* @__PURE__ */ jsx($89d060d8eb451127$export$7fbedc92909ed28e, { ...rest, className: styles.Tree(dist_default.merge({ className })) });
-}
-var TreeItemContent = memo(function TreeItemContent2({
-  disableDragging,
-  icon,
-  iconHref,
-  suffix,
-  children
+function Tree({
+  className,
+  style,
+  items,
+  children,
+  selectionMode = "none",
+  selectedKeys,
+  defaultSelectedKeys,
+  onSelectionChange,
+  disabledKeys,
+  expandedKeys,
+  defaultExpandedKeys,
+  onExpandedChange,
+  onAction,
+  renderEmptyState,
+  virtualized,
+  rowHeight = 34,
+  getDragData,
+  acceptedDragTypes,
+  canDrop,
+  onReorder,
+  onMove,
+  onDropItems,
+  onDropFiles,
+  renderDragPreview,
+  ref,
+  ...props
 }) {
-  return /* @__PURE__ */ jsx($89d060d8eb451127$export$4b687e3f663d618c, { children: ({
-    selectionBehavior,
-    selectionMode,
-    allowsDragging,
-    isDragging,
-    isExpanded
-  }) => /* @__PURE__ */ jsxs(Fragment, { children: [
-    selectionBehavior === "toggle" && selectionMode !== "none" && /* @__PURE__ */ jsx(Checkbox, { slot: "selection" }),
-    /* @__PURE__ */ jsxs("div", { className: styles.TreeItem.controls(), children: [
-      allowsDragging && !disableDragging && /* @__PURE__ */ jsx(
-        $7705c033048f6da7$export$353f5b6fc5456de1,
-        {
-          slot: "drag",
-          "data-invisible": !isDragging,
-          className: styles.TreeItem.dragHandle(),
-          children: "\u2261"
-        }
-      ),
-      /* @__PURE__ */ jsx(
-        $7705c033048f6da7$export$353f5b6fc5456de1,
-        {
-          slot: "chevron",
-          "data-invisible": isDragging,
-          className: styles.TreeItem.chevron(),
-          children: /* @__PURE__ */ jsx(
-            FoldIcon,
-            {
-              "aria-hidden": true,
-              className: styles.TreeItem.foldIcon(),
-              expanded: isExpanded
-            }
-          )
-        }
-      )
-    ] }),
-    icon && /* @__PURE__ */ jsx("span", { "data-slot": "icon", children: iconHref ? /* @__PURE__ */ jsx(
-      "a",
-      {
-        "aria-hidden": true,
-        className: styles.TreeItem.iconLink(),
-        href: iconHref,
-        tabIndex: -1,
-        children: /* @__PURE__ */ jsx(Icon, { icon })
-      }
-    ) : /* @__PURE__ */ jsx(Icon, { icon }) }),
-    /* @__PURE__ */ jsx("span", { "data-slot": "label", children }),
-    suffix && /* @__PURE__ */ jsx("span", { "data-slot": "suffix", children: suffix })
-  ] }) });
-});
+  const dnd = useDragDrop({
+    getDragData,
+    acceptedDragTypes,
+    canDrop,
+    onReorder,
+    onMove,
+    onDropItems,
+    onDropFiles,
+    renderDragPreview,
+    dropIndicatorSlot: "tree-drop-indicator",
+    dropIndicatorClassName: (active) => styles.Tree.dropIndicator({ active })
+  });
+  const tree = /* @__PURE__ */ createElement(
+    $89d060d8eb451127$export$7fbedc92909ed28e,
+    {
+      ...props,
+      key: dnd.key,
+      ref,
+      "data-slot": "tree",
+      className: styles.Tree(dist_default.merge({ className })),
+      style,
+      items,
+      selectionMode,
+      selectionBehavior: selectionMode === "multiple" ? "toggle" : "replace",
+      selectedKeys,
+      defaultSelectedKeys,
+      onSelectionChange,
+      disabledKeys,
+      expandedKeys,
+      defaultExpandedKeys,
+      onExpandedChange,
+      onAction,
+      renderEmptyState: renderEmptyState ? () => /* @__PURE__ */ jsx("div", { "data-slot": "tree-empty", className: styles.Tree.empty(), children: renderEmptyState() }) : void 0,
+      dragAndDropHooks: dnd.dragAndDropHooks
+    },
+    children
+  );
+  if (!virtualized) return tree;
+  return /* @__PURE__ */ jsx(
+    $143fb904d86051ce$export$89be5a243e59c4b2,
+    {
+      layout: $942f06a693c162e2$export$cacbb3924155d68e,
+      layoutOptions: { rowHeight, padding: 0, gap: 0 },
+      children: tree
+    }
+  );
+}
 function TreeItem({
-  disableDragging,
+  id,
   title,
-  icon,
-  iconHref,
   label,
+  icon,
+  href,
+  current,
   suffix,
+  hasChildItems,
+  hideDragHandle,
+  items,
   children,
   className,
-  hasChildItems,
-  ...rest
+  style,
+  ...props
 }) {
   return /* @__PURE__ */ jsxs(
     $89d060d8eb451127$export$53d36ab85dc89436,
     {
+      ...props,
+      id,
       textValue: title,
-      ...rest,
       hasChildItems,
-      className: styles.TreeItem(dist_default.merge({ className })),
+      "data-slot": "tree-item",
+      className: (renderProps) => styles.TreeItem(
+        {
+          // aria-expanded is missing on items whose children load lazily
+          expandable: renderProps.hasChildItems,
+          expanded: renderProps.hasChildItems && renderProps.isExpanded,
+          dragging: renderProps.isDragging,
+          dropTarget: renderProps.isDropTarget,
+          allowsDragging: renderProps.allowsDragging
+        },
+        dist_default.merge({ className })
+      ),
+      style: ({ level }) => ({ "--alinea-tree-level": level, ...style }),
       children: [
-        /* @__PURE__ */ jsx(
-          TreeItemContent,
-          {
-            disableDragging,
-            icon,
-            iconHref,
-            suffix,
-            children: label ?? title
-          }
-        ),
-        children
+        /* @__PURE__ */ jsx($89d060d8eb451127$export$4b687e3f663d618c, { children: ({
+          selectionBehavior,
+          selectionMode,
+          allowsDragging,
+          isDragging,
+          isExpanded
+        }) => /* @__PURE__ */ jsxs(Fragment, { children: [
+          selectionBehavior === "toggle" && selectionMode !== "none" && /* @__PURE__ */ jsx(SelectionCheckbox, {}),
+          /* @__PURE__ */ jsxs(
+            "div",
+            {
+              "data-slot": "tree-item-controls",
+              className: styles.TreeItem.controls(),
+              children: [
+                allowsDragging && !hideDragHandle && /* @__PURE__ */ jsx(
+                  $7705c033048f6da7$export$353f5b6fc5456de1,
+                  {
+                    slot: "drag",
+                    "data-slot": "tree-item-drag-handle",
+                    className: styles.TreeItem.dragHandle(),
+                    children: "\u2261"
+                  }
+                ),
+                /* @__PURE__ */ jsx(
+                  $7705c033048f6da7$export$353f5b6fc5456de1,
+                  {
+                    slot: "chevron",
+                    "data-slot": "tree-item-chevron",
+                    className: styles.TreeItem.chevron({ invisible: isDragging }),
+                    children: /* @__PURE__ */ jsx(
+                      FoldIcon,
+                      {
+                        "aria-hidden": true,
+                        className: styles.TreeItem.foldIcon(),
+                        expanded: isExpanded
+                      }
+                    )
+                  }
+                )
+              ]
+            }
+          ),
+          icon && /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-slot": "tree-item-icon",
+              className: styles.TreeItem.icon(),
+              children: href ? /* @__PURE__ */ jsx(
+                "a",
+                {
+                  "aria-hidden": true,
+                  className: styles.TreeItem.iconLink(),
+                  href,
+                  tabIndex: -1,
+                  children: /* @__PURE__ */ jsx(Icon, { icon })
+                }
+              ) : /* @__PURE__ */ jsx(Icon, { icon })
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-slot": "tree-item-label",
+              className: styles.TreeItem.label(),
+              children: href && !label ? /* @__PURE__ */ jsx(
+                "a",
+                {
+                  "aria-current": current,
+                  className: styles.TreeItem.labelLink(),
+                  href,
+                  children: title
+                }
+              ) : label ?? title
+            }
+          ),
+          suffix && /* @__PURE__ */ jsx(
+            "span",
+            {
+              "data-slot": "tree-item-suffix",
+              className: styles.TreeItem.suffix(),
+              children: suffix
+            }
+          )
+        ] }) }),
+        typeof children === "function" ? /* @__PURE__ */ jsx($42ceafc619f9c3ba$export$fb8073518f34e6ec, { items, children }) : children
       ]
     }
   );
 }
 export {
   Tree,
-  TreeItem,
-  TreeItemContent
+  TreeItem
 };

package/dist/components/internal/Accept.d.ts

@@ -0,0 +1,5 @@
+/**
+ * Tests a file against accepted mime types (`image/png`, `image/*`) or file
+ * extensions (`.pdf`), every file is accepted if left out
+ */
+export declare function acceptsFile(accept: Array<string> | undefined, file: File): boolean;

package/dist/components/internal/Accept.js

@@ -0,0 +1,17 @@
+import "../../chunks/chunk-CQ52GEHY.js";
+
+// src/components/internal/Accept.ts
+function acceptsFile(accept, file) {
+  if (!accept || accept.length === 0) return true;
+  const name = file.name.toLowerCase();
+  const mime = file.type.toLowerCase();
+  return accept.some((pattern) => {
+    const type = pattern.trim().toLowerCase();
+    if (type.startsWith(".")) return name.endsWith(type);
+    if (type.endsWith("/*")) return mime.startsWith(type.slice(0, -1));
+    return mime === type;
+  });
+}
+export {
+  acceptsFile
+};

package/dist/components/internal/DateControl.d.ts

@@ -0,0 +1,18 @@
+import type { ReactNode } from 'react';
+export interface DateControlProps {
+    /** Prefix of the data-slot of each part, eg. `date-picker` */
+    dataSlot: string;
+    /** Shown in a popover when the trigger is pressed */
+    calendar: ReactNode;
+    children: ReactNode;
+}
+/** The framed inputs and calendar popover of the date pickers */
+export declare function DateControl({ dataSlot, calendar, children }: DateControlProps): import("react").JSX.Element;
+export interface DateControlInputProps {
+    /** Prefix of the data-slot of each part, eg. `date-picker` */
+    dataSlot: string;
+    slot?: 'start' | 'end';
+    /** Draw the input frame, for an input that is not inside a DateControl */
+    framed?: boolean;
+}
+export declare function DateControlInput({ dataSlot, slot, framed }: DateControlInputProps): import("react").JSX.Element;

package/dist/components/internal/DateControl.js

@@ -0,0 +1,92 @@
+import {
+  $3a442827418ebe87$export$eb2fcfdbd7ba97d4,
+  $5400c097f4765e59$export$336ab7fa954c4b5f,
+  $5400c097f4765e59$export$7edc06cf1783b30f,
+  $7705c033048f6da7$export$353f5b6fc5456de1,
+  $f2ff30fde7b014be$export$3ddf2d174ce01153
+} from "../../chunks/chunk-7DDPSWRY.js";
+import "../../chunks/chunk-NUFRM6SI.js";
+import "../../chunks/chunk-PMGIIYDD.js";
+import "../../chunks/chunk-RKDPDEF7.js";
+import "../../chunks/chunk-PSSMQKAH.js";
+import {
+  dist_default
+} from "../../chunks/chunk-I4OYYAX5.js";
+import "../../chunks/chunk-CQ52GEHY.js";
+
+// src/components/internal/DateControl.tsx
+import { IcRoundDateRange } from "alinea/dashboard/icons";
+import { Icon } from "../Icon.js";
+
+// src/components/internal/DateControl.module.css
+var DateControl_default = {
+  "DateControl": "alinea-DateControl",
+  "is-placeholder": "alinea-is-placeholder",
+  "isPlaceholder": "alinea-is-placeholder",
+  "DateControl-dialog": "alinea-DateControl-dialog",
+  "DateControlDialog": "alinea-DateControl-dialog",
+  "DateControl-input": "alinea-DateControl-input",
+  "DateControlInput": "alinea-DateControl-input",
+  "DateControl-icon": "alinea-DateControl-icon",
+  "DateControlIcon": "alinea-DateControl-icon",
+  "DateControl-segment": "alinea-DateControl-segment",
+  "DateControlSegment": "alinea-DateControl-segment",
+  "is-framed": "alinea-is-framed",
+  "isFramed": "alinea-is-framed",
+  "DateControl-trigger": "alinea-DateControl-trigger",
+  "DateControlTrigger": "alinea-DateControl-trigger"
+};
+
+// src/components/internal/DateControl.tsx
+import { PopoverSurface } from "./PopoverSurface.js";
+import { Fragment, jsx, jsxs } from "react/jsx-runtime";
+var styles = dist_default(DateControl_default);
+function DateControl({ dataSlot, calendar, children }) {
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs($3a442827418ebe87$export$eb2fcfdbd7ba97d4, { "data-slot": `${dataSlot}-control`, className: styles.DateControl(), children: [
+      children,
+      /* @__PURE__ */ jsx(
+        $7705c033048f6da7$export$353f5b6fc5456de1,
+        {
+          "data-slot": `${dataSlot}-trigger`,
+          className: styles.DateControl.trigger(),
+          children: /* @__PURE__ */ jsx(Icon, { icon: IcRoundDateRange, className: styles.DateControl.icon() })
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(PopoverSurface, { "data-slot": `${dataSlot}-content`, children: /* @__PURE__ */ jsx(
+      $f2ff30fde7b014be$export$3ddf2d174ce01153,
+      {
+        "data-slot": `${dataSlot}-dialog`,
+        className: styles.DateControl.dialog(),
+        children: calendar
+      }
+    ) })
+  ] });
+}
+function DateControlInput({
+  dataSlot,
+  slot,
+  framed
+}) {
+  return /* @__PURE__ */ jsx(
+    $5400c097f4765e59$export$7edc06cf1783b30f,
+    {
+      slot,
+      "data-slot": `${dataSlot}-input`,
+      className: styles.DateControl.input({ framed }),
+      children: (segment) => /* @__PURE__ */ jsx(
+        $5400c097f4765e59$export$336ab7fa954c4b5f,
+        {
+          "data-slot": `${dataSlot}-segment`,
+          className: (state) => styles.DateControl.segment({ placeholder: state.isPlaceholder }),
+          segment
+        }
+      )
+    }
+  );
+}
+export {
+  DateControl,
+  DateControlInput
+};

package/dist/components/internal/DateValue.d.ts

@@ -0,0 +1,16 @@
+import { type CalendarDate, type Time } from '@internationalized/date';
+import type { DateRange } from '../types.js';
+export declare function toCalendarDate(value: string | null | undefined): CalendarDate | null | undefined;
+export declare function toCalendarRange(value: DateRange | null | undefined): {
+    start: CalendarDate;
+    end: CalendarDate;
+} | null | undefined;
+export declare function toTime(value: string | null | undefined): Time | null | undefined;
+interface TimeParts {
+    hour: number;
+    minute: number;
+    second: number;
+}
+/** Formats a time as `HH:mm`, or `HH:mm:ss` when seconds are shown */
+export declare function formatTime(time: TimeParts, granularity: 'minute' | 'second'): string;
+export {};

package/dist/components/internal/DateValue.js

@@ -0,0 +1,40 @@
+import {
+  $58246871e4652552$export$6b862160d295c8e,
+  $58246871e4652552$export$c9698ec7f05a07e1
+} from "../../chunks/chunk-PSSMQKAH.js";
+import "../../chunks/chunk-CQ52GEHY.js";
+
+// src/components/internal/DateValue.ts
+function parseOrClear(value, parse) {
+  if (value === void 0) return void 0;
+  if (!value) return null;
+  try {
+    return parse(value);
+  } catch {
+    return null;
+  }
+}
+function toCalendarDate(value) {
+  return parseOrClear(value, $58246871e4652552$export$6b862160d295c8e);
+}
+function toCalendarRange(value) {
+  if (value === void 0) return void 0;
+  const start = value && toCalendarDate(value.start);
+  const end = value && toCalendarDate(value.end);
+  if (!start || !end) return null;
+  return { start, end };
+}
+function toTime(value) {
+  return parseOrClear(value, $58246871e4652552$export$c9698ec7f05a07e1);
+}
+function formatTime(time, granularity) {
+  const pad = (n) => String(n).padStart(2, "0");
+  const hhmm = `${pad(time.hour)}:${pad(time.minute)}`;
+  return granularity === "second" ? `${hhmm}:${pad(time.second)}` : hhmm;
+}
+export {
+  formatTime,
+  toCalendarDate,
+  toCalendarRange,
+  toTime
+};

package/dist/components/internal/FormScope.d.ts

@@ -0,0 +1,2 @@
+/** Set inside a Form, where fields show the validation errors of react-aria */
+export declare const FormScope: import("react").Context<boolean>;

package/dist/components/internal/FormScope.js

@@ -0,0 +1,8 @@
+import "../../chunks/chunk-CQ52GEHY.js";
+
+// src/components/internal/FormScope.ts
+import { createContext } from "react";
+var FormScope = createContext(false);
+export {
+  FormScope
+};

package/dist/components/internal/ListBoxGroup.d.ts

@@ -0,0 +1,12 @@
+import type { ReactNode } from 'react';
+import type { AriaProps } from '../types.js';
+export interface ListBoxGroupProps extends AriaProps {
+    /** data-slot of the group, eg. "select-group" */
+    slot: string;
+    /** data-slot of its label */
+    labelSlot: string;
+    label?: ReactNode;
+    children: ReactNode;
+}
+/** A labelled group of options in the listbox of a Select or ComboBox */
+export declare function ListBoxGroup({ slot, labelSlot, label, children, ...props }: ListBoxGroupProps): import("react").JSX.Element;

package/dist/components/internal/ListBoxGroup.js

@@ -0,0 +1,46 @@
+import {
+  $53e61d82d8b8611d$export$8b251419efc915eb,
+  $928221da08ecbc62$export$dca12b0bb56e4fc
+} from "../../chunks/chunk-7DDPSWRY.js";
+import "../../chunks/chunk-NUFRM6SI.js";
+import "../../chunks/chunk-PMGIIYDD.js";
+import "../../chunks/chunk-RKDPDEF7.js";
+import "../../chunks/chunk-PSSMQKAH.js";
+import {
+  dist_default
+} from "../../chunks/chunk-I4OYYAX5.js";
+import "../../chunks/chunk-CQ52GEHY.js";
+
+// src/components/internal/ListBoxGroup.module.css
+var ListBoxGroup_default = {
+  "ListBoxGroup": "alinea-ListBoxGroup",
+  "ListBoxGroup-label": "alinea-ListBoxGroup-label",
+  "ListBoxGroupLabel": "alinea-ListBoxGroup-label"
+};
+
+// src/components/internal/ListBoxGroup.tsx
+import { jsx, jsxs } from "react/jsx-runtime";
+var styles = dist_default(ListBoxGroup_default);
+function ListBoxGroup({
+  slot,
+  labelSlot,
+  label,
+  children,
+  ...props
+}) {
+  return /* @__PURE__ */ jsxs(
+    $928221da08ecbc62$export$dca12b0bb56e4fc,
+    {
+      "data-slot": slot,
+      ...props,
+      className: styles.ListBoxGroup(),
+      children: [
+        label && /* @__PURE__ */ jsx($53e61d82d8b8611d$export$8b251419efc915eb, { "data-slot": labelSlot, className: styles.ListBoxGroup.label(), children: label }),
+        children
+      ]
+    }
+  );
+}
+export {
+  ListBoxGroup
+};

package/dist/components/internal/ListBoxOption.d.ts

@@ -0,0 +1,20 @@
+import type { CSSProperties, ReactElement, ReactNode } from 'react';
+import type { IconType, Key } from '../types.js';
+export interface ListBoxOptionProps {
+    /** Prefix for the data-slot attributes, eg. "select-item" */
+    slot: string;
+    value: Key;
+    textValue?: string;
+    disabled?: boolean;
+    icon?: IconType | ReactElement;
+    description?: ReactNode;
+    className?: string;
+    style?: CSSProperties;
+    children: ReactNode;
+}
+/**
+ * An option in the listbox of a Select, ComboBox or MultipleSelect. Renders
+ * an optional icon, the label, an optional description and a check mark
+ * when selected.
+ */
+export declare function ListBoxOption({ slot, value, textValue, disabled, icon, description, className, style, children }: ListBoxOptionProps): import("react").JSX.Element;