@dmsi/wedgekit-react 0.0.500 → 0.0.502

package/dist/{chunk-ZQJMNPCF.js → chunk-25RZP3VR.js}

@@ -1,13 +1,13 @@
+import {
+  Button
+} from "./chunk-45AHDOAU.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
-import {
-  Button
-} from "./chunk-LPY6PMAY.js";
 import {
   layoutGroupGap,
   layoutPaddding
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 
 // src/components/ModalButtons.tsx
 import clsx from "clsx";

package/dist/{chunk-PIBHG6DH.js → chunk-2TNHD4MQ.js}

@@ -1,6 +1,6 @@
 import {
   InputBase
-} from "./chunk-G4AWTFBQ.js";
+} from "./chunk-KPBG7D3V.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";

package/dist/{chunk-3DEYCNUE.js → chunk-3UUCDNX3.js}

@@ -3,13 +3,13 @@ import {
 } from "./chunk-5IFPG6TS.js";
 import {
   MobileDataGridColumn
-} from "./chunk-KW6V7O3H.js";
+} from "./chunk-UI7P5J5S.js";
 import {
   Paragraph
-} from "./chunk-ZSETMD4A.js";
+} from "./chunk-WMPWWFUJ.js";
 import {
   Stack
-} from "./chunk-DORD2EBO.js";
+} from "./chunk-TPXH53SA.js";
 
 // src/components/MobileDataGrid/RowDetailModalProvider/ModalContent.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -26,7 +26,7 @@ function ModalContent() {
       return ((_a = column.meta) == null ? void 0 : _a.useCustomRenderer) && column.meta.mobileCell && column.id ? /* @__PURE__ */ jsxs(
         "div",
         {
-          className: "grid grid-cols-2 gap-2 px-3 items-center flex-1",
+          className: "grid grid-cols-2 gap-2 items-center flex-1",
           children: [
             /* @__PURE__ */ jsxs(Paragraph, { color: "text-secondary-normal", className: "text-left", children: [
               (_b = column.header) == null ? void 0 : _b.toString(),

package/dist/{chunk-LPY6PMAY.js → chunk-45AHDOAU.js}

@@ -5,7 +5,7 @@ import {
   componentPaddingXUsingComponentGap,
   paddingUsingComponentGap,
   typography
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-JUFBGNWW.js → chunk-5DQVYX6H.js}

@@ -1,9 +1,9 @@
+import {
+  Button
+} from "./chunk-45AHDOAU.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
-import {
-  Button
-} from "./chunk-LPY6PMAY.js";
 
 // src/components/PDFViewer/DownloadIcon.tsx
 import { jsx } from "react/jsx-runtime";

package/dist/{chunk-XIXQUEYC.js → chunk-5YNEY3WO.js}

@@ -3,22 +3,27 @@ import {
 } from "./chunk-5IFPG6TS.js";
 import {
   MobileDataGridColumn
-} from "./chunk-KW6V7O3H.js";
+} from "./chunk-UI7P5J5S.js";
 import {
   Checkbox
-} from "./chunk-WEAVZEE4.js";
+} from "./chunk-M7WHWZ2J.js";
 import {
   Subheader
-} from "./chunk-UCJUC5AZ.js";
+} from "./chunk-BYC6QID5.js";
 import {
   Paragraph
-} from "./chunk-ZSETMD4A.js";
+} from "./chunk-WMPWWFUJ.js";
 import {
   Stack
-} from "./chunk-DORD2EBO.js";
+} from "./chunk-TPXH53SA.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
+import {
+  layoutGroupGap,
+  layoutPaddingX,
+  paddingYUsingLayoutGroupGap
+} from "./chunk-7KWFEH56.js";
 
 // src/components/MobileDataGrid/MobileDataGridCard/index.tsx
 import clsx from "clsx";
@@ -40,8 +45,12 @@ function MobileDataGridCard({
       id: id ? `${id}-card-${getId(data)}` : void 0,
       "data-testid": testid ? `${testid}-card-${getId(data)}` : void 0,
       className: clsx(
+        "flex flex-col",
         "hover:bg-action-100 cursor-pointer list-none",
-        selected ? "bg-action-100" : "bg-background-grouped-primary-normal"
+        selected ? "bg-action-100" : "bg-background-grouped-primary-normal",
+        layoutGroupGap,
+        layoutPaddingX,
+        paddingYUsingLayoutGroupGap
       ),
       onClick: () => openRowDetail(data),
       children: [
@@ -53,6 +62,7 @@ function MobileDataGridCard({
                 sizing: "component",
                 padding: true,
                 width: "fit",
+                style: { paddingLeft: 0, paddingRight: 8 },
                 onClick: (e) => e.stopPropagation(),
                 children: /* @__PURE__ */ jsx(
                   Checkbox,
@@ -71,6 +81,7 @@ function MobileDataGridCard({
                 sizing: "component",
                 padding: true,
                 onClick: (e) => e.stopPropagation(),
+                style: { paddingInline: 0 },
                 children: renderLink ? renderLink(data) : /* @__PURE__ */ jsx(Subheader, { children: String((_a = data[context.primaryKey]) != null ? _a : "") })
               }
             ),
@@ -96,7 +107,7 @@ function MobileDataGridCard({
               return ((_a2 = column.meta) == null ? void 0 : _a2.useCustomRenderer) && column.meta.mobileCell && column.id ? /* @__PURE__ */ jsxs(
                 "div",
                 {
-                  className: "grid grid-cols-2 gap-2 px-3 items-center flex-1",
+                  className: "grid grid-cols-2 gap-2 items-center flex-1",
                   children: [
                     /* @__PURE__ */ jsxs(
                       Paragraph,
@@ -132,7 +143,7 @@ function MobileDataGridCard({
             }
           ) })
         ] }),
-        renderChevron && /* @__PURE__ */ jsx(Stack, { items: "center", justify: "center", horizontal: true, horizontalMobile: true, children: /* @__PURE__ */ jsx(Icon, { name: "keyboard_arrow_down" }) })
+        renderChevron && /* @__PURE__ */ jsx(Stack, { items: "center", justify: "center", horizontal: true, horizontalMobile: true, children: /* @__PURE__ */ jsx("span", { className: "text-icon-primary-normal", children: /* @__PURE__ */ jsx(Icon, { name: "keyboard_arrow_down" }) }) })
       ]
     }
   );

package/dist/{chunk-IXR65MOU.js → chunk-7KWFEH56.js}

@@ -116,6 +116,9 @@ var layoutPaddingBottom = clsx(
 var layoutPaddingY = clsx(
   "py-mobile-layout-padding desktop:py-desktop-layout-padding compact:py-desktop-compact-layout-padding"
 );
+var layoutPaddingX = clsx(
+  "px-mobile-layout-padding desktop:px-desktop-layout-padding compact:px-desktop-compact-layout-padding"
+);
 var containerPaddingX = clsx(
   "px-mobile-container-padding desktop:px-desktop-container-padding compact:px-desktop-compact-container-padding"
 );
@@ -153,6 +156,7 @@ export {
   componentPaddingMinusBorderDesktop,
   layoutPaddding,
   layoutPaddingBottom,
+  layoutPaddingX,
   containerPaddingX,
   containerPaddingY,
   layoutGroupGapPaddingY,

package/dist/{chunk-4LBQSSGH.js → chunk-B2O4TEOI.js}

@@ -1,15 +1,15 @@
 import {
   PDFElement
-} from "./chunk-YEZBNQZI.js";
+} from "./chunk-VOSQMHNF.js";
 import {
   PdfNavigation
-} from "./chunk-B53XDCLO.js";
+} from "./chunk-VS53C5ZD.js";
 import {
   DownloadIcon
-} from "./chunk-JUFBGNWW.js";
+} from "./chunk-5DQVYX6H.js";
 import {
   Modal
-} from "./chunk-TOKS63IK.js";
+} from "./chunk-LJLHGLTS.js";
 
 // src/components/PDFViewer/index.tsx
 import { useCallback, useEffect, useState } from "react";

package/dist/{chunk-4UH72JT2.js → chunk-BWBSDSA7.js}

@@ -1,18 +1,18 @@
 import {
   Heading2
-} from "./chunk-H2KC5XUY.js";
+} from "./chunk-MXSJF6TW.js";
+import {
+  Button
+} from "./chunk-45AHDOAU.js";
 import {
   Paragraph
-} from "./chunk-ZSETMD4A.js";
+} from "./chunk-WMPWWFUJ.js";
 import {
   Stack
-} from "./chunk-DORD2EBO.js";
+} from "./chunk-TPXH53SA.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
-import {
-  Button
-} from "./chunk-LPY6PMAY.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-UCJUC5AZ.js → chunk-BYC6QID5.js}

