@crewlethq/ui 0.8.0 → 0.8.1

package/dist/Charts/index.js

@@ -1,3 +1,3 @@
-export { ActivityStrip, BarList, ChartTooltip, DATA_COLORS, DATA_COLOR_OTHER, Legend, Sparkline, StackedBar, StackedColumns, TimeSeries, dataColor, niceScale, useChartHover } from '../chunk-6VL4LGWC.js';
+export { ActivityStrip, BarList, ChartTooltip, DATA_COLORS, DATA_COLOR_OTHER, Legend, Sparkline, StackedBar, StackedColumns, TimeSeries, dataColor, niceScale, useChartHover } from '../chunk-4WNNEDKO.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{Charts-THPA5BWV.css → Charts-JUERFLAR.css}

@@ -213,24 +213,67 @@
   gap: calc(var(--spacing-1) * 1.5);
 }
 
+/*
+ * THE BAR STANDS ON THE NAME'S LINE, AND A SPLIT BAR'S KEY ON THE SUB'S. An
+ * item is a grid of two columns, the words' and the plot, and two lines. The
+ * row spans it and lends its parts to it (`subgrid`), and the words' wrapper
+ * lends its own two lines in turn (`display: contents`), so the name and the
+ * plot share the first line and are centred on each other, and the sub and a
+ * split bar's key share the second, the key starting where the bar starts.
+ * Centred on the words' whole column instead, a row with a sub drew its bar,
+ * and the value at its end, between the name and the sub, a few pixels below
+ * the name it belongs to; and the key stood on a third line of its own, under
+ * the sub, where it read as one more bar. A row with neither is one line,
+ * centred in the item's height.
+ *
+ * THE KEY LETS THE POINTER THROUGH. It is outside the row in the markup,
+ * because a row that leads somewhere is a link or a button and holds no list,
+ * so it is drawn over the row's second line rather than inside it, and a
+ * press on it is a press on the row.
+ */
+.crewlet-bar-list--beside .crewlet-bar-list__item {
+  display: grid;
+  grid-template-columns: var(--crewlet-bar-list-label-width) minmax(0, 1fr);
+  grid-template-rows: auto auto;
+  align-content: center;
+  column-gap: var(--spacing-3);
+  min-height: var(--size-control-md);
+}
+
+/* `gap: normal` is what hands a subgrid its parent's gaps: the stacked
+   register's own gap on every row would otherwise move the plot off the
+   column the key stands in. */
 .crewlet-bar-list--beside .crewlet-bar-list__row {
-  flex-direction: row;
+  display: grid;
+  grid-column: 1 / -1;
+  grid-row: 1 / -1;
+  grid-template-columns: subgrid;
+  grid-template-rows: subgrid;
   align-items: center;
-  gap: var(--spacing-3);
-  min-height: var(--size-control-md);
+  gap: normal;
 }
 
 .crewlet-bar-list__names {
-  display: flex;
-  flex: none;
-  flex-direction: column;
-  width: var(--crewlet-bar-list-label-width);
-  min-width: 0;
+  display: contents;
   line-height: var(--font-line-height-tight);
 }
 
+.crewlet-bar-list--beside .crewlet-bar-list__names > .crewlet-bar-list__label {
+  grid-row: 1;
+  grid-column: 1;
+}
+
+.crewlet-bar-list--beside .crewlet-bar-list__plot {
+  grid-row: 1;
+  grid-column: 2;
+}
+
+.crewlet-bar-list--beside .crewlet-bar-list__names > .crewlet-bar-list__sub {
+  grid-row: 2;
+  grid-column: 1;
+}
+
 .crewlet-bar-list--beside .crewlet-bar-list__label {
-  flex: none;
   color: var(--color-text-secondary);
 }
 
@@ -240,7 +283,6 @@
 
 .crewlet-bar-list__plot {
   display: block;
-  flex: 1 1 auto;
   min-width: 0;
 }
 
@@ -296,10 +338,10 @@
 }
 
 /*
- * THE KEY UNDER A SPLIT BAR, at the caption step, starting where the bar
- * starts: under the plot in the BESIDE register, past the words' column and
- * the gap after it, so each name stands under the bar it keys rather than
- * under the row's own name.
+ * THE KEY UNDER A SPLIT BAR, at the caption step. In the BESIDE register it
+ * stands on the row's second line, under the bar it keys (see the item's
+ * grid above), so each name stands under its part rather than under the
+ * row's own name.
  */
 .crewlet-bar-list__key {
   margin-top: var(--spacing-1);
@@ -307,8 +349,11 @@
 }
 
 .crewlet-bar-list--beside .crewlet-bar-list__key {
+  grid-row: 2;
+  grid-column: 2;
+  align-self: center;
   margin-top: 0;
-  padding-inline-start: calc(var(--crewlet-bar-list-label-width) + var(--spacing-3));
+  pointer-events: none;
 }
 
 /* ─── Stacked bar ─────────────────────────────────────────────── */

