@wipco/sdui 1.4.2 → 1.6.0

package/dist/chunk-LFEJLOFN.js

@@ -1,352 +0,0 @@
-import { useSduiAdapter, hostFetchOf, defaultAdapter } from './chunk-KO6OEY3G.js';
-import { Icon, Badge, Checkbox, Select, Button } from './chunk-RNOUXUBO.js';
-import { boxed } from './chunk-5WW4MBRO.js';
-import { useRef, useEffect, useMemo, useState } from 'react';
-import { jsx, jsxs } from 'react/jsx-runtime';
-
-var OPERATIONS = [
-  { key: "read", label: "\uC870\uD68C" },
-  { key: "create", label: "\uC0DD\uC131" },
-  { key: "update", label: "\uC218\uC815" },
-  { key: "delete", label: "\uC0AD\uC81C" }
-];
-var SCOPE_OPTIONS = [
-  { value: "team", label: "\uD300" },
-  { value: "headquarter", label: "\uBCF8\uBD80" },
-  { value: "all", label: "\uC804\uCCB4" }
-];
-var CATEGORY_LABELS = {
-  fi: "\uC7AC\uBB34",
-  asset: "\uC790\uC0B0",
-  hr: "\uC778\uC0AC",
-  core: "\uACF5\uD1B5",
-  rbac: "\uAD8C\uD55C"
-};
-var CATEGORY_ORDER = ["fi", "asset", "hr", "core", "rbac"];
-var entityOf = (code) => {
-  const i = code.lastIndexOf(".");
-  return i > 0 ? code.slice(0, i) : code;
-};
-var operationOf = (code) => {
-  const i = code.lastIndexOf(".");
-  const op = i > 0 ? code.slice(i + 1) : "";
-  return OPERATIONS.some((o) => o.key === op) ? op : null;
-};
-function groupCatalog(catalog, categoryLabels, categoryOrder) {
-  const categories = /* @__PURE__ */ new Map();
-  for (const entry of catalog) {
-    if (!entry || typeof entry.code !== "string") continue;
-    const category = entry.category?.trim() || "\uAE30\uD0C0";
-    const entity = entityOf(entry.code);
-    const byEntity = categories.get(category) ?? /* @__PURE__ */ new Map();
-    categories.set(category, byEntity);
-    const row = byEntity.get(entity) ?? { entity, label: "", cells: {}, extras: [] };
-    byEntity.set(entity, row);
-    const op = operationOf(entry.code);
-    if (op) {
-      row.cells[op] = entry;
-      if (!row.label) row.label = entry.name.replace(/\s*(조회|생성|수정|삭제)\s*$/, "") || entity;
-    } else {
-      row.extras.push(entry);
-      if (!row.label) row.label = entry.name;
-    }
-  }
-  const order = (c) => {
-    const i = categoryOrder.indexOf(c);
-    return i < 0 ? categoryOrder.length : i;
-  };
-  return [...categories.entries()].sort((a, b) => order(a[0]) - order(b[0]) || a[0].localeCompare(b[0])).map(([category, byEntity]) => ({
-    category,
-    label: categoryLabels[category] ?? category,
-    rows: [...byEntity.values()].sort((a, b) => a.entity.localeCompare(b.entity))
-  }));
-}
-function PermissionMatrixEditorImpl({
-  permissions,
-  value,
-  onChange,
-  sourceEndpoint,
-  disabled = false,
-  scopeOptions = SCOPE_OPTIONS,
-  defaultScope = "all",
-  categoryLabels = CATEGORY_LABELS,
-  categoryOrder = CATEGORY_ORDER,
-  emptyText = "\uAD8C\uD55C \uCE74\uD0C8\uB85C\uADF8\uAC00 \uBE44\uC5B4 \uC788\uC2B5\uB2C8\uB2E4 \u2014 \uD398\uC774\uC9C0\uC758 data \uC120\uC5B8(/permissions?limit=1000)\uC744 \uD655\uC778\uD558\uC138\uC694."
-}) {
-  const adapter = useSduiAdapter();
-  const api = hostFetchOf(adapter) ?? defaultAdapter.fetch;
-  const onChangeRef = useRef(onChange);
-  onChangeRef.current = onChange;
-  const seededFor = useRef(null);
-  useEffect(() => {
-    if (!sourceEndpoint || seededFor.current === sourceEndpoint) return;
-    seededFor.current = sourceEndpoint;
-    api(sourceEndpoint, { method: "GET" }).then((response) => {
-      if (seededFor.current !== sourceEndpoint) return;
-      const body = response;
-      const rows = Array.isArray(body?.permissions) ? body.permissions : [];
-      onChangeRef.current?.(
-        rows.flatMap((row) => {
-          if (typeof row !== "object" || row === null) return [];
-          const { code, scope } = row;
-          if (typeof code !== "string" || !code) return [];
-          return [{ code, scope: typeof scope === "string" ? scope : defaultScope }];
-        })
-      );
-    }).catch(() => {
-    });
-  }, [sourceEndpoint, defaultScope]);
-  const grants = useMemo(() => Array.isArray(value) ? value : [], [value]);
-  const catalog = useMemo(
-    () => Array.isArray(permissions) ? permissions : [],
-    [permissions]
-  );
-  const labelsKey = JSON.stringify(categoryLabels);
-  const orderKey = JSON.stringify(categoryOrder);
-  const groups = useMemo(
-    () => groupCatalog(catalog, categoryLabels, categoryOrder),
-    [catalog, labelsKey, orderKey]
-  );
-  const granted = useMemo(() => new Set(grants.map((g) => g.code)), [grants]);
-  const scopeOf = useMemo(() => {
-    const map = /* @__PURE__ */ new Map();
-    for (const g of grants) {
-      const e = entityOf(g.code);
-      if (!map.has(e) && g.scope) map.set(e, g.scope);
-    }
-    return map;
-  }, [grants]);
-  const [closed, setClosed] = useState(/* @__PURE__ */ new Set());
-  const toggleCategory = (c) => setClosed((prev) => {
-    const next = new Set(prev);
-    if (next.has(c)) next.delete(c);
-    else next.add(c);
-    return next;
-  });
-  const emit = (nextGranted, nextScopes) => {
-    onChange?.(
-      [...nextGranted].sort().map((code) => ({
-        code,
-        scope: nextScopes.get(entityOf(code)) ?? defaultScope
-      }))
-    );
-  };
-  const toggleCode = (code, on) => {
-    const next = new Set(granted);
-    if (on) next.add(code);
-    else next.delete(code);
-    emit(next, scopeOf);
-  };
-  const setEntityScope = (entity, scope) => {
-    const next = new Map(scopeOf);
-    next.set(entity, scope);
-    emit(granted, next);
-  };
-  const toggleRow = (row, on) => {
-    const next = new Set(granted);
-    for (const op of OPERATIONS) {
-      const cell = row.cells[op.key];
-      if (!cell) continue;
-      if (on) next.add(cell.code);
-      else next.delete(cell.code);
-    }
-    for (const extra of row.extras) {
-      if (on) next.add(extra.code);
-      else next.delete(extra.code);
-    }
-    emit(next, scopeOf);
-  };
-  if (catalog.length === 0) {
-    return /* @__PURE__ */ jsx(
-      "div",
-      {
-        className: "wp-body-sm",
-        style: {
-          border: "var(--wp-border-w) dashed var(--wp-border-default)",
-          borderRadius: "var(--wp-radius-lg)",
-          padding: "var(--wp-space-4)",
-          textAlign: "center",
-          color: "var(--wp-text-muted)"
-        },
-        children: emptyText
-      }
-    );
-  }
-  return /* @__PURE__ */ jsxs("div", { className: "wp-col", style: { gap: "var(--wp-space-2)" }, children: [
-    /* @__PURE__ */ jsxs("span", { className: "wp-caption", children: [
-      "\uAD8C\uD55C ",
-      catalog.length,
-      "\uC885 \uC911 ",
-      granted.size,
-      "\uAC1C \uBD80\uC5EC\uB428 \xB7 \uBC94\uC704\uB294 \uC5D4\uD2F0\uD2F0 \uB2E8\uC704\uB85C \uC801\uC6A9\uB429\uB2C8\uB2E4 (",
-      scopeOptions.map((option) => option.label).join(" < "),
-      ")"
-    ] }),
-    /* @__PURE__ */ jsx(
-      "div",
-      {
-        style: {
-          position: "relative",
-          border: "var(--wp-border-w) solid var(--wp-border-default)",
-          borderRadius: "var(--wp-radius-lg)",
-          overflowY: "auto",
-          maxHeight: "min(46vh, 400px)",
-          minHeight: 160
-        },
-        children: groups.map((group) => {
-          const total = group.rows.reduce(
-            (a, r) => a + Object.keys(r.cells).length + r.extras.length,
-            0
-          );
-          const on = group.rows.reduce(
-            (a, r) => a + OPERATIONS.filter((o) => r.cells[o.key] && granted.has(r.cells[o.key].code)).length + r.extras.filter((x) => granted.has(x.code)).length,
-            0
-          );
-          const isClosed = closed.has(group.category);
-          return /* @__PURE__ */ jsxs("div", { children: [
-            /* @__PURE__ */ jsxs(
-              "button",
-              {
-                type: "button",
-                className: "wp-row",
-                onClick: () => toggleCategory(group.category),
-                style: {
-                  position: "sticky",
-                  top: 0,
-                  zIndex: 1,
-                  width: "100%",
-                  alignItems: "center",
-                  padding: "var(--wp-space-2) var(--wp-space-3)",
-                  background: "var(--wp-surface-sunken)",
-                  border: "none",
-                  borderTop: "var(--wp-border-w) solid var(--wp-border-default)",
-                  cursor: "pointer",
-                  textAlign: "left"
-                },
-                "aria-expanded": !isClosed,
-                children: [
-                  /* @__PURE__ */ jsx(Icon, { name: isClosed ? "chevron-right" : "chevron-down", size: 14 }),
-                  /* @__PURE__ */ jsx("span", { className: "wp-label", style: { flex: 1 }, children: group.label }),
-                  /* @__PURE__ */ jsxs(Badge, { tone: on > 0 ? "brand" : "neutral", children: [
-                    on,
-                    "/",
-                    total
-                  ] })
-                ]
-              }
-            ),
-            isClosed ? null : /* @__PURE__ */ jsxs("div", { className: "wp-col", style: { gap: 0 }, children: [
-              /* @__PURE__ */ jsxs(
-                "div",
-                {
-                  className: "wp-row wp-caption",
-                  style: {
-                    alignItems: "center",
-                    padding: "var(--wp-space-1) var(--wp-space-3)",
-                    borderTop: "var(--wp-border-w) solid var(--wp-divider)",
-                    color: "var(--wp-text-muted)"
-                  },
-                  children: [
-                    /* @__PURE__ */ jsx("span", { style: { flex: 1.6 }, children: "\uC5D4\uD2F0\uD2F0" }),
-                    OPERATIONS.map((op) => /* @__PURE__ */ jsx("span", { style: { flex: "none", width: 52, textAlign: "center" }, children: op.label }, op.key)),
-                    /* @__PURE__ */ jsx("span", { style: { flex: "none", width: 96, textAlign: "center" }, children: "\uBC94\uC704" }),
-                    /* @__PURE__ */ jsx("span", { style: { flex: "none", width: 60 } })
-                  ]
-                }
-              ),
-              group.rows.map((row) => {
-                const rowCodes = [
-                  ...OPERATIONS.flatMap(
-                    (o) => row.cells[o.key] ? [row.cells[o.key].code] : []
-                  ),
-                  ...row.extras.map((x) => x.code)
-                ];
-                const allOn = rowCodes.length > 0 && rowCodes.every((c) => granted.has(c));
-                const anyOn = rowCodes.some((c) => granted.has(c));
-                return /* @__PURE__ */ jsxs(
-                  "div",
-                  {
-                    className: "wp-row",
-                    style: {
-                      alignItems: "center",
-                      padding: "var(--wp-space-1) var(--wp-space-3)",
-                      borderTop: "var(--wp-border-w) solid var(--wp-divider)"
-                    },
-                    children: [
-                      /* @__PURE__ */ jsxs("span", { className: "wp-body-sm", style: { flex: 1.6, minWidth: 0 }, children: [
-                        row.label || row.entity,
-                        /* @__PURE__ */ jsx(
-                          "span",
-                          {
-                            className: "wp-caption",
-                            style: {
-                              marginLeft: "var(--wp-space-2)",
-                              color: "var(--wp-text-muted)"
-                            },
-                            children: row.entity
-                          }
-                        )
-                      ] }),
-                      OPERATIONS.map((op) => {
-                        const cell = row.cells[op.key];
-                        return /* @__PURE__ */ jsx(
-                          "span",
-                          {
-                            style: {
-                              flex: "none",
-                              width: 52,
-                              display: "inline-flex",
-                              justifyContent: "center"
-                            },
-                            children: cell ? /* @__PURE__ */ jsx(
-                              Checkbox,
-                              {
-                                "aria-label": `${row.label || row.entity} ${op.label}`,
-                                checked: granted.has(cell.code),
-                                disabled,
-                                onChange: (event) => toggleCode(cell.code, event.target.checked)
-                              }
-                            ) : /* @__PURE__ */ jsx("span", { className: "wp-caption", style: { color: "var(--wp-text-muted)" }, children: "\u2013" })
-                          },
-                          op.key
-                        );
-                      }),
-                      /* @__PURE__ */ jsx("span", { style: { flex: "none", width: 96 }, children: /* @__PURE__ */ jsx(
-                        Select,
-                        {
-                          "aria-label": `${row.label || row.entity} \uBC94\uC704`,
-                          value: scopeOf.get(row.entity) ?? defaultScope,
-                          options: scopeOptions,
-                          disabled: disabled || !anyOn,
-                          onChange: (event) => setEntityScope(row.entity, event.target.value)
-                        }
-                      ) }),
-                      /* @__PURE__ */ jsx("span", { style: { flex: "none", width: 60, textAlign: "right" }, children: /* @__PURE__ */ jsx(
-                        Button,
-                        {
-                          type: "button",
-                          size: "sm",
-                          variant: "ghost",
-                          disabled,
-                          onClick: () => toggleRow(row, !allOn),
-                          children: allOn ? "\uD574\uC81C" : "\uC804\uCCB4"
-                        }
-                      ) })
-                    ]
-                  },
-                  row.entity
-                );
-              })
-            ] })
-          ] }, group.category);
-        })
-      }
-    )
-  ] });
-}
-var PermissionMatrixEditor = boxed(
-  PermissionMatrixEditorImpl,
-  "PermissionMatrixEditor"
-);
-
-export { PermissionMatrixEditor };

