vlite3 1.1.6 → 1.1.8

package/components/Skeleton/extract.js

@@ -0,0 +1,83 @@
+const B = /* @__PURE__ */ new Set(["p", "h1", "h2", "h3", "h4", "h5", "h6", "li", "td", "th"]);
+function Y(m, L = "component", h) {
+  const n = m.getBoundingClientRect(), p = [], T = h?.leafTags ? /* @__PURE__ */ new Set([...B, ...h.leafTags]) : B, v = h?.captureRoundedBorders ?? !0, A = h?.excludeTags ? new Set(h.excludeTags) : null, N = h?.excludeSelectors ?? null;
+  function F(i, d) {
+    const r = parseFloat(i.borderTopLeftRadius) || 0, l = parseFloat(i.borderTopRightRadius) || 0, e = parseFloat(i.borderBottomRightRadius) || 0, a = parseFloat(i.borderBottomLeftRadius) || 0;
+    if (r === 0 && l === 0 && e === 0 && a === 0) return;
+    const f = d ? d.width > 0 && d.height > 0 && Math.abs(d.width - d.height) < 4 : !1;
+    return i.borderRadius === "50%" ? "50%" : Math.max(r, l, e, a) > 9998 ? f ? "50%" : 9999 : r === l && l === e && e === a ? r !== 8 ? r : void 0 : `${r}px ${l}px ${e}px ${a}px`;
+  }
+  function R(i, d) {
+    const r = d || window.getComputedStyle(i);
+    if ((r.display === "none" || r.visibility === "hidden" || r.opacity === "0") && !i.hasAttribute("data-boneyard-fixture")) return;
+    const e = i.tagName.toLowerCase();
+    if (A?.has(e) || N?.some((o) => i.matches(o))) return;
+    const a = Array.from(i.children), f = [];
+    let b = 0;
+    for (let o = 0; o < a.length; o++) {
+      const s = window.getComputedStyle(a[o]);
+      f.push(s), s.display !== "none" && s.visibility !== "hidden" && s.opacity !== "0" && b++;
+    }
+    const w = e === "img" || e === "svg" || e === "video" || e === "canvas", y = e === "input" || e === "button" || e === "textarea" || e === "select", H = b === 0 || w || y || T.has(e), C = r.backgroundColor, W = C !== "rgba(0, 0, 0, 0)" && C !== "transparent", $ = r.backgroundImage !== "none", k = parseFloat(r.borderTopWidth) || 0, E = v && k > 0 && r.borderTopColor !== "rgba(0, 0, 0, 0)" && r.borderTopColor !== "transparent", q = (parseFloat(r.borderTopLeftRadius) || 0) > 0, M = W || $ || E && q, x = e === "tr" || e === "td" || e === "th" || e === "thead" || e === "tbody" || e === "table";
+    let t = null;
+    if (H) {
+      if (t = i.getBoundingClientRect(), t.width < 1 || t.height < 1) return;
+      const o = n.width;
+      if (!x && !w && !y && !M && (T.has(e) || (i.textContent?.trim().length || 0) > 0)) {
+        const _ = parseFloat(r.fontSize) || 16;
+        let u = parseFloat(r.lineHeight);
+        isNaN(u) && (u = _ * 1.5);
+        let c = Math.round(t.height / u);
+        c < 1 && (c = 1);
+        for (let g = 0; g < c; g++) {
+          const D = g === c - 1;
+          let S = t.width;
+          c > 1 && D && (S = t.width * 0.7);
+          const G = u * 0.7, U = t.top - n.top + g * u + u * 0.15;
+          p.push({
+            x: o > 0 ? +((t.left - n.left) / o * 100).toFixed(4) : 0,
+            y: Math.round(U),
+            w: o > 0 ? +(S / o * 100).toFixed(4) : 0,
+            h: Math.round(G),
+            r: 4
+          });
+        }
+        return;
+      }
+      const z = w && t.width > 0 && t.height > 0 && Math.abs(t.width - t.height) < 4, I = x ? 0 : z ? "50%" : F(r, t) ?? 8;
+      p.push({
+        x: o > 0 ? +((t.left - n.left) / o * 100).toFixed(4) : 0,
+        y: Math.round(t.top - n.top),
+        w: o > 0 ? +(t.width / o * 100).toFixed(4) : 0,
+        h: Math.round(t.height),
+        r: I
+      });
+      return;
+    }
+    if (M && !i.hasAttribute("data-boneyard-fixture") && (t = i.getBoundingClientRect(), t.width >= 1 && t.height >= 1)) {
+      const o = x ? 0 : F(r, t) ?? 8, s = n.width;
+      p.push({
+        x: s > 0 ? +((t.left - n.left) / s * 100).toFixed(4) : 0,
+        y: Math.round(t.top - n.top),
+        w: s > 0 ? +(t.width / s * 100).toFixed(4) : 0,
+        h: Math.round(t.height),
+        r: o,
+        c: !0
+      });
+    }
+    for (let o = 0; o < a.length; o++)
+      R(a[o], f[o]);
+  }
+  for (const i of Array.from(m.children))
+    R(i);
+  return {
+    name: L,
+    viewportWidth: Math.round(n.width),
+    width: Math.round(n.width),
+    height: Math.round(n.height),
+    bones: p
+  };
+}
+export {
+  Y as snapshotBones
+};

