@trackunit/react-components 1.17.28 → 1.17.31-alpha-20eb17e1671.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/index.cjs.js +6 -10
- package/index.esm.js +6 -10
- package/package.json +5 -5
- package/src/components/Alert/Alert.variants.d.ts +6 -6
- package/src/components/Badge/Badge.variants.d.ts +1 -1
- package/src/components/Breadcrumb/Breadcrumb.variant.d.ts +4 -4
- package/src/components/Card/Card.variants.d.ts +7 -7
- package/src/components/Clickable/Clickable.variants.d.ts +1 -1
- package/src/components/Collapse/Collapse.variants.d.ts +7 -7
- package/src/components/CopyableText/CopyableText.variants.d.ts +1 -1
- package/src/components/DetailsList/DetailsList.variants.d.ts +2 -2
- package/src/components/EmptyState/EmptyState.variants.d.ts +2 -2
- package/src/components/EmptyValue/EmptyValue.variants.d.ts +1 -1
- package/src/components/ExternalLink/ExternalLink.variants.d.ts +1 -1
- package/src/components/Heading/Heading.variants.d.ts +1 -1
- package/src/components/Highlight/Highlight.variants.d.ts +2 -2
- package/src/components/HorizontalOverflowScroller/HorizontalOverflowScroller.variants.d.ts +2 -2
- package/src/components/HorizontalOverflowScroller/OverflowIndicator.variants.d.ts +4 -4
- package/src/components/Icon/Icon.variants.d.ts +2 -2
- package/src/components/Indicator/Indicator.variants.d.ts +5 -5
- package/src/components/InteractableItem/InteractableItem.variants.d.ts +2 -2
- package/src/components/KPI/KPI.variants.d.ts +3 -3
- package/src/components/KPICard/KPICard.variants.d.ts +4 -4
- package/src/components/List/List.variants.d.ts +3 -3
- package/src/components/ListItem/ListItem.variants.d.ts +8 -8
- package/src/components/Menu/MenuItem/MenuItem.variants.d.ts +4 -4
- package/src/components/Menu/MenuList/MenuList.variants.d.ts +5 -5
- package/src/components/Menu/MoreMenu/MoreMenu.variants.d.ts +1 -1
- package/src/components/Notice/Notice.variants.d.ts +3 -3
- package/src/components/Page/Page.variants.d.ts +2 -2
- package/src/components/PageHeader/PageHeader.variants.d.ts +3 -3
- package/src/components/Pagination/Pagination.variants.d.ts +2 -2
- package/src/components/Popover/Popover.variants.d.ts +3 -3
- package/src/components/PreferenceCard/PreferenceCard.variants.d.ts +7 -7
- package/src/components/Sidebar/Sidebar.variants.d.ts +2 -2
- package/src/components/Skeleton/Skeleton.variants.d.ts +1 -1
- package/src/components/SkeletonLines/SkeletonLines.variants.d.ts +1 -1
- package/src/components/Spacer/Spacer.variants.d.ts +1 -1
- package/src/components/Spinner/Spinner.variants.d.ts +4 -4
- package/src/components/Tabs/Tabs.variants.d.ts +4 -4
- package/src/components/Tag/Tag.variants.d.ts +5 -5
- package/src/components/Text/Text.variants.d.ts +1 -1
- package/src/components/ToggleGroup/ToggleGroup.variants.d.ts +5 -5
- package/src/components/Tooltip/Tooltip.variants.d.ts +4 -4
- package/src/components/ValueBar/SegmentedValueBar.d.ts +10 -3
- package/src/components/ValueBar/SegmentedValueBar.variants.d.ts +1 -1
- package/src/components/ValueBar/ValueBar.shared.d.ts +1 -1
- package/src/components/ValueBar/ValueBar.variants.d.ts +1 -1
- package/src/components/ZStack/ZStack.variants.d.ts +2 -2
- package/src/components/buttons/shared/Button.variants.d.ts +5 -5
package/index.cjs.js
CHANGED
|
@@ -323,9 +323,7 @@ const Tag = ({ className, "data-testid": dataTestId, children, size = "medium",
|
|
|
323
323
|
color,
|
|
324
324
|
layout,
|
|
325
325
|
border: color === "white" ? "default" : "none",
|
|
326
|
-
}), "data-testid": dataTestId, onMouseEnter: onMouseEnter, ref: ref, children: [icon !== null && icon !== undefined && size === "medium" ? (jsxRuntime.jsx("div", { className: cvaTagIconContainer(), "data-slot": "icon", children: icon })) : null, jsxRuntime.jsx("span", { className: cvaTagText({ truncate: shouldTruncate }), ref: textRef, children: children }), Boolean(onClickClose) && isSupportedDismissColor && size === "medium" && !disabled ? (
|
|
327
|
-
// a fix for multiselect deselecting tags working together with fade out animation
|
|
328
|
-
jsxRuntime.jsx("div", { className: cvaTagIconContainer(), "data-slot": "dismiss", onClick: onClickClose, children: jsxRuntime.jsx(Icon, { className: cvaTagIcon(), "data-testid": dataTestId + "Icon", name: "XCircle", size: "small", style: { WebkitTransition: "-webkit-transform 0.150s" }, type: "solid" }) })) : null] }));
|
|
326
|
+
}), "data-testid": dataTestId, onMouseEnter: onMouseEnter, ref: ref, children: [icon !== null && icon !== undefined && size === "medium" ? (jsxRuntime.jsx("div", { className: cvaTagIconContainer(), "data-slot": "icon", children: icon })) : null, jsxRuntime.jsx("span", { className: cvaTagText({ truncate: shouldTruncate }), ref: textRef, children: children }), Boolean(onClickClose) && isSupportedDismissColor && size === "medium" && !disabled ? (jsxRuntime.jsx("div", { className: cvaTagIconContainer(), "data-slot": "dismiss", onClick: onClickClose, children: jsxRuntime.jsx(Icon, { className: cvaTagIcon(), "data-testid": dataTestId + "Icon", name: "XCircle", size: "small", style: { WebkitTransition: "-webkit-transform 0.150s" }, type: "solid" }) })) : null] }));
|
|
329
327
|
};
|
|
330
328
|
|
|
331
329
|
/**
|
|
@@ -5210,9 +5208,7 @@ const KPICard = ({ isActive = false, onClick, className, "data-testid": dataTest
|
|
|
5210
5208
|
isClickable,
|
|
5211
5209
|
isActive,
|
|
5212
5210
|
className,
|
|
5213
|
-
}), "data-testid": dataTestId ? dataTestId : undefined, onClick: onClick, ref: ref, children: jsxRuntime.jsxs(CardBody, { className: cvaKPICardBody(), gap: "none", padding: "none", children: [jsxRuntime.jsxs("div", { className: cvaKPICardHeader(), children: [jsxRuntime.jsx(KPI, { ...rest, className: "p-0", "data-testid": dataTestId ? `${dataTestId}-kpi` : undefined, unit: unit }), iconName ? (jsxRuntime.jsx("div", { className: cvaKPIIconContainer({ iconColor }), children: jsxRuntime.jsx(Icon, { name: iconName, size: "small", type: "solid" }) })) : null] }), trends !== undefined && trends.length > 0 ? (jsxRuntime.jsx(TrendIndicators, { "data-testid": dataTestId ? `${dataTestId}-trend-indicators` : undefined, trends: trends })) : null, valueBar !== undefined ? (jsxRuntime.jsx(ValueBar, { className: "h-2", "data-testid": dataTestId ? `${dataTestId}-value-bar` : undefined, ...valueBar })) : null, notice !== undefined ? (
|
|
5214
|
-
// NOTE: Can't use Notice component here due to the non-flexible text styling options
|
|
5215
|
-
jsxRuntime.jsxs("div", { className: "flex items-center gap-1 truncate", "data-testid": dataTestId ? `${dataTestId}-notice` : undefined, children: [notice.iconName ? (jsxRuntime.jsx(Icon, { color: notice.iconColor, "data-testid": dataTestId ? `${dataTestId}-notice-icon` : undefined, name: notice.iconName, size: "small" })) : null, jsxRuntime.jsx(Text, { className: "truncate text-neutral-900", "data-testid": dataTestId ? `${dataTestId}-notice-label` : undefined, size: "small", children: notice.label })] })) : null, children] }) }));
|
|
5211
|
+
}), "data-testid": dataTestId ? dataTestId : undefined, onClick: onClick, ref: ref, children: jsxRuntime.jsxs(CardBody, { className: cvaKPICardBody(), gap: "none", padding: "none", children: [jsxRuntime.jsxs("div", { className: cvaKPICardHeader(), children: [jsxRuntime.jsx(KPI, { ...rest, className: "p-0", "data-testid": dataTestId ? `${dataTestId}-kpi` : undefined, unit: unit }), iconName ? (jsxRuntime.jsx("div", { className: cvaKPIIconContainer({ iconColor }), children: jsxRuntime.jsx(Icon, { name: iconName, size: "small", type: "solid" }) })) : null] }), trends !== undefined && trends.length > 0 ? (jsxRuntime.jsx(TrendIndicators, { "data-testid": dataTestId ? `${dataTestId}-trend-indicators` : undefined, trends: trends })) : null, valueBar !== undefined ? (jsxRuntime.jsx(ValueBar, { className: "h-2", "data-testid": dataTestId ? `${dataTestId}-value-bar` : undefined, ...valueBar })) : null, notice !== undefined ? (jsxRuntime.jsxs("div", { className: "flex items-center gap-1 truncate", "data-testid": dataTestId ? `${dataTestId}-notice` : undefined, children: [notice.iconName ? (jsxRuntime.jsx(Icon, { color: notice.iconColor, "data-testid": dataTestId ? `${dataTestId}-notice-icon` : undefined, name: notice.iconName, size: "small" })) : null, jsxRuntime.jsx(Text, { className: "truncate text-neutral-900", "data-testid": dataTestId ? `${dataTestId}-notice-label` : undefined, size: "small", children: notice.label })] })) : null, children] }) }));
|
|
5216
5212
|
};
|
|
5217
5213
|
|
|
5218
5214
|
/**
|
|
@@ -8109,16 +8105,16 @@ const getValueTextVariant = (size, sum, segments, total) => {
|
|
|
8109
8105
|
* SegmentedValueBar displays multiple colored segments on a bar to visualize values relative to a total.
|
|
8110
8106
|
* Supports optional tooltips per segment, showing value and optionally a label.
|
|
8111
8107
|
*/
|
|
8112
|
-
const SegmentedValueBar = ({ segments, total, size = "small", showValue = false, unit, valueColor, showTooltip = false, className, "data-testid": dataTestId, }) => {
|
|
8108
|
+
const SegmentedValueBar = ({ segments, total, size = "small", showValue = false, displayValue, unit, valueColor, showTooltip = false, tooltipUnit, className, "data-testid": dataTestId, }) => {
|
|
8113
8109
|
const computedSegments = computeSegments(segments, total);
|
|
8114
8110
|
const sum = total > 0 ? computeSum(segments) : 0;
|
|
8115
|
-
const valueText = formatValue(sum, unit);
|
|
8111
|
+
const valueText = formatValue(displayValue ?? sum, unit);
|
|
8116
8112
|
const canShowValue = showValue && size !== "extraSmall";
|
|
8117
8113
|
const valueTextClassName = cvaValueBarText({ size: getValueTextVariant(size, sum, segments, total) });
|
|
8118
8114
|
return (jsxRuntime.jsxs("span", { className: valueBarContainerClassName, "data-testid": dataTestId, children: [jsxRuntime.jsx("div", { "aria-label": valueText, className: cvaSegmentedValueBar({ className, size }), "data-testid": dataTestId ? `${dataTestId}-track` : undefined, children: computedSegments.map((segment, index) => {
|
|
8119
8115
|
const tooltipLabel = segment.label
|
|
8120
|
-
? `${segment.label}: ${formatValue(segment.value, unit)}`
|
|
8121
|
-
: formatValue(segment.value, unit);
|
|
8116
|
+
? `${segment.label}: ${formatValue(segment.value, tooltipUnit ?? unit)}`
|
|
8117
|
+
: formatValue(segment.value, tooltipUnit ?? unit);
|
|
8122
8118
|
return showTooltip ? (jsxRuntime.jsx(Tooltip, { label: tooltipLabel, placement: "top", children: jsxRuntime.jsx("div", { "data-testid": dataTestId ? `${dataTestId}-segment-${index}` : undefined, style: { backgroundColor: segment.color, width: `${segment.width}%`, height: "100%" } }) }, index)) : (jsxRuntime.jsx("div", { "data-testid": dataTestId ? `${dataTestId}-segment-${index}` : undefined, style: { backgroundColor: segment.color, width: `${segment.width}%`, height: "100%" } }, index));
|
|
8123
8119
|
}) }), canShowValue ? (jsxRuntime.jsx("span", { className: valueTextClassName, "data-testid": dataTestId ? `${dataTestId}-value` : undefined, children: jsxRuntime.jsx("span", { style: valueColor ? { color: valueColor } : undefined, children: valueText }) })) : null] }));
|
|
8124
8120
|
};
|
package/index.esm.js
CHANGED
|
@@ -321,9 +321,7 @@ const Tag = ({ className, "data-testid": dataTestId, children, size = "medium",
|
|
|
321
321
|
color,
|
|
322
322
|
layout,
|
|
323
323
|
border: color === "white" ? "default" : "none",
|
|
324
|
-
}), "data-testid": dataTestId, onMouseEnter: onMouseEnter, ref: ref, children: [icon !== null && icon !== undefined && size === "medium" ? (jsx("div", { className: cvaTagIconContainer(), "data-slot": "icon", children: icon })) : null, jsx("span", { className: cvaTagText({ truncate: shouldTruncate }), ref: textRef, children: children }), Boolean(onClickClose) && isSupportedDismissColor && size === "medium" && !disabled ? (
|
|
325
|
-
// a fix for multiselect deselecting tags working together with fade out animation
|
|
326
|
-
jsx("div", { className: cvaTagIconContainer(), "data-slot": "dismiss", onClick: onClickClose, children: jsx(Icon, { className: cvaTagIcon(), "data-testid": dataTestId + "Icon", name: "XCircle", size: "small", style: { WebkitTransition: "-webkit-transform 0.150s" }, type: "solid" }) })) : null] }));
|
|
324
|
+
}), "data-testid": dataTestId, onMouseEnter: onMouseEnter, ref: ref, children: [icon !== null && icon !== undefined && size === "medium" ? (jsx("div", { className: cvaTagIconContainer(), "data-slot": "icon", children: icon })) : null, jsx("span", { className: cvaTagText({ truncate: shouldTruncate }), ref: textRef, children: children }), Boolean(onClickClose) && isSupportedDismissColor && size === "medium" && !disabled ? (jsx("div", { className: cvaTagIconContainer(), "data-slot": "dismiss", onClick: onClickClose, children: jsx(Icon, { className: cvaTagIcon(), "data-testid": dataTestId + "Icon", name: "XCircle", size: "small", style: { WebkitTransition: "-webkit-transform 0.150s" }, type: "solid" }) })) : null] }));
|
|
327
325
|
};
|
|
328
326
|
|
|
329
327
|
/**
|
|
@@ -5208,9 +5206,7 @@ const KPICard = ({ isActive = false, onClick, className, "data-testid": dataTest
|
|
|
5208
5206
|
isClickable,
|
|
5209
5207
|
isActive,
|
|
5210
5208
|
className,
|
|
5211
|
-
}), "data-testid": dataTestId ? dataTestId : undefined, onClick: onClick, ref: ref, children: jsxs(CardBody, { className: cvaKPICardBody(), gap: "none", padding: "none", children: [jsxs("div", { className: cvaKPICardHeader(), children: [jsx(KPI, { ...rest, className: "p-0", "data-testid": dataTestId ? `${dataTestId}-kpi` : undefined, unit: unit }), iconName ? (jsx("div", { className: cvaKPIIconContainer({ iconColor }), children: jsx(Icon, { name: iconName, size: "small", type: "solid" }) })) : null] }), trends !== undefined && trends.length > 0 ? (jsx(TrendIndicators, { "data-testid": dataTestId ? `${dataTestId}-trend-indicators` : undefined, trends: trends })) : null, valueBar !== undefined ? (jsx(ValueBar, { className: "h-2", "data-testid": dataTestId ? `${dataTestId}-value-bar` : undefined, ...valueBar })) : null, notice !== undefined ? (
|
|
5212
|
-
// NOTE: Can't use Notice component here due to the non-flexible text styling options
|
|
5213
|
-
jsxs("div", { className: "flex items-center gap-1 truncate", "data-testid": dataTestId ? `${dataTestId}-notice` : undefined, children: [notice.iconName ? (jsx(Icon, { color: notice.iconColor, "data-testid": dataTestId ? `${dataTestId}-notice-icon` : undefined, name: notice.iconName, size: "small" })) : null, jsx(Text, { className: "truncate text-neutral-900", "data-testid": dataTestId ? `${dataTestId}-notice-label` : undefined, size: "small", children: notice.label })] })) : null, children] }) }));
|
|
5209
|
+
}), "data-testid": dataTestId ? dataTestId : undefined, onClick: onClick, ref: ref, children: jsxs(CardBody, { className: cvaKPICardBody(), gap: "none", padding: "none", children: [jsxs("div", { className: cvaKPICardHeader(), children: [jsx(KPI, { ...rest, className: "p-0", "data-testid": dataTestId ? `${dataTestId}-kpi` : undefined, unit: unit }), iconName ? (jsx("div", { className: cvaKPIIconContainer({ iconColor }), children: jsx(Icon, { name: iconName, size: "small", type: "solid" }) })) : null] }), trends !== undefined && trends.length > 0 ? (jsx(TrendIndicators, { "data-testid": dataTestId ? `${dataTestId}-trend-indicators` : undefined, trends: trends })) : null, valueBar !== undefined ? (jsx(ValueBar, { className: "h-2", "data-testid": dataTestId ? `${dataTestId}-value-bar` : undefined, ...valueBar })) : null, notice !== undefined ? (jsxs("div", { className: "flex items-center gap-1 truncate", "data-testid": dataTestId ? `${dataTestId}-notice` : undefined, children: [notice.iconName ? (jsx(Icon, { color: notice.iconColor, "data-testid": dataTestId ? `${dataTestId}-notice-icon` : undefined, name: notice.iconName, size: "small" })) : null, jsx(Text, { className: "truncate text-neutral-900", "data-testid": dataTestId ? `${dataTestId}-notice-label` : undefined, size: "small", children: notice.label })] })) : null, children] }) }));
|
|
5214
5210
|
};
|
|
5215
5211
|
|
|
5216
5212
|
/**
|
|
@@ -8107,16 +8103,16 @@ const getValueTextVariant = (size, sum, segments, total) => {
|
|
|
8107
8103
|
* SegmentedValueBar displays multiple colored segments on a bar to visualize values relative to a total.
|
|
8108
8104
|
* Supports optional tooltips per segment, showing value and optionally a label.
|
|
8109
8105
|
*/
|
|
8110
|
-
const SegmentedValueBar = ({ segments, total, size = "small", showValue = false, unit, valueColor, showTooltip = false, className, "data-testid": dataTestId, }) => {
|
|
8106
|
+
const SegmentedValueBar = ({ segments, total, size = "small", showValue = false, displayValue, unit, valueColor, showTooltip = false, tooltipUnit, className, "data-testid": dataTestId, }) => {
|
|
8111
8107
|
const computedSegments = computeSegments(segments, total);
|
|
8112
8108
|
const sum = total > 0 ? computeSum(segments) : 0;
|
|
8113
|
-
const valueText = formatValue(sum, unit);
|
|
8109
|
+
const valueText = formatValue(displayValue ?? sum, unit);
|
|
8114
8110
|
const canShowValue = showValue && size !== "extraSmall";
|
|
8115
8111
|
const valueTextClassName = cvaValueBarText({ size: getValueTextVariant(size, sum, segments, total) });
|
|
8116
8112
|
return (jsxs("span", { className: valueBarContainerClassName, "data-testid": dataTestId, children: [jsx("div", { "aria-label": valueText, className: cvaSegmentedValueBar({ className, size }), "data-testid": dataTestId ? `${dataTestId}-track` : undefined, children: computedSegments.map((segment, index) => {
|
|
8117
8113
|
const tooltipLabel = segment.label
|
|
8118
|
-
? `${segment.label}: ${formatValue(segment.value, unit)}`
|
|
8119
|
-
: formatValue(segment.value, unit);
|
|
8114
|
+
? `${segment.label}: ${formatValue(segment.value, tooltipUnit ?? unit)}`
|
|
8115
|
+
: formatValue(segment.value, tooltipUnit ?? unit);
|
|
8120
8116
|
return showTooltip ? (jsx(Tooltip, { label: tooltipLabel, placement: "top", children: jsx("div", { "data-testid": dataTestId ? `${dataTestId}-segment-${index}` : undefined, style: { backgroundColor: segment.color, width: `${segment.width}%`, height: "100%" } }) }, index)) : (jsx("div", { "data-testid": dataTestId ? `${dataTestId}-segment-${index}` : undefined, style: { backgroundColor: segment.color, width: `${segment.width}%`, height: "100%" } }, index));
|
|
8121
8117
|
}) }), canShowValue ? (jsx("span", { className: valueTextClassName, "data-testid": dataTestId ? `${dataTestId}-value` : undefined, children: jsx("span", { style: valueColor ? { color: valueColor } : undefined, children: valueText }) })) : null] }));
|
|
8122
8118
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@trackunit/react-components",
|
|
3
|
-
"version": "1.17.
|
|
3
|
+
"version": "1.17.31-alpha-20eb17e1671.0",
|
|
4
4
|
"repository": "https://github.com/Trackunit/manager",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
6
6
|
"engines": {
|
|
@@ -14,10 +14,10 @@
|
|
|
14
14
|
"@floating-ui/react": "^0.26.25",
|
|
15
15
|
"string-ts": "^2.0.0",
|
|
16
16
|
"tailwind-merge": "^2.0.0",
|
|
17
|
-
"@trackunit/ui-design-tokens": "1.11.
|
|
18
|
-
"@trackunit/css-class-variance-utilities": "1.11.
|
|
19
|
-
"@trackunit/shared-utils": "1.13.
|
|
20
|
-
"@trackunit/ui-icons": "1.11.
|
|
17
|
+
"@trackunit/ui-design-tokens": "1.11.48-alpha-20eb17e1671.0",
|
|
18
|
+
"@trackunit/css-class-variance-utilities": "1.11.48-alpha-20eb17e1671.0",
|
|
19
|
+
"@trackunit/shared-utils": "1.13.48-alpha-20eb17e1671.0",
|
|
20
|
+
"@trackunit/ui-icons": "1.11.47-alpha-20eb17e1671.0",
|
|
21
21
|
"@tanstack/react-router": "1.114.29",
|
|
22
22
|
"es-toolkit": "^1.39.10",
|
|
23
23
|
"@tanstack/react-virtual": "3.13.12",
|
|
@@ -1,21 +1,21 @@
|
|
|
1
1
|
export declare const cvaAlert: (props?: ({
|
|
2
2
|
color?: "danger" | "warning" | "success" | "info" | "neutral" | null | undefined;
|
|
3
3
|
actionsInline?: boolean | null | undefined;
|
|
4
|
-
} & import("class-variance-authority/
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
5
|
export declare const cvaAlertActionsContainer: (props?: ({
|
|
6
6
|
inline?: boolean | null | undefined;
|
|
7
7
|
actionsInline?: boolean | null | undefined;
|
|
8
|
-
} & import("class-variance-authority/
|
|
9
|
-
export declare const cvaContent: (props?: import("class-variance-authority/
|
|
8
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
9
|
+
export declare const cvaContent: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
10
10
|
export declare const cvaAlertContentContainer: (props?: ({
|
|
11
11
|
inline?: boolean | null | undefined;
|
|
12
12
|
actionsInline?: boolean | null | undefined;
|
|
13
|
-
} & import("class-variance-authority/
|
|
13
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
14
14
|
export declare const cvaAlertCloseButtonContainer: (props?: ({
|
|
15
15
|
inline?: boolean | null | undefined;
|
|
16
16
|
actionsInline?: boolean | null | undefined;
|
|
17
|
-
} & import("class-variance-authority/
|
|
17
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
18
18
|
export declare const cvaAlertIconContainer: (props?: ({
|
|
19
19
|
inline?: boolean | null | undefined;
|
|
20
20
|
actionsInline?: boolean | null | undefined;
|
|
21
|
-
} & import("class-variance-authority/
|
|
21
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -3,4 +3,4 @@ export declare const cvaBadge: (props?: ({
|
|
|
3
3
|
compact?: boolean | null | undefined;
|
|
4
4
|
size?: "default" | "condensed" | null | undefined;
|
|
5
5
|
isSingleChar?: boolean | null | undefined;
|
|
6
|
-
} & import("class-variance-authority/
|
|
6
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export declare const cvaBreadcrumb: (props?: import("class-variance-authority/
|
|
2
|
-
export declare const cvaBreadcrumbItem: (props?: import("class-variance-authority/
|
|
3
|
-
export declare const cvaBreadcrumbForLargeScreen: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaBreadcrumb: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
|
+
export declare const cvaBreadcrumbItem: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
3
|
+
export declare const cvaBreadcrumbForLargeScreen: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
4
4
|
export declare const cvaBreadcrumbForMediumScreen: (props?: ({
|
|
5
5
|
expanded?: boolean | null | undefined;
|
|
6
|
-
} & import("class-variance-authority/
|
|
6
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,20 +1,20 @@
|
|
|
1
1
|
export declare const cvaCard: (props?: ({
|
|
2
2
|
clickable?: boolean | null | undefined;
|
|
3
3
|
fullHeight?: boolean | null | undefined;
|
|
4
|
-
} & import("class-variance-authority/
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
5
|
export declare const cvaCardFooterContainerRoot: (props?: ({
|
|
6
6
|
border?: "default" | "borderless" | null | undefined;
|
|
7
7
|
padding?: "default" | "none" | null | undefined;
|
|
8
|
-
} & import("class-variance-authority/
|
|
9
|
-
export declare const cvaCardFooterContainer: (props?: import("class-variance-authority/
|
|
10
|
-
export declare const cvaCardHeader: (props?: import("class-variance-authority/
|
|
11
|
-
export declare const cvaCardHeaderHeadingContainer: (props?: import("class-variance-authority/
|
|
8
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
9
|
+
export declare const cvaCardFooterContainer: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
10
|
+
export declare const cvaCardHeader: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
11
|
+
export declare const cvaCardHeaderHeadingContainer: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
12
12
|
export declare const cvaCardHeaderContainer: (props?: ({
|
|
13
13
|
border?: "default" | "borderless" | null | undefined;
|
|
14
14
|
padding?: "default" | "none" | null | undefined;
|
|
15
|
-
} & import("class-variance-authority/
|
|
15
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
16
16
|
export declare const cvaCardBodyContainer: (props?: ({
|
|
17
17
|
direction?: "row" | "row-reverse" | "column" | "column-reverse" | null | undefined;
|
|
18
18
|
padding?: "default" | "none" | null | undefined;
|
|
19
19
|
gap?: "default" | "none" | null | undefined;
|
|
20
|
-
} & import("class-variance-authority/
|
|
20
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,24 +1,24 @@
|
|
|
1
1
|
export declare const cvaCollapse: (props?: ({
|
|
2
2
|
variant?: "primary" | "secondary" | null | undefined;
|
|
3
|
-
} & import("class-variance-authority/
|
|
3
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
4
4
|
export declare const cvaCollapseHeader: (props?: ({
|
|
5
5
|
expanded?: boolean | null | undefined;
|
|
6
6
|
variant?: "primary" | "secondary" | null | undefined;
|
|
7
7
|
extraPadding?: boolean | null | undefined;
|
|
8
|
-
} & import("class-variance-authority/
|
|
8
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
9
9
|
export declare const cvaCollapseLabelContainer: (props?: ({
|
|
10
10
|
variant?: "primary" | "secondary" | null | undefined;
|
|
11
|
-
} & import("class-variance-authority/
|
|
11
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
12
12
|
export declare const cvaCollapseLabel: (props?: ({
|
|
13
13
|
variant?: "primary" | "secondary" | null | undefined;
|
|
14
|
-
} & import("class-variance-authority/
|
|
14
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
15
15
|
export declare const cvaCollapsible: (props?: ({
|
|
16
16
|
variant?: "primary" | "secondary" | null | undefined;
|
|
17
17
|
extraPadding?: boolean | null | undefined;
|
|
18
|
-
} & import("class-variance-authority/
|
|
18
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
19
19
|
export declare const cvaCollapseAnimated: (props?: ({
|
|
20
20
|
expanded?: boolean | null | undefined;
|
|
21
|
-
} & import("class-variance-authority/
|
|
21
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
22
22
|
export declare const cvaChevronIcon: (props?: ({
|
|
23
23
|
expanded?: boolean | null | undefined;
|
|
24
|
-
} & import("class-variance-authority/
|
|
24
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export declare const cvaDetailsList: (props?: ({
|
|
2
2
|
hasLink?: boolean | null | undefined;
|
|
3
|
-
} & import("class-variance-authority/
|
|
4
|
-
export declare const cvaDetailsListItem: (props?: import("class-variance-authority/
|
|
3
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
4
|
+
export declare const cvaDetailsListItem: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export declare const cvaContainerStyles: (props?: import("class-variance-authority/
|
|
2
|
-
export declare const cvaImgStyles: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaContainerStyles: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
|
+
export declare const cvaImgStyles: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const cvaEmptyValue: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaEmptyValue: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -2,4 +2,4 @@ export declare const cvaHeading: (props?: ({
|
|
|
2
2
|
subtle?: boolean | null | undefined;
|
|
3
3
|
inverted?: boolean | null | undefined;
|
|
4
4
|
size?: "primary" | "secondary" | "tertiary" | "subtitle" | null | undefined;
|
|
5
|
-
} & import("class-variance-authority/
|
|
5
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export declare const cvaHighlight: (props?: ({
|
|
2
2
|
size?: "small" | "medium" | null | undefined;
|
|
3
3
|
color?: "info" | "success" | "warning" | "danger" | "unknown" | "clear" | null | undefined;
|
|
4
|
-
} & import("class-variance-authority/
|
|
5
|
-
export declare const cvaHighlightText: (props?: import("class-variance-authority/
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
|
+
export declare const cvaHighlightText: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export declare const cvaHorizontalOverflowScroller: (props?: import("class-variance-authority/
|
|
2
|
-
export declare const cvaHorizontalOverflowScrollerAndIndicatorsContainer: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaHorizontalOverflowScroller: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
|
+
export declare const cvaHorizontalOverflowScrollerAndIndicatorsContainer: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
export declare const cvaOverflowIndicatorContainer: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaOverflowIndicatorContainer: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
2
|
export declare const cvaOverflowIndicatorGradient: (props?: ({
|
|
3
3
|
direction?: "left" | "right" | null | undefined;
|
|
4
|
-
} & import("class-variance-authority/
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
5
|
export declare const cvaJustificationContainer: (props?: ({
|
|
6
6
|
direction?: "left" | "right" | null | undefined;
|
|
7
|
-
} & import("class-variance-authority/
|
|
8
|
-
export declare const cvaOverflowIndicatorButton: (props?: import("class-variance-authority/
|
|
7
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
|
+
export declare const cvaOverflowIndicatorButton: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export declare const cvaIcon: (props?: ({
|
|
2
|
-
color?: "
|
|
2
|
+
color?: "primary" | "neutral" | "info" | "success" | "warning" | "danger" | "good" | "low" | "critical" | "working" | "idle" | "moving" | "active" | "excessive_usage" | "stopped" | "unknown" | "default" | "black" | "white" | "unused" | "utilized" | "heavily_utilized" | "unknown_utilization" | "site_area" | "site_classic_poi" | "site_classic_zone" | "site_depot" | "site_work_place" | "site_construction_site" | "site_unknown" | "on_rent" | "returned" | "available" | "pickup_ready" | "transfer" | "in_repair" | "other_rental_status" | null | undefined;
|
|
3
3
|
size?: "small" | "medium" | "large" | null | undefined;
|
|
4
4
|
fontSize?: boolean | null | undefined;
|
|
5
|
-
} & import("class-variance-authority/
|
|
5
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,14 +1,14 @@
|
|
|
1
|
-
export declare const cvaIndicator: (props?: import("class-variance-authority/
|
|
2
|
-
export declare const cvaIndicatorIcon: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaIndicator: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
|
+
export declare const cvaIndicatorIcon: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
3
3
|
export declare const cvaIndicatorLabel: (props?: ({
|
|
4
4
|
size?: "small" | "medium" | null | undefined;
|
|
5
5
|
weight?: "medium" | "normal" | null | undefined;
|
|
6
6
|
background?: "visible" | "hidden" | null | undefined;
|
|
7
|
-
} & import("class-variance-authority/
|
|
7
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
8
8
|
export declare const cvaIndicatorPing: (props?: ({
|
|
9
9
|
color?: "primary" | "secondary" | "neutral" | "info" | "success" | "warning" | "danger" | "good" | "low" | "critical" | "working" | "idle" | "stopped" | "moving" | "active" | "excessive_usage" | "unknown" | "unused" | "utilized" | "heavily_utilized" | "unknown_utilization" | "available" | "on_rent" | "pickup_ready" | "transfer" | "in_repair" | "returned" | "other_rental_status" | "site_area" | "site_classic_poi" | "site_classic_zone" | "site_depot" | "site_work_place" | "site_construction_site" | "site_unknown" | "white" | "black" | null | undefined;
|
|
10
|
-
} & import("class-variance-authority/
|
|
10
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
11
11
|
export declare const cvaIndicatorIconBackground: (props?: ({
|
|
12
12
|
color?: "primary" | "secondary" | "neutral" | "info" | "success" | "warning" | "danger" | "good" | "low" | "critical" | "working" | "idle" | "stopped" | "moving" | "active" | "excessive_usage" | "unknown" | "unused" | "utilized" | "heavily_utilized" | "unknown_utilization" | "available" | "on_rent" | "pickup_ready" | "transfer" | "in_repair" | "returned" | "other_rental_status" | "site_area" | "site_classic_poi" | "site_classic_zone" | "site_depot" | "site_work_place" | "site_construction_site" | "site_unknown" | "white" | "black" | null | undefined;
|
|
13
13
|
background?: "visible" | "hidden" | null | undefined;
|
|
14
|
-
} & import("class-variance-authority/
|
|
14
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -13,8 +13,8 @@
|
|
|
13
13
|
* @returns tailwind class names on the basis on the provided props.
|
|
14
14
|
*/
|
|
15
15
|
export declare const cvaInteractableItem: (props?: ({
|
|
16
|
-
cursor?: "
|
|
16
|
+
cursor?: "pointer" | "auto" | "help" | "zoom-in" | "zoom-out" | "default" | "not-allowed" | null | undefined;
|
|
17
17
|
selection?: "auto" | "selected" | "unselected" | null | undefined;
|
|
18
18
|
disabled?: boolean | null | undefined;
|
|
19
19
|
focus?: "auto" | "focused" | "unfocused" | null | undefined;
|
|
20
|
-
} & import("class-variance-authority/
|
|
20
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export declare const cvaKPI: (props?: ({
|
|
2
|
-
variant?: "
|
|
3
|
-
} & import("class-variance-authority/
|
|
2
|
+
variant?: "small" | "condensed" | "default" | null | undefined;
|
|
3
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
4
4
|
export declare const cvaKPITrendPercentage: (props?: ({
|
|
5
5
|
color?: "success" | "danger" | "warning" | "neutral" | "info" | null | undefined;
|
|
6
|
-
} & import("class-variance-authority/
|
|
6
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
export declare const cvaKPICard: (props?: ({
|
|
2
2
|
isClickable?: boolean | null | undefined;
|
|
3
3
|
isActive?: boolean | null | undefined;
|
|
4
|
-
} & import("class-variance-authority/
|
|
5
|
-
export declare const cvaKPICardBody: (props?: import("class-variance-authority/
|
|
6
|
-
export declare const cvaKPICardHeader: (props?: import("class-variance-authority/
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
|
+
export declare const cvaKPICardBody: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
6
|
+
export declare const cvaKPICardHeader: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
7
7
|
export declare const cvaKPIIconContainer: (props?: ({
|
|
8
8
|
iconColor?: "success" | "warning" | "danger" | "info" | "neutral" | null | undefined;
|
|
9
|
-
} & import("class-variance-authority/
|
|
9
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
export declare const cvaListContainer: (props?: ({
|
|
2
2
|
withTopSeparator?: boolean | null | undefined;
|
|
3
|
-
} & import("class-variance-authority/
|
|
4
|
-
export declare const cvaList: (props?: import("class-variance-authority/
|
|
3
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
4
|
+
export declare const cvaList: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
5
5
|
export declare const cvaListItem: (props?: ({
|
|
6
6
|
separator?: "line" | "none" | null | undefined;
|
|
7
7
|
contentFillsContainer?: boolean | null | undefined;
|
|
8
|
-
} & import("class-variance-authority/
|
|
8
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
|
-
export declare const cvaListItem: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaListItem: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
2
|
export declare const cvaMainInformationClass: (props?: ({
|
|
3
3
|
hasThumbnail?: boolean | null | undefined;
|
|
4
|
-
} & import("class-variance-authority/
|
|
5
|
-
export declare const cvaThumbnailContainer: (props?: import("class-variance-authority/
|
|
6
|
-
export declare const cvaTextContainer: (props?: import("class-variance-authority/
|
|
7
|
-
export declare const cvaTitleRow: (props?: import("class-variance-authority/
|
|
8
|
-
export declare const cvaDescriptionRow: (props?: import("class-variance-authority/
|
|
9
|
-
export declare const cvaMetaRow: (props?: import("class-variance-authority/
|
|
10
|
-
export declare const cvaDetailsContainer: (props?: import("class-variance-authority/
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
|
+
export declare const cvaThumbnailContainer: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
6
|
+
export declare const cvaTextContainer: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
7
|
+
export declare const cvaTitleRow: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
8
|
+
export declare const cvaDescriptionRow: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
9
|
+
export declare const cvaMetaRow: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
10
|
+
export declare const cvaDetailsContainer: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -18,19 +18,19 @@ export declare const cvaMenuItemStyle: (props?: ({
|
|
|
18
18
|
variant?: "primary" | "danger" | null | undefined;
|
|
19
19
|
selected?: boolean | null | undefined;
|
|
20
20
|
disabled?: boolean | null | undefined;
|
|
21
|
-
} & import("class-variance-authority/
|
|
21
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
22
22
|
export declare const cvaMenuItemLabel: (props?: ({
|
|
23
23
|
variant?: "primary" | "danger" | null | undefined;
|
|
24
24
|
disabled?: boolean | null | undefined;
|
|
25
|
-
} & import("class-variance-authority/
|
|
25
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
26
26
|
export declare const cvaMenuItemPrefix: (props?: ({
|
|
27
27
|
selected?: boolean | null | undefined;
|
|
28
28
|
variant?: "primary" | "danger" | null | undefined;
|
|
29
29
|
disabled?: boolean | null | undefined;
|
|
30
|
-
} & import("class-variance-authority/
|
|
30
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
31
31
|
export declare const cvaMenuItemSuffix: (props?: ({
|
|
32
32
|
selected?: boolean | null | undefined;
|
|
33
33
|
variant?: "primary" | "danger" | null | undefined;
|
|
34
34
|
disabled?: boolean | null | undefined;
|
|
35
|
-
} & import("class-variance-authority/
|
|
35
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
36
36
|
export {};
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
export declare const cvaMenu: (props?: ({
|
|
2
2
|
limitWidth?: boolean | null | undefined;
|
|
3
|
-
} & import("class-variance-authority/
|
|
4
|
-
export declare const cvaMenuList: (props?: import("class-variance-authority/
|
|
5
|
-
export declare const cvaMenuListDivider: (props?: import("class-variance-authority/
|
|
6
|
-
export declare const cvaMenuListMultiSelect: (props?: import("class-variance-authority/
|
|
7
|
-
export declare const cvaMenuListItem: (props?: import("class-variance-authority/
|
|
3
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
4
|
+
export declare const cvaMenuList: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
5
|
+
export declare const cvaMenuListDivider: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
6
|
+
export declare const cvaMenuListMultiSelect: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
7
|
+
export declare const cvaMenuListItem: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const cvaMoreMenu: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaMoreMenu: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -1,8 +1,8 @@
|
|
|
1
|
-
export declare const cvaNotice: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaNotice: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
2
|
export declare const cvaNoticeLabel: (props?: ({
|
|
3
3
|
color?: "neutral" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
4
4
|
size?: "small" | "medium" | null | undefined;
|
|
5
|
-
} & import("class-variance-authority/
|
|
5
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
6
|
export declare const cvaNoticeIcon: (props?: ({
|
|
7
7
|
color?: "neutral" | "info" | "success" | "warning" | "danger" | null | undefined;
|
|
8
|
-
} & import("class-variance-authority/
|
|
8
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
export declare const cvaPage: (props?: ({
|
|
2
2
|
layout?: "content" | "header-content" | "sidebar-content" | "none" | null | undefined;
|
|
3
|
-
} & import("class-variance-authority/
|
|
3
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
4
4
|
export declare const cvaPageContent: (props?: ({
|
|
5
5
|
layout?: "content" | "cols-min-fr" | "rows-min-fr" | null | undefined;
|
|
6
|
-
} & import("class-variance-authority/
|
|
6
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
export declare const cvaPageHeaderContainer: (props?: ({
|
|
2
2
|
withBorder?: boolean | null | undefined;
|
|
3
|
-
} & import("class-variance-authority/
|
|
4
|
-
export declare const cvaPageHeader: (props?: import("class-variance-authority/
|
|
5
|
-
export declare const cvaPageHeaderHeading: (props?: import("class-variance-authority/
|
|
3
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
4
|
+
export declare const cvaPageHeader: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
5
|
+
export declare const cvaPageHeaderHeading: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export declare const cvaPagination: (props?: import("class-variance-authority/
|
|
2
|
-
export declare const cvaPaginationText: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaPagination: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
|
+
export declare const cvaPaginationText: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export declare const cvaPopoverContainer: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaPopoverContainer: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
2
|
export declare const cvaPopoverTitleContainer: (props?: ({
|
|
3
3
|
divider?: boolean | null | undefined;
|
|
4
|
-
} & import("class-variance-authority/
|
|
5
|
-
export declare const cvaPopoverTitleText: (props?: import("class-variance-authority/
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
|
+
export declare const cvaPopoverTitleText: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -6,20 +6,20 @@ export type StringContainingDataInputContainerAttr = `${string}input-container${
|
|
|
6
6
|
export declare const cvaPreferenceCard: (props?: ({
|
|
7
7
|
disabled?: boolean | null | undefined;
|
|
8
8
|
clickable?: boolean | null | undefined;
|
|
9
|
-
} & import("class-variance-authority/
|
|
9
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
10
10
|
export declare const cvaInputContainer: (props?: ({
|
|
11
11
|
itemPlacement?: "center" | "start" | null | undefined;
|
|
12
|
-
} & import("class-variance-authority/
|
|
12
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
13
13
|
export declare const cvaContentContainer: (props?: ({
|
|
14
14
|
itemPlacement?: "center" | "start" | null | undefined;
|
|
15
|
-
} & import("class-variance-authority/
|
|
15
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
16
16
|
export declare const cvaTitleCard: (props?: ({
|
|
17
17
|
disabled?: boolean | null | undefined;
|
|
18
|
-
} & import("class-variance-authority/
|
|
18
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
19
19
|
export declare const cvaDescriptionCard: (props?: ({
|
|
20
20
|
disabled?: boolean | null | undefined;
|
|
21
|
-
} & import("class-variance-authority/
|
|
21
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
22
22
|
export declare const cvaIconBackground: (props?: ({
|
|
23
23
|
disabled?: boolean | null | undefined;
|
|
24
|
-
} & import("class-variance-authority/
|
|
25
|
-
export declare const cvaContentWrapper: (props?: import("class-variance-authority/
|
|
24
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
25
|
+
export declare const cvaContentWrapper: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
export declare const cvaSidebar: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaSidebar: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
2
|
export declare const cvaSidebarChildContainer: (props?: ({
|
|
3
3
|
breakpoint?: "xs" | "sm" | "md" | "lg" | "xl" | "2xl" | "3xl" | null | undefined;
|
|
4
|
-
} & import("class-variance-authority/
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export declare const cvaSkeleton: (props?: ({
|
|
2
2
|
textSize?: "text-xs" | "text-sm" | "text-base" | "text-lg" | "text-xl" | "text-2xl" | "text-3xl" | "text-4xl" | "text-5xl" | "text-6xl" | "text-7xl" | "text-8xl" | "text-9xl" | null | undefined;
|
|
3
|
-
} & import("class-variance-authority/
|
|
3
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare const cvaSkeletonContainer: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaSkeletonContainer: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export declare const cvaSpacer: (props?: ({
|
|
2
2
|
border?: boolean | null | undefined;
|
|
3
3
|
size?: "small" | "medium" | "large" | null | undefined;
|
|
4
|
-
} & import("class-variance-authority/
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
export declare const cvaSpinner: (props?: ({
|
|
2
2
|
size?: "small" | "medium" | "large" | null | undefined;
|
|
3
3
|
mode?: "dark" | "light" | null | undefined;
|
|
4
|
-
} & import("class-variance-authority/
|
|
5
|
-
export declare const cvaSpinnerContainerInner: (props?: import("class-variance-authority/
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
|
+
export declare const cvaSpinnerContainerInner: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
6
6
|
export declare const cvaSpinnerContainer: (props?: ({
|
|
7
7
|
centering?: "centered" | "vertically" | "horizontally" | null | undefined;
|
|
8
8
|
mode?: "dark" | "light" | null | undefined;
|
|
9
|
-
} & import("class-variance-authority/
|
|
10
|
-
export declare const cvaSpinnerLabel: (props?: import("class-variance-authority/
|
|
9
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
10
|
+
export declare const cvaSpinnerLabel: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
export declare const cvaTabsRoot: (props?: import("class-variance-authority/
|
|
2
|
-
export declare const cvaTabList: (props?: import("class-variance-authority/
|
|
3
|
-
export declare const cvaTabContent: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaTabsRoot: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
|
+
export declare const cvaTabList: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
3
|
+
export declare const cvaTabContent: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
4
4
|
export declare const cvaTab: (props?: ({
|
|
5
5
|
isFullWidth?: boolean | null | undefined;
|
|
6
|
-
} & import("class-variance-authority/
|
|
6
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -5,12 +5,12 @@
|
|
|
5
5
|
export declare const TAG_TEXT_MIN_WIDTH_CLASS = "min-w-[80px]";
|
|
6
6
|
export declare const cvaTag: (props?: ({
|
|
7
7
|
size?: "small" | "medium" | null | undefined;
|
|
8
|
-
layout?: "
|
|
8
|
+
layout?: "containsDismiss" | "containsIcon" | "default" | null | undefined;
|
|
9
9
|
color?: "primary" | "neutral" | "black" | "white" | "info" | "success" | "warning" | "danger" | "good" | "low" | "critical" | "working" | "stopped" | "idle" | "unknown" | "moving" | "active" | "excessive_usage" | null | undefined;
|
|
10
10
|
border?: "default" | "none" | null | undefined;
|
|
11
|
-
} & import("class-variance-authority/
|
|
11
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
12
12
|
export declare const cvaTagText: (props?: ({
|
|
13
13
|
truncate?: boolean | null | undefined;
|
|
14
|
-
} & import("class-variance-authority/
|
|
15
|
-
export declare const cvaTagIconContainer: (props?: import("class-variance-authority/
|
|
16
|
-
export declare const cvaTagIcon: (props?: import("class-variance-authority/
|
|
14
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
15
|
+
export declare const cvaTagIconContainer: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
16
|
+
export declare const cvaTagIcon: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -8,4 +8,4 @@ export declare const cvaText: (props?: ({
|
|
|
8
8
|
inverted?: boolean | null | undefined;
|
|
9
9
|
subtle?: boolean | null | undefined;
|
|
10
10
|
disabled?: boolean | null | undefined;
|
|
11
|
-
} & import("class-variance-authority/
|
|
11
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,17 +1,17 @@
|
|
|
1
|
-
export declare const cvaToggleGroup: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaToggleGroup: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
2
|
export declare const cvaToggleItem: (props?: ({
|
|
3
3
|
selected?: boolean | null | undefined;
|
|
4
4
|
disabled?: boolean | null | undefined;
|
|
5
|
-
} & import("class-variance-authority/
|
|
5
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
6
6
|
export declare const cvaToggleGroupWithSlidingBackground: (props?: ({
|
|
7
7
|
isMounted?: boolean | null | undefined;
|
|
8
|
-
} & import("class-variance-authority/
|
|
8
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
9
9
|
export declare const cvaToggleItemText: (props?: ({
|
|
10
10
|
maxWidth?: "sm" | "md" | null | undefined;
|
|
11
11
|
selected?: boolean | null | undefined;
|
|
12
12
|
disabled?: boolean | null | undefined;
|
|
13
|
-
} & import("class-variance-authority/
|
|
13
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
14
14
|
export declare const cvaToggleItemContent: (props?: ({
|
|
15
15
|
selected?: boolean | null | undefined;
|
|
16
16
|
disabled?: boolean | null | undefined;
|
|
17
|
-
} & import("class-variance-authority/
|
|
17
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,12 +1,12 @@
|
|
|
1
1
|
export declare const cvaTooltipIcon: (props?: ({
|
|
2
2
|
color?: "light" | "dark" | null | undefined;
|
|
3
3
|
defaultVariants?: "color" | null | undefined;
|
|
4
|
-
} & import("class-variance-authority/
|
|
5
|
-
export declare const cvaTooltipPopover: (props?: import("class-variance-authority/
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
5
|
+
export declare const cvaTooltipPopover: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
6
6
|
export declare const cvaTooltipPopoverTail: (props?: ({
|
|
7
7
|
placement?: "top" | "top-start" | "top-end" | "bottom" | "bottom-start" | "bottom-end" | "left" | "left-start" | "left-end" | "right" | "right-start" | "right-end" | null | undefined;
|
|
8
8
|
mode?: "light" | "dark" | null | undefined;
|
|
9
|
-
} & import("class-variance-authority/
|
|
9
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
10
10
|
export declare const cvaTooltipPopoverContent: (props?: ({
|
|
11
11
|
color?: "light" | "dark" | null | undefined;
|
|
12
|
-
} & import("class-variance-authority/
|
|
12
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -16,10 +16,13 @@ export interface SegmentedValueBarProps extends CommonProps {
|
|
|
16
16
|
*/
|
|
17
17
|
readonly size?: SegmentedValueBarSize;
|
|
18
18
|
/**
|
|
19
|
-
* Show the sum of segment values
|
|
20
|
-
* Ignored when size is "extraSmall".
|
|
19
|
+
* Show the sum of segment values next to the bar. Ignored when size is "extraSmall".
|
|
21
20
|
*/
|
|
22
21
|
readonly showValue?: boolean;
|
|
22
|
+
/**
|
|
23
|
+
* Overrides the displayed value.
|
|
24
|
+
*/
|
|
25
|
+
readonly displayValue?: number;
|
|
23
26
|
/**
|
|
24
27
|
* Unit appended to the displayed value, e.g. "%", "h", "°C".
|
|
25
28
|
*/
|
|
@@ -32,9 +35,13 @@ export interface SegmentedValueBarProps extends CommonProps {
|
|
|
32
35
|
* Show a tooltip on hover with the individual segment value (and unit if provided). If a segment has a label, it is shown alongside the value.
|
|
33
36
|
*/
|
|
34
37
|
readonly showTooltip?: boolean;
|
|
38
|
+
/**
|
|
39
|
+
* Unit for tooltip values. Defaults to `unit`.
|
|
40
|
+
*/
|
|
41
|
+
readonly tooltipUnit?: string;
|
|
35
42
|
}
|
|
36
43
|
/**
|
|
37
44
|
* SegmentedValueBar displays multiple colored segments on a bar to visualize values relative to a total.
|
|
38
45
|
* Supports optional tooltips per segment, showing value and optionally a label.
|
|
39
46
|
*/
|
|
40
|
-
export declare const SegmentedValueBar: ({ segments, total, size, showValue, unit, valueColor, showTooltip, className, "data-testid": dataTestId, }: SegmentedValueBarProps) => ReactElement;
|
|
47
|
+
export declare const SegmentedValueBar: ({ segments, total, size, showValue, displayValue, unit, valueColor, showTooltip, tooltipUnit, className, "data-testid": dataTestId, }: SegmentedValueBarProps) => ReactElement;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export declare const cvaSegmentedValueBar: (props?: ({
|
|
2
2
|
size?: "extraSmall" | "small" | "large" | null | undefined;
|
|
3
|
-
} & import("class-variance-authority/
|
|
3
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
export declare const valueBarContainerClassName = "relative flex w-full items-center gap-2";
|
|
2
2
|
export declare const cvaValueBarText: (props?: ({
|
|
3
3
|
size?: "small" | "large" | null | undefined;
|
|
4
|
-
} & import("class-variance-authority/
|
|
4
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,3 +1,3 @@
|
|
|
1
1
|
export declare const cvaValueBar: (props?: ({
|
|
2
2
|
size?: "extraSmall" | "small" | "large" | null | undefined;
|
|
3
|
-
} & import("class-variance-authority/
|
|
3
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
export declare const cvaZStackContainer: (props?: import("class-variance-authority/
|
|
2
|
-
export declare const cvaZStackItem: (props?: import("class-variance-authority/
|
|
1
|
+
export declare const cvaZStackContainer: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
2
|
+
export declare const cvaZStackItem: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
@@ -5,15 +5,15 @@ export declare const cvaButton: (props?: ({
|
|
|
5
5
|
square?: boolean | null | undefined;
|
|
6
6
|
disabled?: boolean | null | undefined;
|
|
7
7
|
loading?: boolean | null | undefined;
|
|
8
|
-
} & import("class-variance-authority/
|
|
9
|
-
export declare const cvaButtonSpinnerContainer: (props?: import("class-variance-authority/
|
|
8
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
9
|
+
export declare const cvaButtonSpinnerContainer: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
|
|
10
10
|
export declare const cvaButtonSpinner: (props?: ({
|
|
11
11
|
variant?: "primary" | "primary-danger" | "secondary" | "secondary-danger" | "ghost" | "ghost-neutral" | "filled" | null | undefined;
|
|
12
|
-
} & import("class-variance-authority/
|
|
12
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
13
13
|
export declare const cvaButtonPrefixSuffix: (props?: ({
|
|
14
14
|
size?: "small" | "medium" | "large" | "extraSmall" | null | undefined;
|
|
15
15
|
variant?: "primary" | "primary-danger" | "secondary" | "secondary-danger" | "ghost" | "ghost-neutral" | "filled" | null | undefined;
|
|
16
|
-
} & import("class-variance-authority/
|
|
16
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|
|
17
17
|
export declare const cvaIconButton: (props?: ({
|
|
18
18
|
size?: "small" | "medium" | "large" | null | undefined;
|
|
19
|
-
} & import("class-variance-authority/
|
|
19
|
+
} & import("class-variance-authority/types").ClassProp) | undefined) => string;
|