@trackunit/react-filter-components 0.0.7 → 0.0.11

package/index.js

@@ -43,9 +43,9 @@ function __rest(s, e) {
  * @returns {JSX.Element} Filter component
  */
 const Filter = (_a) => {
-    var { title, children, popoverProps, isActive, activeLabel, menuListProps, className, dataTestId, withStickyHeader = false } = _a, rest = __rest(_a, ["title", "children", "popoverProps", "isActive", "activeLabel", "menuListProps", "className", "dataTestId", "withStickyHeader"]);
+    var { title, children, popoverProps, isActive, activeLabel, menuListProps, className, dataTestId, withStickyHeader = false, readOnly } = _a, rest = __rest(_a, ["title", "children", "popoverProps", "isActive", "activeLabel", "menuListProps", "className", "dataTestId", "withStickyHeader", "readOnly"]);
     const buttonProps = Object.assign({}, rest);
-    return (jsx(Popover, Object.assign({ dataTestId: `${dataTestId}-popover`, placement: "bottom-start" }, popoverProps, { render: () => (jsx(CustomMenuList, Object.assign({ withStickyHeader: withStickyHeader, dataTestId: `${dataTestId}-menulist` }, menuListProps, { children: children }))) }, { children: jsxs(CustomButton, Object.assign({ color: "tertiary", size: "small", dataTestId: dataTestId }, buttonProps, { "$isActive": isActive, className: className }, { children: [title, " ", isActive && jsx(ActiveLabel, { children: activeLabel })] })) })));
+    return (jsx(Popover, Object.assign({ dataTestId: dataTestId && `${dataTestId}-popover`, placement: "bottom-start" }, popoverProps, { render: () => (jsx(CustomMenuList, Object.assign({ withStickyHeader: withStickyHeader, dataTestId: dataTestId && `${dataTestId}-menulist` }, menuListProps, { children: children }))) }, { children: jsxs(CustomButton, Object.assign({ color: "tertiary", size: "small", dataTestId: dataTestId, disabled: readOnly }, buttonProps, { "$isActive": isActive, className: className }, { children: [title, " ", isActive && jsx(ActiveLabel, { children: activeLabel })] })) })));
 };
 const CustomButton = twx(Button) `
   ${({ $isActive }) => ($isActive ? tws `!border-primary-600` : "")}
@@ -75,7 +75,7 @@ const FilterItem = (_a) => {
             var _a;
             e.preventDefault();
             (_a = checkboxRef.current) === null || _a === void 0 ? void 0 : _a.click();
-        }, selected: checkboxProps.checked, disabled: checkboxProps.disabled, className: `${className} overflow-hidden`, dataTestId: dataTestId, prefix: prefix }, menuItemProps, { suffix: jsx("small", { children: itemCount }) }, { children: jsx(Checkbox, Object.assign({ ref: checkboxRef }, checkboxProps, { dataTestId: `${dataTestId}-checkbox`, className: "flex-grow cursor-pointer" })) })));
+        }, selected: checkboxProps.checked, disabled: checkboxProps.disabled, className: `${className} overflow-hidden`, dataTestId: dataTestId, prefix: prefix }, menuItemProps, { suffix: jsx("small", { children: itemCount }) }, { children: jsx(Checkbox, Object.assign({ ref: checkboxRef }, checkboxProps, { dataTestId: dataTestId && `${dataTestId}-checkbox`, className: "flex-grow cursor-pointer" })) })));
 };
 
 /**

package/package.json

@@ -1,10 +1,10 @@
 {
   "name": "@trackunit/react-filter-components",
-  "version": "0.0.7",
+  "version": "0.0.11",
   "repository": "https://github.com/Trackunit/manager",
   "license": "SEE LICENSE IN LICENSE.txt",
   "dependencies": {
-    "@trackunit/react-components": "0.1.28",
+    "@trackunit/react-components": "0.1.31",
     "react": "18.2.0",
     "@trackunit/tailwind-styled-components": "0.0.51",
     "jest-canvas-mock": "2.4.0"

package/src/Filter/Filter.d.ts

@@ -34,6 +34,10 @@ export interface FilterProps extends ButtonProps {
      * The render prop cannot be overridden.
      */
     menuListProps?: Omit<MenuListProps, "children">;
+    /**
+     * A flag to set a filter component into readonly mode used for presenting filtering rules that cannot be change by user
+     */
+    readOnly?: boolean;
 }
 /**
  * The Filter component is the base component used in the manager to filter data.
@@ -47,4 +51,4 @@ export interface FilterProps extends ButtonProps {
  * @param {FilterProps} props - The props for the Filter component
  * @returns {JSX.Element} Filter component
  */
-export declare const Filter: ({ title, children, popoverProps, isActive, activeLabel, menuListProps, className, dataTestId, withStickyHeader, ...rest }: FilterProps) => JSX.Element;
+export declare const Filter: ({ title, children, popoverProps, isActive, activeLabel, menuListProps, className, dataTestId, withStickyHeader, readOnly, ...rest }: FilterProps) => JSX.Element;