sibujs 1.2.0 → 1.3.0

package/dist/chunk-KQPDEVVS.js

@@ -0,0 +1,398 @@
+import {
+  signal
+} from "./chunk-WZSPOOER.js";
+
+// src/ui/transition.ts
+function transition(element, options = {}) {
+  const {
+    property = "all",
+    duration = 300,
+    easing = "ease",
+    delay = 0,
+    enterClass,
+    leaveClass,
+    activeClass,
+    onEnterDone,
+    onLeaveDone
+  } = options;
+  const transitionValue = `${property} ${duration}ms ${easing} ${delay}ms`;
+  function enter() {
+    return new Promise((resolve) => {
+      element.style.transition = transitionValue;
+      if (enterClass) element.classList.add(enterClass);
+      if (leaveClass) element.classList.remove(leaveClass);
+      void element.offsetHeight;
+      if (activeClass) element.classList.add(activeClass);
+      const done = () => {
+        if (enterClass) element.classList.remove(enterClass);
+        onEnterDone?.();
+        resolve();
+      };
+      if (duration > 0) {
+        setTimeout(done, duration + delay);
+      } else {
+        done();
+      }
+    });
+  }
+  function leave() {
+    return new Promise((resolve) => {
+      element.style.transition = transitionValue;
+      if (activeClass) element.classList.remove(activeClass);
+      if (leaveClass) element.classList.add(leaveClass);
+      if (enterClass) element.classList.remove(enterClass);
+      const done = () => {
+        if (leaveClass) element.classList.remove(leaveClass);
+        onLeaveDone?.();
+        resolve();
+      };
+      if (duration > 0) {
+        setTimeout(done, duration + delay);
+      } else {
+        done();
+      }
+    });
+  }
+  return { enter, leave };
+}
+function spring(element, keyframes, options = {}) {
+  const defaults = {
+    duration: 300,
+    easing: "cubic-bezier(0.34, 1.56, 0.64, 1)",
+    fill: "forwards"
+  };
+  return new Promise((resolve) => {
+    const animation = element.animate(keyframes, { ...defaults, ...options });
+    animation.onfinish = () => resolve();
+    animation.oncancel = () => resolve();
+  });
+}
+
+// src/ui/animationPresets.ts
+var prefersReducedMotion = () => typeof window !== "undefined" && window.matchMedia?.("(prefers-reduced-motion: reduce)").matches;
+function createPreset(keyframes, defaults, overrides) {
+  const opts = {
+    ...defaults,
+    ...overrides,
+    fill: overrides?.fill ?? defaults.fill ?? "forwards"
+  };
+  if (prefersReducedMotion()) {
+    return {
+      keyframes: [keyframes[keyframes.length - 1]],
+      options: { ...opts, duration: 0, delay: 0 }
+    };
+  }
+  return { keyframes, options: opts };
+}
+function applyPreset(el, preset) {
+  return new Promise((resolve) => {
+    const anim = el.animate(preset.keyframes, preset.options);
+    anim.onfinish = () => resolve();
+    anim.oncancel = () => resolve();
+  });
+}
+function fadeIn(opts) {
+  return createPreset([{ opacity: 0 }, { opacity: 1 }], { duration: 300, easing: "ease-out" }, opts);
+}
+function fadeOut(opts) {
+  return createPreset([{ opacity: 1 }, { opacity: 0 }], { duration: 300, easing: "ease-in" }, opts);
+}
+var slideOffsets = {
+  up: "translateY(20px)",
+  down: "translateY(-20px)",
+  left: "translateX(20px)",
+  right: "translateX(-20px)"
+};
+function slideIn(direction = "up", opts) {
+  return createPreset(
+    [
+      { transform: slideOffsets[direction], opacity: 0 },
+      { transform: "translate(0, 0)", opacity: 1 }
+    ],
+    { duration: 400, easing: "cubic-bezier(0.16, 1, 0.3, 1)" },
+    opts
+  );
+}
+function slideOut(direction = "down", opts) {
+  return createPreset(
+    [
+      { transform: "translate(0, 0)", opacity: 1 },
+      { transform: slideOffsets[direction], opacity: 0 }
+    ],
+    { duration: 300, easing: "cubic-bezier(0.4, 0, 1, 1)" },
+    opts
+  );
+}
+function scaleUp(opts) {
+  return createPreset(
+    [
+      { transform: "scale(0.85)", opacity: 0 },
+      { transform: "scale(1)", opacity: 1 }
+    ],
+    { duration: 350, easing: "cubic-bezier(0.34, 1.56, 0.64, 1)" },
+    opts
+  );
+}
+function scaleDown(opts) {
+  return createPreset(
+    [
+      { transform: "scale(1)", opacity: 1 },
+      { transform: "scale(0.85)", opacity: 0 }
+    ],
+    { duration: 250, easing: "ease-in" },
+    opts
+  );
+}
+function bounceIn(opts) {
+  return createPreset(
+    [
+      { transform: "scale(0.3)", opacity: 0 },
+      { transform: "scale(1.05)", opacity: 0.8, offset: 0.5 },
+      { transform: "scale(0.95)", opacity: 0.9, offset: 0.7 },
+      { transform: "scale(1)", opacity: 1 }
+    ],
+    { duration: 500, easing: "cubic-bezier(0.34, 1.56, 0.64, 1)" },
+    opts
+  );
+}
+function bounceOut(opts) {
+  return createPreset(
+    [
+      { transform: "scale(1)", opacity: 1 },
+      { transform: "scale(1.05)", opacity: 0.9, offset: 0.3 },
+      { transform: "scale(0.3)", opacity: 0 }
+    ],
+    { duration: 400, easing: "ease-in" },
+    opts
+  );
+}
+function flipIn(axis = "x", opts) {
+  const prop = axis === "x" ? "rotateX" : "rotateY";
+  return createPreset(
+    [
+      { transform: `perspective(400px) ${prop}(90deg)`, opacity: 0 },
+      { transform: `perspective(400px) ${prop}(-10deg)`, opacity: 1, offset: 0.6 },
+      { transform: `perspective(400px) ${prop}(0deg)`, opacity: 1 }
+    ],
+    { duration: 500, easing: "ease-out" },
+    opts
+  );
+}
+function shake(opts) {
+  return createPreset(
+    [
+      { transform: "translateX(0)" },
+      { transform: "translateX(-8px)", offset: 0.1 },
+      { transform: "translateX(8px)", offset: 0.2 },
+      { transform: "translateX(-6px)", offset: 0.3 },
+      { transform: "translateX(6px)", offset: 0.4 },
+      { transform: "translateX(-4px)", offset: 0.5 },
+      { transform: "translateX(4px)", offset: 0.6 },
+      { transform: "translateX(-2px)", offset: 0.7 },
+      { transform: "translateX(0)" }
+    ],
+    { duration: 500, easing: "ease-out", fill: "none" },
+    opts
+  );
+}
+function pulse(opts) {
+  return createPreset(
+    [{ transform: "scale(1)" }, { transform: "scale(1.08)", offset: 0.5 }, { transform: "scale(1)" }],
+    { duration: 400, easing: "ease-in-out", fill: "none" },
+    opts
+  );
+}
+function animate(el, preset) {
+  return applyPreset(el, preset);
+}
+function stagger(elements, preset, delayBetween = 50) {
+  const promises = elements.map(
+    (el, i) => applyPreset(el, {
+      keyframes: preset.keyframes,
+      options: {
+        ...preset.options,
+        delay: (preset.options.delay || 0) + i * delayBetween
+      }
+    })
+  );
+  return Promise.all(promises).then(() => {
+  });
+}
+async function sequence(steps) {
+  for (const step of steps) {
+    await applyPreset(step.el, step.preset);
+  }
+}
+
+// src/ui/TransitionGroup.ts
+function TransitionGroup(options) {
+  const [elements, setElements] = signal([]);
+  const positions = /* @__PURE__ */ new Map();
+  function add(el) {
+    setElements((prev) => [...prev, el]);
+    if (options.enter) {
+      options.enter(el);
+    }
+  }
+  async function remove(el) {
+    if (options.leave) {
+      await options.leave(el);
+    }
+    setElements((prev) => prev.filter((e) => e !== el));
+  }
+  function track(newElements) {
+    const oldPositions = /* @__PURE__ */ new Map();
+    for (const el of elements()) {
+      if (typeof el.getBoundingClientRect === "function") {
+        oldPositions.set(el, el.getBoundingClientRect());
+      }
+    }
+    const currentSet = new Set(elements());
+    for (const el of newElements) {
+      if (!currentSet.has(el)) {
+        if (options.enter) {
+          options.enter(el);
+        }
+      }
+    }
+    const newSet = new Set(newElements);
+    for (const el of elements()) {
+      if (!newSet.has(el)) {
+        if (options.leave) {
+          options.leave(el);
+        }
+      }
+    }
+    setElements(newElements);
+    if (options.move) {
+      for (const el of newElements) {
+        const oldRect = oldPositions.get(el);
+        if (oldRect && typeof el.getBoundingClientRect === "function") {
+          const newRect = el.getBoundingClientRect();
+          if (oldRect.left !== newRect.left || oldRect.top !== newRect.top) {
+            options.move(el);
+          }
+        }
+      }
+    }
+    positions.clear();
+    for (const el of newElements) {
+      if (typeof el.getBoundingClientRect === "function") {
+        positions.set(el, el.getBoundingClientRect());
+      }
+    }
+  }
+  return { add, remove, track };
+}
+
+// src/ui/viewTransition.ts
+function viewTransition(callback) {
+  const [isTransitioning, setIsTransitioning] = signal(false);
+  async function start() {
+    setIsTransitioning(true);
+    try {
+      if (typeof document !== "undefined" && "startViewTransition" in document && typeof document.startViewTransition === "function") {
+        const transition2 = document.startViewTransition(callback);
+        await transition2.finished;
+      } else {
+        await callback();
+      }
+    } finally {
+      setIsTransitioning(false);
+    }
+  }
+  return { start, isTransitioning };
+}
+
+// src/ui/reducedMotion.ts
+function reducedMotion() {
+  if (typeof window === "undefined" || typeof window.matchMedia !== "function") {
+    const [reduced2] = signal(false);
+    return { reduced: reduced2, dispose: () => {
+    } };
+  }
+  const mql = window.matchMedia("(prefers-reduced-motion: reduce)");
+  const [reduced, setReduced] = signal(mql.matches);
+  const handler = (event) => {
+    setReduced(event.matches);
+  };
+  mql.addEventListener("change", handler);
+  function dispose() {
+    mql.removeEventListener("change", handler);
+  }
+  return { reduced, dispose };
+}
+
+// src/ui/springSignal.ts
+var prefersReducedMotion2 = () => typeof window !== "undefined" && !!window.matchMedia?.("(prefers-reduced-motion: reduce)").matches;
+function springSignal(initial, options) {
+  const stiffness = options?.stiffness ?? 0.15;
+  const damping = options?.damping ?? 0.8;
+  const precision = options?.precision ?? 0.01;
+  const [value, setValue] = signal(initial);
+  let current = initial;
+  let velocity = 0;
+  let target = initial;
+  let rafId = null;
+  function tick() {
+    const force = -stiffness * (current - target);
+    const dampingForce = -damping * velocity;
+    velocity += force + dampingForce;
+    current += velocity;
+    if (Math.abs(current - target) < precision && Math.abs(velocity) < precision) {
+      current = target;
+      velocity = 0;
+      rafId = null;
+      setValue(current);
+      return;
+    }
+    setValue(current);
+    rafId = requestAnimationFrame(tick);
+  }
+  function set(newTarget) {
+    target = newTarget;
+    if (prefersReducedMotion2()) {
+      current = newTarget;
+      velocity = 0;
+      if (rafId !== null) {
+        cancelAnimationFrame(rafId);
+        rafId = null;
+      }
+      setValue(current);
+      return;
+    }
+    if (rafId === null) {
+      rafId = requestAnimationFrame(tick);
+    }
+  }
+  function dispose() {
+    if (rafId !== null) {
+      cancelAnimationFrame(rafId);
+      rafId = null;
+    }
+  }
+  return [value, set, dispose];
+}
+
+export {
+  transition,
+  spring,
+  fadeIn,
+  fadeOut,
+  slideIn,
+  slideOut,
+  scaleUp,
+  scaleDown,
+  bounceIn,
+  bounceOut,
+  flipIn,
+  shake,
+  pulse,
+  animate,
+  stagger,
+  sequence,
+  TransitionGroup,
+  viewTransition,
+  reducedMotion,
+  springSignal
+};

