@bwp-web/components 1.3.1 → 1.4.0

package/dist/index.cjs

@@ -492,34 +492,134 @@ function BiampWrapper({ children, sx, ...props }) {
 // src/BiampSidebar/BiampSidebar.tsx
 var import_material2 = require("@mui/material");
 var import_assets = require("@bwp-web/assets");
+var import_react = require("react");
 var import_jsx_runtime2 = require("react/jsx-runtime");
+var BiampSidebarContext = (0, import_react.createContext)({
+  expanded: false
+});
 function BiampSidebar({
   children,
   bottomLogoIcon,
+  bottomLogoText,
+  expandable = true,
+  expanded: expandedProp,
+  defaultExpanded = false,
+  onExpandedChange,
   sx,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(import_material2.Stack, { width: "48px", height: "100%", sx: { ...sx }, ...props, children: [
-    /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material2.Stack, { height: "100%", children }),
-    bottomLogoIcon ?? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_assets.BiampLogoIcon, { sx: { width: "48px", height: "15px" } })
-  ] });
+  const [internalExpanded, setInternalExpanded] = (0, import_react.useState)(defaultExpanded);
+  const isControlled = expandedProp !== void 0;
+  const expanded = isControlled ? expandedProp : internalExpanded;
+  const toggleExpanded = () => {
+    const next = !expanded;
+    if (!isControlled) setInternalExpanded(next);
+    onExpandedChange?.(next);
+  };
+  const width = expanded ? "240px" : "48px";
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(BiampSidebarContext.Provider, { value: { expanded }, children: /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+    import_material2.Stack,
+    {
+      sx: {
+        width,
+        minWidth: width,
+        height: "100%",
+        overflowX: "hidden",
+        transition: ({ transitions }) => transitions.create(["width", "min-width"], {
+          easing: transitions.easing.sharp,
+          duration: expanded ? transitions.duration.enteringScreen : transitions.duration.leavingScreen
+        }),
+        ...sx
+      },
+      ...props,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material2.Stack, { sx: { flex: 1, minHeight: 0 }, children }),
+        expandable && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          BiampSidebarIcon,
+          {
+            icon: /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+              import_assets.SquareRoundedArrowRightIcon,
+              {
+                sx: {
+                  transform: expanded ? "rotate(180deg)" : "none",
+                  transition: ({ transitions }) => transitions.create("transform", {
+                    duration: transitions.duration.shorter
+                  })
+                }
+              }
+            ),
+            name: "Collapse menu",
+            onClick: toggleExpanded
+          }
+        ),
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
+          import_material2.Stack,
+          {
+            direction: "row",
+            alignItems: "center",
+            justifyContent: "space-between",
+            sx: { mt: 2, overflow: "hidden" },
+            children: [
+              bottomLogoIcon ?? /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                import_assets.BiampLogoIcon,
+                {
+                  sx: { width: "48px", height: "15px", flexShrink: 0 }
+                }
+              ),
+              bottomLogoText && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+                import_material2.Typography,
+                {
+                  variant: "caption",
+                  fontWeight: 500,
+                  color: "sidebar.main",
+                  noWrap: true,
+                  sx: {
+                    opacity: expanded ? 1 : 0,
+                    transition: ({ transitions }) => transitions.create("opacity", {
+                      duration: expanded ? transitions.duration.enteringScreen : transitions.duration.leavingScreen
+                    })
+                  },
+                  children: `\xA9 ${(/* @__PURE__ */ new Date()).getFullYear()} ${bottomLogoText}`
+                }
+              )
+            ]
+          }
+        )
+      ]
+    }
+  ) });
 }
 function BiampSidebarIconList({
   children,
   sx,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(import_material2.Stack, { height: "100%", sx: { gap: "4px", ...sx }, ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+    import_material2.Stack,
+    {
+      sx: {
+        flex: 1,
+        minHeight: 0,
+        gap: "4px",
+        overflowY: "auto",
+        ...sx
+      },
+      ...props,
+      children
+    }
+  );
 }
 function BiampSidebarIcon({
   selected,
   icon,
   selectedIcon,
+  name,
   sx,
   ...props
 }) {
+  const { expanded } = (0, import_react.useContext)(BiampSidebarContext);
   const displayedSelectedIcon = selectedIcon ?? icon;
-  return /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime2.jsxs)(
     import_material2.ListItemButton,
     {
       selected,
@@ -527,16 +627,50 @@ function BiampSidebarIcon({
       disableRipple: true,
       sx: {
         minWidth: "48px",
-        maxWidth: "48px",
         minHeight: "48px",
         maxHeight: "48px",
         borderRadius: "8px",
-        justifyContent: "center",
+        justifyContent: "flex-start",
         alignItems: "center",
+        padding: 0,
+        overflow: "hidden",
+        color: "text.secondary",
         ...sx
       },
       ...props,
-      children: selected ? displayedSelectedIcon : icon
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_material2.Box,
+          {
+            sx: {
+              width: "48px",
+              height: "48px",
+              display: "flex",
+              alignItems: "center",
+              justifyContent: "center",
+              flexShrink: 0
+            },
+            children: selected ? displayedSelectedIcon : icon
+          }
+        ),
+        name && /* @__PURE__ */ (0, import_jsx_runtime2.jsx)(
+          import_material2.Typography,
+          {
+            variant: "body1",
+            fontWeight: 600,
+            color: "inherit",
+            noWrap: true,
+            sx: {
+              pr: 2,
+              opacity: expanded ? 1 : 0,
+              transition: ({ transitions }) => transitions.create("opacity", {
+                duration: expanded ? transitions.duration.enteringScreen : transitions.duration.leavingScreen
+              })
+            },
+            children: name
+          }
+        )
+      ]
     }
   );
 }
@@ -568,6 +702,7 @@ function BiampSidebarComponent({
 
 // src/BiampHeader/BiampHeader.tsx
 var import_material3 = require("@mui/material");
+var import_react2 = require("react");
 var import_assets2 = require("@bwp-web/assets");
 var import_jsx_runtime3 = require("react/jsx-runtime");
 function BiampHeader({ children, sx, ...props }) {
@@ -810,12 +945,17 @@ function BiampEndUserAppContent({
   sx,
   ...props
 }) {
+  const isGrid = import_react2.Children.count(children) > 1;
   return /* @__PURE__ */ (0, import_jsx_runtime3.jsx)(
     import_material3.Stack,
     {
       direction: "column",
       sx: {
         gap: 1.5,
+        ...isGrid && {
+          display: "grid",
+          gridTemplateColumns: "1fr 1fr"
+        },
         ...sx
       },
       ...props,
@@ -950,17 +1090,17 @@ function BiampLayout({
 }
 
 // src/BiampTable/BiampTable.tsx
-var import_material7 = require("@mui/material");
-var import_assets5 = require("@bwp-web/assets");
-var import_react_table = require("@tanstack/react-table");
-var import_react4 = __toESM(require("react"), 1);
+var import_material9 = require("@mui/material");
+var import_assets6 = require("@bwp-web/assets");
+var import_react_table2 = require("@tanstack/react-table");
+var import_react7 = require("react");
 
 // src/BiampTable/BiampTableEmptyState.tsx
 var import_assets3 = require("@bwp-web/assets");
 
 // src/BiampTable/BiampTableStatusMessage.tsx
 var import_material5 = require("@mui/material");
-var import_react = require("react");
+var import_react3 = require("react");
 var import_jsx_runtime5 = require("react/jsx-runtime");
 function BiampTableStatusMessage({
   icon,
@@ -970,7 +1110,7 @@ function BiampTableStatusMessage({
   ...stackProps
 }) {
   return /* @__PURE__ */ (0, import_jsx_runtime5.jsxs)(import_material5.Stack, { alignItems: "center", gap: 1.5, ...stackProps, children: [
-    (0, import_react.cloneElement)(icon, {
+    (0, import_react3.cloneElement)(icon, {
       "aria-hidden": true,
       sx: { width: 56, height: 56, ...icon.props.sx }
     }),
@@ -1009,22 +1149,28 @@ function BiampTableErrorState({
   return /* @__PURE__ */ (0, import_jsx_runtime7.jsx)(BiampTableStatusMessage, { role: "alert", icon, title, ...rest });
 }
 
+// src/BiampTable/BiampTableRow.tsx
+var import_material8 = require("@mui/material");
+var import_assets5 = require("@bwp-web/assets");
+var import_react_table = require("@tanstack/react-table");
+var import_react5 = __toESM(require("react"), 1);
+
 // src/BiampTable/BiampTableTruncatedCell.tsx
 var import_material6 = require("@mui/material");
-var import_react2 = require("react");
+var import_react4 = require("react");
 var import_jsx_runtime8 = require("react/jsx-runtime");
 function BiampTableTruncatedCell({
   children
 }) {
-  const textRef = (0, import_react2.useRef)(null);
-  const [open, setOpen] = (0, import_react2.useState)(false);
-  const handleMouseEnter = (0, import_react2.useCallback)(() => {
+  const textRef = (0, import_react4.useRef)(null);
+  const [open, setOpen] = (0, import_react4.useState)(false);
+  const handleMouseEnter = (0, import_react4.useCallback)(() => {
     const el = textRef.current;
     if (el && el.scrollWidth > el.clientWidth) {
       setOpen(true);
     }
   }, []);
-  const handleMouseLeave = (0, import_react2.useCallback)(() => {
+  const handleMouseLeave = (0, import_react4.useCallback)(() => {
     setOpen(false);
   }, []);
   return /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
@@ -1055,37 +1201,6 @@ function BiampTableTruncatedCell({
   );
 }
 
-// src/BiampTable/useLoadingDelay.ts
-var import_react3 = require("react");
-function useLoadingDelay(loading, { delay = 150, minDuration = 500 } = {}) {
-  const [status, setStatus] = (0, import_react3.useState)("idle");
-  const timeoutRef = (0, import_react3.useRef)(null);
-  function clearPending() {
-    if (timeoutRef.current !== null) {
-      clearTimeout(timeoutRef.current);
-      timeoutRef.current = null;
-    }
-  }
-  (0, import_react3.useEffect)(() => {
-    if (loading && status === "idle") {
-      clearPending();
-      timeoutRef.current = setTimeout(() => {
-        timeoutRef.current = setTimeout(() => {
-          setStatus("ending");
-        }, minDuration);
-        setStatus("loading");
-      }, delay);
-      setStatus("delaying");
-    }
-    if (!loading && status !== "loading") {
-      clearPending();
-      setStatus("idle");
-    }
-  }, [loading, delay, minDuration, status]);
-  (0, import_react3.useEffect)(() => clearPending, []);
-  return status === "loading" || status === "ending";
-}
-
 // src/BiampTable/slotProps.ts
 function resolveSlot(slot, ctx) {
   if (!slot) return void 0;
@@ -1095,19 +1210,7 @@ function mergeSx(...inputs) {
   return inputs.filter((v) => Boolean(v)).flatMap((v) => Array.isArray(v) ? v : [v]);
 }
 
-// src/BiampTable/BiampTable.tsx
-var import_jsx_runtime9 = require("react/jsx-runtime");
-var overlaySx = {
-  position: "absolute",
-  top: 0,
-  left: 0,
-  right: 0,
-  bottom: 0,
-  display: "flex",
-  alignItems: "center",
-  justifyContent: "center",
-  pointerEvents: "none"
-};
+// src/BiampTable/cellSx.ts
 var stickyHoverBg = {
   ".MuiTableRow-hover:hover > &, .Mui-selected > &": {
     bgcolor: ({ palette }) => palette.mode === "dark" ? palette.grey[800] : palette.grey[100]
@@ -1133,6 +1236,126 @@ function cellSx(sticky, minWidth, zIndex) {
     "&:has([data-truncate])": { maxWidth: mw, whiteSpace: "normal" }
   };
 }
+
+// src/BiampTable/BiampTableExpandGuidelines.tsx
+var import_material7 = require("@mui/material");
+var import_jsx_runtime9 = require("react/jsx-runtime");
+var guidelineIndent = 28;
+var guidelineCellPaddingLeft = 12;
+var guidelineLineOffsetFromParentText = 4;
+var guidelineElbowGapToChildText = 12;
+var guidelineFirstChildTopExtension = 12;
+var guidelineColor = ({ palette }) => palette.dividers.secondary;
+var guidelineStroke = "0.6px";
+function isLastChildOfParent(row) {
+  const parent = row.getParentRow();
+  if (!parent) return false;
+  const siblings = parent.subRows;
+  return siblings[siblings.length - 1]?.id === row.id;
+}
+function isFirstChildOfParent(row) {
+  const parent = row.getParentRow();
+  if (!parent) return false;
+  return parent.subRows[0]?.id === row.id;
+}
+function getAncestorAtDepth(row, targetDepth) {
+  let current = row;
+  while (current && current.depth > targetDepth) {
+    current = current.getParentRow();
+  }
+  return current && current.depth === targetDepth ? current : void 0;
+}
+function ExpandGuidelines({ row }) {
+  const verticalX = (k) => guidelineCellPaddingLeft + (k - 1) * guidelineIndent + guidelineLineOffsetFromParentText;
+  const elbowEnd = guidelineCellPaddingLeft + row.depth * guidelineIndent - guidelineElbowGapToChildText;
+  const lines = [];
+  for (let k = 1; k < row.depth; k++) {
+    const ancestor = getAncestorAtDepth(row, k);
+    if (!ancestor || isLastChildOfParent(ancestor)) continue;
+    lines.push(
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+        import_material7.Box,
+        {
+          "aria-hidden": true,
+          sx: {
+            position: "absolute",
+            left: `${verticalX(k)}px`,
+            top: 0,
+            bottom: 0,
+            width: guidelineStroke,
+            bgcolor: guidelineColor,
+            pointerEvents: "none"
+          }
+        },
+        `v-${k}`
+      )
+    );
+  }
+  const elbowX = verticalX(row.depth);
+  const rowIsLast = isLastChildOfParent(row);
+  const rowIsFirst = isFirstChildOfParent(row);
+  const elbowTopOffset = rowIsFirst ? -guidelineFirstChildTopExtension : 0;
+  lines.push(
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      import_material7.Box,
+      {
+        "aria-hidden": true,
+        sx: {
+          position: "absolute",
+          left: `${elbowX}px`,
+          top: `${elbowTopOffset}px`,
+          height: `calc(50% - ${elbowTopOffset}px)`,
+          width: guidelineStroke,
+          bgcolor: guidelineColor,
+          pointerEvents: "none"
+        }
+      },
+      "v-elbow-top"
+    )
+  );
+  if (!rowIsLast) {
+    lines.push(
+      /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+        import_material7.Box,
+        {
+          "aria-hidden": true,
+          sx: {
+            position: "absolute",
+            left: `${elbowX}px`,
+            top: "50%",
+            bottom: 0,
+            width: guidelineStroke,
+            bgcolor: guidelineColor,
+            pointerEvents: "none"
+          }
+        },
+        "v-elbow-bottom"
+      )
+    );
+  }
+  lines.push(
+    /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+      import_material7.Box,
+      {
+        "aria-hidden": true,
+        sx: {
+          position: "absolute",
+          left: `${elbowX}px`,
+          top: "50%",
+          width: `${elbowEnd - elbowX}px`,
+          height: guidelineStroke,
+          bgcolor: guidelineColor,
+          pointerEvents: "none"
+        }
+      },
+      "h-elbow"
+    )
+  );
+  return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_jsx_runtime9.Fragment, { children: lines });
+}
+
+// src/BiampTable/BiampTableRow.tsx
+var import_jsx_runtime10 = require("react/jsx-runtime");
 var rowCursorPointerSx = { cursor: "pointer" };
 var selectionCellSx = {
   position: "sticky",
@@ -1148,13 +1371,80 @@ var expandCellBaseSx = {
   gap: "2px"
 };
 var expandPlaceholderSx = { width: 28 };
-var headerSelectionCellSx = {
-  position: "sticky",
-  left: 0,
-  zIndex: 3,
-  bgcolor: "background.paper"
-};
-var checkboxHiddenHeaderSx = { visibility: "hidden" };
+function ExpandToggle({
+  row,
+  isExpanded,
+  hasExpandableRows,
+  rowLabel
+}) {
+  if (row.getCanExpand()) {
+    return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+      import_material8.IconButton,
+      {
+        variant: "none",
+        onClick: (e) => {
+          e.stopPropagation();
+          row.toggleExpanded();
+        },
+        "aria-label": isExpanded ? `Collapse ${rowLabel}` : `Expand ${rowLabel}`,
+        "aria-expanded": isExpanded,
+        children: isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          import_assets5.ChevronDownIcon,
+          {
+            variant: "xs",
+            sx: { color: ({ palette }) => palette.text.secondary }
+          }
+        ) : /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          import_assets5.ChevronRightIcon,
+          {
+            variant: "xs",
+            sx: { color: ({ palette }) => palette.text.secondary }
+          }
+        )
+      }
+    );
+  }
+  if (hasExpandableRows) return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_material8.Box, { sx: expandPlaceholderSx });
+  return null;
+}
+function renderCellContent({
+  cell,
+  row,
+  isExpandCell,
+  alwaysExpanded,
+  isExpanded,
+  hasExpandableRows,
+  getRowLabel
+}) {
+  const sticky = cell.column.columnDef.meta?.sticky;
+  const content = (0, import_react_table.flexRender)(cell.column.columnDef.cell, cell.getContext());
+  if (sticky) return content;
+  const truncate = cell.column.columnDef.meta?.truncate ?? true;
+  const truncated = truncate ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(BiampTableTruncatedCell, { children: content }) : content;
+  if (!isExpandCell) return truncated;
+  if (alwaysExpanded) {
+    return row.depth > 0 ? /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(import_material8.Box, { sx: { pl: `${row.depth * 28}px` }, children: truncated }) : truncated;
+  }
+  const rowLabel = getRowLabel ? getRowLabel(row.original) : `row ${row.index + 1}`;
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+    import_material8.Box,
+    {
+      sx: row.depth > 0 ? { ...expandCellBaseSx, pl: `${row.depth * 12}px` } : expandCellBaseSx,
+      children: [
+        /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          ExpandToggle,
+          {
+            row,
+            isExpanded,
+            hasExpandableRows,
+            rowLabel
+          }
+        ),
+        truncated
+      ]
+    }
+  );
+}
 function BiampTableRowInner({
   row,
   isExpanded,
@@ -1163,7 +1453,9 @@ function BiampTableRowInner({
   isRowClickable,
   enableRowSelection,
   enableExpanding,
+  alwaysExpanded,
   selectChildrenWithParent,
+  showExpandGuidelines,
   getRowLabel,
   hasExpandableRows,
   customColor,
@@ -1178,8 +1470,8 @@ function BiampTableRowInner({
     onKeyDown: userRowOnKeyDown,
     ...restRowProps
   } = resolvedRow ?? {};
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-    import_material7.TableRow,
+  return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+    import_material8.TableRow,
     {
       ...restRowProps,
       hover: clickable,
@@ -1203,16 +1495,16 @@ function BiampTableRowInner({
         userRowOnKeyDown?.(e);
       } : userRowOnKeyDown,
       children: [
-        enableRowSelection && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-          import_material7.TableCell,
+        enableRowSelection && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+          import_material8.TableCell,
           {
             padding: "checkbox",
             sx: mergeSx(
               selectionCellSx,
               customColor ? { backgroundColor: customColor } : void 0
             ),
-            children: /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-              import_material7.Checkbox,
+            children: /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
+              import_material8.Checkbox,
               {
                 checked: isSelected,
                 disabled: !row.getCanSelect(),
@@ -1233,68 +1525,33 @@ function BiampTableRowInner({
         row.getVisibleCells().map((cell, cellIndex, cells) => {
           const sticky = cell.column.columnDef.meta?.sticky;
           const isExpandCell = enableExpanding && !sticky && cellIndex === cells.findIndex((c) => !c.column.columnDef.meta?.sticky);
-          const content = (0, import_react_table.flexRender)(
-            cell.column.columnDef.cell,
-            cell.getContext()
-          );
+          const showGuidelinesOnCell = isExpandCell && showExpandGuidelines && alwaysExpanded && row.depth > 0;
           const resolvedCell = resolveSlot(cellSlotProps, { cell });
           const { sx: userCellSx, ...restCellProps } = resolvedCell ?? {};
-          return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-            import_material7.TableCell,
+          return /* @__PURE__ */ (0, import_jsx_runtime10.jsxs)(
+            import_material8.TableCell,
             {
               ...restCellProps,
               "data-sticky": sticky || void 0,
               sx: mergeSx(
                 cellSx(sticky, cell.column.columnDef.meta?.minWidth, 2),
-                { pl: isExpandCell ? "6px" : "12px" },
+                { pl: isExpandCell && !alwaysExpanded ? "6px" : "12px" },
+                showGuidelinesOnCell ? { position: "relative" } : void 0,
                 sticky && customColor ? { backgroundColor: customColor } : void 0,
                 userCellSx
               ),
-              children: (() => {
-                if (sticky) return content;
-                const truncate = cell.column.columnDef.meta?.truncate ?? true;
-                const truncated = truncate ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(BiampTableTruncatedCell, { children: content }) : content;
-                if (!isExpandCell) return truncated;
-                const rowLabel = getRowLabel ? getRowLabel(row.original) : `row ${row.index + 1}`;
-                return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-                  import_material7.Box,
-                  {
-                    sx: row.depth > 0 ? { ...expandCellBaseSx, pl: `${row.depth * 12}px` } : expandCellBaseSx,
-                    children: [
-                      row.getCanExpand() ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                        import_material7.IconButton,
-                        {
-                          variant: "none",
-                          onClick: (e) => {
-                            e.stopPropagation();
-                            row.toggleExpanded();
-                          },
-                          "aria-label": isExpanded ? `Collapse ${rowLabel}` : `Expand ${rowLabel}`,
-                          "aria-expanded": isExpanded,
-                          children: isExpanded ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                            import_assets5.ChevronDownIcon,
-                            {
-                              variant: "xs",
-                              sx: {
-                                color: ({ palette }) => palette.text.secondary
-                              }
-                            }
-                          ) : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                            import_assets5.ChevronRightIcon,
-                            {
-                              variant: "xs",
-                              sx: {
-                                color: ({ palette }) => palette.text.secondary
-                              }
-                            }
-                          )
-                        }
-                      ) : hasExpandableRows ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_material7.Box, { sx: expandPlaceholderSx }) : null,
-                      truncated
-                    ]
-                  }
-                );
-              })()
+              children: [
+                showGuidelinesOnCell && /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(ExpandGuidelines, { row }),
+                renderCellContent({
+                  cell,
+                  row,
+                  isExpandCell,
+                  alwaysExpanded,
+                  isExpanded,
+                  hasExpandableRows,
+                  getRowLabel
+                })
+              ]
             },
             cell.id
           );
@@ -1305,12 +1562,64 @@ function BiampTableRowInner({
   );
 }
 function biampTableRowPropsAreEqual(prev, next) {
-  return prev.row.id === next.row.id && prev.row.original === next.row.original && prev.isSelected === next.isSelected && prev.isExpanded === next.isExpanded && prev.row.getVisibleCells().length === next.row.getVisibleCells().length && prev.enableRowSelection === next.enableRowSelection && prev.enableExpanding === next.enableExpanding && prev.hasExpandableRows === next.hasExpandableRows && prev.selectChildrenWithParent === next.selectChildrenWithParent && prev.onRowClick === next.onRowClick && prev.isRowClickable === next.isRowClickable && prev.getRowLabel === next.getRowLabel && prev.customColor === next.customColor && prev.rowSlotProps === next.rowSlotProps && prev.cellSlotProps === next.cellSlotProps;
+  return prev.row.id === next.row.id && prev.row.original === next.row.original && prev.isSelected === next.isSelected && prev.isExpanded === next.isExpanded && prev.row.getVisibleCells().length === next.row.getVisibleCells().length && prev.enableRowSelection === next.enableRowSelection && prev.enableExpanding === next.enableExpanding && prev.alwaysExpanded === next.alwaysExpanded && prev.hasExpandableRows === next.hasExpandableRows && prev.selectChildrenWithParent === next.selectChildrenWithParent && prev.showExpandGuidelines === next.showExpandGuidelines && prev.onRowClick === next.onRowClick && prev.isRowClickable === next.isRowClickable && prev.getRowLabel === next.getRowLabel && prev.customColor === next.customColor && prev.rowSlotProps === next.rowSlotProps && prev.cellSlotProps === next.cellSlotProps;
 }
-var BiampTableRow = import_react4.default.memo(
+var BiampTableRow = import_react5.default.memo(
   BiampTableRowInner,
   biampTableRowPropsAreEqual
 );
+
+// src/BiampTable/useLoadingDelay.ts
+var import_react6 = require("react");
+function useLoadingDelay(loading, { delay = 150, minDuration = 500 } = {}) {
+  const [status, setStatus] = (0, import_react6.useState)("idle");
+  const timeoutRef = (0, import_react6.useRef)(null);
+  function clearPending() {
+    if (timeoutRef.current !== null) {
+      clearTimeout(timeoutRef.current);
+      timeoutRef.current = null;
+    }
+  }
+  (0, import_react6.useEffect)(() => {
+    if (loading && status === "idle") {
+      clearPending();
+      timeoutRef.current = setTimeout(() => {
+        timeoutRef.current = setTimeout(() => {
+          setStatus("ending");
+        }, minDuration);
+        setStatus("loading");
+      }, delay);
+      setStatus("delaying");
+    }
+    if (!loading && status !== "loading") {
+      clearPending();
+      setStatus("idle");
+    }
+  }, [loading, delay, minDuration, status]);
+  (0, import_react6.useEffect)(() => clearPending, []);
+  return status === "loading" || status === "ending";
+}
+
+// src/BiampTable/BiampTable.tsx
+var import_jsx_runtime11 = require("react/jsx-runtime");
+var overlaySx = {
+  position: "absolute",
+  top: 0,
+  left: 0,
+  right: 0,
+  bottom: 0,
+  display: "flex",
+  alignItems: "center",
+  justifyContent: "center",
+  pointerEvents: "none"
+};
+var headerSelectionCellSx = {
+  position: "sticky",
+  left: 0,
+  zIndex: 3,
+  bgcolor: "background.paper"
+};
+var checkboxHiddenHeaderSx = { visibility: "hidden" };
 function BiampTable({
   table,
   onRowClick,
@@ -1320,8 +1629,10 @@ function BiampTable({
   empty,
   enableRowSelection = false,
   enableExpanding = false,
+  alwaysExpanded = false,
   hideSelectAll,
   selectChildrenWithParent = false,
+  showExpandGuidelines = false,
   getRowLabel,
   setRowColor,
   slotProps,
@@ -1339,16 +1650,21 @@ function BiampTable({
     },
     enableRowSelection ? 48 : 0
   );
-  const containerRef = (0, import_react4.useRef)(null);
+  const containerRef = (0, import_react7.useRef)(null);
+  (0, import_react7.useEffect)(() => {
+    if (enableExpanding && alwaysExpanded) {
+      table.toggleAllRowsExpanded(true);
+    }
+  }, [enableExpanding, alwaysExpanded, table]);
   const showLoading = useLoadingDelay(!!loading);
   const rows = table.getRowModel().rows;
   const hasExpandableRows = enableExpanding && rows.some((r) => r.getCanExpand());
   const showError = !!error && !loading;
   const showEmpty = !showError && !loading && rows.length === 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-    import_material7.TableContainer,
+  return /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+    import_material9.TableContainer,
     {
-      component: import_material7.Box,
+      component: import_material9.Box,
       ...boxProps,
       ref: containerRef,
       sx: {
@@ -1359,8 +1675,8 @@ function BiampTable({
         ...sx
       },
       children: [
-        /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-          import_material7.Table,
+        /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+          import_material9.Table,
           {
             "aria-busy": showLoading || void 0,
             ...restTableSlotProps,
@@ -1369,14 +1685,14 @@ function BiampTable({
               userTableSx
             ),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_material7.TableHead, { ...restHeadSlotProps, sx: mergeSx(userHeadSx), children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime9.jsxs)(
-                import_material7.TableRow,
+              /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_material9.TableHead, { ...restHeadSlotProps, sx: mergeSx(userHeadSx), children: table.getHeaderGroups().map((headerGroup) => /* @__PURE__ */ (0, import_jsx_runtime11.jsxs)(
+                import_material9.TableRow,
                 {
                   ...restHeaderRowSlotProps,
                   sx: mergeSx(userHeaderRowSx),
                   children: [
-                    enableRowSelection && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_material7.TableCell, { padding: "checkbox", sx: headerSelectionCellSx, children: !hideSelectAll && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                      import_material7.Checkbox,
+                    enableRowSelection && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_material9.TableCell, { padding: "checkbox", sx: headerSelectionCellSx, children: !hideSelectAll && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+                      import_material9.Checkbox,
                       {
                         checked: table.getIsAllPageRowsSelected(),
                         indeterminate: table.getIsSomePageRowsSelected(),
@@ -1391,8 +1707,8 @@ function BiampTable({
                         header
                       });
                       const { sx: userHeaderCellSx, ...restHeaderCellProps } = resolvedHeaderCell ?? {};
-                      return /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                        import_material7.TableCell,
+                      return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+                        import_material9.TableCell,
                         {
                           ...restHeaderCellProps,
                           "data-sticky": sticky || void 0,
@@ -1404,21 +1720,21 @@ function BiampTable({
                             cellSx(sticky, header.column.columnDef.meta?.minWidth, 3),
                             userHeaderCellSx
                           ),
-                          children: header.isPlaceholder ? null : header.column.getCanSort() ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                            import_material7.TableSortLabel,
+                          children: header.isPlaceholder ? null : header.column.getCanSort() ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+                            import_material9.TableSortLabel,
                             {
                               active: !!header.column.getIsSorted(),
                               direction: header.column.getIsSorted() || "asc",
                               onClick: header.column.getToggleSortingHandler(),
                               ...header.column.getIsSorted() && {
-                                IconComponent: header.column.getIsSorted() === "asc" ? import_assets5.DropdownChevronUpIcon : import_assets5.DropdownChevronDownIcon
+                                IconComponent: header.column.getIsSorted() === "asc" ? import_assets6.DropdownChevronUpIcon : import_assets6.DropdownChevronDownIcon
                               },
-                              children: (0, import_react_table.flexRender)(
+                              children: (0, import_react_table2.flexRender)(
                                 header.column.columnDef.header,
                                 header.getContext()
                               )
                             }
-                          ) : (0, import_react_table.flexRender)(
+                          ) : (0, import_react_table2.flexRender)(
                             header.column.columnDef.header,
                             header.getContext()
                           )
@@ -1430,12 +1746,12 @@ function BiampTable({
                 },
                 headerGroup.id
               )) }),
-              /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
-                import_material7.TableBody,
+              /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
+                import_material9.TableBody,
                 {
                   ...restBodySlotProps,
                   sx: mergeSx({ opacity: showLoading ? 0.3 : 1 }, userBodySx),
-                  children: !showError && rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+                  children: !showError && rows.map((row) => /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
                     BiampTableRow,
                     {
                       row,
@@ -1445,7 +1761,9 @@ function BiampTable({
                       isRowClickable,
                       enableRowSelection,
                       enableExpanding,
+                      alwaysExpanded,
                       selectChildrenWithParent,
+                      showExpandGuidelines,
                       getRowLabel,
                       hasExpandableRows,
                       customColor: setRowColor?.(row.original),
@@ -1459,22 +1777,22 @@ function BiampTable({
             ]
           }
         ),
-        showError && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_material7.Box, { sx: overlaySx, children: error === true ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(BiampTableErrorState, { sx: { pointerEvents: "auto" } }) : error instanceof Error ? /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(
+        showError && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_material9.Box, { sx: overlaySx, children: error === true ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(BiampTableErrorState, { sx: { pointerEvents: "auto" } }) : error instanceof Error ? /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
           BiampTableErrorState,
           {
             description: error.message,
             sx: { pointerEvents: "auto" }
           }
         ) : error }),
-        showEmpty && /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(import_material7.Box, { sx: overlaySx, children: empty && empty !== true ? empty : /* @__PURE__ */ (0, import_jsx_runtime9.jsx)(BiampTableEmptyState, { sx: { pointerEvents: "auto" } }) })
+        showEmpty && /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_material9.Box, { sx: overlaySx, children: empty && empty !== true ? empty : /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(BiampTableEmptyState, { sx: { pointerEvents: "auto" } }) })
       ]
     }
   );
 }
 
 // src/BiampTable/BiampTableContainer.tsx
-var import_material8 = require("@mui/material");
-var import_jsx_runtime10 = require("react/jsx-runtime");
+var import_material10 = require("@mui/material");
+var import_jsx_runtime12 = require("react/jsx-runtime");
 function BiampTableContainer({
   withBorderTop = true,
   withBorderBottom = false,
@@ -1482,8 +1800,8 @@ function BiampTableContainer({
   sx,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime10.jsx)(
-    import_material8.Stack,
+  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
+    import_material10.Stack,
     {
       direction: "column",
       height: "100%",
@@ -1501,25 +1819,25 @@ function BiampTableContainer({
 }
 
 // src/BiampTable/BiampTableCellActionButton.tsx
-var import_material9 = require("@mui/material");
-var import_jsx_runtime11 = require("react/jsx-runtime");
+var import_material11 = require("@mui/material");
+var import_jsx_runtime13 = require("react/jsx-runtime");
 function BiampTableCellActionButton({ label, icon, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(
-    import_material9.Tooltip,
+  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
+    import_material11.Tooltip,
     {
       title: label,
       placement: "top",
       enterDelay: 500,
       enterNextDelay: 500,
       disableInteractive: true,
-      children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime11.jsx)(import_material9.IconButton, { "aria-label": label, ...props, children: icon }) })
+      children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)("span", { children: /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(import_material11.IconButton, { "aria-label": label, ...props, children: icon }) })
     }
   );
 }
 
 // src/BiampTable/BiampTableColumnVisibility.tsx
-var import_material10 = require("@mui/material");
-var import_jsx_runtime12 = require("react/jsx-runtime");
+var import_material12 = require("@mui/material");
+var import_jsx_runtime14 = require("react/jsx-runtime");
 function toVisibilityState(visibility) {
   return visibility;
 }
@@ -1562,8 +1880,8 @@ function BiampTableColumnVisibility({
   ...popoverProps
 }) {
   const allVisible = table.getAllLeafColumns().every((col) => col.getIsVisible());
-  return /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-    import_material10.Popover,
+  return /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    import_material12.Popover,
     {
       anchorEl,
       open: Boolean(anchorEl),
@@ -1576,48 +1894,48 @@ function BiampTableColumnVisibility({
             borderRadius: "6px",
             backgroundImage: "none",
             border: `0.6px solid ${palette.dividers.secondary}`,
-            boxShadow: `0px 1px 1px 0px ${(0, import_material10.alpha)(palette.common.black, 0.05)}`,
+            boxShadow: `0px 1px 1px 0px ${(0, import_material12.alpha)(palette.common.black, 0.05)}`,
             minWidth: "150px"
           }),
           ...slotProps?.paper ?? {}
         }
       },
       ...popoverProps,
-      children: /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(import_material10.List, { dense: true, disablePadding: true, children: [
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-          import_material10.ListItem,
+      children: /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_material12.List, { dense: true, disablePadding: true, children: [
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+          import_material12.ListItem,
           {
             dense: true,
             sx: columnListItemSx,
             onClick: () => table.toggleAllColumnsVisible(!allVisible),
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-                import_material10.Checkbox,
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                import_material12.Checkbox,
                 {
                   checked: allVisible,
                   slotProps: { input: { "aria-label": `${showAllLabel} columns` } }
                 }
               ),
-              /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_material10.Typography, { variant: "caption", fontWeight: 600, children: showAllLabel })
+              /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_material12.Typography, { variant: "caption", fontWeight: 600, children: showAllLabel })
             ]
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_material10.Divider, {}),
-        /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-          import_material10.Box,
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_material12.Divider, {}),
+        /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+          import_material12.Box,
           {
             sx: { maxHeight: 340, overflow: "auto", overscrollBehavior: "none" },
             children: table.getAllLeafColumns().map((column) => {
               const columnName = column.columnDef.meta?.columnLabel ?? (typeof column.columnDef.header === "string" ? column.columnDef.header : column.id);
-              return /* @__PURE__ */ (0, import_jsx_runtime12.jsxs)(
-                import_material10.ListItem,
+              return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(
+                import_material12.ListItem,
                 {
                   dense: true,
                   sx: columnListItemSx,
                   onClick: column.getToggleVisibilityHandler(),
                   children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(
-                      import_material10.Checkbox,
+                    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+                      import_material12.Checkbox,
                       {
                         checked: column.getIsVisible(),
                         sx: { py: 1 },
@@ -1626,7 +1944,7 @@ function BiampTableColumnVisibility({
                         }
                       }
                     ),
-                    /* @__PURE__ */ (0, import_jsx_runtime12.jsx)(import_material10.Typography, { variant: "caption", children: columnName })
+                    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_material12.Typography, { variant: "caption", children: columnName })
                   ]
                 },
                 column.id
@@ -1640,12 +1958,12 @@ function BiampTableColumnVisibility({
 }
 
 // src/BiampTable/BiampTableToolbarColumnVisibility.tsx
-var import_assets6 = require("@bwp-web/assets");
-var import_react5 = require("react");
+var import_assets7 = require("@bwp-web/assets");
+var import_react8 = require("react");
 
 // src/BiampTable/BiampTableToolbarActionButton.tsx
-var import_material11 = require("@mui/material");
-var import_jsx_runtime13 = require("react/jsx-runtime");
+var import_material13 = require("@mui/material");
+var import_jsx_runtime15 = require("react/jsx-runtime");
 function BiampTableToolbarActionButton({
   label,
   icon,
@@ -1653,13 +1971,13 @@ function BiampTableToolbarActionButton({
   ...props
 }) {
   const showBadge = badgeContent != null && badgeContent !== 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-    import_material11.IconButton,
+  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+    import_material13.IconButton,
     {
       "aria-label": showBadge ? `${label} (${badgeContent})` : label,
       ...props,
-      children: showBadge ? /* @__PURE__ */ (0, import_jsx_runtime13.jsx)(
-        import_material11.Badge,
+      children: showBadge ? /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
+        import_material13.Badge,
         {
           badgeContent,
           color: "info",
@@ -1682,20 +2000,20 @@ function BiampTableToolbarActionButton({
 }
 
 // src/BiampTable/BiampTableToolbarColumnVisibility.tsx
-var import_jsx_runtime14 = require("react/jsx-runtime");
+var import_jsx_runtime16 = require("react/jsx-runtime");
 function BiampTableToolbarColumnVisibility({
   table,
-  icon = /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(import_assets6.ColumnsIcon, { variant: "xs" }),
+  icon = /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(import_assets7.ColumnsIcon, { variant: "xs" }),
   label = "Columns",
   defaultColumnVisibility,
   showAllLabel,
   ...actionButtonProps
 }) {
-  const [anchorEl, setAnchorEl] = (0, import_react5.useState)(null);
+  const [anchorEl, setAnchorEl] = (0, import_react8.useState)(null);
   const defaults = defaultColumnVisibility ?? getDefaultColumnVisibility(table);
   const dirtyCount = getColumnVisibilityDirtyCount(table, defaults);
-  return /* @__PURE__ */ (0, import_jsx_runtime14.jsxs)(import_jsx_runtime14.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime16.jsxs)(import_jsx_runtime16.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       BiampTableToolbarActionButton,
       {
         label,
@@ -1705,7 +2023,7 @@ function BiampTableToolbarColumnVisibility({
         ...actionButtonProps
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime14.jsx)(
+    /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
       BiampTableColumnVisibility,
       {
         table,
@@ -1718,9 +2036,9 @@ function BiampTableToolbarColumnVisibility({
 }
 
 // src/BiampTable/BiampTablePagination.tsx
-var import_react6 = require("react");
-var import_material12 = require("@mui/material");
-var import_jsx_runtime15 = require("react/jsx-runtime");
+var import_react9 = require("react");
+var import_material14 = require("@mui/material");
+var import_jsx_runtime17 = require("react/jsx-runtime");
 var positionMap = {
   left: "flex-start",
   center: "center",
@@ -1736,21 +2054,21 @@ function BiampTablePagination({
   ...paginationProps
 }) {
   const rowCount = table.getRowCount();
-  const lastRowCountRef = (0, import_react6.useRef)(rowCount);
+  const lastRowCountRef = (0, import_react9.useRef)(rowCount);
   if (!loading && rowCount >= 0) {
     lastRowCountRef.current = rowCount;
   }
   const stableCount = loading ? lastRowCountRef.current : rowCount;
   const { pageSize, pageIndex } = table.getState().pagination;
   const maxPage = Math.max(0, Math.ceil(stableCount / pageSize) - 1);
-  (0, import_react6.useEffect)(() => {
+  (0, import_react9.useEffect)(() => {
     if (!loading && pageIndex > maxPage) {
       table.setPageIndex(maxPage);
     }
   }, [loading, pageIndex, maxPage, table]);
   if (autoHide && (!stableCount || stableCount <= pageSize)) return null;
-  return /* @__PURE__ */ (0, import_jsx_runtime15.jsx)(
-    import_material12.TablePagination,
+  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
+    import_material14.TablePagination,
     {
       component: "div",
       count: stableCount,
@@ -1781,15 +2099,15 @@ function BiampTablePagination({
 }
 
 // src/BiampTable/BiampTableToolbar.tsx
-var import_material13 = require("@mui/material");
-var import_jsx_runtime16 = require("react/jsx-runtime");
+var import_material15 = require("@mui/material");
+var import_jsx_runtime18 = require("react/jsx-runtime");
 function BiampTableToolbar({
   children,
   sx,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime16.jsx)(
-    import_material13.Box,
+  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+    import_material15.Box,
     {
       role: "toolbar",
       display: "flex",
@@ -1807,14 +2125,14 @@ function BiampTableToolbar({
 }
 
 // src/BiampTable/BiampTableToolbarActions.tsx
-var import_material14 = require("@mui/material");
-var import_jsx_runtime17 = require("react/jsx-runtime");
+var import_material16 = require("@mui/material");
+var import_jsx_runtime19 = require("react/jsx-runtime");
 function BiampTableToolbarActions({
   children,
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime17.jsx)(
-    import_material14.Box,
+  return /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+    import_material16.Box,
     {
       display: "flex",
       alignItems: "center",
@@ -1828,21 +2146,21 @@ function BiampTableToolbarActions({
 }
 
 // src/BiampTable/BiampTableToolbarExport.tsx
-var import_material15 = require("@mui/material");
-var import_assets7 = require("@bwp-web/assets");
-var import_jsx_runtime18 = require("react/jsx-runtime");
+var import_material17 = require("@mui/material");
+var import_assets8 = require("@bwp-web/assets");
+var import_jsx_runtime20 = require("react/jsx-runtime");
 function BiampTableToolbarExport({
   onExport,
   loading,
-  icon = /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_assets7.DownloadIcon, { variant: "xs" }),
+  icon = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_assets8.DownloadIcon, { variant: "xs" }),
   label = "Export",
   ...props
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
     BiampTableToolbarActionButton,
     {
       label: loading ? `${label}, loading` : label,
-      icon: loading ? /* @__PURE__ */ (0, import_jsx_runtime18.jsx)(import_material15.CircularProgress, { size: 20, color: "inherit" }) : icon,
+      icon: loading ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_material17.CircularProgress, { size: 20, color: "inherit" }) : icon,
       disabled: loading,
       onClick: onExport,
       ...props
@@ -1851,16 +2169,16 @@ function BiampTableToolbarExport({
 }
 
 // src/BiampTable/BiampTableToolbarFilters.tsx
-var import_material16 = require("@mui/material");
-var import_assets8 = require("@bwp-web/assets");
-var import_react7 = require("react");
-var import_jsx_runtime19 = require("react/jsx-runtime");
+var import_material18 = require("@mui/material");
+var import_assets9 = require("@bwp-web/assets");
+var import_react10 = require("react");
+var import_jsx_runtime21 = require("react/jsx-runtime");
 function BiampTableToolbarFilters({
   activeFilterCount,
   children,
   onReset,
   onApply,
-  icon = /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_assets8.FilterIcon, { variant: "xs" }),
+  icon = /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_assets9.FilterIcon, { variant: "xs" }),
   title = "Filters",
   resetLabel = "Clear filters",
   applyLabel = "Apply",
@@ -1868,14 +2186,14 @@ function BiampTableToolbarFilters({
   buttonLabel = "Filters",
   DrawerProps: drawerProps
 }) {
-  const [open, setOpen] = (0, import_react7.useState)(false);
-  const titleId = (0, import_react7.useId)();
+  const [open, setOpen] = (0, import_react10.useState)(false);
+  const titleId = (0, import_react10.useId)();
   function handleClose() {
     onApply?.();
     setOpen(false);
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_jsx_runtime19.Fragment, { children: [
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_jsx_runtime21.Fragment, { children: [
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
       BiampTableToolbarActionButton,
       {
         label: buttonLabel,
@@ -1884,8 +2202,8 @@ function BiampTableToolbarFilters({
         onClick: () => setOpen(true)
       }
     ),
-    /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-      import_material16.Drawer,
+    /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+      import_material18.Drawer,
       {
         anchor: "right",
         open,
@@ -1896,17 +2214,17 @@ function BiampTableToolbarFilters({
           sx: { width: { xs: "100%", sm: 480 } },
           ...drawerProps?.PaperProps
         },
-        children: /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
-          import_material16.Box,
+        children: /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+          import_material18.Box,
           {
             height: "100%",
             display: "flex",
             flexDirection: "column",
             justifyContent: "space-between",
             children: [
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_material16.Box, { children: [
-                /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(
-                  import_material16.Box,
+              /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_material18.Box, { children: [
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(
+                  import_material18.Box,
                   {
                     display: "flex",
                     justifyContent: "space-between",
@@ -1914,10 +2232,10 @@ function BiampTableToolbarFilters({
                     px: 3.5,
                     py: 2.5,
                     children: [
-                      /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_material16.Typography, { id: titleId, variant: "h2", children: [
+                      /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_material18.Typography, { id: titleId, variant: "h2", children: [
                         title,
-                        /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-                          import_material16.Badge,
+                        /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                          import_material18.Badge,
                           {
                             badgeContent: activeFilterCount,
                             color: "secondary",
@@ -1925,21 +2243,21 @@ function BiampTableToolbarFilters({
                           }
                         )
                       ] }),
-                      /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-                        import_material16.IconButton,
+                      /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                        import_material18.IconButton,
                         {
                           size: "medium",
                           onClick: handleClose,
                           "aria-label": closeLabel,
-                          children: /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_assets8.CloseIcon, {})
+                          children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_assets9.CloseIcon, {})
                         }
                       )
                     ]
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(import_material16.Divider, {}),
-                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-                  import_material16.Box,
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_material18.Divider, {}),
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                  import_material18.Box,
                   {
                     role: "group",
                     "aria-label": "Filter options",
@@ -1952,9 +2270,9 @@ function BiampTableToolbarFilters({
                   }
                 )
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime19.jsxs)(import_material16.Box, { display: "flex", children: [
-                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-                  import_material16.Button,
+              /* @__PURE__ */ (0, import_jsx_runtime21.jsxs)(import_material18.Box, { display: "flex", children: [
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                  import_material18.Button,
                   {
                     variant: "overlay",
                     color: "secondary",
@@ -1964,8 +2282,8 @@ function BiampTableToolbarFilters({
                     children: resetLabel
                   }
                 ),
-                /* @__PURE__ */ (0, import_jsx_runtime19.jsx)(
-                  import_material16.Button,
+                /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
+                  import_material18.Button,
                   {
                     variant: "overlay",
                     color: "primary",
@@ -1984,23 +2302,23 @@ function BiampTableToolbarFilters({
 }
 
 // src/BiampTable/BiampTableToolbarSearch.tsx
-var import_material17 = require("@mui/material");
-var import_assets9 = require("@bwp-web/assets");
-var import_react9 = require("react");
+var import_material19 = require("@mui/material");
+var import_assets10 = require("@bwp-web/assets");
+var import_react12 = require("react");
 
 // src/BiampTable/useDebouncedCallback.ts
-var import_react8 = require("react");
+var import_react11 = require("react");
 var BIAMP_TABLE_DEBOUNCE_DELAY = 300;
 function useDebouncedCallback(callback, delay = BIAMP_TABLE_DEBOUNCE_DELAY) {
-  const timeoutRef = (0, import_react8.useRef)(null);
-  const callbackRef = (0, import_react8.useRef)(callback);
+  const timeoutRef = (0, import_react11.useRef)(null);
+  const callbackRef = (0, import_react11.useRef)(callback);
   callbackRef.current = callback;
-  (0, import_react8.useEffect)(() => {
+  (0, import_react11.useEffect)(() => {
     return () => {
       if (timeoutRef.current !== null) clearTimeout(timeoutRef.current);
     };
   }, []);
-  return (0, import_react8.useCallback)(
+  return (0, import_react11.useCallback)(
     (...args) => {
       if (timeoutRef.current !== null) clearTimeout(timeoutRef.current);
       timeoutRef.current = setTimeout(
@@ -2013,7 +2331,7 @@ function useDebouncedCallback(callback, delay = BIAMP_TABLE_DEBOUNCE_DELAY) {
 }
 
 // src/BiampTable/BiampTableToolbarSearch.tsx
-var import_jsx_runtime20 = require("react/jsx-runtime");
+var import_jsx_runtime22 = require("react/jsx-runtime");
 var searchFieldSx = {
   "& .MuiInputBase-root": {
     height: "36px !important",
@@ -2037,11 +2355,11 @@ function BiampTableToolbarSearch({
   sx,
   ...textFieldProps
 }) {
-  const isMobile = (0, import_material17.useMediaQuery)((t) => t.breakpoints.down("md"));
-  const [inputValue, setInputValue] = (0, import_react9.useState)(defaultValue);
-  const [isExpanded, setIsExpanded] = (0, import_react9.useState)(false);
+  const isMobile = (0, import_material19.useMediaQuery)((t) => t.breakpoints.down("md"));
+  const [inputValue, setInputValue] = (0, import_react12.useState)(defaultValue);
+  const [isExpanded, setIsExpanded] = (0, import_react12.useState)(false);
   const debouncedOnChange = useDebouncedCallback(onChange, debounceDelay);
-  (0, import_react9.useEffect)(() => {
+  (0, import_react12.useEffect)(() => {
     setInputValue(defaultValue);
   }, [defaultValue]);
   const handleChange = (e) => {
@@ -2057,18 +2375,18 @@ function BiampTableToolbarSearch({
       setIsExpanded(false);
     }
   };
-  const clearButton = inputValue ? /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_material17.InputAdornment, { position: "end", children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-    import_material17.IconButton,
+  const clearButton = inputValue ? /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_material19.InputAdornment, { position: "end", children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    import_material19.IconButton,
     {
       size: "small",
       onClick: handleClear,
       "aria-label": clearLabel,
       sx: { mr: 0.5 },
-      children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_assets9.CloseIcon, { variant: "xs", sx: { width: 20, height: 20 } })
+      children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_assets10.CloseIcon, { variant: "xs", sx: { width: 20, height: 20 } })
     }
   ) }) : null;
-  const textField = /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-    import_material17.TextField,
+  const textField = /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+    import_material19.TextField,
     {
       name: "search",
       type: "text",
@@ -2076,8 +2394,8 @@ function BiampTableToolbarSearch({
       slotProps: {
         htmlInput: { maxLength, "aria-label": placeholder },
         input: {
-          startAdornment: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_material17.InputAdornment, { position: "start", sx: { ml: 1 }, children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-            import_assets9.SearchIcon,
+          startAdornment: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_material19.InputAdornment, { position: "start", sx: { ml: 1 }, children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            import_assets10.SearchIcon,
             {
               variant: "xs",
               color: "inherit",
@@ -2102,10 +2420,10 @@ function BiampTableToolbarSearch({
     }
   );
   if (isMobile && enableMobileView) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_material17.Box, { display: "flex", alignItems: "center", width: "100%", pr: 1, gap: 1, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(import_assets9.SearchIcon, { sx: { width: 16, height: 16 } }),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-        import_material17.InputBase,
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_material19.Box, { display: "flex", alignItems: "center", width: "100%", pr: 1, gap: 1, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(import_assets10.SearchIcon, { sx: { width: 16, height: 16 } }),
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        import_material19.InputBase,
         {
           name: "search",
           type: "text",
@@ -2126,15 +2444,15 @@ function BiampTableToolbarSearch({
     ] });
   }
   if (expandable) {
-    return /* @__PURE__ */ (0, import_jsx_runtime20.jsxs)(import_material17.Box, { display: "flex", alignItems: "center", minWidth: 28, children: [
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-        import_material17.IconButton,
+    return /* @__PURE__ */ (0, import_jsx_runtime22.jsxs)(import_material19.Box, { display: "flex", alignItems: "center", minWidth: 28, children: [
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        import_material19.IconButton,
         {
           "aria-label": expandLabel ?? placeholder,
           onClick: () => setIsExpanded(true),
           sx: { display: isExpanded || inputValue ? "none" : "flex" },
-          children: /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-            import_assets9.SearchIcon,
+          children: /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+            import_assets10.SearchIcon,
             {
               variant: "xs",
               color: "inherit",
@@ -2143,8 +2461,8 @@ function BiampTableToolbarSearch({
           )
         }
       ),
-      /* @__PURE__ */ (0, import_jsx_runtime20.jsx)(
-        import_material17.Collapse,
+      /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
+        import_material19.Collapse,
         {
           in: isExpanded || !!inputValue,
           orientation: "horizontal",
@@ -2158,8 +2476,8 @@ function BiampTableToolbarSearch({
 }
 
 // src/BiampTable/useBiampServerSideTable.ts
-var import_react_table2 = require("@tanstack/react-table");
-var import_react10 = require("react");
+var import_react_table3 = require("@tanstack/react-table");
+var import_react13 = require("react");
 
 // src/BiampTable/serverSideTableUtils.ts
 function orderToSorting(order, fieldToColumnId) {
@@ -2215,8 +2533,8 @@ function getDirtyColumnVisibility(visibility, defaults) {
 }
 
 // src/BiampTable/useBiampServerSideTable.ts
-var coreRowModel = (0, import_react_table2.getCoreRowModel)();
-var expandedRowModel = (0, import_react_table2.getExpandedRowModel)();
+var coreRowModel = (0, import_react_table3.getCoreRowModel)();
+var expandedRowModel = (0, import_react_table3.getExpandedRowModel)();
 var defaultGetRowId = (row) => row.id;
 function useBiampServerSideTable({
   data,
@@ -2237,35 +2555,35 @@ function useBiampServerSideTable({
   onExpandedChange,
   getSubRows
 }) {
-  const { defaultColumnVisibility, columnIdToField, fieldToColumnId } = (0, import_react10.useMemo)(
+  const { defaultColumnVisibility, columnIdToField, fieldToColumnId } = (0, import_react13.useMemo)(
     () => ({
       defaultColumnVisibility: getDefaultColumnVisibilityFromDefs(columns),
       ...getOrderFieldMappings(columns)
     }),
     [columns]
   );
-  const sorting = (0, import_react10.useMemo)(
+  const sorting = (0, import_react13.useMemo)(
     () => orderToSorting(order, fieldToColumnId),
     [order, fieldToColumnId]
   );
   const hasPagination = page != null && rowsPerPage != null;
-  const pagination = (0, import_react10.useMemo)(
+  const pagination = (0, import_react13.useMemo)(
     () => hasPagination ? { pageIndex: page, pageSize: rowsPerPage } : void 0,
     [hasPagination, page, rowsPerPage]
   );
   const hasSelection = selectedRowIds != null;
-  const rowSelection = (0, import_react10.useMemo)(
+  const rowSelection = (0, import_react13.useMemo)(
     () => hasSelection ? selectedIdsToRowSelection(selectedRowIds) : void 0,
     [hasSelection, selectedRowIds]
   );
-  const mergedVisibility = (0, import_react10.useMemo)(
+  const mergedVisibility = (0, import_react13.useMemo)(
     () => toVisibilityState({
       ...defaultColumnVisibility,
       ...columnVisibility
     }),
     [defaultColumnVisibility, columnVisibility]
   );
-  return (0, import_react_table2.useReactTable)({
+  return (0, import_react_table3.useReactTable)({
     data,
     columns,
     getCoreRowModel: coreRowModel,
@@ -2364,12 +2682,12 @@ function downloadCsv(csvContent, filename) {
 }
 
 // src/BiampBanner/BiampBanner.tsx
-var import_material18 = require("@mui/material");
-var import_assets10 = require("@bwp-web/assets");
-var import_jsx_runtime21 = require("react/jsx-runtime");
+var import_material20 = require("@mui/material");
+var import_assets11 = require("@bwp-web/assets");
+var import_jsx_runtime23 = require("react/jsx-runtime");
 function BiampBanner({ show, children, severity }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_material18.Collapse, { in: show, unmountOnExit: true, component: "aside", children: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(
-    import_material18.Box,
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_material20.Collapse, { in: show, unmountOnExit: true, component: "aside", children: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
+    import_material20.Box,
     {
       bgcolor: ({ palette }) => palette.background[severity],
       display: "flex",
@@ -2387,25 +2705,25 @@ function BiampBanner({ show, children, severity }) {
   ) });
 }
 var iconMapping = {
-  error: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_assets10.ErrorStatusIcon, { color: "error", sx: { width: 14, height: 14 } }),
-  warning: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_assets10.WarningStatusIcon, { color: "warning", sx: { width: 16, height: 14 } }),
-  success: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_assets10.SuccessStatusIcon, { color: "success", sx: { width: 14, height: 14 } }),
-  info: /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_assets10.InfoStatusIcon, { color: "info", sx: { width: 14, height: 14 } })
+  error: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_assets11.ErrorStatusIcon, { color: "error", sx: { width: 14, height: 14 } }),
+  warning: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_assets11.WarningStatusIcon, { color: "warning", sx: { width: 16, height: 14 } }),
+  success: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_assets11.SuccessStatusIcon, { color: "success", sx: { width: 14, height: 14 } }),
+  info: /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_assets11.InfoStatusIcon, { color: "info", sx: { width: 14, height: 14 } })
 };
 function BiampBannerIcon({ severity, children }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_jsx_runtime21.Fragment, { children: severity ? iconMapping[severity] : children });
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_jsx_runtime23.Fragment, { children: severity ? iconMapping[severity] : children });
 }
 function BiampBannerContent({ children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_material18.Typography, { textAlign: "center", variant: "h3", ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_material20.Typography, { textAlign: "center", variant: "h3", ...props, children });
 }
 function BiampBannerActions({ children, ...props }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime21.jsx)(import_material18.Box, { display: "flex", gap: 1, alignItems: "center", ...props, children });
+  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(import_material20.Box, { display: "flex", gap: 1, alignItems: "center", ...props, children });
 }
 
 // src/BiampSegmentedButton/SegmentedButton.tsx
-var import_material19 = require("@mui/material");
+var import_material21 = require("@mui/material");
 var import_styles = require("@mui/material/styles");
-var import_jsx_runtime22 = require("react/jsx-runtime");
+var import_jsx_runtime24 = require("react/jsx-runtime");
 function SegmentedButton({
   children,
   active,
@@ -2413,13 +2731,13 @@ function SegmentedButton({
   sx,
   ...props
 }) {
-  const theme = (0, import_material19.useTheme)();
+  const theme = (0, import_material21.useTheme)();
   const isDarkMode = theme.palette.mode === "dark";
   const backgroundColor = active ? isDarkMode ? theme.palette.grey[900] : theme.palette.common.white : "transparent";
   const textColor = active ? theme.palette.text.primary : theme.palette.text.secondary;
   const border = active ? "solid" : void 0;
-  return /* @__PURE__ */ (0, import_jsx_runtime22.jsx)(
-    import_material19.Button,
+  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+    import_material21.Button,
     {
       sx: {
         backgroundColor,
@@ -2442,13 +2760,13 @@ function SegmentedButton({
 }
 
 // src/BiampSegmentedButton/SegmentedButtonGroup.tsx
-var import_material20 = require("@mui/material");
-var import_jsx_runtime23 = require("react/jsx-runtime");
+var import_material22 = require("@mui/material");
+var import_jsx_runtime25 = require("react/jsx-runtime");
 function SegmentedButtonGroup({ children, sx, ...props }) {
-  const theme = (0, import_material20.useTheme)();
+  const theme = (0, import_material22.useTheme)();
   const isDarkMode = theme.palette.mode === "dark";
-  return /* @__PURE__ */ (0, import_jsx_runtime23.jsx)(
-    import_material20.Stack,
+  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
+    import_material22.Stack,
     {
       direction: "row",
       p: 0.5,
@@ -2465,11 +2783,11 @@ function SegmentedButtonGroup({ children, sx, ...props }) {
 }
 
 // src/BiampGlobalSearch/BiampGlobalSearch.tsx
-var import_react11 = require("react");
-var import_material21 = require("@mui/material");
-var import_assets11 = require("@bwp-web/assets");
-var import_jsx_runtime24 = require("react/jsx-runtime");
-var SearchContext = (0, import_react11.createContext)({
+var import_react14 = require("react");
+var import_material23 = require("@mui/material");
+var import_assets12 = require("@bwp-web/assets");
+var import_jsx_runtime26 = require("react/jsx-runtime");
+var SearchContext = (0, import_react14.createContext)({
   hasOptions: true,
   loading: false,
   noResultsText: "No results found",
@@ -2479,8 +2797,8 @@ function KeyCap({
   children,
   variant = "icon"
 }) {
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-    import_material21.Box,
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+    import_material23.Box,
     {
       component: "kbd",
       sx: {
@@ -2504,12 +2822,12 @@ function KeyCap({
     }
   );
 }
-var BiampGlobalSearchPaper = (0, import_react11.forwardRef)(
+var BiampGlobalSearchPaper = (0, import_react14.forwardRef)(
   function BiampGlobalSearchPaper2({ children, ...props }, ref) {
-    const { hasOptions, loading, noResultsText } = (0, import_react11.useContext)(SearchContext);
-    return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_material21.Paper, { ref, ...props, children: [
-      hasOptions || loading ? children : /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-        import_material21.Typography,
+    const { hasOptions, loading, noResultsText } = (0, import_react14.useContext)(SearchContext);
+    return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_material23.Paper, { ref, ...props, children: [
+      hasOptions || loading ? children : /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+        import_material23.Typography,
         {
           variant: "body2",
           color: "text.secondary",
@@ -2517,8 +2835,8 @@ var BiampGlobalSearchPaper = (0, import_react11.forwardRef)(
           children: noResultsText
         }
       ),
-      hasOptions && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
-        import_material21.Box,
+      hasOptions && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+        import_material23.Box,
         {
           sx: {
             borderTop: ({ palette }) => `0.6px solid ${palette.dividers.secondary}`,
@@ -2528,13 +2846,13 @@ var BiampGlobalSearchPaper = (0, import_react11.forwardRef)(
             p: 1.5
           },
           children: [
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_material21.Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_material21.Box, { sx: { display: "flex", alignItems: "center", gap: 0.5 }, children: [
-                /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(KeyCap, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_assets11.KeyArrowDownIcon, {}) }),
-                /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(KeyCap, { children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_assets11.KeyArrowUpIcon, {}) })
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_material23.Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_material23.Box, { sx: { display: "flex", alignItems: "center", gap: 0.5 }, children: [
+                /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(KeyCap, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_assets12.KeyArrowDownIcon, {}) }),
+                /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(KeyCap, { children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_assets12.KeyArrowUpIcon, {}) })
               ] }),
-              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-                import_material21.Typography,
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+                import_material23.Typography,
                 {
                   variant: "caption",
                   fontWeight: (theme) => theme.typography.fontWeightMedium,
@@ -2543,10 +2861,10 @@ var BiampGlobalSearchPaper = (0, import_react11.forwardRef)(
                 }
               )
             ] }),
-            /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_material21.Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
-              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(KeyCap, { variant: "text", children: "Enter" }),
-              /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-                import_material21.Typography,
+            /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_material23.Box, { sx: { display: "flex", alignItems: "center", gap: 1 }, children: [
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(KeyCap, { variant: "text", children: "Enter" }),
+              /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+                import_material23.Typography,
                 {
                   variant: "caption",
                   fontWeight: (theme) => theme.typography.fontWeightMedium,
@@ -2562,16 +2880,16 @@ var BiampGlobalSearchPaper = (0, import_react11.forwardRef)(
   }
 );
 function HighlightText({ text, query }) {
-  if (!query) return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_jsx_runtime24.Fragment, { children: text });
+  if (!query) return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_jsx_runtime26.Fragment, { children: text });
   const index = text.toLowerCase().indexOf(query.toLowerCase());
-  if (index === -1) return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_jsx_runtime24.Fragment, { children: text });
+  if (index === -1) return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_jsx_runtime26.Fragment, { children: text });
   const before = text.slice(0, index);
   const match = text.slice(index, index + query.length);
   const after = text.slice(index + query.length);
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
     before,
-    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-      import_material21.Box,
+    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+      import_material23.Box,
       {
         component: "span",
         sx: {
@@ -2591,12 +2909,12 @@ function BiampGlobalSearchListItem({
   option,
   props: liProps
 }) {
-  const { query } = (0, import_react11.useContext)(SearchContext);
+  const { query } = (0, import_react14.useContext)(SearchContext);
   const { key, ...rest } = liProps;
   const maxChips = 3;
   const chips = option.associatedItems?.slice(0, maxChips) ?? [];
   const overflow = (option.associatedItems?.length ?? 0) - maxChips;
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
     "li",
     {
       ...rest,
@@ -2608,8 +2926,8 @@ function BiampGlobalSearchListItem({
         ...rest.style
       },
       children: [
-        option.icon && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-          import_material21.Box,
+        option.icon && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          import_material23.Box,
           {
             sx: {
               width: 24,
@@ -2622,9 +2940,9 @@ function BiampGlobalSearchListItem({
             children: option.icon
           }
         ),
-        /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_material21.Typography, { variant: "body2", noWrap: true, sx: { flexShrink: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(HighlightText, { text: option.title, query }) }),
-        option.subtitle && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-          import_material21.Typography,
+        /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_material23.Typography, { variant: "body2", noWrap: true, sx: { flexShrink: 0 }, children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(HighlightText, { text: option.title, query }) }),
+        option.subtitle && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          import_material23.Typography,
           {
             className: "hoverContent",
             variant: "body2",
@@ -2634,8 +2952,8 @@ function BiampGlobalSearchListItem({
             children: option.subtitle
           }
         ),
-        chips.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(
-          import_material21.Box,
+        chips.length > 0 && /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(
+          import_material23.Box,
           {
             className: "hoverContent",
             sx: {
@@ -2647,8 +2965,8 @@ function BiampGlobalSearchListItem({
               px: 2
             },
             children: [
-              chips.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-                import_material21.Chip,
+              chips.map((item, i) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+                import_material23.Chip,
                 {
                   size: "small",
                   label: item.label,
@@ -2665,8 +2983,8 @@ function BiampGlobalSearchListItem({
                 },
                 i
               )),
-              overflow > 0 && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-                import_material21.Chip,
+              overflow > 0 && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+                import_material23.Chip,
                 {
                   size: "small",
                   label: `+${overflow}`,
@@ -2685,8 +3003,8 @@ function BiampGlobalSearchListItem({
             ]
           }
         ),
-        option.endIcon && /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-          import_material21.Box,
+        option.endIcon && /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+          import_material23.Box,
           {
             className: "endIcon",
             sx: {
@@ -2733,7 +3051,7 @@ function BiampGlobalSearch({
     }
     onInputChange?.(event, value, reason);
   };
-  return /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
     SearchContext.Provider,
     {
       value: {
@@ -2742,15 +3060,15 @@ function BiampGlobalSearch({
         noResultsText,
         query: inputValueProp ?? ""
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-        import_material21.Autocomplete,
+      children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+        import_material23.Autocomplete,
         {
           options,
           inputValue: inputValueProp,
           loading,
           onChange: handleChange,
           onInputChange: handleInputChange,
-          loadingText: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_material21.Typography, { variant: "body2", color: "text.secondary", children: "Loading\u2026" }),
+          loadingText: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_material23.Typography, { variant: "body2", color: "text.secondary", children: "Loading\u2026" }),
           freeSolo: true,
           filterOptions: (x) => x,
           getOptionLabel: (option) => typeof option === "string" ? option : option.title,
@@ -2774,8 +3092,8 @@ function BiampGlobalSearch({
               }
             }
           },
-          renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
-            import_material21.TextField,
+          renderInput: (params) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
+            import_material23.TextField,
             {
               ...params,
               placeholder,
@@ -2790,15 +3108,15 @@ function BiampGlobalSearch({
               slotProps: {
                 input: {
                   ...params.InputProps,
-                  startAdornment: /* @__PURE__ */ (0, import_jsx_runtime24.jsxs)(import_jsx_runtime24.Fragment, { children: [
-                    /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_material21.InputAdornment, { position: "start", children: /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(import_assets11.SearchIcon, {}) }),
+                  startAdornment: /* @__PURE__ */ (0, import_jsx_runtime26.jsxs)(import_jsx_runtime26.Fragment, { children: [
+                    /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_material23.InputAdornment, { position: "start", children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(import_assets12.SearchIcon, {}) }),
                     params.InputProps.startAdornment
                   ] })
                 }
               }
             }
           ),
-          renderOption: (optionProps, option) => /* @__PURE__ */ (0, import_jsx_runtime24.jsx)(
+          renderOption: (optionProps, option) => /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
             BiampGlobalSearchListItem,
             {
               option,
@@ -2814,10 +3132,10 @@ function BiampGlobalSearch({
 }
 
 // src/UserInitialsIcon/UserInitialsIcon.tsx
-var import_material22 = require("@mui/material");
+var import_material24 = require("@mui/material");
 var import_styles2 = require("@mui/material/styles");
 var import_randomcolor = __toESM(require_randomColor(), 1);
-var import_jsx_runtime25 = require("react/jsx-runtime");
+var import_jsx_runtime27 = require("react/jsx-runtime");
 var DEFAULT_SIZE = 40;
 var DEFAULT_BORDER_RADIUS = 1.5;
 var TEXT_RATIO = 0.4;
@@ -2835,8 +3153,8 @@ function UserInitialsIcon({
   const textColor = (0, import_styles2.darken)((0, import_randomcolor.default)({ luminosity: "dark", seed: id }), 0.3);
   const size = typeof width === "number" ? width : DEFAULT_SIZE;
   const fontSize = size * TEXT_RATIO;
-  return /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
-    import_material22.Box,
+  return /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+    import_material24.Box,
     {
       minWidth: width,
       width,
@@ -2849,8 +3167,8 @@ function UserInitialsIcon({
       justifyContent: "center",
       sx: { ...sx },
       ...props,
-      children: /* @__PURE__ */ (0, import_jsx_runtime25.jsx)(
-        import_material22.Typography,
+      children: /* @__PURE__ */ (0, import_jsx_runtime27.jsx)(
+        import_material24.Typography,
         {
           variant: "h3",
           color: textColor,
@@ -2872,9 +3190,9 @@ var getInitials = (name) => {
 };
 
 // src/DynamicSvgIcon/DynamicSvgIcon.tsx
-var import_material23 = require("@mui/material");
-var import_react12 = require("react");
-var import_jsx_runtime26 = require("react/jsx-runtime");
+var import_material25 = require("@mui/material");
+var import_react15 = require("react");
+var import_jsx_runtime28 = require("react/jsx-runtime");
 var svgCache = /* @__PURE__ */ new Map();
 function clearDynamicSvgIconCache() {
   svgCache.clear();
@@ -2885,17 +3203,17 @@ function applyCurrentColor(svg) {
 function useDynamicSvgIcon(url, options = {}) {
   const { replaceColors = false, onLoad, onError } = options;
   const transform = replaceColors ? applyCurrentColor : (s) => s;
-  const [svgContent, setSvgContent] = (0, import_react12.useState)(() => {
+  const [svgContent, setSvgContent] = (0, import_react15.useState)(() => {
     const cached = svgCache.get(url);
     return cached ? transform(cached.innerContent) : null;
   });
-  const [svgViewBox, setSvgViewBox] = (0, import_react12.useState)(() => {
+  const [svgViewBox, setSvgViewBox] = (0, import_react15.useState)(() => {
     const cached = svgCache.get(url);
     return cached?.viewBox ?? null;
   });
-  const [loading, setLoading] = (0, import_react12.useState)(() => !svgCache.has(url));
-  const [error, setError] = (0, import_react12.useState)(null);
-  (0, import_react12.useEffect)(() => {
+  const [loading, setLoading] = (0, import_react15.useState)(() => !svgCache.has(url));
+  const [error, setError] = (0, import_react15.useState)(null);
+  (0, import_react15.useEffect)(() => {
     if (!url) {
       setLoading(false);
       setError("No URL provided");
@@ -2976,8 +3294,8 @@ function DynamicSvgIcon({
     onError
   });
   if (loading) {
-    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
-      import_material23.Skeleton,
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+      import_material25.Skeleton,
       {
         variant: skeletonVariant,
         animation: skeletonAnimation,
@@ -2986,8 +3304,8 @@ function DynamicSvgIcon({
     );
   }
   if (error || !svgContent) {
-    return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
-      import_material23.Box,
+    return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+      import_material25.Box,
       {
         sx: {
           width,
@@ -3006,8 +3324,8 @@ function DynamicSvgIcon({
       }
     );
   }
-  return /* @__PURE__ */ (0, import_jsx_runtime26.jsx)(
-    import_material23.SvgIcon,
+  return /* @__PURE__ */ (0, import_jsx_runtime28.jsx)(
+    import_material25.SvgIcon,
     {
       ...svgIconProps,
       ...svgViewBox && { viewBox: svgViewBox },
@@ -3016,7 +3334,7 @@ function DynamicSvgIcon({
         width,
         height
       },
-      children: /* @__PURE__ */ (0, import_jsx_runtime26.jsx)("g", { dangerouslySetInnerHTML: { __html: svgContent } })
+      children: /* @__PURE__ */ (0, import_jsx_runtime28.jsx)("g", { dangerouslySetInnerHTML: { __html: svgContent } })
     }
   );
 }