@crewlethq/ui 0.37.0 → 0.38.0

package/dist/{ChoiceList-EA2W6MOS.css → ChoiceList-KFYFAECP.css}

@@ -8,8 +8,10 @@
 .crewlet-choice-list {
   /* The platform's radio, sized here so a panel can line up with the text beside it. */
   --crewlet-choice-list-radio-size: 13px;
+  /* The step between two answers. Every row's pointer target reaches half of it. */
+  --crewlet-choice-list-gap: var(--spacing-1);
   display: grid;
-  gap: var(--spacing-1);
+  gap: var(--crewlet-choice-list-gap);
   padding: var(--spacing-1);
   border: 1px solid var(--color-border-strong);
   border-radius: var(--radius-md);
@@ -22,21 +24,24 @@
 
 .crewlet-choice-list__group {
   display: grid;
-  gap: var(--spacing-1);
+  gap: var(--crewlet-choice-list-gap);
 }
 
 .crewlet-choice-list__item {
   display: grid;
-  gap: var(--spacing-1);
+  gap: var(--crewlet-choice-list-gap);
 }
 
 /* The "Something else" a list ends with, set apart by a dashed rule. */
 .crewlet-choice-list__item.is-separated {
-  padding-top: var(--spacing-1);
+  --crewlet-choice-list-rule-pad: var(--spacing-1);
+  padding-top: var(--crewlet-choice-list-rule-pad);
   border-top: 1px dashed var(--color-border-strong);
 }
 
 .crewlet-choice-list__row {
+  /* Half the step to each neighbour, so the targets meet (HitArea.css). */
+  --crewlet-hit-area-block: calc(var(--crewlet-choice-list-gap) / 2);
   display: grid;
   grid-template-columns: auto minmax(0, 1fr) auto;
   align-items: start;
@@ -47,6 +52,23 @@
   transition: background-color var(--motion-duration-fast) var(--motion-easing-default);
 }
 
+/*
+ * THE ANSWER AFTER THE RULE reaches up across it, so the pointer leaving the
+ * row above lands on this one rather than on the rule: the dashed line sets
+ * the answer apart for the eye, and is no gap for the hand.
+ */
+.crewlet-choice-list__item.is-separated > .crewlet-choice-list__row {
+  --crewlet-hit-area-block-start: calc(var(--crewlet-choice-list-gap) / 2 + var(--crewlet-choice-list-rule-pad) + 1px);
+}
+
+/*
+ * A ROW WITH ITS PANEL OPEN reaches nothing downward: the panel is part of the
+ * answer and holds controls of its own, which the row must not cover.
+ */
+.crewlet-choice-list__item:has(> .crewlet-choice-list__panel) > .crewlet-choice-list__row {
+  --crewlet-hit-area-block-end: 0px;
+}
+
 /* A choice with a picture: the radio, the picture, the words, the tag. The
    picture centres on the label and its detail together. */
 .crewlet-choice-list__row.has-media {

package/dist/Combobox/index.d.ts

@@ -1,3 +1,4 @@
+import '../HitArea/HitArea.css';
 import './Combobox.css';
 export { Combobox } from './Combobox.js';
 export type { ComboboxListRender, ComboboxOption, ComboboxProps } from './Combobox.js';

package/dist/Combobox/index.js

@@ -1,9 +1,10 @@
-export { Combobox } from '../chunk-PPFX6GRK.js';
-import '../chunk-F73MC7EZ.js';
-import '../chunk-IUYUS2SO.js';
-import '../chunk-YSGLEHND.js';
+export { Combobox } from '../chunk-EAEJ7CDM.js';
+import '../chunk-7KHM2FZH.js';
+import '../chunk-TYONQSOK.js';
 import '../chunk-PQADV6P6.js';
-import '../chunk-R25RGPUB.js';
+import '../chunk-H5XTJ7GJ.js';
+import '../chunk-2YTOOH3A.js';
 import '../chunk-4FQT6ZAY.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{Combobox-4FUVYIE7.css → Combobox-YDONYDTM.css}

@@ -24,9 +24,10 @@
   overflow-y: auto;
   overscroll-behavior: contain;
   padding: var(--spacing-1);
+  --crewlet-listbox-gap: 1px;
   display: flex;
   flex-direction: column;
-  gap: 1px;
+  gap: var(--crewlet-listbox-gap);
   /*
    * OPAQUE, and the product's own panel surface: a translucent list over a
    * form puts two sets of words in the same place, and the words underneath

package/dist/CommandPalette/index.d.ts

@@ -1,3 +1,4 @@
+import '../HitArea/HitArea.css';
 import './CommandPalette.css';
 export { CommandPalette } from './CommandPalette.js';
 export type { CommandPaletteGroup, CommandPaletteItem, CommandPaletteProps, CommandPaletteScope, CommandPaletteScopeProps, } from './CommandPalette.js';

package/dist/CommandPalette/index.js

@@ -1,14 +1,15 @@
-export { CommandPalette } from '../chunk-N5SKHIAP.js';
-import '../chunk-XEGZHHRH.js';
-import '../chunk-F73MC7EZ.js';
-import '../chunk-IUYUS2SO.js';
-import '../chunk-YSGLEHND.js';
+export { CommandPalette } from '../chunk-PAQXOP2M.js';
+import '../chunk-SVGARBDY.js';
+import '../chunk-7KHM2FZH.js';
 import '../chunk-SMBKXWML.js';
+import '../chunk-TYONQSOK.js';
 import '../chunk-BHHIIK3M.js';
 import '../chunk-PQADV6P6.js';
 import '../chunk-OMV5W53A.js';
-import '../chunk-R25RGPUB.js';
+import '../chunk-H5XTJ7GJ.js';
+import '../chunk-2YTOOH3A.js';
 import '../chunk-OG6CL3EB.js';
 import '../chunk-4FQT6ZAY.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{CommandPalette-7CFGVBND.css → CommandPalette-TOZYLWLE.css}

@@ -163,10 +163,11 @@
  * draw and no slider to measure, and the bar is each tab's own edge.
  */
 .crewlet-palette__scopes {
+  --crewlet-palette-scope-gap: var(--spacing-4);
   flex-shrink: 0;
   display: flex;
   align-items: stretch;
-  gap: var(--spacing-4);
+  gap: var(--crewlet-palette-scope-gap);
   min-height: var(--size-row-md);
   padding-inline: var(--spacing-4);
   border-bottom: 1px solid var(--color-border-default);
@@ -195,6 +196,9 @@
   font-weight: var(--font-weight-medium);
   white-space: nowrap;
   cursor: pointer;
+  /* Half the gap to each neighbour, so the scopes' targets meet (HitArea.css).
+     The row's own inline padding holds the reach at either end. */
+  --crewlet-hit-area-inline: calc(var(--crewlet-palette-scope-gap) / 2);
 }
 
 .crewlet-palette__scope:hover,

package/dist/CommentThread/index.js

@@ -1,17 +1,17 @@
-export { COMMENT_THREAD_LABELS, CommentThread } from '../chunk-44WJLPQS.js';
-import '../chunk-P6WFZDKS.js';
+export { COMMENT_THREAD_LABELS, CommentThread } from '../chunk-PT6WKXKW.js';
 import '../chunk-CI3VPIJN.js';
 import '../chunk-3CZ7XAVY.js';
 import '../chunk-EUCC37WY.js';
 import '../chunk-5AQBPHZD.js';
 import '../chunk-PZKHBB7D.js';
-import '../chunk-RH2NCQBZ.js';
-import '../chunk-IUYUS2SO.js';
-import '../chunk-YSGLEHND.js';
+import '../chunk-PWG3VHRQ.js';
+import '../chunk-ETVEGR2Y.js';
 import '../chunk-SMBKXWML.js';
+import '../chunk-TYONQSOK.js';
 import '../chunk-BHHIIK3M.js';
 import '../chunk-PQADV6P6.js';
 import '../chunk-OG6CL3EB.js';
 import '../chunk-4FQT6ZAY.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/Composer/index.js

@@ -1,8 +1,8 @@
-export { COMPOSER_COUNTER_AT, Composer } from '../chunk-RH2NCQBZ.js';
-import '../chunk-IUYUS2SO.js';
-import '../chunk-YSGLEHND.js';
+export { COMPOSER_COUNTER_AT, Composer } from '../chunk-ETVEGR2Y.js';
 import '../chunk-SMBKXWML.js';
+import '../chunk-TYONQSOK.js';
 import '../chunk-PQADV6P6.js';
 import '../chunk-4FQT6ZAY.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{Composer-PXITWNEK.css → Composer-TXULCPPV.css}

@@ -27,7 +27,7 @@
   outline-offset: -1px;
 }
 
-:root[data-crewlet-focus='pointer'] .crewlet-composer:has(.crewlet-composer__field:focus-visible) {
+:where(:root[data-crewlet-focus='pointer']) .crewlet-composer:has(.crewlet-composer__field:focus-visible) {
   outline-width: 1px;
   outline-color: var(--color-border-selected);
 }

package/dist/ConfirmField/index.js

@@ -1,8 +1,8 @@
-export { ConfirmField, confirmMatches } from '../chunk-KJW2AS57.js';
+export { ConfirmField, confirmMatches } from '../chunk-PEUGPAKH.js';
 import '../chunk-5CLW2CXT.js';
-import '../chunk-IUYUS2SO.js';
-import '../chunk-YSGLEHND.js';
+import '../chunk-TYONQSOK.js';
 import '../chunk-PQADV6P6.js';
 import '../chunk-4FQT6ZAY.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/DataTable/index.js

@@ -1,17 +1,17 @@
-export { ALL_ITEMS, CopyableCell, DATA_TABLE_LABELS, DataTable, RowActionsMenu } from '../chunk-JML75PGJ.js';
+export { ALL_ITEMS, CopyableCell, DATA_TABLE_LABELS, DataTable, RowActionsMenu } from '../chunk-A23KDROH.js';
 import '../chunk-STJ7QBC3.js';
 import '../chunk-DTIW4CHZ.js';
-import '../chunk-XEGZHHRH.js';
-import '../chunk-PJIPUEJ3.js';
+import '../chunk-SVGARBDY.js';
+import '../chunk-AXS6MBNH.js';
 import '../chunk-EUCC37WY.js';
 import '../chunk-AV2DXAEL.js';
-import '../chunk-IUYUS2SO.js';
-import '../chunk-YSGLEHND.js';
+import '../chunk-TYONQSOK.js';
 import '../chunk-PQADV6P6.js';
-import '../chunk-BUVCV3WI.js';
+import '../chunk-D6FEHY5G.js';
 import '../chunk-OMV5W53A.js';
-import '../chunk-R25RGPUB.js';
+import '../chunk-H5XTJ7GJ.js';
 import '../chunk-OG6CL3EB.js';
 import '../chunk-4FQT6ZAY.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/DataView/index.js

@@ -1,27 +1,27 @@
-export { DATA_VIEW_TOOLBAR_LABELS, DataView, DataViewToolbar, FILTER_AXIS_LABELS, FilterAxisBar, FilterAxisChip, applyColumnFilters, applyFilters, blankFilterValue, defaultOperator, filterDefsFromColumns, filterHasValue, filterPredicate, formatFilterValue, operatorOf, tableColumns } from '../chunk-GS7ZTHPF.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-YQG4PZGC.js';
 import '../chunk-HOXGBLEY.js';
-import '../chunk-JML75PGJ.js';
-import '../chunk-L4WZSVMT.js';
+import '../chunk-A23KDROH.js';
+import '../chunk-UB6MLXUL.js';
 import '../chunk-STJ7QBC3.js';
 import '../chunk-DTIW4CHZ.js';
-import '../chunk-XEGZHHRH.js';
-import '../chunk-F73MC7EZ.js';
+import '../chunk-SVGARBDY.js';
+import '../chunk-7KHM2FZH.js';
+import '../chunk-KHJIEPZV.js';
 import '../chunk-GXQ3B46I.js';
-import '../chunk-PGRPNDWM.js';
-import '../chunk-K3IJQNB7.js';
-import '../chunk-PJIPUEJ3.js';
+import '../chunk-NR4CPM4T.js';
+import '../chunk-AXS6MBNH.js';
 import '../chunk-3CZ7XAVY.js';
 import '../chunk-EUCC37WY.js';
 import '../chunk-AV2DXAEL.js';
-import '../chunk-IUYUS2SO.js';
-import '../chunk-YSGLEHND.js';
 import '../chunk-SMBKXWML.js';
+import '../chunk-TYONQSOK.js';
 import '../chunk-BHHIIK3M.js';
 import '../chunk-PQADV6P6.js';
-import '../chunk-BUVCV3WI.js';
+import '../chunk-D6FEHY5G.js';
 import '../chunk-OMV5W53A.js';
-import '../chunk-R25RGPUB.js';
+import '../chunk-H5XTJ7GJ.js';
 import '../chunk-OG6CL3EB.js';
 import '../chunk-4FQT6ZAY.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/DatasetSource/index.d.ts

@@ -1,3 +1,4 @@
+import '../HitArea/HitArea.css';
 import './DatasetSource.css';
 export { DATASET_SOURCE_KINDS, DatasetSource, DatasetSourceList } from './DatasetSource.js';
 export type { DatasetSourceKind, DatasetSourceLabels, DatasetSourceListProps, DatasetSourceProps, } from './DatasetSource.js';

package/dist/DatasetSource/index.js

@@ -1,7 +1,8 @@
-export { DATASET_SOURCE_KINDS, DatasetSource, DatasetSourceList } from '../chunk-GRYZ5EP3.js';
-import '../chunk-GFV4LJHH.js';
+export { DATASET_SOURCE_KINDS, DatasetSource, DatasetSourceList } from '../chunk-IPWU6ERC.js';
+import '../chunk-KYIAFNU7.js';
 import '../chunk-WIATRXEJ.js';
 import '../chunk-3CZ7XAVY.js';
 import '../chunk-EUCC37WY.js';
+import '../chunk-2YTOOH3A.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{DatasetSource-SMGX4PS5.css → DatasetSource-FFKTD3ZU.css}

@@ -33,6 +33,20 @@
 
 button.crewlet-dataset-source__summary {
   cursor: pointer;
+  /* Half the list's gap to each neighbour, so the entries' targets meet
+     (HitArea.css), across the entry's 1px boundary and the summary's own. */
+  --crewlet-hit-area-block: calc(var(--crewlet-dataset-source-list-gap, 0px) / 2 + 2px);
+}
+
+/* The list has no padding, so its first and last entries reach nothing past
+   it; and an open entry's preview holds controls the summary must not cover. */
+.crewlet-dataset-source-list__item:first-child button.crewlet-dataset-source__summary {
+  --crewlet-hit-area-block-start: 0px;
+}
+
+.crewlet-dataset-source-list__item:last-child button.crewlet-dataset-source__summary,
+.crewlet-dataset-source--open > button.crewlet-dataset-source__summary {
+  --crewlet-hit-area-block-end: 0px;
 }
 
 button.crewlet-dataset-source__summary:hover {
@@ -158,9 +172,10 @@ button.crewlet-dataset-source__summary:focus-visible {
 }
 
 .crewlet-dataset-source-list {
+  --crewlet-dataset-source-list-gap: var(--spacing-1);
   display: flex;
   flex-direction: column;
-  gap: var(--spacing-1);
+  gap: var(--crewlet-dataset-source-list-gap);
   margin: 0;
   padding: 0;
   list-style: none;

package/dist/DateTimePicker/index.js

@@ -1,10 +1,10 @@
-export { DEFAULT_DATE_TIME_PICKER_LABELS, DateTimePicker } from '../chunk-L4WZSVMT.js';
+export { DEFAULT_DATE_TIME_PICKER_LABELS, DateTimePicker } from '../chunk-UB6MLXUL.js';
+import '../chunk-KHJIEPZV.js';
 import '../chunk-GXQ3B46I.js';
-import '../chunk-K3IJQNB7.js';
-import '../chunk-YSGLEHND.js';
 import '../chunk-OMV5W53A.js';
-import '../chunk-R25RGPUB.js';
+import '../chunk-H5XTJ7GJ.js';
 import '../chunk-OG6CL3EB.js';
 import '../chunk-4FQT6ZAY.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{DateTimePicker-2IVTKFV2.css → DateTimePicker-3A7JIIVL.css}

@@ -56,8 +56,8 @@
 }
 
 /* Narrowed and tinted for a pointer, as the text box's ring is. See Input.css. */
-:root[data-crewlet-focus='pointer'] .crewlet-datetime:focus-visible,
-:root[data-crewlet-focus='pointer'] .crewlet-datetime.is-open {
+:where(:root[data-crewlet-focus='pointer']) .crewlet-datetime:focus-visible,
+:where(:root[data-crewlet-focus='pointer']) .crewlet-datetime.is-open {
   outline-width: 1px;
   outline-color: var(--color-border-selected);
 }
@@ -189,7 +189,7 @@ svg.crewlet-datetime__chevron {
 }
 
 /* Narrowed and tinted for a pointer, as the text box's ring is. See Input.css. */
-:root[data-crewlet-focus='pointer'] .crewlet-datetime__time-input:focus-visible {
+:where(:root[data-crewlet-focus='pointer']) .crewlet-datetime__time-input:focus-visible {
   outline-width: 1px;
   outline-color: var(--color-border-selected);
 }

package/dist/DescriptionList/DescriptionList.d.ts

@@ -12,6 +12,17 @@ export interface DescriptionListProps extends HTMLAttributes<HTMLDListElement> {
      * space after "Up" and stacks a list the panel had room to lay side by side.
      */
     fit?: boolean | undefined;
+    /**
+     * The term column's width, as a CSS track: `12rem`, or
+     * `minmax(120px, 14rem)`. For lists that have to line up with each other,
+     * stacked cards of settings on one page, where each list sizing the column
+     * to its own longest term starts its values somewhere else. The same track
+     * can be set once for a whole page as `--crewlet-description-list-term`,
+     * which every list under it inherits. Ignored with `fit`, whose column is
+     * its own longest term by definition, and under the narrow step, where a
+     * term stands over its detail.
+     */
+    termWidth?: string | undefined;
     /**
      * The pairs. Given as tuples so a caller can build them from a record
      * without inventing a key for each one; `DescriptionList.Item` children are
@@ -32,7 +43,7 @@ export interface DescriptionListProps extends HTMLAttributes<HTMLDListElement> {
  * Each pair is wrapped in a `div`, which HTML allows inside a `dl` and which
  * is what lets one pair be one grid row.
  */
-export declare function DescriptionList({ dense, fit, items, className, children, ...rest }: DescriptionListProps): import("react").JSX.Element;
+export declare function DescriptionList({ dense, fit, termWidth, items, className, style, children, ...rest }: DescriptionListProps): import("react").JSX.Element;
 export declare namespace DescriptionList {
     var Item: typeof DescriptionListItem;
 }

package/dist/DescriptionList/index.js

@@ -1,2 +1,2 @@
-export { DescriptionList, DescriptionListItem } from '../chunk-F2XSYBKH.js';
+export { DescriptionList, DescriptionListItem } from '../chunk-MFS6F2P7.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{DescriptionList-IXMRCSMK.css → DescriptionList-DEZISDLQ.css}

@@ -4,11 +4,18 @@
  * The term track is `minmax(120px, max-content)`: wide enough that short terms
  * line up with each other, and free to grow for a long one rather than
  * wrapping it into two lines beside a one-word value.
+ *
+ * ONE LIST'S TRACK IS ITS OWN, which is wrong for a page of them. Four cards
+ * of limits stacked on one page each sized the column to their own longest
+ * term, so their values started at four different places and the cards did
+ * not read as one table. `--crewlet-description-list-term` names the track
+ * instead, and it is inherited: set once on the page (or passed to each list
+ * as `termWidth`), every list under it shares one column.
  */
 
 .crewlet-description-list {
   display: grid;
-  grid-template-columns: minmax(120px, max-content) 1fr;
+  grid-template-columns: var(--crewlet-description-list-term, minmax(120px, max-content)) 1fr;
   gap: var(--spacing-2) var(--spacing-4);
   margin: 0;
   font-size: var(--font-size-compact);

package/dist/Disclosure/index.js

@@ -1,4 +1,4 @@
-export { Disclosure } from '../chunk-MICH6QSJ.js';
+export { Disclosure } from '../chunk-OGXHZHRX.js';
 export { DisclosureAnatomy } from '../chunk-FZVJDJFN.js';
 import '../chunk-BHHIIK3M.js';
 import '../chunk-PQADV6P6.js';

package/dist/{Disclosure-VKBJJIZ7.css → Disclosure-P4FH3C35.css}

@@ -115,9 +115,35 @@
   font-variant-ligatures: none;
 }
 
-/* A fact inside the button: quieter than the title it belongs to. */
+/*
+ * A fact inside the button: quieter than the title it belongs to, and the
+ * first thing to give up room when the row runs short.
+ *
+ * IT USED TO TAKE NONE. `flex: none` held a fact at its full width while the
+ * title, which may shrink, was the only thing that could, so a long fact (a
+ * log's replay mode, generation, range and size, beside a status badge in the
+ * actions) took the whole trigger: the title shrank to nothing, so a row no
+ * longer said which log it was, and the fact ran out of the button and under
+ * the badge beside it.
+ *
+ * A HUNDRED TO THE TITLE'S ONE, as a card's subtitle gives way to its title:
+ * two items that may shrink give up space in proportion to their widths, so
+ * at that ratio the fact absorbs effectively all of it, and ends in an
+ * ellipsis, before the title gives up a pixel. The fact is still the button's
+ * name in full; only its drawing is cut.
+ *
+ * NEVER TO NOTHING. The floor is one glyph wide, because a fact is often a
+ * mark (a failed call's glyph beside a tool's name), and a mark that shrank
+ * to nothing would say nothing at all. A long fact keeps an ellipsis there,
+ * which says a fact was cut. Once the fact is at its floor the title shrinks
+ * and ends in its own ellipsis.
+ */
 .crewlet-disclosure__meta {
-  flex: none;
+  flex: 0 100 auto;
+  min-width: 1.5em;
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
   color: var(--color-text-tertiary);
   font-size: var(--font-size-xs);
 }

package/dist/DocTabsEditor/index.js

@@ -1,13 +1,13 @@
-export { DOC_TABS_EDITOR_LABELS, DocTabsEditor } from '../chunk-UWGUKMBK.js';
+export { DOC_TABS_EDITOR_LABELS, DocTabsEditor } from '../chunk-SYBYFQTY.js';
 import '../chunk-XJ2QEBMM.js';
-import '../chunk-IUYUS2SO.js';
-import '../chunk-YSGLEHND.js';
+import '../chunk-TYONQSOK.js';
 import '../chunk-PQADV6P6.js';
-import '../chunk-BUVCV3WI.js';
+import '../chunk-RSAQOKH3.js';
+import '../chunk-D6FEHY5G.js';
 import '../chunk-OMV5W53A.js';
-import '../chunk-R25RGPUB.js';
+import '../chunk-H5XTJ7GJ.js';
 import '../chunk-OG6CL3EB.js';
-import '../chunk-RSAQOKH3.js';
 import '../chunk-4FQT6ZAY.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/Document/index.js

@@ -1,3 +1,3 @@
-export { Document, DocumentTitle, DocumentTitleField } from '../chunk-P6WFZDKS.js';
-import '../chunk-YSGLEHND.js';
+export { Document, DocumentTitle, DocumentTitleField } from '../chunk-PWG3VHRQ.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-ODEQTPFM.js';

package/dist/{Document-YFWTWXJP.css → Document-TZ2NBLOR.css}

@@ -373,7 +373,7 @@
   outline: 2px solid transparent;
 }
 
-:root[data-crewlet-focus='pointer'] .crewlet-document-title-field:focus-visible {
+:where(:root[data-crewlet-focus='pointer']) .crewlet-document-title-field:focus-visible {
   border-block-end-color: var(--color-border-selected);
   box-shadow: none;
 }
@@ -386,7 +386,7 @@
   box-shadow: 0 1px 0 var(--color-feedback-danger);
 }
 
-:root[data-crewlet-focus='pointer'] .crewlet-document-title-field[aria-invalid='true']:focus-visible {
+:where(:root[data-crewlet-focus='pointer']) .crewlet-document-title-field[aria-invalid='true']:focus-visible {
   border-block-end-color: var(--color-feedback-danger);
 }
 

package/dist/{Editor-HORWMUM3.js → Editor-QV4JP242.js}

@@ -1,15 +1,15 @@
-import { richEditorLabels } from './chunk-CSQTDGTS.js';
 import { schema, readMarkdown, writeMarkdown } from './chunk-QH6VYJ3X.js';
+import { richEditorLabels } from './chunk-CSQTDGTS.js';
 import { safeHref, MARKDOWN_CALLOUT_TONES } from './chunk-BAKPMH3S.js';
-import { Toolbar } from './chunk-PGRPNDWM.js';
-import { FormField, Input } from './chunk-IUYUS2SO.js';
-import './chunk-YSGLEHND.js';
+import { Toolbar } from './chunk-NR4CPM4T.js';
+import { FormField, Input } from './chunk-TYONQSOK.js';
 import './chunk-PQADV6P6.js';
-import { Menu } from './chunk-BUVCV3WI.js';
+import { Menu } from './chunk-D6FEHY5G.js';
 import { placePopup, viewportBounds } from './chunk-OMV5W53A.js';
-import { usePopupLayer } from './chunk-R25RGPUB.js';
+import { usePopupLayer } from './chunk-H5XTJ7GJ.js';
 import { Button } from './chunk-OG6CL3EB.js';
 import { IconButton } from './chunk-4FQT6ZAY.js';
+import './chunk-NUZHC6MM.js';
 import { VisuallyHidden } from './chunk-BZFWDIV6.js';
 import { cx } from './chunk-ODEQTPFM.js';
 import { forwardRef, useMemo, useRef, useState, useId, useSyncExternalStore, useCallback, useLayoutEffect, useEffect, useImperativeHandle } from 'react';

package/dist/FactList/index.js

@@ -1,6 +1,7 @@
-export { FactList } from '../chunk-HOIZ6MIS.js';
-import '../chunk-6ZJ3N7QI.js';
+export { FactList } from '../chunk-RLJXVFEH.js';
+import '../chunk-I33UIUZD.js';
 import '../chunk-OMV5W53A.js';
-import '../chunk-R25RGPUB.js';
+import '../chunk-H5XTJ7GJ.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/FollowBanner/index.js

@@ -1,7 +1,8 @@
-export { FollowBanner } from '../chunk-WGD2HX2A.js';
+export { FollowBanner } from '../chunk-OED6LUWE.js';
 import '../chunk-SZZRIHGT.js';
 import '../chunk-OMV5W53A.js';
-import '../chunk-R25RGPUB.js';
+import '../chunk-H5XTJ7GJ.js';
 import '../chunk-OG6CL3EB.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/HitArea/hitArea.d.ts

@@ -0,0 +1,7 @@
+/**
+ * The class a row of a list takes so its pointer target runs to its
+ * neighbour's across the gap between them (see HitArea.css). A row that takes
+ * it sets `--crewlet-hit-area-block` or `--crewlet-hit-area-inline` to half the
+ * gap its list is laid out with.
+ */
+export declare const HIT_AREA_CLASS = "crewlet-hit-area";

package/dist/HitArea/index.d.ts

@@ -0,0 +1,2 @@
+import './HitArea.css';
+export { HIT_AREA_CLASS } from './hitArea.js';

package/dist/HitArea/index.js

@@ -0,0 +1,2 @@
+import '../chunk-MICRGE3J.js';
+export { HIT_AREA_CLASS } from '../chunk-2YTOOH3A.js';

package/dist/HitArea-QUOS6ZDJ.css

@@ -0,0 +1,35 @@
+/*
+ * A ROW'S TARGET RUNS TO ITS NEIGHBOUR'S. The rows of one list are drawn a
+ * step apart, and the gap between them belonged to no row: a pointer crossing
+ * the list slowly met the list itself there, so the hand turned into the arrow
+ * and the hover fill went out between every two rows and came back on the
+ * next, which a reader sees as the cursor flickering. Each row that carries
+ * this class reaches half the gap on each side with an empty `::after`, so the
+ * targets meet in the middle of every gap and the drawn rows keep their
+ * spacing. The pseudo-element is part of its row: it takes the row's cursor,
+ * makes the row `:hover`, and a press on it is a press on the row.
+ *
+ * The reach is set on the ROW, from the gap its list is laid out with, as
+ * `--crewlet-hit-area-block` and `--crewlet-hit-area-inline` (each side may be
+ * set alone with the `-start` and `-end` forms). A row that sets none reaches
+ * nowhere. It stays inside the list's own padding, so no scroller grows.
+ *
+ * IT IS MEASURED FROM THE ROW'S PADDING EDGE, which is where an absolutely
+ * placed box starts, so a row drawn with a border (a transparent one
+ * included) adds the border's width to its reach.
+ *
+ * `position: relative` is at zero specificity, so a row positioned on purpose
+ * keeps its own position and is still the pseudo-element's containing block.
+ */
+:where(.crewlet-hit-area) {
+  position: relative;
+}
+
+.crewlet-hit-area::after {
+  content: '';
+  position: absolute;
+  top: calc(var(--crewlet-hit-area-block-start, var(--crewlet-hit-area-block, 0px)) * -1);
+  bottom: calc(var(--crewlet-hit-area-block-end, var(--crewlet-hit-area-block, 0px)) * -1);
+  inset-inline-start: calc(var(--crewlet-hit-area-inline-start, var(--crewlet-hit-area-inline, 0px)) * -1);
+  inset-inline-end: calc(var(--crewlet-hit-area-inline-end, var(--crewlet-hit-area-inline, 0px)) * -1);
+}

package/dist/HuePicker/index.js

@@ -1,9 +1,10 @@
 import '../chunk-FFMCMSJB.js';
-export { HuePicker, HueSwatch } from '../chunk-SUXP4OBT.js';
+export { HuePicker, HueSwatch } from '../chunk-F4LPQA4E.js';
 import '../chunk-AYKXMIOR.js';
-import '../chunk-CCAXYHQS.js';
-import '../chunk-VL6CUNSX.js';
+import '../chunk-2QZ2VPHR.js';
+import '../chunk-7SDUKCNW.js';
 import '../chunk-RKKO7QHH.js';
 import '../chunk-BHHIIK3M.js';
+import '../chunk-2YTOOH3A.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';

package/dist/Input/index.js

@@ -1,6 +1,6 @@
-export { FormField, FormRow, FormSection, Input, InputAffix, Label, ReadOnlyField, Textarea } from '../chunk-IUYUS2SO.js';
-import '../chunk-YSGLEHND.js';
+export { FormField, FormRow, FormSection, Input, InputAffix, Label, ReadOnlyField, Textarea } from '../chunk-TYONQSOK.js';
 import '../chunk-PQADV6P6.js';
 import '../chunk-4FQT6ZAY.js';
+import '../chunk-NUZHC6MM.js';
 import '../chunk-BZFWDIV6.js';
 import '../chunk-ODEQTPFM.js';