nanosplash 3.0.1 → 3.0.2

package/coverage/index.html

@@ -23,30 +23,30 @@
         <div class='clearfix'>
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">99.81% </span>
+                <span class="strong">97.6% </span>
                 <span class="quiet">Statements</span>
-                <span class='fraction'>530/531</span>
+                <span class='fraction'>529/542</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">91.66% </span>
+                <span class="strong">78.75% </span>
                 <span class="quiet">Branches</span>
-                <span class='fraction'>66/72</span>
+                <span class='fraction'>63/80</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
                 <span class="strong">100% </span>
                 <span class="quiet">Functions</span>
-                <span class='fraction'>42/42</span>
+                <span class='fraction'>43/43</span>
             </div>
         
             
             <div class='fl pad1y space-right2'>
-                <span class="strong">99.81% </span>
+                <span class="strong">97.6% </span>
                 <span class="quiet">Lines</span>
-                <span class='fraction'>530/531</span>
+                <span class='fraction'>529/542</span>
             </div>
         
             
@@ -79,33 +79,63 @@
 </tr>
 </thead>
 <tbody><tr>
-	<td class="file high" data-value="core"><a href="core/index.html">core</a></td>
-	<td data-value="99.8" class="pic high">
+	<td class="file high" data-value="DomUtilities.ts"><a href="DomUtilities.ts.html">DomUtilities.ts</a></td>
+	<td data-value="96.89" class="pic high">
+	<div class="chart"><div class="cover-fill" style="width: 96%"></div><div class="cover-empty" style="width: 4%"></div></div>
+	</td>
+	<td data-value="96.89" class="pct high">96.89%</td>
+	<td data-value="161" class="abs high">156/161</td>
+	<td data-value="78.26" class="pct medium">78.26%</td>
+	<td data-value="23" class="abs medium">18/23</td>
+	<td data-value="100" class="pct high">100%</td>
+	<td data-value="10" class="abs high">10/10</td>
+	<td data-value="96.89" class="pct high">96.89%</td>
+	<td data-value="161" class="abs high">156/161</td>
+	</tr>
+
+<tr>
+	<td class="file high" data-value="Service.ts"><a href="Service.ts.html">Service.ts</a></td>
+	<td data-value="96.68" class="pic high">
+	<div class="chart"><div class="cover-fill" style="width: 96%"></div><div class="cover-empty" style="width: 4%"></div></div>
+	</td>
+	<td data-value="96.68" class="pct high">96.68%</td>
+	<td data-value="211" class="abs high">204/211</td>
+	<td data-value="67.74" class="pct medium">67.74%</td>
+	<td data-value="31" class="abs medium">21/31</td>
+	<td data-value="100" class="pct high">100%</td>
+	<td data-value="16" class="abs high">16/16</td>
+	<td data-value="96.68" class="pct high">96.68%</td>
+	<td data-value="211" class="abs high">204/211</td>
+	</tr>
+
+<tr>
+	<td class="file high" data-value="Splash.ts"><a href="Splash.ts.html">Splash.ts</a></td>
+	<td data-value="99.17" class="pic high">
 	<div class="chart"><div class="cover-fill" style="width: 99%"></div><div class="cover-empty" style="width: 1%"></div></div>
 	</td>
-	<td data-value="99.8" class="pct high">99.8%</td>
-	<td data-value="519" class="abs high">518/519</td>
-	<td data-value="91.54" class="pct high">91.54%</td>
-	<td data-value="71" class="abs high">65/71</td>
+	<td data-value="99.17" class="pct high">99.17%</td>
+	<td data-value="121" class="abs high">120/121</td>
+	<td data-value="94.11" class="pct high">94.11%</td>
+	<td data-value="17" class="abs high">16/17</td>
 	<td data-value="100" class="pct high">100%</td>
