@crewlethq/ui 0.37.1 → 0.39.0

package/dist/chunk-4RKTZSEW.js

@@ -0,0 +1,64 @@
+import { StatusDot } from './chunk-WIATRXEJ.js';
+import { cx } from './chunk-ODEQTPFM.js';
+import './SettingsTable-6DUFAFXG.css';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var COLUMNS = { setting: "Setting", value: "Value", source: "Source" };
+function SettingsTable({ header = false, columns, className, children, ...rest }) {
+  const names = { ...COLUMNS, ...columns };
+  return /* @__PURE__ */ jsxs("div", { ...rest, role: "table", className: cx("crewlet-settings-table", className), children: [
+    /* @__PURE__ */ jsx(
+      "div",
+      {
+        role: "rowgroup",
+        className: cx("crewlet-settings-table__head", !header && "crewlet-settings-table__head--hidden"),
+        children: /* @__PURE__ */ jsxs("div", { role: "row", className: "crewlet-settings-table__row", children: [
+          /* @__PURE__ */ jsx("span", { role: "columnheader", className: "crewlet-settings-table__name", children: names.setting }),
+          /* @__PURE__ */ jsx("span", { role: "columnheader", className: "crewlet-settings-table__name", children: names.value }),
+          /* @__PURE__ */ jsx("span", { role: "columnheader", className: "crewlet-settings-table__name", children: names.source })
+        ] })
+      }
+    ),
+    /* @__PURE__ */ jsx("div", { role: "rowgroup", className: "crewlet-settings-table__body", children })
+  ] });
+}
+function SettingsTableRow({
+  label,
+  settingKey,
+  source,
+  changed = false,
+  className,
+  children,
+  ...rest
+}) {
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...rest,
+      role: "row",
+      "data-changed": changed ? "" : void 0,
+      className: cx("crewlet-settings-table__row", className),
+      children: [
+        /* @__PURE__ */ jsxs("span", { role: "rowheader", className: "crewlet-settings-table__setting", children: [
+          /* @__PURE__ */ jsx("span", { className: "crewlet-settings-table__label", children: label }),
+          settingKey === void 0 ? null : /* @__PURE__ */ jsx("code", { className: "crewlet-settings-table__key", children: settingKey })
+        ] }),
+        /* @__PURE__ */ jsx("span", { role: "cell", className: "crewlet-settings-table__value", children }),
+        /* @__PURE__ */ jsxs(
+          "span",
+          {
+            role: "cell",
+            className: cx("crewlet-settings-table__source", changed && "crewlet-settings-table__source--changed"),
+            children: [
+              changed ? /* @__PURE__ */ jsx(StatusDot, { tone: "brand" }) : null,
+              source
+            ]
+          }
+        )
+      ]
+    }
+  );
+}
+SettingsTable.Row = SettingsTableRow;
+
+export { SettingsTable, SettingsTableRow };

package/dist/{chunk-3SBM4DGI.js → chunk-BH52LIY6.js}

@@ -1,4 +1,4 @@
-import { Tag } from './chunk-GFV4LJHH.js';
+import { Tag } from './chunk-KYIAFNU7.js';
 import { useListbox } from './chunk-7KHM2FZH.js';
 import { announce } from './chunk-RSAQOKH3.js';
 import { isComposing } from './chunk-H5XTJ7GJ.js';

package/dist/{chunk-HDHZWIFL.js → chunk-DYB66CNM.js}

@@ -6,7 +6,7 @@ import { IconButton } from './chunk-4FQT6ZAY.js';
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './HitArea-QUOS6ZDJ.css';
-import './AppShell-JBCZSSX3.css';
+import './AppShell-NDU4XMGF.css';
 import { createContext, forwardRef, useContext, useId, useState, useRef, useCallback, useEffect, useLayoutEffect } from 'react';
 import { breakpoint } from '@crewlethq/tokens';
 import { ChevronUpGlyph, ChevronsUpDownGlyph, ChevronRightGlyph, MenuGlyph } from '@crewlethq/icons/glyphs';
@@ -122,6 +122,16 @@ function AppShell({
     },
     [mainRef]
   );
