@schemavaults/ui 0.100.0 → 0.102.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/components/layout/dashboard-layout/DashboardLayoutProps.d.ts +19 -0
- package/dist/components/layout/dashboard-layout/dashboard-layout-main-content-container.js +7 -1
- package/dist/components/layout/dashboard-layout/dashboard-layout-main-content-container.js.map +1 -1
- package/dist/components/layout/dashboard-layout/dashboard-layout-reduced-motion.d.ts +43 -0
- package/dist/components/layout/dashboard-layout/dashboard-layout-reduced-motion.js +41 -0
- package/dist/components/layout/dashboard-layout/dashboard-layout-reduced-motion.js.map +1 -0
- package/dist/components/layout/dashboard-layout/dashboard-layout.d.ts +1 -1
- package/dist/components/layout/dashboard-layout/dashboard-layout.js +22 -8
- package/dist/components/layout/dashboard-layout/dashboard-layout.js.map +1 -1
- package/dist/components/layout/dashboard-layout/dashboard-sidebar/dashboard-sidebar-content.js +3 -1
- package/dist/components/layout/dashboard-layout/dashboard-sidebar/dashboard-sidebar-content.js.map +1 -1
- package/dist/components/layout/dashboard-layout/dashboard-sidebar/dashboard-sidebar-header.js +14 -6
- package/dist/components/layout/dashboard-layout/dashboard-sidebar/dashboard-sidebar-header.js.map +1 -1
- package/dist/components/layout/dashboard-layout/dashboard-sidebar/dashboard-sidebar-item-group-renderer.js +13 -6
- package/dist/components/layout/dashboard-layout/dashboard-sidebar/dashboard-sidebar-item-group-renderer.js.map +1 -1
- package/dist/components/layout/dashboard-layout/dashboard-sidebar/dashboard-sidebar-item-renderer.js +11 -4
- package/dist/components/layout/dashboard-layout/dashboard-sidebar/dashboard-sidebar-item-renderer.js.map +1 -1
- package/dist/components/layout/dashboard-layout/dashboard-sidebar/dashboard-sidebar-layout.js +6 -1
- package/dist/components/layout/dashboard-layout/dashboard-sidebar/dashboard-sidebar-layout.js.map +1 -1
- package/dist/components/layout/dashboard-layout/dashboard-sidebar/dashboard-sidebar.js +9 -1
- package/dist/components/layout/dashboard-layout/dashboard-sidebar/dashboard-sidebar.js.map +1 -1
- package/dist/components/layout/dashboard-layout/index.d.ts +3 -0
- package/dist/components/layout/dashboard-layout/index.js +4 -0
- package/dist/components/layout/dashboard-layout/index.js.map +1 -1
- package/dist/components/layout/dashboard-layout/useDashboardLayoutReducedMotion.d.ts +36 -0
- package/dist/components/layout/dashboard-layout/useDashboardLayoutReducedMotion.js +55 -0
- package/dist/components/layout/dashboard-layout/useDashboardLayoutReducedMotion.js.map +1 -0
- package/dist/components/layout/dashboard-layout/useToggleDashboardLayoutCollapsedTransitionTime.d.ts +14 -0
- package/dist/components/layout/dashboard-layout/useToggleDashboardLayoutCollapsedTransitionTime.js +21 -0
- package/dist/components/layout/dashboard-layout/useToggleDashboardLayoutCollapsedTransitionTime.js.map +1 -0
- package/dist/components/ui/index.d.ts +2 -0
- package/dist/components/ui/index.js +1 -0
- package/dist/components/ui/index.js.map +1 -1
- package/dist/components/ui/scatter-plot/index.d.ts +3 -0
- package/dist/components/ui/scatter-plot/index.js +3 -0
- package/dist/components/ui/scatter-plot/index.js.map +1 -0
- package/dist/components/ui/scatter-plot/scatter-plot.d.ts +169 -0
- package/dist/components/ui/scatter-plot/scatter-plot.js +385 -0
- package/dist/components/ui/scatter-plot/scatter-plot.js.map +1 -0
- package/dist/framer-motion.d.ts +2 -2
- package/dist/framer-motion.js +1 -1
- package/dist/framer-motion.js.map +1 -1
- package/package.json +1 -1
|
@@ -0,0 +1,36 @@
|
|
|
1
|
+
import { type DashboardLayoutReducedMotionSetting } from "./dashboard-layout-reduced-motion";
|
|
2
|
+
/**
|
|
3
|
+
* The reduced-motion setting in force for the surrounding dashboard layout.
|
|
4
|
+
*
|
|
5
|
+
* `DashboardLayout` publishes its resolved setting through Framer Motion's
|
|
6
|
+
* `MotionConfig`, so this reads it straight back out — no second context to
|
|
7
|
+
* keep in step. Pair it with
|
|
8
|
+
* {@link ./dashboard-layout-reduced-motion!reducedMotionClassName} on any
|
|
9
|
+
* element of the layout that animates in CSS.
|
|
10
|
+
*/
|
|
11
|
+
export declare function useDashboardLayoutReducedMotionSetting(): DashboardLayoutReducedMotionSetting;
|
|
12
|
+
/**
|
|
13
|
+
* Whether the dashboard layout should skip its animations right now.
|
|
14
|
+
*
|
|
15
|
+
* Accounts for both the `prefers-reduced-motion` media query and the layout's
|
|
16
|
+
* `reducedMotion` prop. Use it for the animations that run in JavaScript —
|
|
17
|
+
* Framer Motion's `layout` reflow and animation durations — where a decision
|
|
18
|
+
* has to be made rather than a media query declared. Exported so
|
|
19
|
+
* consumer-supplied top bar and sidebar footer components can match the
|
|
20
|
+
* layout chrome they are rendered into.
|
|
21
|
+
*/
|
|
22
|
+
export declare function useDashboardLayoutReducedMotion(): boolean;
|
|
23
|
+
/**
|
|
24
|
+
* Resolve `DashboardLayout`'s `reducedMotion` prop into the setting it hands
|
|
25
|
+
* to `MotionConfig` for its subtree.
|
|
26
|
+
*
|
|
27
|
+
* When the prop is omitted the default is `"user"`: the layout opts into
|
|
28
|
+
* honouring `prefers-reduced-motion`, unlike Framer Motion, which defaults to
|
|
29
|
+
* `"never"`. An enclosing `MotionConfig` that has already forced
|
|
30
|
+
* `reducedMotion="always"` (an app-wide "reduce motion" preference) is
|
|
31
|
+
* inherited rather than relaxed back to the media query; an enclosing
|
|
32
|
+
* `"never"` is not, since ignoring the viewer's setting should have to be
|
|
33
|
+
* opted into on the layout itself.
|
|
34
|
+
*/
|
|
35
|
+
export declare function useResolvedDashboardLayoutReducedMotionSetting(setting?: DashboardLayoutReducedMotionSetting): DashboardLayoutReducedMotionSetting;
|
|
36
|
+
export default useDashboardLayoutReducedMotion;
|
|
@@ -0,0 +1,55 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import { useContext } from "react";
|
|
3
|
+
import { MotionConfigContext, useReducedMotionConfig } from "../../../framer-motion";
|
|
4
|
+
import { DEFAULT_DASHBOARD_LAYOUT_REDUCED_MOTION_SETTING, } from "./dashboard-layout-reduced-motion";
|
|
5
|
+
/**
|
|
6
|
+
* The reduced-motion setting in force for the surrounding dashboard layout.
|
|
7
|
+
*
|
|
8
|
+
* `DashboardLayout` publishes its resolved setting through Framer Motion's
|
|
9
|
+
* `MotionConfig`, so this reads it straight back out — no second context to
|
|
10
|
+
* keep in step. Pair it with
|
|
11
|
+
* {@link ./dashboard-layout-reduced-motion!reducedMotionClassName} on any
|
|
12
|
+
* element of the layout that animates in CSS.
|
|
13
|
+
*/
|
|
14
|
+
export function useDashboardLayoutReducedMotionSetting() {
|
|
15
|
+
return (useContext(MotionConfigContext).reducedMotion ??
|
|
16
|
+
DEFAULT_DASHBOARD_LAYOUT_REDUCED_MOTION_SETTING);
|
|
17
|
+
}
|
|
18
|
+
/**
|
|
19
|
+
* Whether the dashboard layout should skip its animations right now.
|
|
20
|
+
*
|
|
21
|
+
* Accounts for both the `prefers-reduced-motion` media query and the layout's
|
|
22
|
+
* `reducedMotion` prop. Use it for the animations that run in JavaScript —
|
|
23
|
+
* Framer Motion's `layout` reflow and animation durations — where a decision
|
|
24
|
+
* has to be made rather than a media query declared. Exported so
|
|
25
|
+
* consumer-supplied top bar and sidebar footer components can match the
|
|
26
|
+
* layout chrome they are rendered into.
|
|
27
|
+
*/
|
|
28
|
+
export function useDashboardLayoutReducedMotion() {
|
|
29
|
+
// `useReducedMotionConfig()` is `boolean | null`; null only means the media
|
|
30
|
+
// query has not been read, which is not a preference for reduced motion.
|
|
31
|
+
return useReducedMotionConfig() === true;
|
|
32
|
+
}
|
|
33
|
+
/**
|
|
34
|
+
* Resolve `DashboardLayout`'s `reducedMotion` prop into the setting it hands
|
|
35
|
+
* to `MotionConfig` for its subtree.
|
|
36
|
+
*
|
|
37
|
+
* When the prop is omitted the default is `"user"`: the layout opts into
|
|
38
|
+
* honouring `prefers-reduced-motion`, unlike Framer Motion, which defaults to
|
|
39
|
+
* `"never"`. An enclosing `MotionConfig` that has already forced
|
|
40
|
+
* `reducedMotion="always"` (an app-wide "reduce motion" preference) is
|
|
41
|
+
* inherited rather than relaxed back to the media query; an enclosing
|
|
42
|
+
* `"never"` is not, since ignoring the viewer's setting should have to be
|
|
43
|
+
* opted into on the layout itself.
|
|
44
|
+
*/
|
|
45
|
+
export function useResolvedDashboardLayoutReducedMotionSetting(setting) {
|
|
46
|
+
const inheritedSetting = useContext(MotionConfigContext).reducedMotion;
|
|
47
|
+
if (setting !== undefined) {
|
|
48
|
+
return setting;
|
|
49
|
+
}
|
|
50
|
+
return inheritedSetting === "always"
|
|
51
|
+
? "always"
|
|
52
|
+
: DEFAULT_DASHBOARD_LAYOUT_REDUCED_MOTION_SETTING;
|
|
53
|
+
}
|
|
54
|
+
export default useDashboardLayoutReducedMotion;
|
|
55
|
+
//# sourceMappingURL=useDashboardLayoutReducedMotion.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useDashboardLayoutReducedMotion.js","sourceRoot":"","sources":["../../../../src/components/layout/dashboard-layout/useDashboardLayoutReducedMotion.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,EAAE,UAAU,EAAE,MAAM,OAAO,CAAC;AACnC,OAAO,EAAE,mBAAmB,EAAE,sBAAsB,EAAE,MAAM,iBAAiB,CAAC;AAC9E,OAAO,EACL,+CAA+C,GAEhD,MAAM,mCAAmC,CAAC;AAE3C;;;;;;;;GAQG;AACH,MAAM,UAAU,sCAAsC;IACpD,OAAO,CACL,UAAU,CAAC,mBAAmB,CAAC,CAAC,aAAa;QAC7C,+CAA+C,CAChD,CAAC;AACJ,CAAC;AAED;;;;;;;;;GASG;AACH,MAAM,UAAU,+BAA+B;IAC7C,4EAA4E;IAC5E,yEAAyE;IACzE,OAAO,sBAAsB,EAAE,KAAK,IAAI,CAAC;AAC3C,CAAC;AAED;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,8CAA8C,CAC5D,OAA6C;IAE7C,MAAM,gBAAgB,GACpB,UAAU,CAAC,mBAAmB,CAAC,CAAC,aAAa,CAAC;IAEhD,IAAI,OAAO,KAAK,SAAS,EAAE,CAAC;QAC1B,OAAO,OAAO,CAAC;IACjB,CAAC;IACD,OAAO,gBAAgB,KAAK,QAAQ;QAClC,CAAC,CAAC,QAAQ;QACV,CAAC,CAAC,+CAA+C,CAAC;AACtD,CAAC;AAED,eAAe,+BAA+B,CAAC"}
|
package/dist/components/layout/dashboard-layout/useToggleDashboardLayoutCollapsedTransitionTime.d.ts
ADDED
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* The duration, in seconds, of the sidebar expand/collapse animations.
|
|
3
|
+
*
|
|
4
|
+
* `0` when motion is reduced, so the wordmark and the group labels appear and
|
|
5
|
+
* disappear with the sidebar instead of scaling and fading over a third of a
|
|
6
|
+
* second. The staggered delays in those variants are derived from this same
|
|
7
|
+
* value, so they collapse to `0` along with it.
|
|
8
|
+
*
|
|
9
|
+
* Framer Motion's own `reducedMotion` handling only switches off *transform*
|
|
10
|
+
* and layout animations; the width, height and padding animations in the
|
|
11
|
+
* sidebar are none of those, which is why the duration is zeroed explicitly.
|
|
12
|
+
*/
|
|
13
|
+
export declare function useToggleDashboardLayoutCollapsedTransitionTime(): number;
|
|
14
|
+
export default useToggleDashboardLayoutCollapsedTransitionTime;
|
package/dist/components/layout/dashboard-layout/useToggleDashboardLayoutCollapsedTransitionTime.js
ADDED
|
@@ -0,0 +1,21 @@
|
|
|
1
|
+
"use client";
|
|
2
|
+
import toggleDashboardLayoutCollapsedTransitionTime from "./toggle-dashboard-layout-collapsed-transition-time";
|
|
3
|
+
import useDashboardLayoutReducedMotion from "./useDashboardLayoutReducedMotion";
|
|
4
|
+
/**
|
|
5
|
+
* The duration, in seconds, of the sidebar expand/collapse animations.
|
|
6
|
+
*
|
|
7
|
+
* `0` when motion is reduced, so the wordmark and the group labels appear and
|
|
8
|
+
* disappear with the sidebar instead of scaling and fading over a third of a
|
|
9
|
+
* second. The staggered delays in those variants are derived from this same
|
|
10
|
+
* value, so they collapse to `0` along with it.
|
|
11
|
+
*
|
|
12
|
+
* Framer Motion's own `reducedMotion` handling only switches off *transform*
|
|
13
|
+
* and layout animations; the width, height and padding animations in the
|
|
14
|
+
* sidebar are none of those, which is why the duration is zeroed explicitly.
|
|
15
|
+
*/
|
|
16
|
+
export function useToggleDashboardLayoutCollapsedTransitionTime() {
|
|
17
|
+
const reduced = useDashboardLayoutReducedMotion();
|
|
18
|
+
return reduced ? 0 : toggleDashboardLayoutCollapsedTransitionTime;
|
|
19
|
+
}
|
|
20
|
+
export default useToggleDashboardLayoutCollapsedTransitionTime;
|
|
21
|
+
//# sourceMappingURL=useToggleDashboardLayoutCollapsedTransitionTime.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"useToggleDashboardLayoutCollapsedTransitionTime.js","sourceRoot":"","sources":["../../../../src/components/layout/dashboard-layout/useToggleDashboardLayoutCollapsedTransitionTime.ts"],"names":[],"mappings":"AAAA,YAAY,CAAC;AAEb,OAAO,4CAA4C,MAAM,qDAAqD,CAAC;AAC/G,OAAO,+BAA+B,MAAM,mCAAmC,CAAC;AAEhF;;;;;;;;;;;GAWG;AACH,MAAM,UAAU,+CAA+C;IAC7D,MAAM,OAAO,GAAY,+BAA+B,EAAE,CAAC;IAC3D,OAAO,OAAO,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,4CAA4C,CAAC;AACpE,CAAC;AAED,eAAe,+CAA+C,CAAC"}
|
|
@@ -196,6 +196,8 @@ export * from "./line-chart";
|
|
|
196
196
|
export type * from "./line-chart";
|
|
197
197
|
export * from "./radar-chart";
|
|
198
198
|
export type * from "./radar-chart";
|
|
199
|
+
export * from "./scatter-plot";
|
|
200
|
+
export type * from "./scatter-plot";
|
|
199
201
|
export * from "./comparison-slider";
|
|
200
202
|
export type * from "./comparison-slider";
|
|
201
203
|
export * from "./theme-selector";
|
|
@@ -97,6 +97,7 @@ export * from "./pie-chart";
|
|
|
97
97
|
export * from "./bar-chart";
|
|
98
98
|
export * from "./line-chart";
|
|
99
99
|
export * from "./radar-chart";
|
|
100
|
+
export * from "./scatter-plot";
|
|
100
101
|
export * from "./comparison-slider";
|
|
101
102
|
export * from "./theme-selector";
|
|
102
103
|
export * from "./tree-view";
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ui/index.ts"],"names":[],"mappings":"AAAA,cAAc,UAAU,CAAC;AAGzB,cAAc,uBAAuB,CAAC;AAGtC,cAAc,aAAa,CAAC;AAG5B,cAAc,eAAe,CAAC;AAG9B,cAAc,SAAS,CAAC;AAGxB,cAAc,WAAW,CAAC;AAG1B,cAAc,cAAc,CAAC;AAG7B,cAAc,SAAS,CAAC;AAGxB,cAAc,mBAAmB,CAAC;AAGlC,cAAc,0BAA0B,CAAC;AAGzC,cAAc,UAAU,CAAC;AAGzB,cAAc,SAAS,CAAC;AAGxB,cAAc,kBAAkB,CAAC;AAGjC,cAAc,aAAa,CAAC;AAG5B,cAAc,kCAAkC,CAAC;AAGjD,cAAc,cAAc,CAAC;AAG7B,cAAc,YAAY,CAAC;AAG3B,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC;AAExB,cAAc,WAAW,CAAC;AAG1B,cAAc,YAAY,CAAC;AAG3B,cAAc,mBAAmB,CAAC;AAGlC,cAAc,QAAQ,CAAC;AAGvB,cAAc,QAAQ,CAAC;AAGvB,cAAc,aAAa,CAAC;AAG5B,cAAc,iBAAiB,CAAC;AAGhC,cAAc,WAAW,CAAC;AAG1B,cAAc,mBAAmB,CAAC;AAGlC,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAG/B,cAAc,WAAW,CAAC;AAG1B,cAAc,WAAW,CAAC;AAG1B,cAAc,YAAY,CAAC;AAG3B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,SAAS,CAAC;AAGxB,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,YAAY,CAAC;AAG3B,cAAc,mBAAmB,CAAC;AAGlC,cAAc,gBAAgB,CAAC;AAG/B,cAAc,cAAc,CAAC;AAG7B,cAAc,eAAe,CAAC;AAG9B,cAAc,oBAAoB,CAAC;AAGnC,cAAc,YAAY,CAAC;AAG3B,cAAc,2BAA2B,CAAC;AAG1C,cAAc,oBAAoB,CAAC;AAGnC,cAAc,kBAAkB,CAAC;AAGjC,cAAc,sBAAsB,CAAC;AAGrC,cAAc,gBAAgB,CAAC;AAG/B,cAAc,eAAe,CAAC;AAG9B,cAAc,WAAW,CAAC;AAG1B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,cAAc,CAAC;AAG7B,cAAc,SAAS,CAAC;AAGxB,cAAc,UAAU,CAAC;AAGzB,cAAc,eAAe,CAAC;AAG9B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,oBAAoB,CAAC;AAGnC,cAAc,mBAAmB,CAAC;AAGlC,cAAc,QAAQ,CAAC;AAGvB,cAAc,QAAQ,CAAC;AAGvB,cAAc,UAAU,CAAC;AAGzB,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAG/B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,mBAAmB,CAAC;AAGlC,cAAc,SAAS,CAAC;AAGxB,cAAc,SAAS,CAAC;AAGxB,cAAc,iBAAiB,CAAC;AAGhC,cAAc,cAAc,CAAC;AAG7B,cAAc,cAAc,CAAC;AAG7B,cAAc,OAAO,CAAC;AAGtB,cAAc,eAAe,CAAC;AAG9B,cAAc,WAAW,CAAC;AAG1B,cAAc,UAAU,CAAC;AAGzB,cAAc,eAAe,CAAC;AAG9B,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,UAAU,CAAC;AAGzB,cAAc,gBAAgB,CAAC;AAG/B,cAAc,cAAc,CAAC;AAG7B,cAAc,WAAW,CAAC;AAG1B,cAAc,iBAAiB,CAAC;AAGhC,cAAc,eAAe,CAAC;AAG9B,cAAc,eAAe,CAAC;AAG9B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,WAAW,CAAC;AAG1B,cAAc,UAAU,CAAC;AAGzB,cAAc,QAAQ,CAAC;AAGvB,cAAc,cAAc,CAAC;AAG7B,cAAc,iBAAiB,CAAC;AAGhC,cAAc,aAAa,CAAC;AAG5B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,oBAAoB,CAAC;AAGnC,cAAc,aAAa,CAAC;AAG5B,cAAc,aAAa,CAAC;AAG5B,cAAc,cAAc,CAAC;AAG7B,cAAc,eAAe,CAAC;AAG9B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,kBAAkB,CAAC;AAGjC,cAAc,aAAa,CAAC;AAG5B,cAAc,YAAY,CAAC;AAG3B,cAAc,aAAa,CAAC;AAG5B,cAAc,0BAA0B,CAAC;AAGzC,cAAc,iBAAiB,CAAC;AAGhC,cAAc,qBAAqB,CAAC;AAGpC,cAAc,YAAY,CAAC;AAG3B,cAAc,eAAe,CAAC;AAG9B,cAAc,qBAAqB,CAAC;AAGpC,cAAc,eAAe,CAAC;AAG9B,cAAc,QAAQ,CAAC;AAGvB,cAAc,qBAAqB,CAAC;AAGpC,cAAc,iBAAiB,CAAC;AAGhC,cAAc,kBAAkB,CAAC;AAGjC,cAAc,gBAAgB,CAAC;AAG/B,cAAc,eAAe,CAAC;AAG9B,cAAc,gBAAgB,CAAC;AAG/B,cAAc,UAAU,CAAC;AAGzB,cAAc,WAAW,CAAC;AAG1B,cAAc,mBAAmB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/components/ui/index.ts"],"names":[],"mappings":"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"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../../src/components/ui/scatter-plot/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,WAAW,EACX,mBAAmB,EACnB,kBAAkB,EAClB,mBAAmB,EACnB,mBAAmB,GACpB,MAAM,gBAAgB,CAAC;AAExB,OAAO,EAAE,WAAW,IAAI,OAAO,EAAE,MAAM,gBAAgB,CAAC"}
|
|
@@ -0,0 +1,169 @@
|
|
|
1
|
+
import { type VariantProps } from "class-variance-authority";
|
|
2
|
+
import type { HTMLAttributes, KeyboardEvent, MouseEvent, ReactElement, ReactNode, Ref } from "react";
|
|
3
|
+
export declare const scatterPlotSizeIds: ["sm", "md", "lg", "xl"];
|
|
4
|
+
export type ScatterPlotSizeId = (typeof scatterPlotSizeIds)[number];
|
|
5
|
+
export declare const scatterPlotColorIds: ["default", "primary", "positive", "warning", "destructive", "muted"];
|
|
6
|
+
export type ScatterPlotColorId = (typeof scatterPlotColorIds)[number];
|
|
7
|
+
export declare const scatterPlotShapeIds: ["circle", "square", "triangle", "diamond"];
|
|
8
|
+
export type ScatterPlotShapeId = (typeof scatterPlotShapeIds)[number];
|
|
9
|
+
export declare const scatterPlotVariants: (props?: ({
|
|
10
|
+
size?: "sm" | "lg" | "xl" | "md" | null | undefined;
|
|
11
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
12
|
+
export interface ScatterPlotPoint {
|
|
13
|
+
/** X value in domain units. Non-finite values are skipped. */
|
|
14
|
+
x: number;
|
|
15
|
+
/** Y value in domain units. Non-finite values are skipped. */
|
|
16
|
+
y: number;
|
|
17
|
+
/**
|
|
18
|
+
* Optional magnitude used to scale the marker (bubble chart mode). Values
|
|
19
|
+
* are mapped through a square-root scale onto `sizeRange` so that marker
|
|
20
|
+
* *area* -- not radius -- is proportional to the value. Ignored when the
|
|
21
|
+
* chart has no `sizeRange`-eligible data.
|
|
22
|
+
*/
|
|
23
|
+
size?: number;
|
|
24
|
+
/** Human-readable label for the point (used in aria-labels and tooltips). */
|
|
25
|
+
label?: string;
|
|
26
|
+
/** Stable identifier for the point. Defaults to the index. */
|
|
27
|
+
id?: string;
|
|
28
|
+
}
|
|
29
|
+
export interface ScatterPlotSeries {
|
|
30
|
+
/** Stable identifier for the series. Used as React key and click payload. */
|
|
31
|
+
id: string;
|
|
32
|
+
/** Display name for the series. */
|
|
33
|
+
label?: string;
|
|
34
|
+
/** Points to plot. Order is irrelevant except for paint order. */
|
|
35
|
+
points: ReadonlyArray<ScatterPlotPoint>;
|
|
36
|
+
/** Preset color id from the chart palette. Ignored if `color` is provided. */
|
|
37
|
+
colorId?: ScatterPlotColorId;
|
|
38
|
+
/**
|
|
39
|
+
* Override the marker color with a raw CSS color (e.g. `"#ff0080"` or
|
|
40
|
+
* `"hsl(var(--chart-1))"`). Takes precedence over `colorId`.
|
|
41
|
+
*/
|
|
42
|
+
color?: string;
|
|
43
|
+
/** Marker shape. Defaults to a rotation based on the series index. */
|
|
44
|
+
shape?: ScatterPlotShapeId;
|
|
45
|
+
/** Override the chart-level `pointRadius` for this series. */
|
|
46
|
+
pointRadius?: number;
|
|
47
|
+
/** Override the chart-level `pointOpacity` for this series. */
|
|
48
|
+
pointOpacity?: number;
|
|
49
|
+
/** Render a least-squares trend line for this series. Defaults to `false`. */
|
|
50
|
+
trendLine?: boolean;
|
|
51
|
+
/** Extra classes applied to this series' markers. */
|
|
52
|
+
className?: string;
|
|
53
|
+
/** Fired when a point in this series is clicked or activated via keyboard. */
|
|
54
|
+
onPointClick?: (point: ScatterPlotPoint, series: ScatterPlotSeries, event: MouseEvent<SVGPathElement> | KeyboardEvent<SVGPathElement>) => void;
|
|
55
|
+
}
|
|
56
|
+
export interface ScatterPlotValueLabelContext {
|
|
57
|
+
series: ScatterPlotSeries;
|
|
58
|
+
point: ScatterPlotPoint;
|
|
59
|
+
index: number;
|
|
60
|
+
}
|
|
61
|
+
export interface ScatterPlotReferenceLine {
|
|
62
|
+
/** Position of the line in domain units. */
|
|
63
|
+
value: number;
|
|
64
|
+
/** Optional label rendered next to the line. */
|
|
65
|
+
label?: string;
|
|
66
|
+
/** Extra classes applied to the line element. */
|
|
67
|
+
className?: string;
|
|
68
|
+
}
|
|
69
|
+
export interface ScatterPlotProps extends Omit<HTMLAttributes<HTMLDivElement>, "onClick">, VariantProps<typeof scatterPlotVariants> {
|
|
70
|
+
/** Series to render, in order (later series are drawn on top). */
|
|
71
|
+
series: ReadonlyArray<ScatterPlotSeries>;
|
|
72
|
+
/** Accessible label describing what the chart represents. */
|
|
73
|
+
label: string;
|
|
74
|
+
/** Override the rendered canvas width in pixels (defaults are size-aware). */
|
|
75
|
+
width?: number;
|
|
76
|
+
/** Override the rendered canvas height in pixels (defaults are size-aware). */
|
|
77
|
+
height?: number;
|
|
78
|
+
/** Lower bound of the x-axis. Defaults to the smallest x across series. */
|
|
79
|
+
xMin?: number;
|
|
80
|
+
/** Upper bound of the x-axis. Defaults to the largest x across series. */
|
|
81
|
+
xMax?: number;
|
|
82
|
+
/** Lower bound of the y-axis. Defaults to the smallest y across series. */
|
|
83
|
+
yMin?: number;
|
|
84
|
+
/** Upper bound of the y-axis. Defaults to the largest y across series. */
|
|
85
|
+
yMax?: number;
|
|
86
|
+
/** Marker radius in pixels when points carry no `size`. Defaults to `4`. */
|
|
87
|
+
pointRadius?: number;
|
|
88
|
+
/**
|
|
89
|
+
* Min/max marker radius in pixels for points that carry a `size`. Defaults
|
|
90
|
+
* to `[4, 14]`.
|
|
91
|
+
*/
|
|
92
|
+
sizeRange?: readonly [number, number];
|
|
93
|
+
/** Marker fill opacity, useful for dense/overlapping data. Defaults to `0.8`. */
|
|
94
|
+
pointOpacity?: number;
|
|
95
|
+
/** Render the x/y axis lines. Defaults to `true`. */
|
|
96
|
+
showAxis?: boolean;
|
|
97
|
+
/**
|
|
98
|
+
* Number of evenly-spaced horizontal gridlines drawn across the y-axis. `0`
|
|
99
|
+
* disables them. Defaults to `0`.
|
|
100
|
+
*/
|
|
101
|
+
gridLineCount?: number;
|
|
102
|
+
/**
|
|
103
|
+
* Number of evenly-spaced vertical gridlines drawn across the x-axis. `0`
|
|
104
|
+
* disables them. Defaults to `0`.
|
|
105
|
+
*/
|
|
106
|
+
verticalGridLineCount?: number;
|
|
107
|
+
/**
|
|
108
|
+
* Format an x-axis tick label. Return `null` to skip the tick. When omitted,
|
|
109
|
+
* ticks render only if `showXAxisLabels` is `true` (raw values).
|
|
110
|
+
*/
|
|
111
|
+
xTickFormatter?: (x: number, index: number) => string | null;
|
|
112
|
+
/** Number of evenly-spaced x-axis ticks, endpoints included. Defaults to `5`. */
|
|
113
|
+
xTickCount?: number;
|
|
114
|
+
/** Render raw-value x-axis ticks. Ignored when `xTickFormatter` is set. */
|
|
115
|
+
showXAxisLabels?: boolean;
|
|
116
|
+
/**
|
|
117
|
+
* Format a y-axis tick label. Return `null` to skip the tick. When omitted,
|
|
118
|
+
* ticks render only if `showYAxisLabels` is `true` (raw values).
|
|
119
|
+
*/
|
|
120
|
+
yTickFormatter?: (y: number, index: number) => string | null;
|
|
121
|
+
/** Number of evenly-spaced y-axis ticks, endpoints included. Defaults to `5`. */
|
|
122
|
+
yTickCount?: number;
|
|
123
|
+
/** Render raw-value y-axis ticks. Ignored when `yTickFormatter` is set. */
|
|
124
|
+
showYAxisLabels?: boolean;
|
|
125
|
+
/**
|
|
126
|
+
* Width in pixels reserved for y-axis tick labels (the left gutter).
|
|
127
|
+
* Defaults to `36`. Only applied when y-axis labels are visible.
|
|
128
|
+
*/
|
|
129
|
+
yTickLabelWidth?: number;
|
|
130
|
+
/** Axis title rendered under the x-axis. */
|
|
131
|
+
xAxisTitle?: string;
|
|
132
|
+
/** Axis title rendered (rotated) alongside the y-axis. */
|
|
133
|
+
yAxisTitle?: string;
|
|
134
|
+
/** Vertical reference line(s) at fixed x positions. */
|
|
135
|
+
xReferenceLines?: ReadonlyArray<ScatterPlotReferenceLine>;
|
|
136
|
+
/** Horizontal reference line(s) at fixed y positions. */
|
|
137
|
+
yReferenceLines?: ReadonlyArray<ScatterPlotReferenceLine>;
|
|
138
|
+
/** Render a text label next to every point. Defaults to `false`. */
|
|
139
|
+
showValueLabels?: boolean;
|
|
140
|
+
/**
|
|
141
|
+
* Customize the point-label text. Return `null` to skip a point. Defaults to
|
|
142
|
+
* the point's `label`, falling back to `(x, y)`.
|
|
143
|
+
*/
|
|
144
|
+
valueLabelFormatter?: (context: ScatterPlotValueLabelContext) => string | null;
|
|
145
|
+
/**
|
|
146
|
+
* Fallback handler invoked for any point that doesn't have its own
|
|
147
|
+
* series-level `onPointClick`.
|
|
148
|
+
*/
|
|
149
|
+
onPointClick?: (point: ScatterPlotPoint, series: ScatterPlotSeries, event: MouseEvent<SVGPathElement> | KeyboardEvent<SVGPathElement>) => void;
|
|
150
|
+
/** Text rendered when no finite data points are supplied. */
|
|
151
|
+
emptyMessage?: string;
|
|
152
|
+
/** Optional content overlaid on top of the plot area. */
|
|
153
|
+
children?: ReactNode;
|
|
154
|
+
/** Extra classes for the overlay content wrapper. */
|
|
155
|
+
overlayClassName?: string;
|
|
156
|
+
/** Extra classes applied to every point-label `<text>` element. */
|
|
157
|
+
valueLabelClassName?: string;
|
|
158
|
+
/** Extra classes applied to every axis tick `<text>` element. */
|
|
159
|
+
tickLabelClassName?: string;
|
|
160
|
+
/** Extra classes applied to the axis / gridline `<line>` elements. */
|
|
161
|
+
axisClassName?: string;
|
|
162
|
+
/** Optional ref forwarded to the wrapper element. */
|
|
163
|
+
ref?: Ref<HTMLDivElement>;
|
|
164
|
+
}
|
|
165
|
+
declare function ScatterPlot({ series, label, size, width, height, xMin, xMax, yMin, yMax, pointRadius, sizeRange, pointOpacity, showAxis, gridLineCount, verticalGridLineCount, xTickFormatter, xTickCount, showXAxisLabels, yTickFormatter, yTickCount, showYAxisLabels, yTickLabelWidth, xAxisTitle, yAxisTitle, xReferenceLines, yReferenceLines, showValueLabels, valueLabelFormatter, onPointClick, emptyMessage, children, className, overlayClassName, valueLabelClassName, tickLabelClassName, axisClassName, ref, ...props }: ScatterPlotProps): ReactElement;
|
|
166
|
+
declare namespace ScatterPlot {
|
|
167
|
+
var displayName: string;
|
|
168
|
+
}
|
|
169
|
+
export { ScatterPlot };
|