package/dist/DataTable/index.js

@@ -1,10 +1,10 @@
-export { ALL_ITEMS, CopyableCell, DATA_TABLE_LABELS, DataTable, RowActionsMenu } from '../chunk-QJZ3Y6WW.js';
+export { ALL_ITEMS, CopyableCell, DATA_TABLE_LABELS, DataTable, RowActionsMenu } from '../chunk-KTIEJ5Q5.js';
 import '../chunk-LSB3EHBW.js';
 import '../chunk-EUCC37WY.js';
-import '../chunk-YCTMKKRA.js';
+import '../chunk-BTHX2FS3.js';
 import '../chunk-AV2DXAEL.js';
 import '../chunk-5VNUYO76.js';
-import '../chunk-BTHX2FS3.js';
+import '../chunk-YCTMKKRA.js';
 import '../chunk-PQADV6P6.js';
 import '../chunk-7RPGY3JE.js';
 import '../chunk-R25RGPUB.js';

package/dist/DataView/index.js

@@ -1,18 +1,18 @@
-export { DATA_VIEW_TOOLBAR_LABELS, DataView, DataViewToolbar, FILTER_AXIS_LABELS, FilterAxisBar, FilterAxisChip, applyColumnFilters, applyFilters, blankFilterValue, defaultOperator, filterDefsFromColumns, filterHasValue, filterPredicate, formatFilterValue, operatorOf, tableColumns } from '../chunk-CHG7VT2M.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-A3K56LY6.js';
 import '../chunk-PGRPNDWM.js';
 import '../chunk-HOXGBLEY.js';
 import '../chunk-3CZ7XAVY.js';
-import '../chunk-5I56UXBJ.js';
-import '../chunk-PDUZO35I.js';
-import '../chunk-QJZ3Y6WW.js';
+import '../chunk-SMBKXWML.js';
+import '../chunk-KTIEJ5Q5.js';
 import '../chunk-LSB3EHBW.js';
 import '../chunk-EUCC37WY.js';
-import '../chunk-YCTMKKRA.js';
+import '../chunk-BTHX2FS3.js';
+import '../chunk-5I56UXBJ.js';
+import '../chunk-PDUZO35I.js';
 import '../chunk-GXQ3B46I.js';
 import '../chunk-AV2DXAEL.js';
 import '../chunk-5VNUYO76.js';
-import '../chunk-SMBKXWML.js';
-import '../chunk-BTHX2FS3.js';
+import '../chunk-YCTMKKRA.js';
 import '../chunk-6MU7HNB4.js';
 import '../chunk-ZGX2DP7F.js';
 import '../chunk-BHHIIK3M.js';

package/dist/ListInput/index.js

@@ -1,10 +1,10 @@
-export { ListInput } from '../chunk-6HXH57BL.js';
+export { ListInput } from '../chunk-4JHWMJZI.js';
 import '../chunk-SMBKXWML.js';
 import '../chunk-ZGX2DP7F.js';
 import '../chunk-PQADV6P6.js';
-import '../chunk-RSAQOKH3.js';
 import '../chunk-7RPGY3JE.js';
 import '../chunk-R25RGPUB.js';
 import '../chunk-4FQT6ZAY.js';
+import '../chunk-RSAQOKH3.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/TagsInput/index.js

@@ -1,10 +1,10 @@
-export { TagsInput } from '../chunk-MPXI6FM6.js';
+export { TagsInput } from '../chunk-DBUGBINU.js';
 import '../chunk-LOECRMHA.js';
 import '../chunk-WIATRXEJ.js';
 import '../chunk-6MU7HNB4.js';
-import '../chunk-RSAQOKH3.js';
 import '../chunk-7RPGY3JE.js';
 import '../chunk-R25RGPUB.js';
 import '../chunk-4FQT6ZAY.js';
+import '../chunk-RSAQOKH3.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{chunk-6VL4LGWC.js → chunk-4WNNEDKO.js}

