@stapel/search-react 0.37.0 → 0.39.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/CHANGELOG.md +92 -0
- package/dist/default/PartitionChips.d.ts +55 -0
- package/dist/default/PartitionChips.d.ts.map +1 -1
- package/dist/default/PartitionChips.js +59 -4
- package/dist/default/PartitionChips.js.map +1 -1
- package/dist/default/SearchPage.d.ts +101 -15
- package/dist/default/SearchPage.d.ts.map +1 -1
- package/dist/default/SearchPage.js +131 -38
- package/dist/default/SearchPage.js.map +1 -1
- package/dist/default/index.d.ts +3 -3
- package/dist/default/index.d.ts.map +1 -1
- package/dist/default/index.js +1 -1
- package/dist/default/index.js.map +1 -1
- package/llms.txt +3 -3
- package/manifest.json +4 -1
- package/nav-manifest.json +1 -1
- package/package.json +5 -5
- package/src/analytics/generated/events.json +1 -1
- package/src/default/PartitionChips.tsx +164 -4
- package/src/default/SearchPage.tsx +215 -40
- package/src/default/index.ts +13 -1
package/CHANGELOG.md
CHANGED
|
@@ -1,5 +1,97 @@
|
|
|
1
1
|
# @stapel/search-react
|
|
2
2
|
|
|
3
|
+
## 0.39.0
|
|
4
|
+
|
|
5
|
+
### Minor Changes
|
|
6
|
+
|
|
7
|
+
- 97c14d9: A pointer is not a section of this template.
|
|
8
|
+
|
|
9
|
+
From the owner's read of 0.38.0 on the stand: the storefront's car page drew
|
|
10
|
+
`All | New 0 | Used 3 | Car rental 0`. Two of those zeroes were a section's
|
|
11
|
+
real emptiness. The third was a count of a wholly different branch of the
|
|
12
|
+
catalogue, under a chip that would have filtered this page by an id path into
|
|
13
|
+
that branch.
|
|
14
|
+
|
|
15
|
+
A partition is one template split by a value its children's names express —
|
|
16
|
+
new / used / for rent. A POINTER (`CategoryChild.linked`, stapel-categories
|
|
17
|
+
0.22.0) is another category an operator drew among these children so a person
|
|
18
|
+
can reach it from here. It does not narrow this feed and it has no count of its
|
|
19
|
+
own.
|
|
20
|
+
|
|
21
|
+
`PartitionChild` gains `linked?: boolean` and `href?: string`, and
|
|
22
|
+
`<PartitionChips>` splits its items ONCE, above everything that reads them: the
|
|
23
|
+
cells, the roving stop, the value lookup and the arrow keys see only the
|
|
24
|
+
SECTIONS. So a linked child can never be a radio, never draws a count (even
|
|
25
|
+
when a host maps its rows mechanically and hands one over), and never matches
|
|
26
|
+
`value` — a stale address naming a pointer leaves the row on its parent chip
|
|
27
|
+
instead of lighting a pointer up as the chosen section.
|
|
28
|
+
|
|
29
|
+
`<PartitionChips linkedChildren>` decides what happens to the pointer itself:
|
|
30
|
+
|
|
31
|
+
- `"chip"` (default) draws it AFTER the partitions, in its own row outside the
|
|
32
|
+
radiogroup — a `role="radiogroup"` containing a link announces a choice with
|
|
33
|
+
an option nobody can choose. It is an outlined pill (a hairline, no fill: it
|
|
34
|
+
is a way out of this page, not one of the choices on it) carrying the
|
|
35
|
+
target's name and a trailing arrow, and it is a real `<a href>`, so a
|
|
36
|
+
middle-click or a ctrl/cmd-click opens the target in a new tab and nothing on
|
|
37
|
+
this page changes. A linked entry with no `href` is not drawn at all — a link
|
|
38
|
+
with no address is not a link — and is still out of the partition either way.
|
|
39
|
+
- `"none"` omits it here, for a page whose TILE STAGE already shows the same
|
|
40
|
+
destination as a tile: one destination offered twice, a row apart, is a
|
|
41
|
+
person wondering what the difference is.
|
|
42
|
+
|
|
43
|
+
A row with no pointers renders exactly what it rendered before, with no extra
|
|
44
|
+
box around it.
|
|
45
|
+
|
|
46
|
+
The `default` size budget goes 32.75 → 33.25 KB, measured and written into the
|
|
47
|
+
entry's own note (32539 → 32779 B, dependencies held constant): 29 B over the
|
|
48
|
+
old line, and a ceiling that fails on 29 B of a shipped defect fix is a gate
|
|
49
|
+
proving nothing.
|
|
50
|
+
|
|
51
|
+
## 0.38.0
|
|
52
|
+
|
|
53
|
+
### Minor Changes
|
|
54
|
+
|
|
55
|
+
- 552cca2: The rail's scrollbar is the skin's, and one token spaces every block on the page.
|
|
56
|
+
|
|
57
|
+
Two findings from a walk of a live storefront's category page in the dark
|
|
58
|
+
theme, both of them a decision nobody had taken.
|
|
59
|
+
|
|
60
|
+
**`<SearchPage railScrollbar>`** — default `"styled"`. The rail stays its own
|
|
61
|
+
scroll container: filters that stay put while the results move under them are
|
|
62
|
+
the whole point of it, and a page that scrolled for the rail would send a person
|
|
63
|
+
back up to the controls after every tick. What was never decided is the BAR. An
|
|
64
|
+
`overflow-y: auto` box gets the platform's, and the platform's is a grey chrome
|
|
65
|
+
strip standing beside the filters. `"styled"` replaces it with the skin's own,
|
|
66
|
+
from the tokens, in both themes: a 6px track, no arrows, no track fill, and a
|
|
67
|
+
thumb that is transparent at rest and arrives on `:hover` of the rail (a pointer
|
|
68
|
+
scrolling inside it) and on `:focus-within` (a keyboard doing the same), with
|
|
69
|
+
`scrollbar-gutter: stable` so the panel's right edge does not move when it
|
|
70
|
+
appears. Both vendor forms, because they are not alternatives — Firefox reads
|
|
71
|
+
`scrollbar-width`/`scrollbar-color`, WebKit reads the `::-webkit-scrollbar`
|
|
72
|
+
pseudo-elements — and under `(pointer: coarse)`, where neither hover nor focus
|
|
73
|
+
ever fires, the thumb stands. `railScrollbar="system"` hands the port back to the
|
|
74
|
+
platform untouched and mounts no rule set at all. `RAIL_SCROLLBAR_CLASS` and
|
|
75
|
+
`railScrollbarCss()` are exported for a host that mounts the panel itself.
|
|
76
|
+
|
|
77
|
+
**`<SearchPage blockRhythm>`** — default `"token"`. The distance between two
|
|
78
|
+
blocks on this page was `spacing[4]` written inline on the root `<Flex>`: 16px
|
|
79
|
+
is a form's field spacing, not a page's section spacing, and the blocks read as
|
|
80
|
+
one column with no seams. Every gap now comes from ONE pair of custom
|
|
81
|
+
properties, declared as a usage and not as a definition —
|
|
82
|
+
`var(--stapel-block-gap, 32px)`, and `var(--stapel-block-gap-compact, 24px)` on a
|
|
83
|
+
coarse pointer or under the tablet edge — so a host, a container or a brand sets
|
|
84
|
+
the property once, anywhere above the page, and every block moves together. Each
|
|
85
|
+
direct block's outer margin is reset in the same rule set, because a block with a
|
|
86
|
+
margin of its own is a second opinion about a distance the gap already states.
|
|
87
|
+
`@stapel/categories-react` declares the same two property names, so one
|
|
88
|
+
declaration tunes both halves of a category screen. `blockRhythm="legacy"`
|
|
89
|
+
restores the flat inline gap for a host whose layout was measured against it.
|
|
90
|
+
|
|
91
|
+
Both defaults are the NEW behaviour on purpose: neither the system scrollbar nor
|
|
92
|
+
the 16px gap was a design anybody chose — they are what a scroll port and a
|
|
93
|
+
vertical `<Flex>` do when nobody says otherwise.
|
|
94
|
+
|
|
3
95
|
## 0.37.0
|
|
4
96
|
|
|
5
97
|
### Minor Changes
|
|
@@ -20,9 +20,46 @@ export interface PartitionChild {
|
|
|
20
20
|
*
|
|
21
21
|
* Omit it and nothing is drawn — an absent count is not a zero, and a
|
|
22
22
|
* section whose total nobody asked for must not be captioned "0".
|
|
23
|
+
*
|
|
24
|
+
* Ignored on a POINTER — see {@link linked}.
|
|
23
25
|
*/
|
|
24
26
|
readonly count?: number;
|
|
27
|
+
/**
|
|
28
|
+
* This entry is a POINTER to another category, not a section of THIS
|
|
29
|
+
* template (`CategoryChild.linked`, stapel-categories 0.22.0).
|
|
30
|
+
*
|
|
31
|
+
* A partition is one template split by a value its children's names express
|
|
32
|
+
* — new / used / for rent. A pointer is a different branch of the catalogue
|
|
33
|
+
* that an operator drew among these children so a person can reach it from
|
|
34
|
+
* here. It is not one of the halves, it does not narrow this feed, and it
|
|
35
|
+
* has NO count of its own: the number beside it is the number of listings in
|
|
36
|
+
* somebody else's category, which is why the storefront's
|
|
37
|
+
* `/c/transport-avtomobili` read `All | New 0 | Used 3 | Car rental 0`
|
|
38
|
+
* — two of those zeroes were a partition's real emptiness and one was a
|
|
39
|
+
* question nobody had asked.
|
|
40
|
+
*
|
|
41
|
+
* So a linked entry never becomes a radio, never carries a count, and never
|
|
42
|
+
* matches {@link PartitionChipsProps.value} — a stale address naming one
|
|
43
|
+
* leaves the row on its parent chip rather than lighting a pointer up as the
|
|
44
|
+
* chosen section. It is drawn AFTER the partitions as a link, or not at all:
|
|
45
|
+
* see {@link PartitionChipsProps.linkedChildren}.
|
|
46
|
+
*/
|
|
47
|
+
readonly linked?: boolean;
|
|
48
|
+
/**
|
|
49
|
+
* WHERE a pointer leads — the target's own address, as the host builds it
|
|
50
|
+
* (`/c/<slug>`). Read only on a {@link linked} entry.
|
|
51
|
+
*
|
|
52
|
+
* The pointer's `path` is an id path into the CATALOGUE, and following it
|
|
53
|
+
* as a `category` filter is exactly the confusion this shape exists to end:
|
|
54
|
+
* a pointer is a destination, so the chip is a real `<a href>` that
|
|
55
|
+
* navigates, with no `f=` and no state change on this page. A linked entry
|
|
56
|
+
* with no `href` is not drawn — a link with no address is not a link.
|
|
57
|
+
*/
|
|
58
|
+
readonly href?: string;
|
|
25
59
|
}
|
|
60
|
+
/** What the row does with a POINTER among its children — see
|
|
61
|
+
* {@link PartitionChipsProps.linkedChildren}. */
|
|
62
|
+
export type PartitionLinkedChildren = "chip" | "none";
|
|
26
63
|
export interface PartitionChipsProps {
|
|
27
64
|
/** The children, in the order the catalogue declares them. */
|
|
28
65
|
readonly items: readonly PartitionChild[];
|
|
@@ -47,6 +84,24 @@ export interface PartitionChipsProps {
|
|
|
47
84
|
* browser's own `input[type=radio]` in `segmented`.
|
|
48
85
|
*/
|
|
49
86
|
readonly variant?: "chips" | "segmented";
|
|
87
|
+
/**
|
|
88
|
+
* What the row does with a POINTER among its children. Default `"chip"`.
|
|
89
|
+
*
|
|
90
|
+
* - `"chip"` — drawn AFTER the partitions as an outlined link chip: the
|
|
91
|
+
* target's name and a trailing arrow, no count, a real `<a href>` that
|
|
92
|
+
* navigates to the target rather than filtering this page. Outlined and
|
|
93
|
+
* separate on purpose — it is not one of the choices, and a control that
|
|
94
|
+
* looks like the others while doing something else is worse than one
|
|
95
|
+
* that looks different;
|
|
96
|
+
* - `"none"` — not drawn here at all, for a page whose TILE STAGE already
|
|
97
|
+
* shows the same pointer as a tile. One destination offered twice, a row
|
|
98
|
+
* apart, is a person wondering what the difference is.
|
|
99
|
+
*
|
|
100
|
+
* Either way a pointer is out of the partition semantics: no radio, no
|
|
101
|
+
* count, never the chosen section. This prop only decides whether the link
|
|
102
|
+
* is offered in this row.
|
|
103
|
+
*/
|
|
104
|
+
readonly linkedChildren?: PartitionLinkedChildren;
|
|
50
105
|
}
|
|
51
106
|
export declare function PartitionChips(props: PartitionChipsProps): ReactElement;
|
|
52
107
|
//# sourceMappingURL=PartitionChips.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PartitionChips.d.ts","sourceRoot":"","sources":["../../src/default/PartitionChips.tsx"],"names":[],"mappings":"AAmDA,OAAO,KAAK,EAGV,YAAY,EACZ,SAAS,EACV,MAAM,OAAO,CAAC;AAMf;;oDAEoD;AACpD,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IAC7B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB
|
|
1
|
+
{"version":3,"file":"PartitionChips.d.ts","sourceRoot":"","sources":["../../src/default/PartitionChips.tsx"],"names":[],"mappings":"AAmDA,OAAO,KAAK,EAGV,YAAY,EACZ,SAAS,EACV,MAAM,OAAO,CAAC;AAMf;;oDAEoD;AACpD,MAAM,WAAW,cAAc;IAC7B,QAAQ,CAAC,EAAE,EAAE,MAAM,GAAG,MAAM,CAAC;IAC7B,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC;IACtB;;;;;;;;;;;;;;;;OAgBG;IACH,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB;;;;;;;;;;;;;;;;;;;OAmBG;IACH,QAAQ,CAAC,MAAM,CAAC,EAAE,OAAO,CAAC;IAC1B;;;;;;;;;OASG;IACH,QAAQ,CAAC,IAAI,CAAC,EAAE,MAAM,CAAC;CACxB;AAED;iDACiD;AACjD,MAAM,MAAM,uBAAuB,GAAG,MAAM,GAAG,MAAM,CAAC;AAEtD,MAAM,WAAW,mBAAmB;IAClC,8DAA8D;IAC9D,QAAQ,CAAC,KAAK,EAAE,SAAS,cAAc,EAAE,CAAC;IAC1C;iFAC6E;IAC7E,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,QAAQ,CAAC,QAAQ,EAAE,CAAC,IAAI,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACjD,kEAAkE;IAClE,QAAQ,CAAC,QAAQ,CAAC,EAAE,SAAS,CAAC;IAC9B,uEAAuE;IACvE,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB;;;;;;;;;;;OAWG;IACH,QAAQ,CAAC,OAAO,CAAC,EAAE,OAAO,GAAG,WAAW,CAAC;IACzC;;;;;;;;;;;;;;;;OAgBG;IACH,QAAQ,CAAC,cAAc,CAAC,EAAE,uBAAuB,CAAC;CACnD;AA6KD,wBAAgB,cAAc,CAAC,KAAK,EAAE,mBAAmB,GAAG,YAAY,CA2LvE"}
|
|
@@ -52,7 +52,7 @@ import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-run
|
|
|
52
52
|
import { useEffect, useRef } from "react";
|
|
53
53
|
import { Button, Segmented, Typography } from "antd";
|
|
54
54
|
import { useT } from "@stapel/core";
|
|
55
|
-
import { radii, spacing } from "@stapel/tokens";
|
|
55
|
+
import { cssVar, radii, spacing } from "@stapel/tokens";
|
|
56
56
|
import { SEARCH_I18N_KEYS } from "../i18n/keys.js";
|
|
57
57
|
/**
|
|
58
58
|
* The `value` of the parent cell inside the segmented control. `null` is this
|
|
@@ -67,6 +67,22 @@ const ROW = {
|
|
|
67
67
|
flexWrap: "wrap",
|
|
68
68
|
gap: spacing[2],
|
|
69
69
|
};
|
|
70
|
+
/**
|
|
71
|
+
* The pointer chip: the partition pill's geometry, OUTLINED — a hairline and
|
|
72
|
+
* no fill, so it reads as a way out of this page rather than as one of the
|
|
73
|
+
* choices on it.
|
|
74
|
+
*/
|
|
75
|
+
const POINTER_CHIP = {
|
|
76
|
+
display: "inline-flex",
|
|
77
|
+
alignItems: "center",
|
|
78
|
+
gap: spacing[1],
|
|
79
|
+
borderRadius: radii.full,
|
|
80
|
+
border: `1px solid ${cssVar("border")}`,
|
|
81
|
+
paddingBlock: spacing[1],
|
|
82
|
+
paddingInline: spacing[3],
|
|
83
|
+
color: cssVar("text"),
|
|
84
|
+
lineHeight: 1.4,
|
|
85
|
+
};
|
|
70
86
|
/** The keys that move the choice, in both variants. */
|
|
71
87
|
const ARROW_KEYS = new Set(["ArrowLeft", "ArrowRight", "ArrowUp", "ArrowDown"]);
|
|
72
88
|
/**
|
|
@@ -116,6 +132,32 @@ function ChildLabel(props) {
|
|
|
116
132
|
return _jsx(_Fragment, { children: child.name });
|
|
117
133
|
return (_jsxs(_Fragment, { children: [child.name, " ", _jsx(Typography.Text, { type: "secondary", "data-testid": `partition-count-${child.path}`, children: child.count })] }));
|
|
118
134
|
}
|
|
135
|
+
/**
|
|
136
|
+
* The pointer chip's trailing mark — an arrow leaving to the right, the one
|
|
137
|
+
* glyph that says "this goes somewhere else" rather than "this narrows what
|
|
138
|
+
* is here".
|
|
139
|
+
*
|
|
140
|
+
* Drawn inline in `currentColor`, like every other glyph in this skin
|
|
141
|
+
* (`ChevronGlyph`, `PinGlyph`, `SlidersGlyph`): this package ships no icon set
|
|
142
|
+
* and one arrow is not the reason to take one. `aria-hidden`, because the
|
|
143
|
+
* chip's accessible name is the target's own — a screen reader announcing an
|
|
144
|
+
* arrow after it would be reading the decoration.
|
|
145
|
+
*/
|
|
146
|
+
function PointerGlyph() {
|
|
147
|
+
return (_jsx("svg", { "aria-hidden": "true", focusable: "false", viewBox: "0 0 16 16", width: "1em", height: "1em", style: { flex: "0 0 auto" }, children: _jsx("path", { d: "M6 3.5 10.5 8 6 12.5", fill: "none", stroke: "currentColor", strokeWidth: "1.75", strokeLinecap: "round", strokeLinejoin: "round" }) }));
|
|
148
|
+
}
|
|
149
|
+
/**
|
|
150
|
+
* The pointers, after the partitions and outside the radiogroup.
|
|
151
|
+
*
|
|
152
|
+
* OUTSIDE is not a layout preference: a `role="radiogroup"` whose children
|
|
153
|
+
* include a link announces a choice that has an option you cannot choose. The
|
|
154
|
+
* pointers are their own row, and each one is an ordinary anchor — a
|
|
155
|
+
* middle-click, a ctrl/cmd-click and "open in a new tab" all work, which is
|
|
156
|
+
* the whole difference between a destination and a filter.
|
|
157
|
+
*/
|
|
158
|
+
function PointerChips(props) {
|
|
159
|
+
return (_jsx("div", { style: ROW, "data-testid": "partition-links", children: props.items.map((item) => (_jsxs("a", { href: item.href, style: POINTER_CHIP, "data-testid": `partition-link-${item.path}`, children: [item.name, _jsx(PointerGlyph, {})] }, item.path))) }));
|
|
160
|
+
}
|
|
119
161
|
/** The row's cells, as `[value, label]` — the parent first, then the
|
|
120
162
|
* children in catalogue order. */
|
|
121
163
|
function cells(items, allLabel) {
|
|
@@ -127,7 +169,15 @@ function cells(items, allLabel) {
|
|
|
127
169
|
export function PartitionChips(props) {
|
|
128
170
|
const t = useT();
|
|
129
171
|
const row = useRef(null);
|
|
130
|
-
|
|
172
|
+
/* THE TWO KINDS OF CHILD, SPLIT ONCE. Everything below the split — the
|
|
173
|
+
cells, the roving stop, the value lookup, the arrow keys — sees only the
|
|
174
|
+
SECTIONS, which is what keeps a pointer out of the partition's semantics
|
|
175
|
+
rather than out of one rendering of them. */
|
|
176
|
+
const sections = props.items.filter((item) => item.linked !== true);
|
|
177
|
+
const pointers = props.linkedChildren === "none"
|
|
178
|
+
? []
|
|
179
|
+
: props.items.filter((item) => item.linked === true && item.href !== undefined);
|
|
180
|
+
const options = cells(sections, props.allLabel ?? t(SEARCH_I18N_KEYS.partitionAll));
|
|
131
181
|
/**
|
|
132
182
|
* Arrow keys move the choice AND the focus, which is what a radiogroup
|
|
133
183
|
* does: in a single-select row the focused option is the selected one, so
|
|
@@ -195,6 +245,11 @@ export function PartitionChips(props) {
|
|
|
195
245
|
cells_[stop]?.focus();
|
|
196
246
|
}, [props.value, stop]);
|
|
197
247
|
const name = props.label ?? t(SEARCH_I18N_KEYS.partitionLabel);
|
|
248
|
+
/* The pointers ride BESIDE whichever control was drawn, never inside it —
|
|
249
|
+
see `PointerChips`. A fragment rather than a wrapper element: this row is
|
|
250
|
+
mounted in a vertical `<Flex>` that already spaces its children, and an
|
|
251
|
+
extra box here would take that gap away from the row it wraps. */
|
|
252
|
+
const withPointers = (control) => pointers.length === 0 ? (control) : (_jsxs(_Fragment, { children: [control, _jsx(PointerChips, { items: pointers })] }));
|
|
198
253
|
if (props.variant === "segmented") {
|
|
199
254
|
// antd's own control: `.ant-segmented`, one `input[type=radio]` per cell
|
|
200
255
|
// under a shared `name`, the selected cell's `checked`, and the arrow keys
|
|
@@ -202,7 +257,7 @@ export function PartitionChips(props) {
|
|
|
202
257
|
// `aria-label` reach the root because the component spreads what it is
|
|
203
258
|
// given over its own defaults (which are `radiogroup` and the string
|
|
204
259
|
// "segmented control").
|
|
205
|
-
return (_jsx(Segmented, { block: true, size: "small", ref: row, role: "radiogroup", "aria-label": name, "data-variant": "segmented", "data-testid": "partition-chips",
|
|
260
|
+
return withPointers(_jsx(Segmented, { block: true, size: "small", ref: row, role: "radiogroup", "aria-label": name, "data-variant": "segmented", "data-testid": "partition-chips",
|
|
206
261
|
/* The keypress is noted where it HAPPENS, before antd's own handler
|
|
207
262
|
turns it into a value change and the host turns that into a
|
|
208
263
|
navigation. Capture, because the cell's `input` is where the event
|
|
@@ -221,7 +276,7 @@ export function PartitionChips(props) {
|
|
|
221
276
|
props.onChange(next === ALL ? null : String(next));
|
|
222
277
|
} }));
|
|
223
278
|
}
|
|
224
|
-
return (_jsx("div", { style: ROW, "data-variant": "chips", ref: row, role: "radiogroup", "aria-label": name, "data-testid": "partition-chips", children: options.map(([value, label], index) => {
|
|
279
|
+
return withPointers(_jsx("div", { style: ROW, "data-variant": "chips", ref: row, role: "radiogroup", "aria-label": name, "data-testid": "partition-chips", children: options.map(([value, label], index) => {
|
|
225
280
|
const selected = value === props.value;
|
|
226
281
|
return (_jsx(Button, { size: "small", shape: "round", type: selected ? "primary" : "default", role: "radio", "aria-checked": selected,
|
|
227
282
|
// Roving tabindex: the row is ONE Tab stop and it lands on the
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PartitionChips.js","sourceRoot":"","sources":["../../src/default/PartitionChips.tsx"],"names":[],"mappings":";AAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAiDG;AACH,OAAO,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,OAAO,CAAC;AAO1C,OAAO,EAAE,MAAM,EAAE,SAAS,EAAE,UAAU,EAAE,MAAM,MAAM,CAAC;AACrD,OAAO,EAAE,IAAI,EAAE,MAAM,cAAc,CAAC;AACpC,OAAO,EAAE,KAAK,EAAE,OAAO,EAAE,MAAM,gBAAgB,CAAC;
|
|
1
|
+
{"version":3,"file":"PartitionChips.js","sourceRoot":"","sources":["../../src/default/PartitionChips.tsx"],"names":[],"mappings":"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"}
|
|
@@ -101,27 +101,49 @@ export declare const FILTERS_RAIL_WIDTH = 280;
|
|
|
101
101
|
* `alignSelf: flex-start` is load-bearing: a flex child stretches to the row's
|
|
102
102
|
* height by default, and a stretched box has nothing to stick to.
|
|
103
103
|
*/
|
|
104
|
-
/** The class the rail's own scrollbar rules are hung on. */
|
|
104
|
+
/** The class the rail's own geometry and scrollbar rules are hung on. */
|
|
105
105
|
export declare const RAIL_CLASS = "stapel-search-rail";
|
|
106
|
+
/**
|
|
107
|
+
* The class that carries the SKIN's scrollbar — present under
|
|
108
|
+
* `railScrollbar: "styled"` and absent under `"system"`, so the two arms are
|
|
109
|
+
* one class apart and a stand can read which one is on screen.
|
|
110
|
+
*/
|
|
111
|
+
export declare const RAIL_SCROLLBAR_CLASS = "stapel-search-rail-scrollbar";
|
|
106
112
|
/** The `href` the hoisted rail sheet is deduplicated by. */
|
|
107
113
|
export declare const RAIL_STYLE_HREF = "stapel-search-rail";
|
|
114
|
+
/** Whose scrollbar the rail's own scroll port draws — see
|
|
115
|
+
* {@link SearchPageProps.railScrollbar}. */
|
|
116
|
+
export type SearchRailScrollbar = "styled" | "system";
|
|
108
117
|
/**
|
|
109
|
-
* The rail scrolls, and
|
|
118
|
+
* The rail scrolls, and the bar that says so is the SKIN's, not the platform's.
|
|
119
|
+
*
|
|
120
|
+
* The system bar was never a decision — it is what an `overflow-y: auto` box
|
|
121
|
+
* gets when nobody says otherwise, and on the storefront it landed as a grey
|
|
122
|
+
* chrome-coloured strip standing next to the filters in a dark theme. What it
|
|
123
|
+
* is replaced with:
|
|
110
124
|
*
|
|
111
|
-
*
|
|
112
|
-
*
|
|
113
|
-
*
|
|
114
|
-
*
|
|
115
|
-
*
|
|
125
|
+
* - a 6px track with no arrows and no track fill — the rail's own hairline,
|
|
126
|
+
* not a widget;
|
|
127
|
+
* - a thumb that is TRANSPARENT at rest and appears on `:hover` of the rail
|
|
128
|
+
* (which is what a pointer scrolling inside it is doing) and on
|
|
129
|
+
* `:focus-within` (which is what a keyboard is doing). A coarse pointer
|
|
130
|
+
* fires neither, so under `(pointer: coarse)` the thumb stands — a touch
|
|
131
|
+
* surface with an invisible scrollbar is a rail with no sign it has a tail;
|
|
132
|
+
* - `scrollbar-gutter: stable`, so the panel's right edge does not move when
|
|
133
|
+
* the thumb arrives.
|
|
116
134
|
*
|
|
117
|
-
*
|
|
118
|
-
*
|
|
119
|
-
*
|
|
120
|
-
*
|
|
121
|
-
*
|
|
122
|
-
*
|
|
123
|
-
*
|
|
124
|
-
* theme was mounted first.
|
|
135
|
+
* Both vendor forms, because they are not alternatives: Firefox reads
|
|
136
|
+
* `scrollbar-width`/`scrollbar-color` and nothing else, WebKit and Chromium
|
|
137
|
+
* read the `::-webkit-scrollbar` pseudo-elements and (in Chromium) the
|
|
138
|
+
* standard properties too.
|
|
139
|
+
*
|
|
140
|
+
* The colours are `--stapel-*` custom properties, which resolve per theme at
|
|
141
|
+
* paint time — an inline colour or a `useToken()` value would freeze whichever
|
|
142
|
+
* theme was mounted first. This design system's neutral vocabulary has no
|
|
143
|
+
* `colorFill*` ramp of its own: `border` IS its tertiary-fill role (the
|
|
144
|
+
* hairline every pane is separated by) and `text-subtle` is that role one step
|
|
145
|
+
* stronger, which is what the thumb takes when a pointer is on the thumb
|
|
146
|
+
* itself.
|
|
125
147
|
*
|
|
126
148
|
* Emitted as one hoisted `<style>` (React 19 dedupes by `href`), because a
|
|
127
149
|
* pseudo-element is unreachable from an inline style — the same reason
|
|
@@ -141,6 +163,30 @@ export declare function railScrollbarCss(): string;
|
|
|
141
163
|
* publishes instead of restating it.
|
|
142
164
|
*/
|
|
143
165
|
export declare function railStyle(top: number | string | undefined): CSSProperties;
|
|
166
|
+
/** The custom property every block gap on this page reads. */
|
|
167
|
+
export declare const BLOCK_GAP_VAR = "--stapel-block-gap";
|
|
168
|
+
/** Its coarse-pointer / narrow-window twin. */
|
|
169
|
+
export declare const BLOCK_GAP_COMPACT_VAR = "--stapel-block-gap-compact";
|
|
170
|
+
/** The class the rhythm's rules are hung on. */
|
|
171
|
+
export declare const BLOCK_RHYTHM_CLASS = "stapel-block-rhythm";
|
|
172
|
+
/** The `href` the hoisted rhythm sheet is deduplicated by. */
|
|
173
|
+
export declare const BLOCK_RHYTHM_STYLE_HREF = "stapel-block-rhythm";
|
|
174
|
+
/** Where the page's block gap comes from — see
|
|
175
|
+
* {@link SearchPageProps.blockRhythm}. */
|
|
176
|
+
export type SearchBlockRhythm = "token" | "legacy";
|
|
177
|
+
/**
|
|
178
|
+
* The rhythm's rule set.
|
|
179
|
+
*
|
|
180
|
+
* Three rules, and the third is half of the fix: `margin-block: 0` on every
|
|
181
|
+
* direct child. A gap only governs the space a container puts BETWEEN its
|
|
182
|
+
* children — a block that also carries its own top or bottom margin adds to it
|
|
183
|
+
* and the spacing stops being one number, which is exactly how a page ends up
|
|
184
|
+
* with four different distances nobody chose.
|
|
185
|
+
*
|
|
186
|
+
* A sheet rather than inline styles because the compact arm is a media query
|
|
187
|
+
* and the reset addresses children this component does not own.
|
|
188
|
+
*/
|
|
189
|
+
export declare function blockRhythmCss(): string;
|
|
144
190
|
export interface SearchPageProps extends ThemeModeProp, ParseSearchStateOptions {
|
|
145
191
|
/** The URL binding. `useRouterSearchParams()` from `./router` is the
|
|
146
192
|
* react-router one. */
|
|
@@ -445,6 +491,46 @@ export interface SearchPageProps extends ThemeModeProp, ParseSearchStateOptions
|
|
|
445
491
|
* header to clear.
|
|
446
492
|
*/
|
|
447
493
|
readonly railTop?: number | string;
|
|
494
|
+
/**
|
|
495
|
+
* WHOSE SCROLLBAR the rail's own scroll port draws. Default `"styled"`.
|
|
496
|
+
*
|
|
497
|
+
* The rail is a scroll container and stays one: a person who has scrolled
|
|
498
|
+
* the filters and ticked one does not want the page to have moved under
|
|
499
|
+
* them. What it stopped drawing is the PLATFORM's bar — a grey chrome strip
|
|
500
|
+
* beside the filters, which is what an `overflow-y: auto` box gets when
|
|
501
|
+
* nobody decides otherwise.
|
|
502
|
+
*
|
|
503
|
+
* - `"styled"` — the skin's own bar, from the tokens, in both themes: a 6px
|
|
504
|
+
* track, no arrows, no track fill, and a thumb that is transparent at
|
|
505
|
+
* rest and appears while the rail is hovered or focused within (always,
|
|
506
|
+
* on a coarse pointer that can do neither). See {@link railScrollbarCss};
|
|
507
|
+
* - `"system"` — the platform's, untouched, for a host whose own stylesheet
|
|
508
|
+
* already dresses every scroll port on the page and would then be
|
|
509
|
+
* dressing this one twice.
|
|
510
|
+
*
|
|
511
|
+
* The default is the NEW behaviour, deliberately: the system bar was never a
|
|
512
|
+
* design decision here — it was the absence of one, and it is the thing the
|
|
513
|
+
* page was measured on.
|
|
514
|
+
*/
|
|
515
|
+
readonly railScrollbar?: SearchRailScrollbar;
|
|
516
|
+
/**
|
|
517
|
+
* WHERE the space between this page's blocks comes from. Default `"token"`.
|
|
518
|
+
*
|
|
519
|
+
* - `"token"` — one gap for every block, read from
|
|
520
|
+
* `var(--stapel-block-gap)` (and `var(--stapel-block-gap-compact)` on a
|
|
521
|
+
* coarse pointer or a narrow window), defaulting to the design system's
|
|
522
|
+
* own spacing steps. Every direct block also has its outer margin reset,
|
|
523
|
+
* so the distance between two blocks is ONE number and a host can retune
|
|
524
|
+
* all of them by declaring the property once — see {@link blockRhythmCss};
|
|
525
|
+
* - `"legacy"` — the flat `spacing[4]` this page wrote inline for a host
|
|
526
|
+
* whose own layout was measured against it.
|
|
527
|
+
*
|
|
528
|
+
* The default is the NEW behaviour: 16px between a page's sections was the
|
|
529
|
+
* value a vertical `<Flex>` was given when the page was first assembled, not
|
|
530
|
+
* a rhythm anybody chose, and it is what made the blocks read as one column
|
|
531
|
+
* with no seams.
|
|
532
|
+
*/
|
|
533
|
+
readonly blockRhythm?: SearchBlockRhythm;
|
|
448
534
|
/**
|
|
449
535
|
* PIN the results toolbar under whatever chrome is above this page — the
|
|
450
536
|
* other column's half of {@link railTop}.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"SearchPage.d.ts","sourceRoot":"","sources":["../../src/default/SearchPage.tsx"],"names":[],"mappings":"AAgEA,OAAO,KAAK,EAAE,aAAa,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAKpE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,0BAA0B,CAAC;AAE3D,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oCAAoC,CAAC;AAE9E,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,+BAA+B,CAAC;AAExE,OAAO,KAAK,EAAE,uBAAuB,EAAE,MAAM,sBAAsB,CAAC;AACpE,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AAIjD,OAAO,KAAK,EACV,uBAAuB,EACvB,mBAAmB,EACnB,kBAAkB,EACnB,MAAM,qBAAqB,CAAC;AAK7B,OAAO,KAAK,EACV,yBAAyB,EACzB,kBAAkB,EACnB,MAAM,0BAA0B,CAAC;AAElC,OAAO,KAAK,EACV,cAAc,EACd,oBAAoB,EACpB,gBAAgB,EACjB,MAAM,wBAAwB,CAAC;AAGhC,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,iBAAiB,CAAC;AAClD,OAAO,KAAK,EAAE,wBAAwB,EAAE,MAAM,wBAAwB,CAAC;AACvE,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,uBAAuB,CAAC;AAEhE,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAEhD,iFAAiF;AACjF,MAAM,MAAM,mBAAmB,GAAG,QAAQ,GAAG,OAAO,CAAC;AAErD;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,uBAAuB,GAAG,MAAM,GAAG,OAAO,GAAG,SAAS,GAAG,UAAU,CAAC;AAEhF,oEAAoE;AACpE,MAAM,WAAW,4BAA4B;IAC3C;;;;;;;;;;;;OAYG;IACH,QAAQ,CAAC,YAAY,EAAE,MAAM,IAAI,CAAC;IAClC,sDAAsD;IACtD,QAAQ,CAAC,IAAI,EAAE,OAAO,CAAC;CACxB;AAED;;;;;;GAMG;AACH,MAAM,MAAM,mBAAmB,GAC3B,SAAS,GACT,CAAC,CAAC,IAAI,EAAE,4BAA4B,KAAK,SAAS,CAAC,CAAC;AAExD;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,MAAM,cAAc,GAAG,MAAM,CAAC;AA4DpC;;;;;;;;;;GAUG;AACH,eAAO,MAAM,kBAAkB,MAAM,CAAC;AAEtC;;;;;;;;;;;;;GAaG;AACH,
|
|
1
|
+
{"version":3,"file":"SearchPage.d.ts","sourceRoot":"","sources":["../../src/default/SearchPage.tsx"],"names":[],"mappings":"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"}
|