@godxjp/ui 28.13.0 → 30.0.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.
Files changed (164) hide show
  1. package/agent/START-HERE.md +29 -10
  2. package/agent/components/Anchor.json +6 -1
  3. package/agent/components/AppShell.json +1 -1
  4. package/agent/components/AreaChart.json +19 -1
  5. package/agent/components/BarChart.json +11 -1
  6. package/agent/components/Cascader.json +1 -1
  7. package/agent/components/CompactBarTrend.json +1 -1
  8. package/agent/components/DataState.json +1 -1
  9. package/agent/components/DataTable.json +4 -4
  10. package/agent/components/FormField.json +1 -1
  11. package/agent/components/InfiniteQueryState.json +1 -1
  12. package/agent/components/Input.json +1 -1
  13. package/agent/components/LineChart.json +20 -2
  14. package/agent/components/ListRow.json +1 -1
  15. package/agent/components/Masonry.json +1 -1
  16. package/agent/components/MasterDetail.json +1 -1
  17. package/agent/components/PasswordStrength.json +1 -1
  18. package/agent/components/PermissionMatrix.json +1 -1
  19. package/agent/components/Select.json +1 -0
  20. package/agent/components/Sidebar.json +1 -1
  21. package/agent/components/Table.json +8 -3
  22. package/agent/components/ThemeScope.json +49 -0
  23. package/agent/components/Topbar.json +1 -0
  24. package/agent/components/TopbarItem.json +2 -1
  25. package/agent/components/Transfer.json +1 -1
  26. package/agent/components/TreeSelect.json +1 -1
  27. package/agent/components/UploadCropDialog.json +1 -1
  28. package/agent/components/formatDate.json +1 -1
  29. package/agent/components-index.json +5 -0
  30. package/agent/components.json +138 -30
  31. package/agent/index.json +19 -9
  32. package/agent/llms.txt +10 -10
  33. package/agent/patterns/tenant-brand-color.json +28 -0
  34. package/agent/patterns-index.json +27 -0
  35. package/agent/patterns.json +28 -0
  36. package/agent/rules.json +15 -0
  37. package/agent/tokens.json +5055 -1060
  38. package/dist/app/index.d.ts +3 -0
  39. package/dist/app/index.js +3 -0
  40. package/dist/app/tenant-theme.d.ts +80 -0
  41. package/dist/app/tenant-theme.js +154 -0
  42. package/dist/app/theme-axes.d.ts +14 -1
  43. package/dist/app/theme-axes.js +24 -31
  44. package/dist/components/charts/chart-cartesian.d.ts +5 -1
  45. package/dist/components/charts/chart-cartesian.js +15 -8
  46. package/dist/components/data-display/badge.d.ts +1 -1
  47. package/dist/components/data-display/badge.js +21 -3
  48. package/dist/components/data-display/carousel.js +4 -4
  49. package/dist/components/data-display/data-table.js +13 -2
  50. package/dist/components/data-display/permission-matrix.js +1 -1
  51. package/dist/components/data-display/table.d.ts +11 -2
  52. package/dist/components/data-display/table.js +19 -3
  53. package/dist/components/data-entry/control-appearance.d.ts +12 -6
  54. package/dist/components/data-entry/control-appearance.js +1 -1
  55. package/dist/components/data-entry/select.js +4 -3
  56. package/dist/components/feedback/dialog.js +6 -3
  57. package/dist/components/feedback/overlay-header-tone.d.ts +7 -0
  58. package/dist/components/feedback/overlay-header-tone.js +4 -4
  59. package/dist/components/feedback/sheet.d.ts +1 -1
  60. package/dist/components/feedback/sheet.js +6 -9
  61. package/dist/components/feedback/sonner.js +16 -3
  62. package/dist/components/general/button.js +22 -5
  63. package/dist/components/layout/affix.js +15 -1
  64. package/dist/components/layout/sidebar.js +7 -1
  65. package/dist/components/navigation/anchor.d.ts +1 -1
  66. package/dist/components/navigation/anchor.js +5 -4
  67. package/dist/components/navigation/app-setting-picker.js +1 -1
  68. package/dist/components/navigation/pagination.js +1 -1
  69. package/dist/components/navigation/tabs.js +15 -2
  70. package/dist/components/query/infinite-query-state.d.ts +22 -6
  71. package/dist/contracts/measurement.json +1 -1
  72. package/dist/lib/control-styles.d.ts +31 -11
  73. package/dist/lib/control-styles.js +6 -6
  74. package/dist/lib/overlay-portal.d.ts +20 -0
  75. package/dist/lib/overlay-portal.js +93 -0
  76. package/dist/props/components/app.prop.d.ts +12 -0
  77. package/dist/props/components/charts.prop.d.ts +30 -0
  78. package/dist/props/components/index.d.ts +1 -1
  79. package/dist/props/components/navigation.prop.d.ts +21 -2
  80. package/dist/props/components/query.prop.d.ts +36 -2
  81. package/dist/props/registry.d.ts +46 -1
  82. package/dist/props/registry.js +38 -3
  83. package/dist/styles/alert-layout.css +39 -19
  84. package/dist/styles/badge-layout.css +11 -7
  85. package/dist/styles/base.css +14 -5
  86. package/dist/styles/card-layout.css +29 -16
  87. package/dist/styles/chart-layout.css +27 -5
  88. package/dist/styles/control.css +225 -103
  89. package/dist/styles/data-display-layout.css +178 -76
  90. package/dist/styles/data-entry-layout.css +35 -99
  91. package/dist/styles/dialog-layout.css +58 -28
  92. package/dist/styles/float-button-layout.css +5 -5
  93. package/dist/styles/focus-ring.css +11 -7
  94. package/dist/styles/layout.css +53 -25
  95. package/dist/styles/logo-layout.css +3 -3
  96. package/dist/styles/motion.css +2 -2
  97. package/dist/styles/navigation-layout.css +117 -44
  98. package/dist/styles/shell-layout.css +90 -124
  99. package/dist/styles/table-layout.css +66 -24
  100. package/dist/styles/text-layout.css +13 -4
  101. package/dist/styles/toggle.css +9 -3
  102. package/dist/tokens/components/actions.css +1 -1
  103. package/dist/tokens/components/attachments.css +4 -4
  104. package/dist/tokens/components/badge.css +4 -4
  105. package/dist/tokens/components/banner.css +1 -1
  106. package/dist/tokens/components/callout.css +1 -1
  107. package/dist/tokens/components/card.css +13 -8
  108. package/dist/tokens/components/chart.css +11 -2
  109. package/dist/tokens/components/chat-bubble.css +2 -2
  110. package/dist/tokens/components/control.css +41 -22
  111. package/dist/tokens/components/conversations.css +2 -1
  112. package/dist/tokens/components/data-display.css +23 -18
  113. package/dist/tokens/components/data-entry.css +1 -1
  114. package/dist/tokens/components/descriptions.css +2 -2
  115. package/dist/tokens/components/draggable-panel.css +2 -2
  116. package/dist/tokens/components/feedback.css +29 -9
  117. package/dist/tokens/components/float-button.css +1 -1
  118. package/dist/tokens/components/legal-document.css +2 -2
  119. package/dist/tokens/components/logo.css +2 -2
  120. package/dist/tokens/components/mega-menu.css +6 -4
  121. package/dist/tokens/components/navigation.css +27 -13
  122. package/dist/tokens/components/segmented.css +11 -6
  123. package/dist/tokens/components/separator.css +1 -1
  124. package/dist/tokens/components/shell.css +24 -10
  125. package/dist/tokens/components/table.css +13 -5
  126. package/dist/tokens/components/thought-chain.css +2 -2
  127. package/dist/tokens/components/toggle.css +3 -1
  128. package/dist/tokens/components/tree.css +3 -1
  129. package/dist/tokens/components/upload.css +8 -8
  130. package/dist/tokens/components/welcome.css +1 -1
  131. package/dist/tokens/foundation.css +30 -3
  132. package/docs/COMPOSITION-VS-COMPONENT.md +31 -0
  133. package/docs/CUSTOMER-THEMING.md +637 -1
  134. package/docs/FRAME-COVERAGE-REPORT.md +3 -2
  135. package/docs/GLASSMORPHISM-STANDARD.md +196 -0
  136. package/docs/THEME-API-COVERAGE.md +538 -0
  137. package/docs/TOKEN-RESOLUTION.md +195 -0
  138. package/docs/TOKENS.md +63 -24
  139. package/docs/asset-modules.d.ts +7 -0
  140. package/docs/data-display/charts.tsx +80 -0
  141. package/docs/data-display/data-table/index.tsx +30 -0
  142. package/docs/data-display/popover.tsx +1 -1
  143. package/docs/data-display/table.tsx +52 -0
  144. package/docs/feedback/sheet.tsx +10 -10
  145. package/docs/foundation/density.tsx +4 -4
  146. package/docs/i18n/messages/en.json +506 -0
  147. package/docs/i18n/messages/ja.json +506 -0
  148. package/docs/i18n/messages/vi.json +506 -0
  149. package/docs/layout/account-chip.tsx +2 -2
  150. package/docs/layout/responsive-grid.tsx +1 -1
  151. package/docs/navigation/toolbar.tsx +20 -12
  152. package/docs/providers/theme-scope.tsx +186 -0
  153. package/docs/showcase/caimono-price-comparison.tsx +911 -0
  154. package/docs/showcase/case4-login.tsx +2 -2
  155. package/docs/showcase/permission-matrix.tsx +13 -5
  156. package/docs/showcase/table-pagination.tsx +2 -1
  157. package/docs/showcase/tenant-brand-color.tsx +338 -0
  158. package/docs/showcase/theme-lab.tsx +2125 -0
  159. package/docs/themes/flat.css +462 -0
  160. package/docs/themes/glassmorphism.css +958 -0
  161. package/docs/themes/index.ts +219 -0
  162. package/docs/themes/neubrutalism.css +475 -0
  163. package/package.json +4 -3
  164. package/scripts/explain-token.mjs +382 -0
