@acronis-platform/ui-react 5.5.4 → 5.5.5
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.
|
@@ -6,8 +6,8 @@ var n = {
|
|
|
6
6
|
right: 5,
|
|
7
7
|
bottom: 5,
|
|
8
8
|
left: 5
|
|
9
|
-
};
|
|
10
|
-
function
|
|
9
|
+
}, r = 16;
|
|
10
|
+
function i(e, t) {
|
|
11
11
|
if (!t) return e;
|
|
12
12
|
let r = {
|
|
13
13
|
top: e?.top ?? n.top,
|
|
@@ -21,51 +21,53 @@ function r(e, t) {
|
|
|
21
21
|
right: r.right + (t?.right ?? 0)
|
|
22
22
|
};
|
|
23
23
|
}
|
|
24
|
-
function
|
|
25
|
-
let
|
|
26
|
-
height:
|
|
24
|
+
function a(n, i, a, o) {
|
|
25
|
+
let s = e(a, i), [c, l] = t.useState({
|
|
26
|
+
height: s ?? 0,
|
|
27
27
|
margin: {}
|
|
28
28
|
});
|
|
29
29
|
return t.useLayoutEffect(() => {
|
|
30
|
-
|
|
31
|
-
height:
|
|
30
|
+
l({
|
|
31
|
+
height: s ?? 0,
|
|
32
32
|
margin: {}
|
|
33
33
|
});
|
|
34
|
-
}, [
|
|
35
|
-
if (
|
|
34
|
+
}, [s, o]), t.useLayoutEffect(() => {
|
|
35
|
+
if (i == null) return;
|
|
36
36
|
let e = n.current;
|
|
37
37
|
if (!e) return;
|
|
38
38
|
let t = () => {
|
|
39
39
|
let t = e.querySelector(".recharts-surface"), n = Array.from(e.querySelectorAll(".recharts-xAxis-tick-labels text"));
|
|
40
40
|
if (!t || !n.length) return;
|
|
41
|
-
let
|
|
42
|
-
if (!
|
|
43
|
-
let
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
41
|
+
let i = t.getBoundingClientRect();
|
|
42
|
+
if (!i.width || !i.height) return;
|
|
43
|
+
let a = n.map((e) => e.getBoundingClientRect()).filter(({ width: e, height: t }) => e > 0 && t > 0);
|
|
44
|
+
if (!a.length) return;
|
|
45
|
+
let o = Math.min(...a.map((e) => e.left)), c = Math.max(...a.map((e) => e.right)), u = Math.max(...a.map((e) => e.bottom)), d = e.querySelector(".recharts-legend-wrapper")?.getBoundingClientRect(), f = Math.min(i.bottom, d ? d.top - 8 : i.bottom);
|
|
46
|
+
l((e) => {
|
|
47
|
+
let t = Math.ceil(i.left - o + r), n = Math.ceil(c - i.right + r), a = Math.ceil(u - f), l = Math.max(0, (e.margin.left ?? 0) + t), d = Math.max(0, (e.margin.right ?? 0) + n), p = Math.max(s ?? 0, e.height + a), m = l || d ? {
|
|
48
|
+
left: l || void 0,
|
|
49
|
+
right: d || void 0
|
|
48
50
|
} : {};
|
|
49
|
-
return e.height ===
|
|
50
|
-
height:
|
|
51
|
-
margin:
|
|
51
|
+
return e.height === p && e.margin.left === m.left && e.margin.right === m.right ? e : {
|
|
52
|
+
height: p,
|
|
53
|
+
margin: m
|
|
52
54
|
};
|
|
53
55
|
});
|
|
54
56
|
};
|
|
55
57
|
t();
|
|
56
|
-
let
|
|
57
|
-
return
|
|
58
|
+
let a = new ResizeObserver(t);
|
|
59
|
+
return a.observe(e), () => a.disconnect();
|
|
58
60
|
}, [
|
|
59
|
-
|
|
61
|
+
i,
|
|
60
62
|
n,
|
|
61
|
-
|
|
62
|
-
|
|
63
|
+
s,
|
|
64
|
+
o
|
|
63
65
|
]), {
|
|
64
|
-
height:
|
|
65
|
-
margin:
|
|
66
|
+
height: c.height || void 0,
|
|
67
|
+
margin: c.margin.left || c.margin.right ? c.margin : void 0
|
|
66
68
|
};
|
|
67
69
|
}
|
|
68
70
|
//#endregion
|
|
69
|
-
export {
|
|
71
|
+
export { i as mergeXAxisLayoutMargin, a as useXAxisLayout };
|
|
70
72
|
|
|
71
73
|
//# sourceMappingURL=use-x-axis-layout.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"use-x-axis-layout.js","names":[],"sources":["../../../../src/components/ui/chart/use-x-axis-layout.ts"],"sourcesContent":["import * as React from 'react';\n\nimport { resolveXAxisHeight } from './chart-format';\n\nexport type XAxisLayout = {\n height: number | undefined;\n margin: { left?: number; right?: number } | undefined;\n};\n\ntype ChartMargin = {\n top?: number;\n right?: number;\n bottom?: number;\n left?: number;\n};\n\ntype MeasuredXAxisLayout = {\n height: number;\n margin: { left?: number; right?: number };\n};\n\nconst RECHARTS_DEFAULT_MARGIN = { top: 5, right: 5, bottom: 5, left: 5 } as const;\n\n/**\n * Add the measured endpoint clearance without turning recharts' per-side\n * defaults into zeroes. Recharts applies its 5px defaults only when the whole\n * margin prop is absent, so a partial left/right margin must be completed here.\n */\nexport function mergeXAxisLayoutMargin(\n baseMargin: ChartMargin | undefined,\n xAxisMargin: XAxisLayout['margin']\n): ChartMargin | undefined {\n if (!xAxisMargin) return baseMargin;\n\n const margin = {\n top: baseMargin?.top ?? RECHARTS_DEFAULT_MARGIN.top,\n right: baseMargin?.right ?? RECHARTS_DEFAULT_MARGIN.right,\n bottom: baseMargin?.bottom ?? RECHARTS_DEFAULT_MARGIN.bottom,\n left: baseMargin?.left ?? RECHARTS_DEFAULT_MARGIN.left,\n };\n\n return {\n ...margin,\n left: margin.left + (xAxisMargin?.left ?? 0),\n right: margin.right + (xAxisMargin?.right ?? 0),\n };\n}\n\n/**\n * Fits a rotated X-axis tick row to the geometry that recharts actually\n * rendered. Estimating from character count leaves conspicuous empty space for\n * narrow glyphs and short endpoint labels; measuring the SVG lets the axis use\n * precisely the room its labels need.\n */\nexport function useXAxisLayout(\n containerRef: React.RefObject<HTMLElement | null>,\n angle: number | undefined,\n label: string | undefined,\n layoutKey: string\n): XAxisLayout {\n const fallbackHeight = resolveXAxisHeight(label, angle);\n const [layout, setLayout] = React.useState<MeasuredXAxisLayout>({\n height: fallbackHeight ?? 0,\n margin: {},\n });\n\n React.useLayoutEffect(() => {\n setLayout({ height: fallbackHeight ?? 0, margin: {} });\n }, [fallbackHeight, layoutKey]);\n\n React.useLayoutEffect(() => {\n if (angle == null) return;\n\n const container = containerRef.current;\n if (!container) return;\n\n const measure = () => {\n const surface = container.querySelector<SVGSVGElement>('.recharts-surface');\n const ticks = Array.from(\n container.querySelectorAll<SVGTextElement>(\n '.recharts-xAxis-tick-labels text'\n )\n );\n if (!surface || !ticks.length) return;\n\n const surfaceBounds = surface.getBoundingClientRect();\n if (!surfaceBounds.width || !surfaceBounds.height) return;\n\n const tickBounds = ticks.map((tick) => tick.getBoundingClientRect());\n const left = Math.min(...tickBounds.map((bounds) => bounds.left));\n const right = Math.max(...tickBounds.map((bounds) => bounds.right));\n const bottom = Math.max(...tickBounds.map((bounds) => bounds.bottom));\n const legendBounds = container\n .querySelector<HTMLElement>('.recharts-legend-wrapper')\n ?.getBoundingClientRect();\n // Recharts' legend is absolutely positioned inside the same responsive\n // area. It can therefore overlap labels well before the SVG's own lower\n // edge. Keep a small, intentional gap to it rather than making the tick\n // row consume every pixel down to that edge.\n const bottomBoundary = Math.min(\n surfaceBounds.bottom,\n legendBounds ? legendBounds.top - 8 : surfaceBounds.bottom\n );\n\n setLayout((current) => {\n const
|
|
1
|
+
{"version":3,"file":"use-x-axis-layout.js","names":[],"sources":["../../../../src/components/ui/chart/use-x-axis-layout.ts"],"sourcesContent":["import * as React from 'react';\n\nimport { resolveXAxisHeight } from './chart-format';\n\nexport type XAxisLayout = {\n height: number | undefined;\n margin: { left?: number; right?: number } | undefined;\n};\n\ntype ChartMargin = {\n top?: number;\n right?: number;\n bottom?: number;\n left?: number;\n};\n\ntype MeasuredXAxisLayout = {\n height: number;\n margin: { left?: number; right?: number };\n};\n\nconst RECHARTS_DEFAULT_MARGIN = { top: 5, right: 5, bottom: 5, left: 5 } as const;\n// Keep rotated endpoint labels this far inside the chart surface. Signed\n// adjustments converge on this gap after each container resize.\nconst X_AXIS_LABEL_CLEARANCE = 16;\n\n/**\n * Add the measured endpoint clearance without turning recharts' per-side\n * defaults into zeroes. Recharts applies its 5px defaults only when the whole\n * margin prop is absent, so a partial left/right margin must be completed here.\n */\nexport function mergeXAxisLayoutMargin(\n baseMargin: ChartMargin | undefined,\n xAxisMargin: XAxisLayout['margin']\n): ChartMargin | undefined {\n if (!xAxisMargin) return baseMargin;\n\n const margin = {\n top: baseMargin?.top ?? RECHARTS_DEFAULT_MARGIN.top,\n right: baseMargin?.right ?? RECHARTS_DEFAULT_MARGIN.right,\n bottom: baseMargin?.bottom ?? RECHARTS_DEFAULT_MARGIN.bottom,\n left: baseMargin?.left ?? RECHARTS_DEFAULT_MARGIN.left,\n };\n\n return {\n ...margin,\n left: margin.left + (xAxisMargin?.left ?? 0),\n right: margin.right + (xAxisMargin?.right ?? 0),\n };\n}\n\n/**\n * Fits a rotated X-axis tick row to the geometry that recharts actually\n * rendered. Estimating from character count leaves conspicuous empty space for\n * narrow glyphs and short endpoint labels; measuring the SVG lets the axis use\n * precisely the room its labels need.\n */\nexport function useXAxisLayout(\n containerRef: React.RefObject<HTMLElement | null>,\n angle: number | undefined,\n label: string | undefined,\n layoutKey: string\n): XAxisLayout {\n const fallbackHeight = resolveXAxisHeight(label, angle);\n const [layout, setLayout] = React.useState<MeasuredXAxisLayout>({\n height: fallbackHeight ?? 0,\n margin: {},\n });\n\n React.useLayoutEffect(() => {\n setLayout({ height: fallbackHeight ?? 0, margin: {} });\n }, [fallbackHeight, layoutKey]);\n\n React.useLayoutEffect(() => {\n if (angle == null) return;\n\n const container = containerRef.current;\n if (!container) return;\n\n const measure = () => {\n const surface = container.querySelector<SVGSVGElement>('.recharts-surface');\n const ticks = Array.from(\n container.querySelectorAll<SVGTextElement>(\n '.recharts-xAxis-tick-labels text'\n )\n );\n if (!surface || !ticks.length) return;\n\n const surfaceBounds = surface.getBoundingClientRect();\n if (!surfaceBounds.width || !surfaceBounds.height) return;\n\n const tickBounds = ticks\n .map((tick) => tick.getBoundingClientRect())\n .filter(({ width, height }) => width > 0 && height > 0);\n if (!tickBounds.length) return;\n\n const left = Math.min(...tickBounds.map((bounds) => bounds.left));\n const right = Math.max(...tickBounds.map((bounds) => bounds.right));\n const bottom = Math.max(...tickBounds.map((bounds) => bounds.bottom));\n const legendBounds = container\n .querySelector<HTMLElement>('.recharts-legend-wrapper')\n ?.getBoundingClientRect();\n // Recharts' legend is absolutely positioned inside the same responsive\n // area. It can therefore overlap labels well before the SVG's own lower\n // edge. Keep a small, intentional gap to it rather than making the tick\n // row consume every pixel down to that edge.\n const bottomBoundary = Math.min(\n surfaceBounds.bottom,\n legendBounds ? legendBounds.top - 8 : surfaceBounds.bottom\n );\n\n setLayout((current) => {\n const leftAdjustment = Math.ceil(\n surfaceBounds.left - left + X_AXIS_LABEL_CLEARANCE\n );\n const rightAdjustment = Math.ceil(\n right - surfaceBounds.right + X_AXIS_LABEL_CLEARANCE\n );\n const bottomAdjustment = Math.ceil(bottom - bottomBoundary);\n const nextLeft = Math.max(\n 0,\n (current.margin.left ?? 0) + leftAdjustment\n );\n const nextRight = Math.max(\n 0,\n (current.margin.right ?? 0) + rightAdjustment\n );\n // The bottom of the surface is the X-axis allocation boundary. The\n // measured distance tells us how much of the provisional height is\n // unused (or how much is still missing), rather than guessing from a\n // string's character count.\n const minimumHeight = fallbackHeight ?? 0;\n const nextHeight = Math.max(\n minimumHeight,\n current.height + bottomAdjustment\n );\n const nextMargin =\n nextLeft || nextRight\n ? { left: nextLeft || undefined, right: nextRight || undefined }\n : {};\n if (\n current.height === nextHeight &&\n current.margin.left === nextMargin.left &&\n current.margin.right === nextMargin.right\n ) {\n return current;\n }\n return { height: nextHeight, margin: nextMargin };\n });\n };\n\n measure();\n const observer = new ResizeObserver(measure);\n observer.observe(container);\n return () => observer.disconnect();\n }, [angle, containerRef, fallbackHeight, layoutKey]);\n\n return {\n height: layout.height || undefined,\n margin:\n layout.margin.left || layout.margin.right ? layout.margin : undefined,\n };\n}\n"],"mappings":"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"}
|
package/dist/llms.txt
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
# Acronis UI Kit for React — LLM Reference
|
|
2
2
|
|
|
3
|
-
> `@acronis-platform/ui-react` v5.5.
|
|
3
|
+
> `@acronis-platform/ui-react` v5.5.5
|
|
4
4
|
|
|
5
5
|
Machine-readable component reference compiled from framework-agnostic specs.
|
|
6
6
|
Each entry links to a self-contained markdown file with props, behavior,
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@acronis-platform/ui-react",
|
|
3
|
-
"version": "5.5.
|
|
3
|
+
"version": "5.5.5",
|
|
4
4
|
"repository": {
|
|
5
5
|
"type": "git",
|
|
6
6
|
"url": "git+https://github.com/acronis/uikit.git",
|
|
@@ -56,8 +56,8 @@
|
|
|
56
56
|
"react-resizable-panels": "4.11.2",
|
|
57
57
|
"recharts": "3.8.1",
|
|
58
58
|
"tailwind-merge": "3.6.0",
|
|
59
|
-
"@acronis-platform/design-assets": "2.0.0",
|
|
60
59
|
"@acronis-platform/tokens-pd": "4.0.1",
|
|
60
|
+
"@acronis-platform/design-assets": "2.0.0",
|
|
61
61
|
"@acronis-platform/icons-react": "2.0.0"
|
|
62
62
|
},
|
|
63
63
|
"devDependencies": {
|