@trackunit/react-components 0.1.254 → 0.1.256-alpha-d54f3828a2.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
CHANGED
|
@@ -1081,7 +1081,7 @@ const cvaCollapseAnimated = cssClassVarianceUtilities.cvaMerge(["overflow-y-hidd
|
|
|
1081
1081
|
* @param {CollapseProps} props - The props for the Collapse component
|
|
1082
1082
|
* @returns {JSX.Element} Collapse component
|
|
1083
1083
|
*/
|
|
1084
|
-
const Collapse = ({ id, initialExpanded = false, onToggle, label, children, className, headerAddon, dataTestId, }) => {
|
|
1084
|
+
const Collapse = ({ id, initialExpanded = false, onToggle, label, children, className, headerClassName, headerAddon, dataTestId, }) => {
|
|
1085
1085
|
const [expanded, setExpanded] = React__namespace.useState(initialExpanded);
|
|
1086
1086
|
const handleClick = React__namespace.useCallback((e) => {
|
|
1087
1087
|
if (onToggle) {
|
|
@@ -1089,7 +1089,7 @@ const Collapse = ({ id, initialExpanded = false, onToggle, label, children, clas
|
|
|
1089
1089
|
}
|
|
1090
1090
|
setExpanded(!expanded);
|
|
1091
1091
|
}, [expanded, onToggle]);
|
|
1092
|
-
return (jsxRuntime.jsxs("div", { className: cvaCollapse({ className }), "data-testid": dataTestId, children: [jsxRuntime.jsxs("div", { className: cvaCollapseHeader({ expanded }), role: "button", "aria-expanded": expanded, "aria-controls": id, onClick: handleClick, children: [jsxRuntime.jsxs("div", { className: cvaCollapseLabelContainer(), children: [jsxRuntime.jsx(Text, { type: "span", weight: "bold", children: label }), jsxRuntime.jsx(IconButton, { icon: jsxRuntime.jsx(Icon, { name: "ChevronUpDown", size: "small" }), size: "medium", variant: "ghost-neutral" })] }), headerAddon ? headerAddon : null] }), jsxRuntime.jsx(Collapsible, { expanded: expanded, id: id, children: children })] }));
|
|
1092
|
+
return (jsxRuntime.jsxs("div", { className: cvaCollapse({ className }), "data-testid": dataTestId, children: [jsxRuntime.jsxs("div", { className: cvaCollapseHeader({ expanded, className: headerClassName }), role: "button", "aria-expanded": expanded, "aria-controls": id, onClick: handleClick, children: [jsxRuntime.jsxs("div", { className: cvaCollapseLabelContainer(), children: [jsxRuntime.jsx(Text, { type: "span", weight: "bold", children: label }), jsxRuntime.jsx(IconButton, { icon: jsxRuntime.jsx(Icon, { name: "ChevronUpDown", size: "small" }), size: "medium", variant: "ghost-neutral" })] }), headerAddon ? headerAddon : null] }), jsxRuntime.jsx(Collapsible, { expanded: expanded, id: id, children: children })] }));
|
|
1093
1093
|
};
|
|
1094
1094
|
const Collapsible = ({ children, expanded, id }) => {
|
|
1095
1095
|
const [ref, { height }] = reactUse.useMeasure();
|
|
@@ -1374,7 +1374,7 @@ const ExternalLink = ({ rel = "noreferrer", target = "_blank", href, className,
|
|
|
1374
1374
|
* It should not be used directly, but rather through the Popover component.
|
|
1375
1375
|
*
|
|
1376
1376
|
* @param {PopoverProps} options The options for the popover
|
|
1377
|
-
* @returns {ReturnType<usePopover>} The data for the popover
|
|
1377
|
+
* @returns {ReturnType<typeof usePopover>} The data for the popover
|
|
1378
1378
|
*/
|
|
1379
1379
|
const usePopover = (_a) => {
|
|
1380
1380
|
var { initialOpen = false, placement = "bottom", isModal, isOpen: controlledIsOpen, activation = { click: true, hover: false }, dismissal, onOpenStateChange } = _a, restOptions = __rest(_a, ["initialOpen", "placement", "isModal", "isOpen", "activation", "dismissal", "onOpenStateChange"]);
|
package/index.esm.js
CHANGED
|
@@ -1050,7 +1050,7 @@ const cvaCollapseAnimated = cvaMerge(["overflow-y-hidden", "transition-all"]);
|
|
|
1050
1050
|
* @param {CollapseProps} props - The props for the Collapse component
|
|
1051
1051
|
* @returns {JSX.Element} Collapse component
|
|
1052
1052
|
*/
|
|
1053
|
-
const Collapse = ({ id, initialExpanded = false, onToggle, label, children, className, headerAddon, dataTestId, }) => {
|
|
1053
|
+
const Collapse = ({ id, initialExpanded = false, onToggle, label, children, className, headerClassName, headerAddon, dataTestId, }) => {
|
|
1054
1054
|
const [expanded, setExpanded] = React.useState(initialExpanded);
|
|
1055
1055
|
const handleClick = React.useCallback((e) => {
|
|
1056
1056
|
if (onToggle) {
|
|
@@ -1058,7 +1058,7 @@ const Collapse = ({ id, initialExpanded = false, onToggle, label, children, clas
|
|
|
1058
1058
|
}
|
|
1059
1059
|
setExpanded(!expanded);
|
|
1060
1060
|
}, [expanded, onToggle]);
|
|
1061
|
-
return (jsxs("div", { className: cvaCollapse({ className }), "data-testid": dataTestId, children: [jsxs("div", { className: cvaCollapseHeader({ expanded }), role: "button", "aria-expanded": expanded, "aria-controls": id, onClick: handleClick, children: [jsxs("div", { className: cvaCollapseLabelContainer(), children: [jsx(Text, { type: "span", weight: "bold", children: label }), jsx(IconButton, { icon: jsx(Icon, { name: "ChevronUpDown", size: "small" }), size: "medium", variant: "ghost-neutral" })] }), headerAddon ? headerAddon : null] }), jsx(Collapsible, { expanded: expanded, id: id, children: children })] }));
|
|
1061
|
+
return (jsxs("div", { className: cvaCollapse({ className }), "data-testid": dataTestId, children: [jsxs("div", { className: cvaCollapseHeader({ expanded, className: headerClassName }), role: "button", "aria-expanded": expanded, "aria-controls": id, onClick: handleClick, children: [jsxs("div", { className: cvaCollapseLabelContainer(), children: [jsx(Text, { type: "span", weight: "bold", children: label }), jsx(IconButton, { icon: jsx(Icon, { name: "ChevronUpDown", size: "small" }), size: "medium", variant: "ghost-neutral" })] }), headerAddon ? headerAddon : null] }), jsx(Collapsible, { expanded: expanded, id: id, children: children })] }));
|
|
1062
1062
|
};
|
|
1063
1063
|
const Collapsible = ({ children, expanded, id }) => {
|
|
1064
1064
|
const [ref, { height }] = useMeasure();
|
|
@@ -1343,7 +1343,7 @@ const ExternalLink = ({ rel = "noreferrer", target = "_blank", href, className,
|
|
|
1343
1343
|
* It should not be used directly, but rather through the Popover component.
|
|
1344
1344
|
*
|
|
1345
1345
|
* @param {PopoverProps} options The options for the popover
|
|
1346
|
-
* @returns {ReturnType<usePopover>} The data for the popover
|
|
1346
|
+
* @returns {ReturnType<typeof usePopover>} The data for the popover
|
|
1347
1347
|
*/
|
|
1348
1348
|
const usePopover = (_a) => {
|
|
1349
1349
|
var { initialOpen = false, placement = "bottom", isModal, isOpen: controlledIsOpen, activation = { click: true, hover: false }, dismissal, onOpenStateChange } = _a, restOptions = __rest(_a, ["initialOpen", "placement", "isModal", "isOpen", "activation", "dismissal", "onOpenStateChange"]);
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@trackunit/react-components",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.256-alpha-d54f3828a2.0",
|
|
4
4
|
"repository": "https://github.com/Trackunit/manager",
|
|
5
5
|
"license": "SEE LICENSE IN LICENSE.txt",
|
|
6
6
|
"engines": {
|
|
@@ -13,7 +13,7 @@
|
|
|
13
13
|
"react-use": "^17.4.0",
|
|
14
14
|
"react-day-picker": "^8.9.1",
|
|
15
15
|
"date-fns": "^2.30.0",
|
|
16
|
-
"@floating-ui/react": "^0.26.
|
|
16
|
+
"@floating-ui/react": "^0.26.6",
|
|
17
17
|
"@radix-ui/react-tabs": "^1.0.4",
|
|
18
18
|
"@trackunit/ui-icons": "*",
|
|
19
19
|
"@trackunit/shared-utils": "*",
|
|
@@ -6,6 +6,10 @@ export interface CollapseProps extends CommonProps {
|
|
|
6
6
|
* Expands the collapse component during initialization.
|
|
7
7
|
*/
|
|
8
8
|
initialExpanded?: boolean;
|
|
9
|
+
/**
|
|
10
|
+
* Class name for the header.
|
|
11
|
+
*/
|
|
12
|
+
headerClassName?: string;
|
|
9
13
|
/**
|
|
10
14
|
* onToggle event.
|
|
11
15
|
*/
|
|
@@ -30,4 +34,4 @@ export interface CollapseProps extends CommonProps {
|
|
|
30
34
|
* @param {CollapseProps} props - The props for the Collapse component
|
|
31
35
|
* @returns {JSX.Element} Collapse component
|
|
32
36
|
*/
|
|
33
|
-
export declare const Collapse: ({ id, initialExpanded, onToggle, label, children, className, headerAddon, dataTestId, }: CollapseProps) => JSX.Element;
|
|
37
|
+
export declare const Collapse: ({ id, initialExpanded, onToggle, label, children, className, headerClassName, headerAddon, dataTestId, }: CollapseProps) => JSX.Element;
|
|
@@ -4,6 +4,6 @@ import { PopoverProps, UsePopoverType } from "./PopoverTypes";
|
|
|
4
4
|
* It should not be used directly, but rather through the Popover component.
|
|
5
5
|
*
|
|
6
6
|
* @param {PopoverProps} options The options for the popover
|
|
7
|
-
* @returns {ReturnType<usePopover>} The data for the popover
|
|
7
|
+
* @returns {ReturnType<typeof usePopover>} The data for the popover
|
|
8
8
|
*/
|
|
9
9
|
export declare const usePopover: ({ initialOpen, placement, isModal, isOpen: controlledIsOpen, activation, dismissal, onOpenStateChange, ...restOptions }: PopoverProps) => UsePopoverType;
|