@c-rex/components 0.3.0-build.38 → 0.3.0-build.39

package/package.json

@@ -1,6 +1,6 @@
 {
     "name":  "@c-rex/components",
-    "version":  "0.3.0-build.38",
+    "version":  "0.3.0-build.39",
     "files":  [
                   "src"
               ],

package/src/restriction-menu/restriction-menu-item.tsx

@@ -15,6 +15,7 @@ type Props = {
     removeRestrictParam?: boolean;
     selected?: boolean;
     onClick?: () => void;
+    multipleSelection?: boolean;
 };
 
 export const RestrictionNavigationItem: FC<Props> = ({
@@ -23,6 +24,7 @@ export const RestrictionNavigationItem: FC<Props> = ({
     restrictField,
     removeRestrictParam = false,
     selected = false,
+    multipleSelection = true,
 }) => {
     const [restrict, setRestrict] = useQueryState("restrict", {
         shallow: false,
@@ -35,6 +37,7 @@ export const RestrictionNavigationItem: FC<Props> = ({
         restrictField,
         removeRestrictParam,
         selected,
+        multipleSelection,
         currentRestrict: restrict,
     });
 
@@ -72,6 +75,7 @@ export const RestrictionDropdownItem: FC<Props> = ({
     restrictField,
     selected = false,
     onClick,
+    multipleSelection = true
 }) => {
     const [restrict, setRestrict] = useQueryState("restrict", {
         shallow: false,
@@ -83,6 +87,7 @@ export const RestrictionDropdownItem: FC<Props> = ({
         shortId,
         restrictField,
         selected,
+        multipleSelection,
         currentRestrict: restrict,
     });
 
@@ -121,7 +126,7 @@ function getRestrictionValue({
     restrictField,
     removeRestrictParam = false,
     selected = false,
-
+    multipleSelection = true,
     currentRestrict,
 }: {
     shortId?: string;
@@ -129,11 +134,12 @@ function getRestrictionValue({
     removeRestrictParam?: boolean;
     selected?: boolean;
     currentRestrict: string | null;
+    multipleSelection?: boolean;
 }): { restrictionValue: string | null; shouldRemoveRestrictParam: boolean } {
     let restrictParam = "";
     let shouldRemoveRestrictParam = removeRestrictParam;
 
-    if (currentRestrict) {
+    if (currentRestrict && multipleSelection) {
         if (selected) {
             const restrictionsLength = currentRestrict.split(",").length;
             //if there is only one restriction, we can remove the whole restrict param

package/src/restriction-menu/restriction-selection-command-menu.tsx

@@ -29,7 +29,6 @@ type Props = {
     hasMoreItems?: boolean,
     showAllWhenEmpty?: boolean,
     onRequestMore?: () => void,
-    stripLabelPrefix?: string,
     itemsByRow?: {
         [DEVICE_OPTIONS.MOBILE]: number,
         [DEVICE_OPTIONS.TABLET]: number,
@@ -264,7 +263,6 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
     hasMoreItems = false,
     showAllWhenEmpty = true,
     onRequestMore,
-    stripLabelPrefix,
     navigationMenuListClassName = "items-center justify-start gap-4 flex-row",
     itemsByRow = {
         [DEVICE_OPTIONS.MOBILE]: 2,
@@ -274,9 +272,6 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
 }) => {
     const t = useTranslations();
     const setRestrictionList = useRestrictionStore((state) => state.setRestrictionList);
-    const formatLabel = stripLabelPrefix
-        ? (label: string) => label.replace(new RegExp(`^${stripLabelPrefix}`, "i"), "")
-        : undefined;
 
     const [params] = useQueryStates({
         restrict: parseAsString,
@@ -373,7 +368,7 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
 
                 {!enableHierarchy && visibleItems.map((item) => {
                     const rawLabel = getLabelByLang(item.labels, lang);
-                    const label = rawLabel && formatLabel ? formatLabel(rawLabel) : rawLabel;
+                    const label = rawLabel
                     return (
                         <RestrictionNavigationItem
                             key={item.shortId}
@@ -389,7 +384,7 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
                     const shortId = rootNode.item.shortId || "";
                     const hasChildren = rootNode.children.length > 0;
                     const rawLabel = getLabelByLang(rootNode.item.labels, lang);
-                    const label = rawLabel && formatLabel ? formatLabel(rawLabel) : rawLabel;
+                    const label = rawLabel
                     const rootSelected = restrictionValues.includes(shortId);
                     const hasActiveDescendant = hasChildren && hasSelectedDescendant(rootNode, selectedRestrictionIds);
                     const shouldHighlightBranch = hasActiveDescendant && !rootSelected;
@@ -415,7 +410,7 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
                                 selectedRestrictionIds={selectedRestrictionIds}
                                 lang={lang}
                                 highlighted={shouldHighlightBranch}
-                                formatLabel={formatLabel}
+
                             />
                         </NavigationMenuItem>
                     );
@@ -434,7 +429,6 @@ export const RestrictionSelectionCommandMenu: FC<Props> = ({
                             selectedRestrictionIds={selectedRestrictionIds}
                             lang={lang}
                             highlighted={false}
-                            formatLabel={formatLabel}
                         />
                     </NavigationMenuItem>
                 )}

package/src/restriction-menu/restriction-selection-menu.tsx

@@ -32,6 +32,8 @@ type Props = {
         [DEVICE_OPTIONS.TABLET]: number,
         [DEVICE_OPTIONS.DESKTOP]: number,
     }
+    multipleSelection?: boolean;
+    updatePosition?: boolean;
 }
 
 type RestrictionTreeNode = {
@@ -122,7 +124,9 @@ export const RestrictionSelectionMenu: FC<Props> = ({
         [DEVICE_OPTIONS.MOBILE]: 2,
         [DEVICE_OPTIONS.TABLET]: 4,
         [DEVICE_OPTIONS.DESKTOP]: 7,
-    }
+    },
+    multipleSelection = true,
+    updatePosition = true
 }) => {
     const t = useTranslations();
     const setRestrictionList = useRestrictionStore((state) => state.setRestrictionList);
@@ -154,6 +158,8 @@ export const RestrictionSelectionMenu: FC<Props> = ({
     const sortedItems = useMemo(() => {
         //if shortId it is on the restrictionValues, it should be on top of the list, otherwise keep the original order
 
+        if (updatePosition === false) return items;
+
         const sorted = [...items].sort((a, b) => {
             const aShortId = a.shortId || "";
             const bShortId = b.shortId || "";
@@ -173,7 +179,7 @@ export const RestrictionSelectionMenu: FC<Props> = ({
             return aIndex - bIndex; // sort by index in restrictionValues
         });
         return sorted;
-    }, [items, restrictionValues]);
+    }, [items, restrictionValues, updatePosition]);
 
     const hierarchyRoots = useMemo(() => {
         if (!enableHierarchy) return [];
@@ -293,6 +299,7 @@ export const RestrictionSelectionMenu: FC<Props> = ({
                     <RestrictionNavigationItem
                         key={item.shortId}
                         shortId={item.shortId!}
+                        multipleSelection={multipleSelection}
                         restrictField={restrictField as string}
                         label={getLabelByLang(item.labels, lang)}
                         selected={restrictionValues.includes(item.shortId!)}
@@ -315,6 +322,7 @@ export const RestrictionSelectionMenu: FC<Props> = ({
                                 restrictField={restrictField}
                                 label={label}
                                 selected={restrictionValues.includes(shortId)}
+                                multipleSelection={multipleSelection}
                             />
                         );
                     }
@@ -364,6 +372,7 @@ export const RestrictionSelectionMenu: FC<Props> = ({
                                         >
                                             <RestrictionDropdownItem
                                                 shortId={item.shortId!}
+                                                multipleSelection={multipleSelection}
                                                 restrictField={restrictField as string}
                                                 label={getLabelByLang(item.labels, lang)}
                                                 selected={restrictionValues.includes(item.shortId!)}

package/src/restriction-menu/taxonomy-restriction-command-menu.tsx

@@ -29,7 +29,6 @@ export type TaxonomyRestrictionCommandMenuProps = {
     fetchMode?: RestrictionMenuFetchMode;
     showAllWhenEmpty?: boolean;
     queryParams?: GenericQueryParams;
-    stripLabelPrefix?: string;
 };
 
 export const TaxonomyRestrictionCommandMenu: FC<TaxonomyRestrictionCommandMenuProps> = ({
@@ -42,7 +41,6 @@ export const TaxonomyRestrictionCommandMenu: FC<TaxonomyRestrictionCommandMenuPr
     fetchMode = "deferred",
     showAllWhenEmpty = true,
     navigationMenuListClassName = "items-center justify-start gap-4 flex-row",
-    stripLabelPrefix,
 }) => {
     const [loadAll, setLoadAll] = useState(false);
     const RequestComponent = ComponentOptions[requestType] as unknown as FC<GenericRequestProps>;
@@ -102,7 +100,6 @@ export const TaxonomyRestrictionCommandMenu: FC<TaxonomyRestrictionCommandMenuPr
                             }
                         }}
                         navigationMenuListClassName={navigationMenuListClassName}
-                        stripLabelPrefix={stripLabelPrefix}
                     />
                 );
             }}

package/src/restriction-menu/taxonomy-restriction-menu.tsx

@@ -34,6 +34,8 @@ export type TaxonomyRestrictionMenuProps = {
     fetchMode?: RestrictionMenuFetchMode;
     showAllWhenEmpty?: boolean;
     queryParams?: GenericQueryParams;
+    multipleSelection?: boolean;
+    updatePosition?: boolean;
 };
 
 const DEFAULT_ITEMS_BY_ROW = {
@@ -52,6 +54,8 @@ export const TaxonomyRestrictionMenu: FC<TaxonomyRestrictionMenuProps> = ({
     fetchMode = "deferred",
     showAllWhenEmpty = true,
     navigationMenuListClassName = "items-center justify-start gap-4 flex-row",
+    multipleSelection = true,
+    updatePosition = true,
 }) => {
     const [loadAll, setLoadAll] = useState(false);
     const RequestComponent = ComponentOptions[requestType] as unknown as FC<GenericRequestProps>;
@@ -113,6 +117,8 @@ export const TaxonomyRestrictionMenu: FC<TaxonomyRestrictionMenuProps> = ({
                             }
                         }}
                         navigationMenuListClassName={navigationMenuListClassName}
+                        multipleSelection={multipleSelection}
+                        updatePosition={updatePosition}
                     />
                 );
             }}