@trackunit/react-filter-components 2.6.48 → 2.6.50-alpha-7317206cecd.0

package/index.cjs.js

@@ -6,7 +6,8 @@ var reactComponents = require('@trackunit/react-components');
 var reactFormComponents = require('@trackunit/react-form-components');
 var tailwindMerge = require('tailwind-merge');
 
-const cvaFilterCustomButton = cssClassVarianceUtilities.cvaMerge(["justify-normal"], {
+const cvaFilterCustomButton = cssClassVarianceUtilities.cva({
+    base: ["justify-normal"],
     variants: {
         isActive: {
             true: "border-primary-600",
@@ -58,7 +59,8 @@ const Filter = ({ title = "", asIcon = undefined, children, popoverProps, isActi
         // space is tight. Callers can still override via `popoverProps.sizing`.
         sizing: popoverProps?.sizing ?? { minWidth: 280 }, children: [jsxRuntime.jsx(reactComponents.PopoverTrigger, { children: renderButton() }), jsxRuntime.jsx(reactComponents.PopoverContent, { children: renderSubmenuContent() })] }));
 };
-const cvaMenuShellOverrides = cssClassVarianceUtilities.cvaMerge(["overflow-x-hidden", "relative", "!max-w-full", "p-0"], {
+const cvaMenuShellOverrides = cssClassVarianceUtilities.cva({
+    base: ["overflow-x-hidden", "relative", "!max-w-full", "p-0"],
     variants: {
         withStickyHeader: {
             // `grid-rows-[minmax(0,1fr)]` is the load-bearing part here: without it this shell's `max-h` only
@@ -71,7 +73,8 @@ const cvaMenuShellOverrides = cssClassVarianceUtilities.cvaMerge(["overflow-x-hi
         },
     },
 });
-const cvaMenuListOverrides = cssClassVarianceUtilities.cvaMerge([], {
+const cvaMenuListOverrides = cssClassVarianceUtilities.cva({
+    base: [],
     variants: {
         withStickyHeader: {
             // `gap-y-0` cancels `cvaMenuList`'s default inter-item gap: with the header (`FilterHeader`,
@@ -104,7 +107,8 @@ const FilterBody = ({ children, className, "data-testid": dataTestId, limitSize
     return (jsxRuntime.jsx("div", { className: cvaFilterBody({ limitSize, className }), ref: ref, style: style, ...rest, "data-testid": dataTestId, children: children }));
 };
 FilterBody.displayName = "FilterBody";
-const cvaFilterBody = cssClassVarianceUtilities.cvaMerge(["grid", "gap-1", "w-full"], {
+const cvaFilterBody = cssClassVarianceUtilities.cva({
+    base: ["grid", "gap-1", "w-full"],
     variants: {
         limitSize: {
             true: "max-h-[50dvh] max-w-sm overflow-hidden",
@@ -126,7 +130,7 @@ const cvaFilterBody = cssClassVarianceUtilities.cvaMerge(["grid", "gap-1", "w-fu
 const FilterFooter = ({ className, "data-testid": dataTestId, children, ref, style, ...rest }) => {
     return (jsxRuntime.jsx("div", { className: cvaFilterFooter({ className }), "data-testid": dataTestId, ref: ref, style: style, ...rest, children: children }));
 };
-const cvaFilterFooter = cssClassVarianceUtilities.cvaMerge(["flex", "justify-end", "border-t", "border-neutral-200", "p-1"]);
+const cvaFilterFooter = cssClassVarianceUtilities.cva({ base: ["flex", "justify-end", "border-t", "border-neutral-200", "p-1"] });
 
 /**
  * The FilterHeader component is used to display the title of the filter and a reset button.
@@ -141,7 +145,8 @@ const FilterHeader = ({ "data-testid": dataTestId, title, resetLabel, showReset,
                                             // eslint-disable-next-line @trackunit/prefer-event-specific-callback-naming
                                             onClick: onReset, size: "small", variant: "ghost", children: resetLabel })) })] })] }) }), jsxRuntime.jsx("hr", { className: "w-full border-neutral-200" })] })) : null }));
 };
-const cvaFilterHeaderButton = cssClassVarianceUtilities.cvaMerge([], {
+const cvaFilterHeaderButton = cssClassVarianceUtilities.cva({
+    base: [],
     variants: {
         isVisible: {
             true: "visible",

package/index.esm.js

@@ -1,10 +1,11 @@
 import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
-import { cvaMerge } from '@trackunit/css-class-variance-utilities';
+import { cva } from '@trackunit/css-class-variance-utilities';
 import { MenuItem, Badge, Icon, Popover, PopoverTrigger, PopoverContent, MenuContent, IconButton, Button, Spinner, cvaMenuItemSuffix, cvaInteractableItem } from '@trackunit/react-components';
 import { Checkbox, useRadioItemChecked, RadioItem } from '@trackunit/react-form-components';
 import { twMerge } from 'tailwind-merge';
 
-const cvaFilterCustomButton = cvaMerge(["justify-normal"], {
+const cvaFilterCustomButton = cva({
+    base: ["justify-normal"],
     variants: {
         isActive: {
             true: "border-primary-600",
@@ -56,7 +57,8 @@ const Filter = ({ title = "", asIcon = undefined, children, popoverProps, isActi
         // space is tight. Callers can still override via `popoverProps.sizing`.
         sizing: popoverProps?.sizing ?? { minWidth: 280 }, children: [jsx(PopoverTrigger, { children: renderButton() }), jsx(PopoverContent, { children: renderSubmenuContent() })] }));
 };
-const cvaMenuShellOverrides = cvaMerge(["overflow-x-hidden", "relative", "!max-w-full", "p-0"], {
+const cvaMenuShellOverrides = cva({
+    base: ["overflow-x-hidden", "relative", "!max-w-full", "p-0"],
     variants: {
         withStickyHeader: {
             // `grid-rows-[minmax(0,1fr)]` is the load-bearing part here: without it this shell's `max-h` only
@@ -69,7 +71,8 @@ const cvaMenuShellOverrides = cvaMerge(["overflow-x-hidden", "relative", "!max-w
         },
     },
 });
-const cvaMenuListOverrides = cvaMerge([], {
+const cvaMenuListOverrides = cva({
+    base: [],
     variants: {
         withStickyHeader: {
             // `gap-y-0` cancels `cvaMenuList`'s default inter-item gap: with the header (`FilterHeader`,
@@ -102,7 +105,8 @@ const FilterBody = ({ children, className, "data-testid": dataTestId, limitSize
     return (jsx("div", { className: cvaFilterBody({ limitSize, className }), ref: ref, style: style, ...rest, "data-testid": dataTestId, children: children }));
 };
 FilterBody.displayName = "FilterBody";
-const cvaFilterBody = cvaMerge(["grid", "gap-1", "w-full"], {
+const cvaFilterBody = cva({
+    base: ["grid", "gap-1", "w-full"],
     variants: {
         limitSize: {
             true: "max-h-[50dvh] max-w-sm overflow-hidden",
@@ -124,7 +128,7 @@ const cvaFilterBody = cvaMerge(["grid", "gap-1", "w-full"], {
 const FilterFooter = ({ className, "data-testid": dataTestId, children, ref, style, ...rest }) => {
     return (jsx("div", { className: cvaFilterFooter({ className }), "data-testid": dataTestId, ref: ref, style: style, ...rest, children: children }));
 };
-const cvaFilterFooter = cvaMerge(["flex", "justify-end", "border-t", "border-neutral-200", "p-1"]);
+const cvaFilterFooter = cva({ base: ["flex", "justify-end", "border-t", "border-neutral-200", "p-1"] });
 
 /**
  * The FilterHeader component is used to display the title of the filter and a reset button.
@@ -139,7 +143,8 @@ const FilterHeader = ({ "data-testid": dataTestId, title, resetLabel, showReset,
                                             // eslint-disable-next-line @trackunit/prefer-event-specific-callback-naming
                                             onClick: onReset, size: "small", variant: "ghost", children: resetLabel })) })] })] }) }), jsx("hr", { className: "w-full border-neutral-200" })] })) : null }));
 };
-const cvaFilterHeaderButton = cvaMerge([], {
+const cvaFilterHeaderButton = cva({
+    base: [],
     variants: {
         isVisible: {
             true: "visible",

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@trackunit/react-filter-components",
-  "version": "2.6.48",
+  "version": "2.6.50-alpha-7317206cecd.0",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "engines": {
@@ -8,10 +8,10 @@
   },
   "dependencies": {
     "tailwind-merge": "^2.0.0",
-    "@trackunit/ui-icons": "1.14.28",
-    "@trackunit/css-class-variance-utilities": "1.14.29",
-    "@trackunit/react-components": "2.13.0",
-    "@trackunit/react-form-components": "2.6.48"
+    "@trackunit/ui-icons": "1.14.30-alpha-7317206cecd.0",
+    "@trackunit/css-class-variance-utilities": "2.0.1-alpha-7317206cecd.0",
+    "@trackunit/react-components": "2.13.2-alpha-7317206cecd.0",
+    "@trackunit/react-form-components": "2.6.50-alpha-7317206cecd.0"
   },
   "peerDependencies": {
     "@tanstack/react-router": "^1.114.29",

package/src/Filter/Filter.variants.d.ts

@@ -1,3 +1,27 @@
-export declare const cvaFilterCustomButton: (props?: ({
-    isActive?: boolean | null | undefined;
-} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const cvaFilterCustomButton: import("cva").CVAComponent<Omit<{
+    base: string[];
+    variants: {
+        isActive: {
+            true: string;
+            false: string;
+        };
+    };
+    defaultVariants: {
+        isActive: false;
+    };
+}, "defaultVariants"> & {
+    variants: {
+        isActive: {
+            true: string;
+            false: string;
+        };
+    };
+    defaultVariants: Omit<{}, "isActive"> & {
+        isActive: false;
+    };
+}, {
+    isActive: {
+        true: string;
+        false: string;
+    };
+}>;

package/src/FilterFooter/FilterFooter.d.ts

@@ -14,4 +14,9 @@ export interface FilterFooterProps extends CommonProps, Refable<HTMLDivElement>,
  * @returns {ReactElement} FilterFooter component
  */
 export declare const FilterFooter: ({ className, "data-testid": dataTestId, children, ref, style, ...rest }: FilterFooterProps) => import("react/jsx-runtime").JSX.Element;
-export declare const cvaFilterFooter: (props?: import("class-variance-authority/types").ClassProp | undefined) => string;
+export declare const cvaFilterFooter: import("cva").CVAComponent<Omit<{
+    base: string[];
+}, "defaultVariants"> & {
+    variants: unknown;
+    defaultVariants: Omit<{}, never>;
+}, unknown>;

package/src/FilterHeader/FilterHeader.d.ts

@@ -37,6 +37,30 @@ export interface FilterHeaderProps extends CommonProps, Refable<HTMLDivElement>,
  * @returns {ReactElement} FilterHeader component
  */
 export declare const FilterHeader: ({ "data-testid": dataTestId, title, resetLabel, showReset, onReset, loading, children, searchComponent, className, ref, style, ...rest }: FilterHeaderProps) => ReactElement;
-export declare const cvaFilterHeaderButton: (props?: ({
-    isVisible?: boolean | null | undefined;
-} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export declare const cvaFilterHeaderButton: import("cva").CVAComponent<Omit<{
+    base: never[];
+    variants: {
+        isVisible: {
+            true: string;
+            false: string;
+        };
+    };
+    defaultVariants: {
+        isVisible: true;
+    };
+}, "defaultVariants"> & {
+    variants: {
+        isVisible: {
+            true: string;
+            false: string;
+        };
+    };
+    defaultVariants: Omit<{}, "isVisible"> & {
+        isVisible: true;
+    };
+}, {
+    isVisible: {
+        true: string;
+        false: string;
+    };
+}>;