@design-edito/tools 0.4.1 → 0.4.2

package/chunks/{chunk-E33STMH3.js → chunk-BPKMOVMW.js}

@@ -2192,11 +2192,10 @@ var Utils;
     throw new Error(`Cannot clone value: ${value}`);
   }
   Utils2.clone = clone2;
-  function coalesceValues(currentValue, subpath, subvalue) {
+  function coalesceValues(currentValue, subpath, toCoalesce) {
     const { Element: Element2, Text: Text2, NodeList: NodeList2, document } = get();
-    let actualSubvalue = subvalue;
-    if (actualSubvalue instanceof Transformer) {
-      const transformer = actualSubvalue;
+    if (toCoalesce instanceof Transformer) {
+      const transformer = toCoalesce;
       const transformationResult = transformer.apply(currentValue);
       if (!transformationResult.success) {
         console.warn({ ...transformationResult.error });
@@ -2204,87 +2203,87 @@ var Utils;
       }
       const evaluated = transformationResult.payload;
       if (transformer.mode === "isolation") {
-        actualSubvalue = evaluated;
+        toCoalesce = evaluated;
       } else {
         return evaluated;
       }
     }
-    if (Array.isArray(currentValue)) return [...currentValue, actualSubvalue];
-    if (currentValue === null) return actualSubvalue;
-    if (typeof currentValue === "boolean") return actualSubvalue;
-    if (typeof currentValue === "number") return actualSubvalue;
-    if (currentValue instanceof Transformer) return actualSubvalue;
-    if (currentValue instanceof Method) return actualSubvalue;
+    if (Array.isArray(currentValue)) return [...currentValue, toCoalesce];
+    if (currentValue === null) return toCoalesce;
+    if (typeof currentValue === "boolean") return toCoalesce;
+    if (typeof currentValue === "number") return toCoalesce;
+    if (currentValue instanceof Transformer) return toCoalesce;
+    if (currentValue instanceof Method) return toCoalesce;
     if (typeof currentValue === "string") {
-      if (actualSubvalue === null || typeof actualSubvalue === "boolean" || typeof actualSubvalue === "number" || typeof actualSubvalue === "string") return `${currentValue}${actualSubvalue}`;
-      if (actualSubvalue instanceof Text2) return `${currentValue}${actualSubvalue.textContent}`;
-      if (actualSubvalue instanceof Element2) {
+      if (toCoalesce === null || typeof toCoalesce === "boolean" || typeof toCoalesce === "number" || typeof toCoalesce === "string") return `${currentValue}${toCoalesce}`;
+      if (toCoalesce instanceof Text2) return `${currentValue}${toCoalesce.textContent}`;
+      if (toCoalesce instanceof Element2) {
         const frag = document.createDocumentFragment();
-        frag.append(currentValue, Utils2.clone(actualSubvalue));
+        frag.append(currentValue, Utils2.clone(toCoalesce));
         return frag.childNodes;
       }
-      if (actualSubvalue instanceof NodeList2) {
+      if (toCoalesce instanceof NodeList2) {
         const frag = document.createDocumentFragment();
-        frag.append(currentValue, ...Array.from(Utils2.clone(actualSubvalue)));
+        frag.append(currentValue, ...Array.from(Utils2.clone(toCoalesce)));
         return frag.childNodes;
       }
-      return actualSubvalue;
+      return toCoalesce;
     }
     if (currentValue instanceof Text2) {
-      if (actualSubvalue === null || typeof actualSubvalue === "boolean" || typeof actualSubvalue === "number" || typeof actualSubvalue === "string") return document.createTextNode(`${currentValue.textContent}${actualSubvalue}`);
-      if (actualSubvalue instanceof Text2) return document.createTextNode(`${currentValue.textContent}${actualSubvalue.textContent}`);
-      if (actualSubvalue instanceof Element2) {
+      if (toCoalesce === null || typeof toCoalesce === "boolean" || typeof toCoalesce === "number" || typeof toCoalesce === "string") return document.createTextNode(`${currentValue.textContent}${toCoalesce}`);
+      if (toCoalesce instanceof Text2) return document.createTextNode(`${currentValue.textContent}${toCoalesce.textContent}`);
+      if (toCoalesce instanceof Element2) {
         const frag = document.createDocumentFragment();
-        frag.append(clone2(currentValue), clone2(actualSubvalue));
+        frag.append(clone2(currentValue), clone2(toCoalesce));
         return frag.childNodes;
       }
-      if (actualSubvalue instanceof NodeList2) {
+      if (toCoalesce instanceof NodeList2) {
         const frag = document.createDocumentFragment();
-        frag.append(clone2(currentValue), ...Array.from(clone2(actualSubvalue)));
+        frag.append(clone2(currentValue), ...Array.from(clone2(toCoalesce)));
         return frag.childNodes;
       }
-      return actualSubvalue;
+      return toCoalesce;
     }
     if (currentValue instanceof Element2) {
-      if (actualSubvalue === null || typeof actualSubvalue === "boolean" || typeof actualSubvalue === "number" || typeof actualSubvalue === "string") {
+      if (toCoalesce === null || typeof toCoalesce === "boolean" || typeof toCoalesce === "number" || typeof toCoalesce === "string") {
         const frag = document.createDocumentFragment();
-        frag.append(clone2(currentValue), `${actualSubvalue}`);
+        frag.append(clone2(currentValue), `${toCoalesce}`);
         return frag.childNodes;
       }
-      if (actualSubvalue instanceof Text2 || actualSubvalue instanceof Element2) {
+      if (toCoalesce instanceof Text2 || toCoalesce instanceof Element2) {
         const frag = document.createDocumentFragment();
-        frag.append(clone2(currentValue), clone2(actualSubvalue));
+        frag.append(clone2(currentValue), clone2(toCoalesce));
         return frag.childNodes;
       }
-      if (actualSubvalue instanceof NodeList2) {
+      if (toCoalesce instanceof NodeList2) {
         const frag = document.createDocumentFragment();
-        frag.append(clone2(currentValue), ...Array.from(clone2(actualSubvalue)));
+        frag.append(clone2(currentValue), ...Array.from(clone2(toCoalesce)));
         return frag.childNodes;
       }
-      return actualSubvalue;
+      return toCoalesce;
     }
     if (currentValue instanceof NodeList2) {
-      if (actualSubvalue === null || typeof actualSubvalue === "boolean" || typeof actualSubvalue === "number" || typeof actualSubvalue === "string") {
+      if (toCoalesce === null || typeof toCoalesce === "boolean" || typeof toCoalesce === "number" || typeof toCoalesce === "string") {
         const frag = document.createDocumentFragment();
-        frag.append(...Array.from(clone2(currentValue)), `${actualSubvalue}`);
+        frag.append(...Array.from(clone2(currentValue)), `${toCoalesce}`);
         return frag.childNodes;
       }
-      if (actualSubvalue instanceof Text2 || actualSubvalue instanceof Element2) {
+      if (toCoalesce instanceof Text2 || toCoalesce instanceof Element2) {
         const frag = document.createDocumentFragment();
-        frag.append(...Array.from(clone2(currentValue)), clone2(actualSubvalue));
+        frag.append(...Array.from(clone2(currentValue)), clone2(toCoalesce));
         return frag.childNodes;
       }
-      if (actualSubvalue instanceof NodeList2) {
+      if (toCoalesce instanceof NodeList2) {
         const frag = document.createDocumentFragment();
-        frag.append(...Array.from(clone2(currentValue)), ...Array.from(clone2(actualSubvalue)));
+        frag.append(...Array.from(clone2(currentValue)), ...Array.from(clone2(toCoalesce)));
         return frag.childNodes;
       }
-      return actualSubvalue;
+      return toCoalesce;
     }
     if (typeof subpath === "number") return { ...currentValue };
     return {
       ...currentValue,
-      [subpath]: actualSubvalue
+      [subpath]: toCoalesce
     };
   }
   Utils2.coalesceValues = coalesceValues;

package/chunks/{chunk-SPC2SMZR.js → chunk-F2YJXIT7.js}

@@ -1,6 +1,6 @@
 import {
   intersectionObserver
-} from "./chunk-3DNVFA25.js";
+} from "./chunk-IEZ3O5OF.js";
 import {
   clss
 } from "./chunk-TRFZSKNB.js";
@@ -15,11 +15,7 @@ import {
   useEffect,
   useCallback
 } from "react";
-
-// src/components/IntersectionObserver/styles.module.css
-var styles_default = {};
-
-// src/components/IntersectionObserver/index.tsx
+import cssModule from "./styles.module.css";
 import { jsx } from "react/jsx-runtime";
 var IntersectionObserverComponent = ({
   onIntersected,
@@ -61,7 +57,7 @@ var IntersectionObserverComponent = ({
       window.clearTimeout(timeout2);
     };
   }, [forceObservation]);
-  const c = clss(intersectionObserver, { cssModule: styles_default });
+  const c = clss(intersectionObserver, { cssModule });
   const isIntersecting = ioEntry?.isIntersecting ?? false;
   const rootClss = mergeClassNames(
     c(null, { "is-intersecting": isIntersecting }),

package/chunks/{chunk-UVG2S54P.js → chunk-GG4EFNMU.js}

@@ -1,6 +1,6 @@
 import {
   resizeObserver
-} from "./chunk-3DNVFA25.js";
+} from "./chunk-IEZ3O5OF.js";
 import {
   clss
 } from "./chunk-TRFZSKNB.js";
@@ -14,11 +14,7 @@ import {
   useEffect,
   useState
 } from "react";
-
-// src/components/ResizeObserver/style.module.css
-var style_default = {};
-
-// src/components/ResizeObserver/index.tsx
+import cssModule from "./style.module.css";
 import { jsx } from "react/jsx-runtime";
 var ResizeObserverComponent = ({
   className,
@@ -74,7 +70,7 @@ var ResizeObserverComponent = ({
       [`--${resizeObserver}-${key}-px`]: `${val.toString()}px`
     };
   }, {});
-  const c = clss(resizeObserver, { cssModule: style_default });
+  const c = clss(resizeObserver, { cssModule });
   const rootClss = mergeClassNames(c(null), className);
   return /* @__PURE__ */ jsx(
     "div",

package/chunks/{chunk-3DNVFA25.js → chunk-IEZ3O5OF.js}

@@ -6,6 +6,7 @@ var eventListener = "dsed-event-listener";
 var gallery = "dsed-gallery";
 var image = "dsed-image";
 var intersectionObserver = "dsed-intersection-observer";
+var overlayer = "dsed-overlayer";
 var paginator = "dsed-paginator";
 var resizeObserver = "dsed-resize-observer";
 var scrllgngn = "dsed-scrllgngn";
@@ -25,6 +26,7 @@ export {
   gallery,
   image,
   intersectionObserver,
+  overlayer,
   paginator,
   resizeObserver,
   scrllgngn,

package/chunks/{chunk-KKYEOIJI.js → chunk-PYJKFOMV.js}

@@ -6,7 +6,7 @@ import {
 } from "./chunk-PUQUSA6S.js";
 import {
   subtitles
-} from "./chunk-3DNVFA25.js";
+} from "./chunk-IEZ3O5OF.js";
 import {
   clss
 } from "./chunk-TRFZSKNB.js";
@@ -95,10 +95,8 @@ var getCurrentGroup = (subsGroupsWithBoundaries, lastPrevSubId, isEnded) => {
   return previousGroups[previousGroups.length - 1];
 };
 
-// src/components/Subtitles/styles.module.css
-var styles_default = {};
-
 // src/components/Subtitles/index.tsx
+import cssModule from "./styles.module.css";
 import { jsx } from "react/jsx-runtime";
 var Subtitles = ({
   src,
@@ -143,7 +141,7 @@ var Subtitles = ({
       console.error(error);
     });
   }, [fetchAndParseSubs, src, srtFileContent]);
-  const c = clss(subtitles, { cssModule: styles_default });
+  const c = clss(subtitles, { cssModule });
   const rootClss = mergeClassNames(
     c(null, {
       loading: isLoading,

package/chunks/{chunk-OEVSF7D3.js → chunk-XFB4PUXO.js}

@@ -1,6 +1,6 @@
 import {
   disclaimer
-} from "./chunk-3DNVFA25.js";
+} from "./chunk-IEZ3O5OF.js";
 import {
   clss
 } from "./chunk-TRFZSKNB.js";
@@ -14,11 +14,7 @@ import {
   useEffect,
   useRef
 } from "react";
-
-// src/components/Disclaimer/styles.module.css
-var styles_default = {};
-
-// src/components/Disclaimer/index.tsx
+import cssModule from "./styles.module.css";
 import { jsx, jsxs } from "react/jsx-runtime";
 var Disclaimer = ({
   content,
@@ -43,7 +39,7 @@ var Disclaimer = ({
     if (isOnProp !== void 0) return;
     setInternalIsOn(false);
   };
-  const c = clss(disclaimer, { cssModule: styles_default });
+  const c = clss(disclaimer, { cssModule });
   const rootClss = mergeClassNames(
     c(null, {
       on: isOn,

package/chunks/{chunk-AS4CIZVE.js → chunk-ZJNQRKEJ.js}

@@ -1,6 +1,6 @@
 import {
   theatre
-} from "./chunk-3DNVFA25.js";
+} from "./chunk-IEZ3O5OF.js";
 import {
   clss
 } from "./chunk-TRFZSKNB.js";
@@ -14,11 +14,7 @@ import {
   useState,
   useRef
 } from "react";
-
-// src/components/Theatre/styles.module.css
-var styles_default = {};
-
-// src/components/Theatre/index.tsx
+import cssModule from "./styles.module.css";
 import { jsx, jsxs } from "react/jsx-runtime";
 var Theatre = ({
   closeBtnContent,
@@ -66,7 +62,7 @@ var Theatre = ({
     window.addEventListener("keydown", listener);
     return () => window.removeEventListener("keydown", listener);
   }, [exitOnEscape, isTheatreOn, isOn]);
-  const c = clss(theatre, { cssModule: styles_default });
+  const c = clss(theatre, { cssModule });
   const rootClss = mergeClassNames(c(null, {
     "on": isTheatreOn,
     "off": !isTheatreOn

package/components/BeforeAfter/index.js

@@ -3,7 +3,7 @@ import {
 } from "../../chunks/chunk-OSAXBA7G.js";
 import {
   beforeAfter
-} from "../../chunks/chunk-3DNVFA25.js";
+} from "../../chunks/chunk-IEZ3O5OF.js";
 import {
   clss
 } from "../../chunks/chunk-TRFZSKNB.js";
@@ -24,9 +24,7 @@ import {
   useCallback,
   useRef
 } from "react";
-
-// src/components/BeforeAfter/styles.module.css
-var styles_default = {};
+import cssModule from "./styles.module.css";
 
 // src/components/BeforeAfter/utils.ts
 function getRelativePointerCoordinates(event, element) {
@@ -95,7 +93,7 @@ var BeforeAfterControlled = ({
     [`--${beforeAfter}-ratio`]: outputRatio.toFixed(8),
     [`--${beforeAfter}-ratio-percent`]: `${(outputRatio * 100).toString()}%`
   };
-  const c = clss(beforeAfter, { cssModule: styles_default });
+  const c = clss(beforeAfter, { cssModule });
   const rootClss = mergeClassNames(c(null, _modifiers), className);
   const rootAttributes = {
     "data-ratio": ratio

package/components/Disclaimer/index.js

@@ -1,7 +1,7 @@
 import {
   Disclaimer
-} from "../../chunks/chunk-OEVSF7D3.js";
-import "../../chunks/chunk-3DNVFA25.js";
+} from "../../chunks/chunk-XFB4PUXO.js";
+import "../../chunks/chunk-IEZ3O5OF.js";
 import "../../chunks/chunk-TRFZSKNB.js";
 import "../../chunks/chunk-OFCSIK6J.js";
 import "../../chunks/chunk-WSFCRVEQ.js";

package/components/Drawer/index.js

@@ -1,9 +1,9 @@
 import {
   ResizeObserverComponent
-} from "../../chunks/chunk-UVG2S54P.js";
+} from "../../chunks/chunk-GG4EFNMU.js";
 import {
   drawer
-} from "../../chunks/chunk-3DNVFA25.js";
+} from "../../chunks/chunk-IEZ3O5OF.js";
 import {
   clss
 } from "../../chunks/chunk-TRFZSKNB.js";
@@ -18,11 +18,7 @@ import {
   useRef,
   useEffect
 } from "react";
-
-// src/components/Drawer/styles.module.css
-var styles_default = {};
-
-// src/components/Drawer/index.tsx
+import cssModule from "./styles.module.css";
 import { jsx, jsxs } from "react/jsx-runtime";
 var Drawer = ({
   openerContent,
@@ -54,7 +50,7 @@ var Drawer = ({
     const { width: width2, height: height2 } = entry?.contentRect ?? {};
     setContentDimensions({ width: width2, height: height2 });
   };
-  const c = clss(drawer, { cssModule: styles_default });
+  const c = clss(drawer, { cssModule });
   const rootClss = mergeClassNames(c(null, {
     "opened": isOpened,
     "closed": !isOpened

package/components/EventListener/index.js

@@ -1,6 +1,6 @@
 import {
   eventListener
-} from "../../chunks/chunk-3DNVFA25.js";
+} from "../../chunks/chunk-IEZ3O5OF.js";
 import {
   clss
 } from "../../chunks/chunk-TRFZSKNB.js";
@@ -14,11 +14,7 @@ import {
   useRef,
   useEffect
 } from "react";
-
-// src/components/EventListener/styles.module.css
-var styles_default = {};
-
-// src/components/EventListener/index.tsx
+import cssModule from "./styles.module.css";
 import { jsx } from "react/jsx-runtime";
 var EventListenerComponent = ({
   className,
@@ -36,7 +32,7 @@ var EventListenerComponent = ({
     elements.forEach((e) => typeArr.forEach((t) => e.addEventListener(t, onEvent)));
     return () => elements.forEach((e) => typeArr.forEach((t) => e.removeEventListener(t, onEvent)));
   }, [targetSelector, type, onEvent]);
-  const c = clss(eventListener, { cssModule: styles_default });
+  const c = clss(eventListener, { cssModule });
   const rootClss = mergeClassNames(c(), className);
   return /* @__PURE__ */ jsx(
     "div",

package/components/Gallery/index.js

@@ -1,6 +1,6 @@
 import {
   gallery
-} from "../../chunks/chunk-3DNVFA25.js";
+} from "../../chunks/chunk-IEZ3O5OF.js";
 import {
   clss
 } from "../../chunks/chunk-TRFZSKNB.js";
@@ -29,16 +29,8 @@ var forceActivateSlot = (div, targetPos, smooth = true) => {
   div.scrollTo({ left: offset, behavior: smooth ? "smooth" : "instant" });
 };
 
-// src/components/Gallery/styles.module.css
-var styles_default = {
-  scroller: "styles_scroller",
-  root: "styles_root2",
-  "root--controlled": "styles_root--controlled",
-  "root--no-snap": "styles_root--no-snap",
-  slot: "styles_slot"
-};
-
 // src/components/Gallery/index.tsx
+import cssModule from "./styles.module.css";
 import { jsx, jsxs } from "react/jsx-runtime";
 var Gallery = ({
   paddingLeft,
@@ -120,7 +112,7 @@ var Gallery = ({
     if (active === void 0) return;
     forceActivateSlot(scrollerRef.current, active);
   }, [active]);
-  const c = clss(gallery, { cssModule: styles_default });
+  const c = clss(gallery, { cssModule });
   const rootClss = mergeClassNames(
     c(null, {
       "controlled": active !== void 0,

package/components/Image/index.js

@@ -1,12 +1,12 @@
 import {
   Theatre
-} from "../../chunks/chunk-AS4CIZVE.js";
+} from "../../chunks/chunk-ZJNQRKEJ.js";
 import {
   Disclaimer
-} from "../../chunks/chunk-OEVSF7D3.js";
+} from "../../chunks/chunk-XFB4PUXO.js";
 import {
   image
-} from "../../chunks/chunk-3DNVFA25.js";
+} from "../../chunks/chunk-IEZ3O5OF.js";
 import {
   clss
 } from "../../chunks/chunk-TRFZSKNB.js";
@@ -21,11 +21,7 @@ import {
   useMemo,
   useCallback
 } from "react";
-
-// src/components/Image/styles.module.css
-var styles_default = {};
-
-// src/components/Image/index.tsx
+import cssModule from "./styles.module.css";
 import { jsx, jsxs } from "react/jsx-runtime";
 var Image = ({
   sources,
@@ -54,7 +50,7 @@ var Image = ({
     disclaimer?.actionHandlers?.dismissClick?.(isDisclaimerOn);
     setIsDisclaimerOn(false);
   }, []);
-  const c = clss(image, { cssModule: styles_default });
+  const c = clss(image, { cssModule });
   const rootClss = mergeClassNames(c(), className);
   const rootAttributes = {};
   const pictureClss = c("picture");

package/components/IntersectionObserver/index.js

@@ -1,7 +1,7 @@
 import {
   IntersectionObserverComponent
-} from "../../chunks/chunk-SPC2SMZR.js";
-import "../../chunks/chunk-3DNVFA25.js";
+} from "../../chunks/chunk-F2YJXIT7.js";
+import "../../chunks/chunk-IEZ3O5OF.js";
 import "../../chunks/chunk-TRFZSKNB.js";
 import "../../chunks/chunk-OFCSIK6J.js";
 import "../../chunks/chunk-WSFCRVEQ.js";

package/components/Overlayer/index.d.ts

@@ -0,0 +1,59 @@
+import { type FunctionComponent, type PropsWithChildren, type ReactNode } from 'react';
+import type { WithClassName } from '../utils/types.js';
+/**
+ * Describes a single overlay positioned over the base content.
+ *
+ * @property content - React node rendered inside the overlay element.
+ * If falsy, the overlay is not rendered.
+ * @property xPercent - Horizontal position of the overlay anchor as a percentage
+ * of the root element's width. Defaults to `0`.
+ * @property yPercent - Vertical position of the overlay anchor as a percentage
+ * of the root element's height. Defaults to `0`.
+ * @property justify - Controls the horizontal alignment of the overlay relative
+ * to its anchor point via a CSS `translateX`:
+ * - `'left'` — anchor is at the left edge of the overlay (`0%`).
+ * - `'center'` — anchor is at the horizontal center (`-50%`). Default when omitted.
+ * - `'right'` — anchor is at the right edge (`-100%`).
+ * - `number` — arbitrary percentage offset (e.g. `25` produces `-25%`).
+ */
+type Overlay = {
+    content?: ReactNode;
+    xPercent?: number;
+    yPercent?: number;
+    justify?: 'left' | 'center' | 'right' | number;
+};
+/**
+ * Props for the {@link Overlayer} component.
+ *
+ * @property overlays - Array of {@link Overlay} descriptors rendered on top of
+ * the base content. Overlays with falsy `content` are skipped.
+ * @property className - Optional additional class name(s) applied to the root element.
+ * @property children - Content rendered in the base layer, below all overlays.
+ */
+export type Props = PropsWithChildren<WithClassName<{
+    overlays?: Overlay[];
+}>>;
+/**
+ * Absolute positioning overlay component. Renders a base content layer and
+ * stacks one or more overlays on top of it, each independently positioned via
+ * percentage coordinates and a justify alignment.
+ *
+ * ### Child elements
+ * - `__base` — wrapping `<div>` that contains `children`.
+ * - `__overlay` — one `<div>` per entry in `overlays` (falsy `content` entries
+ * are omitted).
+ *
+ * ### CSS custom properties on each overlay element
+ * - `--PRIVATE-left` — derived from `xPercent` (e.g. `42%`). Used internally
+ * to set the horizontal anchor position.
+ * - `--PRIVATE-top` — derived from `yPercent` (e.g. `10%`). Used internally
+ * to set the vertical anchor position.
+ * - `--PRIVATE-translate-x` — derived from `justify`. Used internally to shift
+ * the overlay relative to its anchor.
+ *
+ * @param props - Component properties.
+ * @see {@link Props}
+ * @returns A root `<div>` containing the base layer and all positioned overlay elements.
+ */
+export declare const Overlayer: FunctionComponent<Props>;
+export {};

package/components/Overlayer/index.js

@@ -0,0 +1,67 @@
+import {
+  isFalsy
+} from "../../chunks/chunk-QXAJXTXV.js";
+import "../../chunks/chunk-HC6ZOHCS.js";
+import {
+  overlayer
+} from "../../chunks/chunk-IEZ3O5OF.js";
+import {
+  clss
+} from "../../chunks/chunk-TRFZSKNB.js";
+import {
+  mergeClassNames
+} from "../../chunks/chunk-OFCSIK6J.js";
+import "../../chunks/chunk-WSFCRVEQ.js";
+
+// src/components/Overlayer/index.tsx
+import cssModule from "./styles.module.css";
+import { jsx, jsxs } from "react/jsx-runtime";
+var Overlayer = ({
+  overlays,
+  children,
+  className
+}) => {
+  const c = clss(overlayer, { cssModule });
+  const rootClss = mergeClassNames(c(), className);
+  const baseClss = c("base");
+  return /* @__PURE__ */ jsxs("div", { className: rootClss, children: [
+    /* @__PURE__ */ jsx("div", { className: baseClss, children }),
+    overlays?.map(({
+      content,
+      xPercent = 0,
+      yPercent = 0,
+      justify
+    }) => {
+      const overlayClss = c("overlay");
+      let computedTranslateX;
+      if (typeof justify === "number") {
+        computedTranslateX = `-${justify}%`;
+      } else if (justify === "center") {
+        computedTranslateX = "-50%";
+      } else if (justify === "left") {
+        computedTranslateX = "0%";
+      } else if (justify === "right") {
+        computedTranslateX = "-100%";
+      } else {
+        computedTranslateX = "-50%";
+      }
+      const overlayCustomProps = {
+        "--PRIVATE-left": `${xPercent}%`,
+        "--PRIVATE-top": `${yPercent}%`,
+        "--PRIVATE-translate-x": computedTranslateX
+      };
+      if (isFalsy(content)) return null;
+      return /* @__PURE__ */ jsx(
+        "div",
+        {
+          className: overlayClss,
+          style: overlayCustomProps,
+          children: content
+        }
+      );
+    })
+  ] });
+};
+export {
+  Overlayer
+};

package/components/Paginator/index.js

@@ -1,7 +1,7 @@
 import {
   Paginator
-} from "../../chunks/chunk-3K4JD65D.js";
-import "../../chunks/chunk-3DNVFA25.js";
+} from "../../chunks/chunk-AC4UMIWM.js";
+import "../../chunks/chunk-IEZ3O5OF.js";
 import "../../chunks/chunk-TRFZSKNB.js";
 import "../../chunks/chunk-OFCSIK6J.js";
 import "../../chunks/chunk-WSFCRVEQ.js";

package/components/ResizeObserver/index.js

@@ -1,7 +1,7 @@
 import {
   ResizeObserverComponent
-} from "../../chunks/chunk-UVG2S54P.js";
-import "../../chunks/chunk-3DNVFA25.js";
+} from "../../chunks/chunk-GG4EFNMU.js";
+import "../../chunks/chunk-IEZ3O5OF.js";
 import "../../chunks/chunk-TRFZSKNB.js";
 import "../../chunks/chunk-OFCSIK6J.js";
 import "../../chunks/chunk-WSFCRVEQ.js";