@crewlethq/ui 0.27.1 → 0.29.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crewlethq/ui",
-  "version": "0.27.1",
+  "version": "0.29.0",
   "description": "Crewlet shared React components built on @crewlethq/tokens and @crewlethq/icons.",
   "license": "MIT",
   "repository": {
@@ -42,8 +42,8 @@
     "clean": "rm -rf dist src/generated"
   },
   "dependencies": {
-    "@crewlethq/icons": "0.27.1",
-    "@crewlethq/tokens": "0.27.1",
+    "@crewlethq/icons": "0.29.0",
+    "@crewlethq/tokens": "0.29.0",
     "uqr": "0.1.3"
   },
   "peerDependencies": {

package/dist/WidgetFrame-4EFJOJMW.css

@@ -1,127 +0,0 @@
-/*
- * WidgetFrame: one figure on a dashboard. A title row, the figure filling the
- * height the host's frame gives it, and the citation line at the foot.
- */
-
-.crewlet-widget-frame {
-  box-sizing: border-box;
-  display: flex;
-  flex-direction: column;
-  gap: var(--spacing-2);
-  min-width: 0;
-  height: 100%;
-  min-height: 0;
-  padding: var(--spacing-3) var(--spacing-4);
-  border: 1px solid var(--color-border-default);
-  border-radius: var(--radius-lg);
-  background: var(--color-surface-elevated);
-}
-
-.crewlet-widget-frame__head {
-  display: flex;
-  align-items: center;
-  gap: var(--spacing-2);
-  min-width: 0;
-}
-
-.crewlet-widget-frame__title {
-  flex: 1;
-  min-width: 0;
-  margin: 0;
-  overflow: hidden;
-  color: var(--color-text-primary);
-  font-size: var(--font-size-sm);
-  font-weight: var(--font-weight-semibold);
-  line-height: var(--font-line-height-snug);
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-.crewlet-widget-frame__actions {
-  display: inline-flex;
-  flex: none;
-  align-items: center;
-  gap: var(--spacing-1);
-}
-
-.crewlet-widget-frame__body {
-  flex: 1;
-  min-width: 0;
-  min-height: 0;
-  overflow: auto;
-}
-
-.crewlet-widget-frame__blocked {
-  display: flex;
-  align-items: flex-start;
-  gap: var(--spacing-2);
-  margin: 0;
-  color: var(--color-text-secondary);
-  font-size: var(--font-size-sm);
-  line-height: var(--font-line-height-normal);
-}
-
-.crewlet-widget-frame__blocked-glyph {
-  display: inline-flex;
-  flex: none;
-  padding-top: 2px;
-  color: var(--color-text-tertiary);
-}
-
-.crewlet-widget-frame__cite {
-  display: flex;
-  min-width: 0;
-}
-
-.crewlet-widget-frame__cite-text,
-.crewlet-widget-frame__cite-button {
-  display: inline-flex;
-  flex-wrap: wrap;
-  align-items: center;
-  gap: 0 var(--spacing-1);
-  min-width: 0;
-  color: var(--color-text-tertiary);
-  font-size: var(--font-size-xs);
-  line-height: var(--font-line-height-snug);
-}
-
-.crewlet-widget-frame__cite-button {
-  margin: 0;
-  padding: 0;
-  border: 0;
-  border-radius: var(--radius-xs);
-  background: none;
-  font: inherit;
-  font-size: var(--font-size-xs);
-  text-align: start;
-  cursor: pointer;
-}
-
-.crewlet-widget-frame__cite-button:hover .crewlet-widget-frame__source {
-  color: var(--color-text-primary);
-  text-decoration: underline;
-}
-
-.crewlet-widget-frame__cite-button:focus-visible {
-  outline: 2px solid var(--color-focus);
-  outline-offset: var(--size-focus-ring-inset-offset);
-}
-
-.crewlet-widget-frame__source {
-  overflow: hidden;
-  color: var(--color-text-secondary);
-  font-weight: var(--font-weight-medium);
-  text-overflow: ellipsis;
-  white-space: nowrap;
-}
-
-/* The separator is drawn, not typed, so a screen reader hears the facts alone. */
-.crewlet-widget-frame__when::before {
-  content: '\00b7' / '';
-  margin-inline-end: var(--spacing-1);
-}
-
-.crewlet-widget-frame__stale {
-  display: inline-flex;
-  color: var(--color-feedback-warning-ink);
-}

package/dist/chunk-63WJLRB2.js

@@ -1,24 +0,0 @@
-import { cx } from './chunk-ODEQTPFM.js';
-import './Note-RT4L6VUT.css';
-import { forwardRef } from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-var Note = forwardRef(function Note2({ tone = "amber", align = "start", size = "md", className, children, ...rest }, ref) {
-  return /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref,
-      className: cx(
-        "crewlet-note",
-        `crewlet-note--${tone}`,
-        align === "center" && "crewlet-note--center",
-        size === "lg" && "crewlet-note--lg",
-        className
-      ),
-      ...rest,
-      children
-    }
-  );
-});
-
-export { Note };