@@ -1,6 +1,6 @@
 import {
   typography
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-YD3HWIUJ.js → chunk-D4TFZ2WM.js}

@@ -1,24 +1,24 @@
 import {
   ModalContent
-} from "./chunk-3DEYCNUE.js";
+} from "./chunk-3UUCDNX3.js";
 import {
   useGridContext
 } from "./chunk-5IFPG6TS.js";
 import {
   Modal
-} from "./chunk-TOKS63IK.js";
+} from "./chunk-LJLHGLTS.js";
 import {
   Heading2
-} from "./chunk-H2KC5XUY.js";
+} from "./chunk-MXSJF6TW.js";
+import {
+  Button
+} from "./chunk-45AHDOAU.js";
 import {
   Stack
-} from "./chunk-DORD2EBO.js";
+} from "./chunk-TPXH53SA.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
-import {
-  Button
-} from "./chunk-LPY6PMAY.js";
 
 // src/components/MobileDataGrid/RowDetailModalProvider/index.tsx
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/{chunk-HIKWIY5Q.js → chunk-F6RZ7MUE.js}

@@ -6,10 +6,10 @@ import {
 } from "./chunk-DVU5XV7L.js";
 import {
   MenuOption
-} from "./chunk-5R4C5F63.js";
+} from "./chunk-LKKFQLWD.js";
 import {
   Search
-} from "./chunk-5MLYAQQO.js";
+} from "./chunk-HK4S6TRH.js";
 import {
   CSS
 } from "./chunk-WVUIIBRR.js";
