@t007/input 0.0.1 → 0.0.2

package/dist/index.global.js

@@ -1,5 +1,6 @@
-"use strict";
-(() => {
+(function () {
+  'use strict';
+
   // ../utils/dist/index.js
   function isSameURL(src1, src2) {
     if (typeof src1 !== "string" || typeof src2 !== "string" || !src1 || !src2) return false;
@@ -20,7 +21,7 @@
     for (const k of Object.keys(styles)) if (styles[k] !== void 0) el.style[k] = styles[k];
   }
   function loadResource(src, type = "style", { module, media, crossOrigin, integrity, referrerPolicy, nonce, fetchPriority, attempts = 3, retryKey = false } = {}, w = window) {
-    w.t007 ??= {}, w.t007._resourceCache ??= {};
+    w.t007._resourceCache ??= {};
     if (w.t007._resourceCache[src]) return w.t007._resourceCache[src];
     const existing = type === "script" ? Array.prototype.find.call(w.document.scripts, (s) => isSameURL(s.src, src)) : type === "style" ? Array.prototype.find.call(w.document.styleSheets, (s) => isSameURL(s.href, src)) : null;
     if (existing) return w.t007._resourceCache[src] = Promise.resolve(existing);
@@ -44,20 +45,20 @@
     });
     return w.t007._resourceCache[src];
   }
-  var _SCROLLERS = /* @__PURE__ */ new WeakMap();
-  var _SCROLLER_R_OBSERVER = typeof window !== "undefined" ? new ResizeObserver((entries) => entries.forEach(({ target }) => _SCROLLERS.get(target)?.update())) : null;
-  var _SCROLLER_M_OBSERVER = typeof window !== "undefined" ? new MutationObserver((entries) => {
-    const els = /* @__PURE__ */ new Set();
-    for (const entry of entries) {
-      let node = entry.target instanceof Element ? entry.target : null;
-      while (node && !_SCROLLERS.has(node)) node = node.parentElement;
-      if (node) els.add(node);
-    }
-    for (const el of els) _SCROLLERS.get(el)?.update();
-  }) : null;
   function initScrollAssist(el, { pxPerSecond = 80, assistClassName = "tmg-video-controls-scroll-assist", vertical = true, horizontal = true } = {}) {
+    t007._scrollers ??= /* @__PURE__ */ new WeakMap();
+    t007._scroller_r_observer ??= new ResizeObserver((entries) => entries.forEach(({ target }) => t007._scrollers.get(target)?.update()));
+    t007._scroller_m_observer ??= new MutationObserver((entries) => {
+      const els = /* @__PURE__ */ new Set();
+      for (const entry of entries) {
+        let node = entry.target instanceof Element ? entry.target : null;
+        while (node && !t007._scrollers.has(node)) node = node.parentElement;
+        if (node) els.add(node);
+      }
+      for (const el2 of els) t007._scrollers.get(el2)?.update();
+    });
     const parent = el?.parentElement;
-    if (!parent || _SCROLLERS.has(el)) return;
+    if (!parent || t007._scrollers.has(el)) return;
     const assist = {};
     let scrollId = null, last = performance.now(), assistWidth = 20, assistHeight = 20;
     const update = () => {
@@ -101,20 +102,28 @@
     if (horizontal) ["left", "right"].forEach(addAssist);
     if (vertical) ["up", "down"].forEach(addAssist);
     el.addEventListener("scroll", update);
-    _SCROLLER_R_OBSERVER.observe(el);
-    _SCROLLER_M_OBSERVER.observe(el, { childList: true, subtree: true, characterData: true });
-    _SCROLLERS.set(el, {
+    t007._scroller_r_observer.observe(el);
+    t007._scroller_m_observer.observe(el, { childList: true, subtree: true, characterData: true });
+    t007._scrollers.set(el, {
       update,
       destroy() {
         stop();
         el.removeEventListener("scroll", update);
-        _SCROLLER_R_OBSERVER.unobserve(el);
-        _SCROLLERS.delete(el);
+        t007._scroller_r_observer.unobserve(el);
+        t007._scrollers.delete(el);
         Object.values(assist).forEach((a) => a.remove());
       }
     });
-    update();
-    return _SCROLLERS.get(el);
+    return update(), t007._scrollers.get(el);
+  }
+  if (typeof window !== "undefined") {
+    window.t007 ??= {};
+    window.T007_TOAST_JS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/toast@latest`;
+    window.T007_INPUT_JS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/input@latest`;
+    window.T007_DIALOG_JS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/dialog@latest`;
+    window.T007_TOAST_CSS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/toast@latest/dist/style.css`;
+    window.T007_INPUT_CSS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/input@latest/dist/style.css`;
+    window.T007_DIALOG_CSS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/dialog@latest/dist/style.css`;
   }
 
   // src/index.js
@@ -412,15 +421,14 @@
     }
   };
   if (typeof window !== "undefined") {
-    window.t007 ??= {};
     t007.FM = T007_Form_Manager;
     t007.field = t007.FM.field;
     t007.handleFormValidation = t007.FM.handleFormValidation;
-    window.T007_INPUT_CSS_SRC ??= `https://unpkg.com/@t007/input@latest/style.css`;
     window.field ??= t007.field;
     window.handleFormValidation ??= t007.handleFormValidation;
     console.log("%cT007 Input helpers attached to window!", "color: darkturquoise");
     loadResource(T007_INPUT_CSS_SRC);
     t007.FM.init();
   }
+
 })();

package/dist/index.js

@@ -1,5 +1,129 @@
+// ../utils/dist/index.js
+function isSameURL(src1, src2) {
+  if (typeof src1 !== "string" || typeof src2 !== "string" || !src1 || !src2) return false;
+  try {
+    const u1 = new URL(src1, window.location.href), u2 = new URL(src2, window.location.href);
+    return decodeURIComponent(u1.origin + u1.pathname) === decodeURIComponent(u2.origin + u2.pathname);
+  } catch {
+    return src1.replace(/\\/g, "/").split("?")[0].trim() === src2.replace(/\\/g, "/").split("?")[0].trim();
+  }
+}
+function createEl(tag, props = {}, dataset = {}, styles = {}) {
+  return assignEl(tag ? document?.createElement(tag) : void 0, props, dataset, styles) ?? null;
+}
+function assignEl(el, props = {}, dataset = {}, styles = {}) {
+  if (!el) return;
+  for (const k of Object.keys(props)) if (props[k] !== void 0) el[k] = props[k];
+  for (const k of Object.keys(dataset)) if (dataset[k] !== void 0) el.dataset[k] = String(dataset[k]);
+  for (const k of Object.keys(styles)) if (styles[k] !== void 0) el.style[k] = styles[k];
+}
+function loadResource(src, type = "style", { module, media, crossOrigin, integrity, referrerPolicy, nonce, fetchPriority, attempts = 3, retryKey = false } = {}, w = window) {
+  w.t007._resourceCache ??= {};
+  if (w.t007._resourceCache[src]) return w.t007._resourceCache[src];
+  const existing = type === "script" ? Array.prototype.find.call(w.document.scripts, (s) => isSameURL(s.src, src)) : type === "style" ? Array.prototype.find.call(w.document.styleSheets, (s) => isSameURL(s.href, src)) : null;
+  if (existing) return w.t007._resourceCache[src] = Promise.resolve(existing);
+  w.t007._resourceCache[src] = new Promise((resolve, reject) => {
+    (function tryLoad(remaining, el) {
+      const onerror = () => {
+        el?.remove?.();
+        if (remaining > 1) {
+          setTimeout(tryLoad, 1e3, remaining - 1);
+          console.warn(`Retrying ${type} load (${attempts - remaining + 1}): ${src}...`);
+        } else {
+          delete w.t007._resourceCache[src];
+          reject(new Error(`${type} load failed after ${attempts} attempts: ${src}`));
+        }
+      };
+      const url = retryKey && remaining < attempts ? `${src}${src.includes("?") ? "&" : "?"}_${retryKey}=${Date.now()}` : src;
+      if (type === "script") w.document.body.append(el = createEl("script", { src: url, type: module ? "module" : "text/javascript", crossOrigin, integrity, referrerPolicy, nonce, fetchPriority, onload: () => resolve(el), onerror }) || "");
+      else if (type === "style") w.document.head.append(el = createEl("link", { rel: "stylesheet", href: url, media, crossOrigin, integrity, referrerPolicy, nonce, fetchPriority, onload: () => resolve(el), onerror }) || "");
+      else reject(new Error(`Unsupported resource type: ${type}`));
+    })(attempts);
+  });
+  return w.t007._resourceCache[src];
+}
+function initScrollAssist(el, { pxPerSecond = 80, assistClassName = "tmg-video-controls-scroll-assist", vertical = true, horizontal = true } = {}) {
+  t007._scrollers ??= /* @__PURE__ */ new WeakMap();
+  t007._scroller_r_observer ??= new ResizeObserver((entries) => entries.forEach(({ target }) => t007._scrollers.get(target)?.update()));
+  t007._scroller_m_observer ??= new MutationObserver((entries) => {
+    const els = /* @__PURE__ */ new Set();
+    for (const entry of entries) {
+      let node = entry.target instanceof Element ? entry.target : null;
+      while (node && !t007._scrollers.has(node)) node = node.parentElement;
+      if (node) els.add(node);
+    }
+    for (const el2 of els) t007._scrollers.get(el2)?.update();
+  });
+  const parent = el?.parentElement;
+  if (!parent || t007._scrollers.has(el)) return;
+  const assist = {};
+  let scrollId = null, last = performance.now(), assistWidth = 20, assistHeight = 20;
+  const update = () => {
+    const hasInteractive = !!parent.querySelector('button, a[href], input, select, textarea, [contenteditable="true"], [tabindex]:not([tabindex="-1"])');
+    if (horizontal) {
+      const w = assist.left?.offsetWidth || assistWidth, check = hasInteractive ? el.clientWidth < w * 2 : false;
+      assist.left.style.display = check ? "none" : el.scrollLeft > 0 ? "block" : "none";
+      assist.right.style.display = check ? "none" : el.scrollLeft + el.clientWidth < el.scrollWidth - 1 ? "block" : "none";
+      assistWidth = w;
+    }
+    if (vertical) {
+      const h = assist.up?.offsetHeight || assistHeight, check = hasInteractive ? el.clientHeight < h * 2 : false;
+      assist.up.style.display = check ? "none" : el.scrollTop > 0 ? "block" : "none";
+      assist.down.style.display = check ? "none" : el.scrollTop + el.clientHeight < el.scrollHeight - 1 ? "block" : "none";
+      assistHeight = h;
+    }
+  };
+  const scroll = (dir) => {
+    const frame = () => {
+      const now = performance.now(), dt = now - last;
+      last = now;
+      const d = pxPerSecond * dt / 1e3;
+      if (dir === "left") el.scrollLeft = Math.max(0, el.scrollLeft - d);
+      if (dir === "right") el.scrollLeft = Math.min(el.scrollWidth - el.clientWidth, el.scrollLeft + d);
+      if (dir === "up") el.scrollTop = Math.max(0, el.scrollTop - d);
+      if (dir === "down") el.scrollTop = Math.min(el.scrollHeight - el.clientHeight, el.scrollTop + d);
+      scrollId = requestAnimationFrame(frame);
+    };
+    last = performance.now();
+    frame();
+  };
+  const stop = () => (cancelAnimationFrame(scrollId ?? 0), scrollId = null);
+  const addAssist = (dir) => {
+    const div = createEl("div", { className: assistClassName }, { scrollDirection: dir }, { display: "none" });
+    if (!div) return;
+    ["pointerenter", "dragenter"].forEach((evt) => div.addEventListener(evt, () => scroll(dir)));
+    ["pointerleave", "pointerup", "pointercancel", "dragleave", "dragend"].forEach((evt) => div.addEventListener(evt, stop));
+    dir === "left" || dir === "up" ? parent.insertBefore(div, el) : parent.append(div);
+    assist[dir] = div;
+  };
+  if (horizontal) ["left", "right"].forEach(addAssist);
+  if (vertical) ["up", "down"].forEach(addAssist);
+  el.addEventListener("scroll", update);
+  t007._scroller_r_observer.observe(el);
+  t007._scroller_m_observer.observe(el, { childList: true, subtree: true, characterData: true });
+  t007._scrollers.set(el, {
+    update,
+    destroy() {
+      stop();
+      el.removeEventListener("scroll", update);
+      t007._scroller_r_observer.unobserve(el);
+      t007._scrollers.delete(el);
+      Object.values(assist).forEach((a) => a.remove());
+    }
+  });
+  return update(), t007._scrollers.get(el);
+}
+if (typeof window !== "undefined") {
+  window.t007 ??= {};
+  window.T007_TOAST_JS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/toast@latest`;
+  window.T007_INPUT_JS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/input@latest`;
+  window.T007_DIALOG_JS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/dialog@latest`;
+  window.T007_TOAST_CSS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/toast@latest/dist/style.css`;
+  window.T007_INPUT_CSS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/input@latest/dist/style.css`;
+  window.T007_DIALOG_CSS_SRC ??= `https://cdn.jsdelivr.net/npm/@t007/dialog@latest/dist/style.css`;
+}
+
 // src/index.js
-import { createEl, loadResource, initScrollAssist } from "@t007/utils";
 var T007_Form_Manager = {
   forms: document.getElementsByClassName("t007-input-form"),
   violationKeys: ["valueMissing", "typeMismatch", "patternMismatch", "stepMismatch", "tooShort", "tooLong", "rangeUnderflow", "rangeOverflow", "badInput", "customError"],
@@ -294,11 +418,9 @@ var T007_Form_Manager = {
   }
 };
 if (typeof window !== "undefined") {
-  window.t007 ??= {};
   t007.FM = T007_Form_Manager;
   t007.field = t007.FM.field;
   t007.handleFormValidation = t007.FM.handleFormValidation;
-  window.T007_INPUT_CSS_SRC ??= `https://unpkg.com/@t007/input@latest/style.css`;
   window.field ??= t007.field;
   window.handleFormValidation ??= t007.handleFormValidation;
   console.log("%cT007 Input helpers attached to window!", "color: darkturquoise");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@t007/input",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "description": "A lightweight, pure JS input system.",
   "author": "Oketade Oluwatobiloba <tobioketade007@gmail.com>",
   "license": "MIT",
@@ -17,7 +17,6 @@
   "main": "./dist/index.js",
   "module": "./dist/index.js",
   "browser": "./dist/index.global.js",
-  "unpkg": "./dist/index.global.js",
   "types": "./src/ts/types/index.d.ts",
   "style": "./src/css/index.css",
   "sideEffects": [
@@ -32,14 +31,19 @@
     "./style.css": "./src/css/index.css"
   },
   "scripts": {
-    "build": "tsup src/index.js --format esm,iife --clean"
+    "build": "tsup src/index.js --format esm,iife --clean --treeshake"
+  },
+  "tsup": {
+    "noExternal": [
+      "@t007/utils"
+    ]
   },
   "files": [
     "dist",
     "./src/ts/types/index.d.ts",
     "./src/css/index.css"
   ],
-"keywords": [
+  "keywords": [
     "input",
     "form",
     "form-validation",
@@ -54,4 +58,4 @@
   "dependencies": {
     "@t007/utils": "*"
   }
-}
+}

package/src/ts/types/index.d.ts

@@ -59,9 +59,6 @@ declare global {
   }
 
   interface Window {
-    T007_INPUT_CSS_SRC?: string;
-    T007_INPUT_JS_SRC?: string;
-
     field?: T007Namespace["field"];
     handleFormValidation?: T007Namespace["handleFormValidation"];
   }