@crewlethq/ui 0.65.1 → 0.67.0

package/dist/index.js

@@ -2,8 +2,8 @@ import './chunk-TXQNWGUD.js';
 export { TypeSpecimen } from './chunk-JKAFEFFC.js';
 export { REFERENCE_NAME_PATTERN, ValueField, completeReference, isWholeReference, rankReferences, referenceAt, urlSchemeOf } from './chunk-BWAUL5MB.js';
 export { VERSION_COMPARE_LABELS, VERSION_COMPARE_LENSES, VersionCompare } from './chunk-6ID4DVML.js';
-export { VersionTimeline } from './chunk-SRSE7FGL.js';
-export { WidgetFrame } from './chunk-4EDSEX7U.js';
+export { VersionTimeline } from './chunk-WPMZKZUH.js';
+export { WidgetFrame } from './chunk-S5QJZOPL.js';
 export { ElementToPngError, elementToPng, parseCsv, serializeElement, toCsv } from './chunk-FEJANUZK.js';
 export { DEFAULT_TIME_WINDOW_LABELS, TIME_WINDOW_SPANS, TimeWindowPicker, describeTimeWindow, isTimeWindowSet, parseTimeWindowDuration, resolveTimeWindow, timeWindowMatchesPreset } from './chunk-WXLQJUGO.js';
 export { ToastProvider, Toaster, toasterInsetStyle, useToast } from './chunk-SZFKGH2W.js';
@@ -13,11 +13,11 @@ export { ThemeSwatch } from './chunk-3XQUEF5C.js';
 export { DensitySwitcher, ThemeSwitcher } from './chunk-7EOUVWGQ.js';
 export { ThemeToggle } from './chunk-IPMJGK2Q.js';
 export { applyStoredPreferences, resolveTheme, useDensityPreference, useSystemTheme, useThemePreference } from './chunk-Z24ZUSTX.js';
-export { ThinkingIndicator } from './chunk-E2MIUNUU.js';
+export { ThinkingIndicator } from './chunk-M73MMEZY.js';
 export { TileGrid } from './chunk-Q6CQMS6R.js';
 export { TIME_RANGE_CUSTOM, TIME_RANGE_PICKER_LABELS, TimeRangePicker, timeRangeFieldKey, timeRangeProblem } from './chunk-PQWNK3N7.js';
 export { Switcher } from './chunk-GDDVI4US.js';
-export { TABLE_TAGS_CELL_LABELS, TableDateCell, TableEntityCell, TableKeyCell, TableNumberCell, TableStatusCell, TableTagsCell, TableTextCell } from './chunk-NWTHGZBH.js';
+export { TABLE_TAGS_CELL_LABELS, TableDateCell, TableEntityCell, TableKeyCell, TableNumberCell, TableStatusCell, TableTagsCell, TableTextCell } from './chunk-GNDKUSCG.js';
 export { TagsInput } from './chunk-HEIOLITO.js';
 export { StatCard } from './chunk-G5IZGAWS.js';
 export { StatGroup } from './chunk-OUD75UB2.js';
