cursedbelt 5.92.2 β 5.93.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/react/components/ComboboxField.d.ts +10 -0
- package/dist/react/components/ComboboxField.d.ts.map +1 -1
- package/dist/react/components/ComboboxField.js +4 -4
- package/dist/react/components/ComboboxField.js.map +1 -1
- package/dist/react/components/CommentThread.d.ts.map +1 -1
- package/dist/react/components/CommentThread.js +6 -2
- package/dist/react/components/CommentThread.js.map +1 -1
- package/dist/react/components/ReactionBar.d.ts.map +1 -1
- package/dist/react/components/ReactionBar.js +4 -2
- package/dist/react/components/ReactionBar.js.map +1 -1
- package/dist/react/components/TagsInput.d.ts +1 -1
- package/dist/react/components/TagsInput.d.ts.map +1 -1
- package/dist/react/components/TagsInput.js +5 -1
- package/dist/react/components/TagsInput.js.map +1 -1
- package/dist/react/nav/HeaderSearch.d.ts.map +1 -1
- package/dist/react/nav/HeaderSearch.js +4 -1
- package/dist/react/nav/HeaderSearch.js.map +1 -1
- package/dist/styles-areas/nav.css +13 -13
- package/package.json +8 -1
- package/scripts/checkAreaStyles.spec.ts +14 -0
- package/scripts/checkAreaStyles.ts +15 -1
- package/src/react/components/ComboboxField.spec.tsx +39 -0
- package/src/react/components/ComboboxField.tsx +20 -4
- package/src/react/components/CommentThread.spec.tsx +8 -0
- package/src/react/components/CommentThread.tsx +5 -2
- package/src/react/components/ReactionBar.spec.tsx +8 -0
- package/src/react/components/ReactionBar.tsx +5 -3
- package/src/react/components/TagsInput.spec.tsx +9 -0
- package/src/react/components/TagsInput.tsx +5 -1
- package/src/react/hooks/useScrollMemory.spec.tsx +8 -7
- package/src/react/nav/HeaderSearch.tsx +3 -1
- package/src/react/nav/nav.spec.tsx +6 -0
- package/src/styles-areas/nav.css +13 -13
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import { type ReactNode } from 'react';
|
|
1
2
|
import { type ControlSize } from '../lib/field.js';
|
|
2
3
|
/** A single option in the combobox list. */
|
|
3
4
|
export interface ComboboxOption {
|
|
@@ -15,6 +16,15 @@ interface ComboboxBase {
|
|
|
15
16
|
loadOptions?: (query: string) => Promise<ComboboxOption[]>;
|
|
16
17
|
/** Allow typing a value that isn't in the list and creating it on the fly. */
|
|
17
18
|
creatable?: boolean;
|
|
19
|
+
/**
|
|
20
|
+
* What the list says when nothing matches β *"Nobody in the tree by that name"*.
|
|
21
|
+
*
|
|
22
|
+
* π΄ Required in practice for a combobox whose options come from DATA (`loadOptions`, or a
|
|
23
|
+
* list read from a store): the generic line cannot say what belongs here, and the
|
|
24
|
+
* `choice-needs-empty-state` guardrail reports one without it. Rendered as plain text, not
|
|
25
|
+
* as an item, so it can never be picked or keyboard-focused. Default "No options found".
|
|
26
|
+
*/
|
|
27
|
+
emptyLabel?: ReactNode;
|
|
18
28
|
placeholder?: string;
|
|
19
29
|
disabled?: boolean;
|
|
20
30
|
id?: string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxField.d.ts","sourceRoot":"","sources":["../../../src/react/components/ComboboxField.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ComboboxField.d.ts","sourceRoot":"","sources":["../../../src/react/components/ComboboxField.tsx"],"names":[],"mappings":"AAIA,OAAO,EAAE,KAAK,SAAS,EAA4C,MAAM,OAAO,CAAC;AAEjF,OAAO,EAGL,KAAK,WAAW,EAGjB,MAAM,iBAAiB,CAAC;AAKzB,4CAA4C;AAC5C,MAAM,WAAW,cAAc;IAC7B,KAAK,EAAE,MAAM,CAAC;IACd,+DAA+D;IAC/D,KAAK,EAAE,MAAM,CAAC;IACd,uEAAuE;IACvE,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;CACpB;AAED,UAAU,YAAY;IACpB,OAAO,CAAC,EAAE,cAAc,EAAE,CAAC;IAC3B;oEACgE;IAChE,WAAW,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,OAAO,CAAC,cAAc,EAAE,CAAC,CAAC;IAC3D,8EAA8E;IAC9E,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB;;;;;;;OAOG;IACH,UAAU,CAAC,EAAE,SAAS,CAAC;IACvB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,IAAI,GAAG,SAAS,CAAC;IAClC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;uCAEmC;IACnC,IAAI,CAAC,EAAE,WAAW,CAAC;CACpB;AAED,MAAM,WAAW,wBAAyB,SAAQ,YAAY;IAC5D,QAAQ,CAAC,EAAE,KAAK,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACtB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;CAC3C;AAED,MAAM,WAAW,uBAAwB,SAAQ,YAAY;IAC3D,QAAQ,EAAE,IAAI,CAAC;IACf,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC;IACjB,QAAQ,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;CACtC;AAED,MAAM,MAAM,kBAAkB,GAAG,wBAAwB,GAAG,uBAAuB,CAAC;AA6EpF;;;;;;;;;GASG;AACH,wBAAgB,aAAa,CAAC,KAAK,EAAE,kBAAkB,+BA8MtD"}
|
|
@@ -10,12 +10,12 @@ import { TAP_TARGET, TAP_TARGET_HEIGHT } from '../lib/tapTarget.js';
|
|
|
10
10
|
const DEBOUNCE_MS = 250;
|
|
11
11
|
/** Sentinel value used to represent the "Create new" option inside Base UI. */
|
|
12
12
|
const CREATE_SENTINEL = '__cb_create__';
|
|
13
|
-
function ComboboxList({ creatable, query, onCreateClick }) {
|
|
13
|
+
function ComboboxList({ creatable, query, onCreateClick, emptyLabel }) {
|
|
14
14
|
const filtered = Combobox.useFilteredItems();
|
|
15
15
|
const trimmed = query.trim();
|
|
16
16
|
const hasExact = filtered.some((o) => o.label.toLowerCase() === trimmed.toLowerCase() || o.value === trimmed);
|
|
17
17
|
const showCreate = creatable && trimmed !== '' && !hasExact;
|
|
18
|
-
return (_jsxs(Combobox.List, { className: 'py-1', children: [filtered.map((item, index) => (_jsxs(Combobox.Item, { value: item.value, index: index, disabled: item.disabled, className: cn(FLOATING_ITEM_BASE, 'pr-8', 'data-[highlighted]:bg-accent/10 data-[highlighted]:text-accent-strong'), children: [item.color ? (_jsx("span", { "aria-hidden": true, className: 'size-2 shrink-0 rounded-full', style: { backgroundColor: item.color } })) : null, _jsx("span", { className: 'flex-1 truncate', children: item.label }), _jsx(Combobox.ItemIndicator, { className: 'absolute right-2 flex size-4 items-center justify-center', children: _jsx(Check, { className: 'size-3' }) })] }, item.value))), showCreate && (_jsxs(Combobox.Item, { value: CREATE_SENTINEL, className: cn(FLOATING_ITEM_BASE, 'gap-1.5', 'data-[highlighted]:bg-accent/10 data-[highlighted]:text-accent-strong'), onClick: () => onCreateClick(trimmed), children: [_jsx(Plus, { className: 'size-3', "aria-hidden": true }), "Create \u201C", trimmed, "\u201D"] })), _jsx(Combobox.Empty, { className: 'py-2 text-center text-sm text-muted-foreground', children:
|
|
18
|
+
return (_jsxs(Combobox.List, { className: 'py-1', children: [filtered.map((item, index) => (_jsxs(Combobox.Item, { value: item.value, index: index, disabled: item.disabled, className: cn(FLOATING_ITEM_BASE, 'pr-8', 'data-[highlighted]:bg-accent/10 data-[highlighted]:text-accent-strong'), children: [item.color ? (_jsx("span", { "aria-hidden": true, className: 'size-2 shrink-0 rounded-full', style: { backgroundColor: item.color } })) : null, _jsx("span", { className: 'flex-1 truncate', children: item.label }), _jsx(Combobox.ItemIndicator, { className: 'absolute right-2 flex size-4 items-center justify-center', children: _jsx(Check, { className: 'size-3' }) })] }, item.value))), showCreate && (_jsxs(Combobox.Item, { value: CREATE_SENTINEL, className: cn(FLOATING_ITEM_BASE, 'gap-1.5', 'data-[highlighted]:bg-accent/10 data-[highlighted]:text-accent-strong'), onClick: () => onCreateClick(trimmed), children: [_jsx(Plus, { className: 'size-3', "aria-hidden": true }), "Create \u201C", trimmed, "\u201D"] })), _jsx(Combobox.Empty, { className: 'py-2 text-center text-sm text-muted-foreground', children: emptyLabel })] }));
|
|
19
19
|
}
|
|
20
20
|
/* -------------------------------------------------------------------------- */
|
|
21
21
|
/* Public component */
|
|
@@ -31,7 +31,7 @@ function ComboboxList({ creatable, query, onCreateClick }) {
|
|
|
31
31
|
* type so it renders inside a {@link Field} with label + validation.
|
|
32
32
|
*/
|
|
33
33
|
export function ComboboxField(props) {
|
|
34
|
-
const { options = [], loadOptions, creatable = false, placeholder = 'Selectβ¦', disabled, id, name, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedBy, className, size = 'md',
|
|
34
|
+
const { options = [], loadOptions, creatable = false, emptyLabel = 'No options found', placeholder = 'Selectβ¦', disabled, id, name, 'aria-invalid': ariaInvalid, 'aria-describedby': ariaDescribedBy, className, size = 'md',
|
|
35
35
|
// Named so they stay off the input: the discriminated union's own shape, read via
|
|
36
36
|
// `(props as β¦).multiple`/`.value`/`.onChange` below, never off this destructuring.
|
|
37
37
|
multiple: _multiple, value: _value, onChange: _onChange, ...rest } = props;
|
|
@@ -120,7 +120,7 @@ export function ComboboxField(props) {
|
|
|
120
120
|
// preflight (desk) would otherwise add the UA's inset border and control face (task 2757).
|
|
121
121
|
'm-0 min-w-24 flex-1 border-0 bg-transparent px-3 font-[inherit] text-base text-field-fg outline-none placeholder:text-field-placeholder sm:pointer-fine:text-sm', TAP_TARGET_HEIGHT, multiple && 'py-1.5') }), loading ? (_jsx(Loader2, { className: 'mr-2 size-4 shrink-0 animate-spin opacity-50', "aria-label": 'Loading options' })) : (_jsx(Combobox.Trigger, { "aria-label": 'Toggle options', className: `mr-2 flex size-5 shrink-0 items-center justify-center text-muted-foreground transition hover:text-foreground ${TAP_TARGET}`, children: _jsx(ChevronDown, { className: 'size-4' }) }))] }), _jsx(Combobox.Portal, { children: _jsx(Combobox.Positioner, { sideOffset: 4, collisionPadding: FLOATING_COLLISION_PADDING, className: 'z-[var(--z-popover)]', children: _jsx(Combobox.Popup, { className: cn(FLOATING_CONTENT_BASE,
|
|
122
122
|
// guardrails-ignore no-raw-overflow: floating popover panel outside the page's ScrollArea, height-capped by max-h-64 β no keyboard-inset concern.
|
|
123
|
-
'max-h-64 min-w-[var(--anchor-width)] overflow-y-auto p-0', 'transition-[transform,opacity] duration-100', 'data-[starting-style]:scale-95 data-[starting-style]:opacity-0', 'data-[ending-style]:scale-95 data-[ending-style]:opacity-0'), children: _jsx(ComboboxList, { creatable: creatable, query: query, onCreateClick: handleCreate }) }) }) })] }));
|
|
123
|
+
'max-h-64 min-w-[var(--anchor-width)] overflow-y-auto p-0', 'transition-[transform,opacity] duration-100', 'data-[starting-style]:scale-95 data-[starting-style]:opacity-0', 'data-[ending-style]:scale-95 data-[ending-style]:opacity-0'), children: _jsx(ComboboxList, { creatable: creatable, query: query, onCreateClick: handleCreate, emptyLabel: emptyLabel }) }) }) })] }));
|
|
124
124
|
}
|
|
125
125
|
// FRM-3: a closed list is sized by its longest option, as SelectField is. A list that can hold
|
|
126
126
|
// a value nobody has seen yet β fetched (`loadOptions`) or typed (`creatable`) β keeps a
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ComboboxField.js","sourceRoot":"","sources":["../../../src/react/components/ComboboxField.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAC;;AAEb,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACnD,OAAO,EAAE,KAAK,EAAE,WAAW,EAAE,OAAO,EAAE,IAAI,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AACpE,OAAO,
|
|
1
|
+
{"version":3,"file":"ComboboxField.js","sourceRoot":"","sources":["../../../src/react/components/ComboboxField.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CommentThread.d.ts","sourceRoot":"","sources":["../../../src/react/components/CommentThread.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"CommentThread.d.ts","sourceRoot":"","sources":["../../../src/react/components/CommentThread.tsx"],"names":[],"mappings":"AASA,OAAO,EAAe,KAAK,aAAa,EAAE,MAAM,kBAAkB,CAAC;AAKnE,MAAM,WAAW,aAAa;IAC5B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED,MAAM,WAAW,sBAAsB;IACrC,MAAM,EAAE,aAAa,EAAE,CAAC;IACxB,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC5B;AAED,MAAM,WAAW,WAAW;IAC1B,EAAE,EAAE,MAAM,CAAC;IACX,IAAI,EAAE,MAAM,CAAC;IACb,MAAM,EAAE,aAAa,CAAC;IACtB,SAAS,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,mDAAmD;IACnD,QAAQ,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IACzB,mEAAmE;IACnE,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,sDAAsD;IACtD,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB,wDAAwD;IACxD,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,sBAAsB,CAAC;CACpC;AAED,MAAM,WAAW,kBAAkB;IACjC,QAAQ,CAAC,EAAE,WAAW,EAAE,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,+EAA+E;IAC/E,MAAM,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,QAAQ,CAAC,EAAE,MAAM,KAAK,IAAI,CAAC;IAClD,MAAM,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC5C,QAAQ,CAAC,EAAE,CAAC,EAAE,EAAE,MAAM,KAAK,IAAI,CAAC;IAChC,sCAAsC;IACtC,OAAO,CAAC,EAAE,CAAC,SAAS,EAAE,MAAM,EAAE,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,+CAA+C;IAC/C,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AA4QD;;;;;;;;GAQG;AACH,wBAAgB,aAAa,CAAC,EAC5B,QAAa,EACb,SAAS,EACT,MAAM,EACN,MAAM,EACN,QAAQ,EACR,OAAO,EACP,SAAS,EACT,YAA0D,EAC1D,WAAqD,EACrD,GAAG,IAAI,EACR,EAAE,kBAAkB,+BA0BpB"}
|
|
@@ -3,6 +3,7 @@ import { Edit2, Send, Trash2 } from 'lucide-react';
|
|
|
3
3
|
import { useState } from 'react';
|
|
4
4
|
import { cn } from '../lib/cn.js';
|
|
5
5
|
import { FIELD_CLASS } from '../lib/field.js';
|
|
6
|
+
import { TAP_TARGET_HEIGHT } from '../lib/tapTarget.js';
|
|
6
7
|
import { AutoGrowTextarea } from './AutoGrowTextarea.js';
|
|
7
8
|
import { Avatar } from './Avatar.js';
|
|
8
9
|
import { Button } from './Button.js';
|
|
@@ -47,7 +48,10 @@ function Composer({ onSubmit, placeholder, autoFocus, onCancel, }) {
|
|
|
47
48
|
submit();
|
|
48
49
|
if (e.key === 'Escape')
|
|
49
50
|
onCancel?.();
|
|
50
|
-
},
|
|
51
|
+
},
|
|
52
|
+
// `TAP_TARGET_HEIGHT`: at `min-h-9` (36px) the composer fell short of the 44px tap
|
|
53
|
+
// floor on a coarse pointer (DESIGN.md LAY-13).
|
|
54
|
+
className: cn(FIELD_CLASS, 'min-h-9 flex-1', TAP_TARGET_HEIGHT) }), _jsx(Button, { variant: 'primary', size: 'sm', "aria-label": 'Send', disabled: !body.trim(), onClick: submit, tooltip: 'Post comment', children: _jsx(Send, { className: 'h-4 w-4', "aria-hidden": true }) }), onCancel && (_jsx(Button, { variant: 'ghost', size: 'sm', onClick: onCancel, tooltip: 'Cancel comment', children: "Cancel" }))] }));
|
|
51
55
|
}
|
|
52
56
|
// ββ CommentItem βββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββββ
|
|
53
57
|
/** Two placeholder comments, in a comment's own shape: avatar, then a body bubble. */
|
|
@@ -62,7 +66,7 @@ function CommentItem({ comment, replies, onPost, onEdit, onDelete, onReact, }) {
|
|
|
62
66
|
const [confirmDel, setConfirmDel] = useState(false);
|
|
63
67
|
const [draft, setDraft] = useState(comment.body);
|
|
64
68
|
const createdAt = comment.createdAt instanceof Date ? comment.createdAt : new Date(comment.createdAt);
|
|
65
|
-
return (_jsxs("div", { className: 'flex gap-2', children: [_jsx(Avatar, { name: comment.author.name, src: comment.author.avatarUrl, size: 'sm', className: 'mt-0.5 shrink-0' }), _jsxs("div", { className: 'min-w-0 flex-1', children: [_jsxs("div", { className: 'rounded-lg bg-muted px-3 py-2', children: [_jsxs("div", { className: 'flex items-baseline gap-2', children: [_jsx("span", { className: 'text-sm font-medium text-foreground', children: comment.author.name || 'Someone' }), _jsx("span", { className: 'text-xs text-muted-foreground', children: formatRelative(createdAt) })] }), editing ? (_jsxs("div", { className: 'mt-1 flex items-end gap-2', children: [_jsx(AutoGrowTextarea, { value: draft, rows: 1, onChange: (e) => setDraft(e.target.value), className: cn(FIELD_CLASS, 'min-h-9 flex-1') }), _jsx(Button, { variant: 'primary', size: 'sm', disabled: !draft.trim(), onClick: () => {
|
|
69
|
+
return (_jsxs("div", { className: 'flex gap-2', children: [_jsx(Avatar, { name: comment.author.name, src: comment.author.avatarUrl, size: 'sm', className: 'mt-0.5 shrink-0' }), _jsxs("div", { className: 'min-w-0 flex-1', children: [_jsxs("div", { className: 'rounded-lg bg-muted px-3 py-2', children: [_jsxs("div", { className: 'flex items-baseline gap-2', children: [_jsx("span", { className: 'text-sm font-medium text-foreground', children: comment.author.name || 'Someone' }), _jsx("span", { className: 'text-xs text-muted-foreground', children: formatRelative(createdAt) })] }), editing ? (_jsxs("div", { className: 'mt-1 flex items-end gap-2', children: [_jsx(AutoGrowTextarea, { value: draft, rows: 1, onChange: (e) => setDraft(e.target.value), className: cn(FIELD_CLASS, 'min-h-9 flex-1', TAP_TARGET_HEIGHT) }), _jsx(Button, { variant: 'primary', size: 'sm', disabled: !draft.trim(), onClick: () => {
|
|
66
70
|
onEdit?.(comment.id, draft.trim());
|
|
67
71
|
setEditing(false);
|
|
68
72
|
}, tooltip: 'Save edited comment', children: "Save" }), _jsx(Button, { variant: 'ghost', size: 'sm', onClick: () => setEditing(false), tooltip: 'Cancel editing', children: "Cancel" })] })) : (_jsx("p", { className: 'mt-0.5 whitespace-pre-wrap break-words text-sm text-foreground', children: comment.deleted ? (_jsx("span", { className: 'italic text-muted-foreground', children: "deleted" })) : (comment.body) }))] }), !comment.deleted && (_jsxs("div", { className: 'mt-1 flex flex-wrap items-center gap-2 pl-1', children: [comment.reactions && (_jsx(ReactionBar, { emojis: comment.reactions.emojis, myReaction: comment.reactions.myReaction, onReact: (emoji) => onReact?.(comment.id, emoji) })), _jsx(Button, { variant: 'link', onClick: () => setReplying((v) => !v), className: 'text-xs text-muted-foreground hover:text-foreground', tooltip: replying ? 'Cancel reply' : 'Reply to comment', children: "Reply" }), comment.canEdit && !editing && (_jsx(IconButton, { label: 'Edit comment', size: 'sm', className: QUIET_ACTION, onClick: () => setEditing(true), children: _jsx(Edit2, {}) })), comment.canDelete &&
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CommentThread.js","sourceRoot":"","sources":["../../../src/react/components/CommentThread.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"CommentThread.js","sourceRoot":"","sources":["../../../src/react/components/CommentThread.tsx"],"names":[],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactionBar.d.ts","sourceRoot":"","sources":["../../../src/react/components/ReactionBar.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"ReactionBar.d.ts","sourceRoot":"","sources":["../../../src/react/components/ReactionBar.tsx"],"names":[],"mappings":"AAMA,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,KAAK,EAAE,MAAM,CAAC;IACd,6DAA6D;IAC7D,KAAK,EAAE,MAAM,EAAE,CAAC;CACjB;AAED,MAAM,WAAW,gBAAgB;IAC/B,wEAAwE;IACxE,MAAM,CAAC,EAAE,aAAa,EAAE,CAAC;IACzB,2EAA2E;IAC3E,UAAU,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;IAC3B,iFAAiF;IACjF,OAAO,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACjC,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;GAOG;AACH,wBAAgB,WAAW,CAAC,EAAE,MAAW,EAAE,UAAU,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,IAAI,EAAE,EAAE,gBAAgB,+BAoCrG"}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { cn } from '../lib/cn.js';
|
|
3
|
+
import { TAP_TARGET } from '../lib/tapTarget.js';
|
|
3
4
|
import { ReactionPicker } from './ReactionPicker.js';
|
|
4
5
|
import { Tooltip } from './Tooltip.js';
|
|
5
6
|
import { RAW_BUTTON } from '../lib/cn.js';
|
|
@@ -21,8 +22,9 @@ export function ReactionBar({ emojis = [], myReaction, onReact, className, ...re
|
|
|
21
22
|
// element (it's already the Tooltip.Trigger child here).
|
|
22
23
|
type: 'button', onClick: () => onReact(g.emoji), "aria-label": `${g.emoji} β ${g.users.join(', ')}`, "aria-pressed": mine, className: cn(RAW_BUTTON,
|
|
23
24
|
// h-7, the add-reaction trigger's height: at py-0.5 a pill was 22px beside
|
|
24
|
-
// the 24px trigger, one row at two heights (FND-4).
|
|
25
|
-
|
|
25
|
+
// the 24px trigger, one row at two heights (FND-4). `TAP_TARGET` grows it to
|
|
26
|
+
// 44px on a coarse pointer (DESIGN.md LAY-13) without touching the mouse size.
|
|
27
|
+
`inline-flex h-7 items-center gap-1 rounded-full border px-2.5 text-xs tabular-nums transition ${TAP_TARGET}`,
|
|
26
28
|
// text-accent-strong (cbux-101) β plain text-accent only clears 4.43:1 on this tint.
|
|
27
29
|
mine
|
|
28
30
|
? 'border-accent bg-accent/10 text-accent-strong'
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ReactionBar.js","sourceRoot":"","sources":["../../../src/react/components/ReactionBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAmB1C;;;;;;;GAOG;AACH,MAAM,UAAU,WAAW,CAAC,EAAE,MAAM,GAAG,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,IAAI,EAAoB;IACpG,OAAO,CACL,kBAAS,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,mCAAmC,EAAE,SAAS,CAAC,aACzE,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE;gBAChB,MAAM,IAAI,GAAG,UAAU,KAAK,CAAC,CAAC,KAAK,CAAC;gBACpC,OAAO,CACL,KAAC,OAAO,IAAe,OAAO,EAAE,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,SAAS,kBAC3D;wBACE,oEAAoE;wBACpE,sEAAsE;wBACtE,sEAAsE;wBACtE,yDAAyD;wBACzD,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,gBACnB,GAAG,CAAC,CAAC,KAAK,MAAM,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,kBAClC,IAAI,EAClB,SAAS,EAAE,EAAE,CAAC,UAAU;wBACtB,2EAA2E;wBAC3E,
|
|
1
|
+
{"version":3,"file":"ReactionBar.js","sourceRoot":"","sources":["../../../src/react/components/ReactionBar.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,OAAO,EAAE,MAAM,cAAc,CAAC;AACvC,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAmB1C;;;;;;;GAOG;AACH,MAAM,UAAU,WAAW,CAAC,EAAE,MAAM,GAAG,EAAE,EAAE,UAAU,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,IAAI,EAAoB;IACpG,OAAO,CACL,kBAAS,IAAI,EAAE,SAAS,EAAE,EAAE,CAAC,mCAAmC,EAAE,SAAS,CAAC,aACzE,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE;gBAChB,MAAM,IAAI,GAAG,UAAU,KAAK,CAAC,CAAC,KAAK,CAAC;gBACpC,OAAO,CACL,KAAC,OAAO,IAAe,OAAO,EAAE,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,SAAS,kBAC3D;wBACE,oEAAoE;wBACpE,sEAAsE;wBACtE,sEAAsE;wBACtE,yDAAyD;wBACzD,IAAI,EAAC,QAAQ,EACb,OAAO,EAAE,GAAG,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,KAAK,CAAC,gBACnB,GAAG,CAAC,CAAC,KAAK,MAAM,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,kBAClC,IAAI,EAClB,SAAS,EAAE,EAAE,CAAC,UAAU;wBACtB,2EAA2E;wBAC3E,6EAA6E;wBAC7E,+EAA+E;wBAC/E,iGAAiG,UAAU,EAAE;wBAC7G,qFAAqF;wBACrF,IAAI;4BACF,CAAC,CAAC,+CAA+C;4BACjD,CAAC,CAAC,8CAA8C,CACnD,aAED,yBAAO,CAAC,CAAC,KAAK,GAAQ,EACtB,yBAAO,CAAC,CAAC,KAAK,GAAQ,IACf,IAvBG,CAAC,CAAC,KAAK,CAwBX,CACX,CAAC;YACJ,CAAC,CAAC,EACF,KAAC,cAAc,IAAC,MAAM,EAAE,OAAO,GAAI,IAC/B,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -51,7 +51,7 @@ export declare function useTagEditing({ value, onChange, draft, setDraft }: Pick
|
|
|
51
51
|
};
|
|
52
52
|
/** The chip row's frame β an Input-shaped container reading the field tokens. */
|
|
53
53
|
export declare function tagsRowClass(size: ControlSize, disabled: boolean | undefined, className: string | undefined): string;
|
|
54
|
-
export declare const TAGS_INPUT_CLASS = "min-w-24 flex-1 bg-transparent py-0.5 text-base text-field-fg outline-none placeholder:text-field-placeholder sm:pointer-fine:text-sm";
|
|
54
|
+
export declare const TAGS_INPUT_CLASS = "min-w-24 flex-1 bg-transparent py-0.5 text-base text-field-fg outline-none placeholder:text-field-placeholder sm:pointer-fine:text-sm pointer-coarse:min-h-11";
|
|
55
55
|
/** The committed tags as removable chips. */
|
|
56
56
|
export declare function TagChips({ value, disabled, onRemove }: {
|
|
57
57
|
value: string[];
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TagsInput.d.ts","sourceRoot":"","sources":["../../../src/react/components/TagsInput.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,aAAa,EAA+B,MAAM,OAAO,CAAC;AAE5F,OAAO,EAA4B,KAAK,WAAW,EAAE,MAAM,iBAAiB,CAAC;
|
|
1
|
+
{"version":3,"file":"TagsInput.d.ts","sourceRoot":"","sources":["../../../src/react/components/TagsInput.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,aAAa,EAAE,KAAK,aAAa,EAA+B,MAAM,OAAO,CAAC;AAE5F,OAAO,EAA4B,KAAK,WAAW,EAAE,MAAM,iBAAiB,CAAC;AAI7E,MAAM,WAAW,cAAc;IAC7B,uCAAuC;IACvC,KAAK,EAAE,MAAM,EAAE,CAAC;IAChB,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,IAAI,CAAC;IACpC,iEAAiE;IACjE,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,4DAA4D;IAC5D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;;;;;;;;;OAUG;IACH,WAAW,CAAC,EAAE,SAAS,MAAM,EAAE,CAAC;IAChC,EAAE,CAAC,EAAE,MAAM,CAAC;IACZ,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,cAAc,CAAC,EAAE,IAAI,GAAG,SAAS,CAAC;IAClC,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,qFAAqF;IACrF,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB;;yEAEqE;IACrE,IAAI,CAAC,EAAE,WAAW,CAAC;CACpB;AAaD;qFACqF;AACrF,MAAM,WAAW,cAAe,SAAQ,cAAc;IACpD,KAAK,EAAE,MAAM,CAAC;IACd,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IAClC,iFAAiF;IACjF,YAAY,CAAC,EAAE,OAAO,CAAC;CACxB;AAED,oGAAoG;AACpG,wBAAgB,aAAa,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,EAAE,IAAI,CAAC,cAAc,EAAE,OAAO,GAAG,UAAU,GAAG,OAAO,GAAG,UAAU,CAAC;kBAC9G,MAAM;sBAKF,MAAM;mBACT,aAAa,CAAC,gBAAgB,CAAC;cASpC,MAAM;EASxB;AAED,iFAAiF;AACjF,wBAAgB,YAAY,CAAC,IAAI,EAAE,WAAW,EAAE,QAAQ,EAAE,OAAO,GAAG,SAAS,EAAE,SAAS,EAAE,MAAM,GAAG,SAAS,UAU3G;AAKD,eAAO,MAAM,gBAAgB,kKACiI,CAAC;AAE/J,6CAA6C;AAE7C,wBAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,EAAE;IAAE,KAAK,EAAE,MAAM,EAAE,CAAC;IAAC,QAAQ,CAAC,EAAE,OAAO,GAAG,SAAS,CAAC;IAAC,QAAQ,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAA;CAAE,iCAc7I;AAED,KAAK,eAAe,GAAG,aAAa,CAAC,cAAc,CAAC,CAAC;AAKrD,uEAAuE;AACvE,wBAAgB,0BAA0B,IAAI,OAAO,CAAC,eAAe,CAAC,CAQrE;AAED;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,SAAS,CAAC,KAAK,EAAE,cAAc,+BA+B9C"}
|
|
@@ -3,6 +3,7 @@ import { X } from 'lucide-react';
|
|
|
3
3
|
import { useEffect, useRef, useState } from 'react';
|
|
4
4
|
import { cn } from '../lib/cn.js';
|
|
5
5
|
import { CONTROL_MIN_HEIGHT_CLASS } from '../lib/field.js';
|
|
6
|
+
import { TAP_TARGET_HEIGHT } from '../lib/tapTarget.js';
|
|
6
7
|
import { IconButton } from './IconButton.js';
|
|
7
8
|
/** Append `additions` to `current`, trimming + dropping empties and duplicates
|
|
8
9
|
* (case-sensitive, against both the existing tags and each other). */
|
|
@@ -55,7 +56,10 @@ export function tagsRowClass(size, disabled, className) {
|
|
|
55
56
|
// guardrails-ignore control-height-tokens: min-height chip-wrapping row (not fixed) β py- clears wrapped lines
|
|
56
57
|
'flex w-full flex-wrap items-center gap-1.5 rounded-field border border-field-border bg-field-bg px-2 py-1 transition focus-within:border-field-ring focus-within:ring-2 focus-within:ring-field-ring/30 aria-[invalid=true]:border-field-error', CONTROL_MIN_HEIGHT_CLASS[size], disabled && 'cursor-not-allowed opacity-50', className);
|
|
57
58
|
}
|
|
58
|
-
|
|
59
|
+
// `TAP_TARGET_HEIGHT`: at `py-0.5` the draft input was 28px tall on a coarse pointer, under the
|
|
60
|
+
// 44px tap floor (DESIGN.md LAY-13) β the row itself grows with it since this input is a flex
|
|
61
|
+
// child of `tagsRowClass`'s `items-center` row.
|
|
62
|
+
export const TAGS_INPUT_CLASS = `min-w-24 flex-1 bg-transparent py-0.5 text-base text-field-fg outline-none placeholder:text-field-placeholder sm:pointer-fine:text-sm ${TAP_TARGET_HEIGHT}`;
|
|
59
63
|
/** The committed tags as removable chips. */
|
|
60
64
|
// no-attribute-forward: a list of chips with no element of its own β the row it sits in takes the caller's attributes
|
|
61
65
|
export function TagChips({ value, disabled, onRemove }) {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"TagsInput.js","sourceRoot":"","sources":["../../../src/react/components/TagsInput.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"TagsInput.js","sourceRoot":"","sources":["../../../src/react/components/TagsInput.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,cAAc,CAAC;AACjC,OAAO,EAA0C,SAAS,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5F,OAAO,EAAE,EAAE,EAAE,MAAM,cAAc,CAAC;AAClC,OAAO,EAAE,wBAAwB,EAAoB,MAAM,iBAAiB,CAAC;AAC7E,OAAO,EAAE,iBAAiB,EAAE,MAAM,qBAAqB,CAAC;AACxD,OAAO,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAqC7C;uEACuE;AACvE,SAAS,SAAS,CAAC,OAAiB,EAAE,SAAmB;IACvD,MAAM,IAAI,GAAG,CAAC,GAAG,OAAO,CAAC,CAAC;IAC1B,KAAK,MAAM,GAAG,IAAI,SAAS,EAAE,CAAC;QAC5B,MAAM,GAAG,GAAG,GAAG,CAAC,IAAI,EAAE,CAAC;QACvB,IAAI,GAAG,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC;YAAE,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC;IACjD,CAAC;IACD,OAAO,IAAI,CAAC;AACd,CAAC;AAWD,oGAAoG;AACpG,MAAM,UAAU,aAAa,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAqE;IACnI,MAAM,MAAM,GAAG,CAAC,GAAW,EAAE,EAAE;QAC7B,MAAM,IAAI,GAAG,SAAS,CAAC,KAAK,EAAE,CAAC,GAAG,CAAC,CAAC,CAAC;QACrC,IAAI,IAAI,CAAC,MAAM,KAAK,KAAK,CAAC,MAAM;YAAE,QAAQ,CAAC,IAAI,CAAC,CAAC;QACjD,QAAQ,CAAC,EAAE,CAAC,CAAC;IACf,CAAC,CAAC;IACF,MAAM,QAAQ,GAAG,CAAC,KAAa,EAAE,EAAE,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,EAAE,CAAC,CAAC,KAAK,KAAK,CAAC,CAAC,CAAC;IAClF,MAAM,SAAS,GAAG,CAAC,CAAkC,EAAE,EAAE;QACvD,IAAI,CAAC,CAAC,GAAG,KAAK,OAAO,IAAI,CAAC,CAAC,GAAG,KAAK,GAAG,EAAE,CAAC;YACvC,CAAC,CAAC,cAAc,EAAE,CAAC;YACnB,IAAI,KAAK,CAAC,IAAI,EAAE;gBAAE,MAAM,CAAC,KAAK,CAAC,CAAC;QAClC,CAAC;aAAM,IAAI,CAAC,CAAC,GAAG,KAAK,WAAW,IAAI,KAAK,KAAK,EAAE,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACrE,QAAQ,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,CAAC;QAC7B,CAAC;IACH,CAAC,CAAC;IACF,gGAAgG;IAChG,MAAM,IAAI,GAAG,CAAC,CAAS,EAAE,EAAE;QACzB,IAAI,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC;YAAE,OAAO,QAAQ,CAAC,CAAC,CAAC,CAAC;QACzC,MAAM,KAAK,GAAG,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;QAC3B,MAAM,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,IAAI,EAAE,CAAC;QAC/B,MAAM,MAAM,GAAG,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC;QACvC,IAAI,MAAM,CAAC,MAAM,KAAK,KAAK,CAAC,MAAM;YAAE,QAAQ,CAAC,MAAM,CAAC,CAAC;QACrD,QAAQ,CAAC,IAAI,CAAC,CAAC;IACjB,CAAC,CAAC;IACF,OAAO,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,CAAC;AAC/C,CAAC;AAED,iFAAiF;AACjF,MAAM,UAAU,YAAY,CAAC,IAAiB,EAAE,QAA6B,EAAE,SAA6B;IAC1G,OAAO,EAAE;IACP,qGAAqG;IACrG,wGAAwG;IACxG,+GAA+G;IAC/G,gPAAgP,EAChP,wBAAwB,CAAC,IAAI,CAAC,EAC9B,QAAQ,IAAI,+BAA+B,EAC3C,SAAS,CACV,CAAC;AACJ,CAAC;AAED,gGAAgG;AAChG,8FAA8F;AAC9F,gDAAgD;AAChD,MAAM,CAAC,MAAM,gBAAgB,GAC3B,yIAAyI,iBAAiB,EAAE,CAAC;AAE/J,6CAA6C;AAC7C,sHAAsH;AACtH,MAAM,UAAU,QAAQ,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAA0F;IAC5I,OAAO,KAAK,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,CAAC,EAAE,EAAE,CAAC,CAC3B,gBAAgB,SAAS,EAAC,0FAA0F,aACjH,GAAG,EACJ,KAAC,UAAU,IACT,KAAK,EAAE,UAAU,GAAG,EAAE,EACtB,QAAQ,EAAE,QAAQ,EAClB,OAAO,EAAE,GAAG,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC,EAC1B,SAAS,EAAC,wHAAwH,YAElI,KAAC,CAAC,0BAAe,GACN,KATJ,GAAG,CAUP,CACR,CAAC,CAAC;AACL,CAAC;AAID,IAAI,gBAAgB,GAA2B,IAAI,CAAC;AACpD,IAAI,iBAAiB,GAAoC,IAAI,CAAC;AAE9D,uEAAuE;AACvE,MAAM,UAAU,0BAA0B;IACxC,IAAI,CAAC,iBAAiB,EAAE,CAAC;QACvB,iBAAiB,GAAG,MAAM,CAAC,0BAA0B,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE;YAChE,gBAAgB,GAAG,CAAC,CAAC,OAAO,CAAC;YAC7B,OAAO,CAAC,CAAC,OAAO,CAAC;QACnB,CAAC,CAAC,CAAC;IACL,CAAC;IACD,OAAO,iBAAiB,CAAC;AAC3B,CAAC;AAED;;;;;;;;;;;;;;GAcG;AACH,MAAM,UAAU,SAAS,CAAC,KAAqB;IAC7C,MAAM,SAAS,GAAG,KAAK,CAAC,WAAW,KAAK,SAAS,CAAC;IAClD,yFAAyF;IACzF,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAyB,GAAG,EAAE,CAAC,CAAC,SAAS,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC;IAClH,MAAM,CAAC,KAAK,EAAE,QAAQ,CAAC,GAAG,QAAQ,CAAC,EAAE,CAAC,CAAC;IACvC,MAAM,OAAO,GAAG,MAAM,CAAC,KAAK,CAAC,CAAC;IAE9B,SAAS,CAAC,GAAG,EAAE;QACb,IAAI,CAAC,SAAS,IAAI,UAAU;YAAE,OAAO;QACrC,IAAI,KAAK,GAAG,IAAI,CAAC;QACjB,KAAK,0BAA0B,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,EAAE;YAC3C,IAAI,KAAK;gBAAE,aAAa,CAAC,GAAG,EAAE,CAAC,CAAC,CAAC,CAAC;QACpC,CAAC,CAAC,CAAC;QACH,OAAO,GAAG,EAAE;YACV,KAAK,GAAG,KAAK,CAAC;QAChB,CAAC,CAAC;IACJ,CAAC,EAAE,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,CAAC;IAE5B,IAAI,SAAS,IAAI,UAAU,EAAE,CAAC;QAC5B,OAAO,KAAC,UAAU,OAAK,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,YAAY,EAAE,OAAO,CAAC,OAAO,GAAI,CAAC;IACpG,CAAC;IACD,OAAO,CACL,KAAC,cAAc,OACT,KAAK,EACT,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,QAAQ,EAClB,aAAa,EAAE,CAAC,EAAE,EAAE,EAAE;YACpB,OAAO,CAAC,OAAO,GAAG,EAAE,CAAC;QACvB,CAAC,GACD,CACH,CAAC;AACJ,CAAC;AAED,SAAS,cAAc,CAAC,EACtB,KAAK,EACL,QAAQ,EACR,MAAM,EACN,WAAW,GAAG,YAAY,EAC1B,QAAQ,EACR,OAAO,EACP,EAAE,EACF,IAAI,EACJ,WAAW,EAAE,YAAY,EACzB,cAAc,EAAE,WAAW,EAC3B,YAAY,EAAE,SAAS,EACvB,kBAAkB,EAAE,eAAe,EACnC,SAAS,EACT,IAAI,GAAG,IAAI,EACX,KAAK,EACL,QAAQ,EACR,aAAa,EACb,GAAG,IAAI,EACwD;IAC/D,MAAM,EAAE,MAAM,EAAE,QAAQ,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,aAAa,CAAC,EAAE,KAAK,EAAE,QAAQ,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,CAAC;IAClG,MAAM,KAAK,GAAG,OAAO,IAAI,IAAI,IAAI,KAAK,CAAC,MAAM,IAAI,OAAO,CAAC;IACzD,OAAO,CACL,kBAAS,IAAI,kBAAgB,WAAW,EAAE,SAAS,EAAE,YAAY,CAAC,IAAI,EAAE,QAAQ,EAAE,SAAS,CAAC,aAC1F,KAAC,QAAQ,IAAC,KAAK,EAAE,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,EAAE,QAAQ,GAAI,EACjE,CAAC,KAAK,CAAC,CAAC,CAAC,CACR;gBACE,0FAA0F;gBAC1F,yFAAyF;gBACzF,sDAAsD;gBACtD,EAAE,EAAE,EAAE,EACN,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,QAAQ,EAAE,CAAC,CAAC,EAAE,EAAE,CAAC,IAAI,CAAC,CAAC,CAAC,MAAM,CAAC,KAAK,CAAC,EACrC,QAAQ,EAAE,QAAQ,EAClB,WAAW,EAAE,KAAK,CAAC,MAAM,KAAK,CAAC,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,SAAS,kBAC3C,WAAW,gBACb,SAAS,sBACH,eAAe,EACjC,YAAY,EAAC,KAAK,EAClB,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,IAAI,CAAC,EAClC,MAAM,EAAE,GAAG,EAAE;oBACX,aAAa,CAAC,KAAK,CAAC,CAAC;oBACrB,IAAI,KAAK,CAAC,IAAI,EAAE;wBAAE,MAAM,CAAC,KAAK,CAAC,CAAC;oBAChC,MAAM,EAAE,EAAE,CAAC;gBACb,CAAC,EACD,SAAS,EAAE,gBAAgB,GAC3B,CACH,CAAC,CAAC,CAAC,IAAI,IACJ,CACP,CAAC;AACJ,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HeaderSearch.d.ts","sourceRoot":"","sources":["../../../src/react/nav/HeaderSearch.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,KAAK,SAAS,EAA4B,MAAM,OAAO,CAAC;AACjE,OAAO,EAAsB,KAAK,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAK3F,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EACL,KAAK,iBAAiB,EAIvB,MAAM,oBAAoB,CAAC;AAE5B,MAAM,WAAW,iBAAkB,SAAQ,kBAAkB;IAC3D,4EAA4E;IAC5E,SAAS,EAAE,oBAAoB,EAAE,CAAC;IAClC;;;;OAIG;IACH,YAAY,CAAC,EAAE,iBAAiB,EAAE,CAAC;IACnC,4FAA4F;IAC5F,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,yCAAyC;IACzC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8DAA8D;IAC9D,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sDAAsD;IACtD,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,YAAY,EACZ,aAAa,EACb,WAAuB,EACvB,UAAc,EACd,QAAY,EACZ,UAAoB,EACpB,YAA4B,EAC5B,aAAa,EACb,UAAU,EACV,eAAe,EACf,WAAW,EACX,SAAS,EACT,GAAG,IAAI,EACR,EAAE,iBAAiB,+
|
|
1
|
+
{"version":3,"file":"HeaderSearch.d.ts","sourceRoot":"","sources":["../../../src/react/nav/HeaderSearch.tsx"],"names":[],"mappings":"AAWA,OAAO,EAAE,KAAK,SAAS,EAA4B,MAAM,OAAO,CAAC;AACjE,OAAO,EAAsB,KAAK,oBAAoB,EAAE,MAAM,4BAA4B,CAAC;AAK3F,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,gBAAgB,CAAC;AACzD,OAAO,EACL,KAAK,iBAAiB,EAIvB,MAAM,oBAAoB,CAAC;AAE5B,MAAM,WAAW,iBAAkB,SAAQ,kBAAkB;IAC3D,4EAA4E;IAC5E,SAAS,EAAE,oBAAoB,EAAE,CAAC;IAClC;;;;OAIG;IACH,YAAY,CAAC,EAAE,iBAAiB,EAAE,CAAC;IACnC,4FAA4F;IAC5F,aAAa,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,yCAAyC;IACzC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,uDAAuD;IACvD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,8DAA8D;IAC9D,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,sDAAsD;IACtD,YAAY,CAAC,EAAE,SAAS,CAAC;IACzB,SAAS,CAAC,EAAE,MAAM,CAAC;CACpB;AAED;;;;;;;;;;;;;GAaG;AACH,wBAAgB,YAAY,CAAC,EAC3B,SAAS,EACT,YAAY,EACZ,aAAa,EACb,WAAuB,EACvB,UAAc,EACd,QAAY,EACZ,UAAoB,EACpB,YAA4B,EAC5B,aAAa,EACb,UAAU,EACV,eAAe,EACf,WAAW,EACX,SAAS,EACT,GAAG,IAAI,EACR,EAAE,iBAAiB,+BAuKnB"}
|
|
@@ -110,7 +110,10 @@ export function HeaderSearch({ catalogue, serverGroups, onQueryChange, placehold
|
|
|
110
110
|
}
|
|
111
111
|
}
|
|
112
112
|
};
|
|
113
|
-
return (_jsxs("div", { ...rest, className: cn('relative w-full', className), "data-cb-headersearch": '', children: [_jsxs("div", { className: 'relative', ref: refs.setReference, ...getReferenceProps(), children: [_jsx(Search, { className: 'pointer-events-none absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground', "aria-hidden": 'true' }), _jsx(Input, { type: 'search', role: 'combobox', "aria-expanded": showPanel, "aria-controls": listboxId, "aria-autocomplete": 'list', "aria-activedescendant": showPanel && activeRow ? searchOptionId(baseId, activeRow.id) : undefined, placeholder: placeholder, value: query,
|
|
113
|
+
return (_jsxs("div", { ...rest, className: cn('relative w-full', className), "data-cb-headersearch": '', children: [_jsxs("div", { className: 'relative', ref: refs.setReference, ...getReferenceProps(), children: [_jsx(Search, { className: 'pointer-events-none absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground', "aria-hidden": 'true' }), _jsx(Input, { type: 'search', role: 'combobox', "aria-expanded": showPanel, "aria-controls": listboxId, "aria-autocomplete": 'list', "aria-activedescendant": showPanel && activeRow ? searchOptionId(baseId, activeRow.id) : undefined, placeholder: placeholder, value: query,
|
|
114
|
+
// The belt's own β (below) is the clear button; a `type="search"` input draws a
|
|
115
|
+
// SECOND one natively in Chromium/Safari without this (DESIGN.md, two clear buttons).
|
|
116
|
+
className: 'pl-9 pr-9 [&::-webkit-search-cancel-button]:hidden', onChange: (e) => update(e.target.value), onFocus: () => query.trim().length >= minChars && setOpen(true), onKeyDown: onKeyDown }), query && (_jsx(IconButton, { label: 'Clear search', variant: 'ghost', onClick: clear, className: 'absolute right-2 top-1/2 size-6 -translate-y-1/2 [&_svg]:size-4', children: _jsx(X, {}) }))] }), showPanel && (_jsx(FloatingPortal, { children: _jsx("div", { ref: refs.setFloating, style: floatingStyles, ...getFloatingProps(), className: 'z-50', children: _jsx(ScrollArea, { id: listboxId, axis: 'y', safeArea: false, space: 'none', className: 'max-h-[inherit] rounded-lg border border-border bg-popover py-1 text-popover-foreground shadow-[var(--shadow-overlay)]', children: _jsx(SearchResults, { groups: groups, activeId: activeRow?.id, optionIdPrefix: baseId, emptyContent: emptyContent, linkComponent: linkComponent, onNavigate: onNavigate, onAfterNavigate: () => {
|
|
114
117
|
onAfterNavigate?.();
|
|
115
118
|
setOpen(false);
|
|
116
119
|
}, resolveIcon: resolveIcon }) }) }) }))] }));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"HeaderSearch.js","sourceRoot":"","sources":["../../../src/react/nav/HeaderSearch.tsx"],"names":[],"mappings":"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
|
|
1
|
+
{"version":3,"file":"HeaderSearch.js","sourceRoot":"","sources":["../../../src/react/nav/HeaderSearch.tsx"],"names":[],"mappings":"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"}
|
|
@@ -18,24 +18,24 @@
|
|
|
18
18
|
* after an app's responsive variant (task 2124). An app that imports every area gets exactly
|
|
19
19
|
* what `cursedbelt/styles-utilities.css` emits β proved rule by rule in
|
|
20
20
|
* src/stylesAreas.spec.ts, which is also what fails when this file is stale.
|
|
21
|
-
*
|
|
21
|
+
* 129 candidate(s).
|
|
22
22
|
*
|
|
23
23
|
* Written by scripts/generateAreaStyles.ts (`bun run styles:areas`), which
|
|
24
24
|
* `bun run build` runs. The map of what is in which area, and why the areas are
|
|
25
25
|
* import closures rather than a hand-written list, is scripts/styleAreas.ts.
|
|
26
26
|
*/
|
|
27
|
-
@source inline("-mt-5 -right-0.5 -top-0.5 -top-1 [&::-webkit-scrollbar]:hidden
|
|
28
|
-
@source inline("[
|
|
29
|
-
@source inline("[&_[cmdk-group-heading]]:
|
|
30
|
-
@source inline("[&_[cmdk-group-heading]]:text-
|
|
31
|
-
@source inline("[&_[cmdk-group-heading]]:
|
|
32
|
-
@source inline("[&_[data-cb-banner-icon]]:text-
|
|
33
|
-
@source inline("[&_svg]:size-3.5 [scrollbar-width:none]
|
|
34
|
-
@source inline("aria-checked:ring-
|
|
35
|
-
@source inline("border-border/40 border-dashed collapse
|
|
36
|
-
@source inline("data-[disabled=true]:
|
|
37
|
-
@source inline("data-[selected=true]:text-foreground disabled:hover:scale-100
|
|
38
|
-
@source inline("focus-within:opacity-100 g grid-cols-4 group-hover/navitem:opacity-100");
|
|
27
|
+
@source inline("-mt-5 -right-0.5 -top-0.5 -top-1 [&::-webkit-scrollbar]:hidden");
|
|
28
|
+
@source inline("[&::-webkit-search-cancel-button]:hidden [&>*]:min-w-0 [&_[cmdk-group-heading]]:font-semibold");
|
|
29
|
+
@source inline("[&_[cmdk-group-heading]]:px-3 [&_[cmdk-group-heading]]:py-1");
|
|
30
|
+
@source inline("[&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group-heading]]:text-xs");
|
|
31
|
+
@source inline("[&_[cmdk-group-heading]]:tracking-wide [&_[cmdk-group-heading]]:uppercase");
|
|
32
|
+
@source inline("[&_[data-cb-banner-icon]]:text-accent [&_[data-cb-banner-icon]]:text-destructive");
|
|
33
|
+
@source inline("[&_[data-cb-banner-icon]]:text-warning [&_svg]:size-3.5 [scrollbar-width:none]");
|
|
34
|
+
@source inline("aria-checked:ring-2 aria-checked:ring-foreground aria-checked:ring-offset-1 bg-accent/15");
|
|
35
|
+
@source inline("bg-card-overlay bg-destructive/10 bg-warning/10 border-border/40 border-dashed collapse");
|
|
36
|
+
@source inline("cursor-grab data-[disabled=true]:opacity-50 data-[disabled=true]:pointer-events-none");
|
|
37
|
+
@source inline("data-[selected=true]:bg-muted data-[selected=true]:text-foreground disabled:hover:scale-100");
|
|
38
|
+
@source inline("disabled:opacity-40 focus-within:opacity-100 g grid-cols-4 group-hover/navitem:opacity-100");
|
|
39
39
|
@source inline("group-hover/tile:opacity-100 group/navitem group/tile h-12 h-[var(--header-h)]");
|
|
40
40
|
@source inline("h-[var(--header-h-dense)] h-[var(--header-h-roomy)] h-dvh hover:border-foreground/20");
|
|
41
41
|
@source inline("hover:decoration-border hover:scale-110 hover:underline-offset-4 inset-x-2 inset-x-3 inset-y-1");
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "cursedbelt",
|
|
3
|
-
"version": "5.
|
|
3
|
+
"version": "5.93.0",
|
|
4
4
|
"license": "ISC",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"description": "The React design system of the cursedbelt split β components, styles, theme. cursedbelt-core below it; server tier in cursedbelt-server.",
|
|
@@ -31,6 +31,7 @@
|
|
|
31
31
|
"./react/media",
|
|
32
32
|
"./react/media-gallery",
|
|
33
33
|
"./react/media/player-strip",
|
|
34
|
+
"./react/media/picture-editor",
|
|
34
35
|
"./react/media/video-player",
|
|
35
36
|
"./react/pane-split",
|
|
36
37
|
"./react/pdf-viewer",
|
|
@@ -384,6 +385,12 @@
|
|
|
384
385
|
"source": "./src/react/media/fileUploadClient.ts",
|
|
385
386
|
"import": "./dist/react/media/fileUploadClient.js"
|
|
386
387
|
},
|
|
388
|
+
"./react/media/picture-editor": {
|
|
389
|
+
"types": "./dist/react/media/PictureEditor.d.ts",
|
|
390
|
+
"bun": "./src/react/media/PictureEditor.tsx",
|
|
391
|
+
"source": "./src/react/media/PictureEditor.tsx",
|
|
392
|
+
"import": "./dist/react/media/PictureEditor.js"
|
|
393
|
+
},
|
|
387
394
|
"./react/media/video-player": {
|
|
388
395
|
"types": "./dist/react/media/VideoPlayer.d.ts",
|
|
389
396
|
"bun": "./src/react/media/VideoPlayer.tsx",
|
|
@@ -316,6 +316,20 @@ describe('π΄ the THEME VARIABLE check β a `var()` of a theme variable no bui
|
|
|
316
316
|
expect([...variablesDeclared('@property --tw-x{syntax:"*"}.a{--b:1;color:var(--c)}')].sort()).toEqual(['--b', '--tw-x']);
|
|
317
317
|
});
|
|
318
318
|
|
|
319
|
+
test('π΄ a shadow-DOM library declaring a theme-named variable in its own CSS-in-JS string is DECLARED, not a miss (ReactionPicker/emoji-mart, forge task cursedbelt-reaction-bar-tap-floor)', () => {
|
|
320
|
+
// Verbatim in shape from emoji-mart's dist/module.js: its Picker custom element's
|
|
321
|
+
// shadow-root stylesheet, shipped as one JS string, declares --shadow on its own
|
|
322
|
+
// :host right beside the var(--shadow) that reads it β self-contained, but it
|
|
323
|
+
// happens to share a bare name with Tailwind's own theme --shadow.
|
|
324
|
+
const EMOJI_MART_JS =
|
|
325
|
+
'$exports = ":host {\\n border-radius: var(--border-radius);\\n box-shadow: var(--shadow);\\n ' +
|
|
326
|
+
'--border-radius: 10px;\\n --shadow-color: 0deg 0% 0%;\\n --shadow: .3px .5px 2.7px hsl(var(--shadow-color) / .14);\\n}\\n";';
|
|
327
|
+
const theme = new Set(['--shadow']);
|
|
328
|
+
// Without scanning JS for declarations this reported ["--shadow"] β a false positive: the
|
|
329
|
+
// declaration is real, just inside a shadow root no built CSS could ever carry.
|
|
330
|
+
expect(undefinedThemeVariables({ js: [EMOJI_MART_JS], css: [''] }, theme)).toEqual([]);
|
|
331
|
+
});
|
|
332
|
+
|
|
319
333
|
test('the CLI exits 1 on a build that reads an undeclared theme variable, naming it', async () => {
|
|
320
334
|
const dir = mkdtempSync(join(tmpdir(), 'belt-theme-var-check-'));
|
|
321
335
|
try {
|
|
@@ -341,10 +341,24 @@ export function variablesReferenced(text: string): Set<string> {
|
|
|
341
341
|
* Each one is a value that silently resolves to nothing β `var(--color-card)` as a background is
|
|
342
342
|
* transparent, not an error. A fallback (`var(--x, red)`) does not excuse one: it renders, but not
|
|
343
343
|
* as the theme says, which is the same divergence from the union.
|
|
344
|
+
*
|
|
345
|
+
* π΄ `declared` also scans the JS, not only the CSS β a web-component library (emoji-mart's
|
|
346
|
+
* `Picker`) ships its shadow-root stylesheet as a CSS-in-JS STRING inside the bundle, declaring
|
|
347
|
+
* `--shadow` on its own `:host` right next to the `var(--shadow)` that reads it. That is a real,
|
|
348
|
+
* self-contained declaration β scoped to a shadow root Tailwind never reaches, but satisfied all
|
|
349
|
+
* the same β and it happens to share a bare name (`--shadow`) with a Tailwind theme variable the
|
|
350
|
+
* app's own build never emits because nothing on the page uses the stock `shadow` utility
|
|
351
|
+
* (`ReactionPicker`/`EmojiPicker`, forge task cursedbelt-reaction-bar-tap-floor). Scanning JS text
|
|
352
|
+
* for declarations too is the general fix: any library that carries its own scoped CSS in a string
|
|
353
|
+
* is covered, not only emoji-mart. The alternative β adding a page-level `--shadow` rule to this
|
|
354
|
+
* package's own CSS to satisfy the scan β would be the special case: `--shadow` is not a cursedbelt
|
|
355
|
+
* token (the shadow scale is `--shadow-raised`/`-overlay`/`-popover`), the declaration would sit in
|
|
356
|
+
* `:root` where a shadow-DOM `:host` rule can never be reached by it anyway, and it would needlessly
|
|
357
|
+
* risk colliding with Tailwind's own default `shadow` utility if an app ever used it unqualified.
|
|
344
358
|
*/
|
|
345
359
|
export function undefinedThemeVariables(input: { js: string[]; css: string[] }, theme: ReadonlySet<string>): string[] {
|
|
346
360
|
const declared = new Set<string>();
|
|
347
|
-
for (const
|
|
361
|
+
for (const text of [...input.css, ...input.js]) for (const name of variablesDeclared(text)) declared.add(name);
|
|
348
362
|
const read = new Set<string>();
|
|
349
363
|
for (const text of [...input.js, ...input.css]) for (const name of variablesReferenced(text)) read.add(name);
|
|
350
364
|
return [...read].filter((name) => theme.has(name) && !declared.has(name)).sort();
|
|
@@ -156,6 +156,45 @@ describe('ComboboxField (async)', () => {
|
|
|
156
156
|
});
|
|
157
157
|
});
|
|
158
158
|
|
|
159
|
+
describe('ComboboxField (empty)', () => {
|
|
160
|
+
// Forge task 3691: photos' tree picker searches the family tree by name and had to opt out
|
|
161
|
+
// of `choice-needs-empty-state`, because the belt's fixed line could not say what belongs.
|
|
162
|
+
const typeNobody = (container: HTMLElement) => {
|
|
163
|
+
act(() => {
|
|
164
|
+
fireEvent.click(container.querySelector('[aria-label="Toggle options"]') as HTMLElement);
|
|
165
|
+
});
|
|
166
|
+
act(() => {
|
|
167
|
+
fireEvent.input(container.querySelector('input') as HTMLInputElement, {
|
|
168
|
+
target: { value: 'Zebedee' },
|
|
169
|
+
});
|
|
170
|
+
});
|
|
171
|
+
};
|
|
172
|
+
|
|
173
|
+
test('π΄ a search that finds nothing says the caller\'s emptyLabel, not the generic line', async () => {
|
|
174
|
+
const { container, getByText, queryByText } = render(
|
|
175
|
+
<ComboboxField
|
|
176
|
+
options={OPTIONS}
|
|
177
|
+
emptyLabel='Nobody in the tree by that name'
|
|
178
|
+
value={null}
|
|
179
|
+
onChange={() => {}}
|
|
180
|
+
/>,
|
|
181
|
+
);
|
|
182
|
+
typeNobody(container);
|
|
183
|
+
await waitFor(() => expect(getByText('Nobody in the tree by that name')).not.toBeNull(), {
|
|
184
|
+
timeout: 1000,
|
|
185
|
+
});
|
|
186
|
+
expect(queryByText('No options found')).toBeNull();
|
|
187
|
+
});
|
|
188
|
+
|
|
189
|
+
test('without one, the generic line stands in', async () => {
|
|
190
|
+
const { container, getByText } = render(
|
|
191
|
+
<ComboboxField options={OPTIONS} value={null} onChange={() => {}} />,
|
|
192
|
+
);
|
|
193
|
+
typeNobody(container);
|
|
194
|
+
await waitFor(() => expect(getByText('No options found')).not.toBeNull(), { timeout: 1000 });
|
|
195
|
+
});
|
|
196
|
+
});
|
|
197
|
+
|
|
159
198
|
describe('ComboboxField on a touch screen', () => {
|
|
160
199
|
// binary-server's design audit at 390 (forge task 2621): the multi-select's text input
|
|
161
200
|
// measured 190Γ36 β the group never took the coarse-pointer floor every other field control
|
|
@@ -2,7 +2,7 @@
|
|
|
2
2
|
|
|
3
3
|
import { Combobox } from '@base-ui/react/combobox';
|
|
4
4
|
import { Check, ChevronDown, Loader2, Plus, X } from 'lucide-react';
|
|
5
|
-
import { useCallback, useEffect, useRef, useState } from 'react';
|
|
5
|
+
import { type ReactNode, useCallback, useEffect, useRef, useState } from 'react';
|
|
6
6
|
import { cn } from '../lib/cn.js';
|
|
7
7
|
import {
|
|
8
8
|
CONTROL_HEIGHT_CLASS,
|
|
@@ -32,6 +32,15 @@ interface ComboboxBase {
|
|
|
32
32
|
loadOptions?: (query: string) => Promise<ComboboxOption[]>;
|
|
33
33
|
/** Allow typing a value that isn't in the list and creating it on the fly. */
|
|
34
34
|
creatable?: boolean;
|
|
35
|
+
/**
|
|
36
|
+
* What the list says when nothing matches β *"Nobody in the tree by that name"*.
|
|
37
|
+
*
|
|
38
|
+
* π΄ Required in practice for a combobox whose options come from DATA (`loadOptions`, or a
|
|
39
|
+
* list read from a store): the generic line cannot say what belongs here, and the
|
|
40
|
+
* `choice-needs-empty-state` guardrail reports one without it. Rendered as plain text, not
|
|
41
|
+
* as an item, so it can never be picked or keyboard-focused. Default "No options found".
|
|
42
|
+
*/
|
|
43
|
+
emptyLabel?: ReactNode;
|
|
35
44
|
placeholder?: string;
|
|
36
45
|
disabled?: boolean;
|
|
37
46
|
id?: string;
|
|
@@ -71,9 +80,10 @@ interface ListProps {
|
|
|
71
80
|
creatable: boolean;
|
|
72
81
|
query: string;
|
|
73
82
|
onCreateClick: (q: string) => void;
|
|
83
|
+
emptyLabel: ReactNode;
|
|
74
84
|
}
|
|
75
85
|
|
|
76
|
-
function ComboboxList({ creatable, query, onCreateClick }: ListProps) {
|
|
86
|
+
function ComboboxList({ creatable, query, onCreateClick, emptyLabel }: ListProps) {
|
|
77
87
|
const filtered = Combobox.useFilteredItems<ComboboxOption>();
|
|
78
88
|
const trimmed = query.trim();
|
|
79
89
|
const hasExact = filtered.some(
|
|
@@ -123,7 +133,7 @@ function ComboboxList({ creatable, query, onCreateClick }: ListProps) {
|
|
|
123
133
|
</Combobox.Item>
|
|
124
134
|
)}
|
|
125
135
|
<Combobox.Empty className='py-2 text-center text-sm text-muted-foreground'>
|
|
126
|
-
|
|
136
|
+
{emptyLabel}
|
|
127
137
|
</Combobox.Empty>
|
|
128
138
|
</Combobox.List>
|
|
129
139
|
);
|
|
@@ -148,6 +158,7 @@ export function ComboboxField(props: ComboboxFieldProps) {
|
|
|
148
158
|
options = [],
|
|
149
159
|
loadOptions,
|
|
150
160
|
creatable = false,
|
|
161
|
+
emptyLabel = 'No options found',
|
|
151
162
|
placeholder = 'Selectβ¦',
|
|
152
163
|
disabled,
|
|
153
164
|
id,
|
|
@@ -337,7 +348,12 @@ export function ComboboxField(props: ComboboxFieldProps) {
|
|
|
337
348
|
'data-[ending-style]:scale-95 data-[ending-style]:opacity-0',
|
|
338
349
|
)}
|
|
339
350
|
>
|
|
340
|
-
<ComboboxList
|
|
351
|
+
<ComboboxList
|
|
352
|
+
creatable={creatable}
|
|
353
|
+
query={query}
|
|
354
|
+
onCreateClick={handleCreate}
|
|
355
|
+
emptyLabel={emptyLabel}
|
|
356
|
+
/>
|
|
341
357
|
</Combobox.Popup>
|
|
342
358
|
</Combobox.Positioner>
|
|
343
359
|
</Combobox.Portal>
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { afterEach, describe, expect, mock, test } from 'bun:test';
|
|
2
2
|
import { cleanup, fireEvent, render } from '@testing-library/react';
|
|
3
3
|
import { type CommentData, CommentThread } from './CommentThread.js';
|
|
4
|
+
import { TAP_TARGET_HEIGHT } from '../lib/tapTarget.js';
|
|
4
5
|
|
|
5
6
|
afterEach(cleanup);
|
|
6
7
|
|
|
@@ -68,6 +69,13 @@ describe('CommentThread', () => {
|
|
|
68
69
|
expect(onPost).not.toHaveBeenCalled();
|
|
69
70
|
});
|
|
70
71
|
|
|
72
|
+
test('π΄ the composer textarea clears 44px on a coarse pointer (DESIGN.md LAY-13)', () => {
|
|
73
|
+
// At min-h-9 (36px) the composer fell short of the tap floor.
|
|
74
|
+
const { getByPlaceholderText } = render(<CommentThread comments={[]} onPost={() => {}} />);
|
|
75
|
+
const ta = getByPlaceholderText('Add a commentβ¦ (β/Ctrl+Enter to send)') as HTMLTextAreaElement;
|
|
76
|
+
expect(ta.className.split(/\s+/)).toContain(TAP_TARGET_HEIGHT);
|
|
77
|
+
});
|
|
78
|
+
|
|
71
79
|
test('shows Reply button for non-deleted comments', () => {
|
|
72
80
|
const { getAllByText } = render(<CommentThread comments={[makeComment()]} onPost={() => {}} />);
|
|
73
81
|
expect(getAllByText('Reply').length).toBeGreaterThan(0);
|
|
@@ -2,6 +2,7 @@ import { Edit2, Send, Trash2 } from 'lucide-react';
|
|
|
2
2
|
import { useState } from 'react';
|
|
3
3
|
import { cn } from '../lib/cn.js';
|
|
4
4
|
import { FIELD_CLASS } from '../lib/field.js';
|
|
5
|
+
import { TAP_TARGET_HEIGHT } from '../lib/tapTarget.js';
|
|
5
6
|
import { AutoGrowTextarea } from './AutoGrowTextarea.js';
|
|
6
7
|
import { Avatar } from './Avatar.js';
|
|
7
8
|
import { Button } from './Button.js';
|
|
@@ -109,7 +110,9 @@ function Composer({
|
|
|
109
110
|
if (e.key === 'Enter' && (e.metaKey || e.ctrlKey)) submit();
|
|
110
111
|
if (e.key === 'Escape') onCancel?.();
|
|
111
112
|
}}
|
|
112
|
-
|
|
113
|
+
// `TAP_TARGET_HEIGHT`: at `min-h-9` (36px) the composer fell short of the 44px tap
|
|
114
|
+
// floor on a coarse pointer (DESIGN.md LAY-13).
|
|
115
|
+
className={cn(FIELD_CLASS, 'min-h-9 flex-1', TAP_TARGET_HEIGHT)}
|
|
113
116
|
/>
|
|
114
117
|
<Button
|
|
115
118
|
variant='primary'
|
|
@@ -195,7 +198,7 @@ function CommentItem({
|
|
|
195
198
|
value={draft}
|
|
196
199
|
rows={1}
|
|
197
200
|
onChange={(e) => setDraft(e.target.value)}
|
|
198
|
-
className={cn(FIELD_CLASS, 'min-h-9 flex-1')}
|
|
201
|
+
className={cn(FIELD_CLASS, 'min-h-9 flex-1', TAP_TARGET_HEIGHT)}
|
|
199
202
|
/>
|
|
200
203
|
<Button
|
|
201
204
|
variant='primary'
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { afterEach, describe, expect, mock, test } from 'bun:test';
|
|
2
2
|
import { cleanup, fireEvent, render } from '@testing-library/react';
|
|
3
3
|
import { ReactionBar } from './ReactionBar.js';
|
|
4
|
+
import { TAP_TARGET } from '../lib/tapTarget.js';
|
|
4
5
|
|
|
5
6
|
afterEach(cleanup);
|
|
6
7
|
|
|
@@ -52,6 +53,13 @@ describe('ReactionBar', () => {
|
|
|
52
53
|
expect(getByLabelText('π β Alice, Bob, Carol').textContent).toContain('3');
|
|
53
54
|
});
|
|
54
55
|
|
|
56
|
+
test('π΄ every pill clears 44px on a coarse pointer (DESIGN.md LAY-13)', () => {
|
|
57
|
+
// At h-7 (28px) the pill was well under the tap floor β TAP_TARGET widens it on touch only.
|
|
58
|
+
const { getByLabelText } = render(<ReactionBar emojis={EMOJIS} onReact={() => {}} />);
|
|
59
|
+
const cls = getByLabelText('π β Alice, Bob, Carol').getAttribute('class') ?? '';
|
|
60
|
+
for (const utility of TAP_TARGET.split(' ')) expect(cls).toContain(utility);
|
|
61
|
+
});
|
|
62
|
+
|
|
55
63
|
test('empty emojis renders only the picker trigger', () => {
|
|
56
64
|
const { container, getByLabelText } = render(<ReactionBar emojis={[]} onReact={() => {}} />);
|
|
57
65
|
expect(container.querySelectorAll('button[aria-pressed]').length).toBe(0);
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { cn } from '../lib/cn.js';
|
|
2
|
+
import { TAP_TARGET } from '../lib/tapTarget.js';
|
|
2
3
|
import { ReactionPicker } from './ReactionPicker.js';
|
|
3
4
|
import { Tooltip } from './Tooltip.js';
|
|
4
5
|
import { RAW_BUTTON } from '../lib/cn.js';
|
|
@@ -44,10 +45,11 @@ export function ReactionBar({ emojis = [], myReaction, onReact, className, ...re
|
|
|
44
45
|
onClick={() => onReact(g.emoji)}
|
|
45
46
|
aria-label={`${g.emoji} β ${g.users.join(', ')}`}
|
|
46
47
|
aria-pressed={mine}
|
|
47
|
-
className={cn(RAW_BUTTON,
|
|
48
|
+
className={cn(RAW_BUTTON,
|
|
48
49
|
// h-7, the add-reaction trigger's height: at py-0.5 a pill was 22px beside
|
|
49
|
-
// the 24px trigger, one row at two heights (FND-4).
|
|
50
|
-
|
|
50
|
+
// the 24px trigger, one row at two heights (FND-4). `TAP_TARGET` grows it to
|
|
51
|
+
// 44px on a coarse pointer (DESIGN.md LAY-13) without touching the mouse size.
|
|
52
|
+
`inline-flex h-7 items-center gap-1 rounded-full border px-2.5 text-xs tabular-nums transition ${TAP_TARGET}`,
|
|
51
53
|
// text-accent-strong (cbux-101) β plain text-accent only clears 4.43:1 on this tint.
|
|
52
54
|
mine
|
|
53
55
|
? 'border-accent bg-accent/10 text-accent-strong'
|
|
@@ -4,6 +4,7 @@ import { join } from 'node:path';
|
|
|
4
4
|
import { act, cleanup, fireEvent, render, waitFor } from '@testing-library/react';
|
|
5
5
|
import { useState } from 'react';
|
|
6
6
|
import { preloadSuggestingTagsInput, TagsInput } from './TagsInput.js';
|
|
7
|
+
import { TAP_TARGET_HEIGHT } from '../lib/tapTarget.js';
|
|
7
8
|
|
|
8
9
|
afterEach(cleanup);
|
|
9
10
|
|
|
@@ -80,6 +81,14 @@ describe('TagsInput', () => {
|
|
|
80
81
|
fireEvent.blur(input);
|
|
81
82
|
expect(json(container)).toEqual(['late']);
|
|
82
83
|
});
|
|
84
|
+
|
|
85
|
+
test('π΄ the draft field clears 44px on a coarse pointer (DESIGN.md LAY-13)', () => {
|
|
86
|
+
// At py-0.5 the draft input was 28px tall on a coarse pointer β under the tap floor.
|
|
87
|
+
const { container } = render(<TagsInput value={[]} onChange={() => {}} aria-label='Tags' />);
|
|
88
|
+
const input = container.querySelector('input') as HTMLInputElement;
|
|
89
|
+
const cls = (input.getAttribute('class') ?? '').split(/\s+/);
|
|
90
|
+
expect(cls).toContain(TAP_TARGET_HEIGHT);
|
|
91
|
+
});
|
|
83
92
|
});
|
|
84
93
|
|
|
85
94
|
/**
|
|
@@ -2,6 +2,7 @@ import { X } from 'lucide-react';
|
|
|
2
2
|
import { type ComponentType, type KeyboardEvent, useEffect, useRef, useState } from 'react';
|
|
3
3
|
import { cn } from '../lib/cn.js';
|
|
4
4
|
import { CONTROL_MIN_HEIGHT_CLASS, type ControlSize } from '../lib/field.js';
|
|
5
|
+
import { TAP_TARGET_HEIGHT } from '../lib/tapTarget.js';
|
|
5
6
|
import { IconButton } from './IconButton.js';
|
|
6
7
|
|
|
7
8
|
export interface TagsInputProps {
|
|
@@ -100,8 +101,11 @@ export function tagsRowClass(size: ControlSize, disabled: boolean | undefined, c
|
|
|
100
101
|
);
|
|
101
102
|
}
|
|
102
103
|
|
|
104
|
+
// `TAP_TARGET_HEIGHT`: at `py-0.5` the draft input was 28px tall on a coarse pointer, under the
|
|
105
|
+
// 44px tap floor (DESIGN.md LAY-13) β the row itself grows with it since this input is a flex
|
|
106
|
+
// child of `tagsRowClass`'s `items-center` row.
|
|
103
107
|
export const TAGS_INPUT_CLASS =
|
|
104
|
-
|
|
108
|
+
`min-w-24 flex-1 bg-transparent py-0.5 text-base text-field-fg outline-none placeholder:text-field-placeholder sm:pointer-fine:text-sm ${TAP_TARGET_HEIGHT}`;
|
|
105
109
|
|
|
106
110
|
/** The committed tags as removable chips. */
|
|
107
111
|
// no-attribute-forward: a list of chips with no element of its own β the row it sits in takes the caller's attributes
|
|
@@ -110,20 +110,21 @@ describe('useScrollMemory', () => {
|
|
|
110
110
|
*/
|
|
111
111
|
test('a list growing page by page is followed past the deadline, as long as each page lands within it', async () => {
|
|
112
112
|
const s = fakeScroller(20_000);
|
|
113
|
-
const { rerender } = render(<Shell at='/' el={s.el} deadlineMs={
|
|
113
|
+
const { rerender } = render(<Shell at='/' el={s.el} deadlineMs={400} />);
|
|
114
114
|
s.scrollTo(15_000);
|
|
115
115
|
const list = { state: window.history.state, path: '/' };
|
|
116
116
|
push('/item/7');
|
|
117
|
-
rerender(<Shell at='/item/7' el={s.el} deadlineMs={
|
|
117
|
+
rerender(<Shell at='/item/7' el={s.el} deadlineMs={400} />);
|
|
118
118
|
|
|
119
119
|
s.grow(3_000);
|
|
120
120
|
back(list);
|
|
121
|
-
rerender(<Shell at='/' el={s.el} deadlineMs={
|
|
122
|
-
// Eight pages,
|
|
123
|
-
//
|
|
124
|
-
// went red under a
|
|
121
|
+
rerender(<Shell at='/' el={s.el} deadlineMs={400} />);
|
|
122
|
+
// Eight pages, 100ms apart: 800ms in all β twice the 400ms deadline from the start, and 300ms
|
|
123
|
+
// of slack before any gap reaches it. Slack is what a loaded machine eats, in absolute time:
|
|
124
|
+
// a 60ms deadline over 40ms sleeps went red under a full gate on 2026-10-13, and 150ms over
|
|
125
|
+
// 40ms (110ms of slack) went red again on 2026-10-24 with two repos' gates running at once.
|
|
125
126
|
for (const height of [5_000, 7_000, 9_000, 11_000, 13_000, 15_000, 17_000, 20_000]) {
|
|
126
|
-
await act(() => Bun.sleep(
|
|
127
|
+
await act(() => Bun.sleep(100));
|
|
127
128
|
s.grow(height);
|
|
128
129
|
}
|
|
129
130
|
await frames(2);
|
|
@@ -189,7 +189,9 @@ export function HeaderSearch({
|
|
|
189
189
|
}
|
|
190
190
|
placeholder={placeholder}
|
|
191
191
|
value={query}
|
|
192
|
-
|
|
192
|
+
// The belt's own β (below) is the clear button; a `type="search"` input draws a
|
|
193
|
+
// SECOND one natively in Chromium/Safari without this (DESIGN.md, two clear buttons).
|
|
194
|
+
className='pl-9 pr-9 [&::-webkit-search-cancel-button]:hidden'
|
|
193
195
|
onChange={(e) => update(e.target.value)}
|
|
194
196
|
onFocus={() => query.trim().length >= minChars && setOpen(true)}
|
|
195
197
|
onKeyDown={onKeyDown}
|
|
@@ -315,6 +315,12 @@ describe('HeaderSearch', () => {
|
|
|
315
315
|
expect(onNavigate).toHaveBeenCalledWith('/env-sets');
|
|
316
316
|
});
|
|
317
317
|
|
|
318
|
+
test('π΄ the native search-cancel button is hidden β the belt draws its own β, never two', () => {
|
|
319
|
+
const { container } = render(<HeaderSearch catalogue={catalogue} onNavigate={() => {}} />);
|
|
320
|
+
const input = container.querySelector('input[type="search"]') as HTMLInputElement;
|
|
321
|
+
expect(input.className).toContain('[&::-webkit-search-cancel-button]:hidden');
|
|
322
|
+
});
|
|
323
|
+
|
|
318
324
|
test('blank query shows no panel', () => {
|
|
319
325
|
const { container } = render(<HeaderSearch catalogue={catalogue} onNavigate={() => {}} />);
|
|
320
326
|
expect(container.querySelector('[role="listbox"]')).toBeNull();
|
package/src/styles-areas/nav.css
CHANGED
|
@@ -18,24 +18,24 @@
|
|
|
18
18
|
* after an app's responsive variant (task 2124). An app that imports every area gets exactly
|
|
19
19
|
* what `cursedbelt/styles-utilities.css` emits β proved rule by rule in
|
|
20
20
|
* src/stylesAreas.spec.ts, which is also what fails when this file is stale.
|
|
21
|
-
*
|
|
21
|
+
* 129 candidate(s).
|
|
22
22
|
*
|
|
23
23
|
* Written by scripts/generateAreaStyles.ts (`bun run styles:areas`), which
|
|
24
24
|
* `bun run build` runs. The map of what is in which area, and why the areas are
|
|
25
25
|
* import closures rather than a hand-written list, is scripts/styleAreas.ts.
|
|
26
26
|
*/
|
|
27
|
-
@source inline("-mt-5 -right-0.5 -top-0.5 -top-1 [&::-webkit-scrollbar]:hidden
|
|
28
|
-
@source inline("[
|
|
29
|
-
@source inline("[&_[cmdk-group-heading]]:
|
|
30
|
-
@source inline("[&_[cmdk-group-heading]]:text-
|
|
31
|
-
@source inline("[&_[cmdk-group-heading]]:
|
|
32
|
-
@source inline("[&_[data-cb-banner-icon]]:text-
|
|
33
|
-
@source inline("[&_svg]:size-3.5 [scrollbar-width:none]
|
|
34
|
-
@source inline("aria-checked:ring-
|
|
35
|
-
@source inline("border-border/40 border-dashed collapse
|
|
36
|
-
@source inline("data-[disabled=true]:
|
|
37
|
-
@source inline("data-[selected=true]:text-foreground disabled:hover:scale-100
|
|
38
|
-
@source inline("focus-within:opacity-100 g grid-cols-4 group-hover/navitem:opacity-100");
|
|
27
|
+
@source inline("-mt-5 -right-0.5 -top-0.5 -top-1 [&::-webkit-scrollbar]:hidden");
|
|
28
|
+
@source inline("[&::-webkit-search-cancel-button]:hidden [&>*]:min-w-0 [&_[cmdk-group-heading]]:font-semibold");
|
|
29
|
+
@source inline("[&_[cmdk-group-heading]]:px-3 [&_[cmdk-group-heading]]:py-1");
|
|
30
|
+
@source inline("[&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group-heading]]:text-xs");
|
|
31
|
+
@source inline("[&_[cmdk-group-heading]]:tracking-wide [&_[cmdk-group-heading]]:uppercase");
|
|
32
|
+
@source inline("[&_[data-cb-banner-icon]]:text-accent [&_[data-cb-banner-icon]]:text-destructive");
|
|
33
|
+
@source inline("[&_[data-cb-banner-icon]]:text-warning [&_svg]:size-3.5 [scrollbar-width:none]");
|
|
34
|
+
@source inline("aria-checked:ring-2 aria-checked:ring-foreground aria-checked:ring-offset-1 bg-accent/15");
|
|
35
|
+
@source inline("bg-card-overlay bg-destructive/10 bg-warning/10 border-border/40 border-dashed collapse");
|
|
36
|
+
@source inline("cursor-grab data-[disabled=true]:opacity-50 data-[disabled=true]:pointer-events-none");
|
|
37
|
+
@source inline("data-[selected=true]:bg-muted data-[selected=true]:text-foreground disabled:hover:scale-100");
|
|
38
|
+
@source inline("disabled:opacity-40 focus-within:opacity-100 g grid-cols-4 group-hover/navitem:opacity-100");
|
|
39
39
|
@source inline("group-hover/tile:opacity-100 group/navitem group/tile h-12 h-[var(--header-h)]");
|
|
40
40
|
@source inline("h-[var(--header-h-dense)] h-[var(--header-h-roomy)] h-dvh hover:border-foreground/20");
|
|
41
41
|
@source inline("hover:decoration-border hover:scale-110 hover:underline-offset-4 inset-x-2 inset-x-3 inset-y-1");
|