@@ -1,9 +1,9 @@
1
- const controlMultilineClass = "ui-control-multiline aria-invalid:border-destructive data-[status=error]:border-destructive data-[status=warning]:border-warning w-full rounded-[var(--control-radius)] border-input bg-background ring-offset-background placeholder:text-muted-foreground";
1
+ const controlMultilineClass = "ui-control-multiline ui-control-outlined-surface aria-invalid:border-destructive data-[status=error]:border-destructive data-[status=warning]:border-warning w-full rounded-[var(--control-radius)] ring-offset-background placeholder:text-muted-foreground";
2
2
  const controlMultilineGhostClass = "ui-control-multiline data-[status=error]:border-destructive data-[status=warning]:border-warning w-full min-h-0 border-0 bg-transparent shadow-none placeholder:text-muted-foreground focus-visible:ring-0";
3
3
  const controlMultilineFilledClass = "ui-control-multiline ui-control--filled aria-invalid:border-destructive data-[status=error]:border-destructive data-[status=warning]:border-warning w-full rounded-[var(--control-radius)] ring-offset-background placeholder:text-muted-foreground";
4
4
  const controlOpenRingClass = "ui-control-trigger";
5
5
  const controlTriggerBaseClass = "ui-control ui-control-trigger flex items-center justify-between gap-2 whitespace-nowrap rounded-[var(--control-radius)] transition-[color,box-shadow] [&>[data-slot=select-value]]:line-clamp-1 [&>[data-slot=select-value]]:whitespace-normal [&>[data-slot=select-value]]:text-ellipsis";
