@oscarpalmer/atoms 0.9.1 → 0.11.0

package/dist/js/element/focusable.mjs

@@ -0,0 +1,152 @@
+// src/js/element/focusable.ts
+var _getItem = function(type, element) {
+  return {
+    element,
+    tabIndex: type === "focusable" ? -1 : _getTabIndex(element)
+  };
+};
+var _getTabIndex = function(element) {
+  if (element.tabIndex < 0 && (audioDetailsVideoPattern.test(element.tagName) || _isEditable(element)) && !_hasTabIndex(element)) {
+    return 0;
+  }
+  return element.tabIndex;
+};
+var _getValidElements = function(type, parent, filters) {
+  const items = Array.from(parent.querySelectorAll(selector)).map((element) => _getItem(type, element)).filter((item) => !filters.some((filter) => filter(item)));
+  if (type === "focusable") {
+    return items.map((item) => item.element);
+  }
+  const indiced = [];
+  const zeroed = [];
+  const { length } = items;
+  let position = Number(length);
+  while (position--) {
+    const index = length - position - 1;
+    const item = items[index];
+    if (item.tabIndex === 0) {
+      zeroed.push(item.element);
+    } else {
+      indiced[item.tabIndex] = [
+        ...indiced[item.tabIndex] ?? [],
+        item.element
+      ];
+    }
+  }
+  return [...indiced.flat(), ...zeroed];
+};
+var _hasTabIndex = function(element) {
+  return !Number.isNaN(Number.parseInt(element.getAttribute("tabindex"), 10));
+};
+var _isDisabled = function(item) {
+  if (inputPattern.test(item.element.tagName) && _isDisabledFromFieldset(item.element)) {
+    return true;
+  }
+  return (item.element.disabled ?? false) || item.element.getAttribute("aria-disabled") === "true";
+};
+var _isDisabledFromFieldset = function(element) {
+  let parent = element.parentElement;
+  while (parent !== null) {
+    if (parent instanceof HTMLFieldSetElement && parent.disabled) {
+      const children = Array.from(parent.children);
+      for (const child of children) {
+        if (child instanceof HTMLLegendElement) {
+          return parent.matches("fieldset[disabled] *") ? true : !child.contains(element);
+        }
+      }
+      return true;
+    }
+    parent = parent.parentElement;
+  }
+  return false;
+};
+var _isEditable = function(element) {
+  return booleanPattern.test(element.getAttribute("contenteditable"));
+};
+var _isHidden = function(item) {
+  if ((item.element.hidden ?? false) || item.element instanceof HTMLInputElement && item.element.type === "hidden") {
+    return true;
+  }
+  const isDirectSummary = item.element.matches("details > summary:first-of-type");
+  const nodeUnderDetails = isDirectSummary ? item.element.parentElement : item.element;
+  if (nodeUnderDetails?.matches("details:not([open]) *") ?? false) {
+    return true;
+  }
+  const style = getComputedStyle(item.element);
+  if (style.display === "none" || style.visibility === "hidden") {
+    return true;
+  }
+  const { height, width } = item.element.getBoundingClientRect();
+  return height === 0 && width === 0;
+};
+var _isInert = function(item) {
+  return (item.element.inert ?? false) || booleanPattern.test(item.element.getAttribute("inert")) || item.element.parentElement !== null && _isInert({
+    element: item.element.parentElement,
+    tabIndex: -1
+  });
+};
+var _isNotTabbable = function(item) {
+  return (item.tabIndex ?? -1) < 0;
+};
+var _isNotTabbableRadio = function(item) {
+  if (!(item.element instanceof HTMLInputElement) || item.element.type !== "radio" || !item.element.name || item.element.checked) {
+    return false;
+  }
+  const parent = item.element.form ?? item.element.getRootNode?.() ?? item.element.ownerDocument;
+  const realName = CSS?.escape?.(item.element.name) ?? item.element.name;
+  const radios = Array.from(parent.querySelectorAll(`input[type="radio"][name="${realName}"]`));
+  const checked = radios.find((radio) => radio.checked);
+  return checked !== undefined && checked !== item.element;
+};
+var _isSummarised = function(item) {
+  return item.element instanceof HTMLDetailsElement && Array.from(item.element.children).some((child) => summaryPattern.test(child.tagName));
+};
+var _isValidElement = function(element, filters) {
+  const item = _getItem("focusable", element);
+  return !filters.some((filter) => filter(item));
+};
+function getFocusableElements(parent) {
+  return _getValidElements("focusable", parent, focusableFilters);
+}
+function getTabbableElements(parent) {
+  return _getValidElements("tabbable", parent, tabbableFilters);
+}
+function isFocusableElement(element) {
+  return _isValidElement(element, focusableFilters);
+}
+function isTabbableElement(element) {
+  return _isValidElement(element, tabbableFilters);
+}
+var audioDetailsVideoPattern = /^(audio|details|video)$/i;
+var booleanPattern = /^(|true)$/i;
+var focusableFilters = [
+  _isDisabled,
+  _isInert,
+  _isHidden,
+  _isSummarised
+];
+var inputPattern = /^(button|input|select|textarea)$/i;
+var selector = [
+  '[contenteditable]:not([contenteditable="false"])',
+  "[tabindex]:not(slot)",
+  "a[href]",
+  "audio[controls]",
+  "button",
+  "details",
+  "details > summary:first-of-type",
+  "input",
+  "select",
+  "textarea",
+  "video[controls]"
+].map((selector2) => `${selector2}:not([inert])`).join(",");
+var summaryPattern = /^summary$/i;
+var tabbableFilters = [
+  _isNotTabbable,
+  _isNotTabbableRadio,
+  ...focusableFilters
+];
+export {
+  isTabbableElement,
+  isFocusableElement,
+  getTabbableElements,
+  getFocusableElements
+};

