sibujs 1.0.2 → 1.0.4

package/dist/chunk-Z6GZHJW5.js

@@ -1,877 +0,0 @@
-import {
-  bindAttribute
-} from "./chunk-5ZFVYPDG.js";
-import {
-  derived
-} from "./chunk-526ENZ77.js";
-import {
-  effect
-} from "./chunk-JRWAHOMS.js";
-import {
-  signal,
-  track
-} from "./chunk-5KBEED6D.js";
-
-// src/ui/form.ts
-function required(message = "This field is required") {
-  return (value) => {
-    if (value == null || value === "" || Array.isArray(value) && value.length === 0) {
-      return message;
-    }
-    return null;
-  };
-}
-function minLength(min2, message) {
-  return (value) => {
-    if (value && value.length < min2) {
-      return message || `Must be at least ${min2} characters`;
-    }
-    return null;
-  };
-}
-function maxLength(max2, message) {
-  return (value) => {
-    if (value && value.length > max2) {
-      return message || `Must be at most ${max2} characters`;
-    }
-    return null;
-  };
-}
-function matchesPattern(regex, message = "Invalid format") {
-  return (value) => {
-    if (value && !regex.test(value)) {
-      return message;
-    }
-    return null;
-  };
-}
-function email(message = "Invalid email address") {
-  return matchesPattern(/^[^\s@]+@[^\s@]+\.[^\s@]+$/, message);
-}
-function min(minVal, message) {
-  return (value) => {
-    if (value != null && value < minVal) {
-      return message || `Must be at least ${minVal}`;
-    }
-    return null;
-  };
-}
-function max(maxVal, message) {
-  return (value) => {
-    if (value != null && value > maxVal) {
-      return message || `Must be at most ${maxVal}`;
-    }
-    return null;
-  };
-}
-function custom(fn, message) {
-  return (value) => fn(value) ? null : message;
-}
-function form(config) {
-  const fieldEntries = Object.entries(config);
-  const fieldMap = {};
-  const [manualErrors, setManualErrors] = signal({});
-  for (const [name, cfg] of fieldEntries) {
-    const [value, setValue] = signal(cfg.initial);
-    const [isTouched, setTouched] = signal(false);
-    const error = derived(() => {
-      const manual = manualErrors();
-      if (manual[name]) return manual[name];
-      const val = value();
-      if (!cfg.validators) return null;
-      for (const validator of cfg.validators) {
-        const msg = validator(val);
-        if (msg) return msg;
-      }
-      return null;
-    });
-    fieldMap[name] = {
-      value,
-      set: setValue,
-      error,
-      touched: isTouched,
-      touch: () => setTouched(true),
-      reset: () => {
-        setValue(cfg.initial);
-        setTouched(false);
-        setManualErrors((prev) => ({ ...prev, [name]: null }));
-      }
-    };
-  }
-  const errors = derived(() => {
-    const result = {};
-    for (const [name, field] of Object.entries(fieldMap)) {
-      result[name] = field.error();
-    }
-    return result;
-  });
-  const isValid = derived(() => {
-    for (const field of Object.values(fieldMap)) {
-      if (field.error() != null) return false;
-    }
-    return true;
-  });
-  const isDirty = derived(() => {
-    for (const [name, cfg] of fieldEntries) {
-      if (!Object.is(fieldMap[name].value(), cfg.initial)) return true;
-    }
-    return false;
-  });
-  const touchedState = derived(() => {
-    const result = {};
-    for (const [name, field] of Object.entries(fieldMap)) {
-      result[name] = field.touched();
-    }
-    return result;
-  });
-  const values = derived(() => {
-    const result = {};
-    for (const [name, field] of Object.entries(fieldMap)) {
-      result[name] = field.value();
-    }
-    return result;
-  });
-  function handleSubmit(onSubmit) {
-    return (e) => {
-      if (e) e.preventDefault();
-      for (const field of Object.values(fieldMap)) {
-        field.touch();
-      }
-      if (isValid()) {
-        onSubmit(values());
-      }
-    };
-  }
-  function reset() {
-    for (const field of Object.values(fieldMap)) {
-      field.reset();
-    }
-  }
-  function setError(field, message) {
-    setManualErrors((prev) => ({ ...prev, [field]: message }));
-  }
-  return {
-    fields: fieldMap,
-    errors,
-    isValid,
-    isDirty,
-    touched: touchedState,
-    values,
-    handleSubmit,
-    reset,
-    setError
-  };
-}
-
-// src/ui/virtualList.ts
-function VirtualList(props) {
-  const overscan = props.overscan ?? 3;
-  const [scrollTop, setScrollTop] = signal(0);
-  const container = document.createElement("div");
-  container.style.overflow = "auto";
-  container.style.height = `${props.containerHeight}px`;
-  container.style.position = "relative";
-  if (props.class) container.className = props.class;
-  const spacer = document.createElement("div");
-  spacer.style.position = "relative";
-  const content = document.createElement("div");
-  content.style.position = "absolute";
-  content.style.left = "0";
-  content.style.right = "0";
-  spacer.appendChild(content);
-  container.appendChild(spacer);
-  container.addEventListener("scroll", () => {
-    setScrollTop(container.scrollTop);
-  });
-  const update = () => {
-    const items = props.items();
-    const totalHeight = items.length * props.itemHeight;
-    spacer.style.height = `${totalHeight}px`;
-    const currentScroll = scrollTop();
-    const startIndex = Math.max(0, Math.floor(currentScroll / props.itemHeight) - overscan);
-    const visibleCount = Math.ceil(props.containerHeight / props.itemHeight) + 2 * overscan;
-    const endIndex = Math.min(items.length, startIndex + visibleCount);
-    content.style.top = `${startIndex * props.itemHeight}px`;
-    content.innerHTML = "";
-    for (let i = startIndex; i < endIndex; i++) {
-      const itemEl = props.renderItem(items[i], i);
-      itemEl.style.height = `${props.itemHeight}px`;
-      itemEl.style.boxSizing = "border-box";
-      content.appendChild(itemEl);
-    }
-  };
-  effect(update);
-  return container;
-}
-
-// src/ui/intersection.ts
-function intersection(options) {
-  const [isIntersecting, setIsIntersecting] = signal(false);
-  const [ratio, setRatio] = signal(0);
-  let observer = null;
-  let currentElement = null;
-  function observe(element) {
-    unobserve();
-    currentElement = element;
-    observer = new IntersectionObserver((entries) => {
-      const entry = entries[0];
-      if (entry) {
-        setIsIntersecting(entry.isIntersecting);
-        setRatio(entry.intersectionRatio);
-      }
-    }, options);
-    observer.observe(element);
-  }
-  function unobserve() {
-    if (observer) {
-      if (currentElement) observer.unobserve(currentElement);
-      observer.disconnect();
-      observer = null;
-      currentElement = null;
-    }
-  }
-  return {
-    isIntersecting,
-    intersectionRatio: ratio,
-    observe,
-    unobserve
-  };
-}
-function lazyLoad(element, loader, options) {
-  const observer = new IntersectionObserver((entries) => {
-    for (const entry of entries) {
-      if (entry.isIntersecting) {
-        loader();
-        observer.disconnect();
-        break;
-      }
-    }
-  }, options);
-  observer.observe(element);
-  return () => observer.disconnect();
-}
-
-// src/ui/inputMask.ts
-function inputMask(options) {
-  const placeholder = options.placeholder || "_";
-  const [value, setValue] = signal("");
-  const [rawValue, setRawValue] = signal("");
-  function applyMask(raw) {
-    let result = "";
-    let rawIndex = 0;
-    for (let i = 0; i < options.pattern.length && rawIndex < raw.length; i++) {
-      const maskChar = options.pattern[i];
-      if (maskChar === "9") {
-        while (rawIndex < raw.length && !/\d/.test(raw[rawIndex])) rawIndex++;
-        if (rawIndex < raw.length) {
-          result += raw[rawIndex++];
-        }
-      } else if (maskChar === "A") {
-        while (rawIndex < raw.length && !/[a-zA-Z]/.test(raw[rawIndex])) rawIndex++;
-        if (rawIndex < raw.length) {
-          result += raw[rawIndex++];
-        }
-      } else if (maskChar === "*") {
-        result += raw[rawIndex++];
-      } else {
-        result += maskChar;
-        if (raw[rawIndex] === maskChar) rawIndex++;
-      }
-    }
-    return result;
-  }
-  function extractRaw(masked) {
-    let raw = "";
-    for (let i = 0; i < masked.length && i < options.pattern.length; i++) {
-      const maskChar = options.pattern[i];
-      if (maskChar === "9" || maskChar === "A" || maskChar === "*") {
-        raw += masked[i];
-      }
-    }
-    return raw;
-  }
-  function bind(input) {
-    input.addEventListener("input", () => {
-      const raw = input.value.replace(/[^a-zA-Z0-9]/g, "");
-      const masked = applyMask(raw);
-      setValue(masked);
-      setRawValue(extractRaw(masked));
-      input.value = masked;
-    });
-    input.addEventListener("focus", () => {
-      if (!input.value) {
-        const display = options.pattern.replace(/9/g, placeholder).replace(/A/g, placeholder).replace(/\*/g, placeholder);
-        input.placeholder = display;
-      }
-    });
-  }
-  return { value, rawValue, bind };
-}
-function phoneMask() {
-  return { pattern: "(999) 999-9999" };
-}
-function dateMask() {
-  return { pattern: "99/99/9999" };
-}
-function creditCardMask() {
-  return { pattern: "9999 9999 9999 9999" };
-}
-function timeMask() {
-  return { pattern: "99:99" };
-}
-function ssnMask() {
-  return { pattern: "999-99-9999" };
-}
-function zipMask() {
-  return { pattern: "99999" };
-}
-
-// src/ui/a11y.ts
-function aria(element, attrs) {
-  for (const [key, value] of Object.entries(attrs)) {
-    const ariaKey = key.startsWith("aria-") ? key : `aria-${key}`;
-    if (typeof value === "function") {
-      const getter = value;
-      track(() => {
-        element.setAttribute(ariaKey, String(getter()));
-      });
-    } else {
-      element.setAttribute(ariaKey, String(value));
-    }
-  }
-}
-function focus() {
-  const [isFocused, setIsFocused] = signal(false);
-  let currentElement = null;
-  function bind(element) {
-    currentElement = element;
-    element.addEventListener("focus", () => setIsFocused(true));
-    element.addEventListener("blur", () => setIsFocused(false));
-  }
-  function focus2() {
-    currentElement?.focus();
-  }
-  function blur() {
-    currentElement?.blur();
-  }
-  return { isFocused, focus: focus2, blur, bind };
-}
-function FocusTrap(nodes, options = {}) {
-  const container = document.createElement("div");
-  container.setAttribute("data-sibu-focus-trap", "true");
-  container.appendChild(nodes);
-  const previouslyFocused = document.activeElement;
-  container.addEventListener("keydown", (e) => {
-    if (e.key !== "Tab") return;
-    const focusable = container.querySelectorAll(
-      'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
-    );
-    if (focusable.length === 0) return;
-    const first = focusable[0];
-    const last = focusable[focusable.length - 1];
-    if (e.shiftKey) {
-      if (document.activeElement === first) {
-        e.preventDefault();
-        last.focus();
-      }
-    } else {
-      if (document.activeElement === last) {
-        e.preventDefault();
-        first.focus();
-      }
-    }
-  });
-  if (options.autoFocus !== false) {
-    queueMicrotask(() => {
-      const first = container.querySelector(
-        'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
-      );
-      first?.focus();
-    });
-  }
-  if (options.restoreFocus !== false) {
-    const observer = new MutationObserver((mutations) => {
-      for (const mutation of mutations) {
-        for (const removed of Array.from(mutation.removedNodes)) {
-          if (removed === container || removed.contains(container)) {
-            previouslyFocused?.focus();
-            observer.disconnect();
-            return;
-          }
-        }
-      }
-    });
-    queueMicrotask(() => {
-      if (container.parentNode) {
-        observer.observe(container.parentNode, { childList: true });
-      }
-    });
-  }
-  return container;
-}
-function hotkey(key, handler, options = {}) {
-  const listener = (e) => {
-    const ke = e;
-    if (ke.key.toLowerCase() !== key.toLowerCase()) return;
-    if (options.ctrl && !ke.ctrlKey) return;
-    if (!options.ctrl && ke.ctrlKey) return;
-    if (options.shift && !ke.shiftKey) return;
-    if (!options.shift && ke.shiftKey) return;
-    if (options.alt && !ke.altKey) return;
-    if (!options.alt && ke.altKey) return;
-    if (options.meta && !ke.metaKey) return;
-    if (!options.meta && ke.metaKey) return;
-    handler(ke);
-  };
-  document.addEventListener("keydown", listener);
-  return () => document.removeEventListener("keydown", listener);
-}
-function announce(message, priority = "polite") {
-  let region = document.getElementById(`sibu-announce-${priority}`);
-  if (!region) {
-    region = document.createElement("div");
-    region.id = `sibu-announce-${priority}`;
-    region.setAttribute("aria-live", priority);
-    region.setAttribute("aria-atomic", "true");
-    region.setAttribute("role", priority === "assertive" ? "alert" : "status");
-    region.style.cssText = "position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;";
-    document.body.appendChild(region);
-  }
-  region.textContent = "";
-  requestAnimationFrame(() => {
-    if (region) region.textContent = message;
-  });
-}
-
-// src/ui/scopedStyle.ts
-var scopeCounter = 0;
-function scopedStyle(css) {
-  const id = `sibu-s${scopeCounter++}`;
-  const attr = `data-${id}`;
-  const scopedCSS = css.replace(/([^\r\n,{}]+)(,(?=[^}]*{)|\s*{)/g, (match, selector, delimiter) => {
-    const trimmed = selector.trim();
-    if (trimmed.startsWith("@") || trimmed.startsWith("from") || trimmed.startsWith("to") || /^\d+%$/.test(trimmed)) {
-      return match;
-    }
-    return `${trimmed}[${attr}]${delimiter}`;
-  });
-  if (typeof document !== "undefined") {
-    const styleEl = document.createElement("style");
-    styleEl.setAttribute("data-sibu-scope", id);
-    styleEl.textContent = scopedCSS;
-    document.head.appendChild(styleEl);
-  }
-  return { scope: id, attr };
-}
-function withScopedStyle(css, component) {
-  let style = null;
-  return (props) => {
-    if (!style) {
-      style = scopedStyle(css);
-    }
-    const el = component(props);
-    applyScopeRecursive(el, style.attr);
-    return el;
-  };
-}
-function applyScopeRecursive(element, attr) {
-  element.setAttribute(attr, "");
-  for (const child of Array.from(element.children)) {
-    if (child instanceof HTMLElement) {
-      applyScopeRecursive(child, attr);
-    }
-  }
-}
-function removeScopedStyle(scopeId) {
-  const el = document.head.querySelector(`style[data-sibu-scope="${scopeId}"]`);
-  if (el) el.remove();
-}
-
-// src/ui/reactiveAttr.ts
-function bindAttrs(el, attrs) {
-  const teardowns = [];
-  for (const [attr, value] of Object.entries(attrs)) {
-    if (typeof value === "function") {
-      const teardown = bindAttribute(el, attr, value);
-      teardowns.push(teardown);
-    } else if (typeof value === "boolean") {
-      if (value) {
-        el.setAttribute(attr, "");
-      } else {
-        el.removeAttribute(attr);
-      }
-    } else {
-      el.setAttribute(attr, String(value));
-    }
-  }
-  return () => {
-    for (const td of teardowns) {
-      td();
-    }
-  };
-}
-function bindBoolAttr(el, attr, getter) {
-  if (typeof getter !== "function") {
-    if (getter) {
-      el.setAttribute(attr, "");
-    } else {
-      el.removeAttribute(attr);
-    }
-    return () => {
-    };
-  }
-  const reactiveGetter = getter;
-  function commit() {
-    let value;
-    try {
-      value = reactiveGetter();
-    } catch {
-      return;
-    }
-    if (value) {
-      el.setAttribute(attr, "");
-    } else {
-      el.removeAttribute(attr);
-    }
-  }
-  const teardown = track(commit);
-  return teardown;
-}
-function bindData(el, key, getter) {
-  const dataAttr = `data-${key}`;
-  if (typeof getter !== "function") {
-    el.setAttribute(dataAttr, String(getter));
-    return () => {
-    };
-  }
-  return bindAttribute(el, dataAttr, getter);
-}
-
-// src/ui/dialog.ts
-function dialog() {
-  const [isOpen, setIsOpen] = signal(false);
-  let listenerAttached = false;
-  function handleKeydown(event) {
-    if (event.key === "Escape") {
-      close();
-    }
-  }
-  function open() {
-    setIsOpen(true);
-    if (typeof window !== "undefined" && !listenerAttached) {
-      window.addEventListener("keydown", handleKeydown);
-      listenerAttached = true;
-    }
-  }
-  function close() {
-    setIsOpen(false);
-    if (typeof window !== "undefined" && listenerAttached) {
-      window.removeEventListener("keydown", handleKeydown);
-      listenerAttached = false;
-    }
-  }
-  function toggle() {
-    if (isOpen()) {
-      close();
-    } else {
-      open();
-    }
-  }
-  return { open, close, isOpen, toggle };
-}
-
-// src/ui/toast.ts
-var toastCounter = 0;
-function toast(options) {
-  const duration = options?.duration ?? 3e3;
-  const maxToasts = options?.maxToasts ?? Infinity;
-  const [toasts, setToasts] = signal([]);
-  const timers = /* @__PURE__ */ new Map();
-  function show(message, type) {
-    const id = `toast-${++toastCounter}`;
-    const toast2 = { id, message, type };
-    setToasts((prev) => {
-      const next = [...prev, toast2];
-      if (next.length > maxToasts) {
-        const removed = next.splice(0, next.length - maxToasts);
-        for (const r of removed) {
-          clearTimerForToast(r.id);
-        }
-      }
-      return next;
-    });
-    if (duration > 0) {
-      const timer = setTimeout(() => {
-        dismiss(id);
-      }, duration);
-      timers.set(id, timer);
-    }
-    return id;
-  }
-  function dismiss(id) {
-    clearTimerForToast(id);
-    setToasts((prev) => prev.filter((t) => t.id !== id));
-  }
-  function dismissAll() {
-    for (const timer of timers.values()) {
-      clearTimeout(timer);
-    }
-    timers.clear();
-    setToasts([]);
-  }
-  function clearTimerForToast(id) {
-    const timer = timers.get(id);
-    if (timer !== void 0) {
-      clearTimeout(timer);
-      timers.delete(id);
-    }
-  }
-  return { toasts, show, dismiss, dismissAll };
-}
-
-// src/ui/infiniteScroll.ts
-function infiniteScroll(options) {
-  const { onLoadMore, hasMore, threshold = 0 } = options;
-  const [loading, setLoading] = signal(false);
-  const sentinelRef = { current: null };
-  let observer = null;
-  let disposed = false;
-  function createObserver() {
-    if (typeof IntersectionObserver === "undefined") return;
-    observer = new IntersectionObserver(
-      (entries) => {
-        const entry = entries[0];
-        if (entry?.isIntersecting && !loading() && hasMore() && !disposed) {
-          loadMore();
-        }
-      },
-      { threshold }
-    );
-    if (sentinelRef.current) {
-      observer.observe(sentinelRef.current);
-    }
-  }
-  async function loadMore() {
-    setLoading(true);
-    try {
-      await onLoadMore();
-    } finally {
-      setLoading(false);
-    }
-  }
-  const originalRef = sentinelRef;
-  let _current = null;
-  Object.defineProperty(originalRef, "current", {
-    get() {
-      return _current;
-    },
-    set(el) {
-      _current = el;
-      if (observer) {
-        observer.disconnect();
-        observer = null;
-      }
-      if (el && !disposed) {
-        createObserver();
-      }
-    },
-    configurable: true
-  });
-  function dispose() {
-    disposed = true;
-    if (observer) {
-      observer.disconnect();
-      observer = null;
-    }
-  }
-  return { sentinelRef: originalRef, loading, dispose };
-}
-
-// src/ui/pagination.ts
-function pagination(options) {
-  const pageSizeValue = options.pageSize ?? 10;
-  const [page, setPage] = signal(options.initialPage ?? 1);
-  const [pageSize] = signal(pageSizeValue);
-  const totalPages = derived(() => {
-    const total = options.totalItems();
-    return Math.max(1, Math.ceil(total / pageSizeValue));
-  });
-  const startIndex = derived(() => {
-    return (page() - 1) * pageSizeValue;
-  });
-  const endIndex = derived(() => {
-    const end = page() * pageSizeValue;
-    const total = options.totalItems();
-    return Math.min(end, total);
-  });
-  function next() {
-    if (page() < totalPages()) {
-      setPage((p) => p + 1);
-    }
-  }
-  function prev() {
-    if (page() > 1) {
-      setPage((p) => p - 1);
-    }
-  }
-  function goTo(target) {
-    const clamped = Math.max(1, Math.min(target, totalPages()));
-    setPage(clamped);
-  }
-  return { page, pageSize, totalPages, next, prev, goTo, startIndex, endIndex };
-}
-
-// src/ui/eventBus.ts
-function eventBus() {
-  const listeners = /* @__PURE__ */ new Map();
-  function on(event, handler) {
-    let set = listeners.get(event);
-    if (!set) {
-      set = /* @__PURE__ */ new Set();
-      listeners.set(event, set);
-    }
-    set.add(handler);
-    return () => off(event, handler);
-  }
-  function emit(event, data) {
-    const set = listeners.get(event);
-    if (set) {
-      for (const handler of set) {
-        handler(data);
-      }
-    }
-  }
-  function off(event, handler) {
-    const set = listeners.get(event);
-    if (set) {
-      set.delete(handler);
-      if (set.size === 0) {
-        listeners.delete(event);
-      }
-    }
-  }
-  function clear() {
-    listeners.clear();
-  }
-  return { on, emit, off, clear };
-}
-
-// src/platform/customElement.ts
-function defineElement(name, component, options = {}) {
-  if (customElements.get(name)) return;
-  const observed = options.observedAttributes || [];
-  class SibuElement extends HTMLElement {
-    constructor() {
-      super();
-      this._rendered = false;
-      if (options.shadow !== false) {
-        this._root = this.attachShadow({ mode: options.mode || "open" });
-      } else {
-        this._root = this;
-      }
-    }
-    static get observedAttributes() {
-      return observed;
-    }
-    connectedCallback() {
-      this._render();
-    }
-    disconnectedCallback() {
-      if (this._root instanceof ShadowRoot) {
-        this._root.innerHTML = "";
-      }
-      this._rendered = false;
-    }
-    attributeChangedCallback() {
-      if (this._rendered) {
-        this._render();
-      }
-    }
-    _render() {
-      const props = this._getProps();
-      if (this._root instanceof ShadowRoot) {
-        this._root.innerHTML = "";
-      } else {
-        while (this._root.firstChild) {
-          this._root.removeChild(this._root.firstChild);
-        }
-      }
-      if (options.styles && this._root instanceof ShadowRoot) {
-        const styleEl = document.createElement("style");
-        styleEl.textContent = options.styles;
-        this._root.appendChild(styleEl);
-      }
-      const el = component(props, this);
-      this._root.appendChild(el);
-      this._rendered = true;
-    }
-    _getProps() {
-      const props = {};
-      for (const attr of this.attributes) {
-        props[attr.name] = attr.value;
-      }
-      return props;
-    }
-  }
-  customElements.define(name, SibuElement);
-}
-function svgElement(tag, props = {}, ...nodes) {
-  const SVG_NS = "http://www.w3.org/2000/svg";
-  const el = document.createElementNS(SVG_NS, tag);
-  for (const [key, value] of Object.entries(props)) {
-    if (key === "nodes") continue;
-    if (typeof value === "function" && key.startsWith("on")) {
-      el.addEventListener(key.slice(2).toLowerCase(), value);
-    } else if (value != null) {
-      el.setAttribute(key, String(value));
-    }
-  }
-  for (const child of nodes) {
-    if (typeof child === "string") {
-      el.appendChild(document.createTextNode(child));
-    } else if (child instanceof Node) {
-      el.appendChild(child);
-    }
-  }
-  return el;
-}
-
-export {
-  required,
-  minLength,
-  maxLength,
-  matchesPattern,
-  email,
-  min,
-  max,
-  custom,
-  form,
-  VirtualList,
-  intersection,
-  lazyLoad,
-  inputMask,
-  phoneMask,
-  dateMask,
-  creditCardMask,
-  timeMask,
-  ssnMask,
-  zipMask,
-  aria,
-  focus,
-  FocusTrap,
-  hotkey,
-  announce,
-  scopedStyle,
-  withScopedStyle,
-  removeScopedStyle,
-  bindAttrs,
-  bindBoolAttr,
-  bindData,
-  dialog,
-  toast,
-  infiniteScroll,
-  pagination,
-  eventBus,
-  defineElement,
-  svgElement
-};