@@ -19,7 +19,7 @@ import {
 import {
   componentPadding,
   paddingUsingComponentGap
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-XHQOTLG6.js → chunk-FJRYHJUV.js}

@@ -21,7 +21,7 @@ import {
 } from "./chunk-URYQ24NF.js";
 import {
   Stack
-} from "./chunk-DORD2EBO.js";
+} from "./chunk-TPXH53SA.js";
 
 // src/components/ProductImagePreview/useProductImagePreview.ts
 import { useCallback, useEffect, useRef, useState, useMemo } from "react";

package/dist/{chunk-2F3R3WXW.js → chunk-GYEXSNFP.js}

@@ -1,19 +1,19 @@
 import {
   Label
-} from "./chunk-AL5QIRY3.js";
+} from "./chunk-HXGJVYGQ.js";
+import {
+  Button
+} from "./chunk-45AHDOAU.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
-import {
-  Button
-} from "./chunk-LPY6PMAY.js";
 import {
   baseTransition,
   componentGap,
   componentPadding,
   componentPaddingMinusBorder,
   componentPaddingYUsingComponentGap
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-5MLYAQQO.js → chunk-HK4S6TRH.js}

@@ -1,6 +1,6 @@
 import {
   Input
-} from "./chunk-G4AWTFBQ.js";
+} from "./chunk-KPBG7D3V.js";
 import {
   __objRest,
   __spreadValues

package/dist/{chunk-AL5QIRY3.js → chunk-HXGJVYGQ.js}

@@ -1,7 +1,7 @@
 import {
   componentPaddingXUsingComponentGap,
   typography
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-KHIJYWZ7.js → chunk-KIAF4N7M.js}

@@ -1,6 +1,6 @@
 import {
   typography
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-G4AWTFBQ.js → chunk-KPBG7D3V.js}

@@ -1,6 +1,6 @@
 import {
   Label
-} from "./chunk-AL5QIRY3.js";
+} from "./chunk-HXGJVYGQ.js";
 import {
   formatCurrencyDisplay,
   formatDecimalValue,
@@ -8,7 +8,7 @@ import {
 } from "./chunk-5UH6QUFB.js";
 import {
   Paragraph
-} from "./chunk-ZSETMD4A.js";
+} from "./chunk-WMPWWFUJ.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
@@ -19,7 +19,7 @@ import {
   componentPaddingMinusBorderDesktop,
   componentPaddingXUsingComponentGap,
   typography
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-GRGDX7JC.js → chunk-LB7UT6F3.js}