package/dist/chunk-NEKUBFPT.js

@@ -0,0 +1,60 @@
+import {
+  recordDependency,
+  track,
+  trackingSuspended
+} from "./chunk-ZD6OAMTH.js";
+import {
+  devAssert
+} from "./chunk-5X6PP2UK.js";
+
+// src/core/signals/derived.ts
+function derived(getter, options) {
+  devAssert(typeof getter === "function", "derived: argument must be a getter function.");
+  const debugName = options?.name;
+  const cs = {};
+  cs._d = false;
+  cs._g = getter;
+  const markDirty = () => {
+    if (cs._d) return;
+    cs._d = true;
+  };
+  markDirty._c = 1;
+  markDirty._sig = cs;
+  track(() => {
+    cs._d = false;
+    cs._v = getter();
+  }, markDirty);
+  const hook = globalThis.__SIBU_DEVTOOLS_GLOBAL_HOOK__;
+  function computedGetter() {
+    if (trackingSuspended) {
+      if (cs._d) {
+        cs._d = false;
+        cs._v = getter();
+      }
+      return cs._v;
+    }
+    recordDependency(cs);
+    if (cs._d) {
+      const oldValue = cs._v;
+      track(() => {
+        cs._d = false;
+        cs._v = getter();
+      }, markDirty);
+      if (hook && oldValue !== cs._v) {
+        hook.emit("computed:update", { signal: cs, oldValue, newValue: cs._v });
+      }
+    }
+    return cs._v;
+  }
+  if (debugName) {
+    computedGetter.__name = debugName;
+    cs.__name = debugName;
+  }
+  computedGetter.__signal = cs;
+  if (hook) hook.emit("computed:create", { signal: cs, name: debugName, getter: computedGetter });
+  return computedGetter;
+}
+
+export {
+  derived
+};