@@ -1,6 +1,6 @@
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';
-import './Charts-THPA5BWV.css';
+import './Charts-JUERFLAR.css';
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useState, useRef, useCallback, useId } from 'react';
 

package/dist/{chunk-CHG7VT2M.js → chunk-A3K56LY6.js}

@@ -1,11 +1,11 @@
 import { Toolbar } from './chunk-PGRPNDWM.js';
 import { PageHeader } from './chunk-HOXGBLEY.js';
 import { RelativeTime } from './chunk-3CZ7XAVY.js';
+import { Kbd } from './chunk-SMBKXWML.js';
+import { DataTable } from './chunk-KTIEJ5Q5.js';
+import { Menu } from './chunk-LSB3EHBW.js';
 import { DateTimePicker } from './chunk-5I56UXBJ.js';
 import { Popover } from './chunk-PDUZO35I.js';
-import { DataTable } from './chunk-QJZ3Y6WW.js';
-import { Menu } from './chunk-LSB3EHBW.js';
-import { Kbd } from './chunk-SMBKXWML.js';
 import { useListbox, useOptionKeys } from './chunk-6MU7HNB4.js';
 import { Input } from './chunk-ZGX2DP7F.js';
 import { Count } from './chunk-BHHIIK3M.js';

package/dist/generated/index.js

@@ -3,7 +3,7 @@ export { Tooltip } from '../chunk-CQY5NTRS.js';
 export { TreeCanvas } from '../chunk-L7THQMFB.js';
 import '../chunk-IJ7QXNIJ.js';
 export { TagGroup } from '../chunk-E6UWRXNM.js';
-export { TagsInput } from '../chunk-MPXI6FM6.js';
+export { TagsInput } from '../chunk-DBUGBINU.js';
 export { Text } from '../chunk-23DHIMJA.js';
 export { DensitySwitcher, ThemeSwitcher } from '../chunk-RHHGLTXJ.js';
 export { ThemeToggle } from '../chunk-ORNOOMVY.js';
@@ -36,46 +36,46 @@ export { StatusDot } from '../chunk-WIATRXEJ.js';
 export { Prose } from '../chunk-JCSA3XVH.js';
 export { Link } from '../chunk-ZPSOF6VL.js';
 export { List, ListItem } from '../chunk-DS2C73RJ.js';
-export { ListInput } from '../chunk-6HXH57BL.js';
+export { ListInput } from '../chunk-4JHWMJZI.js';
 export { DEFAULT_METER_THRESHOLDS, METER_STATES, Meter, meterState, meterStateTone, meterTone, progressTone } from '../chunk-4PZ6FJKW.js';
 export { NewItemsNotice } from '../chunk-PXU6HOZB.js';
 export { useFullscreen } from '../chunk-XDTYBF2F.js';
-export { InlineCode } from '../chunk-NN62JQLR.js';
 export { ImageUpload } from '../chunk-W4GQWFRX.js';
+export { InlineCode } from '../chunk-NN62JQLR.js';
 export { AutoGrid, Inline, Spacer, Stack } from '../chunk-W4ENKCXJ.js';
+export { DIFF_LIST_LABELS, DiffList } from '../chunk-LFHCXZO5.js';
 export { Disclosure } from '../chunk-MICH6QSJ.js';
 export { EmptyState } from '../chunk-RA2ULG6H.js';
+export { EntityChip } from '../chunk-WSOFKOLP.js';
 export { ErrorBoundary } from '../chunk-XX2VQE55.js';
 export { Eyebrow } from '../chunk-RK4XPHVG.js';
 export { FILTER_CHIP_ATTRIBUTE, FilterChip, FilterChipGroup } from '../chunk-5YLON2PW.js';
-export { EntityChip } from '../chunk-WSOFKOLP.js';
+export { CommandPalette } from '../chunk-BXPLX7YU.js';
 export { Container } from '../chunk-QVE4GJAT.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-CHG7VT2M.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-A3K56LY6.js';
 export { Toolbar, ToolbarOverflow, ToolbarWide } from '../chunk-PGRPNDWM.js';
 export { PageHeader } from '../chunk-HOXGBLEY.js';
 export { RelativeTime, currentNow, formatElapsed, formatExact, formatRelative, formatUntil, toISO, toInstant, useNow } from '../chunk-3CZ7XAVY.js';