package/dist/chunk-FVLCTCMV.js

@@ -1,96 +0,0 @@
-import { PRESENCE_LABELS, presenceOrder, collapseSessions } from './chunk-Z7JYG5TF.js';
-import { Avatar } from './chunk-5OM447RW.js';
-import { headingTag, useHeadingLevel } from './chunk-PQADV6P6.js';
-import { Button } from './chunk-OG6CL3EB.js';
-import { IconButton } from './chunk-4FQT6ZAY.js';
-import { cx } from './chunk-ODEQTPFM.js';
-import './PeopleRail-R64WVOSH.css';
-import { useId } from 'react';
-import { isCrewletCharacter } from '@crewlethq/icons/characters';
-import { XGlyph } from '@crewlethq/icons/glyphs';
-import { jsxs, jsx } from 'react/jsx-runtime';
-
-var PEOPLE_RAIL_LABELS = {
-  title: "People here",
-  close: "Close people",
-  you: "You",
-  nobody: "Nobody else is here right now.",
-  follow: "Follow",
-  following: "Following",
-  followName: (name) => `Follow ${name}`,
-  stopFollowingName: (name) => `Stop following ${name}`,
-  activity: PRESENCE_LABELS.activity
-};
-function peopleRailKey(member) {
-  return member.seat ?? member.id;
-}
-function PeopleRail({
-  members,
-  self,
-  following,
-  onFollow,
-  onClose,
-  actions,
-  labels: overrides,
-  className
-}) {
-  const labels = overrides ? { ...PEOPLE_RAIL_LABELS, ...overrides } : PEOPLE_RAIL_LABELS;
-  const headingID = useId();
-  const Heading = headingTag(useHeadingLevel());
-  const others = presenceOrder(collapseSessions(members));
-  return /* @__PURE__ */ jsxs("aside", { className: cx("crewlet-people-rail", className), "aria-labelledby": headingID, children: [
-    /* @__PURE__ */ jsxs("div", { className: "crewlet-people-rail__head", children: [
-      /* @__PURE__ */ jsx(Heading, { className: "crewlet-people-rail__title", id: headingID, children: labels.title }),
-      onClose && /* @__PURE__ */ jsx(IconButton, { size: "sm", variant: "ghost", label: labels.close, icon: /* @__PURE__ */ jsx(XGlyph, { size: "sm" }), onClick: onClose })
-    ] }),
-    /* @__PURE__ */ jsxs("ul", { role: "list", className: "crewlet-people-rail__list", children: [
-      self && /* @__PURE__ */ jsxs("li", { className: "crewlet-people-rail__person", children: [
-        /* @__PURE__ */ jsx(PresenceBadge, { member: self }),
-        /* @__PURE__ */ jsx("span", { className: "crewlet-people-rail__text", children: /* @__PURE__ */ jsx("span", { className: "crewlet-people-rail__name", children: labels.you }) })
-      ] }),
-      others.map((member) => {
-        const key = peopleRailKey(member);
-        const followed = following !== void 0 && following === key;
-        const extra = actions?.(member);
-        return /* @__PURE__ */ jsxs("li", { className: "crewlet-people-rail__person", children: [
-          /* @__PURE__ */ jsx(PresenceBadge, { member }),
-          /* @__PURE__ */ jsxs("span", { className: "crewlet-people-rail__text", children: [
-            /* @__PURE__ */ jsx("span", { className: "crewlet-people-rail__name", children: member.name }),
-            /* @__PURE__ */ jsx("span", { className: "crewlet-people-rail__where", children: member.location ?? labels.activity(member.activity, member.kind) })
-          ] }),
-          extra !== void 0 && extra !== null || onFollow ? /* @__PURE__ */ jsxs("span", { className: "crewlet-people-rail__actions", children: [
-            extra,
-            onFollow && /* @__PURE__ */ jsx(
-              Button,
-              {
-                size: "small",
-                variant: followed ? "primary" : "secondary",
-                pressed: followed,
-                "aria-label": followed ? labels.stopFollowingName(member.name) : labels.followName(member.name),
-                onClick: () => onFollow(followed ? null : member),
-                children: followed ? labels.following : labels.follow
-              }
-            )
-          ] }) : null
-        ] }, key);
-      })
-    ] }),
-    others.length === 0 && /* @__PURE__ */ jsx("p", { className: "crewlet-people-rail__note", children: labels.nobody })
-  ] });
-}
-function PresenceBadge({ member }) {
-  return /* @__PURE__ */ jsx(
-    Avatar,
-    {
-      name: member.name,
-      kind: member.kind,
-      src: member.src,
-      character: member.character !== void 0 && isCrewletCharacter(member.character) ? member.character : void 0,
-      hue: member.kind === "agent" ? member.hue : void 0,
-      size: "sm",
-      decorative: true
-    }
-  );
-}
-
-export { PEOPLE_RAIL_LABELS, PeopleRail, peopleRailKey };