package/dist/chunk-MMIGOPO5.js

@@ -1,111 +0,0 @@
-import { useRef, useState, useEffect, useCallback } from 'react';
-
-// src/widgets/usePanZoomCanvas.ts
-var MIN_ZOOM = 0.35;
-var MAX_ZOOM = 1.8;
-var clamp = (value, min, max) => Math.min(max, Math.max(min, value));
-function applyZoom(current, nextScale, focal) {
-  const scale = clamp(nextScale, MIN_ZOOM, MAX_ZOOM);
-  return {
-    scale,
-    x: focal.x - (focal.x - current.x) / current.scale * scale,
-    y: focal.y - (focal.y - current.y) / current.scale * scale
-  };
-}
-function usePanZoomCanvas(options) {
-  const { stopSelector, initialView } = options;
-  const viewportRef = useRef(null);
-  const dragRef = useRef(null);
-  const [view, setView] = useState(initialView);
-  const [dragging, setDragging] = useState(false);
-  const [isFullscreen, setIsFullscreen] = useState(false);
-  useEffect(() => {
-    const handleFullscreenChange = () => {
-      setIsFullscreen(document.fullscreenElement === viewportRef.current);
-    };
-    document.addEventListener("fullscreenchange", handleFullscreenChange);
-    return () => document.removeEventListener("fullscreenchange", handleFullscreenChange);
-  }, []);
-  useEffect(() => {
-    const viewport = viewportRef.current;
-    if (!viewport) return;
-    const onWheel = (event) => {
-      event.preventDefault();
-      const rect = viewport.getBoundingClientRect();
-      const focal = { x: event.clientX - rect.left, y: event.clientY - rect.top };
-      setView(
-        (current) => applyZoom(current, current.scale * (event.deltaY > 0 ? 0.9 : 1.1), focal)
-      );
-    };
-    viewport.addEventListener("wheel", onWheel, { passive: false });
-    return () => viewport.removeEventListener("wheel", onWheel);
-  }, []);
-  const viewportCenter = useCallback(() => {
-    const rect = viewportRef.current?.getBoundingClientRect();
-    if (!rect) return { x: 0, y: 0 };
-    return { x: rect.width / 2, y: rect.height / 2 };
-  }, []);
-  const zoomAt = useCallback((nextScale, focal) => {
-    setView((current) => applyZoom(current, nextScale, focal));
-  }, []);
-  const handlePointerDown = (event) => {
-    if (event.target.closest(stopSelector)) return;
-    dragRef.current = {
-      pointerId: event.pointerId,
-      startX: event.clientX,
-      startY: event.clientY,
-      originX: view.x,
-      originY: view.y
-    };
-    setDragging(true);
-    event.currentTarget.setPointerCapture(event.pointerId);
-  };
-  const handlePointerMove = (event) => {
-    const drag = dragRef.current;
-    if (!drag || drag.pointerId !== event.pointerId) return;
-    setView((current) => ({
-      ...current,
-      x: drag.originX + event.clientX - drag.startX,
-      y: drag.originY + event.clientY - drag.startY
-    }));
-  };
-  const handlePointerUp = (event) => {
-    if (dragRef.current?.pointerId !== event.pointerId) return;
-    dragRef.current = null;
-    setDragging(false);
-    if (event.currentTarget.hasPointerCapture(event.pointerId)) {
-      event.currentTarget.releasePointerCapture(event.pointerId);
-    }
-  };
-  const toggleFullscreen = async () => {
-    const viewport = viewportRef.current;
-    if (!viewport) return;
-    try {
-      if (document.fullscreenElement === viewport) {
-        await document.exitFullscreen();
-        return;
-      }
-      await viewport.requestFullscreen();
-    } catch {
-    }
-  };
-  return {
-    viewportRef,
-    view,
-    setView,
-    dragging,
-    isFullscreen,
-    viewportCenter,
-    zoomAt,
-    toggleFullscreen,
-    /** 뷰포트 div에 그대로 spread — 패닝 4종 핸들러. */
-    pointerHandlers: {
-      onPointerDown: handlePointerDown,
-      onPointerMove: handlePointerMove,
-      onPointerUp: handlePointerUp,
-      onPointerCancel: handlePointerUp
-    }
-  };
-}
-
-export { MAX_ZOOM, MIN_ZOOM, usePanZoomCanvas };