-	<td data-value="42" class="abs high">42/42</td>
-	<td data-value="99.8" class="pct high">99.8%</td>
-	<td data-value="519" class="abs high">518/519</td>
+	<td data-value="11" class="abs high">11/11</td>
+	<td data-value="99.17" class="pct high">99.17%</td>
+	<td data-value="121" class="abs high">120/121</td>
 	</tr>
 
 <tr>
-	<td class="file high" data-value="types"><a href="types/index.html">types</a></td>
+	<td class="file high" data-value="SplashQueue.ts"><a href="SplashQueue.ts.html">SplashQueue.ts</a></td>
 	<td data-value="100" class="pic high">
 	<div class="chart"><div class="cover-fill cover-full" style="width: 100%"></div><div class="cover-empty" style="width: 0%"></div></div>
 	</td>
 	<td data-value="100" class="pct high">100%</td>
-	<td data-value="12" class="abs high">12/12</td>
-	<td data-value="100" class="pct high">100%</td>
-	<td data-value="1" class="abs high">1/1</td>
+	<td data-value="49" class="abs high">49/49</td>
+	<td data-value="88.88" class="pct high">88.88%</td>
+	<td data-value="9" class="abs high">8/9</td>
 	<td data-value="100" class="pct high">100%</td>
-	<td data-value="0" class="abs high">0/0</td>
+	<td data-value="6" class="abs high">6/6</td>
 	<td data-value="100" class="pct high">100%</td>
-	<td data-value="12" class="abs high">12/12</td>
+	<td data-value="49" class="abs high">49/49</td>
 	</tr>
 
 </tbody>
@@ -116,7 +146,7 @@
             <div class='footer quiet pad2 space-top1 center small'>
                 Code coverage generated by
                 <a href="https://istanbul.js.org/" target="_blank" rel="noopener noreferrer">istanbul</a>
-                at 2023-09-06T08:51:33.390Z
+                at 2023-10-19T21:38:28.926Z
             </div>
         <script src="prettify.js"></script>
         <script>

package/dist/cjs/ns.cjs

