@dmsi/wedgekit-react 0.0.500 → 0.0.502

package/dist/{chunk-TWDH7ZDS.js → chunk-QV3NANQC.js}

@@ -3,47 +3,47 @@ import {
 } from "./chunk-M7INAUAJ.js";
 import {
   RowDetailModalProvider
-} from "./chunk-YD3HWIUJ.js";
+} from "./chunk-D4TFZ2WM.js";
 import {
   ColumnList
-} from "./chunk-QMSPTD6L.js";
+} from "./chunk-PRN2EQBX.js";
 import {
   useGridContext
 } from "./chunk-5IFPG6TS.js";
 import {
   Tooltip
-} from "./chunk-7GHD74J3.js";
+} from "./chunk-MDB26F6T.js";
 import {
   Theme
 } from "./chunk-EWGHVZL5.js";
 import {
   Select
-} from "./chunk-PIBHG6DH.js";
+} from "./chunk-2TNHD4MQ.js";
 import {
   DataCellHeader,
   DataGridCell,
   DragAlongCell,
   DraggableCellHeader
-} from "./chunk-HIKWIY5Q.js";
+} from "./chunk-F6RZ7MUE.js";
 import {
   Menu
 } from "./chunk-TCMOGTPB.js";
 import {
   MenuOption
-} from "./chunk-5R4C5F63.js";
+} from "./chunk-LKKFQLWD.js";
 import {
   Search
-} from "./chunk-5MLYAQQO.js";
+} from "./chunk-HK4S6TRH.js";
 import {
   Input,
   InputBase
-} from "./chunk-G4AWTFBQ.js";
+} from "./chunk-KPBG7D3V.js";
 import {
   Label
-} from "./chunk-AL5QIRY3.js";
+} from "./chunk-HXGJVYGQ.js";
 import {
   Checkbox
-} from "./chunk-WEAVZEE4.js";
+} from "./chunk-M7WHWZ2J.js";
 import {
   useInfiniteScroll,
   useTableLayout
@@ -63,29 +63,29 @@ import {
 } from "./chunk-5UH6QUFB.js";
 import {
   Subheader
-} from "./chunk-UCJUC5AZ.js";
+} from "./chunk-BYC6QID5.js";
 import {
   Heading3
-} 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 {
   componentGap,
   componentPadding,
   layoutGap,
   layoutPaddding,
   typography
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,
@@ -2077,6 +2077,7 @@ function MobileDataGridHeader({
             items: "center",
             justify: "between",
             backgroundColor: "background-primary-normal",
+            style: { borderTopRightRadius: 4, borderTopLeftRadius: 4 },
             children: [
               enableRowSelection && /* @__PURE__ */ jsx11("div", { className: "p-mobile-component-padding border-r border-brand-200 max-w-fit h-full", children: /* @__PURE__ */ jsx11(
                 Checkbox,

package/dist/{chunk-6TYWM26K.js → chunk-SUSUNSVZ.js}

@@ -1,9 +1,9 @@
 import {
   Label
-} from "./chunk-AL5QIRY3.js";
+} from "./chunk-HXGJVYGQ.js";
 import {
   Stack
-} from "./chunk-DORD2EBO.js";
+} from "./chunk-TPXH53SA.js";
 import {
   Icon
 } from "./chunk-NKUETCDA.js";

package/dist/{chunk-X4UK7HE2.js → chunk-TAPYQBQU.js}

@@ -1,16 +1,16 @@
 import {
   Heading2
-} from "./chunk-H2KC5XUY.js";
+} from "./chunk-MXSJF6TW.js";
+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/ModalHeader.tsx
 import clsx from "clsx";

package/dist/{chunk-OZBB6RFM.js → chunk-TMHOK37S.js}

@@ -3,7 +3,7 @@ import {
 } from "./chunk-URYQ24NF.js";
 import {
   Stack
-} from "./chunk-DORD2EBO.js";
+} from "./chunk-TPXH53SA.js";
 
 // src/components/CompactImagesPreview.tsx
 import { useCallback } from "react";

package/dist/{chunk-DORD2EBO.js → chunk-TPXH53SA.js}

@@ -1,6 +1,6 @@
 import {
   paddingYUsingLayoutGroupGap
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,
@@ -140,7 +140,7 @@ var Stack = (_a) => {
       id,
       "data-testid": testid
     }, props), {
-      style: {
+      style: __spreadValues({
         height: height === "full" ? "100%" : height !== void 0 ? `${height}px` : void 0,
         maxHeight: maxHeight !== void 0 ? isNaN(+maxHeight) ? maxHeight : `${maxHeight}px` : (_a2 = props.style) == null ? void 0 : _a2.maxHeight,
         maxWidth: maxWidth !== void 0 ? isNaN(+maxWidth) ? maxWidth : `${maxWidth}px` : (_b2 = props.style) == null ? void 0 : _b2.maxWidth,
@@ -165,7 +165,7 @@ var Stack = (_a) => {
         flexWrap,
         paddingInline: (_f = props.style) == null ? void 0 : _f.paddingInline,
         gap: (_g = props.style) == null ? void 0 : _g.gap
-      },
+      }, props.style),
       className: clsx(
         "scrollbar-thin",
         "max-w-screen",

package/dist/{chunk-KW6V7O3H.js → chunk-UI7P5J5S.js}

@@ -1,19 +1,29 @@
+import {
+  formatDate
+} from "./chunk-R3EQIDBX.js";
 import {
   Paragraph
-} from "./chunk-ZSETMD4A.js";
+} from "./chunk-WMPWWFUJ.js";
 
 // src/components/MobileDataGrid/MobileDataGridCard/MobileDataGridColumn.tsx
 import { jsxs } from "react/jsx-runtime";
 function MobileDataGridColumn(props) {
-  var _a;
+  var _a, _b;
   const { column, data } = props;
-  return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-2 px-3 flex-1", children: [
+  let value;
+  if (column.id) {
+    value = data[column.id];
+    if (((_a = column.meta) == null ? void 0 : _a.format) === "date" && typeof value === "string") {
+      value = formatDate(value);
+    }
+  }
+  return /* @__PURE__ */ jsxs("div", { className: "grid grid-cols-2 gap-2 flex-1", children: [
     /* @__PURE__ */ jsxs(Paragraph, { color: "text-secondary-normal", className: "text-left", children: [
-      (_a = column.header) == null ? void 0 : _a.toString(),
+      (_b = column.header) == null ? void 0 : _b.toString(),
       ":"
     ] }),
     " ",
-    column.id && data[column.id] ? data[column.id] : null
+    value ? value : null
   ] });
 }
 

package/dist/{chunk-YEZBNQZI.js → chunk-VOSQMHNF.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-SBRRNFOP.js";
 import {
   Stack
-} from "./chunk-DORD2EBO.js";
+} from "./chunk-TPXH53SA.js";
 
 // src/components/PDFViewer/PDFElement.tsx
 import { useEffect, useRef, useState } from "react";

package/dist/{chunk-B53XDCLO.js → chunk-VS53C5ZD.js}

@@ -1,18 +1,18 @@
 import {
   Heading3
-} 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";
 
 // src/components/PDFViewer/PDFNavigation.tsx
 import { jsx, jsxs } from "react/jsx-runtime";

package/dist/{chunk-ZSETMD4A.js → chunk-WMPWWFUJ.js}

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

package/dist/{chunk-FG7GNGE3.js → chunk-WVVEOCEH.js}

@@ -1,6 +1,6 @@
 import {
   layoutPaddding
-} from "./chunk-IXR65MOU.js";
+} from "./chunk-7KWFEH56.js";
 
 // src/components/ModalContent.tsx
 import clsx from "clsx";

package/dist/components/AccessChangerTabItem.cjs

@@ -185,6 +185,9 @@ var layoutPaddingBottom = (0, import_clsx.default)(
 var layoutPaddingY = (0, import_clsx.default)(
   "py-mobile-layout-padding desktop:py-desktop-layout-padding compact:py-desktop-compact-layout-padding"
 );
+var layoutPaddingX = (0, import_clsx.default)(
+  "px-mobile-layout-padding desktop:px-desktop-layout-padding compact:px-desktop-compact-layout-padding"
+);
 var containerPaddingX = (0, import_clsx.default)(
   "px-mobile-container-padding desktop:px-desktop-container-padding compact:px-desktop-compact-container-padding"
 );

package/dist/components/AccessChangerTabItem.js

@@ -1,10 +1,10 @@
 import {
   Subheader
-} from "../chunk-UCJUC5AZ.js";
+} from "../chunk-BYC6QID5.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";
-import "../chunk-IXR65MOU.js";
+import "../chunk-7KWFEH56.js";
 import {
   __objRest,
   __spreadProps,

package/dist/components/Accordion.cjs

@@ -183,6 +183,9 @@ var layoutPaddingBottom = (0, import_clsx.default)(
 var layoutPaddingY = (0, import_clsx.default)(
   "py-mobile-layout-padding desktop:py-desktop-layout-padding compact:py-desktop-compact-layout-padding"
 );
+var layoutPaddingX = (0, import_clsx.default)(
+  "px-mobile-layout-padding desktop:px-desktop-layout-padding compact:px-desktop-compact-layout-padding"
+);
 var containerPaddingX = (0, import_clsx.default)(
   "px-mobile-container-padding desktop:px-desktop-container-padding compact:px-desktop-compact-container-padding"
 );
@@ -426,7 +429,7 @@ var Stack = (_a) => {
       id,
       "data-testid": testid
     }, props), {
-      style: {
+      style: __spreadValues({
         height: height === "full" ? "100%" : height !== void 0 ? `${height}px` : void 0,
         maxHeight: maxHeight !== void 0 ? isNaN(+maxHeight) ? maxHeight : `${maxHeight}px` : (_a2 = props.style) == null ? void 0 : _a2.maxHeight,
         maxWidth: maxWidth !== void 0 ? isNaN(+maxWidth) ? maxWidth : `${maxWidth}px` : (_b2 = props.style) == null ? void 0 : _b2.maxWidth,
@@ -451,7 +454,7 @@ var Stack = (_a) => {
         flexWrap,
         paddingInline: (_f = props.style) == null ? void 0 : _f.paddingInline,
         gap: (_g = props.style) == null ? void 0 : _g.gap
-      },
+      }, props.style),
       className: (0, import_clsx4.default)(
         "scrollbar-thin",
         "max-w-screen",

package/dist/components/Accordion.js

@@ -1,12 +1,12 @@
 "use client";
 import {
   Accordion
-} from "../chunk-IY7SXEVY.js";
+} from "../chunk-MUOYLXBF.js";
 import "../chunk-KBJZUVLM.js";
-import "../chunk-ZSETMD4A.js";
-import "../chunk-DORD2EBO.js";
+import "../chunk-WMPWWFUJ.js";
+import "../chunk-TPXH53SA.js";
 import "../chunk-NKUETCDA.js";
-import "../chunk-IXR65MOU.js";
+import "../chunk-7KWFEH56.js";
 import "../chunk-ORMEWXMH.js";
 export {
   Accordion

package/dist/components/Alert.cjs

@@ -185,6 +185,9 @@ var layoutPaddingBottom = (0, import_clsx.default)(
 var layoutPaddingY = (0, import_clsx.default)(
   "py-mobile-layout-padding desktop:py-desktop-layout-padding compact:py-desktop-compact-layout-padding"
 );
+var layoutPaddingX = (0, import_clsx.default)(
+  "px-mobile-layout-padding desktop:px-desktop-layout-padding compact:px-desktop-compact-layout-padding"
+);
 var containerPaddingX = (0, import_clsx.default)(
   "px-mobile-container-padding desktop:px-desktop-container-padding compact:px-desktop-compact-container-padding"
 );
@@ -616,7 +619,7 @@ var Stack = (_a) => {
       id,
       "data-testid": testid
     }, props), {
-      style: {
+      style: __spreadValues({
         height: height === "full" ? "100%" : height !== void 0 ? `${height}px` : void 0,
         maxHeight: maxHeight !== void 0 ? isNaN(+maxHeight) ? maxHeight : `${maxHeight}px` : (_a2 = props.style) == null ? void 0 : _a2.maxHeight,
         maxWidth: maxWidth !== void 0 ? isNaN(+maxWidth) ? maxWidth : `${maxWidth}px` : (_b2 = props.style) == null ? void 0 : _b2.maxWidth,
@@ -641,7 +644,7 @@ var Stack = (_a) => {
         flexWrap,
         paddingInline: (_f = props.style) == null ? void 0 : _f.paddingInline,
         gap: (_g = props.style) == null ? void 0 : _g.gap
-      },
+      }, props.style),
       className: (0, import_clsx6.default)(
         "scrollbar-thin",
         "max-w-screen",

package/dist/components/Alert.js

@@ -1,12 +1,12 @@
 import {
   Alert
-} from "../chunk-4UH72JT2.js";
-import "../chunk-H2KC5XUY.js";
-import "../chunk-ZSETMD4A.js";
-import "../chunk-DORD2EBO.js";
+} from "../chunk-BWBSDSA7.js";
+import "../chunk-MXSJF6TW.js";
+import "../chunk-45AHDOAU.js";
+import "../chunk-WMPWWFUJ.js";
+import "../chunk-TPXH53SA.js";
 import "../chunk-NKUETCDA.js";
-import "../chunk-LPY6PMAY.js";
-import "../chunk-IXR65MOU.js";
+import "../chunk-7KWFEH56.js";
 import "../chunk-ORMEWXMH.js";
 export {
   Alert

package/dist/components/Breadcrumbs.cjs

@@ -188,6 +188,9 @@ var layoutPaddingBottom = (0, import_clsx.default)(
 var layoutPaddingY = (0, import_clsx.default)(
   "py-mobile-layout-padding desktop:py-desktop-layout-padding compact:py-desktop-compact-layout-padding"
 );
+var layoutPaddingX = (0, import_clsx.default)(
+  "px-mobile-layout-padding desktop:px-desktop-layout-padding compact:px-desktop-compact-layout-padding"
+);
 var containerPaddingX = (0, import_clsx.default)(
   "px-mobile-container-padding desktop:px-desktop-container-padding compact:px-desktop-compact-container-padding"
 );
@@ -346,7 +349,7 @@ var Breadcrumb = ({
     {
       id: id ? `${id}-link` : void 0,
       "data-testid": testid ? `${testid}-link` : void 0,
-      className: linkPadding,
+      className: (0, import_clsx4.default)(linkPadding, "!text-caption-desktop"),
       href,
       typographyStyle: "breadcrumb",
       onClick,

package/dist/components/Breadcrumbs.js

@@ -1,11 +1,11 @@
 "use client";
 import {
   Link
-} from "../chunk-Z6HIIJK3.js";
+} from "../chunk-MO52RSXV.js";
 import {
   Icon
 } from "../chunk-NKUETCDA.js";
-import "../chunk-IXR65MOU.js";
+import "../chunk-7KWFEH56.js";
 import "../chunk-ORMEWXMH.js";
 
 // src/components/Breadcrumbs.tsx
@@ -30,7 +30,7 @@ var Breadcrumb = ({
     {
       id: id ? `${id}-link` : void 0,
       "data-testid": testid ? `${testid}-link` : void 0,
-      className: linkPadding,
+      className: clsx(linkPadding, "!text-caption-desktop"),
       href,
       typographyStyle: "breadcrumb",
       onClick,

package/dist/components/Button.cjs

@@ -182,6 +182,9 @@ var layoutPaddingBottom = (0, import_clsx.default)(
 var layoutPaddingY = (0, import_clsx.default)(
   "py-mobile-layout-padding desktop:py-desktop-layout-padding compact:py-desktop-compact-layout-padding"
 );
+var layoutPaddingX = (0, import_clsx.default)(
+  "px-mobile-layout-padding desktop:px-desktop-layout-padding compact:px-desktop-compact-layout-padding"
+);
 var containerPaddingX = (0, import_clsx.default)(
   "px-mobile-container-padding desktop:px-desktop-container-padding compact:px-desktop-compact-container-padding"
 );

package/dist/components/Button.js

@@ -1,7 +1,7 @@
 import {
   Button
-} from "../chunk-LPY6PMAY.js";
-import "../chunk-IXR65MOU.js";
+} from "../chunk-45AHDOAU.js";
+import "../chunk-7KWFEH56.js";
 import "../chunk-ORMEWXMH.js";
 export {
   Button

package/dist/components/CalendarRange.cjs

@@ -184,6 +184,9 @@ var layoutPaddingBottom = (0, import_clsx.default)(
 var layoutPaddingY = (0, import_clsx.default)(
   "py-mobile-layout-padding desktop:py-desktop-layout-padding compact:py-desktop-compact-layout-padding"
 );
+var layoutPaddingX = (0, import_clsx.default)(
+  "px-mobile-layout-padding desktop:px-desktop-layout-padding compact:px-desktop-compact-layout-padding"
+);
 var containerPaddingX = (0, import_clsx.default)(
   "px-mobile-container-padding desktop:px-desktop-container-padding compact:px-desktop-compact-container-padding"
 );
@@ -850,6 +853,7 @@ var MenuOption = ({
   const actualRef = ref || internalRef;
   const menuId = (0, import_react6.useRef)(`menu-${uniqueId}`);
   const isMobile = useMatchesMobile();
+  const [isSubMenuHovered, setIsSubMenuHovered] = (0, import_react6.useState)(false);
   const handleMouseEnter = () => {
     if (subMenu && onSubMenuHover && !disabled) {
       onSubMenuHover(menuId.current, subMenuLevel);
@@ -859,6 +863,7 @@ var MenuOption = ({
     if (subMenu && onSubMenuLeave && !disabled) {
       onSubMenuLeave(subMenuLevel);
     }
+    setIsSubMenuHovered(false);
   };
   const handleMouseMove = () => {
     if (subMenu && onMouseMove && !disabled) {
@@ -869,9 +874,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 = (0, import_clsx6.default)(
     "[&>svg]:shrink-0 [&>svg]:fill-icon-action-primary-normal"
@@ -880,16 +887,18 @@ var MenuOption = ({
   const normalStyles = variant === "normal" && !disabled && (0, import_clsx6.default)(
     "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 && (0, import_clsx6.default)("text-text-primary-disabled");
   const actionStyles = variant === "action" && !disabled && (0, import_clsx6.default)(
     "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 && (0, import_clsx6.default)("text-text-action-disabled");
@@ -941,7 +950,10 @@ var MenuOption = ({
       "div",
       {
         onMouseEnter: handleSubMenuEnter,
-        onMouseLeave: handleMouseLeave,
+        onMouseLeave: () => {
+          handleMouseLeave();
+          setIsSubMenuHovered(false);
+        },
         "data-submenu-parent": menuId.current,
         "data-menu-level": subMenuLevel + 1,
         children: subMenu({
@@ -951,7 +963,8 @@ var MenuOption = ({
           position: "right",
           subMenuLevel,
           mobileBackMenuOption,
-          mobileHide: isMobile && activeMenu !== menuId.current
+          mobileHide: isMobile && activeMenu !== menuId.current,
+          autoFocusOff: true
         })
       }
     )

package/dist/components/CalendarRange.css

@@ -2102,6 +2102,9 @@
   .font-sans {
     font-family: var(--font-sans);
   }
+  .\!text-caption-desktop {
+    font-size: var(--text-caption-desktop) !important;
+  }
   .text-\[0\.6rem\] {
     font-size: 0.6rem;
   }
@@ -3293,11 +3296,6 @@
       color: var(--color-text-action-critical-hover);
     }
   }
-  .focus\:text-text-action-hover {
-    &:focus {
-      color: var(--color-text-action-hover);
-    }
-  }
   .focus\:text-text-action-primary-hover {
     &:focus {
       color: var(--color-text-action-primary-hover);
@@ -3341,6 +3339,16 @@
       outline-style: none;
     }
   }
+  .focus-visible\:bg-background-action-secondary-hover {
+    &:focus-visible {
+      background-color: var(--color-background-action-secondary-hover);
+    }
+  }
+  .focus-visible\:text-text-action-hover {
+    &:focus-visible {
+      color: var(--color-text-action-hover);
+    }
+  }
   .focus-visible\:ring-2 {
     &:focus-visible {
       --tw-ring-shadow: var(--tw-ring-inset,) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color, currentcolor);
@@ -3793,6 +3801,21 @@
       }
     }
   }
+  .data-submenu-hovered\:bg-background-action-secondary-active {
+    &[data-submenu-hovered] {
+      background-color: var(--color-background-action-secondary-active);
+    }
+  }
+  .data-submenu-hovered\:bg-background-action-secondary-hover {
+    &[data-submenu-hovered] {
+      background-color: var(--color-background-action-secondary-hover);
+    }
+  }
+  .data-submenu-hovered\:text-text-action-active {
+    &[data-submenu-hovered] {
+      color: var(--color-text-action-active);
+    }
+  }
   .data-\[focus\]\:outline-1 {
     &[data-focus] {
       outline-style: var(--tw-outline-style);