6
- const controlTriggerClass = `${controlTriggerBaseClass} border-input bg-background`;
6
+ const controlTriggerClass = `${controlTriggerBaseClass} ui-control-outlined-surface`;
7
7
  const controlSurfaceTriggerClass = `${controlTriggerBaseClass} ui-control-surface`;
8
8
  const controlIconClass = "size-[length:var(--control-height)] shrink-0";
9
9
  const controlIconSmClass = "size-[calc(var(--control-height)-0.5rem)] shrink-0";
@@ -11,11 +11,11 @@ const controlIconLeadingClass = "size-[length:var(--control-icon-size)] shrink-0
11
11
  const tableRowHeightClass = "h-[length:var(--table-row-height)]";
12
12
  const tableHeadHeightClass = "h-[length:var(--table-row-height)]";
13
13
  const tableCellPaddingClass = "py-[length:var(--table-cell-padding-y)]";
14
- const toneSuccessClass = "border-success/30 bg-success/10 text-success-strong";
15
- const toneWarningClass = "border-warning/30 bg-warning/10 text-warning-strong";
16
- const toneInfoClass = "border-info/30 bg-info/10 text-info-strong";
14
+ const toneSuccessClass = "border-success/30 [background-color:var(--surface-success,color-mix(in_oklab,hsl(var(--success))_10%,transparent))] text-success-strong";
15
+ const toneWarningClass = "border-warning/30 [background-color:var(--surface-warning,color-mix(in_oklab,hsl(var(--warning))_10%,transparent))] text-warning-strong";
16
+ const toneInfoClass = "border-info/30 [background-color:var(--surface-info,color-mix(in_oklab,hsl(var(--info))_10%,transparent))] text-info-strong";
17
17
  const tonePrimaryClass = "border-primary/30 bg-primary/10 text-primary-strong";
18
- const toneDestructiveClass = "border-destructive/30 bg-destructive/10 text-error-strong";
18
+ const toneDestructiveClass = "border-destructive/30 [background-color:var(--surface-destructive,color-mix(in_oklab,hsl(var(--destructive))_10%,transparent))] text-error-strong";
19
19
  const toneMutedClass = "border-border bg-muted text-muted-foreground";
20
20
  const toneNeutralClass = "border-border bg-muted text-muted-foreground";
