@godxjp/ui 32.3.0 → 32.3.2

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.
@@ -3,7 +3,7 @@
3
3
  You are about to write code against a design system you did not author. This file is the whole
4
4
  contract. Read it before you write JSX.
5
5
 
6
- **This catalog describes `@godxjp/ui` 32.3.0.** If the project you are editing has a different
6
+ **This catalog describes `@godxjp/ui` 32.3.2.** If the project you are editing has a different
7
7
  version in its `package.json`, read the pinned catalog for THAT version instead
8
8
  (`…/v<their-version>/agent/…`). A catalog newer than the installed package describes props that do
9
9
  not exist yet; older, and it hides props that do. Neither failure announces itself.
@@ -136,7 +136,7 @@
136
136
  "type": "boolean | { text, editing, icon, tooltip, onStart, onChange, onCancel, onEnd, maxLength, autoSize, triggerType, enterIcon, tabIndex }"
137
137
  },
138
138
  {
139
- "description": "Single-line truncation, antd's spelling. antd drops `rows` / `expandable` / `onExpand` on `Text` — an inline run has no second line to expand into — and that omission is ported; for a multi-line run use `clamp` (antd's `Paragraph` was retired in v32). It is the SAME axis as `truncate` / `clamp` and OUTRANKS both (dev builds warn), because it is the only spelling that can also carry a suffix or a tooltip. `tooltip: true` (the children) or a node shows the full text in a Tooltip ONLY while the run is actually clipped — on pointer hover, and on keyboard focus of the Text itself (`asChild` link) or of the nearest focusable control around it (a Tree `treeitem`, a DataTable sort button, a link); the Text never becomes a tab stop of its own and its accessible name stays the full text. With `asChild` the child element is the truncated box (one `<a>`, not `<a><a>`). A `<Text ellipsis>` in `ColumnDef.header` truncates inside its column like a cell.",
139
+ "description": "Single-line truncation, antd's spelling. antd drops `rows` / `expandable` / `onExpand` on `Text` — an inline run has no second line to expand into — and that omission is ported; for a multi-line run use `clamp` (antd's `Paragraph` was retired in v32). It is the SAME axis as `truncate` / `clamp` and OUTRANKS both (dev builds warn), because it is the only spelling that can also carry a suffix or a tooltip. `tooltip: true` (the children) or a node shows the full text in a Tooltip ONLY while the run is actually clipped — on pointer hover, and on keyboard focus of the Text itself (`asChild` link) or of the nearest focusable control around it (a Tree `treeitem`, a DataTable sort button, a link); the Text never becomes a tab stop of its own and its accessible name stays the full text. With `asChild` the child element is the truncated box (one `<a>`, not `<a><a>`). A `<Text ellipsis>` in `ColumnDef.header` truncates inside its column like a cell. On one line, `suffix` is never cut: the text shrinks and the suffix keeps its width (a file extension stays visible — gh#1276).",
140
140
  "name": "ellipsis",
141
141
  "type": "boolean | { suffix, symbol, defaultExpanded, expanded, onEllipsis, tooltip }"
142
142
  },
@@ -44,8 +44,8 @@
44
44
  "type": "number"
45
45
  },
46
46
  {
47
- "defaultValue": "true",
48
- "description": "Render the pill when `count` is 0. Same default as Button. Set false to hide an empty facet's pill while keeping the chip.",
47
+ "defaultValue": "true (false for variant=\"quiet\")",
48
+ "description": "Render the pill when `count` is 0. Same default as Button — a filter chip saying \"Open 0\" is information. `variant=\"quiet\"` defaults to false (gh#1275): a quiet toggle is a mark beside content, and a \"0\" beside an unstarred star is noise. Set it explicitly to override either way.",
49
49
  "name": "showZero",
50
50
  "type": "boolean"
51
51
  },
@@ -2830,7 +2830,7 @@
2830
2830
  "type": "boolean | { text, editing, icon, tooltip, onStart, onChange, onCancel, onEnd, maxLength, autoSize, triggerType, enterIcon, tabIndex }"
2831
2831
  },