package/dist/js/element/index.js

@@ -0,0 +1,60 @@
+// src/js/element/index.ts
+function findElements(selector, context) {
+  const contexts = context === undefined ? [document] : findElements(context);
+  const elements = [];
+  if (typeof selector === "string") {
+    for (const context2 of contexts) {
+      elements.push(...Array.from(context2.querySelectorAll(selector) ?? []));
+    }
+    return elements;
+  }
+  const nodes = Array.isArray(selector) || selector instanceof NodeList ? selector : [selector];
+  for (const node of nodes) {
+    if (node instanceof Element && contexts.some((context2) => context2.contains(node))) {
+      elements.push(node);
+    }
+  }
+  return elements;
+}
+function findParentElement(origin, selector) {
+  if (origin == null || selector == null) {
+    return;
+  }
+  function matches(element) {
+    return typeof selector === "string" ? element.matches?.(selector) ?? false : typeof selector === "function" ? selector(element) : false;
+  }
+  if (matches(origin)) {
+    return origin;
+  }
+  let parent = origin.parentElement;
+  while (parent != null && !matches(parent)) {
+    if (parent === document.body) {
+      return;
+    }
+    parent = parent.parentElement;
+  }
+  return parent ?? undefined;
+}
+function getElementUnderPointer(skipIgnore) {
+  const elements = Array.from(document.querySelectorAll(":hover")).filter((element) => {
+    if (/^head$/i.test(element.tagName)) {
+      return false;
+    }
+    const style = getComputedStyle(element);
+    return typeof skipIgnore === "boolean" && skipIgnore || style.pointerEvents !== "none" && style.visibility !== "hidden";
+  });
+  return elements[elements.length - 1];
+}
+function getTextDirection(element) {
+  const direction = element.getAttribute("dir");
+  if (direction !== null && /^(ltr|rtl)$/i.test(direction)) {
+    return direction.toLowerCase();
+  }
+  return getComputedStyle?.(element)?.direction === "rtl" ? "rtl" : "ltr";
+}
+export {
+  getTextDirection,
+  getElementUnderPointer,
+  findParentElement,
+  findElements
+};

package/dist/js/element/index.mjs