@@ -0,0 +1,2 @@
+"use strict";var m=Object.defineProperty;var v=(s,e,t)=>e in s?m(s,e,{enumerable:!0,configurable:!0,writable:!0,value:t}):s[e]=t;var r=(s,e,t)=>(v(s,typeof e!="symbol"?e+"":e,t),t);Object.defineProperties(exports,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}});const y="3.0.1",a=class a{constructor(){r(this,"id");r(this,"element");this.element=w(),this.element.id=this.id=a.generateGUID()}static generateGUID(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,e=>{const t=Math.random()*16|0;return(e==="x"?t:t&3|8).toString(16)})}getId(){return this.id}getElement(){return this.element}getTextElement(){var e,t;return((t=(e=this.getElement())==null?void 0:e.firstElementChild)==null?void 0:t.firstElementChild)??null}setText(e){return this.getTextElement().innerText=e,e.length>0?this.showText():this.hideText(),this}showText(){return S(this.getTextElement()),this}hideText(){return I(this.getTextElement()),this}delete(){return this.id=null,this.element!==null&&(this.element.innerHTML="",this.element.remove(),this.element=null),this.element===null}};r(a,"NSClass","ns"),r(a,"NSHostClass","nsh");let o=a;function x(s){return(e=>(()=>e.firstChild)(e.innerHTML=s))(document.createElement("div"))}function w(){return x('<div class=ns><div class=nsc><div class=nst></div><div class=nss><svg viewBox="0 0 50 50"><circle class=path cx=25 cy=25 r=20 fill=none></circle></svg></div></div></div>')}function b(s,e){e.children.length>0?e.insertBefore(s,e.children.item(0)):e.append(s)}function p(s){s==null||s.classList.add(o.NSHostClass)}function g(s){s==null||s.classList.remove(o.NSHostClass)}function S(s){s.style.display="flex"}function I(s){s.style.display="none"}function h(s){switch(typeof s){case"object":const e=s===document.body,t=s instanceof Element;if(e||t)return s;throw new Error("Reference is an object but not an Element instance.");case"string":return document.querySelector(s);default:throw new Error("Reference is not an object or a string.")}}function k(s,e){g(s.parentElement),p(e),b(s,e)}function f(s){const e=Array.from(s.children||[]),t=c.getInstance();let n=null;const d=e.length;for(let l=0;l<d;l++){const u=e[l];if(u.classList.contains(o.NSClass)){n=t.nsQueue.get(u.id)??null;break}}return n}const T=`.ns,.nsh:before{width:100%;height:100%}.ns,.nsh:before{top:0;left:0}.nsc,.ns{display:flex;justify-content:center;align-items:center}.nsh{--color: DarkSlateGray;--size: 20px;--relSize: calc(var(--size) * .9);--font: "Helvetica", "Arial", sans-serif;--weight: 400;--bg: rgba(255, 255, 255, .8);--zIdx: 999999999;--blur: blur(10px)}.nsh{position:relative;z-index:var(--zIdx)}.nsh:before{position:absolute;background-color:var(--bg);content:"";backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);z-index:calc(var(--zIdx) + 1);border-radius:inherit}body.nsh{height:100vh}.ns{position:absolute;z-index:calc(var(--zIdx) + 2)}.nsc{filter:drop-shadow(0 0 .1rem rgba(211,211,211,.5))}.nst{color:var(--color);font-size:var(--size);font-family:var(--font);font-weight:var(--weight);margin-right:var(--relSize);text-shadow:0 0 .06rem rgba(47,79,79,.25)}.nss{display:block;width:var(--relSize);height:var(--relSize)}.nss>svg{animation:Rotate 2s linear infinite;position:relative;width:inherit;height:inherit;stroke-width:8}.nss .path{stroke:var(--color);stroke-linecap:round;animation:Dash 1.5s ease-in-out infinite}@keyframes Rotate{to{transform:rotate(360deg)}}@keyframes Dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}
+`;class E{constructor(){r(this,"queue");this.queue=[]}enqueue(e){return this.queue.push(e),this}dequeue(){return this.queue.shift()}get(e){return this.queue.find(t=>t.getId()===e)}delete(e){const t=this.queue.findIndex(n=>n.getId()===e);if(t!==-1)return this.queue.splice(t,1)[0]}}const i=class i{constructor(){r(this,"version");r(this,"nsQueue");this.version=y,this.nsQueue=new E,i.addStyle()}static addStyle(){const e=x(`<style>${T}</style>`);document.body.append(e)}static getInstance(){return i.instance||(i.instance=new i),i.instance}static assignToWindow(){Object.defineProperty(window,i.WindowAccessorKey,{value:i.getInstance(),writable:!1})}static start(){window[i.WindowAccessorKey]||i.assignToWindow()}createNS(e){const t=new o().setText(e||"");return this.nsQueue.enqueue(t),t}cleanAndRemoveFromDOM(e){var t;return e?(g(((t=e.getElement())==null?void 0:t.parentElement)??null),e.delete()):!1}deleteNS(e){return this.cleanAndRemoveFromDOM(this.nsQueue.delete(e)??null)}show(e){return this.showInside(document.body,e)}showInside(e,t){try{const n=h(e),d=f(n)??this.createNS();k(d.getElement(),n);const l=t?String(t):"";return d.setText(l).getId()}catch(n){return console.error(n),null}}hide(){const e=this.nsQueue.dequeue();return e?(this.cleanAndRemoveFromDOM(e),e.getId()):null}hideAll(){let e=this.nsQueue.dequeue();for(;e;)this.cleanAndRemoveFromDOM(e),e=this.nsQueue.dequeue()}hideId(e){return this.deleteNS(e)?e:null}hideInside(e){try{const t=f(h(e)),n=(t==null?void 0:t.getId())??"";return this.deleteNS(n??"")?n:null}catch(t){return console.error(t),null}}};r(i,"WindowAccessorKey","ns"),r(i,"instance");let c=i;const z={Service:c};exports.Service=c;exports.default=z;

