@design-edito/tools 0.4.0 → 0.4.2

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-QDHET2TE.js → chunk-HYGUIF2O.js}

@@ -1,6 +1,6 @@
 import {
   SmartTags
-} from "./chunk-FCABYQRX.js";
+} from "./chunk-MSU7JU63.js";
 import {
   makeSuccess
 } from "./chunk-LUAYN7VJ.js";
@@ -12,7 +12,10 @@ var array = SmartTags.makeSmartTag({
   isolationInitType: "array",
   mainValueCheck: (m) => makeSuccess(m),
   argsValueCheck: (a) => makeSuccess(a),
-  func: (main, args) => makeSuccess([main, ...args])
+  func: (main, args) => {
+    if (main === void 0) return makeSuccess([...args]);
+    return makeSuccess([main, ...args]);
+  }
 });
 
 export {

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-4STX5SQX.js → chunk-LEBGVBYD.js}

@@ -38,7 +38,7 @@ var Transformer = class _Transformer {
     let argsValue;
     if (mode === "isolation") {
       if (Array.isArray(innerValue)) {
-        mainValue = innerValue.at(0) ?? [];
+        mainValue = innerValue.at(0);
         argsValue = innerValue.slice(1);
       } else {
         mainValue = innerValue;
@@ -113,7 +113,14 @@ var Transformer = class _Transformer {
       argsChecked.error.position
     ));
     const validArgsValue = argsChecked.payload;
-    const called = func(validMainValue, validArgsValue, { name: this.name, sourceTree: this.sourceTree });
+    const called = func(
+      validMainValue,
+      validArgsValue,
+      {
+        name: this.name,
+        sourceTree: this.sourceTree
+      }
+    );
     if (!called.success) return makeFailure(makeTransformationError(
       mainValue,
       argsValue,

package/chunks/{chunk-FCABYQRX.js → chunk-MSU7JU63.js}

@@ -1,9 +1,13 @@
 import {
   Transformer
-} from "./chunk-4STX5SQX.js";
+} from "./chunk-LEBGVBYD.js";
 import {
   Method
 } from "./chunk-RW7VAKJW.js";
+import {
+  makeFailure,
+  makeSuccess
+} from "./chunk-LUAYN7VJ.js";
 
 // src/agnostic/html/hyper-json/smart-tags/index.ts
 var SmartTags;
@@ -30,6 +34,14 @@ var SmartTags;
     }];
   }
   SmartTags2.makeSmartTag = makeSmartTag;
+  const isNotUndefined = (value) => value !== void 0;
+  SmartTags2.expectNotUndef = (value) => {
+    if (isNotUndefined(value)) return makeSuccess(value);
+    return makeFailure({
+      expected: "value",
+      found: "undefined"
+    });
+  };
 })(SmartTags || (SmartTags = {}));
 
 export {

package/chunks/{chunk-H4KLHV6B.js → chunk-O32IRXDX.js}

@@ -1,6 +1,6 @@
 import {
   Transformer
-} from "./chunk-4STX5SQX.js";
+} from "./chunk-LEBGVBYD.js";
 import {
   Method
 } from "./chunk-RW7VAKJW.js";

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-DU6U226H.js → chunk-RJRNYRPM.js}

@@ -1,6 +1,6 @@
 import {
   SmartTags
-} from "./chunk-FCABYQRX.js";
+} from "./chunk-MSU7JU63.js";
 import {
   makeSuccess
 } from "./chunk-LUAYN7VJ.js";
@@ -13,7 +13,7 @@ var any = SmartTags.makeSmartTag({
   mainValueCheck: (m) => makeSuccess(m),
   argsValueCheck: (a) => makeSuccess(a),
   func: (main, args) => {
-    if (args.length === 0) return makeSuccess(main);
+    if (main === void 0) return makeSuccess([...args]);
     return makeSuccess([main, ...args]);
   }
 });

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";

package/components/Scrllgngn/index.js

@@ -1,19 +1,19 @@
 import {
   Paginator
-} from "../../chunks/chunk-3K4JD65D.js";
+} from "../../chunks/chunk-AC4UMIWM.js";
 import {
   randomHash
 } from "../../chunks/chunk-75BICI4L.js";
 import "../../chunks/chunk-OGBUSUE6.js";
-import {
-  IntersectionObserverComponent
-} from "../../chunks/chunk-SPC2SMZR.js";
 import {
   ResizeObserverComponent
-} from "../../chunks/chunk-UVG2S54P.js";
+} from "../../chunks/chunk-GG4EFNMU.js";
+import {
+  IntersectionObserverComponent
+} from "../../chunks/chunk-F2YJXIT7.js";
 import {
   scrllgngn
-} from "../../chunks/chunk-3DNVFA25.js";
+} from "../../chunks/chunk-IEZ3O5OF.js";
 import {
   clss
 } from "../../chunks/chunk-TRFZSKNB.js";
@@ -27,24 +27,7 @@ import {
   useState,
   useEffect
 } from "react";
-
-// src/components/Scrllgngn/styles.module.css
-var styles_default = {
-  root: "styles_root",
-  "back-blocks": "styles_back-blocks",
-  "scrolling-content": "styles_scrolling-content",
-  "front-blocks": "styles_front-blocks",
-  "root--top-visible": "styles_root--top-visible",
-  "root--content-visible": "styles_root--content-visible",
-  "root--force-stick-blocks-before": "styles_root--force-stick-blocks-before",
-  "root--force-stick-blocks-both": "styles_root--force-stick-blocks-both",
-  "root--bottom-visible": "styles_root--bottom-visible",
-  "root--force-stick-blocks-after": "styles_root--force-stick-blocks-after",
-  "back-block": "styles_back-block",
-  "front-block": "styles_front-block"
-};
-
-// src/components/Scrllgngn/index.tsx
+import cssModule from "./styles.module.css";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 var Scrllgngn = ({
   pages,
@@ -113,7 +96,7 @@ var Scrllgngn = ({
   const handleResize = ({ boundingClientRect }) => {
     if (partialBoundingRect === void 0 || boundingClientRect.left !== partialBoundingRect.left || boundingClientRect.right !== partialBoundingRect.right || boundingClientRect.height !== partialBoundingRect.height || boundingClientRect.width !== partialBoundingRect.width) setPartialBoundingRect(boundingClientRect);
   };
-  const c = clss(scrllgngn, { cssModule: styles_default });
+  const c = clss(scrllgngn, { cssModule });
   const rootClss = mergeClassNames(
     c(null, {
       "top-visible": topVisible,