-export { DEFAULT_DATE_TIME_PICKER_LABELS, DateTimePicker } from '../chunk-5I56UXBJ.js';
-export { Popover } from '../chunk-PDUZO35I.js';
-export { ALL_ITEMS, CopyableCell, DATA_TABLE_LABELS, DataTable, RowActionsMenu } from '../chunk-QJZ3Y6WW.js';
+export { Kbd, isApplePlatform, keyGlyph } from '../chunk-SMBKXWML.js';
+export { ALL_ITEMS, CopyableCell, DATA_TABLE_LABELS, DataTable, RowActionsMenu } from '../chunk-KTIEJ5Q5.js';
 export { Menu } from '../chunk-LSB3EHBW.js';
 export { EMPTY_VALUE, EmptyValue } from '../chunk-EUCC37WY.js';
-export { Checkbox } from '../chunk-YCTMKKRA.js';
+export { ConfirmModal, Modal } from '../chunk-BTHX2FS3.js';
+export { DEFAULT_DATE_TIME_PICKER_LABELS, DateTimePicker } from '../chunk-5I56UXBJ.js';
+export { Popover } from '../chunk-PDUZO35I.js';
 export { DescriptionList, DescriptionListItem } from '../chunk-XN4JBAN3.js';
-export { DIFF_LIST_LABELS, DiffList } from '../chunk-LFHCXZO5.js';
 export { CalendarGrid, compareDays, daysInMonth, sameDay, shiftDay, shiftMonth, today } from '../chunk-GXQ3B46I.js';
 export { Callout } from '../chunk-R6FBDTP3.js';
 export { CANVAS_COMPOSE_CONTEXT, CANVAS_FIT_MAX_ZOOM, CANVAS_FIT_PADDING, CANVAS_FOCUS_CONTEXT, CANVAS_MAX_ZOOM, CANVAS_MIN_ZOOM, CANVAS_PAN_MARGIN, CANVAS_PAN_STEP, CANVAS_REVEAL_PADDING, CANVAS_TAP_SLOP, CANVAS_WHEEL_LINE_PX, CANVAS_WHEEL_ZOOM_PER_PIXEL, CANVAS_ZOOM_CEILING, CANVAS_ZOOM_LIMITS, CANVAS_ZOOM_STEP, Canvas, IDENTITY_VIEW, anchorView, beyondSlop, clampPan, clampZoom, fitView, panBy, pinchView, regionView, revealView, screenRect, toScreen, toWorld, wheelPixels, wheelZoomFactor, zoomAt, zoomLimits } from '../chunk-VE6LD3KM.js';
 import '../chunk-53DVJCVW.js';
 export { Card } from '../chunk-CEOXFO3E.js';
 export { useCardHeaderSlot } from '../chunk-AV2DXAEL.js';
-export { ActivityStrip, BarList, ChartTooltip, DATA_COLORS, DATA_COLOR_OTHER, Legend, Sparkline, StackedBar, StackedColumns, TimeSeries, dataColor, niceScale, useChartHover } from '../chunk-6VL4LGWC.js';
+export { ActivityStrip, BarList, ChartTooltip, DATA_COLORS, DATA_COLOR_OTHER, Legend, Sparkline, StackedBar, StackedColumns, TimeSeries, dataColor, niceScale, useChartHover } from '../chunk-4WNNEDKO.js';
 export { CodeBlock } from '../chunk-MORLKUGM.js';
 export { CopyButton, Copyable } from '../chunk-26SCUACK.js';
 export { useClipboard, writeClipboard } from '../chunk-5VNUYO76.js';
+export { Checkbox } from '../chunk-YCTMKKRA.js';
 export { Combobox } from '../chunk-UYK72NOS.js';
-export { CommandPalette } from '../chunk-BXPLX7YU.js';
-export { Kbd, isApplePlatform, keyGlyph } from '../chunk-SMBKXWML.js';
-export { ConfirmModal, Modal } from '../chunk-BTHX2FS3.js';
 export { TYPE_AHEAD_WINDOW, useListbox, useOptionKeys } from '../chunk-6MU7HNB4.js';
 export { FormField, FormRow, FormSection, Input, InputAffix, Label, ReadOnlyField, Textarea } from '../chunk-ZGX2DP7F.js';
 export { Accordion, AccordionItem } from '../chunk-RIAZM6L3.js';
@@ -83,13 +83,13 @@ export { DisclosureAnatomy } from '../chunk-FZVJDJFN.js';
 export { Count } from '../chunk-BHHIIK3M.js';
 export { HeadingLevelProvider, headingTag, nextHeadingLevel, useHeadingLevel } from '../chunk-PQADV6P6.js';
 export { ADD_PILL_MS, AddPill } from '../chunk-74WGARJE.js';
