@trackunit/react-components 0.1.372 → 0.1.374
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
|
@@ -520,6 +520,7 @@ const cvaButton = cssClassVarianceUtilities.cvaMerge([
|
|
|
520
520
|
"disabled:text-slate-200",
|
|
521
521
|
],
|
|
522
522
|
secondary: [
|
|
523
|
+
"group",
|
|
523
524
|
"bg-white",
|
|
524
525
|
"border",
|
|
525
526
|
"border-slate-300",
|
|
@@ -556,6 +557,7 @@ const cvaButton = cssClassVarianceUtilities.cvaMerge([
|
|
|
556
557
|
"disabled:text-slate-400",
|
|
557
558
|
],
|
|
558
559
|
"ghost-neutral": [
|
|
560
|
+
"group",
|
|
559
561
|
"bg-transparent",
|
|
560
562
|
"text-slate-600",
|
|
561
563
|
"hover:bg-black/5",
|
|
@@ -684,9 +686,18 @@ const cvaButtonPrefixSuffix = cssClassVarianceUtilities.cvaMerge(["flex", "items
|
|
|
684
686
|
medium: ["h-4"],
|
|
685
687
|
large: ["h-5"],
|
|
686
688
|
},
|
|
689
|
+
variant: {
|
|
690
|
+
primary: [],
|
|
691
|
+
"primary-danger": [],
|
|
692
|
+
secondary: ["text-secondary-400", "group-focus:text-secondary-400", "group-hover:text-secondary-500", "group-active:text-secondary-600"],
|
|
693
|
+
"secondary-danger": [],
|
|
694
|
+
ghost: [],
|
|
695
|
+
"ghost-neutral": ["text-secondary-400", "group-focus:text-secondary-400", "group-hover:text-secondary-500", "group-active:text-secondary-600"],
|
|
696
|
+
}
|
|
687
697
|
},
|
|
688
698
|
defaultVariants: {
|
|
689
699
|
size: "medium",
|
|
700
|
+
variant: "primary",
|
|
690
701
|
},
|
|
691
702
|
});
|
|
692
703
|
const cvaIconButton = cssClassVarianceUtilities.cvaMerge([], {
|
|
@@ -726,7 +737,7 @@ const Button = React__namespace.forwardRef((_a, ref) => {
|
|
|
726
737
|
disabled: disabled || loading,
|
|
727
738
|
type,
|
|
728
739
|
};
|
|
729
|
-
return (jsxRuntime.jsxs(Comp, Object.assign({}, sharedCompProps, (asChild ? {} : buttonSpecificProps), { children: [loading ? (jsxRuntime.jsx(Spinner, { centering: "vertically", className: cvaButtonSpinner({ variant }), containerClassName: cvaButtonSpinnerContainer(), size: "small" })) : null, prefix && !loading ? jsxRuntime.jsx("div", { className: cvaButtonPrefixSuffix({ size
|
|
740
|
+
return (jsxRuntime.jsxs(Comp, Object.assign({}, sharedCompProps, (asChild ? {} : buttonSpecificProps), { children: [loading ? (jsxRuntime.jsx(Spinner, { centering: "vertically", className: cvaButtonSpinner({ variant }), containerClassName: cvaButtonSpinnerContainer(), size: "small" })) : null, prefix && !loading ? jsxRuntime.jsx("div", { className: cvaButtonPrefixSuffix({ size, variant }), children: prefix }) : null, jsxRuntime.jsx(reactSlot.Slottable, { children: children }), suffix && !loading ? jsxRuntime.jsx("div", { className: cvaButtonPrefixSuffix({ size, variant }), children: suffix }) : null] })));
|
|
730
741
|
});
|
|
731
742
|
Button.displayName = "Button";
|
|
732
743
|
|
package/index.esm.js
CHANGED
|
@@ -489,6 +489,7 @@ const cvaButton = cvaMerge([
|
|
|
489
489
|
"disabled:text-slate-200",
|
|
490
490
|
],
|
|
491
491
|
secondary: [
|
|
492
|
+
"group",
|
|
492
493
|
"bg-white",
|
|
493
494
|
"border",
|
|
494
495
|
"border-slate-300",
|
|
@@ -525,6 +526,7 @@ const cvaButton = cvaMerge([
|
|
|
525
526
|
"disabled:text-slate-400",
|
|
526
527
|
],
|
|
527
528
|
"ghost-neutral": [
|
|
529
|
+
"group",
|
|
528
530
|
"bg-transparent",
|
|
529
531
|
"text-slate-600",
|
|
530
532
|
"hover:bg-black/5",
|
|
@@ -653,9 +655,18 @@ const cvaButtonPrefixSuffix = cvaMerge(["flex", "items-center"], {
|
|
|
653
655
|
medium: ["h-4"],
|
|
654
656
|
large: ["h-5"],
|
|
655
657
|
},
|
|
658
|
+
variant: {
|
|
659
|
+
primary: [],
|
|
660
|
+
"primary-danger": [],
|
|
661
|
+
secondary: ["text-secondary-400", "group-focus:text-secondary-400", "group-hover:text-secondary-500", "group-active:text-secondary-600"],
|
|
662
|
+
"secondary-danger": [],
|
|
663
|
+
ghost: [],
|
|
664
|
+
"ghost-neutral": ["text-secondary-400", "group-focus:text-secondary-400", "group-hover:text-secondary-500", "group-active:text-secondary-600"],
|
|
665
|
+
}
|
|
656
666
|
},
|
|
657
667
|
defaultVariants: {
|
|
658
668
|
size: "medium",
|
|
669
|
+
variant: "primary",
|
|
659
670
|
},
|
|
660
671
|
});
|
|
661
672
|
const cvaIconButton = cvaMerge([], {
|
|
@@ -695,7 +706,7 @@ const Button = React.forwardRef((_a, ref) => {
|
|
|
695
706
|
disabled: disabled || loading,
|
|
696
707
|
type,
|
|
697
708
|
};
|
|
698
|
-
return (jsxs(Comp, Object.assign({}, sharedCompProps, (asChild ? {} : buttonSpecificProps), { children: [loading ? (jsx(Spinner, { centering: "vertically", className: cvaButtonSpinner({ variant }), containerClassName: cvaButtonSpinnerContainer(), size: "small" })) : null, prefix && !loading ? jsx("div", { className: cvaButtonPrefixSuffix({ size
|
|
709
|
+
return (jsxs(Comp, Object.assign({}, sharedCompProps, (asChild ? {} : buttonSpecificProps), { children: [loading ? (jsx(Spinner, { centering: "vertically", className: cvaButtonSpinner({ variant }), containerClassName: cvaButtonSpinnerContainer(), size: "small" })) : null, prefix && !loading ? jsx("div", { className: cvaButtonPrefixSuffix({ size, variant }), children: prefix }) : null, jsx(Slottable, { children: children }), suffix && !loading ? jsx("div", { className: cvaButtonPrefixSuffix({ size, variant }), children: suffix }) : null] })));
|
|
699
710
|
});
|
|
700
711
|
Button.displayName = "Button";
|
|
701
712
|
|
package/package.json
CHANGED
|
@@ -13,6 +13,7 @@ export declare const cvaButtonSpinner: (props?: ({
|
|
|
13
13
|
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
|
14
14
|
export declare const cvaButtonPrefixSuffix: (props?: ({
|
|
15
15
|
size?: "small" | "medium" | "large" | null | undefined;
|
|
16
|
+
variant?: "primary" | "primary-danger" | "secondary" | "secondary-danger" | "ghost" | "ghost-neutral" | null | undefined;
|
|
16
17
|
} & import("class-variance-authority/dist/types").ClassProp) | undefined) => string;
|
|
17
18
|
export declare const cvaIconButton: (props?: ({
|
|
18
19
|
size?: "small" | "medium" | "large" | null | undefined;
|