package/dist/{chunk-UFKUWVMV.js → chunk-2HIOJ4YZ.js}

@@ -1,6 +1,6 @@
-import { Button } from './chunk-OG6CL3EB.js';
 import { useLayerContainer, viewportBounds, LAYER_GAP, outsideBounds, placePopup, LAYER_REPOSITION_EVENT } from './chunk-HMPFGIWM.js';
 import { usePopupLayer } from './chunk-R25RGPUB.js';
+import { Button } from './chunk-OG6CL3EB.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './Menu-KEKAD3BZ.css';

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

@@ -1,5 +1,5 @@
-import { Kbd } from './chunk-SMBKXWML.js';
 import { Textarea } from './chunk-6QFAK2WV.js';
+import { Kbd } from './chunk-SMBKXWML.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './Composer-ABGJIAIR.css';
 import { forwardRef } from 'react';

package/dist/{chunk-YZCJ63JF.js → chunk-ACA27MZH.js}

@@ -1,6 +1,6 @@
 import { CardHeaderSlotContext } from './chunk-AV2DXAEL.js';
-import { useHeadingLevel, HeadingLevelProvider, nextHeadingLevel, headingTag } from './chunk-PQADV6P6.js';
 import { Count } from './chunk-BHHIIK3M.js';
+import { useHeadingLevel, HeadingLevelProvider, nextHeadingLevel, headingTag } from './chunk-PQADV6P6.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './Card-KJOYHDTJ.css';
 import { createContext, useId, useState, isValidElement, useRef, useCallback, useMemo, Children, cloneElement, useContext, useEffect, Fragment } from 'react';

