@gravitee/graphene-charts 2.36.2 → 2.36.3-feat-password-input.7e826e4
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/USAGE_GUIDE.md +0 -38
- package/dist/base/ChartLegend/ChartLegend.d.ts +1 -7
- package/dist/base/ChartLegend/ChartLegend.d.ts.map +1 -1
- package/dist/base/ChartTooltip/ChartTooltip.d.ts +1 -7
- package/dist/base/ChartTooltip/ChartTooltip.d.ts.map +1 -1
- package/dist/charts/DoughnutChart/DoughnutChart.d.ts.map +1 -1
- package/dist/dashboard-grid/DashboardGrid.d.ts.map +1 -1
- package/dist/dashboard-grid/DashboardWidget.d.ts.map +1 -1
- package/dist/dashboard-grid/index.js +47 -49
- package/dist/index.d.ts +1 -4
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +1767 -4399
- package/dist/primitives/Axis.d.ts +2 -10
- package/dist/primitives/Axis.d.ts.map +1 -1
- package/dist/primitives/CartesianChart.d.ts.map +1 -1
- package/dist/primitives/CartesianContext.d.ts +0 -8
- package/dist/primitives/CartesianContext.d.ts.map +1 -1
- package/dist/primitives/ReferenceLine.d.ts +1 -3
- package/dist/primitives/ReferenceLine.d.ts.map +1 -1
- package/dist/series/AreaSeries.d.ts +1 -3
- package/dist/series/AreaSeries.d.ts.map +1 -1
- package/dist/series/BarSeries.d.ts +1 -3
- package/dist/series/BarSeries.d.ts.map +1 -1
- package/dist/series/LineSeries.d.ts +1 -3
- package/dist/series/LineSeries.d.ts.map +1 -1
- package/dist/types/index.d.ts +0 -2
- package/dist/types/index.d.ts.map +1 -1
- package/package.json +4 -15
- package/dist/charts/TraceWaterfall/TraceWaterfall.d.ts +0 -22
- package/dist/charts/TraceWaterfall/TraceWaterfall.d.ts.map +0 -1
- package/dist/charts/TraceWaterfall/fixtures.d.ts +0 -12
- package/dist/charts/TraceWaterfall/fixtures.d.ts.map +0 -1
- package/dist/charts/TraceWaterfall/formatDuration.d.ts +0 -24
- package/dist/charts/TraceWaterfall/formatDuration.d.ts.map +0 -1
- package/dist/charts/TraceWaterfall/index.d.ts +0 -5
- package/dist/charts/TraceWaterfall/index.d.ts.map +0 -1
- package/dist/charts/TraceWaterfall/types.d.ts +0 -20
- package/dist/charts/TraceWaterfall/types.d.ts.map +0 -1
- package/dist/lib/format.d.ts +0 -18
- package/dist/lib/format.d.ts.map +0 -1
- package/dist/lib/surface.d.ts +0 -8
- package/dist/lib/surface.d.ts.map +0 -1
- package/dist/lineage/AnimatedEdge.d.ts +0 -12
- package/dist/lineage/AnimatedEdge.d.ts.map +0 -1
- package/dist/lineage/BaseNode.d.ts +0 -6
- package/dist/lineage/BaseNode.d.ts.map +0 -1
- package/dist/lineage/LineageSkeleton.d.ts +0 -13
- package/dist/lineage/LineageSkeleton.d.ts.map +0 -1
- package/dist/lineage/LineageViewer.d.ts +0 -3
- package/dist/lineage/LineageViewer.d.ts.map +0 -1
- package/dist/lineage/StatusLegend.d.ts +0 -2
- package/dist/lineage/StatusLegend.d.ts.map +0 -1
- package/dist/lineage/highlight.d.ts +0 -21
- package/dist/lineage/highlight.d.ts.map +0 -1
- package/dist/lineage/index.d.ts +0 -10
- package/dist/lineage/index.d.ts.map +0 -1
- package/dist/lineage/index.js +0 -624
- package/dist/lineage/layout.d.ts +0 -7
- package/dist/lineage/layout.d.ts.map +0 -1
- package/dist/lineage/styles.css +0 -1139
- package/dist/lineage/types.d.ts +0 -114
- package/dist/lineage/types.d.ts.map +0 -1
- package/dist/primitives/TooltipPortal.d.ts +0 -17
- package/dist/primitives/TooltipPortal.d.ts.map +0 -1
- package/dist/primitives-Bp_ciIfm.js +0 -1036
- package/dist/surface-k4U7sG_T.js +0 -5
package/USAGE_GUIDE.md
CHANGED
|
@@ -13,8 +13,6 @@ Browse the live documentation and component catalog on the dedicated [Storybook]
|
|
|
13
13
|
| `@gravitee/graphene-charts` | React chart components and primitives (`ChartCard`, `ChartContainer`, `ChartTooltip`, `ChartTooltipContent`, `ChartLegend`, `ChartLegendContent`, `AreaChart`, `BarChart`, `DoughnutChart`, `LineChart`, `Metric`, `CartesianChart`, `LineSeries`, `AreaSeries`, `BarSeries`, `Grid`, `XAxis`, `YAxis`) |
|
|
14
14
|
| `@gravitee/graphene-charts/dashboard-grid` | Dashboard layout engine (`DashboardGrid`, `DashboardWidget`) and adapter utilities |
|
|
15
15
|
| `@gravitee/graphene-charts/dashboard-grid/styles.css` | Required RGL stylesheet (import in your app entry) |
|
|
16
|
-
| `@gravitee/graphene-charts/lineage` | Read-only graph engine (`LineageViewer`, `BaseNode`, `computeHighlight`) for service maps, OTel traces, and business-object lineage |
|
|
17
|
-
| `@gravitee/graphene-charts/lineage/styles.css` | Required React Flow stylesheet (import in your app entry) |
|
|
18
16
|
|
|
19
17
|
The package intentionally ships **no stylesheet entry**: `@gravitee/graphene-core` is the single source of truth for the Graphene theme (tokens, Tailwind preset, chart palette, fonts) and is a required peer dependency. Chart-component runtime styles (mount animation, focus ring) are injected at render time by the components themselves via React's `<style precedence>` hoisting, so consumers have nothing extra to import.
|
|
20
18
|
|
|
@@ -430,42 +428,6 @@ Key props:
|
|
|
430
428
|
- `footer` — Bottom slot (legend, status, links)
|
|
431
429
|
- `noPadding` — Removes horizontal padding for full-bleed charts
|
|
432
430
|
|
|
433
|
-
### Recipe: a dependency graph with LineageViewer
|
|
434
|
-
|
|
435
|
-
```tsx
|
|
436
|
-
import { LineageViewer } from '@gravitee/graphene-charts/lineage';
|
|
437
|
-
import '@gravitee/graphene-charts/lineage/styles.css';
|
|
438
|
-
|
|
439
|
-
const nodes = [
|
|
440
|
-
{ id: 'gateway', data: { label: 'API Gateway', badge: 'entry', status: 'healthy' } },
|
|
441
|
-
{ id: 'auth', data: { label: 'Auth Service', status: 'degraded' } },
|
|
442
|
-
{ id: 'db', data: { label: 'PostgreSQL', badge: 'storage', status: 'healthy' } },
|
|
443
|
-
];
|
|
444
|
-
|
|
445
|
-
const edges = [
|
|
446
|
-
{ id: 'e1', source: 'gateway', target: 'auth' },
|
|
447
|
-
{ id: 'e2', source: 'auth', target: 'db', status: 'degraded' },
|
|
448
|
-
];
|
|
449
|
-
|
|
450
|
-
export function ServiceMap() {
|
|
451
|
-
return (
|
|
452
|
-
<div className="h-[600px]">
|
|
453
|
-
<LineageViewer nodes={nodes} edges={edges} onNodeSelect={(node) => node && openDrawer(node)} />
|
|
454
|
-
</div>
|
|
455
|
-
);
|
|
456
|
-
}
|
|
457
|
-
```
|
|
458
|
-
|
|
459
|
-
`LineageViewer` is a **read-only** graph engine (service maps, OTel traces, business-object
|
|
460
|
-
lineage). It is static by default (no pan/zoom) so it sits cleanly in a tile; opt into
|
|
461
|
-
`pannable`, `zoomable`, `showControls`, `fullscreenable`, `showMinimap` as needed. Nodes carry
|
|
462
|
-
a `status` (`healthy` / `degraded` / `error`) and optional `metrics`; edges support `status`,
|
|
463
|
-
`label`, and `weight` (thickness). Hover or click a node to highlight its dependencies
|
|
464
|
-
(`highlightMode="neighbors" | "path"`). Follows the shared `state` contract
|
|
465
|
-
(`loading` / `empty` / `ready`).
|
|
466
|
-
|
|
467
|
-
> Memoize `nodes` / `edges` to avoid re-layout on every render.
|
|
468
|
-
|
|
469
431
|
## Tokens you can rely on
|
|
470
432
|
|
|
471
433
|
`@gravitee/graphene-charts` reads the following variables from the shared Graphene preset. They are safe to override at the app root.
|
|
@@ -18,14 +18,8 @@ export interface ChartLegendContentProps extends React.ComponentProps<'div'> {
|
|
|
18
18
|
verticalAlign?: 'top' | 'bottom';
|
|
19
19
|
/** Horizontal alignment of legend items. @default 'start' */
|
|
20
20
|
align?: 'start' | 'center' | 'end';
|
|
21
|
-
/** Callback when a legend item is hovered; receives the dataKey. Injected by the parent chart. */
|
|
22
|
-
onItemHover?: (dataKey: string) => void;
|
|
23
|
-
/** Callback when the pointer leaves a legend item. Injected by the parent chart. */
|
|
24
|
-
onItemLeave?: () => void;
|
|
25
|
-
/** Currently hovered legend key for visual feedback. Injected by the parent chart. */
|
|
26
|
-
hoveredLegendKey?: string | null;
|
|
27
21
|
}
|
|
28
|
-
declare function ChartLegendContent({ items, hideIcon, nameKey, verticalAlign: _verticalAlign, align,
|
|
22
|
+
declare function ChartLegendContent({ items, hideIcon, nameKey, verticalAlign: _verticalAlign, align, className, ...props }: ChartLegendContentProps): import("react/jsx-runtime").JSX.Element | null;
|
|
29
23
|
export interface ChartLegendProps {
|
|
30
24
|
content: React.ReactElement;
|
|
31
25
|
/** Where to render the legend relative to the chart body. Defaults to `'bottom'`. */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChartLegend.d.ts","sourceRoot":"","sources":["../../../src/base/ChartLegend/ChartLegend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,WAAW,eAAe;IAC9B,6DAA6D;IAC7D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2DAA2D;IAC3D,KAAK,EAAE,MAAM,CAAC;IACd,8EAA8E;IAC9E,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,uBAAwB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAC1E,oDAAoD;IACpD,KAAK,CAAC,EAAE,eAAe,EAAE,CAAC;IAC1B,wDAAwD;IACxD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sEAAsE;IACtE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,gFAAgF;IAChF,aAAa,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IACjC,6DAA6D;IAC7D,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"ChartLegend.d.ts","sourceRoot":"","sources":["../../../src/base/ChartLegend/ChartLegend.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAK/B,MAAM,WAAW,eAAe;IAC9B,6DAA6D;IAC7D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,2DAA2D;IAC3D,KAAK,EAAE,MAAM,CAAC;IACd,8EAA8E;IAC9E,KAAK,CAAC,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,WAAW,uBAAwB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAC1E,oDAAoD;IACpD,KAAK,CAAC,EAAE,eAAe,EAAE,CAAC;IAC1B,wDAAwD;IACxD,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,sEAAsE;IACtE,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,gFAAgF;IAChF,aAAa,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;IACjC,6DAA6D;IAC7D,KAAK,CAAC,EAAE,OAAO,GAAG,QAAQ,GAAG,KAAK,CAAC;CACpC;AAQD,iBAAS,kBAAkB,CAAC,EAC1B,KAAU,EACV,QAAgB,EAChB,OAAO,EACP,aAAa,EAAE,cAAc,EAC7B,KAAe,EACf,SAAS,EACT,GAAG,KAAK,EACT,EAAE,uBAAuB,kDAgCzB;AASD,MAAM,WAAW,gBAAgB;IAC/B,OAAO,EAAE,KAAK,CAAC,YAAY,CAAC;IAC5B,qFAAqF;IACrF,aAAa,CAAC,EAAE,KAAK,GAAG,QAAQ,CAAC;CAClC;AAED,iBAAS,WAAW,CAAC,EAAE,OAAO,EAAE,aAAwB,EAAE,EAAE,gBAAgB,QAY3E;AAED,OAAO,EAAE,WAAW,EAAE,kBAAkB,EAAE,CAAC"}
|
|
@@ -32,14 +32,8 @@ export interface ChartTooltipContentProps extends React.ComponentProps<'div'> {
|
|
|
32
32
|
labelClassName?: string;
|
|
33
33
|
/** Format each item's value. Defaults to `.toLocaleString()` for numbers. */
|
|
34
34
|
valueFormatter?: (value: number | string, item: ChartTooltipItem, index: number) => React.ReactNode;
|
|
35
|
-
/** Show a footer row with the sum of all numeric item values. */
|
|
36
|
-
showTotal?: boolean;
|
|
37
|
-
/** Label for the total row. @default "Total" */
|
|
38
|
-
totalLabel?: string;
|
|
39
|
-
/** Format the total value. Defaults to `.toLocaleString()`. */
|
|
40
|
-
totalFormatter?: (total: number) => React.ReactNode;
|
|
41
35
|
}
|
|
42
|
-
declare function ChartTooltipContent({ label, items, active, hideLabel, hideIndicator, indicator, labelKey, nameKey, labelFormatter, labelClassName, valueFormatter
|
|
36
|
+
declare function ChartTooltipContent({ label, items, active, hideLabel, hideIndicator, indicator, labelKey, nameKey, labelFormatter, labelClassName, valueFormatter, className, ...props }: ChartTooltipContentProps): import("react/jsx-runtime").JSX.Element | null;
|
|
43
37
|
export interface ChartTooltipProps {
|
|
44
38
|
/** The tooltip content element. Receives `label`, `items`, `active` at render time. */
|
|
45
39
|
content: React.ReactElement;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ChartTooltip.d.ts","sourceRoot":"","sources":["../../../src/base/ChartTooltip/ChartTooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,WAAW,gBAAgB;IAC/B,8DAA8D;IAC9D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,8EAA8E;IAC9E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kEAAkE;IAClE,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACnC;AAED,MAAM,WAAW,wBAAyB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAC3E,+EAA+E;IAC/E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sEAAsE;IACtE,KAAK,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC3B,oEAAoE;IACpE,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,kDAAkD;IAClD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,uDAAuD;IACvD,SAAS,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,QAAQ,CAAC;IAEtC,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qEAAqE;IACrE,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,4BAA4B;IAC5B,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,gBAAgB,EAAE,KAAK,KAAK,CAAC,SAAS,CAAC;IAC/E,qCAAqC;IACrC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,6EAA6E;IAC7E,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,IAAI,EAAE,gBAAgB,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;
|
|
1
|
+
{"version":3,"file":"ChartTooltip.d.ts","sourceRoot":"","sources":["../../../src/base/ChartTooltip/ChartTooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAM/B,MAAM,WAAW,gBAAgB;IAC/B,8DAA8D;IAC9D,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,IAAI,EAAE,MAAM,CAAC;IACb,KAAK,EAAE,MAAM,GAAG,MAAM,CAAC;IACvB,8EAA8E;IAC9E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,kEAAkE;IAClE,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;CACnC;AAED,MAAM,WAAW,wBAAyB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IAC3E,+EAA+E;IAC/E,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,sEAAsE;IACtE,KAAK,CAAC,EAAE,gBAAgB,EAAE,CAAC;IAC3B,oEAAoE;IACpE,MAAM,CAAC,EAAE,OAAO,CAAC;IAEjB,8BAA8B;IAC9B,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,kDAAkD;IAClD,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,uDAAuD;IACvD,SAAS,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,QAAQ,CAAC;IAEtC,8DAA8D;IAC9D,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,qEAAqE;IACrE,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB,4BAA4B;IAC5B,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,EAAE,KAAK,EAAE,gBAAgB,EAAE,KAAK,KAAK,CAAC,SAAS,CAAC;IAC/E,qCAAqC;IACrC,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,6EAA6E;IAC7E,cAAc,CAAC,EAAE,CAAC,KAAK,EAAE,MAAM,GAAG,MAAM,EAAE,IAAI,EAAE,gBAAgB,EAAE,KAAK,EAAE,MAAM,KAAK,KAAK,CAAC,SAAS,CAAC;CACrG;AAWD,iBAAS,mBAAmB,CAAC,EAC3B,KAAK,EACL,KAAU,EACV,MAAa,EACb,SAAiB,EACjB,aAAqB,EACrB,SAAiB,EACjB,QAAQ,EACR,OAAO,EACP,cAAc,EACd,cAAc,EACd,cAAsC,EACtC,SAAS,EACT,GAAG,KAAK,EACT,EAAE,wBAAwB,kDA8F1B;AASD,MAAM,WAAW,iBAAiB;IAChC,uFAAuF;IACvF,OAAO,EAAE,KAAK,CAAC,YAAY,CAAC;CAC7B;AAED,iBAAS,YAAY,CAAC,EAAE,OAAO,EAAE,EAAE,iBAAiB,QAYnD;AAED,OAAO,EAAE,YAAY,EAAE,mBAAmB,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DoughnutChart.d.ts","sourceRoot":"","sources":["../../../src/charts/DoughnutChart/DoughnutChart.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;
|
|
1
|
+
{"version":3,"file":"DoughnutChart.d.ts","sourceRoot":"","sources":["../../../src/charts/DoughnutChart/DoughnutChart.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAa/B,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAC;AAG1E,MAAM,WAAW,iBAAiB;IAChC,QAAQ,EAAE,MAAM,CAAC;IACjB,KAAK,EAAE,MAAM,CAAC;CACf;AAED,MAAM,MAAM,oBAAoB,GAAG,UAAU,GAAG,OAAO,GAAG,SAAS,CAAC;AACpE,MAAM,MAAM,sBAAsB,GAAG,CAAC,SAAS,EAAE,iBAAiB,EAAE,KAAK,EAAE,MAAM,KAAK,MAAM,CAAC;AAE7F,MAAM,WAAW,kBAAmB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IACrE,IAAI,EAAE,iBAAiB,EAAE,CAAC;IAC1B,gEAAgE;IAChE,KAAK,CAAC,EAAE,UAAU,CAAC;IACnB,mFAAmF;IACnF,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,2CAA2C;IAC3C,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,mCAAmC;IACnC,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,oBAAoB,GAAG,sBAAsB,CAAC;IACvD,2FAA2F;IAC3F,aAAa,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAChC,yDAAyD;IACzD,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,0DAA0D;IAC1D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,+CAA+C;IAC/C,cAAc,CAAC,EAAE,CAAC,IAAI,EAAE,iBAAiB,EAAE,KAAK,EAAE,KAAK,CAAC,UAAU,KAAK,IAAI,CAAC;IAC5E,+CAA+C;IAC/C,cAAc,CAAC,EAAE,MAAM,IAAI,CAAC;IAC5B,sCAAsC;IACtC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,qBAAqB;IACrB,MAAM,CAAC,EAAE,OAAO,CAAC,MAAM,CAAC,CAAC;CAC1B;AAwCD,iBAAS,aAAa,CAAC,EACrB,KAAK,EACL,IAAI,EACJ,WAAW,EACX,QAAQ,EACR,YAAY,EACZ,MAAM,EACN,aAAa,EACb,UAAU,EACV,QAAQ,EACR,YAAY,EACZ,cAAc,EACd,cAAc,EACd,SAAS,EACT,MAAM,EACN,SAAS,EACT,QAAQ,EACR,GAAG,QAAQ,EACZ,EAAE,kBAAkB,2CAmCpB;AAuVD,OAAO,EAAE,aAAa,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DashboardGrid.d.ts","sourceRoot":"","sources":["../../src/dashboard-grid/DashboardGrid.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,kBAAkB,EAAgB,MAAM,SAAS,CAAC;AA4BhE,iBAAS,aAAa,CAAC,EACrB,OAAO,EACP,IAAmB,EACnB,SAA8B,EAC9B,GAAiB,EACjB,WAAW,EACX,cAAc,EACd,UAAuB,EACvB,QAAgB,EAChB,QAAc,EACd,cAAc,EACd,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,QAAQ,EACZ,EAAE,kBAAkB,
|
|
1
|
+
{"version":3,"file":"DashboardGrid.d.ts","sourceRoot":"","sources":["../../src/dashboard-grid/DashboardGrid.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAK,EAAE,kBAAkB,EAAgB,MAAM,SAAS,CAAC;AA4BhE,iBAAS,aAAa,CAAC,EACrB,OAAO,EACP,IAAmB,EACnB,SAA8B,EAC9B,GAAiB,EACjB,WAAW,EACX,cAAc,EACd,UAAuB,EACvB,QAAgB,EAChB,QAAc,EACd,cAAc,EACd,QAAQ,EACR,SAAS,EACT,KAAK,EACL,GAAG,QAAQ,EACZ,EAAE,kBAAkB,2CAqEpB;AAED,OAAO,EAAE,aAAa,EAAE,CAAC;AACzB,YAAY,EAAE,kBAAkB,EAAE,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"DashboardWidget.d.ts","sourceRoot":"","sources":["../../src/dashboard-grid/DashboardWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;
|
|
1
|
+
{"version":3,"file":"DashboardWidget.d.ts","sourceRoot":"","sources":["../../src/dashboard-grid/DashboardWidget.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,WAAW,oBAAqB,SAAQ,KAAK,CAAC,cAAc,CAAC,KAAK,CAAC;IACvE,4CAA4C;IAC5C,QAAQ,CAAC,KAAK,CAAC,EAAE,MAAM,CAAC;IACxB,yCAAyC;IACzC,QAAQ,CAAC,QAAQ,CAAC,EAAE,MAAM,CAAC;IAC3B,8CAA8C;IAC9C,QAAQ,CAAC,IAAI,CAAC,EAAE,KAAK,CAAC,aAAa,CAAC;QAAE,SAAS,CAAC,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IAC5D,+EAA+E;IAC/E,QAAQ,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC,uDAAuD;IACvD,QAAQ,CAAC,MAAM,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAClC;;;OAGG;IACH,QAAQ,CAAC,SAAS,CAAC,EAAE,OAAO,CAAC;IAC7B,4EAA4E;IAC5E,QAAQ,CAAC,QAAQ,EAAE,KAAK,CAAC,SAAS,CAAC;CACpC;AAED;;;;;;;;;;;GAWG;AACH,wBAAgB,eAAe,CAAC,EAC9B,KAAK,EACL,QAAQ,EACR,IAAI,EAAE,IAAI,EACV,MAAM,EACN,MAAM,EACN,SAAiB,EACjB,QAAQ,EACR,SAAS,EACT,GAAG,IAAI,EACR,EAAE,oBAAoB,2CAwDtB"}
|
|
@@ -1,10 +1,9 @@
|
|
|
1
1
|
import { t as e } from "../utils-ySutDPYb.js";
|
|
2
|
-
import {
|
|
3
|
-
import {
|
|
4
|
-
import {
|
|
5
|
-
import { Responsive as s, horizontalCompactor as c, noCompactor as l, useContainerWidth as u, verticalCompactor as d } from "react-grid-layout";
|
|
2
|
+
import { useCallback as t, useMemo as n } from "react";
|
|
3
|
+
import { jsx as r, jsxs as i } from "react/jsx-runtime";
|
|
4
|
+
import { Responsive as a, horizontalCompactor as o, noCompactor as s, useContainerWidth as c, verticalCompactor as l } from "react-grid-layout";
|
|
6
5
|
//#region src/dashboard-grid/adapters.ts
|
|
7
|
-
function
|
|
6
|
+
function u(e) {
|
|
8
7
|
return {
|
|
9
8
|
i: e.id,
|
|
10
9
|
x: e.x,
|
|
@@ -18,7 +17,7 @@ function f(e) {
|
|
|
18
17
|
static: e.static
|
|
19
18
|
};
|
|
20
19
|
}
|
|
21
|
-
function
|
|
20
|
+
function d(e) {
|
|
22
21
|
return {
|
|
23
22
|
x: e.x,
|
|
24
23
|
y: e.y,
|
|
@@ -28,37 +27,37 @@ function p(e) {
|
|
|
28
27
|
}
|
|
29
28
|
//#endregion
|
|
30
29
|
//#region src/dashboard-grid/DashboardGrid.tsx
|
|
31
|
-
var
|
|
30
|
+
var f = 12, p = 150, m = [16, 16], h = {
|
|
32
31
|
lg: 1200,
|
|
33
32
|
md: 996,
|
|
34
33
|
sm: 768,
|
|
35
34
|
xs: 480,
|
|
36
35
|
xxs: 0
|
|
37
|
-
},
|
|
36
|
+
}, g = {
|
|
38
37
|
lg: 12,
|
|
39
38
|
md: 10,
|
|
40
39
|
sm: 6,
|
|
41
40
|
xs: 4,
|
|
42
41
|
xxs: 2
|
|
43
|
-
},
|
|
44
|
-
vertical:
|
|
45
|
-
horizontal:
|
|
46
|
-
none:
|
|
42
|
+
}, _ = {
|
|
43
|
+
vertical: l,
|
|
44
|
+
horizontal: o,
|
|
45
|
+
none: s
|
|
47
46
|
};
|
|
48
|
-
function
|
|
49
|
-
let { width: k, containerRef: A, mounted: j } =
|
|
50
|
-
...
|
|
47
|
+
function v({ widgets: o, cols: s = f, rowHeight: l = p, gap: v = m, breakpoints: y, breakpointCols: b, compaction: x = "vertical", editable: S = !1, minWidth: C = 960, onLayoutChange: w, children: T, className: E, style: D, ...O }) {
|
|
48
|
+
let { width: k, containerRef: A, mounted: j } = c(), M = n(() => o.map(u), [o]), N = n(() => ({ lg: M }), [M]), P = n(() => b ? {
|
|
49
|
+
...g,
|
|
51
50
|
...b
|
|
52
51
|
} : {
|
|
53
|
-
...
|
|
54
|
-
lg:
|
|
55
|
-
}, [b,
|
|
52
|
+
...g,
|
|
53
|
+
lg: s
|
|
54
|
+
}, [b, s]), F = n(() => [v[0], v[1]], [v]), I = n(() => ({ enabled: S }), [S]), L = n(() => ({ enabled: S }), [S]), R = t((e) => {
|
|
56
55
|
if (!w) return;
|
|
57
56
|
let t = /* @__PURE__ */ new Map();
|
|
58
|
-
for (let n of e) t.set(n.i,
|
|
57
|
+
for (let n of e) t.set(n.i, d(n));
|
|
59
58
|
w(t);
|
|
60
59
|
}, [w]), z = C === 0 ? void 0 : typeof C == "number" ? `${C}px` : C;
|
|
61
|
-
return /* @__PURE__ */
|
|
60
|
+
return /* @__PURE__ */ i("div", {
|
|
62
61
|
ref: A,
|
|
63
62
|
className: e("relative w-full", E),
|
|
64
63
|
style: {
|
|
@@ -66,22 +65,21 @@ function b({ widgets: t, cols: n = m, rowHeight: c = h, gap: l = g, breakpoints:
|
|
|
66
65
|
...D
|
|
67
66
|
},
|
|
68
67
|
...O,
|
|
69
|
-
children: [/* @__PURE__ */
|
|
68
|
+
children: [/* @__PURE__ */ r("style", {
|
|
70
69
|
precedence: "graphene-charts",
|
|
71
70
|
children: "\n .react-grid-item.react-grid-placeholder {\n background: var(--muted);\n border-radius: var(--radius, 0.5rem);\n opacity: 0.5;\n }\n "
|
|
72
|
-
}), j && /* @__PURE__ */ a
|
|
71
|
+
}), j && /* @__PURE__ */ r(a, {
|
|
73
72
|
width: k,
|
|
74
73
|
layouts: N,
|
|
75
|
-
breakpoints:
|
|
74
|
+
breakpoints: y ?? h,
|
|
76
75
|
cols: P,
|
|
77
|
-
rowHeight:
|
|
76
|
+
rowHeight: l,
|
|
78
77
|
margin: F,
|
|
79
|
-
containerPadding: [0, 0],
|
|
80
78
|
dragConfig: I,
|
|
81
79
|
resizeConfig: L,
|
|
82
|
-
compactor:
|
|
80
|
+
compactor: _[x],
|
|
83
81
|
onLayoutChange: R,
|
|
84
|
-
children:
|
|
82
|
+
children: o.map((e) => /* @__PURE__ */ r("div", {
|
|
85
83
|
className: "min-h-0 overflow-hidden",
|
|
86
84
|
children: T(e)
|
|
87
85
|
}, e.id))
|
|
@@ -90,42 +88,42 @@ function b({ widgets: t, cols: n = m, rowHeight: c = h, gap: l = g, breakpoints:
|
|
|
90
88
|
}
|
|
91
89
|
//#endregion
|
|
92
90
|
//#region src/dashboard-grid/DashboardWidget.tsx
|
|
93
|
-
function
|
|
94
|
-
let
|
|
95
|
-
return /* @__PURE__ */
|
|
96
|
-
className: e("flex h-full flex-col",
|
|
97
|
-
...
|
|
91
|
+
function y({ title: t, subtitle: n, icon: a, action: o, footer: s, noPadding: c = !1, children: l, className: u, ...d }) {
|
|
92
|
+
let f = t || n || o;
|
|
93
|
+
return /* @__PURE__ */ i("div", {
|
|
94
|
+
className: e("flex h-full flex-col overflow-hidden rounded-xl", "bg-card text-card-foreground", "border border-border/40 dark:border-white/[0.06]", "shadow-xs dark:shadow-none", "transition-[box-shadow,border-color] duration-200", "hover:border-border/60 hover:shadow-sm dark:hover:border-white/[0.10]", "@container", u),
|
|
95
|
+
...d,
|
|
98
96
|
children: [
|
|
99
|
-
|
|
97
|
+
f && /* @__PURE__ */ i("div", {
|
|
100
98
|
className: "flex shrink-0 items-start justify-between gap-2 px-4 pt-4 @[400px]:px-5",
|
|
101
|
-
children: [/* @__PURE__ */
|
|
99
|
+
children: [/* @__PURE__ */ i("div", {
|
|
102
100
|
className: "min-w-0 flex-1",
|
|
103
|
-
children: [
|
|
101
|
+
children: [t && /* @__PURE__ */ i("div", {
|
|
104
102
|
className: "flex items-center gap-2",
|
|
105
|
-
children: [
|
|
103
|
+
children: [a && /* @__PURE__ */ r(a, { className: "size-4 shrink-0 text-muted-foreground" }), /* @__PURE__ */ r("span", {
|
|
106
104
|
className: "truncate text-sm font-semibold tracking-tight text-foreground",
|
|
107
|
-
children:
|
|
105
|
+
children: t
|
|
108
106
|
})]
|
|
109
|
-
}), (
|
|
110
|
-
className: e("mt-0.5 block truncate text-xs text-muted-foreground", !
|
|
111
|
-
title:
|
|
112
|
-
children:
|
|
107
|
+
}), (n || t) && /* @__PURE__ */ r("span", {
|
|
108
|
+
className: e("mt-0.5 block truncate text-xs text-muted-foreground", !n && "invisible"),
|
|
109
|
+
title: n,
|
|
110
|
+
children: n || "\xA0"
|
|
113
111
|
})]
|
|
114
|
-
}),
|
|
112
|
+
}), o && /* @__PURE__ */ r("div", {
|
|
115
113
|
className: "shrink-0",
|
|
116
|
-
children:
|
|
114
|
+
children: o
|
|
117
115
|
})]
|
|
118
116
|
}),
|
|
119
|
-
/* @__PURE__ */
|
|
120
|
-
className: e("min-h-0 flex-1",
|
|
121
|
-
children:
|
|
117
|
+
/* @__PURE__ */ r("div", {
|
|
118
|
+
className: e("min-h-0 flex-1", c ? "px-0 pb-0" : "px-4 pb-4 @[400px]:px-5 @[400px]:pb-5", !f && !c && "pt-4 @[400px]:pt-5"),
|
|
119
|
+
children: l
|
|
122
120
|
}),
|
|
123
|
-
|
|
121
|
+
s && /* @__PURE__ */ r("div", {
|
|
124
122
|
className: "shrink-0 border-t border-border/20 px-4 py-2.5 text-xs text-muted-foreground @[400px]:px-5 dark:border-white/[0.04]",
|
|
125
|
-
children:
|
|
123
|
+
children: s
|
|
126
124
|
})
|
|
127
125
|
]
|
|
128
126
|
});
|
|
129
127
|
}
|
|
130
128
|
//#endregion
|
|
131
|
-
export {
|
|
129
|
+
export { v as DashboardGrid, y as DashboardWidget, d as rglLayoutItemToWidgetLayout, u as widgetToRGLLayoutItem };
|
package/dist/index.d.ts
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
1
|
export { cn } from './lib/utils';
|
|
2
|
-
export { compactTick } from './lib/format';
|
|
3
2
|
export type { ChartConfig, ChartSeriesConfig, ChartState, ChartThemeColors, Margin } from './types';
|
|
4
3
|
export { CHART_THEMES, DEFAULT_MARGIN } from './types';
|
|
5
4
|
export * from './base/ChartCard';
|
|
@@ -11,8 +10,7 @@ export type { CartesianChartProps, CartesianDataPoint } from './primitives/Carte
|
|
|
11
10
|
export { Grid } from './primitives/Grid';
|
|
12
11
|
export { ReferenceLine } from './primitives/ReferenceLine';
|
|
13
12
|
export type { ReferenceLineProps } from './primitives/ReferenceLine';
|
|
14
|
-
export { CategoryAxis
|
|
15
|
-
export type { CategoryAxisProps, ValueAxisProps } from './primitives/Axis';
|
|
13
|
+
export { CategoryAxis as XAxis, ValueAxis as YAxis } from './primitives/Axis';
|
|
16
14
|
export { LineSeries } from './series/LineSeries';
|
|
17
15
|
export type { LineSeriesProps } from './series/LineSeries';
|
|
18
16
|
export type { CurveType } from './series/curves';
|
|
@@ -26,5 +24,4 @@ export * from './charts/Metric';
|
|
|
26
24
|
export * from './charts/MetricGroup';
|
|
27
25
|
export * from './charts/LineChart';
|
|
28
26
|
export * from './charts/AreaChart';
|
|
29
|
-
export * from './charts/TraceWaterfall';
|
|
30
27
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,EAAE,EAAE,MAAM,aAAa,CAAC;AAGjC,YAAY,EAAE,WAAW,EAAE,iBAAiB,EAAE,UAAU,EAAE,gBAAgB,EAAE,MAAM,EAAE,MAAM,SAAS,CAAC;AACpG,OAAO,EAAE,YAAY,EAAE,cAAc,EAAE,MAAM,SAAS,CAAC;AAGvD,cAAc,kBAAkB,CAAC;AACjC,cAAc,uBAAuB,CAAC;AACtC,cAAc,qBAAqB,CAAC;AACpC,cAAc,oBAAoB,CAAC;AAGnC,OAAO,EAAE,cAAc,EAAE,MAAM,6BAA6B,CAAC;AAC7D,YAAY,EAAE,mBAAmB,EAAE,kBAAkB,EAAE,MAAM,6BAA6B,CAAC;AAC3F,OAAO,EAAE,IAAI,EAAE,MAAM,mBAAmB,CAAC;AACzC,OAAO,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAC;AAC3D,YAAY,EAAE,kBAAkB,EAAE,MAAM,4BAA4B,CAAC;AACrE,OAAO,EAAE,YAAY,IAAI,KAAK,EAAE,SAAS,IAAI,KAAK,EAAE,MAAM,mBAAmB,CAAC;AAC9E,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAC3D,YAAY,EAAE,SAAS,EAAE,MAAM,iBAAiB,CAAC;AACjD,OAAO,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC;AAC/C,YAAY,EAAE,cAAc,EAAE,MAAM,oBAAoB,CAAC;AACzD,OAAO,EAAE,UAAU,EAAE,MAAM,qBAAqB,CAAC;AACjD,YAAY,EAAE,eAAe,EAAE,MAAM,qBAAqB,CAAC;AAG3D,cAAc,mBAAmB,CAAC;AAClC,cAAc,wBAAwB,CAAC;AACvC,cAAc,iBAAiB,CAAC;AAChC,cAAc,sBAAsB,CAAC;AACrC,cAAc,oBAAoB,CAAC;AACnC,cAAc,oBAAoB,CAAC"}
|