-export { Announcer, announce, useAnnouncer } from '../chunk-RSAQOKH3.js';
 export { AppShell, AppShellRail, AppShellRailRow, AppShellToggle, AppShellTopbar, useAppShell } from '../chunk-OVLJEVQS.js';
 export { LAYER_GAP, LAYER_REPOSITION_EVENT, LayerHost, outsideBounds, placePopup, useLayerContainer, viewportBounds } from '../chunk-7RPGY3JE.js';
 export { focusables, isComposing, isModalLayerOpen, layerCount, useBodyScrollLock, useModalLayer, usePopupLayer } from '../chunk-R25RGPUB.js';
 export { IconButton } from '../chunk-4FQT6ZAY.js';
-export { AVATAR_CORNER_RATIO, AVATAR_SIZES, Avatar, AvatarStack, avatarCorner, avatarPixels, avatarStackLabel, avatarTint, getInitials } from '../chunk-IA232OTU.js';
+export { Announcer, announce, useAnnouncer } from '../chunk-RSAQOKH3.js';
 export { BrandLockup } from '../chunk-7KBNFFM3.js';
+export { AVATAR_CORNER_RATIO, AVATAR_SIZES, Avatar, AvatarStack, avatarCorner, avatarPixels, avatarStackLabel, avatarTint, getInitials } from '../chunk-IA232OTU.js';
 export { Button, ButtonLink } from '../chunk-OG6CL3EB.js';
 export { VisuallyHidden } from '../chunk-BZFWDIV6.js';
 export { cx } from '../chunk-ODEQTPFM.js';

package/dist/index.js

@@ -3,7 +3,7 @@ export { Tooltip } from './chunk-CQY5NTRS.js';
 export { TreeCanvas } from './chunk-L7THQMFB.js';
 import './chunk-IJ7QXNIJ.js';
 export { TagGroup } from './chunk-E6UWRXNM.js';
-export { TagsInput } from './chunk-MPXI6FM6.js';
+export { TagsInput } from './chunk-DBUGBINU.js';
 export { Text } from './chunk-23DHIMJA.js';
 export { DensitySwitcher, ThemeSwitcher } from './chunk-RHHGLTXJ.js';
 export { ThemeToggle } from './chunk-ORNOOMVY.js';
@@ -36,46 +36,46 @@ export { StatusDot } from './chunk-WIATRXEJ.js';
 export { Prose } from './chunk-JCSA3XVH.js';
 export { Link } from './chunk-ZPSOF6VL.js';
 export { List, ListItem } from './chunk-DS2C73RJ.js';
-export { ListInput } from './chunk-6HXH57BL.js';
+export { ListInput } from './chunk-4JHWMJZI.js';
 export { DEFAULT_METER_THRESHOLDS, METER_STATES, Meter, meterState, meterStateTone, meterTone, progressTone } from './chunk-4PZ6FJKW.js';
 export { NewItemsNotice } from './chunk-PXU6HOZB.js';
 export { useFullscreen } from './chunk-XDTYBF2F.js';
-export { InlineCode } from './chunk-NN62JQLR.js';
 export { ImageUpload } from './chunk-W4GQWFRX.js';
+export { InlineCode } from './chunk-NN62JQLR.js';
 export { AutoGrid, Inline, Spacer, Stack } from './chunk-W4ENKCXJ.js';
+export { DIFF_LIST_LABELS, DiffList } from './chunk-LFHCXZO5.js';
 export { Disclosure } from './chunk-MICH6QSJ.js';
 export { EmptyState } from './chunk-RA2ULG6H.js';
+export { EntityChip } from './chunk-WSOFKOLP.js';
 export { ErrorBoundary } from './chunk-XX2VQE55.js';
 export { Eyebrow } from './chunk-RK4XPHVG.js';
 export { FILTER_CHIP_ATTRIBUTE, FilterChip, FilterChipGroup } from './chunk-5YLON2PW.js';
-export { EntityChip } from './chunk-WSOFKOLP.js';
+export { CommandPalette } from './chunk-BXPLX7YU.js';
 export { Container } from './chunk-QVE4GJAT.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-CHG7VT2M.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-A3K56LY6.js';
 export { Toolbar, ToolbarOverflow, ToolbarWide } from './chunk-PGRPNDWM.js';
 export { PageHeader } from './chunk-HOXGBLEY.js';
 export { RelativeTime, currentNow, formatElapsed, formatExact, formatRelative, formatUntil, toISO, toInstant, useNow } from './chunk-3CZ7XAVY.js';
