drab 5.0.1 → 5.0.2

package/package.json

@@ -1,7 +1,7 @@
 {
 	"name": "drab",
 	"description": "A headless custom element library",
-	"version": "5.0.1",
+	"version": "5.0.2",
 	"homepage": "https://drab.robino.dev",
 	"license": "MIT",
 	"author": {
@@ -149,9 +149,10 @@
 		"preview": "vite preview",
 		"format": "prettier --write .",
 		"doc": "typedoc --out src/lib/docs --plugin typedoc-plugin-markdown src/package/index.ts --hideBreadcrumbs --hideInPageTOC --githubPages false --publicPath /docs/ && bun src/lib/scripts/doc/index.ts && bun format",
-		"copy": "cp package.json ./package && cp README.md ./package && cp LICENSE.md ./package",
-		"json": "bun src/lib/scripts/packageJson/index.ts && prettier --write package.json",
-		"package": "bun json && tsup && bun copy",
+		"package:json": "bun src/lib/scripts/packageJson/index.ts && prettier --write package.json",
+		"package:copy": "cp package.json ./package && cp README.md ./package && cp LICENSE.md ./package",
+		"package:tsc": "tsc --project tsconfig.package.json",
+		"package": "bun package:json && tsup && bun package:tsc && bun package:copy",
 		"pub": "bun i && bun doc && bun package && npm publish --access public ./package"
 	},
 	"devDependencies": {

package/popover/define.d.ts

@@ -1,2 +1 @@
-
-export {  }
+export {};

package/popover/define.js

@@ -1 +1,2 @@
-import{a as o}from"../chunk-DKKPV7QP.js";import"../chunk-F5BEEHGA.js";import"../chunk-MXKU7AKV.js";customElements.define("drab-popover",o);
+import { Popover } from "./index.js";
+customElements.define("drab-popover", Popover);

package/popover/index.d.ts

@@ -1,8 +1,6 @@
-import { AnimateAttributes, Animate } from '../animate/index.js';
-import { A as Attributes } from '../index-J5TqSvEl.js';
-import '../base/index.js';
-
-type PopoverAttributes = Attributes<Popover> & AnimateAttributes;
+import { Animate, type AnimateAttributes } from "../animate/index.js";
+import type { Attributes } from "../types/index.js";
+export type PopoverAttributes = Attributes<Popover> & AnimateAttributes;
 /**
  * Provides animations for the Popover API.
  *
@@ -11,7 +9,7 @@ type PopoverAttributes = Attributes<Popover> & AnimateAttributes;
  * This component can be deprecated once it can be animated with CSS only,
  * currently [only available in Chrome](https://developer.chrome.com/blog/introducing-popover-api#interactive_entry_and_exit).
  */
-declare class Popover extends Animate {
+export declare class Popover extends Animate {
     constructor();
     /**
      * Whether the popover is open or closed. This doesn't get set
@@ -27,5 +25,3 @@ declare class Popover extends Animate {
     toggle(): Promise<void>;
     mount(): void;
 }
-
-export { Popover, type PopoverAttributes };

package/popover/index.js

@@ -1 +1,74 @@
-import{a}from"../chunk-DKKPV7QP.js";import"../chunk-F5BEEHGA.js";import"../chunk-MXKU7AKV.js";export{a as Popover};
+import { Animate } from "../animate/index.js";
+/**
+ * Provides animations for the Popover API.
+ *
+ * The Popover API is not currently support in FireFox. [See the latest browser compatibility on MDN](https://developer.mozilla.org/en-US/docs/Web/API/Popover_API#browser_compatibility).
+ *
+ * This component can be deprecated once it can be animated with CSS only,
+ * currently [only available in Chrome](https://developer.chrome.com/blog/introducing-popover-api#interactive_entry_and_exit).
+ */
+export class Popover extends Animate {
+    constructor() {
+        super();
+    }
+    /**
+     * Whether the popover is open or closed. This doesn't get set
+     * automatically on the element like with the `HTMLDialogElement`.
+     */
+    get open() {
+        return this.hasAttribute("open");
+    }
+    set open(value) {
+        if (value) {
+            this.setAttribute("open", "");
+        }
+        else {
+            this.removeAttribute("open");
+        }
+    }
+    /** `HTMLElement.showPopover()` with animation. */
+    async show() {
+        // @ts-ignore - not supported in FF
+        this.getContent().showPopover();
+        await this.animateElement();
+    }
+    /** `HTMLElement.hidePopover()` with animation. */
+    async hide() {
+        await this.animateElement({
+            options: {
+                direction: "reverse",
+            },
+        });
+        // @ts-ignore - not supported in FF
+        this.getContent().hidePopover();
+    }
+    /** `show` or `hide` depending on the current state. */
+    async toggle() {
+        if (this.open)
+            this.hide();
+        else
+            this.show();
+    }
+    mount() {
+        this.triggerListener((e) => {
+            e.preventDefault();
+            this.toggle();
+        });
+        this.getContent().addEventListener("toggle", (e) => {
+            //@ts-expect-error - not supported in FF as of 1/23/24
+            if (e.newState === "open") {
+                this.open = true;
+            }
+            else {
+                this.open = false;
+            }
+        });
+        this.safeListener("keydown", (e) => {
+            if (e.key === "Escape" && this.open) {
+                // to execute animation
+                e.preventDefault();
+                this.hide();
+            }
+        });
+    }
+}

package/share/define.d.ts

@@ -1,2 +1 @@
-
-export {  }
+export {};

package/share/define.js

@@ -1 +1,2 @@
-import{a as e}from"../chunk-4WBITBA6.js";import"../chunk-7F7CQUEG.js";import"../chunk-MXKU7AKV.js";customElements.define("drab-share",e);
+import { Share } from "./index.js";
+customElements.define("drab-share", Share);

package/share/index.d.ts

@@ -1,12 +1,10 @@
-import { B as BaseCopy } from '../index-0rvQCq2U.js';
-import { A as Attributes } from '../index-J5TqSvEl.js';
-import '../base/index.js';
-
-type ShareAttributes = Attributes<Share, "value">;
+import { BaseCopy } from "../base/copy/index.js";
+import type { Attributes } from "../types/index.js";
+export type ShareAttributes = Attributes<Share, "value">;
 /**
  * Uses the [Navigator API](https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share) to share a url. If `share` is not supported, falls back to copy the text instead.
  */
-declare class Share extends BaseCopy {
+export declare class Share extends BaseCopy {
     constructor();
     /**
      * Shares or copies the `value`.
@@ -17,5 +15,3 @@ declare class Share extends BaseCopy {
     share(url?: string): Promise<void>;
     mount(): void;
 }
-
-export { Share, type ShareAttributes };

package/share/index.js

@@ -1 +1,34 @@
-import{a}from"../chunk-4WBITBA6.js";import"../chunk-7F7CQUEG.js";import"../chunk-MXKU7AKV.js";export{a as Share};
+import { BaseCopy } from "../base/copy/index.js";
+/**
+ * Uses the [Navigator API](https://developer.mozilla.org/en-US/docs/Web/API/Navigator/share) to share a url. If `share` is not supported, falls back to copy the text instead.
+ */
+export class Share extends BaseCopy {
+    constructor() {
+        super();
+    }
+    /**
+     * Shares or copies the `value`.
+     * @param url The `url` to share, defaults to `this.value`
+     * @returns An object containing a `result` - whether the `url` was copied or shared
+     * depending on browser support.
+     */
+    async share(url = this.value) {
+        if (navigator.canShare && navigator.canShare({ url })) {
+            try {
+                await navigator.share({ url });
+            }
+            catch (error) {
+                if (error?.name !== "AbortError") {
+                    console.error(error);
+                }
+            }
+        }
+        else {
+            // progressively enhance, copy the link
+            this.copy();
+        }
+    }
+    mount() {
+        this.triggerListener(async () => await this.share());
+    }
+}

package/tablesort/define.d.ts

@@ -1,2 +1 @@
-
-export {  }
+export {};

package/tablesort/define.js

@@ -1 +1,2 @@
-import{a as e}from"../chunk-3ASUSP4D.js";import"../chunk-VEVFQB5N.js";import"../chunk-GPET75FT.js";import"../chunk-5JV4T7GM.js";import"../chunk-DKKPV7QP.js";import"../chunk-4WBITBA6.js";import"../chunk-AWUCZCAJ.js";import"../chunk-XAP2U34A.js";import"../chunk-7F7CQUEG.js";import"../chunk-LHXOPRVC.js";import"../chunk-H4RNP4O4.js";import"../chunk-F5BEEHGA.js";import"../chunk-BCS5E3IH.js";import"../chunk-MXKU7AKV.js";customElements.define("drab-tablesort",e);
+import { TableSort } from "./index.js";
+customElements.define("drab-tablesort", TableSort);

package/tablesort/index.d.ts

@@ -1,7 +1,6 @@
-import { Base } from '../base/index.js';
-import { A as Attributes } from '../index-J5TqSvEl.js';
-
-type TableSortAttributes = Attributes<TableSort>;
+import { Base } from "../index.js";
+import type { Attributes } from "../types/index.js";
+export type TableSortAttributes = Attributes<TableSort>;
 /**
  * Wrap a `HTMLTableElement` in the `TableSort` element to have sortable column
  * headers. Set each `th` that you want to sort to the `trigger`. Set the `tbody`
@@ -15,10 +14,8 @@ type TableSortAttributes = Attributes<TableSort>;
  * datatype `number` or `boolean`, set `data-type="number"` on the corresponding
  * `th`/`trigger` element. The data will be converted to the specified type before sorting.
  */
-declare class TableSort extends Base {
+export declare class TableSort extends Base {
     #private;
     constructor();
     mount(): void;
 }
-
-export { TableSort, type TableSortAttributes };

package/tablesort/index.js

@@ -1 +1,109 @@
-import{a}from"../chunk-3ASUSP4D.js";import"../chunk-VEVFQB5N.js";import"../chunk-GPET75FT.js";import"../chunk-5JV4T7GM.js";import"../chunk-DKKPV7QP.js";import"../chunk-4WBITBA6.js";import"../chunk-AWUCZCAJ.js";import"../chunk-XAP2U34A.js";import"../chunk-7F7CQUEG.js";import"../chunk-LHXOPRVC.js";import"../chunk-H4RNP4O4.js";import"../chunk-F5BEEHGA.js";import"../chunk-BCS5E3IH.js";import"../chunk-MXKU7AKV.js";export{a as TableSort};
+import { Base } from "../index.js";
+/**
+ * Wrap a `HTMLTableElement` in the `TableSort` element to have sortable column
+ * headers. Set each `th` that you want to sort to the `trigger`. Set the `tbody`
+ * element to the `content`.
+ *
+ * The values of each cell default to the cell's `textContent`. If you would like to
+ * provide an alternate value than what appears in the cell to sort by instead,
+ * you can set a different value using the `data-value` attribute on the cell.
+ *
+ * The cells will be sorted as `string` by default. If you want to provide a different
+ * datatype `number` or `boolean`, set `data-type="number"` on the corresponding
+ * `th`/`trigger` element. The data will be converted to the specified type before sorting.
+ */
+export class TableSort extends Base {
+    constructor() {
+        super();
+    }
+    /**
+     * Removes `data-asc` or `data-desc` from other triggers then sets the correct attribute on the selected trigger.
+     *
+     * @param trigger
+     * @returns true if ascending, false if descending
+     */
+    #setAttributes(trigger) {
+        const asc = "data-asc";
+        const desc = "data-desc";
+        for (const t of this.getTrigger()) {
+            if (t !== trigger) {
+                t.removeAttribute(asc);
+                t.removeAttribute(desc);
+            }
+        }
+        if (trigger.hasAttribute(asc)) {
+            trigger.removeAttribute(asc);
+            trigger.setAttribute(desc, "");
+            return false;
+        }
+        trigger.removeAttribute(desc);
+        trigger.setAttribute(asc, "");
+        return true;
+    }
+    mount() {
+        const tbody = this.getContent(HTMLTableSectionElement);
+        for (const trigger of this.getTrigger()) {
+            trigger.addEventListener(this.event, () => {
+                Array.from(tbody.querySelectorAll("tr"))
+                    .sort(comparer(trigger, this.#setAttributes(trigger)))
+                    .forEach((tr) => tbody.appendChild(tr));
+            });
+        }
+    }
+}
+// adapted from: https://stackoverflow.com/questions/14267781/sorting-html-table-with-javascript/49041392#49041392
+const comparer = (th, ascending) => {
+    // this function is returned and used by `sort`
+    const sorter = (a, b) => {
+        // find the column to sort by using the index of the `th`
+        const columnIndex = Array.from(th.parentNode?.children ?? []).indexOf(th);
+        const compare = (aVal, bVal) => {
+            // default to `string` sorting
+            const dataType = (th.dataset.type ?? "string");
+            if (dataType === "string") {
+                const collator = new Intl.Collator();
+                return collator.compare(aVal, bVal);
+            }
+            else if (dataType === "boolean") {
+                /**
+                 * if value is one of these and type is boolean
+                 * it should be considered falsy
+                 * since actually `Boolean("false") === true`
+                 * @param val string pulled from the textContent or attr
+                 * @returns a boolean of the provided string
+                 */
+                const convertToBoolean = (val) => {
+                    const falsy = ["0", "false", "null", "undefined"];
+                    if (falsy.includes(val)) {
+                        return false;
+                    }
+                    return Boolean(val);
+                };
+                return convertToBoolean(aVal) === convertToBoolean(bVal)
+                    ? 0
+                    : convertToBoolean(aVal)
+                        ? -1
+                        : 1;
+            }
+            else {
+                // "number"
+                return Number(aVal) - Number(bVal);
+            }
+        };
+        return compare(getValue(ascending ? a : b, columnIndex), getValue(ascending ? b : a, columnIndex));
+    };
+    return sorter;
+};
+/**
+ * @param tr the row
+ * @param i index of the `td` to find
+ * @returns a string, the `data-value` attribute, or the `textContent`
+ */
+const getValue = (tr, i) => {
+    const cell = tr.children[i];
+    if (cell instanceof HTMLElement) {
+        // first look for `data-value` attribute, then use `textContent`
+        return cell.dataset.value ?? cell.textContent ?? "";
+    }
+    return "";
+};

package/types/index.d.ts

@@ -0,0 +1,11 @@
+type BaseAttributes = {
+    trigger: string;
+    content: string;
+    swap: string;
+};
+/**
+ * Creates a partial of the custom element's type. Makes some attributes required
+ * if passed in.
+ */
+export type Attributes<CustomElement, Required extends keyof CustomElement = never> = Pick<CustomElement, Required> & Partial<Omit<CustomElement, Required>> & Partial<BaseAttributes>;
+export {};

package/types/index.js

@@ -0,0 +1 @@
+export {};

package/youtube/define.d.ts

@@ -1,2 +1 @@
-
-export {  }
+export {};

package/youtube/define.js

@@ -1 +1,2 @@
-import{a as e}from"../chunk-VEVFQB5N.js";import"../chunk-MXKU7AKV.js";customElements.define("drab-youtube",e);
+import { YouTube } from "./index.js";
+customElements.define("drab-youtube", YouTube);

package/youtube/index.d.ts

@@ -1,11 +1,10 @@
-import { Base } from '../base/index.js';
-import { A as Attributes } from '../index-J5TqSvEl.js';
-
-type YouTubeAttributes = Attributes<YouTube, "uid">;
+import { Base } from "../base/index.js";
+import type { Attributes } from "../types/index.js";
+export type YouTubeAttributes = Attributes<YouTube, "uid">;
 /**
  * Embeds a YouTube video iframe into a website with the video uid, using www.youtube-nocookie.com.
  */
-declare class YouTube extends Base {
+export declare class YouTube extends Base {
     static observedAttributes: readonly ["autoplay", "start", "uid"];
     constructor();
     /** The `HTMLIFrameElement` within the element. */
@@ -27,5 +26,3 @@ declare class YouTube extends Base {
     mount(): void;
     attributeChangedCallback(): void;
 }
-
-export { YouTube, type YouTubeAttributes };

package/youtube/index.js

@@ -1 +1,56 @@
-import{a}from"../chunk-VEVFQB5N.js";import"../chunk-MXKU7AKV.js";export{a as YouTube};
+import { Base } from "../base/index.js";
+/**
+ * Embeds a YouTube video iframe into a website with the video uid, using www.youtube-nocookie.com.
+ */
+export class YouTube extends Base {
+    static observedAttributes = ["autoplay", "start", "uid"];
+    constructor() {
+        super();
+    }
+    /** The `HTMLIFrameElement` within the element. */
+    get iframe() {
+        return this.getContent(HTMLIFrameElement);
+    }
+    /** Whether the video should start playing when loaded. */
+    get autoplay() {
+        return this.hasAttribute("autoplay");
+    }
+    set autoplay(value) {
+        if (value)
+            this.setAttribute("autoplay", "");
+        else
+            this.removeAttribute("autoplay");
+    }
+    /** The start time of the video (seconds). */
+    get start() {
+        return this.getAttribute("start") ?? "0";
+    }
+    set start(value) {
+        this.setAttribute("start", value);
+    }
+    /**
+     * The video's YouTube uid, found within the url of the video.
+     *
+     * For example if the video url is https://youtu.be/gouiY85kD2o,
+     * the `uid` is `"gouiY85kD2o"`.
+     */
+    get uid() {
+        const uid = this.getAttribute("uid");
+        if (!uid)
+            throw new Error("YouTube: missing `uid` attribute.");
+        return uid;
+    }
+    set uid(v) {
+        this.setAttribute("uid", v);
+    }
+    mount() {
+        this.iframe.allowFullscreen = true;
+        this.iframe.allow =
+            "accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture";
+    }
+    attributeChangedCallback() {
+        queueMicrotask(() => {
+            this.iframe.src = `https://www.youtube-nocookie.com/embed/${this.uid}?start=${this.start}${this.autoplay ? "&autoplay=1" : ""}`;
+        });
+    }
+}

package/chunk-3ASUSP4D.js

@@ -1 +0,0 @@
-import{a as C}from"./chunk-VEVFQB5N.js";import{a as E}from"./chunk-GPET75FT.js";import{a as h}from"./chunk-5JV4T7GM.js";import{a as x}from"./chunk-DKKPV7QP.js";import{a as v}from"./chunk-4WBITBA6.js";import{a as f}from"./chunk-AWUCZCAJ.js";import{a as y}from"./chunk-XAP2U34A.js";import{a as d}from"./chunk-LHXOPRVC.js";import{a as T}from"./chunk-H4RNP4O4.js";import{a as A}from"./chunk-F5BEEHGA.js";import{a as c}from"./chunk-BCS5E3IH.js";import{a as S,b as u}from"./chunk-MXKU7AKV.js";var g={};S(g,{Animate:()=>A,Base:()=>u,Breakpoint:()=>c,ContextMenu:()=>f,Copy:()=>y,Details:()=>d,Dialog:()=>T,Editor:()=>E,Fullscreen:()=>h,Popover:()=>x,Share:()=>v,TableSort:()=>m,YouTube:()=>C});var m=class extends u{constructor(){super()}#t(t){let e="data-asc",r="data-desc";for(let s of this.getTrigger())s!==t&&(s.removeAttribute(e),s.removeAttribute(r));return t.hasAttribute(e)?(t.removeAttribute(e),t.setAttribute(r,""),!1):(t.removeAttribute(r),t.setAttribute(e,""),!0)}mount(){let t=this.getContent(HTMLTableSectionElement);for(let e of this.getTrigger())e.addEventListener(this.event,()=>{Array.from(t.querySelectorAll("tr")).sort(L(e,this.#t(e))).forEach(r=>t.appendChild(r))})}},L=(o,t)=>(r,s)=>{let l=Array.from(o.parentNode?.children??[]).indexOf(o);return((i,a)=>{let p=o.dataset.type??"string";if(p==="string")return new Intl.Collator().compare(i,a);if(p==="boolean"){let n=b=>["0","false","null","undefined"].includes(b)?!1:!!b;return n(i)===n(a)?0:n(i)?-1:1}else return Number(i)-Number(a)})(M(t?r:s,l),M(t?s:r,l))},M=(o,t)=>{let e=o.children[t];return e instanceof HTMLElement?e.dataset.value??e.textContent??"":""};export{m as a,g as b};

package/chunk-4WBITBA6.js

@@ -1 +0,0 @@
-import{a as e}from"./chunk-7F7CQUEG.js";var a=class extends e{constructor(){super()}async share(t=this.value){if(navigator.canShare&&navigator.canShare({url:t}))try{await navigator.share({url:t})}catch(r){r?.name!=="AbortError"&&console.error(r)}else this.copy()}mount(){this.triggerListener(async()=>await this.share())}};export{a};

package/chunk-5JV4T7GM.js

@@ -1 +0,0 @@
-import{b as t}from"./chunk-MXKU7AKV.js";var r=class extends t{constructor(){super()}isFullscreen(){return document.fullscreenElement!==null}fullscreenSupported(){return!!document.documentElement.requestFullscreen}toggle(){if(this.isFullscreen())document.exitFullscreen();else try{this.getContent(HTMLElement).requestFullscreen()}catch{document.documentElement.requestFullscreen()}}mount(){this.triggerListener(()=>this.toggle());for(let e of this.getTrigger())!this.fullscreenSupported()&&"disabled"in e&&(e.disabled=!0)}};export{r as a};

package/chunk-7F7CQUEG.js

@@ -1 +0,0 @@
-import{b as e}from"./chunk-MXKU7AKV.js";var r=class extends e{constructor(){super()}get value(){return this.getAttribute("value")??""}set value(t){this.setAttribute("value",t)}async copy(t=this.value){await navigator.clipboard.writeText(t),this.swapContent()}};export{r as a};

package/chunk-AWUCZCAJ.js

@@ -1 +0,0 @@
-import{a as l}from"./chunk-F5BEEHGA.js";var a=class extends l{#t;constructor(){super()}set#e(t){this.getContent().style.left=`${t.x}px`,this.getContent().style.top=`${t.y}px`}async show(t){let e=window.scrollY,i=window.scrollX,u=t instanceof MouseEvent?t.clientX:t.touches[0]?.clientX??0,d=t instanceof MouseEvent?t.clientY:t.touches[0]?.clientY??0,s=u+i,n=d+e;this.getContent().style.position="absolute",this.getContent().style.display="block";let o=this.getContent().offsetWidth+24,r=this.getContent().offsetHeight+6,h=window.innerWidth,c=window.innerHeight;s+o>i+h&&(s=i+h-o),n+r>e+c&&(n=e+c-r),this.#e={x:s,y:n},await this.animateElement()}async hide(){this.getContent().style.display!=="none"&&(await this.animateElement({options:{direction:"reverse"}}),this.getContent().style.display="none")}mount(){this.triggerListener(e=>{e.preventDefault(),this.show(e)},"contextmenu"),this.safeListener("click",()=>this.hide()),this.triggerListener(e=>{this.#t=setTimeout(()=>{this.show(e)},800)},"touchstart");let t=()=>clearTimeout(this.#t);this.triggerListener(t,"touchend"),this.triggerListener(t,"touchcancel"),this.safeListener("keydown",e=>{e.key==="Escape"&&this.hide()})}};export{a};

package/chunk-BCS5E3IH.js

@@ -1 +0,0 @@
-import{b as n}from"./chunk-MXKU7AKV.js";var r=class extends n{breakpoints=[{name:"sm",width:640},{name:"md",width:768},{name:"lg",width:1024},{name:"xl",width:1280},{name:"2xl",width:1536}];constructor(){super();let t=[];for(let e of this.getAttributeNames())if(e.startsWith("breakpoint-")){let[,...i]=e.split("-");i&&t.push({name:i.join("-"),width:Number(this.getAttribute(e))})}t.length&&(this.breakpoints=t),this.breakpoints.sort((e,i)=>i.width-e.width)}get breakpoint(){for(let t=0;t<this.breakpoints.length;t++){let e=this.breakpoints[t];if(e&&window.innerWidth>e.width)return e.name}return"none"}mount(){let t=()=>this.getContent().innerHTML=`${this.breakpoint}:${window.innerWidth}`;t(),this.safeListener("resize",t,window)}};export{r as a};

package/chunk-DKKPV7QP.js

@@ -1 +0,0 @@
-import{a as e}from"./chunk-F5BEEHGA.js";var i=class extends e{constructor(){super()}get open(){return this.hasAttribute("open")}set open(t){t?this.setAttribute("open",""):this.removeAttribute("open")}async show(){this.getContent().showPopover(),await this.animateElement()}async hide(){await this.animateElement({options:{direction:"reverse"}}),this.getContent().hidePopover()}async toggle(){this.open?this.hide():this.show()}mount(){this.triggerListener(t=>{t.preventDefault(),this.toggle()}),this.getContent().addEventListener("toggle",t=>{t.newState==="open"?this.open=!0:this.open=!1}),this.safeListener("keydown",t=>{t.key==="Escape"&&this.open&&(t.preventDefault(),this.hide())})}};export{i as a};

package/chunk-F5BEEHGA.js

@@ -1 +0,0 @@
-import{b as m}from"./chunk-MXKU7AKV.js";var p=class extends m{constructor(){super()}get animationOptions(){let n={};for(let i of this.getAttributeNames())if(i.startsWith("animation-option-")){let e=this.getAttribute(i),[,,t]=i.split("-");e&&(t==="duration"||t==="delay"?n[t]=Number(e):t==="easing"&&(n[t]=e))}return n}async animateElement(n={element:this.getContent(),options:{}}){let{element:i=this.getContent(),options:e={}}=n,t=this.keyframes;if(t.length&&!window.matchMedia("(prefers-reduced-motion: reduce)").matches){e=Object.assign(this.animationOptions,e),e.duration||(e.duration=200),e.easing||(e.easing="ease-in-out");let o=t.at(0),s=t.at(-1);if(o&&s){let r=["composite","easing","offset"];for(let f of r)delete o[f],delete s[f]}e.direction?.includes("reverse")&&([o,s]=[s,o]),Object.assign(i.style,o),await i.animate(t,e).finished,Object.assign(i.style,s)}}get keyframes(){let n=[];for(let i of this.getAttributeNames()){let e=this.getAttribute(i),[,,t,...o]=i.split("-");if(i.startsWith("animation-keyframe-")){let s=o.map((a,r)=>r<1?a:a.at(0)?.toUpperCase()+a.slice(1)).join("");if(t&&s){t==="from"?t="0":t==="to"?t="1":t=String(parseInt(t)*.01);let a=Number(t),r=n.find(f=>f.offset===a);r?r[s]=e:n.push({[s]:e,offset:a})}}}return n.sort((i,e)=>Number(i.offset)-Number(e.offset)),n}};export{p as a};

package/chunk-GPET75FT.js

@@ -1,9 +0,0 @@
-import{b as p}from"./chunk-MXKU7AKV.js";var x=class extends p{#s=[];keyPairs={"(":")","{":"}","[":"]","<":">",'"':'"',"`":"`"};constructor(){super();for(let t of this.#h)t.type==="wrap"&&(this.keyPairs[t.value]=t.value)}get textArea(){return this.getContent(HTMLTextAreaElement)}get text(){return this.textArea.value}set text(t){this.textArea.value=t}get#h(){let t=[];for(let s of this.getTrigger())t.push(this.#l(s));return t}get#o(){let t=this.text.split("```"),s=0;for(let[i,e]of t.entries())if(s+=e.length+3,this.#e<s)return i;return 0}get#t(){return this.textArea.selectionEnd}get#e(){return this.textArea.selectionStart}#i(t,s){this.textArea.setSelectionRange(t,s)}#l(t){let s=t.dataset.type,i=t.dataset.value,e=t.dataset.key??void 0;return{type:s,value:i,key:e}}async#c(t,s,i){if(t.type==="inline")this.text=`${this.text.slice(0,i)}${t.value}${this.text.slice(i)}`;else if(t.type==="wrap")this.text=k(this.text,t.value,s),this.text=k(this.text,this.keyPairs[t.value],i+t.value.length),t.value.length<2&&this.#s.push(t.value);else if(t.type==="block"){let{lines:e,lineNumber:n}=this.#r(),r=t.value.at(0);r&&e[n]?.startsWith(r)?e[n]=t.value.trim()+e[n]:e[n]=t.value+e[n],this.text=e.join(`
-`)}}async#u(t,s,i){let e=0,n=0;if(/[a-z]/i.test(t)){for(let r=i;r<this.text.length;r++)if(this.text[r]?.match(/[a-z]/i))e?n=r+1:e=r;else if(e)break}else e=s+t.length,n=i+t.length;this.#i(e,n),this.textArea.focus()}async#n(t){let s=this.#t,i=this.#e;await this.#c(t,i,s),this.#u(t.value,i,s)}#f(t){if(t){let s=[];this.#h.forEach(e=>{e.type==="block"&&s.push(e.value)});for(let e=0;e<s.length;e++){let n=s[e];if(n&&t.startsWith(n))return n}let i=g(t);if(i)return`${i}. `}return""}#r(){let t=this.text.split(`
-`),s=0;for(let i=0;i<t.length;i++){let e=t.at(i)?.length??0;if(s++,s+=e,s>this.#t)return{lines:t,lineNumber:i,columnNumber:this.#t-(s-e-1)}}return{lines:t,lineNumber:0,columnNumber:0}}#a(t,s=!1){let{lines:i}=this.#r();for(let e=t+1;e<i.length;e++){let n=i[e];if(n){let r=g(n);if(r){let h;if(s)if(r>1)h=r-1;else break;else h=r+1;i[e]=n.slice(String(r).length),i[e]=String(h)+i[e]}else break}}this.text=i.join(`
-`)}mount(){this.textArea.addEventListener("keydown",async t=>{let s=["ArrowUp","ArrowDown","Delete"],i=this.text[this.#t]??"";if(s.includes(t.key))this.#s=[];else if(t.key==="Backspace"){let e=this.text[this.#e-1];if(e&&e in this.keyPairs&&i===this.keyPairs[e]){t.preventDefault();let n=this.#e-1,r=this.#t-1;this.text=c(this.text,n),this.text=c(this.text,r),setTimeout(()=>{this.#i(n,r)},0),this.#s.pop()}if(e===`
-`&&this.#e===this.#t){t.preventDefault();let n=this.#e-1,{lineNumber:r}=this.#r();this.#a(r,!0),this.text=c(this.text,n),setTimeout(async()=>{this.#i(n,n)},0)}}else if(t.key==="Tab")this.#o%2!==0&&(t.preventDefault(),await this.#n({type:"inline",value:"	"}));else if(t.key==="Enter"){let{lines:e,lineNumber:n,columnNumber:r}=this.#r(),h=e.at(n),a=this.#f(h),o=a,u=g(a);if(u&&(a=`${u+1}. `),a&&o.length<r)t.preventDefault(),u&&this.#a(n),await this.#n({type:"inline",value:`
-${a}`});else if(a&&o.length===r){t.preventDefault();let m=this.#t,y=m-o.length;for(let f=0;f<o.length;f++)this.text=c(this.text,m-(f+1));setTimeout(async()=>{this.#i(y,y),this.textArea.focus(),await this.#n({type:"inline",value:`
-`})},0)}}else{let e=Object.values(this.keyPairs).includes(i),n=this.#e!==this.#t;if((t.ctrlKey||t.metaKey)&&this.#e===this.#t&&(t.key==="c"||t.key==="x")){t.preventDefault();let{lines:r,lineNumber:h,columnNumber:a}=this.#r();if(await navigator.clipboard.writeText(`${h===0&&t.key==="x"?"":`
-`}${r[h]}`),t.key==="x"){let o=this.#e-a;r.splice(h,1),this.text=r.join(`
-`),setTimeout(()=>{this.#i(o,o)},0)}}if((t.ctrlKey||t.metaKey)&&t.key){let r=this.#h.find(h=>h.key===t.key);r&&this.#n(r)}else e&&(i===t.key||t.key==="ArrowRight")&&this.#s.length&&!n?(t.preventDefault(),this.#i(this.#e+1,this.#t+1),this.#s.pop()):t.key in this.keyPairs&&(t.preventDefault(),await this.#n({type:"wrap",value:t.key}),this.#s.push(t.key))}}),this.textArea.addEventListener("dblclick",()=>{this.#e!==this.#t&&(this.text[this.#e]===" "&&this.#i(this.#e+1,this.#t),this.text[this.#t-1]===" "&&this.#i(this.#e,this.#t-1))}),this.textArea.addEventListener("click",()=>this.#s=[]);for(let t of this.getTrigger())t.addEventListener(this.event,()=>{this.#n(this.#l(t))})}},g=l=>{let t=l.match(/^(\d+)\./);return t?Number(t[1]):null},k=(l,t,s)=>l.slice(0,s)+t+l.slice(s),c=(l,t)=>l.slice(0,t)+l.slice(t+1);export{x as a};

package/chunk-H4RNP4O4.js

@@ -1 +0,0 @@
-import{a as e}from"./chunk-F5BEEHGA.js";var i=class extends e{constructor(){super()}get dialog(){return this.getContent(HTMLDialogElement)}async show(){this.dialog.showModal(),await this.animateElement()}async close(){await this.animateElement({options:{direction:"reverse"}}),this.dialog.close()}async toggle(){this.dialog.open?this.close():this.show()}mount(){this.triggerListener(()=>this.toggle()),this.safeListener("keydown",t=>{t.key==="Escape"&&this.dialog.open&&(t.preventDefault(),this.close())})}};export{i as a};

package/chunk-LHXOPRVC.js

@@ -1 +0,0 @@
-import{a as e}from"./chunk-F5BEEHGA.js";var i=class extends e{constructor(){super()}get details(){let t=this.getContent(HTMLElement).parentElement;if(!(t instanceof HTMLDetailsElement))throw new Error("Details: HTMLDetailsElement not found.");return t}async open(){this.details.open=!0,await this.animateElement()}async close(){await this.animateElement({options:{direction:"reverse"}}),this.details.open=!1}toggle(){this.details.open?this.close():this.open()}mount(){this.triggerListener(t=>{t.preventDefault(),this.toggle()})}};export{i as a};

package/chunk-MXKU7AKV.js

@@ -1 +0,0 @@
-var o=Object.defineProperty;var l=(s,e)=>{for(var t in e)o(s,t,{get:e[t],enumerable:!0})};var i=class extends HTMLElement{#e=new AbortController;constructor(){super()}get event(){return this.getAttribute("event")??"click"}set event(e){this.setAttribute("event",e)}getTrigger(){return this.querySelectorAll(this.getAttribute("trigger")??"[data-trigger]")}getContent(e=HTMLElement){let t=this.querySelector(this.getAttribute("content")??"[data-content]");if(t instanceof e)return t;throw new Error("Content not found")}swapContent(e=!0,t=800){let n=this.querySelector(this.getAttribute("swap")??"[data-swap]");if(n){let r=Array.from(this.getContent().childNodes);n instanceof HTMLTemplateElement?this.getContent().replaceChildren(n.content.cloneNode(!0)):this.getContent().replaceChildren(...n.childNodes),e&&setTimeout(()=>this.getContent().replaceChildren(...r),t)}}safeListener(e,t,n=document.body,r={}){r.signal=this.#e.signal,n.addEventListener(e,t,r)}triggerListener(e,t=this.event){for(let n of this.getTrigger())n.addEventListener(t,e)}mount(){}connectedCallback(){queueMicrotask(()=>this.mount())}disconnectedCallback(){this.#e.abort()}};export{l as a,i as b};

package/chunk-VEVFQB5N.js

@@ -1 +0,0 @@
-import{b as e}from"./chunk-MXKU7AKV.js";var r=class extends e{static observedAttributes=["autoplay","start","uid"];constructor(){super()}get iframe(){return this.getContent(HTMLIFrameElement)}get autoplay(){return this.hasAttribute("autoplay")}set autoplay(t){t?this.setAttribute("autoplay",""):this.removeAttribute("autoplay")}get start(){return this.getAttribute("start")??"0"}set start(t){this.setAttribute("start",t)}get uid(){let t=this.getAttribute("uid");if(!t)throw new Error("YouTube: missing `uid` attribute.");return t}set uid(t){this.setAttribute("uid",t)}mount(){this.iframe.allowFullscreen=!0,this.iframe.allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"}attributeChangedCallback(){queueMicrotask(()=>{this.iframe.src=`https://www.youtube-nocookie.com/embed/${this.uid}?start=${this.start}${this.autoplay?"&autoplay=1":""}`})}};export{r as a};

package/chunk-XAP2U34A.js

@@ -1 +0,0 @@
-import{a as t}from"./chunk-7F7CQUEG.js";var e=class extends t{constructor(){super()}mount(){this.triggerListener(async()=>await this.copy())}};export{e as a};

package/define/index.d.ts

@@ -1,2 +0,0 @@
-
-export {  }

package/define/index.js

@@ -1 +0,0 @@
-import{b as e}from"../chunk-3ASUSP4D.js";import"../chunk-VEVFQB5N.js";import"../chunk-GPET75FT.js";import"../chunk-5JV4T7GM.js";import"../chunk-DKKPV7QP.js";import"../chunk-4WBITBA6.js";import"../chunk-AWUCZCAJ.js";import"../chunk-XAP2U34A.js";import"../chunk-7F7CQUEG.js";import"../chunk-LHXOPRVC.js";import"../chunk-H4RNP4O4.js";import"../chunk-F5BEEHGA.js";import"../chunk-BCS5E3IH.js";import"../chunk-MXKU7AKV.js";for(let o in e)customElements.define(`drab-${o.toLowerCase()}`,e[o]);

package/index-J5TqSvEl.d.ts

@@ -1,12 +0,0 @@
-type BaseAttributes = {
-    trigger: string;
-    content: string;
-    swap: string;
-};
-/**
- * Creates a partial of the custom element's type. Makes some attributes required
- * if passed in.
- */
-type Attributes<CustomElement, Required extends keyof CustomElement = never> = Pick<CustomElement, Required> & Partial<Omit<CustomElement, Required>> & Partial<BaseAttributes>;
-
-export type { Attributes as A };