@wipco/sdui 0.25.0 → 0.27.0

package/dist/{chunk-XKLUCUVA.js → chunk-EFMKWPZ3.js}

@@ -1,137 +1,10 @@
+import { useOverlayLayer, OverlayContainerContext, getOverlayRoot } from './chunk-XQPTSEJC.js';
 import { Icon } from './chunk-WIDDHR7L.js';
 import { boxed } from './chunk-SAN4IX6N.js';
-import React, { useState, useRef, useMemo, useEffect, useCallback, useLayoutEffect, useSyncExternalStore } from 'react';
-import { createPortal } from 'react-dom';
+import React, { useState, useRef, useMemo, useEffect, useCallback, useLayoutEffect } from 'react';
 import { jsxs, jsx } from 'react/jsx-runtime';
+import { createPortal } from 'react-dom';
 
-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;
-}
 function HoistedStyle({ id, css }) {
   return /* @__PURE__ */ jsx("style", { href: id, precedence: "medium", children: css });
 }
@@ -357,7 +230,7 @@ function Calendar({
   const moveFocus = (next) => {
     onFocusDateChange(clampDate(next, minDate, maxDate));
   };
-  const handleKeyDown2 = (event) => {
+  const handleKeyDown = (event) => {
     const deltaDays = event.key === "ArrowLeft" ? -1 : event.key === "ArrowRight" ? 1 : event.key === "ArrowUp" ? -7 : event.key === "ArrowDown" ? 7 : 0;
     if (deltaDays !== 0) {
       event.preventDefault();
@@ -375,7 +248,7 @@ function Calendar({
       moveFocus(addMonths(focusDate, event.key === "PageUp" ? -1 : 1));
     }
   };
-  return /* @__PURE__ */ jsx("div", { className: "wp-dp", children: /* @__PURE__ */ jsxs("div", { className: "wp-dp__months", ref: gridRef, onKeyDown: handleKeyDown2, children: [
+  return /* @__PURE__ */ jsx("div", { className: "wp-dp", children: /* @__PURE__ */ jsxs("div", { className: "wp-dp__months", ref: gridRef, onKeyDown: handleKeyDown, children: [
     /* @__PURE__ */ jsxs("div", { className: "wp-dp__nav", children: [
       /* @__PURE__ */ jsx(
         "button",
@@ -553,7 +426,7 @@ function DatePickerImpl({
     }
     commit(next);
   };
-  const handleKeyDown2 = (event) => {
+  const handleKeyDown = (event) => {
     if (event.key === "ArrowDown") {
       event.preventDefault();
       if (open) popRef.current?.querySelector('[tabindex="0"]')?.focus();
@@ -586,7 +459,7 @@ function DatePickerImpl({
         lead: true,
         expanded: open,
         onValueChange: handleTextChange,
-        onKeyDown: handleKeyDown2,
+        onKeyDown: handleKeyDown,
         onPointerDown: () => {
           if (!disabled && !open) openCalendar(false);
         }
@@ -706,7 +579,7 @@ function DateRangePickerImpl({
       commit(fromDate && parsed.getTime() < fromDate.getTime() ? "" : fromValue, masked);
     }
   };
-  const handleKeyDown2 = (which) => (event) => {
+  const handleKeyDown = (which) => (event) => {
     if (event.key === "ArrowDown") {
       event.preventDefault();
       if (open) popRef.current?.querySelector('[tabindex="0"]')?.focus();
@@ -761,7 +634,7 @@ function DateRangePickerImpl({
           expanded: open,
           ariaLabel: "\uC2DC\uC791\uC77C",
           onValueChange: (raw) => handleTextChange("from", raw),
-          onKeyDown: handleKeyDown2("from"),
+          onKeyDown: handleKeyDown("from"),
           onFocus: () => setEnd("from"),
           onPointerDown: () => {
             if (!disabled && !open) openCalendar("from", false);
@@ -783,7 +656,7 @@ function DateRangePickerImpl({
           expanded: open,
           ariaLabel: "\uC885\uB8CC\uC77C",
           onValueChange: (raw) => handleTextChange("to", raw),
-          onKeyDown: handleKeyDown2("to"),
+          onKeyDown: handleKeyDown("to"),
           onFocus: () => setEnd("to"),
           onPointerDown: () => {
             if (!disabled && !open) openCalendar("to", false);
@@ -872,4 +745,4 @@ var DP_CSS = `
 var DatePicker = boxed(DatePickerImpl, "DatePicker");
 var DateRangePicker = boxed(DateRangePickerImpl, "DateRangePicker");
 
-export { AnchoredPopoverStyles, DatePicker, DateRangePicker, HoistedStyle, OverlayContainerContext, OverlayLayer, anchorStyle, focusStaysInside, getOverlayRoot, useDismiss, useOverlayLayer, usePopoverAnchor, usePortalTo };
+export { AnchoredPopoverStyles, DatePicker, DateRangePicker, HoistedStyle, anchorStyle, focusStaysInside, useDismiss, usePopoverAnchor, usePortalTo };

package/dist/{chunk-PFUULIZ2.js → chunk-INWASR2G.js}

@@ -1,4 +1,4 @@
-import { DateRangePicker } from './chunk-XKLUCUVA.js';
+import { DateRangePicker } from './chunk-EFMKWPZ3.js';
 import { SegmentedControl, Select } from './chunk-WIDDHR7L.js';
 import { boxed } from './chunk-SAN4IX6N.js';
 import { useState, useMemo } from 'react';

package/dist/chunk-QU7YVMFA.js

@@ -0,0 +1,39 @@
+import { OverlayLayer } from './chunk-XQPTSEJC.js';
+import { Dialog, warnOnce } from './chunk-WIDDHR7L.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 };