package/dist/es/ns.js

@@ -0,0 +1,342 @@
+var m = Object.defineProperty;
+var v = (s, e, t) => e in s ? m(s, e, { enumerable: !0, configurable: !0, writable: !0, value: t }) : s[e] = t;
+var r = (s, e, t) => (v(s, typeof e != "symbol" ? e + "" : e, t), t);
+const y = "3.0.1", a = class a {
+  /**
+   * # Constructor
+   * Creates a new Nanosplash instance.
+   */
+  constructor() {
+    /**
+     * # ID
+     * Each Nanosplash instance is given a unique GUID.
+     */
+    r(this, "id");
+    /**
+     * # Element
+     * The root element of the Nanosplash component.
+     */
+    r(this, "element");
+    this.element = w(), this.element.id = this.id = a.generateGUID();
+  }
+  /**
+   * # Generate GUID
+   * @returns {GUIDString} A GUID string.
+   * @private
+   */
+  static generateGUID() {
+    return "xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g, (e) => {
+      const t = Math.random() * 16 | 0;
+      return (e === "x" ? t : t & 3 | 8).toString(16);
+    });
+  }
+  /**
+   * @inheritdoc
+   */
+  getId() {
+    return this.id;
+  }
+  /**
+   * @inheritdoc
+   */
+  getElement() {
+    return this.element;
+  }
+  /**
+   * @inheritdoc
+   */
+  getTextElement() {
+    var e, t;
+    return ((t = (e = this.getElement()) == null ? void 0 : e.firstElementChild) == null ? void 0 : t.firstElementChild) ?? null;
+  }
+  /**
+   * @inheritdoc
+   */
+  setText(e) {
+    return this.getTextElement().innerText = e, e.length > 0 ? this.showText() : this.hideText(), this;
+  }
+  /**
+   * @inheritdoc
+   */
+  showText() {
+    return I(this.getTextElement()), this;
+  }
+  /**
+   * @inheritdoc
+   */
+  hideText() {
+    return S(this.getTextElement()), this;
+  }
+  /**
+   * @inheritdoc
+   */
+  delete() {
+    return this.id = null, this.element !== null && (this.element.innerHTML = "", this.element.remove(), this.element = null), this.element === null;
+  }
+};
+/**
+ * # CSS Class Name
+ * The main CSS class name of the root element of a Nanosplash component.
+ */
+r(a, "NSClass", "ns"), /**
+ * # Host CSS Class Name
+ * The CSS class name of the host element of a Nanosplash component.
+ * The host element is the element that the Nanosplash is attached to.
+ */
+r(a, "NSHostClass", "nsh");
+let o = a;
+function x(s) {
+  return ((e) => (
+    // @ts-ignore
+    (() => e.firstChild)(e.innerHTML = s)
+  ))(
+    document.createElement("div")
+  );
+}
+function w() {
+  return x(
+    '<div class=ns><div class=nsc><div class=nst></div><div class=nss><svg viewBox="0 0 50 50"><circle class=path cx=25 cy=25 r=20 fill=none></circle></svg></div></div></div>'
+  );
+}
+function b(s, e) {
+  e.children.length > 0 ? e.insertBefore(s, e.children.item(0)) : e.append(s);
+}
+function p(s) {
+  s == null || s.classList.add(o.NSHostClass);
+}
+function g(s) {
+  s == null || s.classList.remove(o.NSHostClass);
+}
+function I(s) {
+  s.style.display = "flex";
+}
+function S(s) {
+  s.style.display = "none";
+}
+function h(s) {
+  switch (typeof s) {
+    case "object":
+      const e = s === document.body, t = s instanceof Element;
+      if (e || t)
+        return s;
+      throw new Error(
+        "Reference is an object but not an Element instance."
+      );
+    case "string":
+      return document.querySelector(s);
+    default:
+      throw new Error("Reference is not an object or a string.");
+  }
+}
+function k(s, e) {
+  g(s.parentElement), p(e), b(s, e);
+}
+function f(s) {
+  const e = Array.from(s.children || []), t = d.getInstance();
+  let n = null;
+  const c = e.length;
+  for (let l = 0; l < c; l++) {
+    const u = e[l];
+    if (u.classList.contains(o.NSClass)) {
+      n = t.nsQueue.get(u.id) ?? null;
+      break;
+    }
+  }
+  return n;
+}
+const E = `.ns,.nsh:before{width:100%;height:100%}.ns,.nsh:before{top:0;left:0}.nsc,.ns{display:flex;justify-content:center;align-items:center}.nsh{--color: DarkSlateGray;--size: 20px;--relSize: calc(var(--size) * .9);--font: "Helvetica", "Arial", sans-serif;--weight: 400;--bg: rgba(255, 255, 255, .8);--zIdx: 999999999;--blur: blur(10px)}.nsh{position:relative;z-index:var(--zIdx)}.nsh:before{position:absolute;background-color:var(--bg);content:"";backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);z-index:calc(var(--zIdx) + 1);border-radius:inherit}body.nsh{height:100vh}.ns{position:absolute;z-index:calc(var(--zIdx) + 2)}.nsc{filter:drop-shadow(0 0 .1rem rgba(211,211,211,.5))}.nst{color:var(--color);font-size:var(--size);font-family:var(--font);font-weight:var(--weight);margin-right:var(--relSize);text-shadow:0 0 .06rem rgba(47,79,79,.25)}.nss{display:block;width:var(--relSize);height:var(--relSize)}.nss>svg{animation:Rotate 2s linear infinite;position:relative;width:inherit;height:inherit;stroke-width:8}.nss .path{stroke:var(--color);stroke-linecap:round;animation:Dash 1.5s ease-in-out infinite}@keyframes Rotate{to{transform:rotate(360deg)}}@keyframes Dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}
+`;
+class T {
+  constructor() {
+    r(this, "queue");
+    this.queue = [];
+  }
+  /**
+   * # Enqueue
+   * Add a new item to the queue.
+   * @param item The item to add to the queue.
+   */
+  enqueue(e) {
+    return this.queue.push(e), this;
+  }
+  /**
+   * # Dequeue
+   * Remove the first item from the queue.
+   * @returns The first item from the queue.
+   */
+  dequeue() {
+    return this.queue.shift();
+  }
+  /**
+   * # Get
+   * @param id The GUID of the Nanosplash to get.
+   * @returns The Nanosplash with the given GUID.
+   */
+  get(e) {
+    return this.queue.find((t) => t.getId() === e);
+  }
+  /**
+   * # Delete
+   * @param id The GUID of the Nanosplash to delete.
+   * @returns The deleted Nanosplash.
+   */
+  delete(e) {
+    const t = this.queue.findIndex((n) => n.getId() === e);
+    if (t !== -1)
+      return this.queue.splice(t, 1)[0];
+  }
+}
+const i = class i {
+  /**
+   * # Constructor
+   * Private constructor to prevent multiple instances.
+   * @private
+   */
+  constructor() {
+    /**
+     * # Version
+     */
+    r(this, "version");
+    /**
+     * @inheritdoc
+     */
+    r(this, "nsQueue");
+    this.version = y, this.nsQueue = new T(), i.addStyle();
+  }
+  /**e
+   * # Add Style
+   * Add Nanosplash CSS to the DOM.
+   */
+  static addStyle() {
+    const e = x(`<style>${E}</style>`);
+    document.body.append(e);
+  }
+  /**
+   * # Get Instance
+   * Singleton instance accessor
+   * @returns {Service} NanosplashService instance
+   */
+  static getInstance() {
+    return i.instance || (i.instance = new i()), i.instance;
+  }
+  /**
+   * # Assign To Window
+   * Assign a NanosplashService instance to the Window object.
+   * The NanosplashService instance can be accessed in the window object
+   * using the key window accessor key.
+   * @see WindowAccessorKey
+   * @private
+   */
+  static assignToWindow() {
+    Object.defineProperty(window, i.WindowAccessorKey, {
+      value: i.getInstance(),
+      writable: !1
+    });
+  }
+  /**
+   * # Start
+   * Initialize and attach a Nanosplash Service instance to the Window object.
+   */
+  static start() {
+    window[i.WindowAccessorKey] || i.assignToWindow();
+  }
+  /**
+   * # Create Nanosplash
+   * Return new Nanosplash instance and push it to the stack.
+   * @param text Text to display.
+   * @returns {Splash} Nanosplash instance.
+   * @private
+   */
+  createNS(e) {
+    const t = new o().setText(e || "");
+    return this.nsQueue.enqueue(t), t;
+  }
+  /**
+   * # Clean And Remove From DOM
+   * Remove Nanosplash from DOM and clean its parent.
+   * @param ns Nanosplash instance.
+   * @returns True if Nanosplash was removed from DOM.
+   * @private
+   */
+  cleanAndRemoveFromDOM(e) {
+    var t;
+    return e ? (g(((t = e.getElement()) == null ? void 0 : t.parentElement) ?? null), e.delete()) : !1;
+  }
+  /**
+   * # Delete NS
+   * Remove Nanosplash instance from both the stack and the
+   * @param guid Nanosplash ID.
+   * @returns True if Nanosplash was removed from DOM.
+   * @private
+   */
+  deleteNS(e) {
+    return this.cleanAndRemoveFromDOM(this.nsQueue.delete(e) ?? null);
+  }
+  /**
+   * @inheritdoc
+   */
+  show(e) {
+    return this.showInside(document.body, e);
+  }
+  /**
+   * @inheritdoc
+   */
+  showInside(e, t) {
+    try {
+      const n = h(e), c = f(n) ?? this.createNS();
+      k(c.getElement(), n);
+      const l = t ? String(t) : "";
+      return c.setText(l).getId();
+    } catch (n) {
+      return console.error(n), null;
+    }
+  }
+  /**
+   * @inheritdoc
+   */
+  hide() {
+    const e = this.nsQueue.dequeue();
+    return e ? (this.cleanAndRemoveFromDOM(e), e.getId()) : null;
+  }
+  /**
+   * @inheritdoc
+   */
+  hideAll() {
+    let e = this.nsQueue.dequeue();
+    for (; e; )
+      this.cleanAndRemoveFromDOM(e), e = this.nsQueue.dequeue();
+  }
+  /**
+   * @inheritdoc
+   */
+  hideId(e) {
+    return this.deleteNS(e) ? e : null;
+  }
+  /**
+   * @inheritdoc
+   */
+  hideInside(e) {
+    try {
+      const t = f(h(e)), n = (t == null ? void 0 : t.getId()) ?? "";
+      return this.deleteNS(n ?? "") ? n : null;
+    } catch (t) {
+      return console.error(t), null;
+    }
+  }
+};
+/**
+ * # Window Accessor Key
+ * Key to access NanosplashService instance in the Window object.
+ */
+r(i, "WindowAccessorKey", "ns"), /**
+ * # Instance
+ * Singleton instance of NanosplashService.
+ * @private
+ */
+r(i, "instance");
+let d = i;
+const q = { Service: d };
+export {
+  d as Service,
+  q as default
+};