2832
2832
  {
2833
- "description": "Single-line truncation, antd's spelling. antd drops `rows` / `expandable` / `onExpand` on `Text` — an inline run has no second line to expand into — and that omission is ported; for a multi-line run use `clamp` (antd's `Paragraph` was retired in v32). It is the SAME axis as `truncate` / `clamp` and OUTRANKS both (dev builds warn), because it is the only spelling that can also carry a suffix or a tooltip. `tooltip: true` (the children) or a node shows the full text in a Tooltip ONLY while the run is actually clipped — on pointer hover, and on keyboard focus of the Text itself (`asChild` link) or of the nearest focusable control around it (a Tree `treeitem`, a DataTable sort button, a link); the Text never becomes a tab stop of its own and its accessible name stays the full text. With `asChild` the child element is the truncated box (one `<a>`, not `<a><a>`). A `<Text ellipsis>` in `ColumnDef.header` truncates inside its column like a cell.",
2833
+ "description": "Single-line truncation, antd's spelling. antd drops `rows` / `expandable` / `onExpand` on `Text` — an inline run has no second line to expand into — and that omission is ported; for a multi-line run use `clamp` (antd's `Paragraph` was retired in v32). It is the SAME axis as `truncate` / `clamp` and OUTRANKS both (dev builds warn), because it is the only spelling that can also carry a suffix or a tooltip. `tooltip: true` (the children) or a node shows the full text in a Tooltip ONLY while the run is actually clipped — on pointer hover, and on keyboard focus of the Text itself (`asChild` link) or of the nearest focusable control around it (a Tree `treeitem`, a DataTable sort button, a link); the Text never becomes a tab stop of its own and its accessible name stays the full text. With `asChild` the child element is the truncated box (one `<a>`, not `<a><a>`). A `<Text ellipsis>` in `ColumnDef.header` truncates inside its column like a cell. On one line, `suffix` is never cut: the text shrinks and the suffix keeps its width (a file extension stays visible — gh#1276).",
2834
2834
  "name": "ellipsis",
2835
2835
  "type": "boolean | { suffix, symbol, defaultExpanded, expanded, onEllipsis, tooltip }"
2836
2836
  },
@@ -11838,8 +11838,8 @@
11838
11838
  "type": "number"
11839
11839
  },
11840
11840
  {
11841
- "defaultValue": "true",
11842
- "description": "Render the pill when `count` is 0. Same default as Button. Set false to hide an empty facet's pill while keeping the chip.",
11841
+ "defaultValue": "true (false for variant=\"quiet\")",
11842
+ "description": "Render the pill when `count` is 0. Same default as Button — a filter chip saying \"Open 0\" is information. `variant=\"quiet\"` defaults to false (gh#1275): a quiet toggle is a mark beside content, and a \"0\" beside an unstarred star is noise. Set it explicitly to override either way.",
11843
11843
  "name": "showZero",
11844
11844
  "type": "boolean"
11845
11845
  },
package/agent/index.json CHANGED
@@ -48,7 +48,7 @@
48
48
  "note": "Pin to the tag that matches the @godxjp/ui version you installed. A catalog newer than your package describes props you do not have; older, and it hides props you do.",
49
49
  "read": {
50
50
  "live": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/index.json",
51
- "pinned": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/v32.3.0/agent/index.json"
51
+ "pinned": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/v32.3.2/agent/index.json"
52
52
  },
53
53
  "source": "mcp/src/data — the same data @godxjp/ui-mcp serves — plus the foundation and semantic token tiers, read from src/tokens/*.css",
54
54
  "start": "https://raw.githubusercontent.com/godx-jp/godxjp-ui/main/agent/START-HERE.md",
@@ -62,5 +62,5 @@
62
62
  "foundation": "the seeds a consumer is invited to set — --primary, --background, --radius",
63
63
  "semantic": "named roles that follow the seeds — --ring, --text-link, --overlay-background"
64
64
  },
65
- "version": "32.3.0"
65
+ "version": "32.3.2"
66
66
  }
package/agent/llms.txt CHANGED
@@ -1,10 +1,10 @@
1
1
  # @godxjp/ui
2
2
 
3
3
  > A Japanese-enterprise React design system: 161 components, 2195 design tokens,
4
- > 43 cardinal rules. This file is the entry point for AI agents. Catalog version 32.3.0.
4
+ > 43 cardinal rules. This file is the entry point for AI agents. Catalog version 32.3.2.
5
5
 
6
6
  If your client can run a process, do not read these files — run the MCP server instead
7
- (`npx @godxjp/ui-mcp@32.3.0`). It is searchable and version-locked. These files exist for agents
7
+ (`npx @godxjp/ui-mcp@32.3.2`). It is searchable and version-locked. These files exist for agents
8
8
  that can only fetch URLs.
9
9
 
10
10
  ## Start
@@ -26,7 +26,7 @@ that can only fetch URLs.
26
26
  ## Pinning
27
27
 
28
28
  Every URL above tracks `main`. To pin to the release a project actually installed, swap `main` for