package/dist/chunk-TFGNKFL2.js

@@ -1,39 +0,0 @@
-import { OverlayLayer } from './chunk-XQPTSEJC.js';
-import { Dialog, warnOnce } from './chunk-RNOUXUBO.js';
-import { createContext, useContext, useMemo } from 'react';
-import { jsx } from 'react/jsx-runtime';
-
-var SduiDispatchContext = createContext(null);
-function useSduiDispatch() {
-  const dispatch = useContext(SduiDispatchContext);
-  if (!dispatch) {
-    throw new Error("useSduiDispatch\uB294 SduiRenderer \uB0B4\uBD80\uC5D0\uC11C\uB9CC \uC0AC\uC6A9\uD560 \uC218 \uC788\uC2B5\uB2C8\uB2E4.");
-  }
-  return dispatch;
-}
-var ALLOW_ALL = () => true;
-var DENY_ALL = () => false;
-var MISSING = () => {
-  warnOnce(
-    "permission:missing",
-    '[sdui] \uAD8C\uD55C \uD310\uC815(can)\uC774 \uC8FC\uC785\uB418\uC9C0 \uC54A\uC558\uC2B5\uB2C8\uB2E4 \u2014 <Can>\uC774 \uC804\uBD80 \uD1B5\uACFC\uD569\uB2C8\uB2E4. SduiRenderer\uC5D0 can \uCF5C\uBC31\uC744 \uB118\uAE30\uAC70\uB098, \uC138\uC158\uC774 \uC5C6\uB294 \uBBF8\uB9AC\uBCF4\uAE30\uB77C\uBA74 can="allow-all"\uC744 \uBA85\uC2DC\uD558\uC138\uC694.'
-  );
-  return true;
-};
-var SduiPermissionContext = createContext(null);
-function SduiPermissionProvider({ can, children }) {
-  const value = useMemo(() => {
-    if (can === "allow-all") return ALLOW_ALL;
-    if (can === "deny-all") return DENY_ALL;
-    return typeof can === "function" ? can : null;
-  }, [can]);
-  return /* @__PURE__ */ jsx(SduiPermissionContext.Provider, { value, children });
-}
-function useSduiCan() {
-  return useContext(SduiPermissionContext) ?? MISSING;
-}
-function SduiDialog(props) {
-  return /* @__PURE__ */ jsx(OverlayLayer, { onClose: props.onClose, children: /* @__PURE__ */ jsx(Dialog, { ...props }) });
-}
-
-export { SduiDialog, SduiDispatchContext, SduiPermissionProvider, useSduiCan, useSduiDispatch };