package/dist/iife/ns.iife.js

@@ -0,0 +1,2 @@
+var E=Object.defineProperty;var T=(l,s,a)=>s in l?E(l,s,{enumerable:!0,configurable:!0,writable:!0,value:a}):l[s]=a;var o=(l,s,a)=>(T(l,typeof s!="symbol"?s+"":s,a),a);(function(){"use strict";const l="3.0.1",c=class c{constructor(){o(this,"id");o(this,"element");this.element=v(),this.element.id=this.id=c.generateGUID()}static generateGUID(){return"xxxxxxxx-xxxx-4xxx-yxxx-xxxxxxxxxxxx".replace(/[xy]/g,e=>{const n=Math.random()*16|0;return(e==="x"?n:n&3|8).toString(16)})}getId(){return this.id}getElement(){return this.element}getTextElement(){var e,n;return((n=(e=this.getElement())==null?void 0:e.firstElementChild)==null?void 0:n.firstElementChild)??null}setText(e){return this.getTextElement().innerText=e,e.length>0?this.showText():this.hideText(),this}showText(){return b(this.getTextElement()),this}hideText(){return p(this.getTextElement()),this}delete(){return this.id=null,this.element!==null&&(this.element.innerHTML="",this.element.remove(),this.element=null),this.element===null}};o(c,"NSClass","ns"),o(c,"NSHostClass","nsh");let s=c;function a(t){return(e=>(()=>e.firstChild)(e.innerHTML=t))(document.createElement("div"))}function v(){return a('<div class=ns><div class=nsc><div class=nst></div><div class=nss><svg viewBox="0 0 50 50"><circle class=path cx=25 cy=25 r=20 fill=none></circle></svg></div></div></div>')}function y(t,e){e.children.length>0?e.insertBefore(t,e.children.item(0)):e.append(t)}function w(t){t==null||t.classList.add(s.NSHostClass)}function f(t){t==null||t.classList.remove(s.NSHostClass)}function b(t){t.style.display="flex"}function p(t){t.style.display="none"}function x(t){switch(typeof t){case"object":const e=t===document.body,n=t instanceof Element;if(e||n)return t;throw new Error("Reference is an object but not an Element instance.");case"string":return document.querySelector(t);default:throw new Error("Reference is not an object or a string.")}}function I(t,e){f(t.parentElement),w(e),y(t,e)}function g(t){const e=Array.from(t.children||[]),n=u.getInstance();let r=null;const h=e.length;for(let d=0;d<h;d++){const m=e[d];if(m.classList.contains(s.NSClass)){r=n.nsQueue.get(m.id)??null;break}}return r}const k=`.ns,.nsh:before{width:100%;height:100%}.ns,.nsh:before{top:0;left:0}.nsc,.ns{display:flex;justify-content:center;align-items:center}.nsh{--color: DarkSlateGray;--size: 20px;--relSize: calc(var(--size) * .9);--font: "Helvetica", "Arial", sans-serif;--weight: 400;--bg: rgba(255, 255, 255, .8);--zIdx: 999999999;--blur: blur(10px)}.nsh{position:relative;z-index:var(--zIdx)}.nsh:before{position:absolute;background-color:var(--bg);content:"";backdrop-filter:var(--blur);-webkit-backdrop-filter:var(--blur);z-index:calc(var(--zIdx) + 1);border-radius:inherit}body.nsh{height:100vh}.ns{position:absolute;z-index:calc(var(--zIdx) + 2)}.nsc{filter:drop-shadow(0 0 .1rem rgba(211,211,211,.5))}.nst{color:var(--color);font-size:var(--size);font-family:var(--font);font-weight:var(--weight);margin-right:var(--relSize);text-shadow:0 0 .06rem rgba(47,79,79,.25)}.nss{display:block;width:var(--relSize);height:var(--relSize)}.nss>svg{animation:Rotate 2s linear infinite;position:relative;width:inherit;height:inherit;stroke-width:8}.nss .path{stroke:var(--color);stroke-linecap:round;animation:Dash 1.5s ease-in-out infinite}@keyframes Rotate{to{transform:rotate(360deg)}}@keyframes Dash{0%{stroke-dasharray:1,150;stroke-dashoffset:0}50%{stroke-dasharray:90,150;stroke-dashoffset:-35}to{stroke-dasharray:90,150;stroke-dashoffset:-124}}
+`;class S{constructor(){o(this,"queue");this.queue=[]}enqueue(e){return this.queue.push(e),this}dequeue(){return this.queue.shift()}get(e){return this.queue.find(n=>n.getId()===e)}delete(e){const n=this.queue.findIndex(r=>r.getId()===e);if(n!==-1)return this.queue.splice(n,1)[0]}}const i=class i{constructor(){o(this,"version");o(this,"nsQueue");this.version=l,this.nsQueue=new S,i.addStyle()}static addStyle(){const e=a(`<style>${k}</style>`);document.body.append(e)}static getInstance(){return i.instance||(i.instance=new i),i.instance}static assignToWindow(){Object.defineProperty(window,i.WindowAccessorKey,{value:i.getInstance(),writable:!1})}static start(){window[i.WindowAccessorKey]||i.assignToWindow()}createNS(e){const n=new s().setText(e||"");return this.nsQueue.enqueue(n),n}cleanAndRemoveFromDOM(e){var n;return e?(f(((n=e.getElement())==null?void 0:n.parentElement)??null),e.delete()):!1}deleteNS(e){return this.cleanAndRemoveFromDOM(this.nsQueue.delete(e)??null)}show(e){return this.showInside(document.body,e)}showInside(e,n){try{const r=x(e),h=g(r)??this.createNS();I(h.getElement(),r);const d=n?String(n):"";return h.setText(d).getId()}catch(r){return console.error(r),null}}hide(){const e=this.nsQueue.dequeue();return e?(this.cleanAndRemoveFromDOM(e),e.getId()):null}hideAll(){let e=this.nsQueue.dequeue();for(;e;)this.cleanAndRemoveFromDOM(e),e=this.nsQueue.dequeue()}hideId(e){return this.deleteNS(e)?e:null}hideInside(e){try{const n=g(x(e)),r=(n==null?void 0:n.getId())??"";return this.deleteNS(r??"")?r:null}catch(n){return console.error(n),null}}};o(i,"WindowAccessorKey","ns"),o(i,"instance");let u=i;try{u.start()}catch(t){console.warn(t)}})();