@@ -1,12 +1,12 @@
 import {
   Subheader
-} from "./chunk-UCJUC5AZ.js";
+} from "./chunk-BYC6QID5.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
 import {
   paddingUsingComponentGap
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 
 // src/components/Pagination.tsx
 import { useCallback, useMemo } from "react";

package/dist/{chunk-TOKS63IK.js → chunk-LJLHGLTS.js}

@@ -1,18 +1,18 @@
 import {
   useMounted
 } from "./chunk-4RJKB7LC.js";
+import {
+  ModalButtons
+} from "./chunk-25RZP3VR.js";
 import {
   ModalContent
-} from "./chunk-FG7GNGE3.js";
+} from "./chunk-WVVEOCEH.js";
 import {
   ModalHeader
-} from "./chunk-X4UK7HE2.js";
+} from "./chunk-TAPYQBQU.js";
 import {
   ModalScrim
 } from "./chunk-AG43RS4Q.js";
-import {
-  ModalButtons
-} from "./chunk-ZQJMNPCF.js";
 import {
   useMatchesMobile
 } from "./chunk-URYQ24NF.js";

package/dist/{chunk-5R4C5F63.js → chunk-LKKFQLWD.js}

@@ -1,15 +1,15 @@
 import {
   Label
-} from "./chunk-AL5QIRY3.js";
+} from "./chunk-HXGJVYGQ.js";
 import {
   Caption
-} from "./chunk-BTKWHCUE.js";
+} from "./chunk-PS6UJZVH.js";
 import {
   useMatchesMobile
 } from "./chunk-URYQ24NF.js";
 import {
   Paragraph
-} from "./chunk-ZSETMD4A.js";
+} from "./chunk-WMPWWFUJ.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
@@ -18,7 +18,7 @@ import {
   componentGap,
   componentPadding,
   layoutGroupGap
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __spreadProps,
   __spreadValues
@@ -26,7 +26,7 @@ import {
 
 // src/components/MenuOption.tsx
 import clsx from "clsx";
-import { useId, useRef } from "react";
+import { useId, useRef, useState } from "react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var MenuOption = ({
   id,
@@ -60,6 +60,7 @@ var MenuOption = ({
   const actualRef = ref || internalRef;
   const menuId = useRef(`menu-${uniqueId}`);
   const isMobile = useMatchesMobile();
+  const [isSubMenuHovered, setIsSubMenuHovered] = useState(false);
   const handleMouseEnter = () => {
     if (subMenu && onSubMenuHover && !disabled) {
       onSubMenuHover(menuId.current, subMenuLevel);
@@ -69,6 +70,7 @@ var MenuOption = ({
     if (subMenu && onSubMenuLeave && !disabled) {
       onSubMenuLeave(subMenuLevel);
     }
+    setIsSubMenuHovered(false);
   };
   const handleMouseMove = () => {
     if (subMenu && onMouseMove && !disabled) {
@@ -79,9 +81,11 @@ var MenuOption = ({
     if (onSubMenuEnter) {
       onSubMenuEnter();
     }
+    setIsSubMenuHovered(true);
   };
   const additionalAttributes = {
-    "data-selected": selected || null
+    "data-selected": selected || null,
+    "data-submenu-hovered": isSubMenuHovered || null
   };
   const svgStyles = clsx(
     "[&>svg]:shrink-0 [&>svg]:fill-icon-action-primary-normal"
@@ -90,16 +94,18 @@ var MenuOption = ({
   const normalStyles = variant === "normal" && !disabled && clsx(
     "bg-transparent text-text-primary-normal",
     "hover:bg-background-action-secondary-hover",
-    "focus:bg-background-action-secondary-hover",
+    "focus-visible:bg-background-action-secondary-hover",
     "data-selected:bg-background-action-secondary-hover",
+    "data-submenu-hovered:bg-background-action-secondary-hover",
     "active:bg-background-action-secondary-active"
   );
   const normalDisabledStyles = variant === "normal" && disabled && clsx("text-text-primary-disabled");
   const actionStyles = variant === "action" && !disabled && clsx(
     "text-action-400 bg-transparent",
     "hover:bg-background-action-secondary-hover hover:text-text-action-hover",
-    "focus:bg-background-action-secondary-hover focus:text-text-action-hover",
+    "focus-visible:bg-background-action-secondary-hover focus-visible:text-text-action-hover",
     "data-selected:bg-background-action-secondary-active data-selected:text-text-action-active",
+    "data-submenu-hovered:bg-background-action-secondary-active data-submenu-hovered:text-text-action-active",
     "active:bg-background-action-secondary-active active:text-text-action-active"
   );
   const actionDisabledStyles = variant === "action" && disabled && clsx("text-text-action-disabled");
@@ -151,7 +157,10 @@ var MenuOption = ({
       "div",
       {
         onMouseEnter: handleSubMenuEnter,
-        onMouseLeave: handleMouseLeave,
+        onMouseLeave: () => {
+          handleMouseLeave();
+          setIsSubMenuHovered(false);
+        },
         "data-submenu-parent": menuId.current,
         "data-menu-level": subMenuLevel + 1,
         children: subMenu({
@@ -161,7 +170,8 @@ var MenuOption = ({
           position: "right",
           subMenuLevel,
           mobileBackMenuOption,
-          mobileHide: isMobile && activeMenu !== menuId.current
+          mobileHide: isMobile && activeMenu !== menuId.current,
+          autoFocusOff: true
         })
       }
     )

package/dist/{chunk-WEAVZEE4.js → chunk-M7WHWZ2J.js}

@@ -1,13 +1,13 @@
 import {
   Paragraph
-} from "./chunk-ZSETMD4A.js";
+} from "./chunk-WMPWWFUJ.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
 import {
   baseTransition,
   componentGap
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadValues

package/dist/{chunk-7GHD74J3.js → chunk-MDB26F6T.js}

@@ -1,7 +1,7 @@
 import {
   componentPadding,
   typography
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 
 // src/components/Tooltip.tsx
 import clsx from "clsx";

package/dist/{chunk-Z6HIIJK3.js → chunk-MO52RSXV.js}

@@ -2,7 +2,7 @@ import {
   baseTransition,
   componentPaddingY,
   typography
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-IY7SXEVY.js → chunk-MUOYLXBF.js}

@@ -3,16 +3,16 @@ import {
 } from "./chunk-KBJZUVLM.js";
 import {
   Paragraph
-} from "./chunk-ZSETMD4A.js";
+} from "./chunk-WMPWWFUJ.js";
 import {
   Stack
-} from "./chunk-DORD2EBO.js";
+} from "./chunk-TPXH53SA.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
 import {
   typography
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 
 // src/components/Accordion.tsx
 import clsx from "clsx";

package/dist/{chunk-PCQXSYTH.js → chunk-MV6W7OMC.js}

@@ -1,9 +1,9 @@
+import {
+  Button
+} from "./chunk-45AHDOAU.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";
-import {
-  Button
-} from "./chunk-LPY6PMAY.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-H2KC5XUY.js → chunk-MXSJF6TW.js}

@@ -1,6 +1,6 @@
 import {
   typography
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-7BVUTFZ5.js → chunk-OWHPPZZA.js}

@@ -1,9 +1,9 @@
 import {
   Subheader
-} from "./chunk-UCJUC5AZ.js";
+} from "./chunk-BYC6QID5.js";
 import {
   Stack
-} from "./chunk-DORD2EBO.js";
+} from "./chunk-TPXH53SA.js";
 
 // src/components/SimpleTable.tsx
 import clsx from "clsx";

package/dist/{chunk-G7EOLHST.js → chunk-PJL5XESN.js}

@@ -1,6 +1,6 @@
 import {
   Button
-} from "./chunk-LPY6PMAY.js";
+} from "./chunk-45AHDOAU.js";
 import {
   __objRest,
   __spreadProps,

package/dist/{chunk-QMSPTD6L.js → chunk-PRN2EQBX.js}

@@ -1,6 +1,6 @@
 import {
   MobileDataGridCard
-} from "./chunk-XIXQUEYC.js";
+} from "./chunk-5YNEY3WO.js";
 import {
   useGridContext
 } from "./chunk-5IFPG6TS.js";

package/dist/{chunk-BTKWHCUE.js → chunk-PS6UJZVH.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-NKUETCDA.js";
 import {
   typography
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,