@@ -0,0 +1,60 @@
+// src/js/element/index.ts
+function findElements(selector, context) {
+  const contexts = context === undefined ? [document] : findElements(context);
+  const elements = [];
+  if (typeof selector === "string") {
+    for (const context2 of contexts) {
+      elements.push(...Array.from(context2.querySelectorAll(selector) ?? []));
+    }
+    return elements;
+  }
+  const nodes = Array.isArray(selector) || selector instanceof NodeList ? selector : [selector];
+  for (const node of nodes) {
+    if (node instanceof Element && contexts.some((context2) => context2.contains(node))) {
+      elements.push(node);
+    }
+  }
+  return elements;
+}
+function findParentElement(origin, selector) {
+  if (origin == null || selector == null) {
+    return;
+  }
+  function matches(element) {
+    return typeof selector === "string" ? element.matches?.(selector) ?? false : typeof selector === "function" ? selector(element) : false;
+  }
+  if (matches(origin)) {
+    return origin;
+  }
+  let parent = origin.parentElement;
+  while (parent != null && !matches(parent)) {
+    if (parent === document.body) {
+      return;
+    }
+    parent = parent.parentElement;
+  }
+  return parent ?? undefined;
+}
+function getElementUnderPointer(skipIgnore) {
+  const elements = Array.from(document.querySelectorAll(":hover")).filter((element) => {
+    if (/^head$/i.test(element.tagName)) {
+      return false;
+    }
+    const style = getComputedStyle(element);
+    return typeof skipIgnore === "boolean" && skipIgnore || style.pointerEvents !== "none" && style.visibility !== "hidden";
+  });
+  return elements[elements.length - 1];
+}
+function getTextDirection(element) {
+  const direction = element.getAttribute("dir");
+  if (direction !== null && /^(ltr|rtl)$/i.test(direction)) {
+    return direction.toLowerCase();
+  }
+  return getComputedStyle?.(element)?.direction === "rtl" ? "rtl" : "ltr";
+}
+export {
+  getTextDirection,
+  getElementUnderPointer,
+  findParentElement,
+  findElements
+};

package/dist/js/event.js

@@ -0,0 +1,16 @@
+// src/js/event.ts
+function getEventPosition(event) {
+  let x;
+  let y;
+  if (event instanceof MouseEvent) {
+    x = event.clientX;
+    y = event.clientY;
+  } else if (event instanceof TouchEvent) {
+    x = event.touches[0]?.clientX;
+    y = event.touches[0]?.clientY;
+  }
+  return typeof x === "number" && typeof y === "number" ? { x, y } : undefined;
+}
+export {
+  getEventPosition
+};

package/dist/js/event.mjs

@@ -0,0 +1,16 @@
+// src/js/event.ts
+function getEventPosition(event) {
+  let x;
+  let y;
+  if (event instanceof MouseEvent) {
+    x = event.clientX;
+    y = event.clientY;
+  } else if (event instanceof TouchEvent) {
+    x = event.touches[0]?.clientX;
+    y = event.touches[0]?.clientY;
+  }
+  return typeof x === "number" && typeof y === "number" ? { x, y } : undefined;
+}
+export {
+  getEventPosition
+};

package/dist/js/{atoms.js → index.js}