-export { DEFAULT_DATE_TIME_PICKER_LABELS, DateTimePicker } from './chunk-5I56UXBJ.js';
-export { Popover } from './chunk-PDUZO35I.js';
-export { ALL_ITEMS, CopyableCell, DATA_TABLE_LABELS, DataTable, RowActionsMenu } from './chunk-QJZ3Y6WW.js';
+export { Kbd, isApplePlatform, keyGlyph } from './chunk-SMBKXWML.js';
+export { ALL_ITEMS, CopyableCell, DATA_TABLE_LABELS, DataTable, RowActionsMenu } from './chunk-KTIEJ5Q5.js';
 export { Menu } from './chunk-LSB3EHBW.js';
 export { EMPTY_VALUE, EmptyValue } from './chunk-EUCC37WY.js';
-export { Checkbox } from './chunk-YCTMKKRA.js';
+export { ConfirmModal, Modal } from './chunk-BTHX2FS3.js';
+export { DEFAULT_DATE_TIME_PICKER_LABELS, DateTimePicker } from './chunk-5I56UXBJ.js';
+export { Popover } from './chunk-PDUZO35I.js';
 export { DescriptionList, DescriptionListItem } from './chunk-XN4JBAN3.js';
-export { DIFF_LIST_LABELS, DiffList } from './chunk-LFHCXZO5.js';
 export { CalendarGrid, compareDays, daysInMonth, sameDay, shiftDay, shiftMonth, today } from './chunk-GXQ3B46I.js';
 export { Callout } from './chunk-R6FBDTP3.js';
 export { CANVAS_COMPOSE_CONTEXT, CANVAS_FIT_MAX_ZOOM, CANVAS_FIT_PADDING, CANVAS_FOCUS_CONTEXT, CANVAS_MAX_ZOOM, CANVAS_MIN_ZOOM, CANVAS_PAN_MARGIN, CANVAS_PAN_STEP, CANVAS_REVEAL_PADDING, CANVAS_TAP_SLOP, CANVAS_WHEEL_LINE_PX, CANVAS_WHEEL_ZOOM_PER_PIXEL, CANVAS_ZOOM_CEILING, CANVAS_ZOOM_LIMITS, CANVAS_ZOOM_STEP, Canvas, IDENTITY_VIEW, anchorView, beyondSlop, clampPan, clampZoom, fitView, panBy, pinchView, regionView, revealView, screenRect, toScreen, toWorld, wheelPixels, wheelZoomFactor, zoomAt, zoomLimits } from './chunk-VE6LD3KM.js';
 import './chunk-53DVJCVW.js';
 export { Card } from './chunk-CEOXFO3E.js';
 export { useCardHeaderSlot } from './chunk-AV2DXAEL.js';
-export { ActivityStrip, BarList, ChartTooltip, DATA_COLORS, DATA_COLOR_OTHER, Legend, Sparkline, StackedBar, StackedColumns, TimeSeries, dataColor, niceScale, useChartHover } from './chunk-6VL4LGWC.js';
+export { ActivityStrip, BarList, ChartTooltip, DATA_COLORS, DATA_COLOR_OTHER, Legend, Sparkline, StackedBar, StackedColumns, TimeSeries, dataColor, niceScale, useChartHover } from './chunk-4WNNEDKO.js';
 export { CodeBlock } from './chunk-MORLKUGM.js';
 export { CopyButton, Copyable } from './chunk-26SCUACK.js';
 export { useClipboard, writeClipboard } from './chunk-5VNUYO76.js';
+export { Checkbox } from './chunk-YCTMKKRA.js';
 export { Combobox } from './chunk-UYK72NOS.js';
-export { CommandPalette } from './chunk-BXPLX7YU.js';
-export { Kbd, isApplePlatform, keyGlyph } from './chunk-SMBKXWML.js';
-export { ConfirmModal, Modal } from './chunk-BTHX2FS3.js';
 export { TYPE_AHEAD_WINDOW, useListbox, useOptionKeys } from './chunk-6MU7HNB4.js';
 export { FormField, FormRow, FormSection, Input, InputAffix, Label, ReadOnlyField, Textarea } from './chunk-ZGX2DP7F.js';
 export { Accordion, AccordionItem } from './chunk-RIAZM6L3.js';
