@mercurjs/dashboard-shared 2.3.6-canary.6 → 2.3.6-canary.7

package/dist/index.js

@@ -13313,6 +13313,8 @@ var TransferOwnershipSchema = z.object({
 // src/components/common/action-menu/action-menu.tsx
 import { DropdownMenu, IconButton, clx } from "@medusajs/ui";
 import { EllipsisHorizontal } from "@medusajs/icons";
+import { useContext as useContext2, useMemo as useMemo2 } from "react";
+import { useTranslation } from "react-i18next";
 import { Link } from "react-router-dom";
 
 // src/components/common/conditional-tooltip/conditional-tooltip.tsx
@@ -13361,14 +13363,100 @@ var useDocumentDirection = () => {
   return direction;
 };
 
+// src/permissions/action-permissions.ts
+import { useContext, useMemo } from "react";
+
+// ../dashboard-sdk/dist/index.js
+var PERMISSION_RIGHT_RANK = {
+  view: 1,
+  edit: 2,
+  manage: 3
+};
+function parsePermission(permission) {
+  const index = permission.lastIndexOf(":");
+  if (index <= 0) {
+    return null;
+  }
+  const right = permission.slice(index + 1);
+  if (!(right in PERMISSION_RIGHT_RANK)) {
+    return null;
+  }
+  return {
+    key: permission.slice(0, index),
+    right
+  };
+}
+function satisfiesPermission(permissions, key, right) {
+  const granted = permissions[key];
+  return !!granted && PERMISSION_RIGHT_RANK[granted] >= PERMISSION_RIGHT_RANK[right];
+}
+
+// src/permissions/permission-check.ts
+var toPermissionList = (permission) => !permission ? [] : Array.isArray(permission) ? permission : [permission];
+var isPermitted = (checks, permission, requireAll = false) => {
+  const list = toPermissionList(permission);
+  if (!checks || !list.length) {
+    return true;
+  }
+  return requireAll ? checks.hasAllPermissions(list) : checks.hasAnyPermission(list);
+};
+var permissionMapAllows = (map, permission, requireAll = true) => {
+  const list = toPermissionList(permission);
+  if (!map || !list.length) {
+    return true;
+  }
+  const allows = (entry) => {
+    const parsed = parsePermission(entry);
+    return !!parsed && satisfiesPermission(map, parsed.key, parsed.right);
+  };
+  return requireAll ? list.every(allows) : list.some(allows);
+};
+var isForbidden = (error) => !!error && typeof error === "object" && error.status === 403;
+
+// src/permissions/permissions-context.tsx
+import { createContext } from "react";
+var PermissionsContext = createContext(
+  null
+);
+
+// src/permissions/action-permissions.ts
+var applyActionPermissions = (groups, checks, deniedTooltip) => groups.map((group) => ({
+  ...group,
+  actions: group.actions.map(
+    (action) => isPermitted(checks, action.permission, action.requireAll) ? action : { ...action, disabled: true, disabledTooltip: deniedTooltip }
+  )
+}));
+var filterCommandsByPermission = (commands, checks) => commands.filter(
+  (command) => isPermitted(checks, command.permission, command.requireAll)
+).map(
+  ({ permission: _permission, requireAll: _requireAll, ...command }) => command
+);
+var usePermittedCommands = (commands) => {
+  const context = useContext(PermissionsContext);
+  return useMemo(
+    () => filterCommandsByPermission(commands, context),
+    [commands, context]
+  );
+};
+
 // src/components/common/action-menu/action-menu.tsx
 import { jsx as jsx2, jsxs } from "react/jsx-runtime";
 var ActionMenu = ({
-  groups,
+  groups: declaredGroups,
   variant = "transparent",
   children
 }) => {
   const direction = useDocumentDirection();
+  const { t: t2 } = useTranslation();
+  const permissions = useContext2(PermissionsContext);
+  const groups = useMemo2(
+    () => applyActionPermissions(
+      declaredGroups,
+      permissions,
+      t2("permissions.accessDenied.action")
+    ),
+    [declaredGroups, permissions, t2]
+  );
   const inner = children ?? /* @__PURE__ */ jsx2(IconButton, { size: "small", variant, children: /* @__PURE__ */ jsx2(EllipsisHorizontal, {}) });
   return /* @__PURE__ */ jsxs(DropdownMenu, { dir: direction, children: [
     /* @__PURE__ */ jsx2(DropdownMenu.Trigger, { asChild: true, children: inner }),
@@ -13436,7 +13524,7 @@ var ActionMenu = ({
 
 // src/components/common/badge-list-summary/badge-list-summary.tsx
 import { Badge, Tooltip as Tooltip2, clx as clx2 } from "@medusajs/ui";
-import { useTranslation } from "react-i18next";
+import { useTranslation as useTranslation2 } from "react-i18next";
 import { jsx as jsx3, jsxs as jsxs2 } from "react/jsx-runtime";
 var BadgeListSummary = ({
   list,
@@ -13445,7 +13533,7 @@ var BadgeListSummary = ({
   rounded = false,
   n = 2
 }) => {
-  const { t: t2 } = useTranslation();
+  const { t: t2 } = useTranslation2();
   const title = t2("general.plusCount", {
     count: list.length - n
   });
@@ -13487,12 +13575,12 @@ var BadgeListSummary = ({
 // src/components/common/chip-group/chip-group.tsx
 import { XMarkMini } from "@medusajs/icons";
 import { Button, clx as clx3 } from "@medusajs/ui";
-import { Children, createContext, useContext } from "react";
-import { useTranslation as useTranslation2 } from "react-i18next";
+import { Children, createContext as createContext2, useContext as useContext3 } from "react";
+import { useTranslation as useTranslation3 } from "react-i18next";
 import { jsx as jsx4, jsxs as jsxs3 } from "react/jsx-runtime";
-var GroupContext = createContext(null);
+var GroupContext = createContext2(null);
 var useGroupContext = () => {
-  const context = useContext(GroupContext);
+  const context = useContext3(GroupContext);
   if (!context) {
     throw new Error("useGroupContext must be used within a ChipGroup component");
   }
@@ -13505,7 +13593,7 @@ var Group = ({
   className,
   children
 }) => {
-  const { t: t2 } = useTranslation2();
+  const { t: t2 } = useTranslation3();
   const showClearAll = !!onClearAll && Children.count(children) > 0;
   return /* @__PURE__ */ jsx4(GroupContext.Provider, { value: { onRemove, variant }, children: /* @__PURE__ */ jsxs3(
     "ul",
@@ -13568,7 +13656,7 @@ var ChipGroup = Object.assign(Group, { Chip });
 // src/components/common/confirm-prompt/confirm-prompt.tsx
 import { Label, Prompt, Textarea } from "@medusajs/ui";
 import { useEffect as useEffect2, useState as useState2 } from "react";
-import { useTranslation as useTranslation3 } from "react-i18next";
+import { useTranslation as useTranslation4 } from "react-i18next";
 import { jsx as jsx5, jsxs as jsxs4 } from "react/jsx-runtime";
 var ConfirmPrompt = ({
   open,
@@ -13585,7 +13673,7 @@ var ConfirmPrompt = ({
   isLoading = false,
   onConfirm
 }) => {
-  const { t: t2 } = useTranslation3();
+  const { t: t2 } = useTranslation4();
   const [note, setNote] = useState2(defaultNote);
   useEffect2(() => {
     if (open) {
@@ -13646,11 +13734,11 @@ var ConfirmPrompt = ({
 
 // src/components/common/customer-info/customer-info.tsx
 import { Avatar, Copy, Text } from "@medusajs/ui";
-import { useTranslation as useTranslation4 } from "react-i18next";
+import { useTranslation as useTranslation5 } from "react-i18next";
 import { Link as Link2 } from "react-router-dom";
 import { jsx as jsx6, jsxs as jsxs5 } from "react/jsx-runtime";
 var ID = ({ data }) => {
-  const { t: t2 } = useTranslation4();
+  const { t: t2 } = useTranslation5();
   const id = data.customer_id;
   const name = getOrderCustomer(data);
   const email = data.email;
@@ -13679,7 +13767,7 @@ var ID = ({ data }) => {
   ] });
 };
 var Company = ({ data }) => {
-  const { t: t2 } = useTranslation4();
+  const { t: t2 } = useTranslation5();
   const company = data.shipping_address?.company || data.billing_address?.company;
   if (!company) {
     return null;
@@ -13690,7 +13778,7 @@ var Company = ({ data }) => {
   ] });
 };
 var Contact = ({ data }) => {
-  const { t: t2 } = useTranslation4();
+  const { t: t2 } = useTranslation5();
   const phone = data.shipping_address?.phone || data.billing_address?.phone;
   const email = data.email || "";
   return /* @__PURE__ */ jsxs5("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-start px-6 py-4", children: [
@@ -13727,7 +13815,7 @@ var AddressPrint = ({
   address,
   type
 }) => {
-  const { t: t2 } = useTranslation4();
+  const { t: t2 } = useTranslation5();
   return /* @__PURE__ */ jsxs5("div", { className: "text-ui-fg-subtle grid grid-cols-2 items-start px-6 py-4", children: [
     /* @__PURE__ */ jsx6(Text, { size: "small", leading: "compact", weight: "plus", children: type === "shipping" ? t2("addresses.shippingAddress.label") : t2("addresses.billingAddress.label") }),
     address ? /* @__PURE__ */ jsxs5("div", { className: "grid grid-cols-[1fr_20px] items-start gap-x-2", children: [
@@ -13748,7 +13836,7 @@ var AddressPrint = ({
   ] });
 };
 var Addresses = ({ data }) => {
-  const { t: t2 } = useTranslation4();
+  const { t: t2 } = useTranslation5();
   return /* @__PURE__ */ jsxs5("div", { className: "divide-y", children: [
     /* @__PURE__ */ jsx6(AddressPrint, { address: data.shipping_address, type: "shipping" }),
     !isSameAddress(data.shipping_address, data.billing_address) ? /* @__PURE__ */ jsx6(AddressPrint, { address: data.billing_address, type: "billing" }) : /* @__PURE__ */ jsxs5("div", { className: "grid grid-cols-2 items-center px-6 py-4", children: [
@@ -13788,7 +13876,7 @@ var getOrderCustomer = (obj) => {
 
 // src/components/common/date-range-display/date-range-display.tsx
 import { Text as Text2, clx as clx4 } from "@medusajs/ui";
-import { useTranslation as useTranslation5 } from "react-i18next";
+import { useTranslation as useTranslation6 } from "react-i18next";
 
 // src/hooks/use-date.tsx
 import { format, formatDistance, sub } from "date-fns";
@@ -13825,7 +13913,7 @@ var DateRangeDisplay = ({
 }) => {
   const startDate = startsAt ? new Date(startsAt) : null;
   const endDate = endsAt ? new Date(endsAt) : null;
-  const { t: t2 } = useTranslation5();
+  const { t: t2 } = useTranslation6();
   const { getFullDate } = useDate();
   return /* @__PURE__ */ jsxs6("div", { className: "grid gap-3 md:grid-cols-2", children: [
     /* @__PURE__ */ jsxs6("div", { className: "shadow-elevation-card-rest bg-ui-bg-component text-ui-fg-subtle flex items-center gap-x-3 rounded-md px-3 py-1.5", children: [
@@ -13864,16 +13952,31 @@ var Bar = ({ date }) => {
 };
 
 // src/components/common/display-id/display-id.tsx
-import { useTranslation as useTranslation6 } from "react-i18next";
+import { useTranslation as useTranslation7 } from "react-i18next";
 import { useState as useState3 } from "react";
 import copy from "copy-to-clipboard";
 import { clx as clx5, toast, Tooltip as Tooltip3 } from "@medusajs/ui";
 import { jsx as jsx8, jsxs as jsxs7 } from "react/jsx-runtime";
 
+// src/permissions/use-permission-gate.tsx
+import { useContext as useContext4 } from "react";
+import { useTranslation as useTranslation8 } from "react-i18next";
+var usePermissionGate = (permission, requireAll = false) => {
+  const { t: t2 } = useTranslation8();
+  const context = useContext4(PermissionsContext);
+  const allowed = isPermitted(context, permission, requireAll);
+  return {
+    allowed,
+    denied: !allowed,
+    tooltip: allowed ? void 0 : t2("permissions.accessDenied.action")
+  };
+};
+
 // src/components/common/empty-table-content/empty-table-content.tsx
+import { cloneElement } from "react";
 import { ExclamationCircle, MagnifyingGlass, PlusMini } from "@medusajs/icons";
-import { Button as Button2, Text as Text3, clx as clx6 } from "@medusajs/ui";
-import { useTranslation as useTranslation7 } from "react-i18next";
+import { Button as Button2, Text as Text3, clx as clx6, Tooltip as Tooltip4 } from "@medusajs/ui";
+import { useTranslation as useTranslation9 } from "react-i18next";
 import { Link as Link3 } from "react-router-dom";
 import { jsx as jsx9, jsxs as jsxs8 } from "react/jsx-runtime";
 var NoResults = ({
@@ -13882,7 +13985,7 @@ var NoResults = ({
   className,
   icon = /* @__PURE__ */ jsx9(MagnifyingGlass, {})
 }) => {
-  const { t: t2 } = useTranslation7();
+  const { t: t2 } = useTranslation9();
   return /* @__PURE__ */ jsx9(
     "div",
     {
@@ -13898,8 +14001,18 @@ var NoResults = ({
     }
   );
 };
-var DefaultButton = ({ action }) => action && /* @__PURE__ */ jsx9(Link3, { to: action.to, children: /* @__PURE__ */ jsx9(Button2, { variant: "secondary", size: "small", children: action.label }) });
-var TransparentIconLeftButton = ({ action }) => action && /* @__PURE__ */ jsx9(Link3, { to: action.to, children: /* @__PURE__ */ jsxs8(Button2, { variant: "transparent", className: "text-ui-fg-interactive", children: [
+var ActionLink = ({
+  action,
+  children
+}) => {
+  const gate = usePermissionGate(action.permission);
+  if (gate.denied) {
+    return /* @__PURE__ */ jsx9(Tooltip4, { content: gate.tooltip, children: /* @__PURE__ */ jsx9("span", { className: "inline-flex", children: cloneElement(children, { disabled: true }) }) });
+  }
+  return /* @__PURE__ */ jsx9(Link3, { to: action.to, children });
+};
+var DefaultButton = ({ action }) => action && /* @__PURE__ */ jsx9(ActionLink, { action, children: /* @__PURE__ */ jsx9(Button2, { variant: "secondary", size: "small", children: action.label }) });
+var TransparentIconLeftButton = ({ action }) => action && /* @__PURE__ */ jsx9(ActionLink, { action, children: /* @__PURE__ */ jsxs8(Button2, { variant: "transparent", className: "text-ui-fg-interactive", children: [
   /* @__PURE__ */ jsx9(PlusMini, {}),
   " ",
   action.label
@@ -13912,7 +14025,7 @@ var NoRecords = ({
   buttonVariant = "default",
   icon = /* @__PURE__ */ jsx9(ExclamationCircle, { className: "text-ui-fg-subtle" })
 }) => {
-  const { t: t2 } = useTranslation7();
+  const { t: t2 } = useTranslation9();
   return /* @__PURE__ */ jsxs8(
     "div",
     {
@@ -14192,14 +14305,14 @@ import {
   Hint as HintComponent,
   Label as LabelComponent,
   Text as Text6,
-  Tooltip as Tooltip4,
+  Tooltip as Tooltip5,
   clx as clx8
 } from "@medusajs/ui";
 import { Slot } from "radix-ui";
 import {
-  createContext as createContext2,
+  createContext as createContext3,
   forwardRef,
-  useContext as useContext2,
+  useContext as useContext5,
   useId
 } from "react";
 import {
@@ -14208,10 +14321,10 @@ import {
   useFormContext,
   useFormState
 } from "react-hook-form";
-import { useTranslation as useTranslation8 } from "react-i18next";
+import { useTranslation as useTranslation10 } from "react-i18next";
 import { jsx as jsx12, jsxs as jsxs11 } from "react/jsx-runtime";
 var Provider = FormProvider;
-var FormFieldContext = createContext2(
+var FormFieldContext = createContext3(
   {}
 );
 var Field = ({
@@ -14219,12 +14332,12 @@ var Field = ({
 }) => {
   return /* @__PURE__ */ jsx12(FormFieldContext.Provider, { value: { name: props.name }, children: /* @__PURE__ */ jsx12(Controller, { ...props }) });
 };
-var FormItemContext = createContext2(
+var FormItemContext = createContext3(
   {}
 );
 var useFormField = () => {
-  const fieldContext = useContext2(FormFieldContext);
-  const itemContext = useContext2(FormItemContext);
+  const fieldContext = useContext5(FormFieldContext);
+  const itemContext = useContext5(FormItemContext);
   const { getFieldState } = useFormContext();
   const formState = useFormState({ name: fieldContext.name });
   const fieldState = getFieldState(fieldContext.name, formState);
@@ -14258,7 +14371,7 @@ var Item = forwardRef(
 Item.displayName = "Form.Item";
 var Label2 = forwardRef(({ className, optional = false, tooltip, icon, ...props }, ref) => {
   const { formLabelId, formItemId } = useFormField();
-  const { t: t2 } = useTranslation8();
+  const { t: t2 } = useTranslation10();
   return /* @__PURE__ */ jsxs11("div", { className: "flex items-center gap-x-1", children: [
     /* @__PURE__ */ jsx12(
       LabelComponent,
@@ -14272,7 +14385,7 @@ var Label2 = forwardRef(({ className, optional = false, tooltip, icon, ...props
         ...props
       }
     ),
-    tooltip && /* @__PURE__ */ jsx12(Tooltip4, { content: tooltip, children: /* @__PURE__ */ jsx12(InformationCircleSolid, { className: "text-ui-fg-muted" }) }),
+    tooltip && /* @__PURE__ */ jsx12(Tooltip5, { content: tooltip, children: /* @__PURE__ */ jsx12(InformationCircleSolid, { className: "text-ui-fg-muted" }) }),
     icon,
     optional && /* @__PURE__ */ jsxs11(Text6, { size: "small", leading: "compact", className: "text-ui-fg-muted", children: [
       "(",
@@ -14409,7 +14522,7 @@ function ImageAvatar({
 
 // src/components/common/infinite-list/infinite-list.tsx
 import { useInfiniteQuery } from "@tanstack/react-query";
-import { useEffect as useEffect3, useMemo, useRef as useRef2 } from "react";
+import { useEffect as useEffect3, useMemo as useMemo3, useRef as useRef2 } from "react";
 import { toast as toast2 } from "@medusajs/ui";
 import { Spinner as Spinner2 } from "@medusajs/icons";
 import { jsx as jsx15, jsxs as jsxs12 } from "react/jsx-runtime";
@@ -14451,7 +14564,7 @@ var InfiniteList = ({
     },
     ...queryOptions
   });
-  const items = useMemo(() => {
+  const items = useMemo3(() => {
     return data?.pages.flatMap((p) => p[responseKey]) ?? [];
   }, [data, responseKey]);
   const parentRef = useRef2(null);
@@ -14539,10 +14652,10 @@ import {
 } from "@medusajs/ui";
 import Primitive from "@uiw/react-json-view";
 import { Suspense, useState as useState5 } from "react";
-import { Trans, useTranslation as useTranslation9 } from "react-i18next";
+import { Trans, useTranslation as useTranslation11 } from "react-i18next";
 import { jsx as jsx16, jsxs as jsxs13 } from "react/jsx-runtime";
 var JsonViewSection = ({ data }) => {
-  const { t: t2 } = useTranslation9();
+  const { t: t2 } = useTranslation11();
   const numberOfKeys = Object.keys(data).length;
   return /* @__PURE__ */ jsxs13(Container, { className: "flex items-center justify-between px-6 py-4", children: [
     /* @__PURE__ */ jsxs13("div", { className: "flex items-center gap-x-4", children: [
@@ -14721,8 +14834,8 @@ var LinkButton = ({
 };
 
 // src/components/common/list-summary/list-summary.tsx
-import { Tooltip as Tooltip5, clx as clx12 } from "@medusajs/ui";
-import { useTranslation as useTranslation10 } from "react-i18next";
+import { Tooltip as Tooltip6, clx as clx12 } from "@medusajs/ui";
+import { useTranslation as useTranslation12 } from "react-i18next";
 import { jsx as jsx18, jsxs as jsxs14 } from "react/jsx-runtime";
 var ListSummary = ({
   list,
@@ -14731,7 +14844,7 @@ var ListSummary = ({
   inline,
   n = 2
 }) => {
-  const { t: t2 } = useTranslation10();
+  const { t: t2 } = useTranslation12();
   const title = t2("general.plusCountMore", {
     count: list.length - n
   });
@@ -14751,7 +14864,7 @@ var ListSummary = ({
       children: [
         /* @__PURE__ */ jsx18("div", { className: "flex-1 truncate", children: /* @__PURE__ */ jsx18("span", { className: "truncate", children: list.slice(0, n).join(", ") }) }),
         list.length > n && /* @__PURE__ */ jsx18("div", { className: "whitespace-nowrap", children: /* @__PURE__ */ jsx18(
-          Tooltip5,
+          Tooltip6,
           {
             content: /* @__PURE__ */ jsx18("ul", { children: list.slice(n).map((c) => /* @__PURE__ */ jsx18("li", { children: c }, c)) }),
             children: /* @__PURE__ */ jsx18("span", { className: "cursor-default whitespace-nowrap", children: title })
@@ -14787,14 +14900,14 @@ import { jsx as jsx20, jsxs as jsxs16 } from "react/jsx-runtime";
 // src/components/common/metadata-section/metadata-section.tsx
 import { ArrowUpRightOnBox as ArrowUpRightOnBox2 } from "@medusajs/icons";
 import { Badge as Badge3, Container as Container2, Heading as Heading2, IconButton as IconButton4 } from "@medusajs/ui";
-import { useTranslation as useTranslation11 } from "react-i18next";
+import { useTranslation as useTranslation13 } from "react-i18next";
 import { Link as Link5 } from "react-router-dom";
 import { jsx as jsx21, jsxs as jsxs17 } from "react/jsx-runtime";
 var MetadataSection = ({
   data,
   href = "metadata/edit"
 }) => {
-  const { t: t2 } = useTranslation11();
+  const { t: t2 } = useTranslation13();
   if (!data) {
     return null;
   }
@@ -14826,14 +14939,14 @@ var MetadataSection = ({
 import { ExclamationCircleSolid } from "@medusajs/icons";
 import { Container as Container3, Heading as Heading3, Text as Text9, clx as clx15 } from "@medusajs/ui";
 import { useQueries } from "@tanstack/react-query";
-import { Fragment as Fragment3, useMemo as useMemo3 } from "react";
-import { useTranslation as useTranslation13 } from "react-i18next";
+import { Fragment as Fragment3, useMemo as useMemo5 } from "react";
+import { useTranslation as useTranslation15 } from "react-i18next";
 
 // src/components/common/rich-text/rich-text.tsx
 import { Button as Button3, Text as Text8, clx as clx13 } from "@medusajs/ui";
 import DOMPurify from "dompurify";
-import { useEffect as useEffect4, useMemo as useMemo2, useRef as useRef3, useState as useState6 } from "react";
-import { useTranslation as useTranslation12 } from "react-i18next";
+import { useEffect as useEffect4, useMemo as useMemo4, useRef as useRef3, useState as useState6 } from "react";
+import { useTranslation as useTranslation14 } from "react-i18next";
 
 // src/lib/rich-text.ts
 var RICH_TEXT_ALLOWED_TAGS = [
@@ -14891,7 +15004,7 @@ var Collapsible = ({
   dataTestId,
   children
 }) => {
-  const { t: t2 } = useTranslation12();
+  const { t: t2 } = useTranslation14();
   const contentRef = useRef3(null);
   const [isOverflowing, setIsOverflowing] = useState6(false);
   const [isExpanded, setIsExpanded] = useState6(false);
@@ -14946,7 +15059,7 @@ var RichText = ({
   collapsedHeight,
   "data-testid": dataTestId
 }) => {
-  const sanitized = useMemo2(
+  const sanitized = useMemo4(
     () => html && isHtml(html) ? sanitizeRichText(html) : null,
     [html]
   );
@@ -15080,7 +15193,7 @@ var FieldDiffValue = ({
   diff,
   lookups
 }) => {
-  const { t: t2 } = useTranslation13();
+  const { t: t2 } = useTranslation15();
   const booleanLabels = {
     true: t2("general.yes"),
     false: t2("general.no")
@@ -15179,7 +15292,7 @@ var AttributeValue = ({
   change,
   lookup
 }) => {
-  const { t: t2 } = useTranslation13();
+  const { t: t2 } = useTranslation15();
   const { name, previous, next } = attributeDisplay(change, lookup, {
     true: t2("general.yes"),
     false: t2("general.no")
@@ -15225,23 +15338,23 @@ var ProductChangePanel = ({
   headerDescription,
   footer
 }) => {
-  const { t: t2 } = useTranslation13();
-  const view = useMemo3(() => buildProductChangeView(actions), [actions]);
-  const variantsById = useMemo3(() => {
+  const { t: t2 } = useTranslation15();
+  const view = useMemo5(() => buildProductChangeView(actions), [actions]);
+  const variantsById = useMemo5(() => {
     const map = /* @__PURE__ */ new Map();
     for (const variant of product.variants ?? []) {
       if (variant?.id) map.set(variant.id, variant);
     }
     return map;
   }, [product.variants]);
-  const productAttributesById = useMemo3(() => {
+  const productAttributesById = useMemo5(() => {
     const map = /* @__PURE__ */ new Map();
     for (const attr of product.attributes ?? []) {
       if (attr?.id) map.set(attr.id, attr);
     }
     return map;
   }, [product.attributes]);
-  const referenceIds = useMemo3(() => {
+  const referenceIds = useMemo5(() => {
     const types = /* @__PURE__ */ new Set();
     const collections = /* @__PURE__ */ new Set();
     const categories = /* @__PURE__ */ new Set();
@@ -15267,7 +15380,7 @@ var ProductChangePanel = ({
       tags: Array.from(tags)
     };
   }, [view.productUpdated]);
-  const attributeIdsToFetch = useMemo3(() => {
+  const attributeIdsToFetch = useMemo5(() => {
     const ids = /* @__PURE__ */ new Set();
     for (const change of view.attributes) {
       if (change.attributeId && !productAttributesById.has(change.attributeId)) {
@@ -15276,7 +15389,7 @@ var ProductChangePanel = ({
     }
     return Array.from(ids);
   }, [view.attributes, productAttributesById]);
-  const variantIdsToFetch = useMemo3(() => {
+  const variantIdsToFetch = useMemo5(() => {
     const ids = /* @__PURE__ */ new Set();
     for (const action of view.variantsRemoved) {
       const id = action.details?.variant_id;
@@ -15324,7 +15437,7 @@ var ProductChangePanel = ({
     }))
   });
   const isResolving = typeQueries.some((q) => q.isPending) || collectionQueries.some((q) => q.isPending) || categoryQueries.some((q) => q.isPending) || tagQueries.some((q) => q.isPending) || attributeQueries.some((q) => q.isPending) || variantQueries.some((q) => q.isPending);
-  const lookups = useMemo3(() => {
+  const lookups = useMemo5(() => {
     const toMap = (ids, queries) => {
       const map = /* @__PURE__ */ new Map();
       ids.forEach((id, idx) => {
@@ -15346,7 +15459,7 @@ var ProductChangePanel = ({
     categoryQueries,
     tagQueries
   ]);
-  const attributeLookup = useMemo3(() => {
+  const attributeLookup = useMemo5(() => {
     const map = /* @__PURE__ */ new Map();
     const addEntry = (id, name, allValues, selected) => {
       const valueNameById = /* @__PURE__ */ new Map();
@@ -15972,9 +16085,9 @@ import { DotsSix } from "@medusajs/icons";
 import { IconButton as IconButton5, clx as clx19 } from "@medusajs/ui";
 import {
   Fragment as Fragment5,
-  createContext as createContext3,
-  useContext as useContext3,
-  useMemo as useMemo4,
+  createContext as createContext4,
+  useContext as useContext6,
+  useMemo as useMemo6,
   useState as useState7
 } from "react";
 import { jsx as jsx30, jsxs as jsxs23 } from "react/jsx-runtime";
@@ -15984,7 +16097,7 @@ var List = ({
   renderItem
 }) => {
   const [active, setActive] = useState7(null);
-  const [activeItem, activeIndex] = useMemo4(() => {
+  const [activeItem, activeIndex] = useMemo6(() => {
     if (active === null) {
       return [null, null];
     }
@@ -16051,9 +16164,9 @@ var Overlay = ({ children }) => {
     }
   );
 };
-var SortableItemContext = createContext3(null);
+var SortableItemContext = createContext4(null);
 var useSortableItemContext = () => {
-  const context = useContext3(SortableItemContext);
+  const context = useContext6(SortableItemContext);
   if (!context) {
     throw new Error(
       "useSortableItemContext must be used within a SortableItemContext"
@@ -16075,7 +16188,7 @@ var Item2 = ({
     transform,
     transition
   } = useSortable({ id });
-  const context = useMemo4(
+  const context = useMemo6(
     () => ({
       attributes,
       listeners,
@@ -16137,7 +16250,7 @@ import {
   verticalListSortingStrategy
 } from "@dnd-kit/sortable";
 import { CSS as CSS3 } from "@dnd-kit/utilities";
-import { useEffect as useEffect5, useMemo as useMemo5, useRef as useRef4, useState as useState8 } from "react";
+import { useEffect as useEffect5, useMemo as useMemo7, useRef as useRef4, useState as useState8 } from "react";
 import { createPortal } from "react-dom";
 
 // src/components/common/sortable-tree/keyboard-coordinates.ts
@@ -16667,7 +16780,7 @@ function SortableTree({
   const [overId, setOverId] = useState8(null);
   const [offsetLeft, setOffsetLeft] = useState8(0);
   const [currentPosition, setCurrentPosition] = useState8(null);
-  const flattenedItems = useMemo5(() => {
+  const flattenedItems = useMemo7(() => {
     const flattenedTree = flattenTree(items, childrenProp);
     const collapsedItems = flattenedTree.reduce(
       (acc, item) => {
@@ -16704,7 +16817,7 @@ function SortableTree({
       coordinateGetter
     })
   );
-  const sortedIds = useMemo5(
+  const sortedIds = useMemo7(
     () => flattenedItems.map(({ id }) => id),
     [flattenedItems]
   );
@@ -16925,15 +17038,15 @@ var SwitchBox = ({
 
 // src/components/common/tax-badge/tax-badge.tsx
 import { TaxExclusive, TaxInclusive } from "@medusajs/icons";
-import { Tooltip as Tooltip6 } from "@medusajs/ui";
-import { useTranslation as useTranslation14 } from "react-i18next";
+import { Tooltip as Tooltip7 } from "@medusajs/ui";
+import { useTranslation as useTranslation16 } from "react-i18next";
 import { jsx as jsx35 } from "react/jsx-runtime";
 var IncludesTaxTooltip = ({
   includesTax
 }) => {
-  const { t: t2 } = useTranslation14();
+  const { t: t2 } = useTranslation16();
   return /* @__PURE__ */ jsx35(
-    Tooltip6,
+    Tooltip7,
     {
       maxWidth: 999,
       content: includesTax ? t2("general.includesTaxTooltip") : t2("general.excludesTaxTooltip"),
@@ -16962,18 +17075,18 @@ var useCombinedRefs = (...refs) => {
 };
 
 // src/components/data-grid/hooks/use-data-grid-cell.tsx
-import { useCallback, useEffect as useEffect6, useMemo as useMemo6, useRef as useRef5, useState as useState9 } from "react";
+import { useCallback, useEffect as useEffect6, useMemo as useMemo8, useRef as useRef5, useState as useState9 } from "react";
 
 // src/components/data-grid/context/data-grid-context.tsx
-import { createContext as createContext4 } from "react";
-var DataGridContext = createContext4(
+import { createContext as createContext5 } from "react";
+var DataGridContext = createContext5(
   null
 );
 
 // src/components/data-grid/context/use-data-grid-context.tsx
-import { useContext as useContext4 } from "react";
+import { useContext as useContext7 } from "react";
 var useDataGridContext = () => {
-  const context = useContext4(DataGridContext);
+  const context = useContext7(DataGridContext);
   if (!context) {
     throw new Error(
       "useDataGridContext must be used within a DataGridContextProvider"
@@ -17019,11 +17132,11 @@ var useDataGridCell = ({
     getCellMetadata
   } = useDataGridContext();
   const { rowIndex, columnIndex } = context;
-  const coords = useMemo6(
+  const coords = useMemo8(
     () => ({ row: rowIndex, col: columnIndex }),
     [rowIndex, columnIndex]
   );
-  const { id, field, type, innerAttributes, inputAttributes } = useMemo6(() => {
+  const { id, field, type, innerAttributes, inputAttributes } = useMemo8(() => {
     return getCellMetadata(coords);
   }, [coords, getCellMetadata]);
   const [showOverlay, setShowOverlay] = useState9(true);
@@ -17143,10 +17256,10 @@ var useDataGridCell = ({
     },
     [showOverlay, validateKeyStroke]
   );
-  const isAnchor = useMemo6(() => {
+  const isAnchor = useMemo8(() => {
     return anchor ? isCellMatch(coords, anchor) : false;
   }, [anchor, coords]);
-  const fieldWithoutOverlay = useMemo6(() => {
+  const fieldWithoutOverlay = useMemo8(() => {
     return type === "boolean";
   }, [type]);
   useEffect6(() => {
@@ -17191,14 +17304,14 @@ var useDataGridCell = ({
 };
 
 // src/components/data-grid/hooks/use-data-grid-cell-error.tsx
-import { useMemo as useMemo7 } from "react";
+import { useMemo as useMemo9 } from "react";
 import { get } from "react-hook-form";
 var useDataGridCellError = ({
   context
 }) => {
   const { errors, getCellErrorMetadata, navigateToField } = useDataGridContext();
   const { rowIndex, columnIndex } = context;
-  const { accessor, field } = useMemo7(() => {
+  const { accessor, field } = useMemo9(() => {
     return getCellErrorMetadata({ row: rowIndex, col: columnIndex });
   }, [rowIndex, columnIndex, getCellErrorMetadata]);
   const rowErrorsObject = accessor && columnIndex === 0 ? get(errors, accessor) : void 0;
@@ -17957,7 +18070,7 @@ function getColumnName(column) {
 import { useWatch } from "react-hook-form";
 
 // src/components/data-grid/hooks/use-data-grid-error-highlighting.tsx
-import { useCallback as useCallback7, useMemo as useMemo8, useState as useState11 } from "react";
+import { useCallback as useCallback7, useMemo as useMemo10, useState as useState11 } from "react";
 var useDataGridErrorHighlighting = (matrix, grid, errors) => {
   const [isHighlighted, setIsHighlighted] = useState11(false);
   const [visibilitySnapshot, setVisibilitySnapshot] = useState11(null);
@@ -17965,7 +18078,7 @@ var useDataGridErrorHighlighting = (matrix, grid, errors) => {
   const flatColumns = grid.getAllFlatColumns();
   const errorPaths = findErrorPaths(errors);
   const errorCount = errorPaths.length;
-  const { rowsWithErrors, columnsWithErrors } = useMemo8(() => {
+  const { rowsWithErrors, columnsWithErrors } = useMemo10(() => {
     const rowsWithErrors2 = /* @__PURE__ */ new Set();
     const columnsWithErrors2 = /* @__PURE__ */ new Set();
     errorPaths.forEach((errorPath) => {
@@ -18882,12 +18995,12 @@ var useDataGridQueryTool = (containerRef) => {
 // src/components/data-grid/components/data-grid-cell-container.tsx
 import { ErrorMessage as ErrorMessage2 } from "@hookform/error-message";
 import { ExclamationCircle as ExclamationCircle2 } from "@medusajs/icons";
-import { Tooltip as Tooltip8, clx as clx21 } from "@medusajs/ui";
+import { Tooltip as Tooltip9, clx as clx21 } from "@medusajs/ui";
 import { get as get2 } from "react-hook-form";
 
 // src/components/data-grid/components/data-grid-row-error-indicator.tsx
-import { Badge as Badge5, Tooltip as Tooltip7 } from "@medusajs/ui";
-import { useTranslation as useTranslation15 } from "react-i18next";
+import { Badge as Badge5, Tooltip as Tooltip8 } from "@medusajs/ui";
+import { useTranslation as useTranslation17 } from "react-i18next";
 import { jsx as jsx36, jsxs as jsxs27 } from "react/jsx-runtime";
 var DataGridRowErrorIndicator = ({
   rowErrors
@@ -18897,7 +19010,7 @@ var DataGridRowErrorIndicator = ({
     return null;
   }
   return /* @__PURE__ */ jsx36(
-    Tooltip7,
+    Tooltip8,
     {
       content: /* @__PURE__ */ jsx36("ul", { className: "flex flex-col gap-y-3", children: rowErrors.map((error, index) => /* @__PURE__ */ jsx36(DataGridRowErrorLine, { error }, index)) }),
       delayDuration: 0,
@@ -18908,7 +19021,7 @@ var DataGridRowErrorIndicator = ({
 var DataGridRowErrorLine = ({
   error
 }) => {
-  const { t: t2 } = useTranslation15();
+  const { t: t2 } = useTranslation17();
   return /* @__PURE__ */ jsxs27("li", { className: "txt-compact-small flex flex-col items-start", children: [
     error.message,
     /* @__PURE__ */ jsx36(
@@ -18966,7 +19079,7 @@ var DataGridCellContainer = ({
               name: field,
               errors,
               render: ({ message }) => {
-                return /* @__PURE__ */ jsx37("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx37(Tooltip8, { content: message, delayDuration: 0, children: /* @__PURE__ */ jsx37(ExclamationCircle2, { className: "text-ui-tag-red-icon z-[3]" }) }) });
+                return /* @__PURE__ */ jsx37("div", { className: "flex items-center justify-center", children: /* @__PURE__ */ jsx37(Tooltip9, { content: message, delayDuration: 0, children: /* @__PURE__ */ jsx37(ExclamationCircle2, { className: "text-ui-tag-red-icon z-[3]" }) }) });
               }
             }
           ),
@@ -19366,11 +19479,11 @@ import {
 import {
   useCallback as useCallback15,
   useEffect as useEffect11,
-  useMemo as useMemo10,
+  useMemo as useMemo12,
   useRef as useRef8,
   useState as useState17
 } from "react";
-import { useTranslation as useTranslation17 } from "react-i18next";
+import { useTranslation as useTranslation19 } from "react-i18next";
 
 // src/hooks/use-command-history.tsx
 import { useCallback as useCallback14, useState as useState15 } from "react";
@@ -19428,12 +19541,12 @@ import {
   Text as Text13
 } from "@medusajs/ui";
 import { Dialog as RadixDialog } from "radix-ui";
-import { useMemo as useMemo9, useState as useState16 } from "react";
-import { useTranslation as useTranslation16 } from "react-i18next";
+import { useMemo as useMemo11, useState as useState16 } from "react";
+import { useTranslation as useTranslation18 } from "react-i18next";
 import { jsx as jsx43, jsxs as jsxs31 } from "react/jsx-runtime";
 var useDataGridShortcuts = () => {
-  const { t: t2 } = useTranslation16();
-  const shortcuts = useMemo9(
+  const { t: t2 } = useTranslation18();
+  const shortcuts = useMemo11(
     () => [
       {
         label: t2("dataGrid.shortcuts.commands.undo"),
@@ -19577,10 +19690,10 @@ var DataGridKeyboardShortcutModal = ({
   open,
   onOpenChange
 }) => {
-  const { t: t2 } = useTranslation16();
+  const { t: t2 } = useTranslation18();
   const [searchValue, onSearchValueChange] = useState16("");
   const shortcuts = useDataGridShortcuts();
-  const searchResults = useMemo9(() => {
+  const searchResults = useMemo11(() => {
     return shortcuts.filter(
       (shortcut) => shortcut.label.toLowerCase().includes(searchValue.toLowerCase())
     );
@@ -19712,7 +19825,7 @@ var DataGridRoot = ({
   });
   const { flatRows } = grid.getRowModel();
   const flatColumns = grid.getAllFlatColumns();
-  const visibleRows = useMemo10(
+  const visibleRows = useMemo12(
     () => flatRows.filter((_, index) => rowVisibility?.[index] !== false),
     [flatRows, rowVisibility]
   );
@@ -19831,7 +19944,7 @@ var DataGridRoot = ({
     virtualPaddingLeft = virtualColumns[0]?.start ?? 0;
     virtualPaddingRight = columnVirtualizer.getTotalSize() - (virtualColumns[virtualColumns.length - 1]?.end ?? 0);
   }
-  const matrix = useMemo10(
+  const matrix = useMemo12(
     () => new DataGridMatrix(
       flatRows,
       columns,
@@ -20027,7 +20140,7 @@ var DataGridRoot = ({
       }
     }
   }, [anchor, matrix, setSingleRange]);
-  const values = useMemo10(
+  const values = useMemo12(
     () => ({
       anchor,
       control,
@@ -20259,7 +20372,7 @@ var DataGridHeader = ({
 }) => {
   const [shortcutsOpen, setShortcutsOpen] = useState17(false);
   const [columnsOpen, setColumnsOpen] = useState17(false);
-  const { t: t2 } = useTranslation17();
+  const { t: t2 } = useTranslation19();
   const direction = useDocumentDirection();
   const hasChanged = columnOptions.some((column) => !column.checked);
   const handleShortcutsOpenChange = (value) => {
@@ -21027,10 +21140,11 @@ import {
   useDataTable,
   Heading as Heading6,
   Text as Text14,
-  Button as Button7
+  Button as Button7,
+  Tooltip as Tooltip10
 } from "@medusajs/ui";
-import React6, { useCallback as useCallback17, useMemo as useMemo11 } from "react";
-import { useTranslation as useTranslation18 } from "react-i18next";
+import React6, { useCallback as useCallback17, useMemo as useMemo13 } from "react";
+import { useTranslation as useTranslation20 } from "react-i18next";
 import { Link as Link7, useNavigate, useSearchParams as useSearchParams2 } from "react-router-dom";
 
 // src/hooks/use-query-params.tsx
@@ -21048,11 +21162,12 @@ function useQueryParams(keys, prefix) {
 
 // src/components/data-table/data-table.tsx
 import { jsx as jsx50, jsxs as jsxs36 } from "react/jsx-runtime";
+var EMPTY_COMMANDS = [];
 var DataTable = ({
   data = [],
   columns,
   filters,
-  commands,
+  commands: declaredCommands,
   action,
   actions,
   actionMenu,
@@ -21079,9 +21194,11 @@ var DataTable = ({
   onColumnOrderChange,
   filterBarContent
 }) => {
-  const { t: t2 } = useTranslation18();
+  const { t: t2 } = useTranslation20();
   const enableFiltering = filters && filters.length > 0;
   const showFilterMenu = enableFilterMenu !== void 0 ? enableFilterMenu : enableFiltering;
+  const permittedCommands = usePermittedCommands(declaredCommands ?? EMPTY_COMMANDS);
+  const commands = declaredCommands ? permittedCommands : void 0;
   const enableCommands = commands && commands.length > 0;
   const enableSorting = columns.some((column) => column.enableSorting);
   const [columnVisibility, setColumnVisibility] = React6.useState(initialColumnVisibility);
@@ -21102,7 +21219,7 @@ var DataTable = ({
     },
     [onColumnVisibilityChange]
   );
-  const filterIds = useMemo11(() => filters?.map((f) => f.id) ?? [], [filters]);
+  const filterIds = useMemo13(() => filters?.map((f) => f.id) ?? [], [filters]);
   const prefixedFilterIds = filterIds.map((id) => getQueryParamKey(id, prefix));
   const { offset, order, q, ...filterParams } = useQueryParams(
     [
@@ -21114,7 +21231,7 @@ var DataTable = ({
     prefix
   );
   const [_, setSearchParams] = useSearchParams2();
-  const search = useMemo11(() => {
+  const search = useMemo13(() => {
     return q ?? "";
   }, [q]);
   const handleSearchChange = (value) => {
@@ -21127,7 +21244,7 @@ var DataTable = ({
       return prev;
     });
   };
-  const pagination = useMemo11(() => {
+  const pagination = useMemo13(() => {
     return offset ? parsePaginationState(offset, pageSize) : { pageIndex: 0, pageSize };
   }, [offset, pageSize]);
   const handlePaginationChange = (value) => {
@@ -21143,7 +21260,7 @@ var DataTable = ({
       return prev;
     });
   };
-  const filtering = useMemo11(
+  const filtering = useMemo13(
     () => parseFilterState(filterIds, filterParams),
     [filterIds, filterParams]
   );
@@ -21168,7 +21285,7 @@ var DataTable = ({
       return prev;
     });
   };
-  const sorting = useMemo11(() => {
+  const sorting = useMemo13(() => {
     return order ? parseSortingState(order) : null;
   }, [order]);
   const handleSortingChange = (value) => {
@@ -21318,7 +21435,7 @@ function getQueryParamKey(key, prefix) {
   return prefix ? `${prefix}_${key}` : key;
 }
 var useDataTableTranslations = () => {
-  const { t: t2 } = useTranslation18();
+  const { t: t2 } = useTranslation20();
   const paginationTranslations = {
     of: t2("general.of"),
     results: t2("general.results"),
@@ -21339,14 +21456,19 @@ var useDataTableTranslations = () => {
 var DataTableAction = ({
   label,
   disabled,
+  permission,
   ...props
 }) => {
+  const gate = usePermissionGate(permission);
   const buttonProps = {
     size: "small",
     disabled: disabled ?? false,
     type: "button",
     variant: "secondary"
   };
+  if (gate.denied) {
+    return /* @__PURE__ */ jsx50(Tooltip10, { content: gate.tooltip, children: /* @__PURE__ */ jsx50("span", { className: "inline-flex", children: /* @__PURE__ */ jsx50(Button7, { ...buttonProps, disabled: true, children: label }) }) });
+  }
   if ("to" in props) {
     return /* @__PURE__ */ jsx50(Button7, { ...buttonProps, asChild: true, children: /* @__PURE__ */ jsx50(Link7, { to: props.to, children: label }) });
   }
@@ -21392,7 +21514,7 @@ var AddFilterMenu = ({ availableKeys }) => {
 import { ArrowUpDown } from "@medusajs/icons";
 import { DropdownMenu as DropdownMenu4, IconButton as IconButton8 } from "@medusajs/ui";
 import { useState as useState20 } from "react";
-import { useTranslation as useTranslation19 } from "react-i18next";
+import { useTranslation as useTranslation21 } from "react-i18next";
 import { useSearchParams as useSearchParams4 } from "react-router-dom";
 import { jsx as jsx52, jsxs as jsxs38 } from "react/jsx-runtime";
 var initState = (params) => {
@@ -21423,7 +21545,7 @@ var formatKey = (key) => {
 var OrderBy = ({ keys }) => {
   const [searchParams, setSearchParams] = useSearchParams4();
   const [state, setState] = useState20(initState(searchParams));
-  const { t: t2 } = useTranslation19();
+  const { t: t2 } = useTranslation21();
   const direction = useDocumentDirection();
   const handleDirChange = (dir) => {
     setState((prev) => ({
@@ -21520,11 +21642,11 @@ var OrderBy = ({ keys }) => {
 import { Input as Input2 } from "@medusajs/ui";
 import debounce from "lodash.debounce";
 import { useCallback as useCallback18, useEffect as useEffect14, useState as useState21 } from "react";
-import { useTranslation as useTranslation20 } from "react-i18next";
+import { useTranslation as useTranslation22 } from "react-i18next";
 import { useSearchParams as useSearchParams5 } from "react-router-dom";
 import { jsx as jsx53 } from "react/jsx-runtime";
 var Query = ({ placeholder }) => {
-  const { t: t2 } = useTranslation20();
+  const { t: t2 } = useTranslation22();
   const placeholderText = placeholder || t2("general.search");
   const [searchParams, setSearchParams] = useSearchParams5();
   const [inputValue, setInputValue] = useState21(searchParams.get("q") || "");
@@ -21565,7 +21687,7 @@ var Query = ({ placeholder }) => {
 
 // src/components/forms/address-form/address-form.tsx
 import { Heading as Heading7, Input as Input3, Select as Select2, clx as clx29 } from "@medusajs/ui";
-import { useTranslation as useTranslation22 } from "react-i18next";
+import { useTranslation as useTranslation24 } from "react-i18next";
 
 // src/components/inputs/country-select/country-select.tsx
 import {
@@ -21573,11 +21695,11 @@ import {
   useImperativeHandle,
   useRef as useRef11
 } from "react";
-import { useTranslation as useTranslation21 } from "react-i18next";
+import { useTranslation as useTranslation23 } from "react-i18next";
 import { Select } from "@medusajs/ui";
 import { jsx as jsx54, jsxs as jsxs39 } from "react/jsx-runtime";
 var CountrySelect = forwardRef3(({ disabled, placeholder, defaultValue, onChange, ...field }, ref) => {
-  const { t: t2 } = useTranslation21();
+  const { t: t2 } = useTranslation23();
   const innerRef = useRef11(null);
   useImperativeHandle(ref, () => innerRef.current);
   return /* @__PURE__ */ jsx54("div", { className: "relative", children: /* @__PURE__ */ jsxs39(
@@ -21616,7 +21738,7 @@ var AddressForm = ({
   countries: countries2,
   layout
 }) => {
-  const { t: t2 } = useTranslation22();
+  const { t: t2 } = useTranslation24();
   const direction = useDocumentDirection();
   const style = clx29("gap-4", {
     "flex flex-col": layout === "stack",
@@ -21807,13 +21929,13 @@ var import_types3 = __toESM(require_dist2(), 1);
 import { zodResolver } from "@hookform/resolvers/zod";
 import { Button as Button9, InlineTip, Input as Input5, Label as Label3 } from "@medusajs/ui";
 import { useForm } from "react-hook-form";
-import { useTranslation as useTranslation26 } from "react-i18next";
+import { useTranslation as useTranslation28 } from "react-i18next";
 import * as zod from "zod";
 
 // src/components/inputs/attribute-value-input/attribute-value-input.tsx
 var import_types2 = __toESM(require_dist2(), 1);
 import { Input as Input4, Select as Select3, Textarea as Textarea3 } from "@medusajs/ui";
-import { useTranslation as useTranslation24 } from "react-i18next";
+import { useTranslation as useTranslation26 } from "react-i18next";
 
 // src/components/inputs/combobox/combobox.tsx
 import {
@@ -21840,12 +21962,12 @@ import {
   useCallback as useCallback19,
   useDeferredValue,
   useImperativeHandle as useImperativeHandle2,
-  useMemo as useMemo12,
+  useMemo as useMemo14,
   useRef as useRef12,
   useState as useState22,
   useTransition
 } from "react";
-import { useTranslation as useTranslation23 } from "react-i18next";
+import { useTranslation as useTranslation25 } from "react-i18next";
 
 // src/components/utilities/generic-forward-ref/generic-forward-ref.tsx
 import {
@@ -21879,7 +22001,7 @@ var ComboboxImpl = ({
 }, ref) => {
   const [open, setOpen] = useState22(false);
   const [isPending, startTransition] = useTransition();
-  const { t: t2 } = useTranslation23();
+  const { t: t2 } = useTranslation25();
   const comboboxRef = useRef12(null);
   const listboxRef = useRef12(null);
   useImperativeHandle2(ref, () => comboboxRef.current);
@@ -21918,7 +22040,7 @@ var ComboboxImpl = ({
       onSearchValueChange(query);
     }
   };
-  const matches = useMemo12(() => {
+  const matches = useMemo14(() => {
     if (isSearchControlled) {
       return [];
     }
@@ -21966,7 +22088,7 @@ var ComboboxImpl = ({
   const hideInput = forceHideInput || !isArrayValue && hasValue && !open;
   const selectedLabel = options.find((o) => o.value === selectedValues)?.label;
   const hidePlaceholder = showSelected || open;
-  const tagWidth = useMemo12(() => {
+  const tagWidth = useMemo14(() => {
     if (!Array.isArray(selectedValues)) {
       return TAG_BASE_WIDTH + TABLUAR_NUM_WIDTH;
     }
@@ -21974,7 +22096,7 @@ var ComboboxImpl = ({
     const digits = count.toString().length;
     return TAG_BASE_WIDTH + digits * TABLUAR_NUM_WIDTH;
   }, [selectedValues]);
-  const results = useMemo12(() => {
+  const results = useMemo14(() => {
     return isSearchControlled ? options : matches;
   }, [matches, options, isSearchControlled]);
   return /* @__PURE__ */ jsxs41(
@@ -22188,7 +22310,7 @@ var AttributeValueInput = ({
   availableValues = [],
   placeholder
 }) => {
-  const { t: t2 } = useTranslation24();
+  const { t: t2 } = useTranslation26();
   const ph = placeholder ?? t2("products.create.attributes.valuePlaceholder");
   switch (type) {
     case import_types2.AttributeType.MULTI_SELECT:
@@ -22431,11 +22553,11 @@ import { useEffect as useEffect15, useState as useState26 } from "react";
 import { useNavigate as useNavigate3 } from "react-router-dom";
 
 // src/components/modals/hooks/use-state-aware-to.tsx
-import { useMemo as useMemo13 } from "react";
+import { useMemo as useMemo15 } from "react";
 import { useLocation } from "react-router-dom";
 var useStateAwareTo = (prev) => {
   const location = useLocation();
-  const to = useMemo13(() => {
+  const to = useMemo15(() => {
     const params = location.state?.restore_params;
     if (params) {
       return `${prev}?${params.toString()}`;
@@ -22450,7 +22572,7 @@ var useStateAwareTo = (prev) => {
 
 // src/components/modals/route-modal-form/route-modal-form.tsx
 import { Prompt as Prompt2 } from "@medusajs/ui";
-import { useTranslation as useTranslation25 } from "react-i18next";
+import { useTranslation as useTranslation27 } from "react-i18next";
 import { useBlocker } from "react-router-dom";
 import { jsx as jsx59, jsxs as jsxs44 } from "react/jsx-runtime";
 var RouteModalForm = ({
@@ -22459,7 +22581,7 @@ var RouteModalForm = ({
   children,
   onClose
 }) => {
-  const { t: t2 } = useTranslation25();
+  const { t: t2 } = useTranslation27();
   const {
     formState: { isDirty }
   } = form;
@@ -22509,12 +22631,12 @@ var RouteModalForm = ({
 };
 
 // src/components/modals/route-modal-provider/route-provider.tsx
-import { useCallback as useCallback20, useMemo as useMemo14, useState as useState24 } from "react";
+import { useCallback as useCallback20, useMemo as useMemo16, useState as useState24 } from "react";
 import { useLocation as useLocation2, useNavigate as useNavigate2 } from "react-router-dom";
 
 // src/components/modals/route-modal-provider/route-modal-context.tsx
-import { createContext as createContext5 } from "react";
-var RouteModalProviderContext = createContext5(null);
+import { createContext as createContext6 } from "react";
+var RouteModalProviderContext = createContext6(null);
 
 // src/components/modals/route-modal-provider/route-provider.tsx
 import { jsx as jsx60 } from "react/jsx-runtime";
@@ -22542,7 +22664,7 @@ var RouteModalProvider = ({
     },
     [navigate, prev, location]
   );
-  const value = useMemo14(
+  const value = useMemo16(
     () => ({
       handleSuccess,
       setCloseOnEscape,
@@ -22557,8 +22679,8 @@ var RouteModalProvider = ({
 import { useState as useState25 } from "react";
 
 // src/components/modals/stacked-modal-provider/stacked-modal-context.tsx
-import { createContext as createContext6 } from "react";
-var StackedModalContext = createContext6(null);
+import { createContext as createContext7 } from "react";
+var StackedModalContext = createContext7(null);
 
 // src/components/modals/stacked-modal-provider/stacked-modal-provider.tsx
 import { jsx as jsx61 } from "react/jsx-runtime";
@@ -22605,9 +22727,9 @@ var StackedModalProvider = ({
 };
 
 // src/components/modals/stacked-modal-provider/use-stacked-modal.ts
-import { useContext as useContext5 } from "react";
+import { useContext as useContext8 } from "react";
 var useStackedModal = () => {
-  const context = useContext5(StackedModalContext);
+  const context = useContext8(StackedModalContext);
   if (!context) {
     throw new Error(
       "useStackedModal must be used within a StackedModalProvider"
@@ -22672,9 +22794,9 @@ import { useEffect as useEffect16, useState as useState27 } from "react";
 import { useNavigate as useNavigate4 } from "react-router-dom";
 
 // src/components/modals/route-modal-provider/use-route-modal.tsx
-import { useContext as useContext6 } from "react";
+import { useContext as useContext9 } from "react";
 var useRouteModal = () => {
-  const context = useContext6(RouteModalProviderContext);
+  const context = useContext9(RouteModalProviderContext);
   if (!context) {
     throw new Error("useRouteModal must be used within a RouteModalProvider");
   }
@@ -22905,7 +23027,7 @@ var EditAttributeForm = (props) => {
   return /* @__PURE__ */ jsx67(EditCatalogAttributeForm, { ...props });
 };
 var AttributeWarning = () => {
-  const { t: t2 } = useTranslation26();
+  const { t: t2 } = useTranslation28();
   return /* @__PURE__ */ jsx67(
     InlineTip,
     {
@@ -22916,7 +23038,7 @@ var AttributeWarning = () => {
   );
 };
 var VariantAxisTip = () => {
-  const { t: t2 } = useTranslation26();
+  const { t: t2 } = useTranslation28();
   return /* @__PURE__ */ jsx67(InlineTip, { label: t2("products.create.attributes.tip"), children: t2("products.create.attributes.editVariantAxisTip") });
 };
 var EditScopedAttributeForm = ({
@@ -22924,7 +23046,7 @@ var EditScopedAttributeForm = ({
   isPending,
   onSubmit
 }) => {
-  const { t: t2 } = useTranslation26();
+  const { t: t2 } = useTranslation28();
   const { handleSuccess } = useRouteModal();
   const isAxis = isVariantAxis(attribute);
   const currentValues = attribute.values ?? attribute.all_values ?? [];
@@ -23063,7 +23185,7 @@ var EditCatalogAttributeForm = ({
   isPending,
   onSubmit
 }) => {
-  const { t: t2 } = useTranslation26();
+  const { t: t2 } = useTranslation28();
   const { handleSuccess } = useRouteModal();
   const isAxis = isVariantAxis(attribute);
   const hasPresetValues = attribute.type === import_types3.AttributeType.SINGLE_SELECT || attribute.type === import_types3.AttributeType.MULTI_SELECT;
@@ -23148,10 +23270,10 @@ var EditCatalogAttributeForm = ({
 
 // src/components/forms/email-form/email-form.tsx
 import { Input as Input6, clx as clx36 } from "@medusajs/ui";
-import { useTranslation as useTranslation27 } from "react-i18next";
+import { useTranslation as useTranslation29 } from "react-i18next";
 import { jsx as jsx68, jsxs as jsxs46 } from "react/jsx-runtime";
 var EmailForm = ({ control, layout = "stack" }) => {
-  const { t: t2 } = useTranslation27();
+  const { t: t2 } = useTranslation29();
   return /* @__PURE__ */ jsx68(
     "div",
     {
@@ -23189,7 +23311,7 @@ import {
   toast as toast3
 } from "@medusajs/ui";
 import { useFieldArray, useForm as useForm2 } from "react-hook-form";
-import { useTranslation as useTranslation28 } from "react-i18next";
+import { useTranslation as useTranslation30 } from "react-i18next";
 import { z as z2 } from "zod";
 import {
   ArrowDownMini,
@@ -23208,7 +23330,7 @@ var MetadataSchema = z2.object({
   metadata: z2.array(MetadataFieldSchema)
 });
 var MetadataForm = (props) => {
-  const { t: t2 } = useTranslation28();
+  const { t: t2 } = useTranslation30();
   const { isPending, ...innerProps } = props;
   return /* @__PURE__ */ jsxs47(RouteDrawer, { children: [
     /* @__PURE__ */ jsxs47(RouteDrawer.Header, { children: [
@@ -23225,7 +23347,7 @@ var InnerForm = ({
   hook,
   isMutating
 }) => {
-  const { t: t2 } = useTranslation28();
+  const { t: t2 } = useTranslation30();
   const { handleSuccess } = useRouteModal();
   const direction = useDocumentDirection();
   const hasUneditableRows = getHasUneditableRows(metadata);
@@ -23767,7 +23889,7 @@ import {
   useRef as useRef15
 } from "react";
 import { Select as Select4 } from "@medusajs/ui";
-import { useTranslation as useTranslation29 } from "react-i18next";
+import { useTranslation as useTranslation31 } from "react-i18next";
 
 // src/lib/data/country-states.ts
 function getCountryProvinceObjectByIso2(iso2) {
@@ -25036,7 +25158,7 @@ var ProvinceSelect = forwardRef12(
     onChange,
     ...field
   }, ref) => {
-    const { t: t2 } = useTranslation29();
+    const { t: t2 } = useTranslation31();
     const innerRef = useRef15(null);
     useImperativeHandle4(ref, () => innerRef.current);
     const provinceObject = getCountryProvinceObjectByIso2(country_code);
@@ -25087,7 +25209,7 @@ import {
   useRef as useRef17,
   useState as useState30
 } from "react";
-import { useTranslation as useTranslation31 } from "react-i18next";
+import { useTranslation as useTranslation33 } from "react-i18next";
 
 // src/components/inputs/rich-text-editor/rich-text-toolbar.tsx
 import {
@@ -25102,7 +25224,7 @@ import {
   DropdownMenu as DropdownMenu6,
   IconButton as IconButton10,
   Input as Input9,
-  Tooltip as Tooltip9,
+  Tooltip as Tooltip11,
   clx as clx39
 } from "@medusajs/ui";
 import { Popover as RadixPopover2 } from "radix-ui";
@@ -25110,7 +25232,7 @@ import {
   useRef as useRef16,
   useState as useState29
 } from "react";
-import { useTranslation as useTranslation30 } from "react-i18next";
+import { useTranslation as useTranslation32 } from "react-i18next";
 import { Fragment as Fragment7, jsx as jsx74, jsxs as jsxs52 } from "react/jsx-runtime";
 var ToolbarButton = ({
   label,
@@ -25119,7 +25241,7 @@ var ToolbarButton = ({
   onClick,
   children,
   "data-testid": dataTestId
-}) => /* @__PURE__ */ jsx74(Tooltip9, { content: label, children: /* @__PURE__ */ jsx74(
+}) => /* @__PURE__ */ jsx74(Tooltip11, { content: label, children: /* @__PURE__ */ jsx74(
   IconButton10,
   {
     type: "button",
@@ -25152,7 +25274,7 @@ var HeadingMenu = ({
   editor,
   disabled
 }) => {
-  const { t: t2 } = useTranslation30();
+  const { t: t2 } = useTranslation32();
   const active = editor.isActive("heading", { level: 2 }) ? 2 : editor.isActive("heading", { level: 3 }) ? 3 : null;
   const label = active ? t2(`richTextEditor.heading${active}`) : t2("richTextEditor.paragraph");
   const setHeading = (level) => {
@@ -25199,7 +25321,7 @@ var LinkPopover = ({
   editor,
   disabled
 }) => {
-  const { t: t2 } = useTranslation30();
+  const { t: t2 } = useTranslation32();
   const [open, setOpen] = useState29(false);
   const [url, setUrl] = useState29("");
   const isActive = editor.isActive("link");
@@ -25299,7 +25421,7 @@ var ImageButton = ({
   disabled,
   isUploading
 }) => {
-  const { t: t2 } = useTranslation30();
+  const { t: t2 } = useTranslation32();
   const inputRef = useRef16(null);
   const handleChange = (e) => {
     const files = Array.from(e.target.files ?? []);
@@ -25341,7 +25463,7 @@ var RichTextToolbar = ({
   isUploading,
   onPickImages
 }) => {
-  const { t: t2 } = useTranslation30();
+  const { t: t2 } = useTranslation32();
   const chain = () => editor.chain().focus();
   return /* @__PURE__ */ jsxs52(
     "div",
@@ -25483,7 +25605,7 @@ var RichTextEditor = forwardRef13(
     contentClassName,
     ...props
   }, ref) => {
-    const { t: t2 } = useTranslation31();
+    const { t: t2 } = useTranslation33();
     const [isUploading, setIsUploading] = useState30(false);
     const lastEmitted = useRef17(value ?? "");
     const onChangeRef = useRef17(onChange);
@@ -25765,10 +25887,10 @@ var TwoColumnPage = Object.assign(Root5, { Main, Sidebar });
 // src/components/localization/localized-table-pagination/localized-table-pagination.tsx
 import { Table } from "@medusajs/ui";
 import { forwardRef as forwardRef14 } from "react";
-import { useTranslation as useTranslation32 } from "react-i18next";
+import { useTranslation as useTranslation34 } from "react-i18next";
 import { jsx as jsx78 } from "react/jsx-runtime";
 var LocalizedTablePagination = forwardRef14((props, ref) => {
-  const { t: t2 } = useTranslation32();
+  const { t: t2 } = useTranslation34();
   const translations = {
     of: t2("general.of"),
     results: t2("general.results"),
@@ -25794,10 +25916,10 @@ import {
   Container as Container5,
   Heading as Heading9,
   Text as Text18,
-  Tooltip as Tooltip10,
+  Tooltip as Tooltip12,
   usePrompt
 } from "@medusajs/ui";
-import { useTranslation as useTranslation33 } from "react-i18next";
+import { useTranslation as useTranslation35 } from "react-i18next";
 
 // src/extensions/registry.ts
 var PLACEMENTS = ["before", "after"];
@@ -25837,7 +25959,8 @@ var ExtensionRegistry = class {
         const entry = this.ensureSlot(slot);
         const resolved = {
           Component: widget.Component,
-          widgetId: widget.widgetId
+          widgetId: widget.widgetId,
+          permission: widget.permission
         };
         entry[placement].push(resolved);
       }
@@ -25948,9 +26071,9 @@ var ExtensionRegistry = class {
 };
 
 // src/extensions/context.tsx
-import { createContext as createContext7, useContext as useContext7, useMemo as useMemo15 } from "react";
+import { createContext as createContext8, useContext as useContext10, useMemo as useMemo17 } from "react";
 import { jsx as jsx79 } from "react/jsx-runtime";
-var ExtensionContext = createContext7(null);
+var ExtensionContext = createContext8(null);
 var activeRegistry = null;
 var getExtensionRegistry = () => activeRegistry;
 var ExtensionProvider = ({
@@ -25959,7 +26082,7 @@ var ExtensionProvider = ({
   customFields,
   children
 }) => {
-  const registry = useMemo15(() => {
+  const registry = useMemo17(() => {
     const next = new ExtensionRegistry({ widgets, navigation, customFields });
     activeRegistry = next;
     return next;
@@ -25968,14 +26091,21 @@ var ExtensionProvider = ({
 };
 var EMPTY_REGISTRY = new ExtensionRegistry();
 var useExtension = () => {
-  return useContext7(ExtensionContext) ?? EMPTY_REGISTRY;
+  return useContext10(ExtensionContext) ?? EMPTY_REGISTRY;
 };
 
 // src/extensions/widget-zone.tsx
-import { Fragment as Fragment8 } from "react";
+import { Fragment as Fragment8, useContext as useContext11 } from "react";
 import { jsx as jsx80, jsxs as jsxs56 } from "react/jsx-runtime";
 var WidgetZone = ({ id, data, children }) => {
-  const { before, after } = useExtension().getWidgets(id);
+  const widgets = useExtension().getWidgets(id);
+  const permissions = useContext11(PermissionsContext);
+  const before = widgets.before.filter(
+    (widget) => isPermitted(permissions, widget.permission)
+  );
+  const after = widgets.after.filter(
+    (widget) => isPermitted(permissions, widget.permission)
+  );
   return /* @__PURE__ */ jsxs56(Fragment8, { children: [
     before.map(({ Component, widgetId }) => /* @__PURE__ */ jsx80(Component, { data }, `before-${widgetId}`)),
     children,
@@ -26179,7 +26309,7 @@ function useDisplayFieldOverride(model, zone, id) {
 }
 
 // src/extensions/use-extendable-table.tsx
-import { useMemo as useMemo16 } from "react";
+import { useMemo as useMemo18 } from "react";
 import { createColumnHelper as createColumnHelper2 } from "@tanstack/react-table";
 import { jsx as jsx83 } from "react/jsx-runtime";
 function columnId(col) {
@@ -26190,7 +26320,7 @@ function useExtendableTable({
   columns: baseColumns
 }) {
   const ext = useExtension().getListExtension(model);
-  return useMemo16(() => {
+  return useMemo18(() => {
     const helper = createColumnHelper2();
     const build = (c) => helper.display({
       id: c.id,
@@ -26288,7 +26418,7 @@ function buildAdditionalDataDefaults(registry, model, data, zone, tab) {
 
 // src/extensions/use-extendable-form.ts
 import { zodResolver as zodResolver3 } from "@hookform/resolvers/zod";
-import { useMemo as useMemo17 } from "react";
+import { useMemo as useMemo19 } from "react";
 import { useForm as useForm3 } from "react-hook-form";
 import { z as z4 } from "zod";
 var useExtendableForm = ({
@@ -26301,11 +26431,11 @@ var useExtendableForm = ({
   ...props
 }) => {
   const extension = useExtension();
-  const schema = useMemo17(() => {
+  const schema = useMemo19(() => {
     const additionalData = buildAdditionalDataSchema(extension, model, zone, tab).partial().optional();
     return typeof baseSchema.extend === "function" ? baseSchema.extend({ additional_data: additionalData }) : baseSchema.and(z4.object({ additional_data: additionalData }));
   }, [baseSchema, extension, model, zone, tab]);
-  const defaultValues = useMemo17(
+  const defaultValues = useMemo19(
     () => ({
       ...baseDefaultValues,
       additional_data: buildAdditionalDataDefaults(
@@ -26326,7 +26456,7 @@ var useExtendableForm = ({
 };
 
 // src/extensions/action-locks.ts
-import { useCallback as useCallback22, useMemo as useMemo18 } from "react";
+import { useCallback as useCallback22, useMemo as useMemo20 } from "react";
 var useActionLocks = (model, entity) => {
   const registry = useExtension();
   return useCallback22(
@@ -26336,7 +26466,7 @@ var useActionLocks = (model, entity) => {
 };
 var useExtensionActivity = (model, entity) => {
   const registry = useExtension();
-  return useMemo18(
+  return useMemo20(
     () => registry.getActivity(model, entity),
     [registry, model, entity]
   );
@@ -26349,7 +26479,7 @@ var AttributeActions = ({
   editHref,
   onDelete
 }) => {
-  const { t: t2 } = useTranslation33();
+  const { t: t2 } = useTranslation35();
   const prompt = usePrompt();
   const handleDelete = async () => {
     const res = await prompt({
@@ -26374,6 +26504,7 @@ var AttributeActions = ({
             {
               label: t2("actions.edit"),
               to: editHref,
+              permission: "products:edit",
               icon: /* @__PURE__ */ jsx84(PencilSquare, {})
             }
           ]
@@ -26384,6 +26515,7 @@ var AttributeActions = ({
               {
                 label: t2("actions.delete"),
                 onClick: handleDelete,
+                permission: "products:edit",
                 icon: /* @__PURE__ */ jsx84(Trash2, {})
               }
             ]
@@ -26394,7 +26526,7 @@ var AttributeActions = ({
   );
 };
 var AttributeValue2 = ({ attribute }) => {
-  const { t: t2 } = useTranslation33();
+  const { t: t2 } = useTranslation35();
   const values = attribute.values?.map((v) => v.name) ?? [];
   if (attribute.is_required && !values.length) {
     return /* @__PURE__ */ jsx84(
@@ -26420,7 +26552,7 @@ var AttributeValue2 = ({ attribute }) => {
     )) });
   }
   const textValue = attribute.type === "toggle" ? values.map((val) => val === "true" ? t2("general.yes") : t2("general.no")).join(", ") || "-" : values.join(", ") || "-";
-  return /* @__PURE__ */ jsx84(Tooltip10, { content: /* @__PURE__ */ jsx84("span", { className: "break-all", children: textValue }), children: /* @__PURE__ */ jsx84(
+  return /* @__PURE__ */ jsx84(Tooltip12, { content: /* @__PURE__ */ jsx84("span", { className: "break-all", children: textValue }), children: /* @__PURE__ */ jsx84(
     Text18,
     {
       size: "small",
@@ -26438,7 +26570,7 @@ var AttributeGroup = ({
   getEditHref,
   onDelete
 }) => {
-  const { t: t2 } = useTranslation33();
+  const { t: t2 } = useTranslation35();
   if (!attributes.length) {
     return null;
   }
@@ -26458,9 +26590,9 @@ var AttributeGroup = ({
           children: /* @__PURE__ */ jsxs59("div", { className: "grid grid-cols-[minmax(0,1fr)_minmax(0,1fr)_28px] items-center gap-4 px-3 py-2 bg-ui-bg-component", children: [
             /* @__PURE__ */ jsxs59("div", { className: "flex items-center gap-x-2 text-ui-fg-subtle", children: [
               /* @__PURE__ */ jsx84(Text18, { size: "small", weight: "plus", leading: "compact", children: attr.name }),
-              attr.description && /* @__PURE__ */ jsx84(Tooltip10, { content: attr.description, children: /* @__PURE__ */ jsx84("span", { className: "text-ui-fg-muted flex items-center", children: /* @__PURE__ */ jsx84(InformationCircleSolid2, {}) }) }),
+              attr.description && /* @__PURE__ */ jsx84(Tooltip12, { content: attr.description, children: /* @__PURE__ */ jsx84("span", { className: "text-ui-fg-muted flex items-center", children: /* @__PURE__ */ jsx84(InformationCircleSolid2, {}) }) }),
               attr.is_required && /* @__PURE__ */ jsx84(
-                Tooltip10,
+                Tooltip12,
                 {
                   content: t2("products.attributeRequiredByMarketplace"),
                   children: /* @__PURE__ */ jsx84("span", { className: "text-ui-fg-muted flex items-center", children: /* @__PURE__ */ jsx84(InformationCircleSolid2, {}) })
@@ -26492,7 +26624,7 @@ var ProductAttributeSection = ({
   addExistingHref = "attributes/add",
   createNewHref = "attributes/create"
 }) => {
-  const { t: t2 } = useTranslation33();
+  const { t: t2 } = useTranslation35();
   const attributes = product.attributes ?? [];
   const attachedIds = new Set(attributes.map((a) => a.id));
   const missing = (requiredAttributes ?? []).filter((required) => !attachedIds.has(required.id)).map(
@@ -26522,11 +26654,13 @@ var ProductAttributeSection = ({
                     {
                       label: t2("products.create.attributes.addExisting"),
                       to: addExistingHref,
+                      permission: "products:edit",
                       icon: /* @__PURE__ */ jsx84(Plus, {})
                     },
                     {
                       label: t2("products.create.attributes.createNew"),
                       to: createNewHref,
+                      permission: "products:edit",
                       icon: /* @__PURE__ */ jsx84(PencilSquare, {})
                     }
                   ]
@@ -26568,19 +26702,19 @@ var ProductAttributeSection = ({
 import { Button as Button12, ProgressTabs } from "@medusajs/ui";
 import {
   Children as Children3,
-  createContext as createContext8,
-  useContext as useContext8,
-  useMemo as useMemo20
+  createContext as createContext9,
+  useContext as useContext12,
+  useMemo as useMemo22
 } from "react";
-import { useTranslation as useTranslation34 } from "react-i18next";
+import { useTranslation as useTranslation36 } from "react-i18next";
 
 // src/components/tabbed-form/use-tab-management.ts
-import { useCallback as useCallback23, useEffect as useEffect20, useMemo as useMemo19, useState as useState31 } from "react";
+import { useCallback as useCallback23, useEffect as useEffect20, useMemo as useMemo21, useState as useState31 } from "react";
 var useTabManagement = ({
   tabs,
   form
 }) => {
-  const visibleTabs = useMemo19(
+  const visibleTabs = useMemo21(
     () => tabs.filter((t2) => !t2.isVisible || t2.isVisible(form)),
     [tabs, form]
   );
@@ -26642,9 +26776,9 @@ var useTabManagement = ({
 
 // src/components/tabbed-form/tabbed-form.tsx
 import { jsx as jsx85, jsxs as jsxs60 } from "react/jsx-runtime";
-var TabbedFormContext = createContext8(null);
+var TabbedFormContext = createContext9(null);
 var useTabbedForm = () => {
-  const form = useContext8(TabbedFormContext);
+  const form = useContext12(TabbedFormContext);
   if (!form) {
     throw new Error("useTabbedForm must be used within a TabbedForm");
   }
@@ -26688,12 +26822,12 @@ function Root6({
   footer,
   transformTabs
 }) {
-  const { t: t2 } = useTranslation34();
-  const { tabs: rawTabs, elements } = useMemo20(
+  const { t: t2 } = useTranslation36();
+  const { tabs: rawTabs, elements } = useMemo22(
     () => collectTabs(children),
     [children]
   );
-  const tabs = useMemo20(
+  const tabs = useMemo22(
     () => transformTabs ? transformTabs(rawTabs) : rawTabs,
     [transformTabs, rawTabs]
   );
@@ -26784,7 +26918,7 @@ var DefaultFooter = ({
   onNext,
   isLoading
 }) => {
-  const { t: t2 } = useTranslation34();
+  const { t: t2 } = useTranslation36();
   return /* @__PURE__ */ jsxs60("div", { className: "flex items-center justify-end gap-x-2", children: [
     /* @__PURE__ */ jsx85(RouteFocusModal.Close, { asChild: true, children: /* @__PURE__ */ jsx85(Button12, { variant: "secondary", size: "small", children: t2("actions.cancel") }) }),
     isLastTab ? /* @__PURE__ */ jsx85(
@@ -26824,15 +26958,15 @@ import { memo } from "react";
 // src/components/table/data-table/data-table-filter/data-table-filter.tsx
 import { Button as Button13, clx as clx47 } from "@medusajs/ui";
 import { Popover as RadixPopover8 } from "radix-ui";
-import { useCallback as useCallback26, useEffect as useEffect23, useMemo as useMemo22, useRef as useRef18, useState as useState36 } from "react";
+import { useCallback as useCallback26, useEffect as useEffect23, useMemo as useMemo24, useRef as useRef18, useState as useState36 } from "react";
 import { useSearchParams as useSearchParams7 } from "react-router-dom";
-import { useTranslation as useTranslation39 } from "react-i18next";
+import { useTranslation as useTranslation41 } from "react-i18next";
 
 // src/components/table/data-table/data-table-filter/context.tsx
-import { createContext as createContext9, useContext as useContext9 } from "react";
-var DataTableFilterContext = createContext9(null);
+import { createContext as createContext10, useContext as useContext13 } from "react";
+var DataTableFilterContext = createContext10(null);
 var useDataTableFilterContext = () => {
-  const ctx = useContext9(DataTableFilterContext);
+  const ctx = useContext13(DataTableFilterContext);
   if (!ctx) {
     throw new Error(
       "useDataTableFacetedFilterContext must be used within a DataTableFacetedFilter"
@@ -26846,9 +26980,9 @@ import { EllipseMiniSolid as EllipseMiniSolid2 } from "@medusajs/icons";
 import { DatePicker, Text as Text20, clx as clx43 } from "@medusajs/ui";
 import isEqual from "lodash.isequal";
 import { Popover as RadixPopover4 } from "radix-ui";
-import { useMemo as useMemo21, useState as useState32 } from "react";
+import { useMemo as useMemo23, useState as useState32 } from "react";
 import { t } from "i18next";
-import { useTranslation as useTranslation36 } from "react-i18next";
+import { useTranslation as useTranslation38 } from "react-i18next";
 
 // src/components/table/data-table/hooks.tsx
 import { useSearchParams as useSearchParams6 } from "react-router-dom";
@@ -26921,7 +27055,7 @@ var useSelectedParams = ({
 import { XMarkMini as XMarkMini5 } from "@medusajs/icons";
 import { Text as Text19, clx as clx42 } from "@medusajs/ui";
 import { Popover as RadixPopover3 } from "radix-ui";
-import { useTranslation as useTranslation35 } from "react-i18next";
+import { useTranslation as useTranslation37 } from "react-i18next";
 import { jsx as jsx86, jsxs as jsxs61 } from "react/jsx-runtime";
 var FilterChip = ({
   hadPreviousValue,
@@ -26931,7 +27065,7 @@ var FilterChip = ({
   hasOperator,
   onRemove
 }) => {
-  const { t: t2 } = useTranslation35();
+  const { t: t2 } = useTranslation37();
   const handleRemove = (e) => {
     e.stopPropagation();
     onRemove();
@@ -27194,8 +27328,8 @@ var DateFilter = ({
 var today = /* @__PURE__ */ new Date();
 today.setHours(0, 0, 0, 0);
 var usePresets = () => {
-  const { t: t2 } = useTranslation36();
-  return useMemo21(
+  const { t: t2 } = useTranslation38();
+  return useMemo23(
     () => [
       {
         label: t2("filters.date.today"),
@@ -27266,7 +27400,7 @@ import {
   RadioGroup as RadixRadioGroup
 } from "radix-ui";
 import { useCallback as useCallback24, useEffect as useEffect21, useState as useState33 } from "react";
-import { useTranslation as useTranslation37 } from "react-i18next";
+import { useTranslation as useTranslation39 } from "react-i18next";
 import { jsx as jsx88, jsxs as jsxs63 } from "react/jsx-runtime";
 var NumberFilter = ({
   filter,
@@ -27274,7 +27408,7 @@ var NumberFilter = ({
   readonly,
   openOnMount
 }) => {
-  const { t: t2 } = useTranslation37();
+  const { t: t2 } = useTranslation39();
   const [open, setOpen] = useState33(openOnMount);
   const { key, label } = filter;
   const { removeFilter } = useDataTableFilterContext();
@@ -27509,7 +27643,7 @@ import { clx as clx45 } from "@medusajs/ui";
 import { Command } from "cmdk";
 import { Popover as RadixPopover6 } from "radix-ui";
 import { useState as useState34 } from "react";
-import { useTranslation as useTranslation38 } from "react-i18next";
+import { useTranslation as useTranslation40 } from "react-i18next";
 import { jsx as jsx89, jsxs as jsxs64 } from "react/jsx-runtime";
 var SelectFilter = ({
   filter,
@@ -27523,7 +27657,7 @@ var SelectFilter = ({
   const [open, setOpen] = useState34(openOnMount);
   const [search, setSearch] = useState34("");
   const [searchRef, setSearchRef] = useState34(null);
-  const { t: t2 } = useTranslation38();
+  const { t: t2 } = useTranslation40();
   const { removeFilter } = useDataTableFilterContext();
   const { key, label } = filter;
   const selectedParams = useSelectedParams({ param: key, prefix, multiple });
@@ -27763,7 +27897,7 @@ var DataTableFilter2 = ({
   readonly,
   prefix
 }) => {
-  const { t: t2 } = useTranslation39();
+  const { t: t2 } = useTranslation41();
   const [searchParams] = useSearchParams7();
   const [open, setOpen] = useState36(false);
   const [activeFilters, setActiveFilters] = useState36(
@@ -27814,7 +27948,7 @@ var DataTableFilter2 = ({
   return /* @__PURE__ */ jsx91(
     DataTableFilterContext.Provider,
     {
-      value: useMemo22(
+      value: useMemo24(
         () => ({
           removeFilter,
           removeAllFilters
@@ -27978,7 +28112,7 @@ var getInitialFilters = ({
 import { DescendingSorting } from "@medusajs/icons";
 import { DropdownMenu as DropdownMenu7, IconButton as IconButton11 } from "@medusajs/ui";
 import { useState as useState37 } from "react";
-import { useTranslation as useTranslation40 } from "react-i18next";
+import { useTranslation as useTranslation42 } from "react-i18next";
 import { useSearchParams as useSearchParams8 } from "react-router-dom";
 import { jsx as jsx92, jsxs as jsxs67 } from "react/jsx-runtime";
 var initState2 = (params, prefix) => {
@@ -28003,7 +28137,7 @@ var DataTableOrderBy = ({
   const [searchParams, setSearchParams] = useSearchParams8();
   const [state, setState] = useState37(initState2(searchParams, prefix));
   const param = prefix ? `${prefix}_order` : "order";
-  const { t: t2 } = useTranslation40();
+  const { t: t2 } = useTranslation42();
   const direction = useDocumentDirection();
   const handleDirChange = (dir) => {
     setState((prev) => ({
@@ -28102,7 +28236,7 @@ var DataTableOrderBy = ({
 // src/components/table/data-table/data-table-search/data-table-search.tsx
 import { Input as Input13 } from "@medusajs/ui";
 import { useCallback as useCallback27, useEffect as useEffect24 } from "react";
-import { useTranslation as useTranslation41 } from "react-i18next";
+import { useTranslation as useTranslation43 } from "react-i18next";
 import debounce4 from "lodash.debounce";
 import { jsx as jsx93 } from "react/jsx-runtime";
 var DataTableSearch = ({
@@ -28110,7 +28244,7 @@ var DataTableSearch = ({
   prefix,
   autofocus: _autofocus
 }) => {
-  const { t: t2 } = useTranslation41();
+  const { t: t2 } = useTranslation43();
   const placeholderText = placeholder || t2("general.search");
   const selectedParams = useSelectedParams({
     param: "q",
@@ -28180,9 +28314,10 @@ import {
   Fragment as Fragment11,
   useEffect as useEffect25,
   useRef as useRef19,
-  useState as useState38
+  useState as useState38,
+  useContext as useContext14
 } from "react";
-import { useTranslation as useTranslation42 } from "react-i18next";
+import { useTranslation as useTranslation44 } from "react-i18next";
 import { Link as Link8 } from "react-router-dom";
 import { jsx as jsx95, jsxs as jsxs69 } from "react/jsx-runtime";
 var DataTableRoot = ({
@@ -28197,11 +28332,12 @@ var DataTableRoot = ({
   noHeader = false,
   layout = "fit"
 }) => {
-  const { t: t2 } = useTranslation42();
+  const { t: t2 } = useTranslation44();
   const [showStickyBorder, setShowStickyBorder] = useState38(false);
   const scrollableRef = useRef19(null);
   const hasSelect = columns.find((c) => c.id === "select");
   const hasActions = columns.find((c) => c.id === "actions");
+  const permissions = useContext14(PermissionsContext);
   const hasCommandBar = commands && commands.length > 0;
   const rowSelection = table.getState().rowSelection;
   const { pageIndex, pageSize } = table.getState().pagination;
@@ -28387,7 +28523,12 @@ var DataTableRoot = ({
                 {
                   label: command.label,
                   shortcut: command.shortcut,
-                  action: () => handleAction(command.action)
+                  action: () => handleAction(command.action),
+                  disabled: !isPermitted(
+                    permissions,
+                    command.permission,
+                    command.requireAll
+                  )
                 }
               ),
               index < commands.length - 1 && /* @__PURE__ */ jsx95(CommandBar.Seperator, {})
@@ -28399,7 +28540,7 @@ var DataTableRoot = ({
   );
 };
 var Pagination = (props) => {
-  const { t: t2 } = useTranslation42();
+  const { t: t2 } = useTranslation44();
   const translations = {
     of: t2("general.of"),
     results: t2("general.results"),
@@ -28513,8 +28654,8 @@ var CodeHeader = ({ text }) => {
 };
 
 // src/components/table/table-cells/common/created-at-cell/created-at-cell.tsx
-import { Tooltip as Tooltip11 } from "@medusajs/ui";
-import { useTranslation as useTranslation43 } from "react-i18next";
+import { Tooltip as Tooltip13 } from "@medusajs/ui";
+import { useTranslation as useTranslation45 } from "react-i18next";
 
 // src/components/table/table-cells/common/placeholder-cell/placeholder-cell.tsx
 import { jsx as jsx98 } from "react/jsx-runtime";
@@ -28530,7 +28671,7 @@ var CreatedAtCell = ({ date }) => {
     return /* @__PURE__ */ jsx99(PlaceholderCell, {});
   }
   return /* @__PURE__ */ jsx99("div", { className: "flex h-full w-full items-center overflow-hidden", children: /* @__PURE__ */ jsx99(
-    Tooltip11,
+    Tooltip13,
     {
       className: "z-10",
       content: /* @__PURE__ */ jsx99("span", { className: "text-pretty", children: `${getFullDate({
@@ -28542,13 +28683,13 @@ var CreatedAtCell = ({ date }) => {
   ) });
 };
 var CreatedAtHeader = () => {
-  const { t: t2 } = useTranslation43();
+  const { t: t2 } = useTranslation45();
   return /* @__PURE__ */ jsx99("div", { className: "flex h-full w-full items-center", children: /* @__PURE__ */ jsx99("span", { className: "truncate", children: t2("fields.createdAt") }) });
 };
 
 // src/components/table/table-cells/common/date-cell/date-cell.tsx
-import { Tooltip as Tooltip12 } from "@medusajs/ui";
-import { useTranslation as useTranslation44 } from "react-i18next";
+import { Tooltip as Tooltip14 } from "@medusajs/ui";
+import { useTranslation as useTranslation46 } from "react-i18next";
 import { jsx as jsx100 } from "react/jsx-runtime";
 var DateCell = ({ date }) => {
   const { getFullDate } = useDate();
@@ -28556,7 +28697,7 @@ var DateCell = ({ date }) => {
     return /* @__PURE__ */ jsx100(PlaceholderCell, {});
   }
   return /* @__PURE__ */ jsx100("div", { className: "flex h-full w-full items-center overflow-hidden", children: /* @__PURE__ */ jsx100(
-    Tooltip12,
+    Tooltip14,
     {
       className: "z-10",
       content: /* @__PURE__ */ jsx100("span", { className: "text-pretty", children: `${getFullDate({
@@ -28568,12 +28709,12 @@ var DateCell = ({ date }) => {
   ) });
 };
 var DateHeader = () => {
-  const { t: t2 } = useTranslation44();
+  const { t: t2 } = useTranslation46();
   return /* @__PURE__ */ jsx100("div", { className: "flex h-full w-full items-center", children: /* @__PURE__ */ jsx100("span", { className: "truncate", children: t2("fields.date") }) });
 };
 
 // src/components/table/table-cells/common/email-cell/email-cell.tsx
-import { useTranslation as useTranslation45 } from "react-i18next";
+import { useTranslation as useTranslation47 } from "react-i18next";
 import { jsx as jsx101 } from "react/jsx-runtime";
 var EmailCell = ({ email }) => {
   if (!email) {
@@ -28582,7 +28723,7 @@ var EmailCell = ({ email }) => {
   return /* @__PURE__ */ jsx101("div", { className: "flex h-full w-full items-center overflow-hidden", children: /* @__PURE__ */ jsx101("span", { className: "truncate", children: email }) });
 };
 var EmailHeader = () => {
-  const { t: t2 } = useTranslation45();
+  const { t: t2 } = useTranslation47();
   return /* @__PURE__ */ jsx101("div", { className: "flex h-full w-full items-center", children: /* @__PURE__ */ jsx101("span", { className: "truncate", children: t2("fields.email") }) });
 };
 
@@ -28616,7 +28757,7 @@ var MoneyAmountCell = ({
 };
 
 // src/components/table/table-cells/common/name-cell/name-cell.tsx
-import { useTranslation as useTranslation46 } from "react-i18next";
+import { useTranslation as useTranslation48 } from "react-i18next";
 import { jsx as jsx103 } from "react/jsx-runtime";
 var NameCell = ({ firstName, lastName }) => {
   if (!firstName && !lastName) {
@@ -28626,7 +28767,7 @@ var NameCell = ({ firstName, lastName }) => {
   return /* @__PURE__ */ jsx103("div", { className: "flex h-full w-full items-center overflow-hidden", children: /* @__PURE__ */ jsx103("span", { className: "truncate", children: name }) });
 };
 var NameHeader = () => {
-  const { t: t2 } = useTranslation46();
+  const { t: t2 } = useTranslation48();
   return /* @__PURE__ */ jsx103("div", { className: "flex h-full w-full items-center", children: /* @__PURE__ */ jsx103("span", { className: "truncate", children: t2("fields.name") }) });
 };
 
@@ -28696,7 +28837,7 @@ var TextHeader = ({ text, align = "left" }) => {
 // src/components/utilities/error-boundary/error-boundary.tsx
 import { ExclamationCircle as ExclamationCircle4 } from "@medusajs/icons";
 import { Text as Text21 } from "@medusajs/ui";
-import { useTranslation as useTranslation47 } from "react-i18next";
+import { useTranslation as useTranslation49 } from "react-i18next";
 import { Navigate, useLocation as useLocation3, useRouteError } from "react-router-dom";
 
 // src/lib/is-fetch-error.ts
@@ -28710,7 +28851,7 @@ import { jsx as jsx106, jsxs as jsxs72 } from "react/jsx-runtime";
 var ErrorBoundary = () => {
   const error = useRouteError();
   const location = useLocation3();
-  const { t: t2 } = useTranslation47();
+  const { t: t2 } = useTranslation49();
   let code = null;
   if (isClientError(error)) {
     if (error.status === 401) {
@@ -28770,7 +28911,7 @@ import {
   getPaginationRowModel,
   useReactTable as useReactTable2
 } from "@tanstack/react-table";
-import { useEffect as useEffect26, useMemo as useMemo23, useState as useState39 } from "react";
+import { useEffect as useEffect26, useMemo as useMemo25, useState as useState39 } from "react";
 import { useSearchParams as useSearchParams9 } from "react-router-dom";
 var useDataTable2 = ({
   data = [],
@@ -28793,7 +28934,7 @@ var useDataTable2 = ({
     pageIndex: offset ? Math.ceil(Number(offset) / _pageSize) : 0,
     pageSize: _pageSize
   });
-  const pagination = useMemo23(
+  const pagination = useMemo25(
     () => ({
       pageIndex,
       pageSize
@@ -28854,41 +28995,8 @@ var useDataTable2 = ({
   return { table };
 };
 
-// src/permissions/permissions-context.tsx
-import { createContext as createContext10 } from "react";
-var PermissionsContext = createContext10(
-  null
-);
-
-// src/permissions/permissions-provider.tsx
-import { useCallback as useCallback28, useMemo as useMemo24 } from "react";
-
-// ../dashboard-sdk/dist/index.js
-var PERMISSION_RIGHT_RANK = {
-  view: 1,
-  edit: 2,
-  manage: 3
-};
-function parsePermission(permission) {
-  const index = permission.lastIndexOf(":");
-  if (index <= 0) {
-    return null;
-  }
-  const right = permission.slice(index + 1);
-  if (!(right in PERMISSION_RIGHT_RANK)) {
-    return null;
-  }
-  return {
-    key: permission.slice(0, index),
-    right
-  };
-}
-function satisfiesPermission(permissions, key, right) {
-  const granted = permissions[key];
-  return !!granted && PERMISSION_RIGHT_RANK[granted] >= PERMISSION_RIGHT_RANK[right];
-}
-
 // src/permissions/permissions-provider.tsx
+import { useCallback as useCallback28, useMemo as useMemo26 } from "react";
 import { jsx as jsx108 } from "react/jsx-runtime";
 var PermissionsProvider = ({
   permissions = null,
@@ -28918,7 +29026,7 @@ var PermissionsProvider = ({
     (list) => !permissions || list.every(hasPermission),
     [permissions, hasPermission]
   );
-  const value = useMemo24(
+  const value = useMemo26(
     () => ({
       permissions,
       isLoading,
@@ -28934,9 +29042,9 @@ var PermissionsProvider = ({
 };
 
 // src/permissions/use-permissions.tsx
-import { useContext as useContext10 } from "react";
+import { useContext as useContext15 } from "react";
 var usePermissions = () => {
-  const context = useContext10(PermissionsContext);
+  const context = useContext15(PermissionsContext);
   if (!context) {
     throw new Error("usePermissions must be used within a PermissionsProvider");
   }
@@ -28960,8 +29068,8 @@ var PermissionGuard = ({
 // src/permissions/route-permission-guard.tsx
 import { ExclamationCircle as ExclamationCircle5 } from "@medusajs/icons";
 import { Container as Container6, Heading as Heading10, Text as Text22 } from "@medusajs/ui";
-import { useMemo as useMemo25 } from "react";
-import { useTranslation as useTranslation48 } from "react-i18next";
+import { useMemo as useMemo27 } from "react";
+import { useTranslation as useTranslation50 } from "react-i18next";
 import { Navigate as Navigate2, Outlet as Outlet3, useMatches } from "react-router-dom";
 import { jsx as jsx110, jsxs as jsxs73 } from "react/jsx-runtime";
 var readRequirementFromHandle = (handle) => {
@@ -28993,7 +29101,7 @@ var readRequirementFromHandle = (handle) => {
 var RoutePermissionGuard = () => {
   const matches = useMatches();
   const { hasAnyPermission, hasAllPermissions, isLoading } = usePermissions();
-  const requirement = useMemo25(() => {
+  const requirement = useMemo27(() => {
     for (let i = matches.length - 1; i >= 0; i--) {
       const found = readRequirementFromHandle(matches[i].handle);
       if (found) {
@@ -29017,7 +29125,7 @@ var RoutePermissionGuard = () => {
 var AccessDenied = ({
   requirement
 }) => {
-  const { t: t2 } = useTranslation48();
+  const { t: t2 } = useTranslation50();
   return /* @__PURE__ */ jsx110("div", { className: "bg-ui-bg-subtle absolute bottom-0 left-0 right-0 top-0 flex min-h-screen items-center justify-center p-4", children: /* @__PURE__ */ jsx110(Container6, { className: "max-w-md", children: /* @__PURE__ */ jsxs73("div", { className: "flex flex-col items-center gap-y-4 py-8 text-center", children: [
     /* @__PURE__ */ jsx110("div", { className: "bg-ui-bg-subtle flex h-12 w-12 items-center justify-center rounded-full", children: /* @__PURE__ */ jsx110(ExclamationCircle5, { className: "text-ui-fg-muted" }) }),
     /* @__PURE__ */ jsxs73("div", { className: "flex flex-col gap-y-1", children: [
@@ -29031,10 +29139,10 @@ var AccessDenied = ({
 };
 
 // src/permissions/use-resource-permissions.tsx
-import { useMemo as useMemo26 } from "react";
+import { useMemo as useMemo28 } from "react";
 var useResourcePermissions = (key) => {
   const { can, isLoading } = usePermissions();
-  return useMemo26(
+  return useMemo28(
     () => ({
       canView: can(key, "view"),
       canEdit: can(key, "edit"),
@@ -29046,6 +29154,48 @@ var useResourcePermissions = (key) => {
   );
 };
 
+// src/permissions/use-can.tsx
+var useCan = (key, right = "view") => usePermissions().can(key, right);
+
+// src/permissions/permission-action.tsx
+import { Tooltip as Tooltip15 } from "@medusajs/ui";
+import {
+  cloneElement as cloneElement2,
+  isValidElement
+} from "react";
+import { jsx as jsx111 } from "react/jsx-runtime";
+var PermissionAction = ({
+  permission,
+  requireAll = false,
+  children
+}) => {
+  const gate = usePermissionGate(permission, requireAll);
+  if (gate.allowed) {
+    return children;
+  }
+  const inner = children.props.children;
+  const label = children.props.asChild && isValidElement(inner) ? inner.props.children : inner;
+  return /* @__PURE__ */ jsx111(Tooltip15, { content: gate.tooltip, children: /* @__PURE__ */ jsx111("span", { className: "inline-flex", children: cloneElement2(children, { disabled: true, asChild: false }, label) }) });
+};
+
+// src/permissions/section-no-access.tsx
+import { Text as Text23 } from "@medusajs/ui";
+import { useTranslation as useTranslation51 } from "react-i18next";
+import { jsx as jsx112 } from "react/jsx-runtime";
+var SectionNoAccess = ({ className }) => {
+  const { t: t2 } = useTranslation51();
+  return /* @__PURE__ */ jsx112("div", { className: className ?? "px-6 py-4", "data-testid": "section-no-access", children: /* @__PURE__ */ jsx112(Text23, { size: "small", leading: "compact", className: "text-ui-fg-subtle", children: t2("permissions.noAccess") }) });
+};
+
+// src/permissions/with-permission.ts
+var createWithPermission = (getPermissions) => (loader, permission, options = {}) => async (args) => {
+  const permissions = await getPermissions().catch(() => null);
+  if (!permissionMapAllows(permissions, permission, options.requireAll ?? true)) {
+    return null;
+  }
+  return loader(args);
+};
+
 // src/providers/sidebar-provider/classes.ts
 var SIDEBAR_RAIL_FADE = [
   "transition-opacity duration-150 delay-100 ease-out motion-reduce:transition-none",
@@ -29059,9 +29209,9 @@ import { createContext as createContext11 } from "react";
 var SidebarContext = createContext11(null);
 
 // src/providers/sidebar-provider/sidebar-provider.tsx
-import { useCallback as useCallback29, useEffect as useEffect27, useMemo as useMemo27, useState as useState40 } from "react";
+import { useCallback as useCallback29, useEffect as useEffect27, useMemo as useMemo29, useState as useState40 } from "react";
 import { useLocation as useLocation4 } from "react-router-dom";
-import { jsx as jsx111 } from "react/jsx-runtime";
+import { jsx as jsx113 } from "react/jsx-runtime";
 var SidebarProvider = ({ children }) => {
   const [desktop, setDesktop] = useState40(true);
   const [mobile, setMobile] = useState40(false);
@@ -29076,7 +29226,7 @@ var SidebarProvider = ({ children }) => {
       setMobile((open) => !open);
     }
   }, []);
-  const value = useMemo27(
+  const value = useMemo29(
     () => ({
       state: desktop ? "expanded" : "collapsed",
       desktop,
@@ -29087,16 +29237,16 @@ var SidebarProvider = ({ children }) => {
     }),
     [desktop, mobile, toggle]
   );
-  return /* @__PURE__ */ jsx111(SidebarContext.Provider, { value, children });
+  return /* @__PURE__ */ jsx113(SidebarContext.Provider, { value, children });
 };
 
 // src/providers/sidebar-provider/use-collapsed-sidebar.tsx
 import { useEffect as useEffect28, useRef as useRef20 } from "react";
 
 // src/providers/sidebar-provider/use-sidebar.tsx
-import { useContext as useContext11 } from "react";
+import { useContext as useContext16 } from "react";
 var useSidebar = () => {
-  const context = useContext11(SidebarContext);
+  const context = useContext16(SidebarContext);
   if (!context) {
     throw new Error("useSidebar must be used within a SidebarProvider");
   }
@@ -29350,6 +29500,7 @@ export {
   NoResults,
   OrderBy,
   PercentageInput,
+  PermissionAction,
   PermissionGuard,
   PermissionsContext,
   PermissionsProvider,
@@ -29372,6 +29523,7 @@ export {
   RoutePermissionGuard,
   SIDEBAR_MENU_CONTENT,
   SIDEBAR_RAIL_FADE,
+  SectionNoAccess,
   SectionRow,
   SegmentedControl,
   SidebarContext,
@@ -29400,6 +29552,7 @@ export {
   VisuallyHidden,
   WidgetZone,
   _DataTable,
+  applyActionPermissions,
   applyNavOverrides,
   buildAdditionalDataDefaults,
   buildAdditionalDataSchema,
@@ -29409,9 +29562,11 @@ export {
   createDataGridHelper,
   createDataGridPriceColumns,
   createFormHelper,
+  createWithPermission,
   currencies,
   extractPricesFromOffers,
   extractReferenceIds,
+  filterCommandsByPermission,
   formatFieldValue,
   genericForwardRef,
   getCountryByIso2,
@@ -29427,22 +29582,27 @@ export {
   getStylizedAmount,
   humanizeFieldName,
   isAmountLessThenRoundingError,
+  isForbidden,
   isHtml,
   isImageList,
   isOrderActionable,
   isOrderAwaitingAction,
+  isPermitted,
   isPriceListGroupRow,
   isProductRow,
   isReferenceField,
   isSameAddress,
   linkFields,
+  permissionMapAllows,
   plainTextToHtml,
   productChangeViewHasContent,
   queryClient,
   queryKeysFactory,
   richTextContentClasses,
   sanitizeRichText,
+  toPermissionList,
   useActionLocks,
+  useCan,
   useCollapsedSidebar,
   useCombinedRefs,
   useCommandHistory,
@@ -29456,7 +29616,9 @@ export {
   useExtension,
   useExtensionActivity,
   useLinkQuery,
+  usePermissionGate,
   usePermissions,
+  usePermittedCommands,
   useQueryParams,
   useResourcePermissions,
   useRouteModal,