package/components/Skeleton/index.d.ts

@@ -0,0 +1,4 @@
+export { default as Skeleton } from './Skeleton.vue';
+export * from './types';
+export * from './extract';
+export { registerBones, configureSkeleton, getGlobalConfig } from './shared';

package/components/Skeleton/shared.d.ts

@@ -0,0 +1,14 @@
+import { ResponsiveBones, SkeletonResult, AnimationStyle } from './types';
+export type RegisteredBones = SkeletonResult | ResponsiveBones;
+export interface BoneyardConfig {
+    color?: string;
+    darkColor?: string;
+    animate?: AnimationStyle;
+    stagger?: number | boolean;
+    transition?: number | boolean;
+}
+export declare function configureSkeleton(config: BoneyardConfig): void;
+export declare function getGlobalConfig(): BoneyardConfig;
+export declare function registerBones(map: Record<string, RegisteredBones>): void;
+export declare function getRegisteredBones(name: string): RegisteredBones | undefined;
+export declare function resolveResponsive(bones: RegisteredBones, width: number): SkeletonResult | null;

package/components/Skeleton/shared.js

@@ -0,0 +1,29 @@
+const i = /* @__PURE__ */ new Map();
+let o = {};
+function c(e) {
+  o = { ...o, ...e };
+}
+function f() {
+  return o;
+}
+function l(e) {
+  for (const [t, n] of Object.entries(e))
+    i.set(t, n);
+}
+function g(e) {
+  return i.get(e);
+}
+function a(e, t) {
+  if (!("breakpoints" in e)) return e;
+  const n = Object.keys(e.breakpoints).map(Number).sort((r, u) => r - u);
+  if (n.length === 0) return null;
+  const s = [...n].reverse().find((r) => t >= r) ?? n[0];
+  return e.breakpoints[s] ?? null;
+}
+export {
+  c as configureSkeleton,
+  f as getGlobalConfig,
+  g as getRegisteredBones,
+  l as registerBones,
+  a as resolveResponsive
+};

package/components/Skeleton/types.d.ts

@@ -0,0 +1,59 @@
+export interface SnapshotConfig {
+    /**
+     * HTML tags always captured as a single atomic bone, regardless of children.
+     * Default: ['p','h1','h2','h3','h4','h5','h6','li','tr']
+     */
+    leafTags?: string[];
+    /**
+     * When true, containers with a visible border AND border-radius are captured
+     * as container bones — even with a white or transparent background.
+     * Default: true
+     */
+    captureRoundedBorders?: boolean;
+    /**
+     * HTML tags to skip entirely — no bone emitted, children not walked.
+     */
+    excludeTags?: string[];
+    /**
+     * CSS selectors to skip entirely.
+     */
+    excludeSelectors?: string[];
+}
+/** A single skeleton bone */
+export interface Bone {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+    r: number | string;
+    /** True if this bone is a background container */
+    c?: boolean;
+}
+/** Compact bone format */
+export type CompactBone = [number, number, number, number, number | string] | [number, number, number, number, number | string, boolean];
+export type AnyBone = Bone | CompactBone;
+export declare function normalizeBone(b: AnyBone): Bone;
+export interface SkeletonResult {
+    name: string;
+    viewportWidth: number;
+    width: number;
+    height: number;
+    bones: Bone[];
+}
+export interface ResponsiveBones {
+    breakpoints: Record<number, SkeletonResult>;
+}
+export type AnimationStyle = 'pulse' | 'shimmer' | 'solid' | boolean;
+export interface SkeletonProps {
+    loading: boolean;
+    name?: string;
+    initialBones?: SkeletonResult | ResponsiveBones;
+    auto?: boolean;
+    color?: string;
+    darkColor?: string;
+    animate?: AnimationStyle;
+    stagger?: number | boolean;
+    transition?: number | boolean;
+    class?: string;
+    snapshotConfig?: SnapshotConfig;
+}

package/components/Skeleton/types.js

@@ -0,0 +1,6 @@
+function n(r) {
+  return Array.isArray(r) ? { x: r[0], y: r[1], w: r[2], h: r[3], r: r[4], c: r[5] || void 0 } : r;
+}
+export {
+  n as normalizeBone
+};

package/index.d.ts

@@ -51,6 +51,7 @@ export * from './components/CategoryManager';
 export * from './components/ThumbnailSelector';
 export * from './components/TagInput';
 export * from './components/Calendar';
+export * from './components/Skeleton';
 export { default as Icon } from './components/Icon.vue';
 export { default as Logo } from './components/Logo.vue';
 export { default as Alert } from './components/Alert.vue';