package/docs/.vitepress/config.ts

@@ -0,0 +1,75 @@
+import { defineConfig } from 'vitepress'
+
+// https://vitepress.dev/reference/site-config
+export default defineConfig({
+	title: 'Nanosplash',
+	description: 'The tiny loading screen for web artisans',
+	base: '/nanosplash/',
+	themeConfig: {
+		nav: [
+			{ text: 'Home', link: '/' },
+			{ text: 'Get started', link: '/api/start/install' },
+			{ text: 'Playground', link: '/api/start/playground' },
+			{ text: 'API documentation', link: '/api/doc/show' },
+		],
+
+		sidebar: {
+			'/api/': [
+				{
+					text: 'Get started',
+					items: [
+						{
+							text: 'Installation',
+							link: '/api/start/install',
+						},
+						{
+							text: 'Usage',
+							link: '/api/start/usage',
+						},
+						{
+							text: 'Playground',
+							link: '/api/start/playground',
+						},
+					],
+				},
+				{
+					text: 'API Documentation',
+					items: [
+						{
+							text: 'Methods',
+							items: [
+								{
+									text: 'Show',
+									link: '/api/doc/show',
+								},
+								{
+									text: 'Hide',
+									link: '/api/doc/hide',
+								},
+							],
+						},
+					],
+				},
+				{
+					text: 'Features',
+					link: '/api/start/features',
+				},
+			],
+		},
+
+		socialLinks: [
+			{ icon: 'github', link: 'https://github.com/isakhauge/nanosplash' },
+			{ icon: 'twitter', link: 'https://twitter.com/isakhauge' },
+			{ icon: 'linkedin', link: 'https://www.linkedin.com/in/isakhauge' },
+		],
+
+		search: {
+			provider: 'local',
+		},
+
+		footer: {
+			message:
+				'Made with 🤍 by <a href="https://twitter.com/isakhauge">Isak Hauge</a>',
+		},
+	},
+})