package/dist/chunk-NYVAC6P5.js

@@ -0,0 +1,37 @@
+import {
+  isSSR
+} from "./chunk-EUZND3CB.js";
+import {
+  track
+} from "./chunk-ZD6OAMTH.js";
+import {
+  devAssert
+} from "./chunk-5X6PP2UK.js";
+
+// src/core/signals/watch.ts
+function watch(getter, callback) {
+  devAssert(typeof getter === "function", "watch: first argument must be a getter function.");
+  devAssert(typeof callback === "function", "watch: second argument must be a callback function.");
+  if (isSSR()) return () => {
+  };
+  let oldValue;
+  let first = true;
+  const subscriber = () => {
+    const newValue = getter();
+    if (first) {
+      oldValue = newValue;
+      first = false;
+      return;
+    }
+    if (!Object.is(newValue, oldValue)) {
+      callback(newValue, oldValue);
+      oldValue = newValue;
+    }
+  };
+  const teardown = track(subscriber);
+  return teardown;
+}
+
+export {
+  watch
+};

package/dist/chunk-PTQJDMRT.js

@@ -0,0 +1,146 @@
+import {
+  isUrlAttribute,
+  sanitizeUrl
+} from "./chunk-CMBFNA7L.js";
+import {
+  track
+} from "./chunk-ZD6OAMTH.js";
+import {
+  devWarn,
+  isDev
+} from "./chunk-5X6PP2UK.js";
+
+// src/reactivity/bindAttribute.ts
+var _isDev = isDev();
+function isEventHandlerAttr(name) {
+  if (name.length < 3) return false;
+  const lower = name.toLowerCase();
+  return lower[0] === "o" && lower[1] === "n" && lower.charCodeAt(2) >= 97 && lower.charCodeAt(2) <= 122;
+}
+function bindAttribute(el, attr, getter) {
+  if (isEventHandlerAttr(attr)) {
+    if (_isDev)
+      devWarn(
+        `bindAttribute: refusing to bind event-handler attribute "${attr}". Use on:{ ${attr.slice(2)}: fn } instead.`
+      );
+    return () => {
+    };
+  }
+  function commit() {
+    let value;
+    try {
+      value = getter();
+    } catch (err) {
+      if (_isDev)
+        devWarn(`bindAttribute: getter for "${attr}" threw: ${err instanceof Error ? err.message : String(err)}`);
+      return;
+    }
+    if (typeof value === "boolean") {
+      if (attr in el && (attr === "checked" || attr === "disabled" || attr === "selected")) {
+        el[attr] = value;
+      } else if (value) {
+        el.setAttribute(attr, "");
+      } else {
+        el.removeAttribute(attr);
+      }
+      return;
+    }
+    const str = String(value);
+    if ((attr === "value" || attr === "checked") && attr in el) {
+      el[attr] = attr === "checked" ? Boolean(value) : str;
+    } else {
+      el.setAttribute(attr, isUrlAttribute(attr) ? sanitizeUrl(str) : str);
+    }
+  }
+  const teardown = track(commit);
+  return teardown;
+}
+function bindDynamic(el, nameGetter, valueGetter) {
+  let prevName = null;
+  function commit() {
+    let name;
+    try {
+      name = typeof nameGetter === "function" ? nameGetter() : nameGetter;
+    } catch (err) {
+      if (_isDev) devWarn(`bindDynamic: name getter threw: ${err instanceof Error ? err.message : String(err)}`);
+      return;
+    }
+    let value;
+    try {
+      value = typeof valueGetter === "function" ? valueGetter() : valueGetter;
+    } catch (err) {
+      if (_isDev) devWarn(`bindDynamic: value getter threw: ${err instanceof Error ? err.message : String(err)}`);
+      return;
+    }
+    if ((name[0] === "o" || name[0] === "O") && (name[1] === "n" || name[1] === "N")) return;
+    if (prevName !== null && prevName !== name) {
+      el.removeAttribute(prevName);
+    }
+    const str = String(value);
+    if ((name === "value" || name === "checked") && name in el) {
+      el[name] = name === "checked" ? Boolean(value) : str;
+    } else {
+      el.setAttribute(name, isUrlAttribute(name) ? sanitizeUrl(str) : str);
+    }
+    prevName = name;
+  }
+  const teardown = track(commit);
+  return () => {
+    teardown();
+    if (prevName !== null) {
+      el.removeAttribute(prevName);
+    }
+  };
+}
+
+// src/core/rendering/dispose.ts
+var elementDisposers = /* @__PURE__ */ new WeakMap();
+var _isDev2 = isDev();
+var activeBindingCount = 0;
+function registerDisposer(node, teardown) {
+  let disposers = elementDisposers.get(node);
+  if (!disposers) {
+    disposers = [];
+    elementDisposers.set(node, disposers);
+  }
+  disposers.push(teardown);
+  if (_isDev2) activeBindingCount++;
+}
+function dispose(node) {
+  const stack = [node];
+  const order = [];
+  while (stack.length > 0) {
+    const current = stack.pop();
+    order.push(current);
+    const children = current.childNodes;
+    for (let i = 0; i < children.length; i++) {
+      stack.push(children[i]);
+    }
+  }
+  for (let i = order.length - 1; i >= 0; i--) {
+    const current = order[i];
+    const disposers = elementDisposers.get(current);
+    if (disposers) {
+      if (_isDev2) activeBindingCount -= disposers.length;
+      for (const d of disposers) d();
+      elementDisposers.delete(current);
+    }
+  }
+}
+function checkLeaks(warnThreshold = 0) {
+  if (!_isDev2) return 0;
+  if (warnThreshold > 0 && activeBindingCount > warnThreshold) {
+    devWarn(
+      `checkLeaks: ${activeBindingCount} active DOM bindings detected. Expected \u2264${warnThreshold}. This may indicate a component was removed from the DOM without calling dispose().`
+    );
+  }
+  return activeBindingCount;
+}
+
+export {
+  bindAttribute,
+  bindDynamic,
+  registerDisposer,
+  dispose,
+  checkLeaks
+};