29
- the tag: `.../godx-jp/godxjp-ui/v32.3.0/agent/...`. A catalog that does not match the installed
29
+ the tag: `.../godx-jp/godxjp-ui/v32.3.2/agent/...`. A catalog that does not match the installed
30
30
  package describes props that are absent, or hides props that are present, and says nothing either way.
31
31
 
32
32
  Pinned catalogs only exist for releases whose tag actually contains `agent/`. If `…/v<version>/agent/index.json` returns 404, that release predates this catalog: read `…/main/…` instead and compare `index.json` → `version` against the package you have, so you at least know which way it drifted.
@@ -137,7 +137,8 @@ const ToggleGroupItem = React.forwardRef(
137
137
  const { pill, resolvedAriaLabel } = useCounterPill({
138
138
  count,
139
139
  overflowCount,
140
- showZero,
140
+ // gh#1275 — a quiet toggle hides a zero count unless asked (see ToggleProp.showZero).
141
+ showZero: showZero ?? resolvedVariant !== "quiet",
141
142
  countLabel,
142
143
  ariaLabel
143
144
  });
@@ -19,7 +19,11 @@ type ToggleCountFields = {
19
19
  count?: number;
20
20
  /** Cap for `count` — beyond it the pill shows `{overflowCount}+` (e.g. `99+`). */
21
21
  overflowCount?: number;
22
- /** Render the pill when `count` is 0. Default `true`, matching Button. */
22
+ /**
23
+ * Render the pill when `count` is 0. Default `true`, matching Button — a filter chip saying
24
+ * "Open 0" is information. `variant="quiet"` defaults to `false` (gh#1275): a quiet toggle is a
25
+ * mark beside content (a star, a reaction), where a "0" beside an unstarred star is noise.
26
+ */
23
27
  showZero?: boolean;
24
28
  /**
25
29
  * Localized description of what the count MEANS, folded into the accessible name so the control
@@ -121,7 +121,7 @@ const Toggle = React.forwardRef(
121
121
  const { pill, resolvedAriaLabel } = useCounterPill({
122
122
  count,
123
123
  overflowCount,
124
- showZero,
124
+ showZero: showZero ?? variant !== "quiet",
125
125
  countLabel,
126
126
  ariaLabel
127
127
  });
@@ -138,6 +138,7 @@ function AlertQueryError({
138
138
  const { t } = useTranslation();
139
139
  const resolved = category ?? classifyQueryError(error).category;
140
140
  const expiry = useAuthExpiry(resolved === "auth", error);
141
+ const localizedCategory = category ?? (resolved === "transient" ? resolved : void 0);
141
142
  if (expiry?.status === "redirecting") {
142
143
  return /* @__PURE__ */ jsx(
143
144
  Text,
@@ -154,7 +155,7 @@ function AlertQueryError({
154
155
  );
155
156
  }
156
157
  const authAction = expiry ? expiry.retry : onAuthAction;
157
- if (!category && !expiry) {
158
+ if (!localizedCategory && !expiry) {
158
159
  return /* @__PURE__ */ jsxs(Alert, { tone: "destructive", className, children: [
159
160
  /* @__PURE__ */ jsx(AlertTitle, { children: t("common.error") }),
160
161
  /* @__PURE__ */ jsx(AlertDescription, { children: humanError(error) }),
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "$comment": "AUTO-GENERATED by scripts/gen-measurement-contract.mjs — do not edit. Read this instead of guessing: docs/MEASUREMENT-CONTRACT.md.",
3
- "version": "32.3.0",
3
+ "version": "32.3.2",
4
4
  "targetSize": {
5
5
  "standard": "WCAG 2.2 SC 2.5.8 Target Size (Minimum), level AA — 24×24 CSS px",
6
6
  "min": 24,
@@ -25,7 +25,7 @@ function readMessage(error) {
25
25
  const AUTH_RE = /unauthenticated|unauthorized|access[ _-]?token|invalid token|token (?:is )?(?:expired|invalid)|(?:session|token) (?:has )?expired/i;
26
26
  const FORBIDDEN_RE = /forbidden|permission denied|not allowed|access denied|insufficient (?:scope|permission)/i;
27
27
  const NOT_FOUND_RE = /not found|does not exist|no such/i;
28
- const TRANSIENT_RE = /network|failed to fetch|timeout|timed out|connection|econn(?:refused|reset|aborted)|temporarily|unavailable|gateway/i;
28
+ const TRANSIENT_RE = /network|failed to fetch|timeout|timed out|connection|econn(?:refused|reset|aborted)|temporarily|unavailable|gateway|could not reach|unreachable|server error|offline/i;
29
29
  const VALIDATION_RE = /validation|invalid input|bad request|must be|is required/i;
30
30
  function classifyQueryError(error) {
31
31
  const status = readStatus(error);
@@ -1,5 +1,5 @@
1
1
  {
2
- "version": "32.3.0",
2
+ "version": "32.3.2",
3
3
  "generatedBy": "scripts/gen-style-layers.mjs — do not edit by hand; run `pnpm gen:style-layers`",
4
4
  "base": "base.css",
5
5
  "fonts": "fonts.css",
@@ -155,6 +155,35 @@
155
155
  padding-inline-end: 0;
156
156
  }
157
157
 
158
+ [data-slot="table-cell"]
159
+ > :is(
160
+ [data-slot="button"],
161
+ [data-slot="avatar"],
162
+ [data-slot="toggle"],
163
+ [data-slot="switch"],
164
+ label[data-slot="checkbox"],
165
+ [data-slot="badge"],
166
+ [data-slot="swatch"]
167
+ ),
168
+ [data-slot="table-cell"]
169
+ > :not([data-wrap], .ui-table-actions-content)
170
+ > :is(
171
+ [data-slot="button"],
172
+ [data-slot="avatar"],
173
+ [data-slot="toggle"],
174
+ [data-slot="switch"],
175
+ label[data-slot="checkbox"],
176
+ [data-slot="badge"],
177
+ [data-slot="swatch"]
178
+ ) {
179
+ vertical-align: middle;
180
+ margin-block: calc(var(--table-cell-padding-y) * -1);
181
+ }
182
+
183
+ [data-slot="table-head"] label[data-slot="checkbox"] {
184
+ vertical-align: middle;
185
+ }
186
+
158
187
  :is([data-slot="table-head"], [data-slot="table-cell"])[data-numeric] {
159
188
  font-variant-numeric: tabular-nums;
160
189
  text-align: end;
@@ -360,6 +389,35 @@
360
389
  flex-shrink: 0;
361
390
  }
362
391
 
392
+ [data-slot="table-head"][data-wrap]:not(.text-center):has(> .ui-data-table-sort-button) {
393
+ padding-inline-end: max(
394
+ var(--table-cell-space-x, var(--space-section-active)),
395
+ calc(var(--table-sort-icon-size) + var(--space-inline-xs))
396
+ );
397
+ }
398
+
399
+ [data-slot="table-head"][data-wrap]:not(.text-center) > .ui-data-table-sort-button {
400
+ padding-inline-end: calc(var(--table-sort-icon-size) + var(--space-inline-xs));
401
+ margin-inline-end: calc(-1 * (var(--table-sort-icon-size) + var(--space-inline-xs)));
402
+ max-inline-size: calc(100% + var(--table-sort-icon-size) + var(--space-inline-xs));
403
+ }
404
+
405
+ [data-slot="table-head"][data-wrap]:not(.text-center)
406
+ > .ui-data-table-sort-button
407
+ > .ui-data-table-sort-label {
408
+ overflow-wrap: anywhere;
409
+ }
410
+
411
+ [data-slot="table-head"][data-wrap]:not(.text-center)
412
+ > .ui-data-table-sort-button
413
+ > .ui-data-table-sort-label
414
+ > .ui-data-table-sort-icon {
415
+ position: absolute;
416
+ inset-inline-end: 0;
417
+ top: 50%;
418
+ transform: translateY(-50%);
419
+ }
420
+
363
421
  :is(th, td).text-center > .ui-data-table-sort-button > .ui-data-table-sort-label {
364
422
  position: relative;
365
423
 
@@ -420,6 +420,22 @@
420
420
  vertical-align: bottom;
421
421
  }
422
422
 
423
+ [data-slot="text"]:has(> .ui-typography-content[data-truncate]) {
424
+ display: inline-flex;
425
+ max-inline-size: 100%;
426
+ min-inline-size: 0;
427
+ align-items: baseline;
428
+ vertical-align: bottom;
429
+ white-space: nowrap;
430
+ }
431
+ [data-slot="text"] > .ui-typography-content[data-truncate] {
432
+ flex: 0 1 auto;
433
+ min-inline-size: 0;
434
+ }
435
+ [data-slot="text"]:has(> .ui-typography-content[data-truncate]) > :not(.ui-typography-content) {
436
+ flex: none;
437
+ }
438
+
423
439
  [data-slot="text"][data-ellipsis][data-truncate] {
424
440
  display: inline-block;
425
441
  max-inline-size: 100%;