@@ -83,13 +83,13 @@ export { DisclosureAnatomy } from './chunk-FZVJDJFN.js';
 export { Count } from './chunk-BHHIIK3M.js';
 export { HeadingLevelProvider, headingTag, nextHeadingLevel, useHeadingLevel } from './chunk-PQADV6P6.js';
 export { ADD_PILL_MS, AddPill } from './chunk-74WGARJE.js';
-export { Announcer, announce, useAnnouncer } from './chunk-RSAQOKH3.js';
 export { AppShell, AppShellRail, AppShellRailRow, AppShellToggle, AppShellTopbar, useAppShell } from './chunk-OVLJEVQS.js';
 export { LAYER_GAP, LAYER_REPOSITION_EVENT, LayerHost, outsideBounds, placePopup, useLayerContainer, viewportBounds } from './chunk-7RPGY3JE.js';
 export { focusables, isComposing, isModalLayerOpen, layerCount, useBodyScrollLock, useModalLayer, usePopupLayer } from './chunk-R25RGPUB.js';
 export { IconButton } from './chunk-4FQT6ZAY.js';
-export { AVATAR_CORNER_RATIO, AVATAR_SIZES, Avatar, AvatarStack, avatarCorner, avatarPixels, avatarStackLabel, avatarTint, getInitials } from './chunk-IA232OTU.js';
+export { Announcer, announce, useAnnouncer } from './chunk-RSAQOKH3.js';
 export { BrandLockup } from './chunk-7KBNFFM3.js';
+export { AVATAR_CORNER_RATIO, AVATAR_SIZES, Avatar, AvatarStack, avatarCorner, avatarPixels, avatarStackLabel, avatarTint, getInitials } from './chunk-IA232OTU.js';
 export { Button, ButtonLink } from './chunk-OG6CL3EB.js';
 export { VisuallyHidden } from './chunk-BZFWDIV6.js';
 export { cx } from './chunk-ODEQTPFM.js';

package/dist/styles.css

@@ -2877,7 +2877,7 @@
 }
 
 
-/* Charts-THPA5BWV.css */
+/* Charts-JUERFLAR.css */
 /* The chart kit: a legend, a ranked bar list, a stacked bar, stacked
    columns, an activity strip, a time series and the reading layer they share. Hand-drawn rather than a charting library, for one reason that
    decides it: every mark here reads tokens, in two themes, at the contrast
@@ -3093,24 +3093,67 @@
   gap: calc(var(--spacing-1) * 1.5);
 }
 
+/*
+ * THE BAR STANDS ON THE NAME'S LINE, AND A SPLIT BAR'S KEY ON THE SUB'S. An
+ * item is a grid of two columns, the words' and the plot, and two lines. The
+ * row spans it and lends its parts to it (`subgrid`), and the words' wrapper
+ * lends its own two lines in turn (`display: contents`), so the name and the
+ * plot share the first line and are centred on each other, and the sub and a
+ * split bar's key share the second, the key starting where the bar starts.
+ * Centred on the words' whole column instead, a row with a sub drew its bar,
+ * and the value at its end, between the name and the sub, a few pixels below
+ * the name it belongs to; and the key stood on a third line of its own, under
+ * the sub, where it read as one more bar. A row with neither is one line,
+ * centred in the item's height.
+ *
+ * THE KEY LETS THE POINTER THROUGH. It is outside the row in the markup,
+ * because a row that leads somewhere is a link or a button and holds no list,
+ * so it is drawn over the row's second line rather than inside it, and a
+ * press on it is a press on the row.
+ */
+.crewlet-bar-list--beside .crewlet-bar-list__item {
+  display: grid;
+  grid-template-columns: var(--crewlet-bar-list-label-width) minmax(0, 1fr);
+  grid-template-rows: auto auto;
+  align-content: center;
+  column-gap: var(--spacing-3);
+  min-height: var(--size-control-md);
+}
+
+/* `gap: normal` is what hands a subgrid its parent's gaps: the stacked
+   register's own gap on every row would otherwise move the plot off the
+   column the key stands in. */
 .crewlet-bar-list--beside .crewlet-bar-list__row {
-  flex-direction: row;
+  display: grid;
+  grid-column: 1 / -1;
+  grid-row: 1 / -1;
+  grid-template-columns: subgrid;
+  grid-template-rows: subgrid;
   align-items: center;
-  gap: var(--spacing-3);
-  min-height: var(--size-control-md);
+  gap: normal;
 }
 
 .crewlet-bar-list__names {
-  display: flex;
-  flex: none;
-  flex-direction: column;
-  width: var(--crewlet-bar-list-label-width);
-  min-width: 0;
+  display: contents;
   line-height: var(--font-line-height-tight);
 }
 
