@crewlethq/ui 0.35.0 → 0.36.0

package/dist/chunk-P6WFZDKS.js

@@ -0,0 +1,111 @@
+import { useFocusModality } from './chunk-YSGLEHND.js';
+import { cx } from './chunk-ODEQTPFM.js';
+import './Document-YFWTWXJP.css';
+import { forwardRef, useRef, useCallback, useLayoutEffect, useEffect } from 'react';
+import { jsx } from 'react/jsx-runtime';
+
+function Document({ as: Tag = "div", size = "md", measure = "normal", className, children, ...rest }) {
+  return /* @__PURE__ */ jsx(
+    Tag,
+    {
+      ...rest,
+      className: cx(
+        "crewlet-document",
+        `crewlet-document--${size}`,
+        measure === "normal" && "crewlet-document--measure",
+        className
+      ),
+      children
+    }
+  );
+}
+function DocumentTitle({ as: Tag = "h1", className, children, ...rest }) {
+  return /* @__PURE__ */ jsx(Tag, { ...rest, className: cx("crewlet-document-title", className), children });
+}
+var LINE_BREAKS = /\r\n|[\r\n\u2028\u2029]/g;
+var DocumentTitleField = forwardRef(function DocumentTitleField2({ error = false, className, onChange, onKeyDown, value, defaultValue, ...rest }, forwarded) {
+  useFocusModality();
+  const own = useRef(null);
+  const ref = useCallback(
+    (element) => {
+      own.current = element;
+      if (typeof forwarded === "function") forwarded(element);
+      else if (forwarded) forwarded.current = element;
+    },
+    [forwarded]
+  );
+  const fit = useCallback(() => {
+    const element = own.current;
+    if (!element) return;
+    element.style.height = "auto";
+    const style = getComputedStyle(element);
+    const edges = style.boxSizing === "border-box" ? parseFloat(style.borderTopWidth) + parseFloat(style.borderBottomWidth) : -(parseFloat(style.paddingTop) + parseFloat(style.paddingBottom));
+    element.style.height = `${element.scrollHeight + (Number.isFinite(edges) ? edges : 0)}px`;
+  }, []);
+  useLayoutEffect(fit, [fit, value]);
+  useEffect(() => {
+    const element = own.current;
+    if (!element || typeof ResizeObserver === "undefined") return void 0;
+    let width = element.clientWidth;
+    const observer = new ResizeObserver(() => {
+      if (element.clientWidth === width) return;
+      width = element.clientWidth;
+      fit();
+    });
+    observer.observe(element);
+    return () => observer.disconnect();
+  }, [fit]);
+  useEffect(() => {
+    const element = own.current;
+    if (!element) return void 0;
+    const refuse = (event) => {
+      if (event.inputType === "insertLineBreak" || event.inputType === "insertParagraph") event.preventDefault();
+    };
+    element.addEventListener("beforeinput", refuse);
+    return () => element.removeEventListener("beforeinput", refuse);
+  }, []);
+  const change = (event) => {
+    const element = event.currentTarget;
+    if (LINE_BREAKS.test(element.value)) {
+      LINE_BREAKS.lastIndex = 0;
+      const caret = element.selectionStart;
+      element.value = element.value.replace(LINE_BREAKS, " ");
+      element.setSelectionRange(caret, caret);
+    }
+    LINE_BREAKS.lastIndex = 0;
+    onChange?.(event);
+    if (value === void 0) fit();
+  };
+  const keyDown = (event) => {
+    onKeyDown?.(event);
+    if (event.key !== "Enter" || event.defaultPrevented || event.nativeEvent.isComposing) return;
+    const form = event.currentTarget.form;
+    if (!form) return;
+    const submitter = form.querySelector(
+      'button[type="submit"], button:not([type]), input[type="submit"], input[type="image"]'
+    );
+    if (submitter) {
+      if (!submitter.disabled) form.requestSubmit(submitter);
+      return;
+    }
+    const fields = form.querySelectorAll('input:not([type="hidden"]):not([type="checkbox"]):not([type="radio"]), textarea');
+    if (fields.length === 1) form.requestSubmit();
+  };
+  return /* @__PURE__ */ jsx(
+    "textarea",
+    {
+      ...rest,
+      ref,
+      rows: 1,
+      value,
+      defaultValue,
+      "aria-multiline": "false",
+      "aria-invalid": error || void 0,
+      className: cx("crewlet-document-title", "crewlet-document-title-field", className),
+      onChange: change,
+      onKeyDown: keyDown
+    }
+  );
+});
+
+export { Document, DocumentTitle, DocumentTitleField };

package/dist/{chunk-CPEPST4S.js → chunk-PJIPUEJ3.js}