@@ -1,84 +1,3 @@
-// src/js/element/index.ts
-function findParentElement(origin, selector) {
-  if (origin == null || selector == null) {
-    return;
-  }
-  function matches(element) {
-    return typeof selector === "string" ? element.matches?.(selector) ?? false : typeof selector === "function" ? selector(element) : false;
-  }
-  if (matches(origin)) {
-    return origin;
-  }
-  let parent = origin.parentElement;
-  while (parent != null && !matches(parent)) {
-    if (parent === document.body) {
-      return;
-    }
-    parent = parent.parentElement;
-  }
-  return parent ?? undefined;
-}
-function getElementUnderPointer(skipIgnore) {
-  const elements = Array.from(document.querySelectorAll(":hover")).filter((element) => {
-    if (/^head$/i.test(element.tagName)) {
-      return false;
-    }
-    const style = getComputedStyle(element);
-    return typeof skipIgnore === "boolean" && skipIgnore || style.pointerEvents !== "none" && style.visibility !== "hidden";
-  });
-  return elements[elements.length - 1];
-}
-function getTextDirection(element) {
-  const direction = element.getAttribute("dir");
-  if (direction !== null && /^(ltr|rtl)$/i.test(direction)) {
-    return direction.toLowerCase();
-  }
-  return getComputedStyle?.(element)?.direction === "rtl" ? "rtl" : "ltr";
-}
-// src/js/event.ts
-function getPosition(event) {
-  let x;
-  let y;
-  if (event instanceof MouseEvent) {
-    x = event.clientX;
-    y = event.clientY;
-  } else if (event instanceof TouchEvent) {
-    x = event.touches[0]?.clientX;
-    y = event.touches[0]?.clientY;
-  }
-  return typeof x === "number" && typeof y === "number" ? { x, y } : undefined;
-}
-// src/js/number.ts
-function clampNumber(value, min, max) {
-  return Math.min(Math.max(getNumber(value), getNumber(min)), getNumber(max));
-}
-function getNumber(value) {
-  if (typeof value === "number") {
-    return value;
-  }
-  if (typeof value === "symbol") {
-    return NaN;
-  }
-  let parsed = value?.valueOf?.() ?? value;
-  if (typeof parsed === "object") {
-    parsed = parsed?.toString() ?? parsed;
-  }
-  if (typeof parsed !== "string") {
-    return parsed == null ? NaN : typeof parsed === "number" ? parsed : +parsed;
-  }
-  if (/^\s*0+\s*$/.test(parsed)) {
-    return 0;
-  }
-  const trimmed = parsed.trim();
-  if (trimmed.length === 0) {
-    return NaN;
-  }
-  const isBinary = /^0b[01]+$/i.test(trimmed);
-  if (isBinary || /^0o[0-7]+$/i.test(trimmed)) {
-    return parseInt(trimmed.slice(2), isBinary ? 2 : 8);
-  }
-  return +(/^0x[0-9a-f]+$/i.test(trimmed) ? trimmed : trimmed.replace(/_/g, ""));
-}
 // src/js/string.ts
 function createUuid() {
   return "10000000-1000-4000-8000-100000000000".replace(/[018]/g, (substring) => (substring ^ crypto.getRandomValues(new Uint8Array(1))[0] & 15 >> substring / 4).toString(16));
@@ -89,6 +8,7 @@ function getString(value) {
 function isNullableOrWhitespace(value) {
   return value == null || getString(value).trim().length === 0;
 }
+
 // src/js/value.ts
 var _getValue = function(data, key) {
   if (typeof data !== "object" || data === null || /^(__proto__|constructor|prototype)$/i.test(key)) {
@@ -155,8 +75,204 @@ function setValue(data, key, value) {
   }
   return data;
 }
+
+// src/js/number.ts
+function clampNumber(value, min, max) {
+  return Math.min(Math.max(getNumber(value), getNumber(min)), getNumber(max));
+}
+function getNumber(value) {
+  if (typeof value === "number") {
+    return value;
+  }
+  if (typeof value === "symbol") {
+    return NaN;
+  }
+  let parsed = value?.valueOf?.() ?? value;
+  if (typeof parsed === "object") {
+    parsed = parsed?.toString() ?? parsed;
+  }
+  if (typeof parsed !== "string") {
+    return parsed == null ? NaN : typeof parsed === "number" ? parsed : +parsed;
+  }
+  if (/^\s*0+\s*$/.test(parsed)) {
+    return 0;
+  }
+  const trimmed = parsed.trim();
+  if (trimmed.length === 0) {
+    return NaN;
+  }
+  const isBinary = /^0b[01]+$/i.test(trimmed);
+  if (isBinary || /^0o[0-7]+$/i.test(trimmed)) {
+    return parseInt(trimmed.slice(2), isBinary ? 2 : 8);
+  }
+  return +(/^0x[0-9a-f]+$/i.test(trimmed) ? trimmed : trimmed.replace(/_/g, ""));
+}
+
+// src/js/timer.ts
+function repeat(callback, options) {
+  const count = typeof options?.count === "number" ? options.count : Infinity;
+  return timer(callback, { ...{ count }, ...options ?? {} }).start();
+}
+var timer = function(callback, config) {
+  const options = {
+    afterCallback: typeof config.afterCallback === "function" ? config.afterCallback : undefined,
+    callback,
+    count: typeof config.count === "number" && config.count >= 1 ? config.count : 1,
+    interval: typeof config.interval === "number" && config.interval >= 0 ? config.interval : 0
+  };
+  const state = {
+    active: false
+  };
+  const timer2 = Object.create(null);
+  Object.defineProperties(timer2, {
+    active: {
+      get() {
+        return state.active;
+      }
+    },
+    restart: {
+      value() {
+        return work("restart", timer2, state, options);
+      }
+    },
+    start: {
+      value() {
+        return work("start", timer2, state, options);
+      }
+    },
+    stop: {
+      value() {
+        return work("stop", timer2, state, options);
+      }
+    }
+  });
+  return timer2;
+};
+function wait(callback, time) {
+  return timer(callback, {
+    count: 1,
+    interval: time
+  }).start();
+}
+var work = function(type, timer2, state, options) {
+  if (type === "start" && timer2.active || type === "stop" && !timer2.active) {
+    return timer2;
+  }
+  const { afterCallback, callback, count, interval } = options;
+  if (typeof state.frame === "number") {
+    cancelAnimationFrame(state.frame);
+    afterCallback?.(false);
+  }
+  if (type === "stop") {
+    state.active = false;
+    state.frame = undefined;
+    return timer2;
+  }
+  state.active = true;
+  const isRepeated = count > 0;
+  const milliseconds = 16.666666666666668;
+  let index = 0;
+  let start;
+  function step(timestamp) {
+    if (!state.active) {
+      return;
+    }
+    start ??= timestamp;
+    const elapsed = timestamp - start;
+    const maximum = elapsed + milliseconds;
+    const minimum = elapsed - milliseconds;
+    if (minimum < interval && interval < maximum) {
+      if (state.active) {
+        callback(isRepeated ? index : undefined);
+      }
+      index += 1;
+      if (index < count) {
+        start = undefined;
+      } else {
+        state.active = false;
+        state.frame = undefined;
+        afterCallback?.(true);
+        return;
+      }
+    }
+    state.frame = requestAnimationFrame(step);
+  }
+  state.frame = requestAnimationFrame(step);
+  return timer2;
+};
+
+// src/js/element/index.ts
+function findElements(selector, context) {
+  const contexts = context === undefined ? [document] : findElements(context);
+  const elements = [];
+  if (typeof selector === "string") {
+    for (const context2 of contexts) {
+      elements.push(...Array.from(context2.querySelectorAll(selector) ?? []));
+    }
+    return elements;
+  }
+  const nodes = Array.isArray(selector) || selector instanceof NodeList ? selector : [selector];
+  for (const node of nodes) {
+    if (node instanceof Element && contexts.some((context2) => context2.contains(node))) {
+      elements.push(node);
+    }
+  }
+  return elements;
+}
+function findParentElement(origin, selector) {
+  if (origin == null || selector == null) {
+    return;
+  }
+  function matches(element) {
+    return typeof selector === "string" ? element.matches?.(selector) ?? false : typeof selector === "function" ? selector(element) : false;
+  }
+  if (matches(origin)) {
+    return origin;
+  }
+  let parent = origin.parentElement;
+  while (parent != null && !matches(parent)) {
+    if (parent === document.body) {
+      return;
+    }
+    parent = parent.parentElement;
+  }
+  return parent ?? undefined;
+}
+function getElementUnderPointer(skipIgnore) {
+  const elements = Array.from(document.querySelectorAll(":hover")).filter((element) => {
+    if (/^head$/i.test(element.tagName)) {
+      return false;
+    }
+    const style = getComputedStyle(element);
+    return typeof skipIgnore === "boolean" && skipIgnore || style.pointerEvents !== "none" && style.visibility !== "hidden";
+  });
+  return elements[elements.length - 1];
+}
+function getTextDirection(element) {
+  const direction = element.getAttribute("dir");
+  if (direction !== null && /^(ltr|rtl)$/i.test(direction)) {
+    return direction.toLowerCase();
+  }
+  return getComputedStyle?.(element)?.direction === "rtl" ? "rtl" : "ltr";
+}
+
+// src/js/event.ts
+function getEventPosition(event) {
+  let x;
+  let y;
+  if (event instanceof MouseEvent) {
+    x = event.clientX;
+    y = event.clientY;
+  } else if (event instanceof TouchEvent) {
+    x = event.touches[0]?.clientX;
+    y = event.touches[0]?.clientY;
+  }
+  return typeof x === "number" && typeof y === "number" ? { x, y } : undefined;
+}
 export {
+  wait,
   setValue,
+  repeat,
   isObject,
   isNullableOrWhitespace,
   isNullable,
@@ -164,10 +280,11 @@ export {
   getValue,
   getTextDirection,
   getString,
-  getPosition,
   getNumber,
+  getEventPosition,
   getElementUnderPointer,
   findParentElement,
+  findElements,
   createUuid,
   clampNumber
 };

package/dist/js/index.mjs

@@ -0,0 +1,7 @@
+// src/js/index.ts
+export * from "./element";
+export * from "./event";
+export * from "./number";
+export * from "./string";
+export * from "./timer";
+export * from "./value";

package/dist/js/number.js

@@ -0,0 +1,35 @@
+// src/js/number.ts
+function clampNumber(value, min, max) {
+  return Math.min(Math.max(getNumber(value), getNumber(min)), getNumber(max));
+}
+function getNumber(value) {
+  if (typeof value === "number") {
+    return value;
+  }
+  if (typeof value === "symbol") {
+    return NaN;
+  }
+  let parsed = value?.valueOf?.() ?? value;
+  if (typeof parsed === "object") {
+    parsed = parsed?.toString() ?? parsed;
+  }
+  if (typeof parsed !== "string") {
+    return parsed == null ? NaN : typeof parsed === "number" ? parsed : +parsed;
+  }
+  if (/^\s*0+\s*$/.test(parsed)) {
+    return 0;
+  }
+  const trimmed = parsed.trim();
+  if (trimmed.length === 0) {
+    return NaN;
+  }
+  const isBinary = /^0b[01]+$/i.test(trimmed);
+  if (isBinary || /^0o[0-7]+$/i.test(trimmed)) {
+    return parseInt(trimmed.slice(2), isBinary ? 2 : 8);
+  }
+  return +(/^0x[0-9a-f]+$/i.test(trimmed) ? trimmed : trimmed.replace(/_/g, ""));
+}
+export {
+  getNumber,
+  clampNumber
+};

package/dist/js/number.mjs

@@ -0,0 +1,35 @@
+// src/js/number.ts
+function clampNumber(value, min, max) {
+  return Math.min(Math.max(getNumber(value), getNumber(min)), getNumber(max));
+}
+function getNumber(value) {
+  if (typeof value === "number") {
+    return value;
+  }
+  if (typeof value === "symbol") {
+    return NaN;
+  }
+  let parsed = value?.valueOf?.() ?? value;
+  if (typeof parsed === "object") {
+    parsed = parsed?.toString() ?? parsed;
+  }
+  if (typeof parsed !== "string") {
+    return parsed == null ? NaN : typeof parsed === "number" ? parsed : +parsed;
+  }
+  if (/^\s*0+\s*$/.test(parsed)) {
+    return 0;
+  }
+  const trimmed = parsed.trim();
+  if (trimmed.length === 0) {
+    return NaN;
+  }
+  const isBinary = /^0b[01]+$/i.test(trimmed);
+  if (isBinary || /^0o[0-7]+$/i.test(trimmed)) {
+    return parseInt(trimmed.slice(2), isBinary ? 2 : 8);
+  }
+  return +(/^0x[0-9a-f]+$/i.test(trimmed) ? trimmed : trimmed.replace(/_/g, ""));
+}
+export {
+  getNumber,
+  clampNumber
+};