+  const [gutter, setGutter] = useState(0);
+  useLayoutEffect(() => {
+    if (!scroller) return void 0;
+    const measure = () => setGutter(Math.max(0, scroller.offsetWidth - scroller.clientWidth));
+    measure();
+    if (typeof ResizeObserver === "undefined") return void 0;
+    const observer = new ResizeObserver(measure);
+    observer.observe(scroller);
+    return () => observer.disconnect();
+  }, [scroller]);
   const shell = {
     narrow,
     drawerOpen,
@@ -145,7 +155,11 @@ function AppShell({
         !shell.hasRail && "crewlet-app-shell--no-rail",
         className
       ),
-      style: drawerZ === null ? style : { ...style, ["--crewlet-app-shell-drawer-z"]: String(drawerZ) },
+      style: {
+        ...style,
+        ["--crewlet-app-shell-gutter"]: `${gutter}px`,
+        ...drawerZ === null ? null : { ["--crewlet-app-shell-drawer-z"]: String(drawerZ) }
+      },
       children: [
         /* @__PURE__ */ jsx(
           "a",

package/dist/{chunk-A23KDROH.js → chunk-FXBGEANQ.js}

@@ -1,5 +1,5 @@
 import { useClipboard } from './chunk-STJ7QBC3.js';
-import { Modal } from './chunk-SVGARBDY.js';
+import { Modal } from './chunk-IAGYPTEJ.js';
 import { Checkbox } from './chunk-AXS6MBNH.js';
 import { EmptyValue } from './chunk-EUCC37WY.js';
 import { useCardHeaderSlot } from './chunk-AV2DXAEL.js';

package/dist/{chunk-HMLAWVG6.js → chunk-HQJ24WPM.js}

@@ -1,4 +1,4 @@
-import { Tag } from './chunk-GFV4LJHH.js';
+import { Tag } from './chunk-KYIAFNU7.js';
 import { RelativeTime } from './chunk-3CZ7XAVY.js';
 import { HIT_AREA_CLASS } from './chunk-2YTOOH3A.js';
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
@@ -58,8 +58,10 @@ function DatasetSource({
   const summary = /* @__PURE__ */ jsxs(Fragment, { children: [
     /* @__PURE__ */ jsxs("span", { className: "crewlet-dataset-source__head", children: [
       /* @__PURE__ */ jsx("span", { id: titleId, className: "crewlet-dataset-source__title", children: title }),
-      " ",
-      /* @__PURE__ */ jsx(Tag, { size: "xs", appearance: "outline", className: "crewlet-dataset-source__kind", children: text.kinds[kind] })
+      kind === void 0 ? null : /* @__PURE__ */ jsxs(Fragment, { children: [
+        " ",
+        /* @__PURE__ */ jsx(Tag, { size: "xs", appearance: "outline", className: "crewlet-dataset-source__kind", children: text.kinds[kind] })
+      ] })
     ] }),
     " ",
     /* @__PURE__ */ jsx("span", { className: "crewlet-dataset-source__definition", children: definition }),

package/dist/{chunk-SVGARBDY.js → chunk-IAGYPTEJ.js}

@@ -4,7 +4,7 @@ import { focusables, useModalLayer, useBodyScrollLock } from './chunk-H5XTJ7GJ.j
 import { Button } from './chunk-OG6CL3EB.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './Modal-7MWRCWAI.css';
+import './Modal-TOEWHDCQ.css';
 import { useId, useRef, useCallback } from 'react';
 import { createPortal } from 'react-dom';
 import { ChevronLeftGlyph, XGlyph } from '@crewlethq/icons/glyphs';
@@ -124,7 +124,7 @@ function ModalFrame({
           given(icon) ? /* @__PURE__ */ jsx("span", { className: "crewlet-modal__icon", "aria-hidden": "true", children: icon }) : null,
           /* @__PURE__ */ jsxs("div", { className: "crewlet-modal__heading", children: [
             given(title) ? /* @__PURE__ */ jsx(
-              "p",
+              "h1",
               {
                 className: cx("crewlet-modal__title", sheet ? "crewlet-modal__title--sheet" : void 0),
                 id: titleId,

package/dist/{chunk-5QXRI35B.js → chunk-INHXF2CL.js}

@@ -2,7 +2,7 @@ import { CardHeaderSlotContext } from './chunk-AV2DXAEL.js';
 import { Count } from './chunk-BHHIIK3M.js';
 import { useHeadingLevel, HeadingLevelProvider, nextHeadingLevel, headingTag } from './chunk-PQADV6P6.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './Card-QOVASQNU.css';
+import './Card-JR2UPQH7.css';
 import { createContext, useId, useState, isValidElement, useRef, useCallback, useMemo, Children, cloneElement, useContext, useEffect, Fragment } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';
 
@@ -160,6 +160,7 @@ var CardHeader = ({
   icon,
   count,
   subtitle,
+  subtitlePlacement = "beside",
   actions,
   className,
   children,
@@ -173,16 +174,28 @@ var CardHeader = ({
     },
     [host]
   );
-  return /* @__PURE__ */ jsxs("div", { ...rest, className: cx("crewlet-card__header", !divided && "crewlet-card__header--plain", className), children: [
-    /* @__PURE__ */ jsxs("div", { className: "crewlet-card__header-main", children: [
-      icon === void 0 ? null : /* @__PURE__ */ jsx("span", { className: "crewlet-card__header-icon", "aria-hidden": true, children: icon }),
-      children,
-      count === void 0 ? null : /* @__PURE__ */ jsx(Count, { value: count })
-    ] }),
-    subtitle === void 0 ? null : /* @__PURE__ */ jsx("span", { className: "crewlet-card__subtitle", children: subtitle }),
-    actions === void 0 ? null : /* @__PURE__ */ jsx("div", { className: "crewlet-card__header-actions", children: actions }),
-    card === null ? null : /* @__PURE__ */ jsx("div", { className: "crewlet-card__header-chrome", ref: chromeRef })
-  ] });
+  return /* @__PURE__ */ jsxs(
+    "div",
+    {
+      ...rest,
+      className: cx(
+        "crewlet-card__header",
+        !divided && "crewlet-card__header--plain",
+        subtitle !== void 0 && subtitlePlacement === "below" && "crewlet-card__header--stacked",
+        className
+      ),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "crewlet-card__header-main", children: [
+          icon === void 0 ? null : /* @__PURE__ */ jsx("span", { className: "crewlet-card__header-icon", "aria-hidden": true, children: icon }),
+          typeof children === "string" || typeof children === "number" ? /* @__PURE__ */ jsx(CardTitle, { children }) : children,
+          count === void 0 || count === 0 || count === "0" ? null : /* @__PURE__ */ jsx(Count, { value: count })
+        ] }),
+        subtitle === void 0 ? null : /* @__PURE__ */ jsx("span", { className: "crewlet-card__subtitle", children: subtitle }),
+        actions === void 0 ? null : /* @__PURE__ */ jsx("div", { className: "crewlet-card__header-actions", children: actions }),
+        card === null ? null : /* @__PURE__ */ jsx("div", { className: "crewlet-card__header-chrome", ref: chromeRef })
+      ]
+    }
+  );
 };
 var CardBody = ({ padding = "md", className, children, ...rest }) => /* @__PURE__ */ jsx("div", { ...rest, className: cx("crewlet-card__body", `crewlet-card__body--p-${padding}`, className), children });
 var CardFooter = ({ variant = "actions", padding = "sm", className, children, ...rest }) => /* @__PURE__ */ jsx(

package/dist/{chunk-6NNY5WBF.js → chunk-JKAGN4V4.js}

@@ -1,4 +1,4 @@
-import { Modal } from './chunk-SVGARBDY.js';
+import { Modal } from './chunk-IAGYPTEJ.js';
 import { useListbox, useOptionKeys } from './chunk-7KHM2FZH.js';
 import { Popover } from './chunk-KHJIEPZV.js';
 import { KeyChip, highlightMatch } from './chunk-FYTIJM2T.js';

package/dist/{chunk-DZSBFITC.js → chunk-JZPK4IXR.js}

@@ -1,7 +1,7 @@
 import { TagGroup } from './chunk-O2EGEONV.js';
 import { CursorFlag } from './chunk-3BYIWOTV.js';
 import { presenceHueClass } from './chunk-I6POAB4V.js';
-import { Tag } from './chunk-GFV4LJHH.js';
+import { Tag } from './chunk-KYIAFNU7.js';
 import { StatusDot } from './chunk-WIATRXEJ.js';
 import { ChangeMark } from './chunk-66X5WDKE.js';
 import { isEmptyValue, displayText, ratingMax, findPerson, findOption, statusTone, editText, textMax, sheetLabels, normalizeValue, sameValue, spokenText, drawnColumns, fitSamples, fittedWidth, columnWidth, SHEET_COLUMN_BOUNDS, sortRows, SHEET_ROW_HEIGHT, cellKey, columnOffsets, SHEET_ROW_NUMBER_WIDTH, rangeOf, presenceByCell, presenceByRow, presenceByColumn, scrollToRow, planClear, visibleRows, cellDescription, nextSort, rowName, inRange, hasPrevious, flagText, toTSV, planPaste, parseTSV, isMod, moveFrom, isTypingKey, editorSide, optionHue, parseText, liveOptions, checkValue } from './chunk-LFSIKGRQ.js';

package/dist/{chunk-UWRBD2YO.js → chunk-KNHUBHFX.js}

@@ -1,6 +1,6 @@
 import { Select } from './chunk-XQZ6EWOE.js';
 import { CopyButton } from './chunk-W46LPU4R.js';
-import { Modal } from './chunk-SVGARBDY.js';
+import { Modal } from './chunk-IAGYPTEJ.js';
 import { Callout } from './chunk-SZZRIHGT.js';
 import { PrincipalAvatar } from './chunk-CI3VPIJN.js';
 import { useHeadingLevel, headingTag } from './chunk-PQADV6P6.js';

package/dist/{chunk-GFV4LJHH.js → chunk-KYIAFNU7.js}

@@ -1,6 +1,6 @@
 import { StatusDot } from './chunk-WIATRXEJ.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './Tag-SRGTK5KI.css';
+import './Tag-2DQOVE6W.css';
 import { XGlyph } from '@crewlethq/icons/glyphs';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 

package/dist/{chunk-F2XSYBKH.js → chunk-MFS6F2P7.js}

@@ -1,12 +1,14 @@
 import { cx } from './chunk-ODEQTPFM.js';
-import './DescriptionList-IXMRCSMK.css';
+import './DescriptionList-DEZISDLQ.css';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 function DescriptionList({
   dense = false,
   fit = false,
+  termWidth,
   items,
   className,
+  style,
   children,
   ...rest
 }) {
@@ -14,6 +16,7 @@ function DescriptionList({
     "dl",
     {
       ...rest,
+      style: termWidth === void 0 ? style : { ...style, "--crewlet-description-list-term": termWidth },
       className: cx(
         "crewlet-description-list",
         dense && "crewlet-description-list--dense",

package/dist/{chunk-NRBAXRWE.js → chunk-N3TFYBN3.js}

@@ -1,4 +1,4 @@
-import { ConfirmModal } from './chunk-SVGARBDY.js';
+import { ConfirmModal } from './chunk-IAGYPTEJ.js';
 import { InlineCode } from './chunk-5CLW2CXT.js';
 import { Callout } from './chunk-SZZRIHGT.js';
 import './LinkInterstitial-ET4MSVSV.css';

package/dist/chunk-NNTO3TNC.js

@@ -0,0 +1,9 @@
+import { cx } from './chunk-ODEQTPFM.js';
+import './TileGrid-I6LNYD2H.css';
+import { jsx } from 'react/jsx-runtime';
+
+function TileGrid({ columns = 3, as: Track = "div", className, children, ...rest }) {
+  return /* @__PURE__ */ jsx("div", { className: cx("crewlet-tile-grid", className), "data-columns": columns, children: /* @__PURE__ */ jsx(Track, { ...rest, className: "crewlet-tile-grid__track", children }) });
+}
+
+export { TileGrid };

package/dist/{chunk-DS2C73RJ.js → chunk-NZWX27J7.js}

@@ -1,13 +1,13 @@
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './List-MYJIV6MP.css';
+import './List-YHLIZFK4.css';
 import { createContext, useContext, Children, isValidElement, cloneElement } from 'react';
 import { CircleAlertGlyph } from '@crewlethq/icons/glyphs';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
 var ListContext = createContext({ variant: "divided", templated: false });
 function List({ variant = "divided", template, className, style, children, ...rest }) {
-  const Tag = variant === "numbered" ? "ol" : "ul";
+  const Tag = variant === "numbered" || variant === "numbered-divided" ? "ol" : "ul";
   const templated = template !== void 0;
   return /* @__PURE__ */ jsx(ListContext.Provider, { value: { variant, templated }, children: /* @__PURE__ */ jsx(
     Tag,

package/dist/{chunk-VGE3G3T4.js → chunk-ODOJJGXH.js}

@@ -1,6 +1,6 @@
 import { Link } from './chunk-FBSEJO2C.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './ObjectHeader-D7GU7QNI.css';
+import './ObjectHeader-ZOS22FKX.css';
 import { ArrowUpRightGlyph } from '@crewlethq/icons/glyphs';
 import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-MICH6QSJ.js → chunk-OGXHZHRX.js}

@@ -1,7 +1,7 @@
 import { DisclosureAnatomy } from './chunk-FZVJDJFN.js';
 import { useHeadingLevel } from './chunk-PQADV6P6.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './Disclosure-VKBJJIZ7.css';
+import './Disclosure-P4FH3C35.css';
 import { useState, useId, useCallback } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-JXRI5YD2.js → chunk-OUD75UB2.js}

@@ -1,5 +1,5 @@
 import { cx } from './chunk-ODEQTPFM.js';
-import './StatGroup-PADTJCUQ.css';
+import './StatGroup-ZMW7VQWP.css';
 import { jsx } from 'react/jsx-runtime';
 
 function StatGroup({ columns = 4, flush = false, className, children, ...rest }) {
@@ -8,6 +8,7 @@ function StatGroup({ columns = 4, flush = false, className, children, ...rest })
     {
       ...rest,
       className: cx("crewlet-stat-group", flush && "crewlet-stat-group--flush", className),
+      "data-columns": columns,
       style: { "--crewlet-stat-group-cols": columns, ...rest.style },
       children
     }

package/dist/{chunk-MG3HTY6F.js → chunk-QRKT4XTT.js}

@@ -1,6 +1,6 @@
 import { PageHeader } from './chunk-HOXGBLEY.js';
-import { DataTable } from './chunk-A23KDROH.js';
 import { DateTimePicker } from './chunk-UB6MLXUL.js';
+import { DataTable } from './chunk-FXBGEANQ.js';
 import { useListbox, useOptionKeys } from './chunk-7KHM2FZH.js';
 import { Popover } from './chunk-KHJIEPZV.js';
 import { Toolbar } from './chunk-NR4CPM4T.js';

package/dist/{chunk-NS4NSHVX.js → chunk-R2IBCEU6.js}

@@ -4,7 +4,7 @@ import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './HitArea-QUOS6ZDJ.css';
 import './ArtifactKinds-CVD3FCYO.css';
-import './ArtifactMakeRow-W3RD5YWZ.css';
+import './ArtifactMakeRow-6UX2LTF7.css';
 import { useId } from 'react';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 
@@ -14,7 +14,17 @@ function ArtifactMakeRow({
   "aria-labelledby": ariaLabelledBy,
   className
 }) {
-  return /* @__PURE__ */ jsx("div", { className: cx("crewlet-make-row", className), children: /* @__PURE__ */ jsx("ul", { className: "crewlet-make-row__list", "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, children: items.map((item) => /* @__PURE__ */ jsx("li", { className: "crewlet-make-row__cell", children: /* @__PURE__ */ jsx(MakeItem, { item }) }, item.kind)) }) });
+  return /* @__PURE__ */ jsx("div", { className: cx("crewlet-make-row", className), children: /* @__PURE__ */ jsx(
+    "ul",
+    {
+      className: "crewlet-make-row__list",
+      "aria-label": ariaLabel,
+      "aria-labelledby": ariaLabelledBy,
+      "data-count": items.length,
+      style: { "--crewlet-make-row-count": items.length },
+      children: items.map((item) => /* @__PURE__ */ jsx("li", { className: "crewlet-make-row__cell", children: /* @__PURE__ */ jsx(MakeItem, { item }) }, item.kind))
+    }
+  ) });
 }
 function MakeItem({ item }) {
   const { kind, label, detail, href, disabledReason } = item;

package/dist/{chunk-WX2NIG4G.js → chunk-S4DREXGM.js}

@@ -1,5 +1,5 @@
 import { BrandLockup } from './chunk-7KBNFFM3.js';
-import { Card } from './chunk-5QXRI35B.js';
+import { Card } from './chunk-INHXF2CL.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './AuthLayout-ODHBUPHQ.css';
 import { useId } from 'react';

package/dist/{chunk-GDDE4UM7.js → chunk-SEC2GR2V.js}

@@ -1,6 +1,6 @@
 import { CopyButton } from './chunk-W46LPU4R.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './CodeBlock-GYNJ2HI6.css';
+import './CodeBlock-N5ETJF24.css';
 import { forwardRef, useRef, useState, useLayoutEffect } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-S27UBCVX.js → chunk-TZYFTC4M.js}

@@ -8,7 +8,7 @@ import { IconButton } from './chunk-4FQT6ZAY.js';
 import { returnFocus } from './chunk-NUZHC6MM.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './ArtifactKinds-CVD3FCYO.css';
-import './ArtifactBar-FWPBBKQ5.css';
+import './ArtifactBar-6PGWGKN2.css';
 import { useId, useState, useRef, useEffect } from 'react';
 import { ChevronLeftGlyph, EllipsisGlyph, ChevronDownGlyph } from '@crewlethq/icons/glyphs';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';

package/dist/{chunk-OHA6WSAG.js → chunk-U2XAJONO.js}

@@ -2,7 +2,7 @@ import { Skeleton } from './chunk-TEUQWOWZ.js';
 import { PrincipalAvatar } from './chunk-CI3VPIJN.js';
 import { RelativeTime } from './chunk-3CZ7XAVY.js';
 import { ArtifactKindGround } from './chunk-UBZDYOCA.js';
-import { Card } from './chunk-5QXRI35B.js';
+import { Card } from './chunk-INHXF2CL.js';
 import { AvatarStack } from './chunk-5AQBPHZD.js';
 import { ArtifactAccessGlyph } from './chunk-BGLKLXL3.js';
 import { ArtifactKindGlyph } from './chunk-CE2THTQR.js';

package/dist/{chunk-DQSXWQMJ.js → chunk-U3ILLCR2.js}

@@ -1,4 +1,4 @@
-import { Tag } from './chunk-GFV4LJHH.js';
+import { Tag } from './chunk-KYIAFNU7.js';
 import './PricingCard-HTAHG4ST.css';
 import { forwardRef } from 'react';
 import { jsx } from 'react/jsx-runtime';

package/dist/{chunk-DOLATMGF.js → chunk-WYYCPV46.js}

@@ -24,6 +24,7 @@ function ListInput({
   disabled = false,
   optional,
   enterHint = true,
+  focusOnMount = false,
   addLabel = (name) => `Add ${name}`,
   itemLabel = (name, position) => `${name} ${position}`,
   newItemLabel = (name) => `New ${name}`,
@@ -45,6 +46,10 @@ function ListInput({
   const downs = useRef(/* @__PURE__ */ new Map());
   const addBox = useRef(null);
   const focusNext = useRef(null);
+  const focusAtMount = useRef(focusOnMount);
+  useLayoutEffect(() => {
+    if (focusAtMount.current) addBox.current?.focus();
+  }, []);
   useLayoutEffect(() => {
     const want = focusNext.current;
     if (!want) return;

package/dist/{chunk-A72JPXIV.js → chunk-XGBUUQDU.js}

@@ -1,4 +1,4 @@
-import { Modal } from './chunk-SVGARBDY.js';
+import { Modal } from './chunk-IAGYPTEJ.js';
 import { useListbox, useHighlightRest } from './chunk-7KHM2FZH.js';
 import { Input } from './chunk-TYONQSOK.js';
 import { Kbd } from './chunk-SMBKXWML.js';

package/dist/chunk-XNXK5MA4.js

@@ -0,0 +1,48 @@
+import { useHeadingLevel, headingTag } from './chunk-PQADV6P6.js';
+import { cx } from './chunk-ODEQTPFM.js';
+import './CatalogTile-TGR2ZZVQ.css';
+import { useId } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+function CatalogTile({
+  as: Element = "article",
+  mark,
+  title,
+  headingLevel,
+  status,
+  description,
+  meta,
+  action,
+  quiet = false,
+  className,
+  ...rest
+}) {
+  const level = useHeadingLevel();
+  const Heading = headingTag(headingLevel ?? level);
+  const titleId = useId();
+  const foot = meta !== void 0 || action !== void 0;
+  return /* @__PURE__ */ jsxs(
+    Element,
+    {
+      "aria-labelledby": Element === "article" ? titleId : void 0,
+      ...rest,
+      className: cx("crewlet-catalog-tile", quiet && "crewlet-catalog-tile--quiet", className),
+      children: [
+        /* @__PURE__ */ jsxs("div", { className: "crewlet-catalog-tile__head", children: [
+          /* @__PURE__ */ jsx("span", { className: "crewlet-catalog-tile__mark", "aria-hidden": "true", children: mark }),
+          /* @__PURE__ */ jsxs("span", { className: "crewlet-catalog-tile__title", children: [
+            /* @__PURE__ */ jsx(Heading, { id: titleId, className: "crewlet-catalog-tile__name", children: title }),
+            status === void 0 || status === null ? null : /* @__PURE__ */ jsx("span", { className: "crewlet-catalog-tile__status", children: status })
+          ] })
+        ] }),
+        description === void 0 ? null : /* @__PURE__ */ jsx("p", { className: "crewlet-catalog-tile__description", children: description }),
+        foot ? /* @__PURE__ */ jsxs("div", { className: "crewlet-catalog-tile__foot", children: [
+          /* @__PURE__ */ jsx("span", { className: "crewlet-catalog-tile__meta", children: meta }),
+          action === void 0 ? null : /* @__PURE__ */ jsx("span", { className: "crewlet-catalog-tile__action", children: action })
+        ] }) : null
+      ]
+    }
+  );
+}
+
+export { CatalogTile };

package/dist/{chunk-XO7PUL4F.js → chunk-YPTTSJPM.js}

@@ -1,6 +1,6 @@
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './StatCard-4T7TMWMN.css';
+import './StatCard-HAA3F5GX.css';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 
 var StatCard = ({

package/dist/{chunk-RIAZM6L3.js → chunk-ZNOXQACX.js}

@@ -1,7 +1,7 @@
 import { DisclosureAnatomy } from './chunk-FZVJDJFN.js';
 import { useHeadingLevel } from './chunk-PQADV6P6.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './Disclosure-VKBJJIZ7.css';
+import './Disclosure-P4FH3C35.css';
 import './Accordion-ZI2WLD5C.css';
 import { createContext, useState, useCallback, useMemo, useContext, useId } from 'react';
 import { jsx, jsxs } from 'react/jsx-runtime';

package/dist/generated/index.d.ts

@@ -32,6 +32,7 @@ export * from '../CanvasBoard/index.js';
 export * from '../CanvasSchematic/index.js';
 export * from '../CanvasToolbar/index.js';
 export * from '../Card/index.js';
+export * from '../CatalogTile/index.js';
 export * from '../ChangeMark/index.js';
 export * from '../CharacterPicker/index.js';
 export * from '../Charts/index.js';
@@ -133,6 +134,7 @@ export * from '../Section/index.js';
 export * from '../SegmentedControl/index.js';
 export * from '../SegmentedMeter/index.js';
 export * from '../Select/index.js';
+export * from '../SettingsTable/index.js';
 export * from '../ShareDialog/index.js';
 export * from '../SheetColumnEditor/index.js';
 export * from '../SheetGrid/index.js';
@@ -163,6 +165,7 @@ export * from '../ThemeGallery/index.js';
 export * from '../ThemeSwatch/index.js';
 export * from '../ThemeSwitcher/index.js';
 export * from '../ThemeToggle/index.js';
+export * from '../TileGrid/index.js';
 export * from '../TimeWindowPicker/index.js';
 export * from '../Timeline/index.js';
 export * from '../Toaster/index.js';