+.crewlet-bar-list--beside .crewlet-bar-list__names > .crewlet-bar-list__label {
+  grid-row: 1;
+  grid-column: 1;
+}
+
+.crewlet-bar-list--beside .crewlet-bar-list__plot {
+  grid-row: 1;
+  grid-column: 2;
+}
+
+.crewlet-bar-list--beside .crewlet-bar-list__names > .crewlet-bar-list__sub {
+  grid-row: 2;
+  grid-column: 1;
+}
+
 .crewlet-bar-list--beside .crewlet-bar-list__label {
-  flex: none;
   color: var(--color-text-secondary);
 }
 
@@ -3120,7 +3163,6 @@
 
 .crewlet-bar-list__plot {
   display: block;
-  flex: 1 1 auto;
   min-width: 0;
 }
 
@@ -3176,10 +3218,10 @@
 }
 
 /*
- * THE KEY UNDER A SPLIT BAR, at the caption step, starting where the bar
- * starts: under the plot in the BESIDE register, past the words' column and
- * the gap after it, so each name stands under the bar it keys rather than
- * under the row's own name.
+ * THE KEY UNDER A SPLIT BAR, at the caption step. In the BESIDE register it
+ * stands on the row's second line, under the bar it keys (see the item's
+ * grid above), so each name stands under its part rather than under the
+ * row's own name.
  */
 .crewlet-bar-list__key {
   margin-top: var(--spacing-1);
@@ -3187,8 +3229,11 @@
 }
 
 .crewlet-bar-list--beside .crewlet-bar-list__key {
+  grid-row: 2;
+  grid-column: 2;
+  align-self: center;
   margin-top: 0;
-  padding-inline-start: calc(var(--crewlet-bar-list-label-width) + var(--spacing-3));
+  pointer-events: none;
 }
 
 /* ─── Stacked bar ─────────────────────────────────────────────── */

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@crewlethq/ui",
-  "version": "0.8.0",
+  "version": "0.8.1",
   "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.8.0",
-    "@crewlethq/tokens": "0.8.0"
+    "@crewlethq/icons": "0.8.1",
+    "@crewlethq/tokens": "0.8.1"
   },
   "peerDependencies": {
     "react": ">=18",

package/dist/{chunk-6HXH57BL.js → chunk-4JHWMJZI.js}

@@ -1,8 +1,8 @@
 import { Kbd } from './chunk-SMBKXWML.js';
 import { FormField, Textarea, Input } from './chunk-ZGX2DP7F.js';
-import { announce } from './chunk-RSAQOKH3.js';
 import { isComposing } from './chunk-R25RGPUB.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';
+import { announce } from './chunk-RSAQOKH3.js';
 import './ListInput-O7LJKOIG.css';
 import { useState, useRef, useLayoutEffect } from 'react';
 import { ArrowUpGlyph, ArrowDownGlyph, XGlyph, PlusGlyph } from '@crewlethq/icons/glyphs';

package/dist/{chunk-MPXI6FM6.js → chunk-DBUGBINU.js}

@@ -1,8 +1,8 @@
 import { Tag } from './chunk-LOECRMHA.js';
 import { useListbox } from './chunk-6MU7HNB4.js';
-import { announce } from './chunk-RSAQOKH3.js';
 import { isComposing } from './chunk-R25RGPUB.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';
+import { announce } from './chunk-RSAQOKH3.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import './TagsInput-P2HS5QL4.css';
 import { forwardRef, useState, useRef, useId, useImperativeHandle, useEffect, useMemo, useLayoutEffect } from 'react';

package/dist/{chunk-QJZ3Y6WW.js → chunk-KTIEJ5Q5.js}

@@ -1,9 +1,9 @@
 import { Menu } from './chunk-LSB3EHBW.js';
 import { EmptyValue } from './chunk-EUCC37WY.js';
-import { Checkbox } from './chunk-YCTMKKRA.js';
+import { Modal } from './chunk-BTHX2FS3.js';
 import { useCardHeaderSlot } from './chunk-AV2DXAEL.js';
 import { useClipboard } from './chunk-5VNUYO76.js';
-import { Modal } from './chunk-BTHX2FS3.js';
+import { Checkbox } from './chunk-YCTMKKRA.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';
 import { Button } from './chunk-OG6CL3EB.js';
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';