@strapi/admin 4.20.4 → 5.0.0-alpha.0

package/dist/_chunks/Permissions-9WfQZ8_F.mjs

@@ -1,2011 +0,0 @@
-import { jsx, jsxs, Fragment } from "react/jsx-runtime";
-import * as React from "react";
-import React__default, { useMemo } from "react";
-import { Flex, Box, BaseCheckbox, Typography, Button, ModalLayout, ModalHeader, ModalBody, ModalFooter, MultiSelectNested, Accordion, AccordionToggle, AccordionContent, Checkbox, Grid, GridItem, TabGroup, Tabs, Tab, TabPanels, TabPanel } from "@strapi/design-system";
-import { difference } from "@strapi/helper-plugin";
-import produce from "immer";
-import cloneDeep from "lodash/cloneDeep";
-import get from "lodash/get";
-import has from "lodash/has";
-import isEmpty from "lodash/isEmpty";
-import set from "lodash/set";
-import { useIntl } from "react-intl";
-import { F as isObject } from "./index-Sr5PWLEf.mjs";
-import { createContext } from "@radix-ui/react-context";
-import merge from "lodash/merge";
-import groupBy from "lodash/groupBy";
-import omit from "lodash/omit";
-import styled, { css } from "styled-components";
-import { CarretDown, Cog, ChevronUp, ChevronDown } from "@strapi/icons";
-import { Breadcrumbs, Crumb } from "@strapi/design-system/v2";
-import upperFirst from "lodash/upperFirst";
-const [PermissionsDataManagerProvider, usePermissionsDataManagerContext] = createContext("PermissionsDataManager");
-const usePermissionsDataManager = () => usePermissionsDataManagerContext("usePermissionsDataManager");
-const flattenDeep = (array) => {
-  if (Array.isArray(array)) {
-    return array.reduce((acc, value) => {
-      if (Array.isArray(value)) {
-        acc.push(...flattenDeep(value));
-      } else {
-        acc.push(value);
-      }
-      return acc;
-    }, []);
-  } else {
-    return [];
-  }
-};
-const createArrayOfValues = (obj) => {
-  if (!isObject(obj)) {
-    return [];
-  }
-  return flattenDeep(
-    Object.values(obj).map((value) => {
-      if (isObject(value)) {
-        return createArrayOfValues(value);
-      }
-      return value;
-    })
-  );
-};
-const findMatchingPermission = (permissions, action, subject) => permissions.find((perm) => perm.action === action && perm.subject === subject);
-const formatPermissionsForAPI = (modifiedData) => {
-  const pluginsPermissions = formatSettingsPermissions(modifiedData.plugins);
-  const settingsPermissions = formatSettingsPermissions(modifiedData.settings);
-  const collectionTypesPermissions = formatContentTypesPermissions(modifiedData.collectionTypes);
-  const singleTypesPermissions = formatContentTypesPermissions(modifiedData.singleTypes);
-  return [
-    ...pluginsPermissions,
-    ...settingsPermissions,
-    ...collectionTypesPermissions,
-    ...singleTypesPermissions
-  ];
-};
-const formatSettingsPermissions = (settingsPermissionsObject) => {
-  return Object.values(settingsPermissionsObject).reduce((formAcc, form) => {
-    const currentCategoryPermissions = Object.values(form).reduce(
-      (childFormAcc, childForm) => {
-        const permissions = Object.entries(childForm).reduce(
-          (responsesAcc, [
-            actionName,
-            {
-              conditions,
-              properties: { enabled }
-            }
-          ]) => {
-            if (!enabled) {
-              return responsesAcc;
-            }
-            responsesAcc.push({
-              action: actionName,
-              subject: null,
-              conditions: createConditionsArray(conditions),
-              properties: {}
-            });
-            return responsesAcc;
-          },
-          []
-        );
-        return [...childFormAcc, ...permissions];
-      },
-      []
-    );
-    return [...formAcc, ...currentCategoryPermissions];
-  }, []);
-};
-const formatContentTypesPermissions = (contentTypesPermissions) => {
-  const permissions = Object.entries(contentTypesPermissions).reduce(
-    (allPermissions, current) => {
-      const [subject, currentSubjectActions] = current;
-      const permissions2 = Object.entries(currentSubjectActions).reduce(
-        (acc, current2) => {
-          const [actionName, permissions3] = current2;
-          const shouldCreatePermission = createArrayOfValues(permissions3).some((val) => val);
-          if (!shouldCreatePermission) {
-            return acc;
-          }
-          if (!permissions3?.properties?.enabled) {
-            const createdPermissionsArray = Object.entries(permissions3.properties).reduce(
-              (acc2, current3) => {
-                const [propertyName, propertyValue] = current3;
-                acc2.properties[propertyName] = createPropertyArray(propertyValue);
-                return acc2;
-              },
-              {
-                action: actionName,
-                subject,
-                conditions: createConditionsArray(permissions3.conditions),
-                properties: {}
-              }
-            );
-            return [...acc, createdPermissionsArray];
-          }
-          if (!permissions3.properties.enabled) {
-            return acc;
-          }
-          acc.push({
-            action: actionName,
-            subject,
-            properties: {},
-            conditions: createConditionsArray(permissions3.conditions)
-          });
-          return acc;
-        },
-        []
-      );
-      return [...allPermissions, ...permissions2];
-    },
-    []
-  );
-  return permissions;
-};
-const createPropertyArray = (propertyValue, prefix = "") => {
-  return Object.entries(propertyValue).reduce((acc, current) => {
-    const [name, value] = current;
-    if (isObject(value)) {
-      return [...acc, ...createPropertyArray(value, `${prefix}${name}.`)];
-    }
-    if (value && !isObject(value)) {
-      acc.push(`${prefix}${name}`);
-    }
-    return acc;
-  }, []);
-};
-const createConditionsArray = (conditions) => Object.entries(conditions).filter(([, conditionValue]) => {
-  return conditionValue;
-}).map(([conditionName]) => conditionName);
-const createDefaultConditionsForm$1 = (conditions, initialConditions = []) => conditions.reduce((acc, current) => {
-  acc[current.id] = initialConditions.indexOf(current.id) !== -1;
-  return acc;
-}, {});
-const createDefaultForm = (layout, conditions, initialPermissions = []) => {
-  return layout.reduce((acc, { categoryId, childrenForm }) => {
-    const childrenDefaultForm = childrenForm.reduce((acc2, current) => {
-      acc2[current.subCategoryId] = current.actions.reduce((acc3, current2) => {
-        const foundMatchingPermission = findMatchingPermission(
-          initialPermissions,
-          current2.action,
-          null
-        );
-        acc3[current2.action] = {
-          properties: {
-            enabled: foundMatchingPermission !== void 0
-          },
-          conditions: createDefaultConditionsForm$1(
-            conditions,
-            foundMatchingPermission?.conditions ?? []
-          )
-        };
-        return acc3;
-      }, {});
-      return acc2;
-    }, {});
-    acc[categoryId] = childrenDefaultForm;
-    return acc;
-  }, {});
-};
-const createDefaultPropertiesForm = (properties, subject, matchingPermission) => {
-  const recursivelyCreatePropertyForm = ({ children = [] }, propertyValues, prefix = "") => {
-    return children.reduce((acc, current) => {
-      if (current.children) {
-        return {
-          ...acc,
-          [current.value]: recursivelyCreatePropertyForm(
-            current,
-            propertyValues,
-            `${prefix}${current.value}.`
-          )
-        };
-      }
-      const hasProperty = propertyValues.indexOf(`${prefix}${current.value}`) !== -1;
-      acc[current.value] = hasProperty;
-      return acc;
-    }, {});
-  };
-  return properties.reduce(
-    (acc, currentPropertyName) => {
-      const foundProperty = subject.properties.find(({ value }) => value === currentPropertyName);
-      if (foundProperty) {
-        const matchingPermissionPropertyValues = matchingPermission?.properties[foundProperty.value] ?? [];
-        const propertyForm = recursivelyCreatePropertyForm(
-          foundProperty,
-          matchingPermissionPropertyValues
-        );
-        acc.properties[currentPropertyName] = propertyForm;
-      }
-      return acc;
-    },
-    { properties: {} }
-  );
-};
-const createDefaultCTForm = ({ subjects, actions = [] }, conditions, initialPermissions = []) => {
-  return actions.reduce((defaultForm, action) => {
-    const subjectLayouts = action.subjects.reduce((acc, current) => {
-      const foundLayout = subjects.find(({ uid }) => uid === current) || null;
-      if (foundLayout) {
-        acc[current] = foundLayout;
-      }
-      return acc;
-    }, {});
-    if (isEmpty(subjectLayouts)) {
-      return defaultForm;
-    }
-    const contentTypesActions = Object.keys(subjectLayouts).reduce((acc, currentCTUID) => {
-      const { actionId, applyToProperties } = action;
-      const currentSubjectLayout = subjectLayouts[currentCTUID];
-      const properties = currentSubjectLayout.properties.map(({ value }) => value);
-      const doesNothaveProperty = properties.every(
-        (property) => (applyToProperties || []).indexOf(property) === -1
-      );
-      const matchingPermission = findMatchingPermission(initialPermissions, actionId, currentCTUID);
-      const conditionsForm = createDefaultConditionsForm$1(
-        conditions,
-        matchingPermission?.conditions ?? []
-      );
-      if (!acc[currentCTUID]) {
-        acc[currentCTUID] = {};
-      }
-      if (isEmpty(applyToProperties) || doesNothaveProperty) {
-        acc[currentCTUID][actionId] = {
-          properties: {
-            enabled: matchingPermission !== void 0
-          },
-          conditions: conditionsForm
-        };
-        return acc;
-      }
-      const propertiesForm = createDefaultPropertiesForm(
-        applyToProperties,
-        subjectLayouts[currentCTUID],
-        matchingPermission
-      );
-      acc[currentCTUID][actionId] = { ...propertiesForm, conditions: conditionsForm };
-      return acc;
-    }, {});
-    return merge(defaultForm, contentTypesActions);
-  }, {});
-};
-const formatLayout = (layout, groupByKey) => {
-  return Object.entries(groupBy(layout, groupByKey)).map(([itemName, item]) => ({
-    category: itemName,
-    categoryId: itemName.split(" ").join("-"),
-    childrenForm: Object.entries(groupBy(item, "subCategory")).map(
-      ([subCategoryName, actions]) => ({
-        subCategoryName,
-        subCategoryId: subCategoryName.split(" ").join("-"),
-        actions
-      })
-    )
-  }));
-};
-const updateConditionsToFalse = (obj) => {
-  return Object.keys(obj).reduce((acc, current) => {
-    const currentValue = obj[current];
-    if (isObject(currentValue) && !has(currentValue, "conditions")) {
-      return { ...acc, [current]: updateConditionsToFalse(currentValue) };
-    }
-    if (isObject(currentValue) && has(currentValue, "conditions")) {
-      const isActionEnabled = createArrayOfValues(omit(currentValue, "conditions")).some(
-        (val) => val
-      );
-      if (!isActionEnabled) {
-        const updatedConditions = Object.keys(currentValue.conditions).reduce((acc1, current2) => {
-          acc1[current2] = false;
-          return acc1;
-        }, {});
-        return { ...acc, [current]: { ...currentValue, conditions: updatedConditions } };
-      }
-    }
-    acc[current] = currentValue;
-    return acc;
-  }, {});
-};
-const updateValues = (obj, valueToSet, isFieldUpdate = false) => {
-  return Object.keys(obj).reduce((acc, current) => {
-    const currentValue = obj[current];
-    if (current === "conditions" && !isFieldUpdate) {
-      acc[current] = currentValue;
-      return acc;
-    }
-    if (isObject(currentValue)) {
-      return { ...acc, [current]: updateValues(currentValue, valueToSet, current === "fields") };
-    }
-    acc[current] = valueToSet;
-    return acc;
-  }, {});
-};
-const cellWidth = `${120 / 16}rem`;
-const firstRowWidth = `${200 / 16}rem`;
-const rowHeight = `${53 / 16}rem`;
-const removeConditionKeyFromData = (obj) => {
-  if (!obj) {
-    return null;
-  }
-  return Object.entries(obj).reduce((acc, [key, value]) => {
-    if (key !== "conditions") {
-      acc[key] = value;
-    }
-    return acc;
-  }, {});
-};
-const getCheckboxState = (dataObj) => {
-  const dataWithoutCondition = removeConditionKeyFromData(dataObj);
-  const arrayOfValues = createArrayOfValues(dataWithoutCondition);
-  if (!arrayOfValues.length) {
-    return { hasAllActionsSelected: false, hasSomeActionsSelected: false };
-  }
-  const hasAllActionsSelected = arrayOfValues.every((val) => val);
-  const hasSomeActionsSelected = arrayOfValues.some((val) => val) && !hasAllActionsSelected;
-  return { hasAllActionsSelected, hasSomeActionsSelected };
-};
-const capitalise = (str) => str.charAt(0).toUpperCase() + str.slice(1);
-const CollapseLabel = styled(Flex)`
-  padding-right: ${({ theme }) => theme.spaces[2]};
-  overflow: hidden;
-  flex: 1;
-  ${({ isCollapsable }) => isCollapsable && "cursor: pointer;"}
-`;
-const HiddenAction = styled.div`
-  width: ${cellWidth};
-`;
-const RequiredSign = () => /* @__PURE__ */ jsx(Box, { color: "danger700", paddingLeft: 1, children: "*" });
-const RowLabelWithCheckbox = ({
-  checkboxName = "",
-  children,
-  isActive = false,
-  isCollapsable = false,
-  isFormDisabled = false,
-  label,
-  onChange,
-  onClick,
-  someChecked = false,
-  value
-}) => {
-  const { formatMessage } = useIntl();
-  return /* @__PURE__ */ jsxs(Flex, { alignItems: "center", paddingLeft: 6, width: firstRowWidth, shrink: 0, children: [
-    /* @__PURE__ */ jsx(Box, { paddingRight: 2, children: /* @__PURE__ */ jsx(
-      BaseCheckbox,
-      {
-        name: checkboxName,
-        "aria-label": formatMessage(
-          {
-            id: `Settings.permissions.select-all-by-permission`,
-            defaultMessage: "Select all {label} permissions"
-          },
-          { label }
-        ),
-        disabled: isFormDisabled,
-        onValueChange: (value2) => onChange({
-          target: {
-            name: checkboxName,
-            value: value2
-          }
-        }),
-        indeterminate: someChecked,
-        value
-      }
-    ) }),
-    /* @__PURE__ */ jsxs(
-      CollapseLabel,
-      {
-        title: label,
-        alignItems: "center",
-        isCollapsable,
-        ...isCollapsable && {
-          onClick,
-          "aria-expanded": isActive,
-          onKeyDown: ({ key }) => (key === "Enter" || key === " ") && onClick(),
-          tabIndex: 0,
-          role: "button"
-        },
-        children: [
-          /* @__PURE__ */ jsx(
-            Typography,
-            {
-              fontWeight: isActive ? "bold" : void 0,
-              textColor: isActive ? "primary600" : "neutral800",
-              ellipsis: true,
-              children: capitalise(label)
-            }
-          ),
-          children
-        ]
-      }
-    )
-  ] });
-};
-const CollapsePropertyMatrix = ({
-  availableActions = [],
-  childrenForm = [],
-  isFormDisabled,
-  label,
-  pathToData,
-  propertyName
-}) => {
-  const propertyActions = useMemo(
-    () => availableActions.map((action) => {
-      const isActionRelatedToCurrentProperty = Array.isArray(action.applyToProperties) && action.applyToProperties.indexOf(propertyName) !== -1 && action.isDisplayed;
-      return { label: action.label, actionId: action.actionId, isActionRelatedToCurrentProperty };
-    }),
-    [availableActions, propertyName]
-  );
-  return /* @__PURE__ */ jsxs(Flex, { display: "inline-flex", direction: "column", minWidth: 0, children: [
-    /* @__PURE__ */ jsx(Header, { label, headers: propertyActions }),
-    /* @__PURE__ */ jsx(Box, { children: childrenForm.map(({ children: childrenForm2, label: label2, value, required }, i) => /* @__PURE__ */ jsx(
-      ActionRow$1,
-      {
-        childrenForm: childrenForm2,
-        label: label2,
-        isFormDisabled,
-        name: value,
-        required,
-        propertyActions,
-        pathToData,
-        propertyName,
-        isOdd: i % 2 === 0
-      },
-      value
-    )) })
-  ] });
-};
-const ActionRow$1 = ({
-  childrenForm = [],
-  label,
-  isFormDisabled = false,
-  name,
-  required = false,
-  pathToData,
-  propertyActions,
-  propertyName,
-  isOdd = false
-}) => {
-  const { formatMessage } = useIntl();
-  const [rowToOpen, setRowToOpen] = React__default.useState(null);
-  const {
-    modifiedData,
-    onChangeCollectionTypeLeftActionRowCheckbox,
-    onChangeParentCheckbox,
-    onChangeSimpleCheckbox
-  } = usePermissionsDataManager();
-  const isActive = rowToOpen === name;
-  const recursiveChildren = useMemo(() => {
-    if (!Array.isArray(childrenForm)) {
-      return [];
-    }
-    return childrenForm;
-  }, [childrenForm]);
-  const isCollapsable = recursiveChildren.length > 0;
-  const handleClick = React__default.useCallback(() => {
-    if (isCollapsable) {
-      setRowToOpen((prev) => {
-        if (prev === name) {
-          return null;
-        }
-        return name;
-      });
-    }
-  }, [isCollapsable, name]);
-  const handleChangeLeftRowCheckbox = ({
-    target: { value }
-  }) => {
-    onChangeCollectionTypeLeftActionRowCheckbox(pathToData, propertyName, name, value);
-  };
-  const { hasAllActionsSelected, hasSomeActionsSelected } = useMemo(() => {
-    return getRowLabelCheckboxState(propertyActions, modifiedData, pathToData, propertyName, name);
-  }, [propertyActions, modifiedData, pathToData, propertyName, name]);
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsx(
-      Wrapper$1,
-      {
-        alignItems: "center",
-        isCollapsable,
-        isActive,
-        background: isOdd ? "neutral100" : "neutral0",
-        children: /* @__PURE__ */ jsxs(Flex, { children: [
-          /* @__PURE__ */ jsxs(
-            RowLabelWithCheckbox,
-            {
-              onChange: handleChangeLeftRowCheckbox,
-              onClick: handleClick,
-              isCollapsable,
-              isFormDisabled,
-              label,
-              someChecked: hasSomeActionsSelected,
-              value: hasAllActionsSelected,
-              isActive,
-              children: [
-                required && /* @__PURE__ */ jsx(RequiredSign, {}),
-                /* @__PURE__ */ jsx(CarretIcon, { $isActive: isActive })
-              ]
-            }
-          ),
-          /* @__PURE__ */ jsx(Flex, { children: propertyActions.map(({ label: label2, isActionRelatedToCurrentProperty, actionId }) => {
-            if (!isActionRelatedToCurrentProperty) {
-              return /* @__PURE__ */ jsx(HiddenAction, {}, label2);
-            }
-            const checkboxName = [
-              ...pathToData.split(".."),
-              actionId,
-              "properties",
-              propertyName,
-              name
-            ];
-            if (!isCollapsable) {
-              const checkboxValue = get(modifiedData, checkboxName, false);
-              return /* @__PURE__ */ jsx(
-                Flex,
-                {
-                  width: cellWidth,
-                  position: "relative",
-                  justifyContent: "center",
-                  alignItems: "center",
-                  children: /* @__PURE__ */ jsx(
-                    BaseCheckbox,
-                    {
-                      disabled: isFormDisabled,
-                      name: checkboxName.join(".."),
-                      "aria-label": formatMessage(
-                        {
-                          id: `Settings.permissions.select-by-permission`,
-                          defaultMessage: "Select {label} permission"
-                        },
-                        { label: `${name} ${label2}` }
-                      ),
-                      onValueChange: (value) => {
-                        onChangeSimpleCheckbox({
-                          target: {
-                            name: checkboxName.join(".."),
-                            value
-                          }
-                        });
-                      },
-                      value: checkboxValue
-                    }
-                  )
-                },
-                actionId
-              );
-            }
-            const data = get(modifiedData, checkboxName, {});
-            const { hasAllActionsSelected: hasAllActionsSelected2, hasSomeActionsSelected: hasSomeActionsSelected2 } = getCheckboxState(data);
-            return /* @__PURE__ */ jsx(
-              Flex,
-              {
-                width: cellWidth,
-                position: "relative",
-                justifyContent: "center",
-                alignItems: "center",
-                children: /* @__PURE__ */ jsx(
-                  BaseCheckbox,
-                  {
-                    disabled: isFormDisabled,
-                    name: checkboxName.join(".."),
-                    onValueChange: (value) => {
-                      onChangeParentCheckbox({
-                        target: {
-                          name: checkboxName.join(".."),
-                          value
-                        }
-                      });
-                    },
-                    "aria-label": formatMessage(
-                      {
-                        id: `Settings.permissions.select-by-permission`,
-                        defaultMessage: "Select {label} permission"
-                      },
-                      { label: `${name} ${label2}` }
-                    ),
-                    value: hasAllActionsSelected2,
-                    indeterminate: hasSomeActionsSelected2
-                  }
-                )
-              },
-              label2
-            );
-          }) })
-        ] })
-      }
-    ),
-    isActive && /* @__PURE__ */ jsx(
-      SubActionRow,
-      {
-        childrenForm: recursiveChildren,
-        isFormDisabled,
-        parentName: name,
-        pathToDataFromActionRow: pathToData,
-        propertyName,
-        propertyActions,
-        recursiveLevel: 0
-      }
-    )
-  ] });
-};
-const getRowLabelCheckboxState = (propertyActions, modifiedData, pathToContentType, propertyToCheck, targetKey) => {
-  const actionIds = propertyActions.reduce((acc, current) => {
-    if (current.isActionRelatedToCurrentProperty) {
-      acc.push(current.actionId);
-    }
-    return acc;
-  }, []);
-  const data = actionIds.reduce((acc, current) => {
-    const mainData = get(
-      modifiedData,
-      [...pathToContentType.split(".."), current, "properties", propertyToCheck, targetKey],
-      false
-    );
-    acc[current] = mainData;
-    return acc;
-  }, {});
-  return getCheckboxState(data);
-};
-const Wrapper$1 = styled(Flex)`
-  height: ${rowHeight};
-  flex: 1;
-
-  ${({ isCollapsable, theme }) => isCollapsable && `
-      ${CarretIcon} {
-        display: block;
-        color: ${theme.colors.neutral100};
-      }
-      &:hover {
-        ${activeStyle(theme)}
-      }
-  `}
-  ${({ isActive, theme }) => isActive && activeStyle(theme)};
-`;
-const CarretIcon = styled(CarretDown)`
-  display: none;
-  width: ${10 / 16}rem;
-  transform: rotate(${({ $isActive }) => $isActive ? "180" : "0"}deg);
-  margin-left: ${({ theme }) => theme.spaces[2]};
-`;
-const SubActionRow = ({
-  childrenForm = [],
-  isFormDisabled,
-  recursiveLevel,
-  pathToDataFromActionRow,
-  propertyActions,
-  parentName,
-  propertyName
-}) => {
-  const { formatMessage } = useIntl();
-  const { modifiedData, onChangeParentCheckbox, onChangeSimpleCheckbox } = usePermissionsDataManager();
-  const [rowToOpen, setRowToOpen] = React__default.useState(null);
-  const handleClickToggleSubLevel = (name) => {
-    setRowToOpen((prev) => {
-      if (prev === name) {
-        return null;
-      }
-      return name;
-    });
-  };
-  const displayedRecursiveChildren = useMemo(() => {
-    if (!rowToOpen) {
-      return null;
-    }
-    return childrenForm.find(({ value }) => value === rowToOpen);
-  }, [rowToOpen, childrenForm]);
-  return /* @__PURE__ */ jsxs(Box, { paddingLeft: `2rem`, children: [
-    /* @__PURE__ */ jsx(TopTimeline, {}),
-    childrenForm.map(({ label, value, required, children: subChildrenForm }, index) => {
-      const isVisible = index + 1 < childrenForm.length;
-      const isArrayType = Array.isArray(subChildrenForm);
-      const isActive = rowToOpen === value;
-      return /* @__PURE__ */ jsxs(LeftBorderTimeline, { isVisible, children: [
-        /* @__PURE__ */ jsxs(Flex, { height: rowHeight, children: [
-          /* @__PURE__ */ jsx(StyledBox$1, { children: /* @__PURE__ */ jsx(
-            Svg,
-            {
-              width: "20",
-              height: "23",
-              viewBox: "0 0 20 23",
-              fill: "none",
-              xmlns: "http://www.w3.org/2000/svg",
-              color: "primary200",
-              children: /* @__PURE__ */ jsx(
-                "path",
-                {
-                  fillRule: "evenodd",
-                  clipRule: "evenodd",
-                  d: "M7.02477 14.7513C8.65865 17.0594 11.6046 18.6059 17.5596 18.8856C18.6836 18.9384 19.5976 19.8435 19.5976 20.9688V20.9688C19.5976 22.0941 18.6841 23.0125 17.5599 22.9643C10.9409 22.6805 6.454 20.9387 3.75496 17.1258C0.937988 13.1464 0.486328 7.39309 0.486328 0.593262H4.50974C4.50974 7.54693 5.06394 11.9813 7.02477 14.7513Z",
-                  fill: "#D9D8FF"
-                }
-              )
-            }
-          ) }),
-          /* @__PURE__ */ jsxs(Flex, { style: { flex: 1 }, children: [
-            /* @__PURE__ */ jsx(RowStyle, { level: recursiveLevel, isActive, isCollapsable: isArrayType, children: /* @__PURE__ */ jsxs(
-              CollapseLabel,
-              {
-                alignItems: "center",
-                isCollapsable: isArrayType,
-                ...isArrayType && {
-                  onClick: () => handleClickToggleSubLevel(value),
-                  "aria-expanded": isActive,
-                  onKeyDown: ({ key }) => (key === "Enter" || key === " ") && handleClickToggleSubLevel(value),
-                  tabIndex: 0,
-                  role: "button"
-                },
-                title: label,
-                children: [
-                  /* @__PURE__ */ jsx(Typography, { ellipsis: true, children: capitalise(label) }),
-                  required && /* @__PURE__ */ jsx(RequiredSign, {}),
-                  /* @__PURE__ */ jsx(CarretIcon, { $isActive: isActive })
-                ]
-              }
-            ) }),
-            /* @__PURE__ */ jsx(Flex, { style: { flex: 1 }, children: propertyActions.map(
-              ({ actionId, label: propertyLabel, isActionRelatedToCurrentProperty }) => {
-                if (!isActionRelatedToCurrentProperty) {
-                  return /* @__PURE__ */ jsx(HiddenAction, {}, actionId);
-                }
-                const checkboxName = [
-                  ...pathToDataFromActionRow.split(".."),
-                  actionId,
-                  "properties",
-                  propertyName,
-                  ...parentName.split(".."),
-                  value
-                ];
-                const checkboxValue = get(modifiedData, checkboxName, false);
-                if (!subChildrenForm) {
-                  return /* @__PURE__ */ jsx(
-                    Flex,
-                    {
-                      position: "relative",
-                      width: cellWidth,
-                      justifyContent: "center",
-                      alignItems: "center",
-                      children: /* @__PURE__ */ jsx(
-                        BaseCheckbox,
-                        {
-                          disabled: isFormDisabled,
-                          name: checkboxName.join(".."),
-                          "aria-label": formatMessage(
-                            {
-                              id: `Settings.permissions.select-by-permission`,
-                              defaultMessage: "Select {label} permission"
-                            },
-                            { label: `${parentName} ${label} ${propertyLabel}` }
-                          ),
-                          onValueChange: (value2) => {
-                            onChangeSimpleCheckbox({
-                              target: {
-                                name: checkboxName.join(".."),
-                                value: value2
-                              }
-                            });
-                          },
-                          value: checkboxValue
-                        }
-                      )
-                    },
-                    propertyLabel
-                  );
-                }
-                const { hasAllActionsSelected, hasSomeActionsSelected } = getCheckboxState(checkboxValue);
-                return /* @__PURE__ */ jsx(
-                  Flex,
-                  {
-                    position: "relative",
-                    width: cellWidth,
-                    justifyContent: "center",
-                    alignItems: "center",
-                    children: /* @__PURE__ */ jsx(
-                      BaseCheckbox,
-                      {
-                        disabled: isFormDisabled,
-                        name: checkboxName.join(".."),
-                        "aria-label": formatMessage(
-                          {
-                            id: `Settings.permissions.select-by-permission`,
-                            defaultMessage: "Select {label} permission"
-                          },
-                          { label: `${parentName} ${label} ${propertyLabel}` }
-                        ),
-                        onValueChange: (value2) => {
-                          onChangeParentCheckbox({
-                            target: {
-                              name: checkboxName.join(".."),
-                              value: value2
-                            }
-                          });
-                        },
-                        value: hasAllActionsSelected,
-                        indeterminate: hasSomeActionsSelected
-                      },
-                      propertyLabel
-                    )
-                  },
-                  propertyLabel
-                );
-              }
-            ) })
-          ] })
-        ] }),
-        displayedRecursiveChildren && isActive && /* @__PURE__ */ jsx(Box, { paddingBottom: 2, children: /* @__PURE__ */ jsx(
-          SubActionRow,
-          {
-            isFormDisabled,
-            parentName: `${parentName}..${value}`,
-            pathToDataFromActionRow,
-            propertyActions,
-            propertyName,
-            recursiveLevel: recursiveLevel + 1,
-            childrenForm: displayedRecursiveChildren.children
-          }
-        ) })
-      ] }, value);
-    })
-  ] });
-};
-const LeftBorderTimeline = styled(Box)`
-  border-left: ${({ isVisible, theme }) => isVisible ? `4px solid ${theme.colors.primary200}` : "4px solid transparent"};
-`;
-const RowStyle = styled(Flex)`
-  padding-left: ${({ theme }) => theme.spaces[4]};
-  width: ${({ level }) => 145 - level * 36}px;
-
-  ${({ isCollapsable, theme }) => isCollapsable && `
-      ${CarretIcon} {
-        display: block;
-        color: ${theme.colors.neutral100};
-      }
-      &:hover {
-        ${activeStyle(theme)}
-      }
-  `}
-  ${({ isActive, theme }) => isActive && activeStyle(theme)};
-`;
-const TopTimeline = styled.div`
-  padding-top: ${({ theme }) => theme.spaces[2]};
-  margin-top: ${({ theme }) => theme.spaces[2]};
-  width: ${4 / 16}rem;
-  background-color: ${({ theme }) => theme.colors.primary200};
-  border-top-left-radius: 2px;
-  border-top-right-radius: 2px;
-`;
-const StyledBox$1 = styled(Box)`
-  transform: translate(-4px, -12px);
-
-  &:before {
-    content: '';
-    width: ${4 / 16}rem;
-    height: ${12 / 16}rem;
-    background: ${({ theme }) => theme.colors.primary200};
-    display: block;
-  }
-`;
-const Svg = styled.svg`
-  position: relative;
-  flex-shrink: 0;
-  transform: translate(-0.5px, -1px);
-
-  * {
-    fill: ${({ theme, color }) => theme.colors[color]};
-  }
-`;
-const Header = ({ headers = [], label }) => {
-  const { formatMessage } = useIntl();
-  return /* @__PURE__ */ jsxs(Flex, { children: [
-    /* @__PURE__ */ jsx(Flex, { width: firstRowWidth, height: rowHeight, shrink: 0, alignItems: "center", paddingLeft: 6, children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", textColor: "neutral500", children: formatMessage(
-      {
-        id: "Settings.roles.form.permission.property-label",
-        defaultMessage: "{label} permissions"
-      },
-      { label }
-    ) }) }),
-    headers.map((header) => {
-      if (!header.isActionRelatedToCurrentProperty) {
-        return /* @__PURE__ */ jsx(Flex, { width: cellWidth, shrink: 0 }, header.label);
-      }
-      return /* @__PURE__ */ jsx(Flex, { width: cellWidth, shrink: 0, justifyContent: "center", children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", textColor: "neutral500", children: formatMessage({
-        id: `Settings.roles.form.permissions.${header.label.toLowerCase()}`,
-        defaultMessage: header.label
-      }) }) }, header.label);
-    })
-  ] });
-};
-const activeStyle = (theme) => css`
-  ${Typography} {
-    color: ${theme.colors.primary600};
-    font-weight: ${theme.fontWeights.bold};
-  }
-  ${CarretIcon} {
-    display: block;
-
-    path {
-      fill: ${theme.colors.primary600};
-    }
-  }
-`;
-const ConditionsButtonImpl = ({
-  onClick,
-  className,
-  hasConditions = false,
-  variant = "tertiary"
-}) => {
-  const { formatMessage } = useIntl();
-  return /* @__PURE__ */ jsx(ButtonContainer, { hasConditions, className, children: /* @__PURE__ */ jsx(Button, { variant, startIcon: /* @__PURE__ */ jsx(Cog, {}), onClick, children: formatMessage({
-    id: "global.settings",
-    defaultMessage: "Settings"
-  }) }) });
-};
-const ButtonContainer = styled(Box)`
-  ${({ hasConditions, disabled, theme }) => hasConditions && `
-    &:before {
-      content: '';
-      position: absolute;
-      top: -3px;
-      left: -10px;
-      width: 6px;
-      height: 6px;
-      border-radius: ${20 / 16}rem;;
-      background: ${disabled ? theme.colors.neutral100 : theme.colors.primary600};
-    }
-  `}
-`;
-const ConditionsButton = styled(ConditionsButtonImpl)``;
-const ConditionsModal = ({
-  actions = [],
-  headerBreadCrumbs = [],
-  isFormDisabled,
-  onClosed,
-  onToggle
-}) => {
-  const { formatMessage } = useIntl();
-  const { availableConditions, modifiedData, onChangeConditions } = usePermissionsDataManager();
-  const arrayOfOptionsGroupedByCategory = React.useMemo(() => {
-    return Object.entries(groupBy(availableConditions, "category"));
-  }, [availableConditions]);
-  const actionsToDisplay = actions.filter(
-    // @ts-expect-error – TODO: fix this type issue
-    ({ isDisplayed, hasSomeActionsSelected, hasAllActionsSelected }) => isDisplayed && Boolean(hasSomeActionsSelected || hasAllActionsSelected)
-  );
-  const [state, setState] = React.useState(
-    createDefaultConditionsForm(actionsToDisplay, modifiedData, arrayOfOptionsGroupedByCategory)
-  );
-  const handleChange = (name, values) => {
-    setState(
-      produce((draft) => {
-        if (!draft[name]) {
-          draft[name] = {};
-        }
-        if (!draft[name].default) {
-          draft[name].default = {};
-        }
-        draft[name].default = values;
-      })
-    );
-  };
-  const handleSubmit = () => {
-    const conditionsWithoutCategory = Object.entries(state).reduce(
-      (acc, current) => {
-        const [key, value] = current;
-        const merged = Object.values(value).reduce((acc1, current1) => {
-          return { ...acc1, ...current1 };
-        }, {});
-        acc[key] = merged;
-        return acc;
-      },
-      {}
-    );
-    onChangeConditions(conditionsWithoutCategory);
-    onToggle();
-  };
-  return /* @__PURE__ */ jsxs(ModalLayout, { labelledBy: "condition-modal-breadcrumbs", onClose: onClosed, children: [
-    /* @__PURE__ */ jsx(ModalHeader, { children: /* @__PURE__ */ jsx(Breadcrumbs, { id: "condition-modal-breadcrumbs", label: headerBreadCrumbs.join(", "), children: headerBreadCrumbs.map((label, index, arr) => /* @__PURE__ */ jsx(Crumb, { isCurrent: index === arr.length - 1, children: upperFirst(
-      formatMessage({
-        id: label,
-        defaultMessage: label
-      })
-    ) }, label)) }) }),
-    /* @__PURE__ */ jsxs(ModalBody, { children: [
-      actionsToDisplay.length === 0 && /* @__PURE__ */ jsx(Typography, { children: formatMessage({
-        id: "Settings.permissions.conditions.no-actions",
-        defaultMessage: "You first need to select actions (create, read, update, ...) before defining conditions on them."
-      }) }),
-      /* @__PURE__ */ jsx("ul", { children: actionsToDisplay.map(({ actionId, label, pathToConditionsObject }, index) => {
-        const name = pathToConditionsObject.join("..");
-        return /* @__PURE__ */ jsx(
-          ActionRow,
-          {
-            arrayOfOptionsGroupedByCategory,
-            label,
-            isFormDisabled,
-            isGrey: index % 2 === 0,
-            name,
-            onChange: handleChange,
-            value: get(state, name, {})
-          },
-          actionId
-        );
-      }) })
-    ] }),
-    /* @__PURE__ */ jsx(
-      ModalFooter,
-      {
-        startActions: /* @__PURE__ */ jsx(Button, { variant: "tertiary", onClick: onToggle, children: formatMessage({ id: "app.components.Button.cancel", defaultMessage: "Cancel" }) }),
-        endActions: /* @__PURE__ */ jsx(Button, { onClick: handleSubmit, children: formatMessage({
-          id: "Settings.permissions.conditions.apply",
-          defaultMessage: "Apply"
-        }) })
-      }
-    )
-  ] });
-};
-const createDefaultConditionsForm = (actionsToDisplay, modifiedData, arrayOfOptionsGroupedByCategory) => {
-  return actionsToDisplay.reduce((acc, current) => {
-    const valueFromModifiedData = get(
-      modifiedData,
-      [...current.pathToConditionsObject, "conditions"],
-      {}
-    );
-    const categoryDefaultForm = arrayOfOptionsGroupedByCategory.reduce((acc2, current2) => {
-      const [categoryName, relatedConditions] = current2;
-      const conditionsForm = relatedConditions.reduce((acc3, current3) => {
-        acc3[current3.id] = get(valueFromModifiedData, current3.id, false);
-        return acc3;
-      }, {});
-      acc2[categoryName] = conditionsForm;
-      return acc2;
-    }, {});
-    acc[current.pathToConditionsObject.join("..")] = categoryDefaultForm;
-    return acc;
-  }, {});
-};
-const ActionRow = ({
-  arrayOfOptionsGroupedByCategory,
-  isFormDisabled = false,
-  isGrey = false,
-  label,
-  name,
-  onChange,
-  value
-}) => {
-  const { formatMessage } = useIntl();
-  const handleChange = (val) => {
-    if (onChange) {
-      onChange(name, getNewStateFromChangedValues(arrayOfOptionsGroupedByCategory, val));
-    }
-  };
-  return /* @__PURE__ */ jsxs(Flex, { as: "li", background: isGrey ? "neutral100" : "neutral0", paddingBottom: 3, paddingTop: 3, children: [
-    /* @__PURE__ */ jsxs(Flex, { paddingLeft: 6, style: { width: 180 }, children: [
-      /* @__PURE__ */ jsxs(Typography, { variant: "sigma", textColor: "neutral600", children: [
-        formatMessage({
-          id: "Settings.permissions.conditions.can",
-          defaultMessage: "Can"
-        }),
-        " "
-      ] }),
-      /* @__PURE__ */ jsx(Typography, { variant: "sigma", title: label, textColor: "primary600", ellipsis: true, children: formatMessage({
-        id: `Settings.roles.form.permissions.${label.toLowerCase()}`,
-        defaultMessage: label
-      }) }),
-      /* @__PURE__ */ jsxs(Typography, { variant: "sigma", textColor: "neutral600", children: [
-        " ",
-        formatMessage({
-          id: "Settings.permissions.conditions.when",
-          defaultMessage: "When"
-        })
-      ] })
-    ] }),
-    /* @__PURE__ */ jsx(Box, { style: { maxWidth: 430, width: "100%" }, children: /* @__PURE__ */ jsx(
-      MultiSelectNested,
-      {
-        id: name,
-        customizeContent: (values = []) => `${values.length} currently selected`,
-        onChange: handleChange,
-        value: getSelectedValues(value),
-        options: getNestedOptions(arrayOfOptionsGroupedByCategory),
-        disabled: isFormDisabled
-      }
-    ) })
-  ] });
-};
-const getSelectedValues = (rawValue) => Object.values(rawValue).map(
-  (x) => Object.entries(x).filter(([, value]) => value).map(([key]) => key)
-).flat();
-const getNestedOptions = (options) => options.reduce((acc, [label, children]) => {
-  acc.push({
-    label: capitalise(label),
-    children: children.map((child) => ({
-      label: child.displayName,
-      value: child.id
-    }))
-  });
-  return acc;
-}, []);
-const getNewStateFromChangedValues = (options, changedValues) => options.map(([, values]) => values).flat().reduce(
-  (acc, curr) => ({ [curr.id]: changedValues.includes(curr.id), ...acc }),
-  {}
-);
-const ContentTypeCollapses = ({
-  actions = [],
-  isFormDisabled,
-  pathToData,
-  subjects = []
-}) => {
-  const [collapseToOpen, setCollapseToOpen] = React.useState(null);
-  const handleClickToggleCollapse = (collapseName) => () => {
-    const nextCollapseToOpen = collapseToOpen === collapseName ? null : collapseName;
-    setCollapseToOpen(nextCollapseToOpen);
-  };
-  return /* @__PURE__ */ jsx(Fragment, { children: subjects.map(({ uid, label, properties }, index) => {
-    const isActive = collapseToOpen === uid;
-    const availableActions = actions.map((action) => ({
-      ...action,
-      isDisplayed: Array.isArray(action.subjects) && action.subjects.indexOf(uid) !== -1
-    }));
-    return /* @__PURE__ */ jsxs(
-      Flex,
-      {
-        direction: "column",
-        display: "inline-flex",
-        minWidth: "100%",
-        borderColor: "primary600",
-        borderWidth: isActive ? 1 : 0,
-        children: [
-          /* @__PURE__ */ jsx(
-            Collapse,
-            {
-              availableActions,
-              isActive,
-              isGrey: index % 2 === 0,
-              isFormDisabled,
-              label,
-              onClickToggle: handleClickToggleCollapse(uid),
-              pathToData: [pathToData, uid].join("..")
-            }
-          ),
-          isActive && properties.map(({ label: propertyLabel, value, children: childrenForm }) => {
-            return /* @__PURE__ */ jsx(
-              CollapsePropertyMatrix,
-              {
-                availableActions,
-                childrenForm,
-                isFormDisabled,
-                label: propertyLabel,
-                pathToData: [pathToData, uid].join(".."),
-                propertyName: value
-              },
-              value
-            );
-          })
-        ]
-      },
-      uid
-    );
-  }) });
-};
-const Collapse = ({
-  availableActions = [],
-  isActive = false,
-  isGrey = false,
-  isFormDisabled = false,
-  label,
-  onClickToggle,
-  pathToData
-}) => {
-  const [isModalOpen, setModalOpen] = React.useState(false);
-  const { formatMessage } = useIntl();
-  const { modifiedData, onChangeParentCheckbox, onChangeSimpleCheckbox } = usePermissionsDataManager();
-  const handleToggleModalIsOpen = () => {
-    setModalOpen((s) => !s);
-  };
-  const handleModalClose = () => {
-    setModalOpen(false);
-  };
-  const mainData = get(modifiedData, pathToData.split(".."), {});
-  const dataWithoutCondition = React.useMemo(() => {
-    return Object.keys(mainData).reduce((acc, current) => {
-      acc[current] = omit(mainData[current], "conditions");
-      return acc;
-    }, {});
-  }, [mainData]);
-  const { hasAllActionsSelected, hasSomeActionsSelected } = getCheckboxState(dataWithoutCondition);
-  const checkboxesActions = React.useMemo(() => {
-    return generateCheckboxesActions(availableActions, modifiedData, pathToData);
-  }, [availableActions, modifiedData, pathToData]);
-  const doesConditionButtonHasConditions = checkboxesActions.some((action) => action.hasConditions);
-  return /* @__PURE__ */ jsxs(BoxWrapper, { isActive, children: [
-    /* @__PURE__ */ jsxs(
-      Wrapper,
-      {
-        height: rowHeight,
-        flex: 1,
-        alignItems: "center",
-        background: isGrey ? "neutral100" : "neutral0",
-        children: [
-          /* @__PURE__ */ jsx(
-            RowLabelWithCheckbox,
-            {
-              isCollapsable: true,
-              isFormDisabled,
-              label,
-              checkboxName: pathToData,
-              onChange: onChangeParentCheckbox,
-              onClick: onClickToggle,
-              someChecked: hasSomeActionsSelected,
-              value: hasAllActionsSelected,
-              isActive,
-              children: /* @__PURE__ */ jsx(Chevron, { paddingLeft: 2, children: isActive ? /* @__PURE__ */ jsx(ChevronUp, {}) : /* @__PURE__ */ jsx(ChevronDown, {}) })
-            }
-          ),
-          /* @__PURE__ */ jsx(Flex, { style: { flex: 1 }, children: checkboxesActions.map(
-            ({ actionId, hasSomeActionsSelected: hasSomeActionsSelected2, isDisplayed, ...restAction }) => {
-              if (!isDisplayed) {
-                return /* @__PURE__ */ jsx(HiddenAction, {}, actionId);
-              }
-              const {
-                hasConditions,
-                hasAllActionsSelected: hasAllActionsSelected2,
-                isParentCheckbox,
-                checkboxName,
-                label: permissionLabel
-              } = restAction;
-              if (isParentCheckbox) {
-                return /* @__PURE__ */ jsxs(Cell, { justifyContent: "center", alignItems: "center", children: [
-                  hasConditions && /* @__PURE__ */ jsx(
-                    Box,
-                    {
-                      as: "span",
-                      position: "absolute",
-                      top: "-6px",
-                      left: "37px",
-                      width: "6px",
-                      height: "6px",
-                      borderRadius: "20px",
-                      background: "primary600"
-                    }
-                  ),
-                  /* @__PURE__ */ jsx(
-                    BaseCheckbox,
-                    {
-                      disabled: isFormDisabled,
-                      name: checkboxName,
-                      "aria-label": formatMessage(
-                        {
-                          id: `Settings.permissions.select-by-permission`,
-                          defaultMessage: "Select {label} permission"
-                        },
-                        { label: `${permissionLabel} ${label}` }
-                      ),
-                      onValueChange: (value) => {
-                        onChangeParentCheckbox({
-                          target: {
-                            name: checkboxName,
-                            value
-                          }
-                        });
-                      },
-                      indeterminate: hasSomeActionsSelected2,
-                      value: hasAllActionsSelected2
-                    }
-                  )
-                ] }, actionId);
-              }
-              return /* @__PURE__ */ jsxs(Cell, { justifyContent: "center", alignItems: "center", children: [
-                hasConditions && /* @__PURE__ */ jsx(
-                  Box,
-                  {
-                    as: "span",
-                    position: "absolute",
-                    top: "-6px",
-                    left: "37px",
-                    width: "6px",
-                    height: "6px",
-                    borderRadius: "20px",
-                    background: "primary600"
-                  }
-                ),
-                /* @__PURE__ */ jsx(
-                  BaseCheckbox,
-                  {
-                    disabled: isFormDisabled,
-                    indeterminate: hasConditions,
-                    name: checkboxName,
-                    onValueChange: (value) => {
-                      onChangeSimpleCheckbox({
-                        target: {
-                          name: checkboxName,
-                          value
-                        }
-                      });
-                    },
-                    value: hasAllActionsSelected2
-                  }
-                )
-              ] }, actionId);
-            }
-          ) }),
-          isModalOpen && /* @__PURE__ */ jsx(
-            ConditionsModal,
-            {
-              headerBreadCrumbs: [label, "Settings.permissions.conditions.conditions"],
-              actions: checkboxesActions,
-              isFormDisabled,
-              onClosed: handleModalClose,
-              onToggle: handleToggleModalIsOpen
-            }
-          )
-        ]
-      }
-    ),
-    /* @__PURE__ */ jsx(Box, { transform: "translateY(10px)", right: "9px", position: "absolute", children: /* @__PURE__ */ jsx(
-      ConditionsButton,
-      {
-        onClick: handleToggleModalIsOpen,
-        hasConditions: doesConditionButtonHasConditions
-      }
-    ) })
-  ] });
-};
-const generateCheckboxesActions = (availableActions, modifiedData, pathToData) => {
-  return availableActions.map(({ actionId, isDisplayed, applyToProperties, label }) => {
-    if (!isDisplayed) {
-      return { actionId, hasSomeActionsSelected: false, isDisplayed };
-    }
-    const baseCheckboxNameArray = [...pathToData.split(".."), actionId];
-    const checkboxNameArray = isEmpty(applyToProperties) ? [...baseCheckboxNameArray, "properties", "enabled"] : baseCheckboxNameArray;
-    const conditionsValue = get(modifiedData, [...baseCheckboxNameArray, "conditions"], null);
-    const baseCheckboxAction = {
-      actionId,
-      checkboxName: checkboxNameArray.join(".."),
-      hasConditions: createArrayOfValues(conditionsValue).some((val) => val),
-      isDisplayed,
-      label,
-      pathToConditionsObject: baseCheckboxNameArray
-    };
-    if (isEmpty(applyToProperties)) {
-      const value = get(modifiedData, checkboxNameArray, false);
-      return {
-        ...baseCheckboxAction,
-        hasAllActionsSelected: value,
-        hasSomeActionsSelected: value,
-        isParentCheckbox: false
-      };
-    }
-    const mainData = get(modifiedData, checkboxNameArray, null);
-    const { hasAllActionsSelected, hasSomeActionsSelected } = getCheckboxState(mainData);
-    return {
-      ...baseCheckboxAction,
-      hasAllActionsSelected,
-      hasSomeActionsSelected,
-      isParentCheckbox: true
-    };
-  });
-};
-const activeRowStyle = (theme, isActive) => `
-  ${Wrapper} {
-    background-color: ${theme.colors.primary100};
-    color: ${theme.colors.primary600};
-    border-radius: ${isActive ? "2px 2px 0 0" : "2px"};
-  }
-  ${Chevron} {
-    display: flex;
-  }
-  ${ConditionsButton} {
-    display: block;
-  }
-  &:hover {
-    ${activeStyle(theme)}
-  }
-
-  &:focus-within {
-    ${() => activeRowStyle(theme, isActive)}
-  }
-`;
-const Wrapper = styled(Flex)`
-  border: 1px solid transparent;
-`;
-const BoxWrapper = styled.div`
-  display: inline-flex;
-  min-width: 100%;
-
-  ${ConditionsButton} {
-    display: none;
-  }
-  ${({ isActive, theme }) => isActive && activeRowStyle(theme, isActive)}
-  &:hover {
-    ${({ theme, isActive }) => activeRowStyle(theme, isActive)}
-  }
-`;
-const Cell = styled(Flex)`
-  width: ${cellWidth};
-  position: relative;
-`;
-const Chevron = styled(Box)`
-  display: none;
-  svg {
-    width: 11px;
-  }
-  * {
-    fill: ${({ theme }) => theme.colors.primary600};
-  }
-`;
-const GlobalActions = ({ actions = [], isFormDisabled, kind }) => {
-  const { formatMessage } = useIntl();
-  const { modifiedData, onChangeCollectionTypeGlobalActionCheckbox } = usePermissionsDataManager();
-  const displayedActions = actions.filter(({ subjects }) => subjects && subjects.length);
-  const checkboxesState = React.useMemo(() => {
-    const actionsIds = displayedActions.map(({ actionId }) => actionId);
-    const data = modifiedData[kind];
-    const relatedActionsData = actionsIds.reduce(
-      (acc, actionId) => {
-        Object.keys(data).forEach((ctUid) => {
-          const actionIdData = get(data, [ctUid, actionId]);
-          const actionIdState = { [ctUid]: removeConditionKeyFromData(actionIdData) };
-          if (!acc[actionId]) {
-            acc[actionId] = actionIdState;
-          } else {
-            acc[actionId] = { ...acc[actionId], ...actionIdState };
-          }
-        });
-        return acc;
-      },
-      {}
-    );
-    const checkboxesState2 = Object.keys(relatedActionsData).reduce((acc, current) => {
-      acc[current] = getCheckboxState(relatedActionsData[current]);
-      return acc;
-    }, {});
-    return checkboxesState2;
-  }, [modifiedData, displayedActions, kind]);
-  return /* @__PURE__ */ jsx(Box, { paddingBottom: 4, paddingTop: 6, style: { paddingLeft: firstRowWidth }, children: /* @__PURE__ */ jsx(Flex, { gap: 0, children: displayedActions.map(({ label, actionId }) => {
-    return /* @__PURE__ */ jsxs(
-      Flex,
-      {
-        shrink: 0,
-        width: cellWidth,
-        direction: "column",
-        alignItems: "center",
-        justifyContent: "center",
-        gap: 3,
-        children: [
-          /* @__PURE__ */ jsx(Typography, { variant: "sigma", textColor: "neutral500", children: formatMessage({
-            id: `Settings.roles.form.permissions.${label.toLowerCase()}`,
-            defaultMessage: label
-          }) }),
-          /* @__PURE__ */ jsx(
-            BaseCheckbox,
-            {
-              disabled: isFormDisabled,
-              onValueChange: (value) => {
-                onChangeCollectionTypeGlobalActionCheckbox(kind, actionId, value);
-              },
-              name: actionId,
-              "aria-label": formatMessage(
-                {
-                  id: `Settings.permissions.select-all-by-permission`,
-                  defaultMessage: "Select all {label} permissions"
-                },
-                {
-                  label: formatMessage({
-                    id: `Settings.roles.form.permissions.${label.toLowerCase()}`,
-                    defaultMessage: label
-                  })
-                }
-              ),
-              value: get(checkboxesState, [actionId, "hasAllActionsSelected"], false),
-              indeterminate: get(checkboxesState, [actionId, "hasSomeActionsSelected"], false)
-            }
-          )
-        ]
-      },
-      actionId
-    );
-  }) }) });
-};
-const ContentTypes = ({
-  isFormDisabled,
-  kind,
-  layout: { actions, subjects }
-}) => {
-  const sortedSubjects = [...subjects].sort((a, b) => a.label.localeCompare(b.label));
-  return /* @__PURE__ */ jsxs(StyledBox, { background: "neutral0", children: [
-    /* @__PURE__ */ jsx(GlobalActions, { actions, kind, isFormDisabled }),
-    /* @__PURE__ */ jsx(
-      ContentTypeCollapses,
-      {
-        actions,
-        isFormDisabled,
-        pathToData: kind,
-        subjects: sortedSubjects
-      }
-    )
-  ] });
-};
-const StyledBox = styled(Box)`
-  overflow-x: auto;
-`;
-const PluginsAndSettingsPermissions = ({
-  layout,
-  ...restProps
-}) => {
-  const [openedCategory, setOpenedCategory] = React.useState(null);
-  const handleOpenCategory = (categoryName) => {
-    setOpenedCategory(categoryName === openedCategory ? null : categoryName);
-  };
-  return /* @__PURE__ */ jsx(Box, { padding: 6, background: "neutral0", children: layout.map(({ category, categoryId, childrenForm }, index) => {
-    return /* @__PURE__ */ jsx(
-      Row,
-      {
-        childrenForm,
-        isOpen: openedCategory === category,
-        isWhite: index % 2 === 1,
-        name: category,
-        onOpenCategory: handleOpenCategory,
-        pathToData: [restProps.kind, categoryId],
-        ...restProps
-      },
-      category
-    );
-  }) });
-};
-const Row = ({
-  childrenForm,
-  kind,
-  name,
-  isOpen = false,
-  isFormDisabled = false,
-  isWhite,
-  onOpenCategory,
-  pathToData
-}) => {
-  const { formatMessage } = useIntl();
-  const handleClick = () => {
-    onOpenCategory(name);
-  };
-  const categoryName = name.split("::").pop() ?? "";
-  return /* @__PURE__ */ jsxs(
-    Accordion,
-    {
-      expanded: isOpen,
-      onToggle: handleClick,
-      id: `accordion-${name}`,
-      variant: isWhite ? "primary" : "secondary",
-      children: [
-        /* @__PURE__ */ jsx(
-          AccordionToggle,
-          {
-            title: capitalise(categoryName),
-            description: `${formatMessage(
-              { id: "Settings.permissions.category", defaultMessage: categoryName },
-              { category: categoryName }
-            )} ${kind === "plugins" ? "plugin" : kind}`
-          }
-        ),
-        /* @__PURE__ */ jsx(AccordionContent, { children: /* @__PURE__ */ jsx(Box, { padding: 6, children: childrenForm.map(({ actions, subCategoryName, subCategoryId }) => /* @__PURE__ */ jsx(
-          SubCategory,
-          {
-            actions,
-            categoryName,
-            isFormDisabled,
-            subCategoryName,
-            pathToData: [...pathToData, subCategoryId]
-          },
-          subCategoryName
-        )) }) })
-      ]
-    }
-  );
-};
-const SubCategory = ({
-  actions = [],
-  categoryName,
-  isFormDisabled,
-  subCategoryName,
-  pathToData
-}) => {
-  const [isModalOpen, setModalOpen] = React.useState(false);
-  const { modifiedData, onChangeParentCheckbox, onChangeSimpleCheckbox } = usePermissionsDataManager();
-  const { formatMessage } = useIntl();
-  const mainData = get(modifiedData, pathToData, {});
-  const dataWithoutCondition = React.useMemo(() => {
-    return Object.keys(mainData).reduce((acc, current) => {
-      acc[current] = removeConditionKeyFromData(mainData[current]);
-      return acc;
-    }, {});
-  }, [mainData]);
-  const { hasAllActionsSelected, hasSomeActionsSelected } = getCheckboxState(dataWithoutCondition);
-  const handleToggleModalIsOpen = () => {
-    setModalOpen((s) => !s);
-  };
-  const handleModalClose = () => {
-    setModalOpen(false);
-  };
-  const formattedActions = React.useMemo(() => {
-    return actions.map((action) => {
-      const checkboxName = [...pathToData, action.action, "properties", "enabled"];
-      const checkboxValue = get(modifiedData, checkboxName, false);
-      const conditionValue = get(modifiedData, [...pathToData, action.action, "conditions"], {});
-      const hasConditions = createArrayOfValues(conditionValue).some((val) => val);
-      return {
-        ...action,
-        isDisplayed: checkboxValue,
-        checkboxName: checkboxName.join(".."),
-        hasSomeActionsSelected: checkboxValue,
-        value: checkboxValue,
-        hasConditions,
-        label: action.displayName,
-        actionId: action.action,
-        pathToConditionsObject: [...pathToData, action.action]
-      };
-    });
-  }, [actions, modifiedData, pathToData]);
-  const datum = get(modifiedData, [...pathToData], {});
-  const doesButtonHasCondition = createArrayOfValues(
-    Object.entries(datum).reduce((acc, current) => {
-      const [catName, { conditions }] = current;
-      acc[catName] = conditions;
-      return acc;
-    }, {})
-  ).some((val) => val);
-  return /* @__PURE__ */ jsxs(Fragment, { children: [
-    /* @__PURE__ */ jsxs(Box, { children: [
-      /* @__PURE__ */ jsxs(Flex, { justifyContent: "space-between", alignItems: "center", children: [
-        /* @__PURE__ */ jsx(Box, { paddingRight: 4, children: /* @__PURE__ */ jsx(Typography, { variant: "sigma", textColor: "neutral600", children: subCategoryName }) }),
-        /* @__PURE__ */ jsx(Border, { flex: 1 }),
-        /* @__PURE__ */ jsx(Box, { paddingLeft: 4, children: /* @__PURE__ */ jsx(
-          Checkbox,
-          {
-            name: pathToData.join(".."),
-            disabled: isFormDisabled,
-            onValueChange: (value) => {
-              onChangeParentCheckbox({
-                target: {
-                  name: pathToData.join(".."),
-                  value
-                }
-              });
-            },
-            indeterminate: hasSomeActionsSelected,
-            value: hasAllActionsSelected,
-            children: formatMessage({ id: "app.utils.select-all", defaultMessage: "Select all" })
-          }
-        ) })
-      ] }),
-      /* @__PURE__ */ jsxs(Flex, { paddingTop: 6, paddingBottom: 6, children: [
-        /* @__PURE__ */ jsx(Grid, { gap: 2, style: { flex: 1 }, children: formattedActions.map(({ checkboxName, value, action, displayName, hasConditions }) => {
-          return /* @__PURE__ */ jsx(GridItem, { col: 3, children: /* @__PURE__ */ jsx(CheckboxWrapper, { disabled: isFormDisabled, hasConditions, children: /* @__PURE__ */ jsx(
-            Checkbox,
-            {
-              name: checkboxName,
-              disabled: isFormDisabled,
-              onValueChange: (value2) => {
-                onChangeSimpleCheckbox({
-                  target: {
-                    name: checkboxName,
-                    value: value2
-                  }
-                });
-              },
-              value,
-              children: displayName
-            }
-          ) }) }, action);
-        }) }),
-        /* @__PURE__ */ jsx(
-          ConditionsButton,
-          {
-            hasConditions: doesButtonHasCondition,
-            onClick: handleToggleModalIsOpen
-          }
-        )
-      ] })
-    ] }),
-    isModalOpen && /* @__PURE__ */ jsx(
-      ConditionsModal,
-      {
-        headerBreadCrumbs: [categoryName, subCategoryName],
-        actions: formattedActions,
-        isFormDisabled,
-        onClosed: handleModalClose,
-        onToggle: handleToggleModalIsOpen
-      }
-    )
-  ] });
-};
-const Border = styled(Box)`
-  align-self: center;
-  border-top: 1px solid ${({ theme }) => theme.colors.neutral150};
-`;
-const CheckboxWrapper = styled.div`
-  position: relative;
-  word-break: keep-all;
-  ${({ hasConditions, disabled, theme }) => hasConditions && `
-    &:before {
-      content: '';
-      position: absolute;
-      top: ${-4 / 16}rem;
-      left: ${-8 / 16}rem;
-      width: ${6 / 16}rem;
-      height: ${6 / 16}rem;
-      border-radius: ${20 / 16}rem;
-      background: ${disabled ? theme.colors.neutral100 : theme.colors.primary600};
-    }
-  `}
-`;
-const TAB_LABELS = [
-  {
-    labelId: "app.components.LeftMenuLinkContainer.collectionTypes",
-    defaultMessage: "Collection Types",
-    id: "collectionTypes"
-  },
-  {
-    labelId: "app.components.LeftMenuLinkContainer.singleTypes",
-    id: "singleTypes",
-    defaultMessage: "Single Types"
-  },
-  {
-    labelId: "app.components.LeftMenuLinkContainer.plugins",
-    defaultMessage: "Plugins",
-    id: "plugins"
-  },
-  {
-    labelId: "app.components.LeftMenuLinkContainer.settings",
-    defaultMessage: "Settings",
-    id: "settings"
-  }
-];
-const Permissions = React.forwardRef(
-  ({ layout, isFormDisabled, permissions = [] }, api) => {
-    const [{ initialData, layouts, modifiedData }, dispatch] = React.useReducer(
-      reducer,
-      initialState,
-      () => init(layout, permissions)
-    );
-    const { formatMessage } = useIntl();
-    React.useImperativeHandle(api, () => {
-      return {
-        getPermissions() {
-          const collectionTypesDiff = difference(
-            initialData.collectionTypes,
-            modifiedData.collectionTypes
-          );
-          const singleTypesDiff = difference(initialData.singleTypes, modifiedData.singleTypes);
-          const contentTypesDiff = { ...collectionTypesDiff, ...singleTypesDiff };
-          let didUpdateConditions;
-          if (isEmpty(contentTypesDiff)) {
-            didUpdateConditions = false;
-          } else {
-            didUpdateConditions = Object.values(contentTypesDiff).some((permission = {}) => {
-              return Object.values(permission).some(
-                (permissionValue) => has(permissionValue, "conditions")
-              );
-            });
-          }
-          return { permissionsToSend: formatPermissionsForAPI(modifiedData), didUpdateConditions };
-        },
-        resetForm() {
-          dispatch({ type: "RESET_FORM" });
-        },
-        setFormAfterSubmit() {
-          dispatch({ type: "SET_FORM_AFTER_SUBMIT" });
-        }
-      };
-    });
-    const handleChangeCollectionTypeLeftActionRowCheckbox = (pathToCollectionType, propertyName, rowName, value) => {
-      dispatch({
-        type: "ON_CHANGE_COLLECTION_TYPE_ROW_LEFT_CHECKBOX",
-        pathToCollectionType,
-        propertyName,
-        rowName,
-        value
-      });
-    };
-    const handleChangeCollectionTypeGlobalActionCheckbox = (collectionTypeKind, actionId, value) => {
-      dispatch({
-        type: "ON_CHANGE_COLLECTION_TYPE_GLOBAL_ACTION_CHECKBOX",
-        collectionTypeKind,
-        actionId,
-        value
-      });
-    };
-    const handleChangeConditions = (conditions) => {
-      dispatch({ type: "ON_CHANGE_CONDITIONS", conditions });
-    };
-    const handleChangeSimpleCheckbox = React.useCallback(({ target: { name, value } }) => {
-      dispatch({
-        type: "ON_CHANGE_SIMPLE_CHECKBOX",
-        keys: name,
-        value
-      });
-    }, []);
-    const handleChangeParentCheckbox = React.useCallback(({ target: { name, value } }) => {
-      dispatch({
-        type: "ON_CHANGE_TOGGLE_PARENT_CHECKBOX",
-        keys: name,
-        value
-      });
-    }, []);
-    return /* @__PURE__ */ jsx(
-      PermissionsDataManagerProvider,
-      {
-        availableConditions: layout.conditions,
-        modifiedData,
-        onChangeConditions: handleChangeConditions,
-        onChangeSimpleCheckbox: handleChangeSimpleCheckbox,
-        onChangeParentCheckbox: handleChangeParentCheckbox,
-        onChangeCollectionTypeLeftActionRowCheckbox: handleChangeCollectionTypeLeftActionRowCheckbox,
-        onChangeCollectionTypeGlobalActionCheckbox: handleChangeCollectionTypeGlobalActionCheckbox,
-        children: /* @__PURE__ */ jsxs(
-          TabGroup,
-          {
-            id: "tabs",
-            label: formatMessage({
-              id: "Settings.permissions.users.tabs.label",
-              defaultMessage: "Tabs Permissions"
-            }),
-            children: [
-              /* @__PURE__ */ jsx(Tabs, { children: TAB_LABELS.map((tabLabel) => /* @__PURE__ */ jsx(Tab, { children: formatMessage({ id: tabLabel.labelId, defaultMessage: tabLabel.defaultMessage }) }, tabLabel.id)) }),
-              /* @__PURE__ */ jsxs(TabPanels, { style: { position: "relative" }, children: [
-                /* @__PURE__ */ jsx(TabPanel, { children: /* @__PURE__ */ jsx(
-                  ContentTypes,
-                  {
-                    layout: layouts.collectionTypes,
-                    kind: "collectionTypes",
-                    isFormDisabled
-                  }
-                ) }),
-                /* @__PURE__ */ jsx(TabPanel, { children: /* @__PURE__ */ jsx(
-                  ContentTypes,
-                  {
-                    layout: layouts.singleTypes,
-                    kind: "singleTypes",
-                    isFormDisabled
-                  }
-                ) }),
-                /* @__PURE__ */ jsx(TabPanel, { children: /* @__PURE__ */ jsx(
-                  PluginsAndSettingsPermissions,
-                  {
-                    layout: layouts.plugins,
-                    kind: "plugins",
-                    isFormDisabled
-                  }
-                ) }),
-                /* @__PURE__ */ jsx(TabPanel, { children: /* @__PURE__ */ jsx(
-                  PluginsAndSettingsPermissions,
-                  {
-                    layout: layouts.settings,
-                    kind: "settings",
-                    isFormDisabled
-                  }
-                ) })
-              ] })
-            ]
-          }
-        )
-      }
-    );
-  }
-);
-const initialState = {
-  initialData: {},
-  modifiedData: {},
-  layouts: {}
-};
-const reducer = (state, action) => produce(state, (draftState) => {
-  switch (action.type) {
-    case "ON_CHANGE_COLLECTION_TYPE_GLOBAL_ACTION_CHECKBOX": {
-      const { collectionTypeKind, actionId, value } = action;
-      const pathToData = ["modifiedData", collectionTypeKind];
-      Object.keys(get(state, pathToData)).forEach((collectionType) => {
-        const collectionTypeActionData = get(
-          state,
-          [...pathToData, collectionType, actionId],
-          void 0
-        );
-        if (collectionTypeActionData) {
-          let updatedValues = updateValues(collectionTypeActionData, value);
-          if (!value && updatedValues.conditions) {
-            const updatedConditions = updateValues(updatedValues.conditions, false);
-            updatedValues = { ...updatedValues, conditions: updatedConditions };
-          }
-          set(draftState, [...pathToData, collectionType, actionId], updatedValues);
-        }
-      });
-      break;
-    }
-    case "ON_CHANGE_COLLECTION_TYPE_ROW_LEFT_CHECKBOX": {
-      const { pathToCollectionType, propertyName, rowName, value } = action;
-      let nextModifiedDataState = cloneDeep(state.modifiedData);
-      const pathToModifiedDataCollectionType = pathToCollectionType.split("..");
-      const objToUpdate = get(nextModifiedDataState, pathToModifiedDataCollectionType, {});
-      Object.keys(objToUpdate).forEach((actionId) => {
-        if (has(objToUpdate[actionId], `properties.${propertyName}`)) {
-          const objValue = get(objToUpdate, [actionId, "properties", propertyName, rowName]);
-          const pathToDataToSet = [
-            ...pathToModifiedDataCollectionType,
-            actionId,
-            "properties",
-            propertyName,
-            rowName
-          ];
-          if (!isObject(objValue)) {
-            set(nextModifiedDataState, pathToDataToSet, value);
-          } else {
-            const updatedValue = updateValues(objValue, value);
-            set(nextModifiedDataState, pathToDataToSet, updatedValue);
-          }
-        }
-      });
-      if (!value) {
-        nextModifiedDataState = updateConditionsToFalse(nextModifiedDataState);
-      }
-      set(draftState, "modifiedData", nextModifiedDataState);
-      break;
-    }
-    case "ON_CHANGE_CONDITIONS": {
-      Object.entries(action.conditions).forEach((array) => {
-        const [stringPathToData, conditionsToUpdate] = array;
-        set(
-          draftState,
-          ["modifiedData", ...stringPathToData.split(".."), "conditions"],
-          conditionsToUpdate
-        );
-      });
-      break;
-    }
-    case "ON_CHANGE_SIMPLE_CHECKBOX": {
-      let nextModifiedDataState = cloneDeep(state.modifiedData);
-      set(nextModifiedDataState, [...action.keys.split("..")], action.value);
-      if (!action.value) {
-        nextModifiedDataState = updateConditionsToFalse(nextModifiedDataState);
-      }
-      set(draftState, "modifiedData", nextModifiedDataState);
-      break;
-    }
-    case "ON_CHANGE_TOGGLE_PARENT_CHECKBOX": {
-      const { keys, value } = action;
-      const pathToValue = [...keys.split("..")];
-      let nextModifiedDataState = cloneDeep(state.modifiedData);
-      const oldValues = get(nextModifiedDataState, pathToValue, {});
-      const updatedValues = updateValues(oldValues, value);
-      set(nextModifiedDataState, pathToValue, updatedValues);
-      if (!value) {
-        nextModifiedDataState = updateConditionsToFalse(nextModifiedDataState);
-      }
-      set(draftState, ["modifiedData"], nextModifiedDataState);
-      break;
-    }
-    case "RESET_FORM": {
-      draftState.modifiedData = state.initialData;
-      break;
-    }
-    case "SET_FORM_AFTER_SUBMIT": {
-      draftState.initialData = state.modifiedData;
-      break;
-    }
-    default:
-      return draftState;
-  }
-});
-const init = (layout, permissions) => {
-  const {
-    conditions,
-    sections: { collectionTypes, singleTypes, plugins, settings }
-  } = layout;
-  const layouts = {
-    collectionTypes,
-    singleTypes,
-    plugins: formatLayout(plugins, "plugin"),
-    settings: formatLayout(settings, "category")
-  };
-  const defaultForm = {
-    collectionTypes: createDefaultCTForm(collectionTypes, conditions, permissions),
-    singleTypes: createDefaultCTForm(singleTypes, conditions, permissions),
-    plugins: createDefaultForm(layouts.plugins, conditions, permissions),
-    settings: createDefaultForm(layouts.settings, conditions, permissions)
-  };
-  return {
-    initialData: defaultForm,
-    modifiedData: defaultForm,
-    layouts
-  };
-};
-export {
-  Permissions as P
-};
-//# sourceMappingURL=Permissions-9WfQZ8_F.mjs.map