21
21
  export {
@@ -8,11 +8,31 @@ export interface OverlayPortalProviderProps {
8
8
  children: React.ReactNode;
9
9
  }
10
10
  export declare function OverlayPortalProvider({ container, children }: OverlayPortalProviderProps): React.JSX.Element;
11
+ export interface ThemeScopeProps extends React.HTMLAttributes<HTMLDivElement> {
12
+ children: React.ReactNode;
13
+ }
14
+ /**
15
+ * A themed region whose overlays keep the region's tokens.
16
+ *
17
+ * Put the theme on it — `style={tenantTheme(hex).vars}`, `data-tenant="acme"`, `className="dark"`
18
+ * — or on any ancestor, or in a stylesheet that never mentions React at all. The scope is read
19
+ * from the DOM, not from props, so all three paths behave the same.
20
+ *
21
+ * The element itself is `display: contents` by default, so dropping it into an existing flex or
22
+ * grid row changes no layout; pass `style={{ display: "block" }}` if you want a box.
23
+ */
24
+ export declare function ThemeScope({ children, style, ...props }: ThemeScopeProps): React.JSX.Element;
11
25
  /**
12
26
  * The container this overlay should render into. An explicit prop wins, so one panel can be placed
13
27
  * elsewhere without unmounting the provider around it.
14
28
  *
15
29
  * Not exported from the public barrel: this is a contract between the provider and the overlays
16
30
  * this library ships, not a knob for consumers — a consumer that needs the value has a provider.
31
+ *
32
+ * The effect re-reads the enclosing `ThemeScope` when an overlay mounts. A `MutationObserver`
33
+ * covers a theme changed by an attribute; this covers the rest — a stylesheet added late, a
34
+ * `@media` or `@supports` branch that flipped since the snapshot was taken. It costs one enumerate
35
+ * + diff (1.2ms median over 2087 properties, measured in Chromium) per overlay mount and NOTHING
36
+ * when no `ThemeScope` is above, because the context is then `undefined`.
17
37
  */
18
38
  export declare function useOverlayPortalContainer(override?: Element): Element | undefined;
@@ -1,17 +1,110 @@
1
1
  "use client";
2
2
  import { jsx } from "react/jsx-runtime";
3
3
  import * as React from "react";
4
+ import { useLayoutEffect } from "@react-aria/utils";
4
5
  import { enableShadowDOM } from "react-stately/private/flags/flags";
5
6
  const OverlayPortalContext = React.createContext(void 0);
6
7
  enableShadowDOM();
7
8
  function OverlayPortalProvider({ container, children }) {
8
9
  return /* @__PURE__ */ jsx(OverlayPortalContext.Provider, { value: container, children });
9
10
  }
11
+ const OVERLAY_THEME_HOST_ATTRIBUTE = "data-overlay-theme-host";
12
+ const OverlayThemeRefreshContext = React.createContext(void 0);
13
+ function collectCustomPropertyNames(style, into) {
14
+ for (let index = 0; index < style.length; index += 1) {
15
+ const name = style[index];
16
+ if (name.startsWith("--")) into.add(name);
17
+ }
18
+ }
19
+ function syncOverlayThemeHost(host, scope) {
20
+ const view = scope.ownerDocument.defaultView;
21
+ if (!view) return 0;
22
+ const rootStyle = view.getComputedStyle(scope.ownerDocument.documentElement);
23
+ const scopeStyle = view.getComputedStyle(scope);
24
+ const names = /* @__PURE__ */ new Set();
25
+ collectCustomPropertyNames(rootStyle, names);
26
+ collectCustomPropertyNames(scopeStyle, names);
27
+ const carried = /* @__PURE__ */ new Set();
28
+ for (const name of names) {
29
+ const value = scopeStyle.getPropertyValue(name);
30
+ if (value === rootStyle.getPropertyValue(name)) continue;
31
+ carried.add(name);
32
+ if (host.style.getPropertyValue(name) !== value) host.style.setProperty(name, value);
33
+ }
34
+ for (let index = host.style.length - 1; index >= 0; index -= 1) {
35
+ const name = host.style[index];
36
+ if (name.startsWith("--") && !carried.has(name)) host.style.removeProperty(name);
37
+ }
38
+ return carried.size;
39
+ }
40
+ function ThemeScope({ children, style, ...props }) {
41
+ const scopeRef = React.useRef(null);
42
+ const hostRef = React.useRef(null);
43
+ const parentContainer = React.useContext(OverlayPortalContext);
44
+ const [host, setHost] = React.useState();
45
+ const refresh = React.useCallback(() => {
46
+ const scope = scopeRef.current;
47
+ const currentHost = hostRef.current;
48
+ if (scope && currentHost) syncOverlayThemeHost(currentHost, scope);
49
+ }, []);
50
+ useLayoutEffect(() => {
51
+ const scope = scopeRef.current;
52
+ if (!scope) return;
53
+ const doc = scope.ownerDocument;
54
+ const parent = parentContainer ?? doc.body;
55
+ const element = doc.createElement("div");
56
+ element.setAttribute(OVERLAY_THEME_HOST_ATTRIBUTE, "");
57
+ element.style.display = "contents";
58
+ element.style.color = "hsl(var(--foreground))";
59
+ syncOverlayThemeHost(element, scope);
60
+ parent.appendChild(element);
61
+ hostRef.current = element;
62
+ setHost(element);
63
+ return () => {
64
+ element.remove();
65
+ hostRef.current = null;
66
+ setHost(void 0);
67
+ };
68
+ }, [parentContainer]);
69
+ React.useEffect(() => {
70
+ const scope = scopeRef.current;
71
+ if (!scope || !host) return;
72
+ const view = scope.ownerDocument.defaultView;
73
+ if (!view?.MutationObserver) return;
74
+ const observer = new view.MutationObserver(refresh);
75
+ for (let element = scope; element; element = element.parentElement) {
76
+ observer.observe(element, { attributes: true });
77
+ }
78
+ return () => observer.disconnect();
79
+ }, [host, refresh]);
80
+ return (
81
+ /*
82
+ * `host ?? parentContainer`, never a bare `host`: the host only exists from the first layout
83
+ * effect onward, and for that first commit an overlay below must still see whatever container
84
+ * was already in force — otherwise mounting a ThemeScope inside an `OverlayPortalProvider`
85
+ * would briefly send a `defaultOpen` panel back to `document.body`, out of the shadow root.
86
+ */
87
+ /* @__PURE__ */ jsx(OverlayPortalContext.Provider, { value: host ?? parentContainer, children: /* @__PURE__ */ jsx(OverlayThemeRefreshContext.Provider, { value: refresh, children: /* @__PURE__ */ jsx(
88
+ "div",
89
+ {
90
+ ref: scopeRef,
91
+ style: { display: "contents", color: "hsl(var(--foreground))", ...style },
92
+ ...props,
93
+ children
94
+ }
95
+ ) }) })
96
+ );
97
+ }
10
98
  function useOverlayPortalContainer(override) {
11
99
  const fromContext = React.useContext(OverlayPortalContext);
100
+ const refreshOverlayTheme = React.useContext(OverlayThemeRefreshContext);
101
+ useLayoutEffect(() => {
102
+ refreshOverlayTheme?.();
103
+ }, [refreshOverlayTheme]);
12
104
  return override ?? fromContext;
13
105
  }
14
106
  export {
15
107
  OverlayPortalProvider,
108
+ ThemeScope,
16
109
  useOverlayPortalContainer
17
110
  };
@@ -5,6 +5,18 @@ import type { AppLocale, AppRequestHeaders, AppTimeFormat, AppTimezone, AppTimez
5
5
  import type { AppBrand, AppDensity, AppFontSize, AppTheme } from "../../app/theme-axes.js";
6
6
  import type { AppPreferenceAxis } from "../../app/storage.js";
7
7
  import type { AppSettingPickerAppearanceProp, AppSettingToggleAppearanceProp, ChildrenProp, ClassNameProp, DisabledProp, IdProp, NameProp, OnValueChangeProp, ValueProp } from "../vocabulary/index.js";
8
+ /**
9
+ * @see ThemeScope
10
+ *
11
+ * A marker, not a configuration carrier: the theme is read from the DOM at this element, so there
12
+ * is no `primary`/`tenant`/`theme` prop to get wrong. Everything a `<div>` accepts is forwarded,
13
+ * which is how `data-tenant`, `className="dark"` and `style={tenantTheme(hex).vars}` are applied.
14
+ */
15
+ export type ThemeScopeProp = {
16
+ children: ChildrenProp;
17
+ className?: ClassNameProp;
18
+ id?: IdProp;
19
+ };
8
20
  /** @see AppProvider */
9
21
  export type AppProviderProp = {
10
22
  children: ChildrenProp;
@@ -11,6 +11,15 @@ export type ChartSeriesProp = {
11
11
  label?: string;
12
12
  /** CSS colour or token var. Defaults to the `--chart-1..6` palette by index. */
13
13
  color?: string;
14
+ /**
15
+ * AreaChart only — the filled band's colour, independent of the line's `color`. Defaults to
16
+ * `color`, which is the single-hue shape every other chart draws. A line has no fill and a bar's
17
+ * fill IS its `color`, so this is ignored there.
18
+ *
19
+ * The band's OPACITY is the `--chart-area-fill-alpha` theme knob, not a prop: density is a
20
+ * house style, while the hue carries meaning and belongs to the screen.
21
+ */
22
+ fillColor?: string;
14
23
  };
15
24
  /** Shared base for the cartesian charts (Line / Bar / Area). */
16
25
  type ChartCartesianBase = {
@@ -39,6 +48,23 @@ type ChartCartesianBase = {
39
48
  showLegend?: boolean;
40
49
  /** Show the cartesian background grid. */
41
50
  showGrid?: boolean;
51
+ /**
52
+ * Explicit `[min, max]` for the VALUE axis — y on a vertical chart, x on a horizontal bar.
53
+ * Omitted, the data sets it (recharts' default, which is zero-based for bars).
54
+ *
55
+ * A NON-ZERO BASELINE IS A CHARTING-ETHICS DECISION, not a layout one. Cropping the axis to the
56
+ * data's own range magnifies every wobble, and the reader has no way to tell a 2% drift from a
57
+ * collapse. It is legitimate where the SHAPE is the message and zero is not a meaningful
58
+ * reference — a price, a temperature, an index, a latency percentile — and it is misleading
59
+ * wherever the reader will compare MAGNITUDES, which is every bar chart and every "is this big"
60
+ * question. If you crop, say the range on the axis and keep `showGrid`.
61
+ */
62
+ valueDomain?: [number, number];
63
+ /**
64
+ * Explicit tick positions on the value axis, in data units. Values outside `valueDomain` are not
65
+ * drawn. Omitted, the axis picks its own.
66
+ */
67
+ valueTicks?: number[];
42
68
  /** `Intl.NumberFormat` options for axis ticks + tooltip values (locale is automatic). */
43
69
  numberFormat?: Intl.NumberFormatOptions;
44
70
  /** Message shown when `data` is empty. Defaults to a localized "no data". */
@@ -50,6 +76,8 @@ type ChartCartesianBase = {
50
76
  export type LineChartProp = ChartCartesianBase & {
51
77
  /** Render smooth (monotone) lines instead of straight segments. */
52
78
  curved?: boolean;
79
+ /** Draw a marker at every data point. Off by default — markers crowd a dense series. */
80
+ showDots?: boolean;
53
81
  };
54
82
  /** @see BarChart */
55
83
  export type BarChartProp = ChartCartesianBase & {
@@ -108,6 +136,8 @@ export type AreaChartProp = ChartCartesianBase & {
108
136
  stacked?: boolean;
109
137
  /** Render smooth (monotone) areas instead of straight segments. */
110
138
  curved?: boolean;
139
+ /** Draw a marker at every data point. Off by default — markers crowd a dense series. */
140
+ showDots?: boolean;
111
141
  };
112
142
  /** @see PieChart */
113
143
  export type PieChartProp = {
@@ -6,5 +6,5 @@ export type { ChartDatum, ChartSeriesProp, LineChartProp, BarChartProp, AreaChar
6
6
  export type { AlertQueryErrorProp, AlertProp, DialogProp, DialogContentProp, AlertTitleProp, AlertContentProp, AlertDescriptionProp, AlertActionsProp, SheetResponsiveProp, SkeletonRowsProp, } from "./feedback.prop.js";
7
7
  export type { DataStateProp, InfiniteQueryStateProp, InfiniteQueryHelpers, PrefetchLinkProp, } from "./query.prop.js";
8
8
  export type { DropdownMenuPlacementProp, DropdownMenuTriggerActionProp, PaginationProp, PaginationSizeProp, PaginationAlignProp, StepsProp, StepItemProp, StepStatusProp, StepsTypeProp, TabsProp, TabItemProp, TabsVariantProp, TabsPlacementProp, TabsExtraProp, TabsOnEditProp, } from "./navigation.prop.js";
9
- export type { AppProviderProp, AppContextValue, AppSettingKind, AppSettingPickerProp, AppSettingToggleKind, AppSettingToggleProp, } from "./app.prop.js";
9
+ export type { AppProviderProp, AppContextValue, AppSettingKind, AppSettingPickerProp, AppSettingToggleKind, AppSettingToggleProp, ThemeScopeProp, } from "./app.prop.js";
10
10
  export type { ZodSchemaProp, UseZodFormOptionsProp, UseZodFormReturnProp, FormRootProp, FormFieldControlProp, FieldErrorMessageProp, } from "./form.prop.js";
@@ -1,7 +1,7 @@
1
1
  /** Navigation component prop types — @see docs/COMPONENTS.md#navigation */
2
2
  import type * as React from "react";
3
3
  import type { ReactNode } from "react";
4
- import type { AffixProp } from "./layout.prop.js";
4
+ import type { AffixProp, AffixTargetProp } from "./layout.prop.js";
5
5
  import type { ActionsProp, ChildrenProp, ClassNameProp, DisabledProp, ErrorProp, HasActiveFiltersProp, IdProp, LabelProp, OnClearFiltersProp, PendingProp, PlaceholderProp, StickyProp, TextAlignProp } from "../vocabulary/index.js";
6
6
  import type { SearchSelectOptionProp } from "./data-entry.prop.js";
7
7
  /**
@@ -840,6 +840,12 @@ export type AnchorDirectionProp = "vertical" | "horizontal";
840
840
  * controlled value (`value` / `defaultValue` / `onValueChange`), which antd has no spelling for
841
841
  * at all. All three antd names stay findable — declared `never`, `@deprecated` with the
842
842
  * replacement named, and warned about in development.
843
+ *
844
+ * `target` (gh#890) is a fourth: `getContainer`'s own idea, renamed to `Affix`'s spelling and
845
+ * shape (`AffixTargetProp`) so the two components that share a scroll box — `Anchor` pins itself
846
+ * to one AND resolves which section is current inside it — share one name for it too. Unlike the
847
+ * other three it is additive, not a hard break: `getContainer` still works, `target` wins when
848
+ * both are given.
843
849
  */
844
850
  export type AnchorProp = {
845
851
  /** The entries, in document order. Ant Design `items`. */
@@ -857,7 +863,20 @@ export type AnchorProp = {
857
863
  affix?: boolean | Omit<AffixProp, "offsetBlockStart" | "offsetTop" | "target" | "children">;
858
864
  /** Tolerance, in pixels, added to the decision line. Ant Design `bounds`, default `5`. */
859
865
  bounds?: number;
860
- /** The scroll box holding the sections. Ant Design `getContainer`, default `() => window`. */
866
+ /**
867
+ * The scroll box the sections are measured in AND the box `Affix` pins the nav against — one
868
+ * function, both halves (gh#890). `AffixTargetProp`, the same lazy-getter shape and the same
869
+ * name `Affix.target` / `FloatButton.BackTop.target` already spell here, so a consumer who has
870
+ * scoped one scrolling component already knows this one. `null` (or an absent `target`) means
871
+ * the viewport, matching `Affix`. Wins over `getContainer` when both are given.
872
+ */
873
+ target?: AffixTargetProp;
874
+ /**
875
+ * The scroll box holding the sections. Ant Design `getContainer`, default `() => window`.
876
+ *
877
+ * Superseded by `target`, which mirrors `Affix`'s own spelling for the identical idea; kept,
878
+ * still live, for a call site written before `target` existed.
879
+ */
861
880
  getContainer?: () => AnchorContainerProp;
862
881
  /**
863
882
  * Last word on the highlight, given the one the scroll position resolved. Ant Design
@@ -46,14 +46,48 @@ export type ButtonRefetchProp = Omit<ButtonProp, "onClick" | "disabled"> & {
46
46
  query: QueryRefetchLike;
47
47
  label?: React.ReactNode;
48
48
  };
49
- type InfiniteQueryLike<TPage> = Pick<UseInfiniteQueryResult<InfiniteData<TPage>, unknown>, "isPending" | "isError" | "isFetching" | "isFetchingNextPage" | "error" | "data" | "hasNextPage" | "fetchNextPage" | "refetch">;
49
+ /**
50
+ * TPage MUST BE INFERABLE FROM `data`, WHICH A BARE `Pick` MAKES IMPOSSIBLE (gh#889).
51
+ *
52
+ * This was `Pick<UseInfiniteQueryResult<InfiniteData<TPage>, unknown>, … | "data" | …>`. TPage is
53
+ * then buried under a mapped type over a generic instantiation, and TypeScript cannot run inference
54
+ * backwards through a mapped type — so every consumer of `InfiniteQueryState` got `TPage = unknown`
55
+ * from `query={q}` however well typed `q` was, which collapsed TFlat and handed `unknown` to
56
+ * `flatten`, `isEmpty` and `children`. The catalog example was written with
57
+ * `flatten={flattenItemPages as any}` and three `: any` annotations, and the cast is what kept the
58
+ * defect invisible: a reader could not tell whether the inference was broken or the example sloppy.
59
+ *
60
+ * Spelling `data` as its own intersection member puts `InfiniteData<TPage>` — a plain object type
61
+ * whose `pages` is `TPage[]` — in an inference position. The `Pick` still supplies the other eight
62
+ * fields, so they stay tied to tanstack's real result shape and a signature change there still
63
+ * breaks the build here.
64
+ */
65
+ type InfiniteQueryLike<TPage> = Omit<Pick<UseInfiniteQueryResult<InfiniteData<TPage>, unknown>, "isPending" | "isError" | "isFetching" | "isFetchingNextPage" | "error" | "data" | "hasNextPage" | "fetchNextPage" | "refetch">, "data"> & {
66
+ data: InfiniteData<TPage> | undefined;
67
+ };
50
68
  export type InfiniteQueryHelpers = {
51
69
  fetchNextPage: () => void;
52
70
  hasNextPage: boolean;
53
71
  isFetchingNextPage: boolean;
54
72
  };
55
73
  /** @see InfiniteQueryState — useInfiniteQuery lifecycle + load more. */
56
- export type InfiniteQueryStateProp<TPage, TFlat> = {
74
+ /**
75
+ * TFLAT'S DEFAULT IS WHAT MAKES `flatten={flattenItemPages}` TYPE (gh#889).
76
+ *
77
+ * TypeScript infers a type parameter from argument POSITIONS. `TFlat` appears in the RETURN of
78
+ * `flatten`, so when `flatten` is handed a generic function BY REFERENCE the source signature is
79
+ * still uninstantiated and produces no inference candidate at all — `TFlat` fell to `unknown` and
80
+ * `isEmpty` and `children` received `unknown`. That is why the catalog example shipped as
81
+ * `flatten={flattenItemPages as any}` with `(it: any)` and `(items: any)`.
82
+ *
83
+ * A default is used exactly when inference yields no candidate, which is precisely this case: the
84
+ * flattened shape of the library's own `flattenItemPages`. An inline arrow — `flatten={(d) =>
85
+ * d.pages.flatMap((p) => p.rows)}` — is context-sensitive, so it DOES produce a candidate and
86
+ * overrides the default as before. Nothing about a custom flatten changes.
87
+ */
88
+ export type InfiniteQueryStateProp<TPage, TFlat = TPage extends {
89
+ items: (infer TItem)[];
90
+ } ? TItem[] : unknown> = {
57
91
  query: InfiniteQueryLike<TPage>;
58
92
  skeleton: React.ReactNode;
59
93
  empty?: React.ReactNode;
@@ -702,6 +702,11 @@ export declare const COMPONENT_PROP_REGISTRY: {
702
702
  readonly file: "components/app.prop.ts";
703
703
  readonly vocabulary: readonly ["ChildrenProp"];
704
704
  };
705
+ readonly ThemeScopeProp: {
706
+ readonly group: "app";
707
+ readonly file: "components/app.prop.ts";
708
+ readonly vocabulary: readonly ["ChildrenProp", "ClassNameProp", "IdProp"];
709
+ };
705
710
  readonly AppSettingPickerProp: {
706
711
  readonly group: "app";
707
712
  readonly file: "components/app.prop.ts";
@@ -2041,6 +2046,10 @@ export declare const COMPONENT_PROP_REGISTRY: {
2041
2046
  readonly field: "color";
2042
2047
  readonly local: true;
2043
2048
  readonly reason: "Per-series colour override (defaults to --chart-N).";
2049
+ }, {
2050
+ readonly field: "fillColor";
2051
+ readonly local: true;
2052
+ readonly reason: "AreaChart band colour, independent of the line's `color`.";
2044
2053
  }];
2045
2054
  };
2046
2055
  readonly LineChartProp: {
@@ -2078,10 +2087,22 @@ export declare const COMPONENT_PROP_REGISTRY: {
2078
2087
  readonly field: "numberFormat";
2079
2088
  readonly local: true;
2080
2089
  readonly reason: "Intl.NumberFormat options for ticks/tooltips.";
2090
+ }, {
2091
+ readonly field: "valueDomain";
2092
+ readonly local: true;
2093
+ readonly reason: "Explicit [min, max] on the value axis (y vertical, x horizontal).";
2094
+ }, {
2095
+ readonly field: "valueTicks";
2096
+ readonly local: true;
2097
+ readonly reason: "Explicit tick positions on the value axis.";
2081
2098
  }, {
2082
2099
  readonly field: "curved";
2083
2100
  readonly local: true;
2084
2101
  readonly reason: "Smooth (monotone) line rendering.";
2102
+ }, {
2103
+ readonly field: "showDots";
2104
+ readonly local: true;
2105
+ readonly reason: "Chart-specific point-marker toggle.";
2085
2106
  }];
2086
2107
  };
2087
2108
  readonly BarChartProp: {
@@ -2119,6 +2140,14 @@ export declare const COMPONENT_PROP_REGISTRY: {
2119
2140
  readonly field: "numberFormat";
2120
2141
  readonly local: true;
2121
2142
  readonly reason: "Intl.NumberFormat options for ticks/tooltips.";
2143
+ }, {
2144
+ readonly field: "valueDomain";
2145
+ readonly local: true;
2146
+ readonly reason: "Explicit [min, max] on the value axis (y vertical, x horizontal).";
2147
+ }, {
2148
+ readonly field: "valueTicks";
2149
+ readonly local: true;
2150
+ readonly reason: "Explicit tick positions on the value axis.";
2122
2151
  }, {
2123
2152
  readonly field: "stacked";
2124
2153
  readonly local: true;
@@ -2201,6 +2230,14 @@ export declare const COMPONENT_PROP_REGISTRY: {
2201
2230
  readonly field: "numberFormat";
2202
2231
  readonly local: true;
2203
2232
  readonly reason: "Intl.NumberFormat options for ticks/tooltips.";
2233
+ }, {
2234
+ readonly field: "valueDomain";
2235
+ readonly local: true;
2236
+ readonly reason: "Explicit [min, max] on the value axis (y vertical, x horizontal).";
2237
+ }, {
2238
+ readonly field: "valueTicks";
2239
+ readonly local: true;
2240
+ readonly reason: "Explicit tick positions on the value axis.";
2204
2241
  }, {
2205
2242
  readonly field: "stacked";
2206
2243
  readonly local: true;
@@ -2209,6 +2246,10 @@ export declare const COMPONENT_PROP_REGISTRY: {
2209
2246
  readonly field: "curved";
2210
2247
  readonly local: true;
2211
2248
  readonly reason: "Smooth (monotone) area rendering.";
2249
+ }, {
2250
+ readonly field: "showDots";
2251
+ readonly local: true;
2252
+ readonly reason: "Chart-specific point-marker toggle.";
2212
2253
  }];
2213
2254
  };
2214
2255
  readonly PieChartProp: {
@@ -3722,10 +3763,14 @@ export declare const COMPONENT_PROP_REGISTRY: {
3722
3763
  readonly field: "bounds";
3723
3764
  readonly local: true;
3724
3765
  readonly reason: "Ant Design `Anchor.bounds` — pixel tolerance added to the decision line.";
3766
+ }, {
3767
+ readonly field: "target";
3768
+ readonly local: true;
3769
+ readonly reason: "gh#890 — `Affix`'s own lazy scroll-box getter, same shape and name, so the pin and the scroll-spy agree on one container. Wins over `getContainer` when both are given.";
3725
3770
  }, {
3726
3771
  readonly field: "getContainer";
3727
3772
  readonly local: true;
3728
- readonly reason: "Ant Design `Anchor.getContainer` — the lazy scroll-box getter.";
3773
+ readonly reason: "Ant Design `Anchor.getContainer` — the lazy scroll-box getter. Superseded by `target` (gh#890) but kept live for a call site written before it existed.";
3729
3774
  }, {
3730
3775
  readonly field: "getCurrentAnchor";
3731
3776
  readonly local: true;
@@ -698,6 +698,11 @@ const VOCABULARY_REGISTRY = {
698
698
  };
699
699
  const COMPONENT_PROP_REGISTRY = {
700
700
  AppProviderProp: { group: "app", file: "components/app.prop.ts", vocabulary: ["ChildrenProp"] },
701
+ ThemeScopeProp: {
702
+ group: "app",
703
+ file: "components/app.prop.ts",
704
+ vocabulary: ["ChildrenProp", "ClassNameProp", "IdProp"]
705
+ },
701
706
  AppSettingPickerProp: {
702
707
  group: "app",
703
708
  file: "components/app.prop.ts",
@@ -2494,6 +2499,11 @@ const COMPONENT_PROP_REGISTRY = {
2494
2499
  field: "color",
2495
2500
  local: true,
2496
2501
  reason: "Per-series colour override (defaults to --chart-N)."
2502
+ },
2503
+ {
2504
+ field: "fillColor",
2505
+ local: true,
2506
+ reason: "AreaChart band colour, independent of the line's `color`."
2497
2507
  }
2498
2508
  ]
2499
2509
  },
@@ -2523,7 +2533,14 @@ const COMPONENT_PROP_REGISTRY = {
2523
2533
  local: true,
2524
2534
  reason: "Intl.NumberFormat options for ticks/tooltips."
2525
2535
  },
2526
- { field: "curved", local: true, reason: "Smooth (monotone) line rendering." }
2536
+ {
2537
+ field: "valueDomain",
2538
+ local: true,
2539
+ reason: "Explicit [min, max] on the value axis (y vertical, x horizontal)."
2540
+ },
2541
+ { field: "valueTicks", local: true, reason: "Explicit tick positions on the value axis." },
2542
+ { field: "curved", local: true, reason: "Smooth (monotone) line rendering." },
2543
+ { field: "showDots", local: true, reason: "Chart-specific point-marker toggle." }
2527
2544
  ]
2528
2545
  },
2529
2546
  BarChartProp: {
@@ -2552,6 +2569,12 @@ const COMPONENT_PROP_REGISTRY = {
2552
2569
  local: true,
2553
2570
  reason: "Intl.NumberFormat options for ticks/tooltips."
2554
2571
  },
2572
+ {
2573
+ field: "valueDomain",
2574
+ local: true,
2575
+ reason: "Explicit [min, max] on the value axis (y vertical, x horizontal)."
2576
+ },
2577
+ { field: "valueTicks", local: true, reason: "Explicit tick positions on the value axis." },
2555
2578
  { field: "stacked", local: true, reason: "Stack series into one bar." },
2556
2579
  { field: "horizontal", local: true, reason: "Category axis on the left." }
2557
2580
  ]
@@ -2619,8 +2642,15 @@ const COMPONENT_PROP_REGISTRY = {
2619
2642
  local: true,
2620
2643
  reason: "Intl.NumberFormat options for ticks/tooltips."
2621
2644
  },
2645
+ {
2646
+ field: "valueDomain",
2647
+ local: true,
2648
+ reason: "Explicit [min, max] on the value axis (y vertical, x horizontal)."
2649
+ },
2650
+ { field: "valueTicks", local: true, reason: "Explicit tick positions on the value axis." },
2622
2651
  { field: "stacked", local: true, reason: "Stack series areas." },
2623
- { field: "curved", local: true, reason: "Smooth (monotone) area rendering." }
2652
+ { field: "curved", local: true, reason: "Smooth (monotone) area rendering." },
2653
+ { field: "showDots", local: true, reason: "Chart-specific point-marker toggle." }
2624
2654
  ]
2625
2655
  },
2626
2656
  PieChartProp: {
@@ -4516,10 +4546,15 @@ const COMPONENT_PROP_REGISTRY = {
4516
4546
  local: true,
4517
4547
  reason: "Ant Design `Anchor.bounds` \u2014 pixel tolerance added to the decision line."
4518
4548
  },
4549
+ {
4550
+ field: "target",
4551
+ local: true,
4552
+ reason: "gh#890 \u2014 `Affix`'s own lazy scroll-box getter, same shape and name, so the pin and the scroll-spy agree on one container. Wins over `getContainer` when both are given."
4553
+ },
4519
4554
  {
4520
4555
  field: "getContainer",
4521
4556
  local: true,
4522
- reason: "Ant Design `Anchor.getContainer` \u2014 the lazy scroll-box getter."
4557
+ reason: "Ant Design `Anchor.getContainer` \u2014 the lazy scroll-box getter. Superseded by `target` (gh#890) but kept live for a call site written before it existed."
4523
4558
  },
4524
4559
  {
4525
4560
  field: "getCurrentAnchor",