package/dist/chunk-XQPTSEJC.js

@@ -1,135 +0,0 @@
-import React, { useRef, useEffect, useSyncExternalStore } from 'react';
-import { createPortal } from 'react-dom';
-import { jsx } from 'react/jsx-runtime';
-
-// src/overlay.tsx
-var OVERLAY_ROOT_ID = "wp-overlay-root";
-var DOCUMENT_POSITION_FOLLOWING = 4;
-function getOverlayRoot() {
-  if (typeof document === "undefined") return null;
-  const existing = document.getElementById(OVERLAY_ROOT_ID);
-  if (existing) return existing;
-  const created = document.createElement("div");
-  created.id = OVERLAY_ROOT_ID;
-  document.body.appendChild(created);
-  return created;
-}
-var layers = [];
-var nextId = 0;
-var subscribers = /* @__PURE__ */ new Set();
-var keyListenerBound = false;
-function emit() {
-  layers = layers.slice();
-  subscribers.forEach((fn) => fn());
-}
-function topLayer(list) {
-  let best;
-  let bestNode = null;
-  for (const layer of list) {
-    const node = layer.node();
-    if (!best) {
-      best = layer;
-      bestNode = node;
-      continue;
-    }
-    if (!node) continue;
-    if (!bestNode) {
-      best = layer;
-      bestNode = node;
-      continue;
-    }
-    if (bestNode.compareDocumentPosition(node) & DOCUMENT_POSITION_FOLLOWING) {
-      best = layer;
-      bestNode = node;
-    }
-  }
-  return best;
-}
-function layerHoldsTop(list, id) {
-  const top = topLayer(list);
-  if (!top) return false;
-  if (top.id === id) return true;
-  const mine = list.find((l) => l.id === id)?.node();
-  const topNode = top.node();
-  return !!mine && !!topNode && mine.contains(topNode);
-}
-function escapeTopmost() {
-  topLayer(layers)?.onEscape();
-}
-function handleKeyDown(event) {
-  if (event.key !== "Escape") return;
-  escapeTopmost();
-}
-function push(layer) {
-  layers.push(layer);
-  if (!keyListenerBound && typeof document !== "undefined") {
-    document.addEventListener("keydown", handleKeyDown);
-    keyListenerBound = true;
-  }
-  emit();
-}
-function remove(id) {
-  layers = layers.filter((l) => l.id !== id);
-  emit();
-}
-function subscribe(fn) {
-  subscribers.add(fn);
-  return () => {
-    subscribers.delete(fn);
-  };
-}
-var snapshot = () => layers;
-var serverSnapshot = () => [];
-function useOverlayLayer(active, onEscape, nodeRef) {
-  const idRef = useRef(0);
-  if (idRef.current === 0) idRef.current = ++nextId;
-  const escapeRef = useRef(onEscape);
-  escapeRef.current = onEscape;
-  const nodeRefRef = useRef(nodeRef);
-  nodeRefRef.current = nodeRef;
-  useEffect(() => {
-    if (!active) return;
-    const id2 = idRef.current;
-    push({
-      id: id2,
-      onEscape: () => escapeRef.current?.(),
-      node: () => nodeRefRef.current?.current ?? null
-    });
-    return () => remove(id2);
-  }, [active]);
-  const current = useSyncExternalStore(subscribe, snapshot, serverSnapshot);
-  const id = idRef.current;
-  return {
-    isTop: active && topLayer(current)?.id === id,
-    holdsTop: active && layerHoldsTop(current, id)
-  };
-}
-var OverlayContainerContext = React.createContext(null);
-function OverlayLayer({
-  onClose,
-  children
-}) {
-  const ref = useRef(null);
-  const container = React.useContext(OverlayContainerContext);
-  const { holdsTop } = useOverlayLayer(true, onClose, ref);
-  useEffect(() => {
-    ref.current?.toggleAttribute("inert", !holdsTop);
-  }, [holdsTop]);
-  const layer = /* @__PURE__ */ jsx(
-    "div",
-    {
-      ref,
-      className: "wp-overlay-layer",
-      onClick: (event) => {
-        if (onClose && event.target instanceof HTMLElement && event.target.classList.contains("wp-overlay")) {
-          onClose();
-        }
-      },
-      children
-    }
-  );
-  const root = container ?? getOverlayRoot();
-  return root ? createPortal(layer, root) : layer;
-}
-
-export { OverlayContainerContext, OverlayLayer, getOverlayRoot, useOverlayLayer };