@@ -35,9 +35,9 @@ export { CellDisplay, CellEditor, CheckboxCell, DateCell, LongTextCell, MultiSel
 export { TagGroup } from './chunk-UEOEBOBR.js';
 export { matchesShortcut, useShortcut } from './chunk-AYHIF6DH.js';
 import './chunk-73GUXYYE.js';
+export { SearchTrigger } from './chunk-ERNT3UTB.js';
 export { SectionFrame, SectionFrameBody, SectionFrameNav } from './chunk-G4CGDUCP.js';
 export { NavGroup, NavItem, SidebarNav } from './chunk-WCDPFTJZ.js';
-export { SearchTrigger } from './chunk-ERNT3UTB.js';
 export { SegmentedMeter, segmentedMeterLabel } from './chunk-4AK52VHB.js';
 export { Select } from './chunk-VK45YJLH.js';
 export { SelectionBar } from './chunk-WU5JDEEY.js';
@@ -45,16 +45,16 @@ export { SEND_BUTTON_LABELS, SendButton } from './chunk-T2GC7UAP.js';
 export { RESULT_TABLE_CARD_LABELS, RESULT_TABLE_COLLAPSED_ROWS, RESULT_TABLE_MAX_ROWS, ResultTableCard } from './chunk-7QTJO3PV.js';
 export { Table } from './chunk-5DJMFRSZ.js';
 export { ReviewList } from './chunk-DO4J4TBZ.js';
+export { RichEditor, preloadRichEditor } from './chunk-BVNFNFA6.js';
+export { RICH_EDITOR_LABELS, richEditorLabels } from './chunk-CSQTDGTS.js';
 export { canonicalMarkdown, roundTripMarkdown } from './chunk-SWD4QBL6.js';
 import './chunk-QH6VYJ3X.js';
 export { RUN_STATES, RunChip } from './chunk-PIAGTZY3.js';
 export { FRAME_HELLO_TIMEOUT_MS, FRAME_LOAD_GRACE_MS, SandboxedFrame, SandboxedFrameNotice, SandboxedFramePlaceholder } from './chunk-OJGI4XJH.js';
-export { RichEditor, preloadRichEditor } from './chunk-DS5NBENV.js';
-export { RICH_EDITOR_LABELS, richEditorLabels } from './chunk-CSQTDGTS.js';
 export { PropertyList } from './chunk-HIWPPWNY.js';
-export { PROPOSAL_CARD_LABELS, PROPOSAL_FAILURE_OUTCOMES, PROPOSAL_STATES, ProposalCard } from './chunk-FZUDUNCK.js';
-export { QR_DARK, QR_LIGHT, QR_QUIET_ZONE, QrCode, qrModulePath, qrModules } from './chunk-Y56FM3K4.js';
+export { PROPOSAL_CARD_LABELS, PROPOSAL_FAILURE_OUTCOMES, PROPOSAL_STATES, PROPOSAL_TONES, ProposalCard } from './chunk-2AQMXGWA.js';
 export { Prose } from './chunk-DVVP27OD.js';
+export { QR_DARK, QR_LIGHT, QR_QUIET_ZONE, QrCode, qrModulePath, qrModules } from './chunk-Y56FM3K4.js';
 export { ReadingPane, ReadingPaneByline, ReadingPaneLead, ReadingPaneOutcome, ReadingPaneQuote, ReadingPaneReasoning, ReadingPaneSection, ReadingPaneTitle } from './chunk-ZAJHGDAW.js';
 export { REFUSAL_CARD_LABELS, RefusalCard } from './chunk-RQHN4J5P.js';
 export { RelatedRow } from './chunk-CNEHFH2A.js';
@@ -94,7 +94,7 @@ export { ListDetail } from './chunk-YBC2CYPD.js';
 export { ListInput, withDraft } from './chunk-MNTUIAQT.js';
 export { LIVE_CURSOR_HIDE_MS, LIVE_CURSOR_REST_MS, LiveCursor } from './chunk-DPNVKWJX.js';
 export { IndicatorAnchor } from './chunk-27MJPU7G.js';
-export { INLINE_EDITOR_LABELS, InlineEditor } from './chunk-VVOFJFRT.js';
+export { INLINE_EDITOR_LABELS, InlineEditor } from './chunk-QBWNGNF7.js';
 export { LAYERS_LIST_LABELS, LayersList } from './chunk-VUYNNILP.js';
 export { IDLE_AFTER_MS, useFullscreen, useIdle } from './chunk-W5XCNEZC.js';
 export { Highlight, highlightRanges, highlightTerms } from './chunk-H6VKCIWV.js';
@@ -104,8 +104,8 @@ export { IconTile } from './chunk-3LI4TRUR.js';
 export { ImageUpload } from './chunk-56IFLQGF.js';
 export { InboxGroup, InboxList, InboxMore, InboxRow, InboxToggle } from './chunk-62DBFNOK.js';
 export { FactList } from './chunk-CSXJIIO4.js';
-export { FileDrop, FilePickButton, droppedFiles, pickedFiles } from './chunk-2JHGPXYG.js';
 export { FileList } from './chunk-5WRWBDML.js';
+export { FileDrop, FilePickButton, droppedFiles, pickedFiles } from './chunk-2JHGPXYG.js';
 export { FILTER_CHIP_ATTRIBUTE, FilterChip, FilterChipGroup } from './chunk-IWZG7NPV.js';
 export { FindingList } from './chunk-LSRQ2A6B.js';
 export { FolderTile, describeFolderContents, folderContentsParts } from './chunk-WTXCK46H.js';
@@ -114,7 +114,7 @@ export { DEFAULT_FRAME_THEME, EXTERNAL_URL_MAX, FRAME_BRIDGE, FRAME_MESSAGE, FRA
 export { DENSITY_PREFERENCES, PALETTE_ID, THEME_PREFERENCES, applyDensity, applyPalette, applyTheme, isDensityPreference, isPaletteId, isThemePreference } from './chunk-ZXXDZJQN.js';
 export { DownloadButton } from './chunk-NSCYGUDG.js';
 export { downloadBlob, downloadText, safeFilename, useDownload } from './chunk-YNRKVY7X.js';
-export { EditingStatus } from './chunk-B76OKJMX.js';
+export { EditingStatus } from './chunk-VLGGLLKH.js';
 export { EntityChip } from './chunk-OSKJZNBT.js';
 export { EntityList } from './chunk-7IW3P6FH.js';
 export { ErrorBoundary } from './chunk-ZEPUKRO7.js';
@@ -127,17 +127,17 @@ export { DOC_TABS_EDITOR_LABELS, DocTabsEditor } from './chunk-CX6QT4CH.js';
 export { CursorFlag } from './chunk-MMCYH5LB.js';
 export { PresenceRing, presenceHueClass } from './chunk-EFX2YC5T.js';
 export { ChooserList, ColumnChooser, DataGrid, columnChoicesOf, countDataGridRows, fitGridColumns, parseGridSort, useAnyDataGridDriving, useDataGridDriving } from './chunk-ELLRZ5XR.js';
-export { DATA_VIEW_TOOLBAR_LABELS, DataView, DataViewToolbar, FILTER_AXIS_LABELS, FilterAxisBar, FilterAxisChip, applyColumnFilters, applyFilters, blankFilterValue, defaultOperator, filterDefsFromColumns, filterHasValue, filterPredicate, formatFilterValue, operatorOf, tableColumns } from './chunk-XGBGEI6V.js';
+export { DATA_VIEW_TOOLBAR_LABELS, DataView, DataViewToolbar, FILTER_AXIS_LABELS, FilterAxisBar, FilterAxisChip, applyColumnFilters, applyFilters, blankFilterValue, defaultOperator, filterDefsFromColumns, filterHasValue, filterPredicate, formatFilterValue, operatorOf, tableColumns } from './chunk-J5BIKMQY.js';
 export { PageHeader } from './chunk-FPDIHEM4.js';
 export { ALL_ITEMS, CopyableCell, DATA_TABLE_LABELS, DataTable, RowActionsMenu } from './chunk-CFY257ND.js';
-export { DATASET_SOURCE_KINDS, DatasetSource, DatasetSourceList } from './chunk-VRG2ZXNK.js';
+export { DATASET_SOURCE_KINDS, DatasetSource, DatasetSourceList } from './chunk-R6K62EXV.js';
 export { DEFAULT_DATE_TIME_PICKER_LABELS, DateTimePicker } from './chunk-PX54PALQ.js';
 export { DEEP_WORK_CARD_LABELS, DEEP_WORK_STATES, DEEP_WORK_STATE_LABELS, DeepWorkCard } from './chunk-UWOYDHVW.js';
 export { STEP_STATES, STEP_STATE_LABELS, StepList, StepStateMark, Stepper, stepDetailPieces } from './chunk-HJBHP66O.js';
 export { DEFAULT_METER_THRESHOLDS, METER_STATES, Meter, meterState, meterStateTone, meterTone, progressTone } from './chunk-RQFRRPV6.js';
 export { REFUSAL_STRIP_LABELS, ReceiptStrip, RefusalStrip } from './chunk-M25IV5MH.js';
 export { StatusCard } from './chunk-NTQPJJAN.js';
-export { COMMENT_THREAD_LABELS, CommentThread } from './chunk-DKJJ434E.js';
+export { COMMENT_THREAD_LABELS, CommentThread } from './chunk-UBJ32EO2.js';
 export { ConfirmField, confirmMatches } from './chunk-JVII5264.js';
 export { InlineCode } from './chunk-PLL7ZJHY.js';
 export { CONFLICT_NOTE_LABELS, ConflictNote } from './chunk-SUJO3AHN.js';
@@ -165,7 +165,7 @@ export { LONGTEXT_MAX_DEFAULT, RATING_MAX_CEILING, RATING_MAX_DEFAULT, SHEET_COL
 export { PRESENCE_ACTIVITIES, PRESENCE_HUES, PRESENCE_LABELS, assignPresenceHues, collapseSessions, joinNames, presenceLabels, presenceOrder } from './chunk-Z7JYG5TF.js';
 import './chunk-3L5NHASN.js';
 export { ActivityStrip, BarList, ChartEmpty, ChartTooltip, DATA_COLORS, DATA_COLOR_OTHER, Histogram, Legend, Sparkline, StackedBar, StackedColumns, TimeSeries, dataColor, histogramTicks, niceScale, useChartHover } from './chunk-YWVT7B6N.js';
-export { CHAT_THREAD_FOLLOW_WITHIN, CHAT_THREAD_LABELS, ChatThread } from './chunk-F2IYVVA3.js';
+export { CHAT_THREAD_FOLLOW_WITHIN, CHAT_THREAD_LABELS, ChatThread } from './chunk-D2ZXIQ23.js';
 export { CalendarGrid, compareDays, daysInMonth, sameDay, shiftDay, shiftMonth, today } from './chunk-EE3DJMSQ.js';
 export { Callout } from './chunk-BPCY7ZID.js';
 export { BOARD_NAME_MIN_CHARS, CANVAS_BOARD_MAX_LIVE, CANVAS_BOARD_MIN_LIVE_WIDTH, CANVAS_BOARD_MIN_ZOOM, CANVAS_NOTE_COLORS, CanvasBoard, TITLE_GLYPH_EM, boardName, boardRoom, liveBoards, titleSize } from './chunk-JEA5OX54.js';
@@ -184,18 +184,18 @@ export { CHARACTER_PICKER_COLUMNS, CharacterPicker } from './chunk-SNQRGH4A.js';
 export { BrandChip } from './chunk-UH44L7OJ.js';
 export { BrandLockup } from './chunk-7KBNFFM3.js';
 export { BrandSample } from './chunk-AVMQMY66.js';
-export { Breadcrumb } from './chunk-M52HLPOG.js';
-export { KeyChip } from './chunk-HBDA76EZ.js';
 export { BrandScope, brandScopeInputs } from './chunk-X7WEE3EK.js';
 import './chunk-5SGHW42B.js';
 import './chunk-7W3LYIOC.js';
+export { Breadcrumb } from './chunk-M52HLPOG.js';
+export { KeyChip } from './chunk-HBDA76EZ.js';
 export { ArtifactMakeRow } from './chunk-37U3Z65B.js';
 export { ArtifactNameCell } from './chunk-4MRFLHJC.js';
 export { AsideLayout } from './chunk-QOXLP5PE.js';
 export { ATTACHMENT_CHIP_LABELS, AttachmentChip } from './chunk-3N36CYTU.js';
 export { Tag } from './chunk-I5OIKDX2.js';
-export { ArrangeFrame, useGridResize } from './chunk-PLNJEDGI.js';
 export { ArrangeGrid } from './chunk-QBA5B2Z5.js';
+export { ArrangeFrame, useGridResize } from './chunk-PLNJEDGI.js';
 export { ArrangeGroup } from './chunk-CYYBE2MM.js';
 export { ArrangeList, DEFAULT_ARRANGE_LABELS } from './chunk-TWJERLT3.js';
 export { Switch } from './chunk-3XDT5ZWL.js';
@@ -208,18 +208,18 @@ export { TabPanel, Tabs, tabId } from './chunk-PVZOP3QK.js';
 import './chunk-EGMQURBR.js';
 export { ARTIFACT_ICON_WORDS, ArtifactIcon, artifactIconGlyph } from './chunk-AVL52EME.js';
 export { StatusDot } from './chunk-WIATRXEJ.js';
-export { ArtifactCard, ArtifactCardSkeleton, ArtifactPreviewGlyph } from './chunk-UBIPDEFV.js';
+export { ArtifactCard, ArtifactCardSkeleton, ArtifactPreviewGlyph } from './chunk-3EETQFAM.js';
 export { Skeleton } from './chunk-BRLZXYPA.js';
 export { PRINCIPAL_KINDS, PrincipalAvatar } from './chunk-CI3VPIJN.js';
-export { RelativeTime, currentNow, formatElapsed, formatExact, formatRelative, formatUntil, toISO, toInstant, useNow } from './chunk-L6NG7CUA.js';
+export { RelativeTime, currentNow, formatElapsed, formatExact, formatRelative, formatUntil, toISO, toInstant, useNow } from './chunk-EJNJMHQG.js';
 export { EMPTY_VALUE, EmptyValue } from './chunk-RE3FBGQQ.js';
 export { Card } from './chunk-4AUTALJA.js';
 export { useCardHeaderSlot } from './chunk-AV2DXAEL.js';
 export { AvatarStack, avatarStackLabel } from './chunk-BKP6XCAJ.js';
 export { AVATAR_CHARACTER_FULL_DETAIL, AVATAR_CORNER_RATIO, AVATAR_SIZES, AVATAR_STATUSES, AVATAR_STATUS_LABELS, Avatar, avatarCorner, avatarInitialsName, avatarPixels, avatarTint, getInitials } from './chunk-PZKHBB7D.js';
 export { ArtifactKindGround, ArtifactKindIllustration, ArtifactKindTile } from './chunk-NHLNHH4J.js';
-export { ARTIFACT_ACCESSES, ARTIFACT_ACCESS_LABELS, ArtifactAccessGlyph, ArtifactAccessLabel } from './chunk-DOY3KC6I.js';
 export { Checkbox, CheckboxGroup } from './chunk-PBCNINMB.js';
+export { ARTIFACT_ACCESSES, ARTIFACT_ACCESS_LABELS, ArtifactAccessGlyph, ArtifactAccessLabel } from './chunk-DOY3KC6I.js';
 export { DashboardCover, DocCover, SHEET_COVER_COLUMNS, SHEET_COVER_ROWS, SheetCover } from './chunk-R45VM5EX.js';
 export { Document, DocumentTitle, DocumentTitleField } from './chunk-BXCL6P5Z.js';
 export { ARTIFACT_KINDS, ArtifactKindGlyph } from './chunk-RSKW25Y5.js';
@@ -241,7 +241,7 @@ export { DisclosureAnatomy } from './chunk-IVTQWOXV.js';
 export { Count } from './chunk-MLDTLZAO.js';
 export { HeadingLevelProvider, headingTag, nextHeadingLevel, useHeadingLevel } from './chunk-PQADV6P6.js';
 export { Announcer, announce, useAnnouncer } from './chunk-2G355KDJ.js';
-export { APP_SHELL_ASIDE_WIDTH, AccountRow, AppShell, AppShellRail, AppShellRailRow, AppShellRailStatus, AppShellToggle, AppShellTopbar, readStoredWidth, useAppShell, useScreenBelow, useScreenWidth, useStoredWidth } from './chunk-E55DKVY7.js';
+export { APP_SHELL_ASIDE_WIDTH, AccountRow, AppShell, AppShellRail, AppShellRailRow, AppShellRailStatus, AppShellToggle, AppShellTopbar, readStoredWidth, useAppShell, useScreenBelow, useScreenWidth, useStoredWidth } from './chunk-GJ7VIQWL.js';
 export { useMediaMatch } from './chunk-RTPQDNW3.js';
 export { Menu } from './chunk-T73DMDU4.js';
 export { RESIZE_HANDLE_LARGE_STEP, RESIZE_HANDLE_STEP, ResizeHandle, clampSize, useAppShellAside, useAppShellPeek } from './chunk-PIYJNCN7.js';

package/dist/styles.css

@@ -754,7 +754,7 @@
 }
 
 
-/* AppShell-LZQA3XU4.css */
+/* AppShell-2IBUS4TH.css */
 /*
  * The application frame: a rail on the FRAME, and the screen on a SHEET that
  * floats beside it.
@@ -816,7 +816,12 @@
      past it. A page that can also scroll as a whole carries the rail off the
      top of the window. */
   height: 100dvh;
-  overflow: hidden;
+  /* CLIPPED, NOT SCROLLABLE. `overflow: hidden` is still a scroll container:
+     a focus or a scrollIntoView on anything that reaches past the viewport
+     scrolled the whole shell up, the frame showing as a band under it, and
+     nothing a reader could do scrolled it back. `clip` cuts the same edge
+     and offers nothing to scroll (SidePanel's flush body, the same rule). */
+  overflow: clip;
   /* The FRAME, the lowest rung: what the rail stands on and what shows round
      the sheet's inset. */
   background: var(--color-surface-frame);
@@ -9635,11 +9640,11 @@ button.crewlet-histogram__bar[data-empty]:focus-visible > .crewlet-histogram__fi
 }
 
 
-/* ChatThread-FGXVDLI2.css */
+/* ChatThread-2KO3FZKQ.css */
 /*
  * A conversation as it grows: the scroller, the items a spacing step and a
- * half apart on the panel's 16px inset, and the Jump to latest pill floating
- * over its foot.
+ * half apart on the panel's 16px inset, and the Jump to latest pill in a row
+ * of its own under it.
  */
 .crewlet-chat-thread {
   position: relative;
@@ -9691,14 +9696,17 @@ button.crewlet-histogram__bar[data-empty]:focus-visible > .crewlet-histogram__fi
   flex: none;
 }
 
-/* The pill, centred a step above the thread's foot. */
+/*
+ * The pill, centred in a row of its own under the log. IN FLOW, NOT FLOATING:
+ * laid over the scroller it covered the last lines of whatever was being read,
+ * a table's rows or an answer's text. Here the log gives up the row while the
+ * pill shows, and nothing it holds is hidden under it.
+ */
 .crewlet-chat-thread__jump {
-  position: absolute;
-  bottom: var(--spacing-3);
-  left: 50%;
-  transform: translateX(-50%);
-  box-shadow: var(--shadow-md);
-  border-radius: var(--radius-pill);
+  display: flex;
+  flex: none;
+  justify-content: center;
+  padding: var(--spacing-2) var(--spacing-4);
 }
 
 .crewlet-chat-thread__fresh {
@@ -27077,7 +27085,7 @@ button.crewlet-presence-stack__member:focus-visible {
 }
 
 
-/* ProposalCard-VTTCDXYK.css */
+/* ProposalCard-SF332W4E.css */
 /*
  * A proposed change. The card, its head, its strip and its foot are
  * StatusCard's; only the note's register is said here: the consequence is a
@@ -27098,6 +27106,28 @@ button.crewlet-presence-stack__member:focus-visible {
   text-align: end;
 }
 
+/* THE DELIBERATE CONFIRMATION, on a row of its own above the decision. It
+   starts at the foot's start edge, unlike the one-line reasons around it: a
+   checkbox's sentence wraps under its own first line, and set at the end its
+   lines would start in a different place each. */
+.crewlet-proposal-card__confirmation {
+  flex: 1 1 100%;
+}
+
+/* A PRIMARY THAT HAS JUST APPEARED takes no pointer for a moment (ARMING_MS
+   in ProposalCard.tsx): no hover, and no press from a pointer that was
+   already resting where it landed. Focus and the keyboard still reach it. */
+.crewlet-proposal-card__approve[data-arming] {
+  pointer-events: none;
+}
+
+/* THE DANGER TONE, while the decision is open: Card's rail (passed through
+   StatusCard) and the title in the danger ink, the step the tokens measure as
+   text, so it holds AA in every palette. The Tag keeps the state. */
+.crewlet-proposal-card--danger .crewlet-card__title {
+  color: var(--color-feedback-danger-ink);
+}
+
 /* WHY THE LAST DECISION WAS REFUSED, on a line of its own above the
    decision and at its end, as the held primary's reason is: the refusal
    strip's own inline drawing, which wraps rather than widening the row. */
@@ -38139,9 +38169,9 @@ b.crewlet-switcher__match {
 }
 
 
-/* ThinkingIndicator-QJMX2TXC.css */
+/* ThinkingIndicator-JVF52N7L.css */
 /*
- * The assistant at work: the Assistant's mark, its blades turning, and a line
+ * The assistant at work: the Assistant's mark, its spark turning, and a line
  * of status under a shimmer. See ThinkingIndicator.tsx for why it replaces a
  * caret and how it is announced.
  */
@@ -38163,27 +38193,83 @@ b.crewlet-switcher__match {
 }
 
 /*
- * THE BLADES TURN A QUARTER, THEN REST. The figure is four blades around a
- * core, the same after a quarter turn, so each round ends where the next
- * begins and the loop never shows a seam. One round is the breath period
- * (2.2s): the turn takes its first half on the in-out ease and the second
- * half is still, which reads as steady thought rather than as a spinner. The
- * core holds still, as the mark's own description promises.
- */
+ * THE SPARK TURNS A QUARTER, THEN RESTS. The Assistant's main spark
+ * (data-motion="turn") makes a quarter turn about its own centre while its
+ * companion (data-motion="twinkle") dims and shrinks, both on one timeline of
+ * --motion-duration-spark (1.6s). The gesture runs from 20% to 70% of the
+ * period and every part is at rest in the idle pose for the other half, so
+ * the loop never jumps: the spark is four-fold symmetric, so its 90 degree
+ * pose is its 0 degree pose. Both parts pivot on their own fill box, which is
+ * the spark's centre, so the same rules move the 16 pixel grid drawing and
+ * the 48 unit master.
+ *
+ * THE TURN TUCKS. A full-size spark sweeps its tip through the companion
+ * between 26.6 and 63.4 degrees. The spark therefore pulls in to 0.8 over the
+ * first 15.37 degrees, holds 0.8 through the fast middle of the turn and opens
+ * back to 1 over the last 15.37 degrees, which keeps clear violet between the
+ * two at every frame. Rotate and scale are one transform, so the two can never
+ * drift apart. The three timing functions are the design's one eased quarter
+ * turn, cubic-bezier(0.65, 0, 0.35, 1) over the gesture, split at the 37.5%
+ * and 52.5% stops, so the angle follows that curve exactly.
+ *
+ * THE COMPANION TWINKLES. Its trough sits at 45%, the instant the main spark
+ * passes 45 degrees, and it shares the turn's gesture window.
+ */
+.crewlet-thinking__mark [data-motion='turn'],
+.crewlet-thinking__mark [data-motion='twinkle'] {
+  transform-box: fill-box;
+  transform-origin: center;
+}
+
 .crewlet-thinking__mark [data-motion='turn'] {
-  transform-box: view-box;
-  transform-origin: 50% 50%;
-  animation: crewlet-thinking-turn var(--motion-duration-breath) var(--motion-easing-in-out) infinite;
+  animation: crewlet-thinking-turn var(--motion-duration-spark) linear infinite;
+}
+
+.crewlet-thinking__mark [data-motion='twinkle'] {
+  animation: crewlet-thinking-twinkle var(--motion-duration-spark) linear infinite;
 }
 
 @keyframes crewlet-thinking-turn {
-  0% {
-    transform: rotate(0deg);
+  0%,
+  20% {
+    transform: rotate(0deg) scale(1);
+    animation-timing-function: cubic-bezier(0.4878, 0, 0.7883, 0.4041);
   }
 
-  50%,
+  37.5% {
+    transform: rotate(15.37deg) scale(0.8);
+    animation-timing-function: cubic-bezier(0.4462, 0.2792, 0.5538, 0.7208);
+  }
+
+  52.5% {
+    transform: rotate(74.63deg) scale(0.8);
+    animation-timing-function: cubic-bezier(0.2117, 0.5959, 0.5122, 1);
+  }
+
+  70%,
   100% {
-    transform: rotate(90deg);
+    transform: rotate(90deg) scale(1);
+  }
+}
+
+@keyframes crewlet-thinking-twinkle {
+  0%,
+  20% {
+    transform: scale(1);
+    opacity: 1;
+    animation-timing-function: cubic-bezier(0.45, 0, 0.55, 1);
+  }
+
+  45% {
+    transform: scale(0.7);
+    opacity: 0.5;
+    animation-timing-function: cubic-bezier(0.45, 0, 0.55, 1);
+  }
+
+  70%,
+  100% {
+    transform: scale(1);
+    opacity: 1;
   }
 }
 
@@ -38243,9 +38329,24 @@ b.crewlet-switcher__match {
   }
 }
 
+/*
+ * UNDER REDUCED MOTION THE MARK HOLDS A WORKING POSE. Both animations stop,
+ * and the mark shows the gesture's tuck and the twinkle's trough held still
+ * on the tile's axes: the main spark at 0.8 and the companion at 0.7 and half
+ * strength. It differs from the idle mark without moving, and the 16 pixel
+ * grid drawing keeps its pixel centred tips, so it stays crisp at 16 and
+ * 20 px. The pose is swapped in at once, never with a transition.
+ */
 @media (prefers-reduced-motion: reduce) {
   .crewlet-thinking__mark [data-motion='turn'] {
     animation: none;
+    transform: scale(0.8);
+  }
+
+  .crewlet-thinking__mark [data-motion='twinkle'] {
+    animation: none;
+    transform: scale(0.7);
+    opacity: 0.5;
   }
 
   .crewlet-thinking__status {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crewlethq/ui",
-  "version": "0.65.1",
+  "version": "0.67.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.65.1",
-    "@crewlethq/tokens": "0.65.1",
+    "@crewlethq/icons": "0.67.0",
+    "@crewlethq/tokens": "0.67.0",
     "prosemirror-commands": "1.7.2",
     "prosemirror-gapcursor": "1.4.1",
     "prosemirror-history": "1.5.1",

package/dist/ThinkingIndicator-QJMX2TXC.css

@@ -1,122 +0,0 @@
-/*
- * The assistant at work: the Assistant's mark, its blades turning, and a line
- * of status under a shimmer. See ThinkingIndicator.tsx for why it replaces a
- * caret and how it is announced.
- */
-
-/*
- * ONE LINE OF PROSE TALL, at every state: the mark alone, the mark with a
- * status line, and the line changing from one step to the next all keep the
- * same height, so the thread never moves while the assistant works.
- */
-.crewlet-thinking {
-  display: flex;
-  align-items: center;
-  gap: var(--spacing-2);
-  min-width: 0;
-  min-height: calc(var(--font-size-compact) * var(--font-line-height-relaxed));
-  font-family: var(--font-family-sans);
-  font-size: var(--font-size-compact);
-  line-height: var(--font-line-height-relaxed);
-}
-
-/*
- * THE BLADES TURN A QUARTER, THEN REST. The figure is four blades around a
- * core, the same after a quarter turn, so each round ends where the next
- * begins and the loop never shows a seam. One round is the breath period
- * (2.2s): the turn takes its first half on the in-out ease and the second
- * half is still, which reads as steady thought rather than as a spinner. The
- * core holds still, as the mark's own description promises.
- */
-.crewlet-thinking__mark [data-motion='turn'] {
-  transform-box: view-box;
-  transform-origin: 50% 50%;
-  animation: crewlet-thinking-turn var(--motion-duration-breath) var(--motion-easing-in-out) infinite;
-}
-
-@keyframes crewlet-thinking-turn {
-  0% {
-    transform: rotate(0deg);
-  }
-
-  50%,
-  100% {
-    transform: rotate(90deg);
-  }
-}
-
-/*
- * THE SHIMMER IS A LIGHTER BAND CROSSING THE WORDS, the band Skeleton sweeps
- * across a placeholder, set in ink rather than in surface: the words are the
- * secondary ink at rest, so they read at every point of the sweep, and the
- * band is the primary ink. The gradient is clipped to the glyphs and is three
- * times the line's width, so the band crosses it rather than standing in it.
- */
-.crewlet-thinking__status {
-  min-width: 0;
-  overflow: hidden;
-  color: var(--color-text-secondary);
-  text-overflow: ellipsis;
-  white-space: nowrap;
-  animation: crewlet-thinking-enter var(--motion-duration-moderate) var(--motion-easing-out);
-}
-
-@supports (background-clip: text) or (-webkit-background-clip: text) {
-  .crewlet-thinking__status {
-    background-image: linear-gradient(
-      90deg,
-      var(--color-text-secondary) 0%,
-      var(--color-text-secondary) 40%,
-      var(--color-text-primary) 50%,
-      var(--color-text-secondary) 60%,
-      var(--color-text-secondary) 100%
-    );
-    background-size: 300% 100%;
-    -webkit-background-clip: text;
-    background-clip: text;
-    color: transparent;
-    animation:
-      crewlet-thinking-enter var(--motion-duration-moderate) var(--motion-easing-out),
-      crewlet-thinking-shimmer var(--motion-duration-breath) linear infinite;
-  }
-}
-
-@keyframes crewlet-thinking-shimmer {
-  from {
-    background-position: 100% 50%;
-  }
-
-  to {
-    background-position: 0 50%;
-  }
-}
-
-@keyframes crewlet-thinking-enter {
-  from {
-    opacity: 0;
-  }
-
-  to {
-    opacity: 1;
-  }
-}
-
-@media (prefers-reduced-motion: reduce) {
-  .crewlet-thinking__mark [data-motion='turn'] {
-    animation: none;
-  }
-
-  .crewlet-thinking__status {
-    background-image: none;
-    color: var(--color-text-secondary);
-    animation: none;
-  }
-}
-
-/* The system's own ink: a gradient clipped to text is dropped there. */
-@media (forced-colors: active) {
-  .crewlet-thinking__status {
-    background-image: none;
-    color: CanvasText;
-  }
-}

package/dist/{Editor-NZRUKWB4.js → Editor-URGZOK2S.js}

@@ -1,5 +1,5 @@
-import { schema, readMarkdown, writeMarkdown } from './chunk-QH6VYJ3X.js';
 import { richEditorLabels } from './chunk-CSQTDGTS.js';
+import { schema, readMarkdown, writeMarkdown } from './chunk-QH6VYJ3X.js';
 import { safeHref, MARKDOWN_CALLOUT_TONES } from './chunk-BAKPMH3S.js';
 import { Toolbar } from './chunk-NR4CPM4T.js';
 import { FormField, Input } from './chunk-ETSF7SU6.js';