@dotss/tictoccroc 0.4.2 → 0.5.0

package/dist/shared/components/Masonry/Masonry.utils.mjs

@@ -1,85 +1,66 @@
-import { Children as M, isValidElement as y } from "react";
-import I from "../Image/Image.mjs";
-import "react/jsx-runtime";
-import "@dotss/ui";
-import "@dotss/ui/core/useTheme";
-function S(n, l, e, f) {
-  const t = Array.from({ length: e }, () => []), g = new Map(n.map((o) => [o.originalSrc ?? o.src, o])), h = Array(e).fill(0), a = Array.from({ length: e }, (o, c) => c);
-  return l.forEach((o) => {
-    var i;
-    const c = ((i = w(o.props.children)) == null ? void 0 : i.props.src) || "", p = g.get(c), d = a[0];
-    t[d].push(o), h[d] += (p == null ? void 0 : p.width) ?? o.props.width ?? f;
-    let s = 1;
-    const r = h[d];
-    for (; s < a.length && h[a[s]] < r; )
-      a[s - 1] = a[s], s += 1;
-    a[s - 1] = d;
-  }), t;
+import e from "../Image/index.mjs";
+import { Children as t, isValidElement as n } from "react";
+//#region shared/components/Masonry/Masonry.utils.ts
+function r(e, t, n, r) {
+	let i = Array.from({ length: n }, () => []), a = new Map(e.map((e) => [e.originalSrc ?? e.src, e])), s = Array(n).fill(0), c = Array.from({ length: n }, (e, t) => t);
+	return t.forEach((e) => {
+		let t = o(e.props.children)?.props.src || "", n = a.get(t), l = c[0];
+		i[l].push(e), s[l] += n?.width ?? e.props.width ?? r;
+		let u = 1, d = s[l];
+		for (; u < c.length && s[c[u]] < d;) c[u - 1] = c[u], u += 1;
+		c[u - 1] = l;
+	}), i;
 }
-function Y(n, l, e) {
-  const f = n.getBoundingClientRect(), t = (f.left + f.right) / 2, g = (f.top + f.bottom) / 2;
-  let h = null, a = 1 / 0;
-  for (const o of e) {
-    if (!o || o === n) continue;
-    const c = o.getBoundingClientRect(), p = (c.left + c.right) / 2, d = (c.top + c.bottom) / 2, s = p - t, r = d - g, i = Math.abs(r) < c.height * 0.75, u = Math.abs(s) < c.width * 0.75, m = l === "right" && s > 0 && i || l === "left" && s < 0 && i || l === "down" && r > 0 && u || l === "up" && r < 0 && u, b = Math.hypot(s, r);
-    m && b < a && (a = b, h = o);
-  }
-  return h;
+function i(e, t, n) {
+	let r = e.getBoundingClientRect(), i = (r.left + r.right) / 2, a = (r.top + r.bottom) / 2, o = null, s = Infinity;
+	for (let r of n) {
+		if (!r || r === e) continue;
+		let n = r.getBoundingClientRect(), c = (n.left + n.right) / 2, l = (n.top + n.bottom) / 2, u = c - i, d = l - a, f = Math.abs(d) < n.height * .75, p = Math.abs(u) < n.width * .75, m = t === "right" && u > 0 && f || t === "left" && u < 0 && f || t === "down" && d > 0 && p || t === "up" && d < 0 && p, h = Math.hypot(u, d);
+		m && h < s && (s = h, o = r);
+	}
+	return o;
 }
-function z(n, l, e) {
-  var c, p, d, s;
-  if (!n.length || l < 0) return null;
-  const f = n.length;
-  let t = -1, g = -1;
-  for (let r = 0; r < f; r++) {
-    for (let i = 0; i < n[r].length; i++) {
-      const u = n[r][i];
-      if (Number(u == null ? void 0 : u.getAttribute("aria-posinset")) - 1 === l) {
-        t = r, g = i;
-        break;
-      }
-    }
-    if (t !== -1) break;
-  }
-  if (t === -1 || g === -1) return null;
-  const a = n[t][g].getBoundingClientRect(), o = (a.left + a.right) / 2;
-  if (e === "left" && g > 0)
-    return Number((c = n[t][g - 1]) == null ? void 0 : c.getAttribute("aria-posinset")) - 1;
-  if (e === "right" && g < n[t].length - 1)
-    return Number((p = n[t][g + 1]) == null ? void 0 : p.getAttribute("aria-posinset")) - 1;
-  if (e === "up" && t > 0) {
-    const r = n[t - 1];
-    let i = 0, u = 1 / 0;
-    return r.forEach((m, b) => {
-      const R = m.getBoundingClientRect(), C = (R.left + R.right) / 2, A = Math.abs(o - C);
-      A < u && (u = A, i = b);
-    }), Number((d = r[i]) == null ? void 0 : d.getAttribute("aria-posinset")) - 1;
-  }
-  if (e === "down" && t < f - 1) {
-    const r = n[t + 1];
-    let i = 0, u = 1 / 0;
-    return r.forEach((m, b) => {
-      const R = m.getBoundingClientRect(), C = (R.left + R.right) / 2, A = Math.abs(o - C);
-      A < u && (u = A, i = b);
-    }), Number((s = r[i]) == null ? void 0 : s.getAttribute("aria-posinset")) - 1;
-  }
-  return null;
+function a(e, t, n) {
+	if (!e.length || t < 0) return null;
+	let r = e.length, i = -1, a = -1;
+	for (let n = 0; n < r; n++) {
+		for (let r = 0; r < e[n].length; r++) {
+			let o = e[n][r];
+			if (Number(o?.getAttribute("aria-posinset")) - 1 === t) {
+				i = n, a = r;
+				break;
+			}
+		}
+		if (i !== -1) break;
+	}
+	if (i === -1 || a === -1) return null;
+	let o = e[i][a].getBoundingClientRect(), s = (o.left + o.right) / 2;
+	if (n === "left" && a > 0) return Number(e[i][a - 1]?.getAttribute("aria-posinset")) - 1;
+	if (n === "right" && a < e[i].length - 1) return Number(e[i][a + 1]?.getAttribute("aria-posinset")) - 1;
+	if (n === "up" && i > 0) {
+		let t = e[i - 1], n = 0, r = Infinity;
+		return t.forEach((e, t) => {
+			let i = e.getBoundingClientRect(), a = (i.left + i.right) / 2, o = Math.abs(s - a);
+			o < r && (r = o, n = t);
+		}), Number(t[n]?.getAttribute("aria-posinset")) - 1;
+	}
+	if (n === "down" && i < r - 1) {
+		let t = e[i + 1], n = 0, r = Infinity;
+		return t.forEach((e, t) => {
+			let i = e.getBoundingClientRect(), a = (i.left + i.right) / 2, o = Math.abs(s - a);
+			o < r && (r = o, n = t);
+		}), Number(t[n]?.getAttribute("aria-posinset")) - 1;
+	}
+	return null;
 }
-function w(n) {
-  const l = M.toArray(n).filter(y).find((e) => e.type === I || e.type === "img");
-  if (l)
-    return l;
-  for (const e of M.toArray(n))
-    if (y(e) && e.props && e.props.children) {
-      const f = M.toArray(e.props.children).filter(y).find((t) => t.type === I || t.type === "img");
-      if (f)
-        return f;
-    }
-  return null;
+function o(r) {
+	let i = t.toArray(r).filter(n).find((t) => t.type === e || t.type === "img");
+	if (i) return i;
+	for (let i of t.toArray(r)) if (n(i) && i.props && i.props.children) {
+		let r = t.toArray(i.props.children).filter(n).find((t) => t.type === e || t.type === "img");
+		if (r) return r;
+	}
+	return null;
 }
-export {
-  w as findImageInChildren,
-  Y as findNextFocusableElement,
-  S as getHorizontalLayoutRows,
-  z as getNextIndexHorizontalFromRows
-};
+//#endregion
+export { o as findImageInChildren, i as findNextFocusableElement, r as getHorizontalLayoutRows, a as getNextIndexHorizontalFromRows };

package/dist/shared/components/Masonry/MasonryBlock/MasonryBlock.mjs

@@ -1,144 +1,111 @@
-import { jsxs as E, jsx as b } from "react/jsx-runtime";
-import { forwardRef as q, useMemo as D, useState as v, useRef as V, useImperativeHandle as $, useEffect as k, Children as z, isValidElement as G, cloneElement as J } from "react";
-import { Flexbox as g, Skeleton as K } from "@dotss/ui";
-import O from "@dotss/ui/core/useTheme";
-import P from "../../Image/Image.mjs";
-import { findImageInChildren as Q } from "../Masonry.utils.mjs";
-import U from "../../../hooks/useIsomorphicLayoutEffect/useIsomorphicLayoutEffect.mjs";
-const a = q(
-  ({
-    children: u,
-    width: h = 0,
-    height: p = 0,
-    spacing: w = 2,
-    borderRadius: d = 0,
-    direction: C = "vertical",
-    setInnerRef: t,
-    sourceMetadataMap: S,
-    onLoad: T,
-    onManualLoad: l,
-    ...e
-  }, x) => {
-    const { spacing: j } = O(), r = D(() => {
-      var n, f;
-      return ((f = (n = Q(u)) == null ? void 0 : n.props) == null ? void 0 : f.src) ?? "";
-    }, [u]), i = S == null ? void 0 : S.get(r), [s, H] = v((i == null ? void 0 : i.width) ?? h ?? 0), [c, W] = v((i == null ? void 0 : i.height) ?? p ?? 0), [A, y] = v(!1), o = V(null), m = !r || !!r && A;
-    $(x, () => o.current);
-    const B = (n) => {
-      n.propertyName !== "padding-top" && n.propertyName !== "padding-left" || y(!0);
-    }, F = () => y(!0);
-    return U(() => {
-      if (!(i != null && i.loaded) && o.current && r) {
-        const n = o.current.querySelector("img");
-        if (!n || !n.complete) return;
-        const { naturalWidth: f, naturalHeight: I, src: N } = n;
-        l == null || l(f, I, N);
-      }
-    }, [r, i == null ? void 0 : i.loaded, l]), k(() => {
-      H((i == null ? void 0 : i.width) ?? h ?? 0), W((i == null ? void 0 : i.height) ?? p ?? 0);
-    }, [h, p, i == null ? void 0 : i.width, i == null ? void 0 : i.height]), k(() => {
-      if (!(i != null && i.loaded) || (i == null ? void 0 : i.width) !== s || (i == null ? void 0 : i.height) !== c) return;
-      const n = setTimeout(() => y(!0), 300);
-      return () => clearTimeout(n);
-    }, [i, s, c]), k(() => {
-      t == null || t(o.current);
-    }, [t]), /* @__PURE__ */ E(
-      g,
-      {
-        ref: o,
-        flexDirection: "column",
-        ...e,
-        inlineCSS: {
-          contain: "content",
-          transform: "translate3d(0, 0, 0)",
-          breakInside: "avoid",
-          ...e == null ? void 0 : e.inlineCSS
-        },
-        children: [
-          C === "vertical" && /* @__PURE__ */ b(
-            g,
-            {
-              inlineCSS: {
-                minHeight: j.content(w)
-              }
-            }
-          ),
-          /* @__PURE__ */ E(
-            g,
-            {
-              onTransitionEnd: B,
-              inlineCSS: {
-                position: "relative",
-                overflow: "hidden",
-                scrollbarWidth: "none",
-                borderRadius: d,
-                "&::-webkit-scrollbar": {
-                  display: "none"
-                },
-                ...e == null ? void 0 : e.inlineCSS
-              },
-              style: C === "vertical" ? {
-                paddingTop: `calc(${c / s} * 100%)`,
-                transition: "padding-top 0.3s"
-              } : {
-                paddingLeft: s,
-                paddingTop: c,
-                transition: "padding-top 0.3s, padding-left 0.3s"
-              },
-              children: [
-                /* @__PURE__ */ b(
-                  g,
-                  {
-                    inlineCSS: {
-                      position: "absolute",
-                      top: 0,
-                      left: 0,
-                      width: "100%",
-                      height: "100%",
-                      opacity: m ? 1 : 0,
-                      transition: "opacity 0.3s"
-                    },
-                    style: {
-                      borderRadius: d > 0 ? d : 0
-                    },
-                    children: z.toArray(u).filter(G).map((n) => n.type === P || n.type === "img" ? J(n, {
-                      width: i == null ? void 0 : i.originWidth,
-                      draggable: !1,
-                      style: {
-                        objectFit: "cover",
-                        ...n.props.style
-                      },
-                      ...n.props,
-                      enableFallback: !0,
-                      onLoad: T,
-                      onError: F
-                    }) : n)
-                  }
-                ),
-                /* @__PURE__ */ b(
-                  K,
-                  {
-                    borderRadius: 0,
-                    inlineCSS: {
-                      position: "absolute",
-                      top: 0,
-                      left: 0,
-                      width: "100%",
-                      height: "100%",
-                      opacity: m ? 0 : 1,
-                      transition: "opacity 0.3s",
-                      pointerEvents: m ? "none" : void 0
-                    }
-                  }
-                )
-              ]
-            }
-          )
-        ]
-      }
-    );
-  }
-);
-export {
-  a as default
-};
+import e from "../../../hooks/useIsomorphicLayoutEffect/index.mjs";
+import t from "../../Image/index.mjs";
+import { findImageInChildren as n } from "../Masonry.utils.mjs";
+import { Children as r, cloneElement as i, forwardRef as a, isValidElement as o, useEffect as s, useImperativeHandle as c, useMemo as l, useRef as u, useState as d } from "react";
+import { Flexbox as f, Skeleton as p } from "@dotss/ui";
+import m from "@dotss/ui/core/useTheme";
+import { jsx as h, jsxs as g } from "react/jsx-runtime";
+//#region shared/components/Masonry/MasonryBlock/MasonryBlock.tsx
+var _ = a(({ children: a, width: _ = 0, height: v = 0, spacing: y = 2, borderRadius: b = 0, direction: x = "vertical", setInnerRef: S, sourceMetadataMap: C, onLoad: w, onManualLoad: T, ...E }, D) => {
+	let { spacing: O } = m(), k = l(() => n(a)?.props?.src ?? "", [a]), A = C?.get(k), [j, M] = d(A?.width ?? _ ?? 0), [N, P] = d(A?.height ?? v ?? 0), [F, I] = d(!1), L = u(null), R = !k || !!k && F;
+	c(D, () => L.current);
+	let z = (e) => {
+		e.propertyName !== "padding-top" && e.propertyName !== "padding-left" || I(!0);
+	}, B = () => I(!0);
+	return e(() => {
+		if (!A?.loaded && L.current && k) {
+			let e = L.current.querySelector("img");
+			if (!e || !e.complete) return;
+			let { naturalWidth: t, naturalHeight: n, src: r } = e;
+			T?.(t, n, r);
+		}
+	}, [
+		k,
+		A?.loaded,
+		T
+	]), s(() => {
+		M(A?.width ?? _ ?? 0), P(A?.height ?? v ?? 0);
+	}, [
+		_,
+		v,
+		A?.width,
+		A?.height
+	]), s(() => {
+		if (!A?.loaded || A?.width !== j || A?.height !== N) return;
+		let e = setTimeout(() => I(!0), 300);
+		return () => clearTimeout(e);
+	}, [
+		A,
+		j,
+		N
+	]), s(() => {
+		S?.(L.current);
+	}, [S]), /* @__PURE__ */ g(f, {
+		ref: L,
+		flexDirection: "column",
+		...E,
+		inlineCSS: {
+			contain: "content",
+			transform: "translate3d(0, 0, 0)",
+			breakInside: "avoid",
+			...E?.inlineCSS
+		},
+		children: [x === "vertical" && /* @__PURE__ */ h(f, { inlineCSS: { minHeight: O.content(y) } }), /* @__PURE__ */ g(f, {
+			onTransitionEnd: z,
+			inlineCSS: {
+				position: "relative",
+				overflow: "hidden",
+				scrollbarWidth: "none",
+				borderRadius: b,
+				"&::-webkit-scrollbar": { display: "none" },
+				...E?.inlineCSS
+			},
+			style: x === "vertical" ? {
+				paddingTop: `calc(${N / j} * 100%)`,
+				transition: "padding-top 0.3s"
+			} : {
+				paddingLeft: j,
+				paddingTop: N,
+				transition: "padding-top 0.3s, padding-left 0.3s"
+			},
+			children: [/* @__PURE__ */ h(f, {
+				inlineCSS: {
+					position: "absolute",
+					top: 0,
+					left: 0,
+					width: "100%",
+					height: "100%",
+					opacity: +!!R,
+					transition: "opacity 0.3s"
+				},
+				style: { borderRadius: b > 0 ? b : 0 },
+				children: r.toArray(a).filter(o).map((e) => e.type === t || e.type === "img" ? i(e, {
+					width: A?.originWidth,
+					draggable: !1,
+					style: {
+						objectFit: "cover",
+						...e.props.style
+					},
+					...e.props,
+					enableFallback: !0,
+					onLoad: w,
+					onError: B
+				}) : e)
+			}), /* @__PURE__ */ h(p, {
+				borderRadius: 0,
+				inlineCSS: {
+					position: "absolute",
+					top: 0,
+					left: 0,
+					width: "100%",
+					height: "100%",
+					opacity: +!R,
+					transition: "opacity 0.3s",
+					pointerEvents: R ? "none" : void 0
+				}
+			})]
+		})]
+	});
+});
+//#endregion
+export { _ as default };

package/dist/shared/components/Masonry/MasonryBlock/index.mjs

@@ -1,4 +1,5 @@
-import r from "./MasonryBlock.mjs";
-export {
-  r as default
-};
+import e from "./MasonryBlock.mjs";
+//#region shared/components/Masonry/MasonryBlock/index.ts
+var t = e;
+//#endregion
+export { t as default };

package/dist/shared/components/Masonry/index.mjs

@@ -1,6 +1,6 @@
-import r from "./Masonry.mjs";
-import { default as e } from "./MasonryBlock/MasonryBlock.mjs";
-export {
-  e as MasonryBlock,
-  r as default
-};
+import e from "./MasonryBlock/index.mjs";
+import t from "./Masonry.mjs";
+//#region shared/components/Masonry/index.ts
+var n = t;
+//#endregion
+export { e as MasonryBlock, n as default };

package/dist/shared/components/MediaDialog/MediaBlock/MediaBlock.mjs

@@ -1,70 +1,55 @@
-import { jsxs as p, jsx as d } from "react/jsx-runtime";
-import { useState as S, Children as u, isValidElement as y, cloneElement as x } from "react";
-import { Flexbox as b } from "@dotss/ui";
-import c from "../../Image/Image.mjs";
-import "@dotss/ui/core/useTheme";
-import w from "../../Swiper/SwiperBlock/SwiperBlock.mjs";
-function z({ children: a, fallback: l, imageProps: t, ...n }) {
-  const [r, s] = S(!1), f = () => s(!0);
-  return /* @__PURE__ */ p(
-    w,
-    {
-      ...n,
-      inlineCSS: {
-        "& > div:nth-of-type(1)": {
-          zIndex: 1
-        },
-        ...n == null ? void 0 : n.inlineCSS
-      },
-      children: [
-        u.toArray(a).filter(y).map((e) => {
-          var o, i;
-          return e.type === c || e.type === "img" ? x(e, {
-            ...t,
-            onLoad: f,
-            disabledResizing: !0,
-            draggable: !1,
-            wrapperProps: {
-              ...t == null ? void 0 : t.wrapperProps,
-              ...e.props.wrapperProps,
-              inlineCSS: {
-                overflow: "visible",
-                margin: "0 auto",
-                ...(o = t == null ? void 0 : t.wrapperProps) == null ? void 0 : o.inlineCSS,
-                ...(i = e.props.wrapperProps) == null ? void 0 : i.inlineCSS
-              }
-            },
-            style: {
-              position: "static",
-              maxWidth: "100%",
-              objectFit: "contain",
-              transform: "translate3d(0, 0, 0) scale(1)",
-              zIndex: 1,
-              ...t == null ? void 0 : t.style,
-              ...e.props.style
-            },
-            ...e.props
-          }) : e;
-        }),
-        !r && /* @__PURE__ */ d(
-          b,
-          {
-            "aria-busy": !0,
-            inlineCSS: {
-              position: "absolute",
-              top: "50%",
-              left: "50%",
-              transform: "translate(-50%, -50%)",
-              opacity: r ? 0 : 1,
-              transition: "opacity 0.3s"
-            },
-            children: l
-          }
-        )
-      ]
-    }
-  );
+import e from "../../Image/index.mjs";
+import t from "../../Swiper/SwiperBlock/index.mjs";
+import { Children as n, cloneElement as r, isValidElement as i, useState as a } from "react";
+import { Flexbox as o } from "@dotss/ui";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region shared/components/MediaDialog/MediaBlock/MediaBlock.tsx
+function l({ children: l, fallback: u, imageProps: d, ...f }) {
+	let [p, m] = a(!1), h = () => m(!0);
+	return /* @__PURE__ */ c(t, {
+		...f,
+		inlineCSS: {
+			"& > div:nth-of-type(1)": { zIndex: 1 },
+			...f?.inlineCSS
+		},
+		children: [n.toArray(l).filter(i).map((t) => t.type === e || t.type === "img" ? r(t, {
+			...d,
+			onLoad: h,
+			disabledResizing: !0,
+			draggable: !1,
+			wrapperProps: {
+				...d?.wrapperProps,
+				...t.props.wrapperProps,
+				inlineCSS: {
+					overflow: "visible",
+					margin: "0 auto",
+					...d?.wrapperProps?.inlineCSS,
+					...t.props.wrapperProps?.inlineCSS
+				}
+			},
+			style: {
+				position: "static",
+				maxWidth: "100%",
+				objectFit: "contain",
+				transform: "translate3d(0, 0, 0) scale(1)",
+				zIndex: 1,
+				...d?.style,
+				...t.props.style
+			},
+			...t.props
+		}) : t), !p && /* @__PURE__ */ s(o, {
+			"aria-busy": !0,
+			inlineCSS: {
+				position: "absolute",
+				top: "50%",
+				left: "50%",
+				transform: "translate(-50%, -50%)",
+				opacity: +!p,
+				transition: "opacity 0.3s"
+			},
+			children: u
+		})]
+	});
 }
-export {
-  z as default
-};
+//#endregion
+export { l as default };

package/dist/shared/components/MediaDialog/MediaBlock/index.mjs

@@ -1,4 +1,5 @@
-import a from "./MediaBlock.mjs";
-export {
-  a as default
-};
+import e from "./MediaBlock.mjs";
+//#region shared/components/MediaDialog/MediaBlock/index.ts
+var t = e;
+//#endregion
+export { t as default };