package/dist/{chunk-ENJUPIND.js → chunk-FZVJDJFN.js}

@@ -1,5 +1,5 @@
-import { headingTag } from './chunk-PQADV6P6.js';
 import { Count } from './chunk-BHHIIK3M.js';
+import { headingTag } from './chunk-PQADV6P6.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import { ChevronDownGlyph } from '@crewlethq/icons/glyphs';
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';

package/dist/{chunk-F4DPAJCN.js → chunk-I3KKZ2O3.js}

@@ -1,7 +1,7 @@
 import { HeadingLevelProvider } from './chunk-PQADV6P6.js';
-import { Button } from './chunk-OG6CL3EB.js';
 import { useLayerContainer } from './chunk-HMPFGIWM.js';
 import { focusables, useModalLayer, useBodyScrollLock } from './chunk-R25RGPUB.js';
+import { Button } from './chunk-OG6CL3EB.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './Modal-XOSV6FAH.css';

package/dist/{chunk-FW7HN6AP.js → chunk-LDJ3J4TQ.js}

@@ -1,6 +1,6 @@
 import { Callout } from './chunk-SVSCLHHI.js';
-import { Button } from './chunk-OG6CL3EB.js';
 import { isComposing } from './chunk-R25RGPUB.js';
+import { Button } from './chunk-OG6CL3EB.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import { useEffect } from 'react';
 import { EyeGlyph, UserGlyph } from '@crewlethq/icons/glyphs';

package/dist/{chunk-SGIQCI6Y.js → chunk-LIXSV5YI.js}

@@ -1,5 +1,5 @@
-import { SegmentedControl } from './chunk-RCQXUT5K.js';
 import { NODE_HUES, NODE_HUE_NAMES } from './chunk-AYKXMIOR.js';
+import { SegmentedControl } from './chunk-RCQXUT5K.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import { jsx } from 'react/jsx-runtime';
 

package/dist/{chunk-KZOGQXSP.js → chunk-OJ45PPCV.js}

@@ -1,6 +1,6 @@
 import { LayerNodeBridge } from './chunk-VYOKRN2I.js';
-import { Button } from './chunk-OG6CL3EB.js';
 import { LAYER_REPOSITION_EVENT, LayerHost } from './chunk-HMPFGIWM.js';
+import { Button } from './chunk-OG6CL3EB.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';

package/dist/{chunk-LREN6TUG.js → chunk-UZ6MA2V6.js}

@@ -1,9 +1,9 @@
 import { Select } from './chunk-FC4YTTFJ.js';
+import { Popover } from './chunk-BWRGFKJP.js';
 import { today, shiftMonth, CalendarGrid, compareDays } from './chunk-GXQ3B46I.js';
 import { Input } from './chunk-6QFAK2WV.js';
-import { Popover } from './chunk-BWRGFKJP.js';
-import { Button } from './chunk-OG6CL3EB.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';

package/dist/{chunk-WG5WUFBX.js → chunk-Y5NQ2LMS.js}

@@ -1,5 +1,5 @@
-import { today, CalendarGrid, shiftMonth, compareDays } from './chunk-GXQ3B46I.js';
 import { Popover } from './chunk-BWRGFKJP.js';
+import { today, CalendarGrid, shiftMonth, compareDays } from './chunk-GXQ3B46I.js';
 import { Button } from './chunk-OG6CL3EB.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';
 import { cx } from './chunk-ODEQTPFM.js';

package/dist/{chunk-D5JZN3ML.js → chunk-Z6VW6CXX.js}

@@ -1,5 +1,5 @@
-import { Kbd } from './chunk-SMBKXWML.js';
 import { FormField, Textarea, Input } from './chunk-6QFAK2WV.js';
+import { Kbd } from './chunk-SMBKXWML.js';
 import { isComposing } from './chunk-R25RGPUB.js';
 import { announce } from './chunk-RSAQOKH3.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';