@@ -1,4 +1,4 @@
-import { FormField } from './chunk-6QFAK2WV.js';
+import { FormField } from './chunk-IUYUS2SO.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './Checkbox-ALWG3WV2.css';
 import { forwardRef, useId, useRef, useCallback, useEffect } from 'react';

package/dist/{chunk-QS4ZGTEU.js → chunk-PPFX6GRK.js}

@@ -1,5 +1,5 @@
 import { useListbox } from './chunk-F73MC7EZ.js';
-import { Input } from './chunk-6QFAK2WV.js';
+import { Input } from './chunk-IUYUS2SO.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './Combobox-4FUVYIE7.css';
 import { forwardRef, useId, useMemo, useRef, useCallback } from 'react';

package/dist/{chunk-7DZDSSJS.js → chunk-RH2NCQBZ.js}

@@ -1,13 +1,14 @@
-import { Textarea } from './chunk-6QFAK2WV.js';
+import { Textarea } from './chunk-IUYUS2SO.js';
 import { Kbd } from './chunk-SMBKXWML.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './Composer-ABGJIAIR.css';
+import './Composer-PXITWNEK.css';
 import { forwardRef } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 
 var COMPOSER_COUNTER_AT = 0.8;
 var Composer = forwardRef(function Composer2({ value, onChange, onSubmit, label, actions, maxLength, className, rows = 3, onKeyDown, ...rest }, ref) {
   const near = maxLength !== void 0 && value.length >= maxLength * COMPOSER_COUNTER_AT;
+  const hasActions = actions !== void 0 && actions !== null && actions !== false;
   const keyDown = (event) => {
     onKeyDown?.(event);
     if (event.defaultPrevented || !onSubmit) return;
@@ -32,7 +33,7 @@ var Composer = forwardRef(function Composer2({ value, onChange, onSubmit, label,
         ...rest
       }
     ),
-    /* @__PURE__ */ jsxs("div", { className: "crewlet-composer__footer", children: [
+    onSubmit || near || hasActions ? /* @__PURE__ */ jsxs("div", { className: "crewlet-composer__footer", "data-hint-only": !near && !hasActions || void 0, children: [
       onSubmit ? /* @__PURE__ */ jsxs("span", { className: "crewlet-composer__hint", children: [
         /* @__PURE__ */ jsx(Kbd, { keys: ["Mod", "Enter"], subtle: true }),
         " to send"
@@ -40,7 +41,7 @@ var Composer = forwardRef(function Composer2({ value, onChange, onSubmit, label,
       near ? /* @__PURE__ */ jsx("span", { className: "crewlet-composer__counter", "aria-live": "polite", children: `${value.length.toLocaleString()} / ${maxLength.toLocaleString()}` }) : null,
       /* @__PURE__ */ jsx("span", { className: "crewlet-composer__spacer" }),
       actions
-    ] })
+    ] }) : null
   ] });
 });
 

package/dist/{chunk-3VD3G3IL.js → chunk-T5RQGI6O.js}

@@ -9,7 +9,7 @@ import { jsx } from 'react/jsx-runtime';
 var engine = null;
 var loading = null;
 function loadEngine() {
-  loading ??= import('./Editor-BVQHBF7L.js').then(
+  loading ??= import('./Editor-HORWMUM3.js').then(
     (module) => {
       engine = module.Editor;
       return engine;

package/dist/{chunk-F2KY4RLI.js → chunk-TVRBQMIX.js}

@@ -1,12 +1,13 @@
-import { Select } from './chunk-BQ7AKL2N.js';
+import { Select } from './chunk-VKKUGZ3G.js';
 import { today, shiftMonth, CalendarGrid, compareDays } from './chunk-GXQ3B46I.js';
 import { Popover } from './chunk-K3IJQNB7.js';
-import { Input } from './chunk-6QFAK2WV.js';
+import { Input } from './chunk-IUYUS2SO.js';
+import { useFocusModality } from './chunk-YSGLEHND.js';
 import { isComposing } from './chunk-R25RGPUB.js';
 import { Button } from './chunk-OG6CL3EB.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './TimeWindowPicker-T763GLXH.css';
+import './TimeWindowPicker-DEFDV77Z.css';
 import { useMemo, useState, useRef, useId, useEffect } from 'react';
 import { ClockGlyph, ChevronDownGlyph, CheckGlyph, ChevronLeftGlyph, ChevronRightGlyph } from '@crewlethq/icons/glyphs';
 import { jsx, jsxs } from 'react/jsx-runtime';
@@ -322,6 +323,7 @@ function TimeWindowPicker({
   size = "md",
   labels: labelOverrides
 }) {
+  useFocusModality();
   const labels = useMemo(() => withLabels(labelOverrides), [labelOverrides]);
   const isSet = isTimeWindowSet(value);
   const described = describeTimeWindow(value, { presets, labels });

package/dist/{chunk-QEFHYUCY.js → chunk-UWGUKMBK.js}

@@ -1,5 +1,5 @@
 import { useReorder } from './chunk-XJ2QEBMM.js';
-import { Input } from './chunk-6QFAK2WV.js';
+import { Input } from './chunk-IUYUS2SO.js';
 import { Menu } from './chunk-BUVCV3WI.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';

package/dist/{chunk-5YLON2PW.js → chunk-UYZZV4DZ.js}

@@ -1,6 +1,6 @@
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './FilterChip-EZ4QMW4E.css';
+import './FilterChip-VL33P3JL.css';
 import { createContext, useContext, useRef, useId, useCallback, useLayoutEffect } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-BQ7AKL2N.js → chunk-VKKUGZ3G.js}

@@ -1,7 +1,8 @@
 import { useListbox, useOptionKeys, useHighlightRest } from './chunk-F73MC7EZ.js';
+import { useFocusModality } from './chunk-YSGLEHND.js';
 import { useLayerContainer, viewportBounds, anchorGone, placePopup, LAYER_GAP, LAYER_REPOSITION_EVENT } from './chunk-OMV5W53A.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './Select-A54YS5EP.css';
+import './Select-W3CHTZXP.css';
 import { forwardRef, useId, useMemo, useState, useRef, useCallback, useEffect, useLayoutEffect } from 'react';
 import { createPortal } from 'react-dom';
 import { ChevronDownGlyph, CheckGlyph, SearchGlyph } from '@crewlethq/icons/glyphs';
@@ -36,6 +37,7 @@ var Select = forwardRef(function Select2({
   onHighlight,
   ...native
 }, ref) {
+  useFocusModality();
   const generatedId = useId();
   const rootId = id ?? generatedId;
   const classes = cx(className, width === "auto" && "crewlet-select--auto", appearance === "quiet" && "crewlet-select--quiet");

package/dist/{chunk-5VCG26CV.js → chunk-W3HYWD63.js}

@@ -1,10 +1,10 @@
 import { TagGroup } from './chunk-O2EGEONV.js';
-import { Tag } from './chunk-GFV4LJHH.js';
-import { StatusDot } from './chunk-WIATRXEJ.js';
 import { CursorFlag } from './chunk-3BYIWOTV.js';
 import { presenceHueClass } from './chunk-I6POAB4V.js';
-import { ChangeMark } from './chunk-HAKTRTRP.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-OOMXLJ3S.js';
+import { Tag } from './chunk-GFV4LJHH.js';
+import { StatusDot } from './chunk-WIATRXEJ.js';
+import { ChangeMark } from './chunk-47JQAGRV.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';
 import { presenceLabels } from './chunk-Z7JYG5TF.js';
 import { Popover } from './chunk-K3IJQNB7.js';
 import { Tooltip } from './chunk-6ZJ3N7QI.js';

package/dist/{chunk-DEJHAOC5.js → chunk-WMXAX6VA.js}

@@ -1,7 +1,7 @@
 import { announce } from './chunk-RSAQOKH3.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './ArrangeFrame-3PLZAG22.css';
+import './ArrangeFrame-QXOQTFAH.css';
 import { forwardRef, useRef, useCallback, useState, useEffect } from 'react';
 import { TrashGlyph } from '@crewlethq/icons/glyphs';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';

package/dist/{chunk-6JVRY5DQ.js → chunk-WNAYQQ6Y.js}

@@ -1,7 +1,7 @@
-import { Composer } from './chunk-7DZDSSJS.js';
 import { PrincipalAvatar } from './chunk-CI3VPIJN.js';
 import { toInstant, RelativeTime, formatExact, toISO } from './chunk-3CZ7XAVY.js';
-import { Document } from './chunk-TYKQ33CL.js';
+import { Document } from './chunk-P6WFZDKS.js';
+import { Composer } from './chunk-RH2NCQBZ.js';
 import { Count } from './chunk-BHHIIK3M.js';
 import { useHeadingLevel, headingTag } from './chunk-PQADV6P6.js';
 import { Button } from './chunk-OG6CL3EB.js';

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

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

package/dist/{chunk-ZU3DUXD2.js → chunk-WZGYIVYH.js}

@@ -1,5 +1,5 @@
 import { cx } from './chunk-ODEQTPFM.js';
-import './ChoiceList-RBL7FNQL.css';
+import './ChoiceList-EA2W6MOS.css';
 import { useId } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';