@zero-dependency/dom 0.6.0 → 0.7.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +3 -2
- package/dist/fetcher.d.ts +9 -5
- package/dist/index.es.js +67 -54
- package/dist/index.es.js.map +1 -1
- package/dist/index.umd.js +1 -1
- package/dist/index.umd.js.map +1 -1
- package/dist/observeElement.d.ts +1 -1
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
# @zero-dependency/dom
|
|
2
2
|
|
|
3
|
-
[](https://npm.im/@zero-dependency/dom)
|
|
4
|
-
](https://npm.im/@zero-dependency/dom)
|
|
4
|
+
[](https://bundlephobia.com/package/@zero-dependency/dom@latest)
|
|
5
|
+
|
|
5
6
|
|
|
6
7
|
## Installation
|
|
7
8
|
|
package/dist/fetcher.d.ts
CHANGED
|
@@ -2,16 +2,20 @@ interface FetcherInit extends Pick<RequestInit, 'headers' | 'credentials' | 'mod
|
|
|
2
2
|
}
|
|
3
3
|
interface FetcherRequest extends Omit<RequestInit, 'method'> {
|
|
4
4
|
}
|
|
5
|
-
declare
|
|
5
|
+
declare const methods: readonly ["GET", "POST", "PUT", "PATCH", "DELETE"];
|
|
6
|
+
declare type RequestMethods = typeof methods[number];
|
|
6
7
|
export declare class Fetcher {
|
|
7
8
|
private readonly baseURL;
|
|
8
|
-
private readonly baseInit
|
|
9
|
-
|
|
9
|
+
private readonly baseInit?;
|
|
10
|
+
get: <T>(path: string, init?: FetcherRequest) => Promise<T>;
|
|
11
|
+
post: <T>(path: string, init?: FetcherRequest) => Promise<T>;
|
|
12
|
+
put: <T>(path: string, init?: FetcherRequest) => Promise<T>;
|
|
13
|
+
patch: <T>(path: string, init?: FetcherRequest) => Promise<T>;
|
|
14
|
+
delete: <T>(path: string, init?: FetcherRequest) => Promise<T>;
|
|
15
|
+
constructor(baseURL: string, baseInit?: FetcherInit | undefined);
|
|
10
16
|
request<T>(path: string, init: FetcherRequest & {
|
|
11
17
|
method: RequestMethods;
|
|
12
18
|
}): Promise<T>;
|
|
13
|
-
get<T>(path: string, init?: FetcherRequest): Promise<T>;
|
|
14
|
-
post<T>(path: string, init?: FetcherRequest): Promise<T>;
|
|
15
19
|
}
|
|
16
20
|
export declare function fetcher<T = unknown>(...args: Parameters<typeof fetch>): Promise<T>;
|
|
17
21
|
export declare class FetcherError<T> extends Error {
|
package/dist/index.es.js
CHANGED
|
@@ -1,98 +1,111 @@
|
|
|
1
|
-
function a(
|
|
2
|
-
const
|
|
1
|
+
function a(r, e, t = document.body) {
|
|
2
|
+
const n = new MutationObserver((s) => {
|
|
3
3
|
for (const o of s) {
|
|
4
4
|
const c = o.target;
|
|
5
|
-
c.matches?.(
|
|
5
|
+
c.matches?.(r) && e(c, n);
|
|
6
6
|
}
|
|
7
7
|
});
|
|
8
|
-
return
|
|
8
|
+
return n.observe(t, {
|
|
9
9
|
attributes: !0,
|
|
10
10
|
childList: !0,
|
|
11
11
|
subtree: !0
|
|
12
|
-
}),
|
|
12
|
+
}), n;
|
|
13
13
|
}
|
|
14
|
-
function
|
|
14
|
+
function l(r, e = document.body) {
|
|
15
15
|
return new Promise((t) => {
|
|
16
|
-
const
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
},
|
|
25
|
-
e
|
|
26
|
-
);
|
|
27
|
-
}
|
|
16
|
+
const n = e.querySelector(r);
|
|
17
|
+
n ? t(n) : a(
|
|
18
|
+
r,
|
|
19
|
+
(s, o) => {
|
|
20
|
+
o.disconnect(), t(s);
|
|
21
|
+
},
|
|
22
|
+
e
|
|
23
|
+
);
|
|
28
24
|
});
|
|
29
25
|
}
|
|
30
|
-
function
|
|
26
|
+
function m(r, e = 500) {
|
|
31
27
|
let t;
|
|
32
|
-
return (...
|
|
28
|
+
return (...n) => {
|
|
33
29
|
t && clearTimeout(t), t = setTimeout(() => {
|
|
34
|
-
|
|
30
|
+
r(...n);
|
|
35
31
|
}, e);
|
|
36
32
|
};
|
|
37
33
|
}
|
|
38
|
-
function
|
|
39
|
-
const
|
|
40
|
-
return Array.isArray(e) ?
|
|
34
|
+
function b(r, e, ...t) {
|
|
35
|
+
const n = document.createElement(r);
|
|
36
|
+
return Array.isArray(e) ? n.append(...e) : (Object.assign(n, e), n.append(...t)), n;
|
|
41
37
|
}
|
|
42
|
-
function
|
|
43
|
-
return document.createTextNode(
|
|
38
|
+
function u(r) {
|
|
39
|
+
return document.createTextNode(r);
|
|
44
40
|
}
|
|
45
|
-
function
|
|
46
|
-
return
|
|
41
|
+
function w() {
|
|
42
|
+
return u("\xA0");
|
|
47
43
|
}
|
|
48
|
-
async function
|
|
49
|
-
return new Promise((
|
|
50
|
-
document.readyState == "loading" ? document.addEventListener("DOMContentLoaded", () =>
|
|
44
|
+
async function p() {
|
|
45
|
+
return new Promise((r) => {
|
|
46
|
+
document.readyState == "loading" ? document.addEventListener("DOMContentLoaded", () => r(), {
|
|
51
47
|
once: !0
|
|
52
|
-
}) :
|
|
48
|
+
}) : r();
|
|
53
49
|
});
|
|
54
50
|
}
|
|
55
|
-
|
|
51
|
+
const i = [
|
|
52
|
+
"GET",
|
|
53
|
+
"POST",
|
|
54
|
+
"PUT",
|
|
55
|
+
"PATCH",
|
|
56
|
+
"DELETE"
|
|
57
|
+
];
|
|
58
|
+
class y {
|
|
56
59
|
constructor(e, t) {
|
|
57
60
|
this.baseURL = e, this.baseInit = t;
|
|
61
|
+
for (const n of i)
|
|
62
|
+
this[n.toLowerCase()] = (s, o) => this.request(s, { ...o, method: n });
|
|
58
63
|
}
|
|
64
|
+
get;
|
|
65
|
+
post;
|
|
66
|
+
put;
|
|
67
|
+
patch;
|
|
68
|
+
delete;
|
|
59
69
|
async request(e, t) {
|
|
60
|
-
const
|
|
61
|
-
return await
|
|
62
|
-
}
|
|
63
|
-
async get(e, t) {
|
|
64
|
-
return await this.request(e, { ...t, method: "GET" });
|
|
65
|
-
}
|
|
66
|
-
async post(e, t) {
|
|
67
|
-
return await this.request(e, { ...t, method: "POST" });
|
|
70
|
+
const n = new URL(e, this.baseURL), s = h(this.baseInit?.headers, t.headers);
|
|
71
|
+
return await d(n, { ...this.baseInit, ...t, headers: s });
|
|
68
72
|
}
|
|
69
73
|
}
|
|
70
|
-
async function
|
|
71
|
-
const e = await fetch(...
|
|
74
|
+
async function d(...r) {
|
|
75
|
+
const e = await fetch(...r), t = await e.json();
|
|
72
76
|
if (e.ok)
|
|
73
77
|
return t;
|
|
74
|
-
throw new
|
|
78
|
+
throw new f({
|
|
75
79
|
response: e,
|
|
76
80
|
data: t
|
|
77
81
|
});
|
|
78
82
|
}
|
|
79
|
-
class
|
|
83
|
+
class f extends Error {
|
|
80
84
|
response;
|
|
81
85
|
data;
|
|
82
86
|
constructor({ response: e, data: t }) {
|
|
83
87
|
super(e.statusText), this.name = "FetcherError", this.response = e, this.data = t;
|
|
84
88
|
}
|
|
85
89
|
}
|
|
90
|
+
function h(...r) {
|
|
91
|
+
const e = {};
|
|
92
|
+
for (const t of r) {
|
|
93
|
+
const n = new Headers(t);
|
|
94
|
+
for (const [s, o] of n.entries())
|
|
95
|
+
o == null ? delete e[s] : e[s] = o;
|
|
96
|
+
}
|
|
97
|
+
return new Headers(e);
|
|
98
|
+
}
|
|
86
99
|
export {
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
100
|
+
y as Fetcher,
|
|
101
|
+
f as FetcherError,
|
|
102
|
+
m as debounce,
|
|
103
|
+
p as domReady,
|
|
104
|
+
b as el,
|
|
105
|
+
d as fetcher,
|
|
106
|
+
w as nbsp,
|
|
94
107
|
a as observeElement,
|
|
95
|
-
|
|
96
|
-
|
|
108
|
+
u as text,
|
|
109
|
+
l as waitElement
|
|
97
110
|
};
|
|
98
111
|
//# sourceMappingURL=index.es.js.map
|
package/dist/index.es.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.es.js","sources":["../src/observeElement.ts","../src/waitElement.ts","../src/debounce.ts","../src/html.ts","../src/fetcher.ts"],"sourcesContent":["export function observeElement<T extends Element = Element>(\n selector: string,\n callback: (el: T) => void,\n target = document.body\n): MutationObserver {\n const observer = new MutationObserver((mutations) => {\n for (const mutation of mutations) {\n const el = mutation.target as T\n if (el.matches?.(selector)) {\n callback(el)\n }\n }\n })\n\n observer.observe(target, {\n attributes: true,\n childList: true,\n subtree: true\n })\n\n return observer\n}\n","import { observeElement } from './observeElement.js'\n\nexport function waitElement<T extends Element = Element>(\n selector: string,\n target = document.body\n): Promise<T> {\n return new Promise((resolve) => {\n const el = target.querySelector<T>(selector)\n if (el) {\n resolve(el)\n } else {\n
|
|
1
|
+
{"version":3,"file":"index.es.js","sources":["../src/observeElement.ts","../src/waitElement.ts","../src/debounce.ts","../src/html.ts","../src/fetcher.ts"],"sourcesContent":["export function observeElement<T extends Element = Element>(\n selector: string,\n callback: (el: T, observer: MutationObserver) => void,\n target = document.body\n): MutationObserver {\n const observer = new MutationObserver((mutations) => {\n for (const mutation of mutations) {\n const el = mutation.target as T\n if (el.matches?.(selector)) {\n callback(el, observer)\n }\n }\n })\n\n observer.observe(target, {\n attributes: true,\n childList: true,\n subtree: true\n })\n\n return observer\n}\n","import { observeElement } from './observeElement.js'\n\nexport function waitElement<T extends Element = Element>(\n selector: string,\n target = document.body\n): Promise<T> {\n return new Promise((resolve) => {\n const el = target.querySelector<T>(selector)\n if (el) {\n resolve(el)\n } else {\n observeElement<T>(\n selector,\n (el, observer) => {\n observer.disconnect()\n resolve(el)\n },\n target\n )\n }\n })\n}\n","export function debounce<T extends (...args: any[]) => void>(\n fn: T,\n delay = 500\n): (this: ThisParameterType<T>, ...args: Parameters<T>) => void {\n let timeoutId: ReturnType<typeof setTimeout>\n\n return (...args) => {\n if (timeoutId) {\n clearTimeout(timeoutId)\n }\n\n timeoutId = setTimeout(() => {\n fn(...args)\n }, delay)\n }\n}\n","// prettier-ignore\ntype Attributes<T extends keyof HTMLElementTagNameMap> = Partial<{\n style: Partial<CSSStyleDeclaration>\n} & Omit<HTMLElementTagNameMap[T], 'style'>>\n\ntype Children = (string | Node | HTMLElement)[]\n\nexport function el<T extends keyof HTMLElementTagNameMap>(\n tag: T,\n attributes?: Children | Attributes<T>,\n ...children: Children\n): HTMLElementTagNameMap[T] {\n const el = document.createElement(tag)\n if (Array.isArray(attributes)) {\n el.append(...attributes)\n } else {\n Object.assign(el, attributes)\n el.append(...children)\n }\n\n return el\n}\n\nexport function text(str: string): Text {\n return document.createTextNode(str)\n}\n\nexport function nbsp(): Text {\n return text('\\u00a0')\n}\n\nexport async function domReady(): Promise<void> {\n return new Promise((resolve) => {\n if (document.readyState == 'loading') {\n document.addEventListener('DOMContentLoaded', () => resolve(), {\n once: true\n })\n } else {\n resolve()\n }\n })\n}\n","interface FetcherInit\n extends Pick<\n RequestInit,\n 'headers' | 'credentials' | 'mode' | 'cache' | 'redirect' | 'referrerPolicy'\n > {}\n\ninterface FetcherRequest extends Omit<RequestInit, 'method'> {}\n\nconst methods = [\n 'GET',\n 'POST',\n 'PUT',\n 'PATCH',\n 'DELETE'\n] as const\n\ntype RequestMethods = typeof methods[number]\n\nexport class Fetcher {\n get: <T>(path: string, init?: FetcherRequest) => Promise<T>\n post: <T>(path: string, init?: FetcherRequest) => Promise<T>\n put: <T>(path: string, init?: FetcherRequest) => Promise<T>\n patch: <T>(path: string, init?: FetcherRequest) => Promise<T>\n delete: <T>(path: string, init?: FetcherRequest) => Promise<T>\n\n constructor(\n private readonly baseURL: string,\n private readonly baseInit?: FetcherInit\n ) {\n for (const method of methods) {\n // @ts-ignore\n this[method.toLowerCase()] = (path: string, init?: FetcherRequest) =>\n this.request(path, { ...init, method })\n }\n }\n\n async request<T>(\n path: string,\n init: FetcherRequest & { method: RequestMethods }\n ): Promise<T> {\n const url = new URL(path, this.baseURL)\n const headers = mergeHeaders(this.baseInit?.headers!, init.headers!)\n return await fetcher<T>(url, { ...this.baseInit, ...init, headers })\n }\n}\n\nexport async function fetcher<T = unknown>(\n ...args: Parameters<typeof fetch>\n): Promise<T> {\n const response = await fetch(...args)\n const data = (await response.json()) as T\n\n if (response.ok) {\n return data\n }\n\n throw new FetcherError({\n response,\n data\n })\n}\n\nexport class FetcherError<T> extends Error {\n response: Response\n data: T\n\n constructor({ response, data }: { response: Response; data: T }) {\n super(response.statusText)\n\n this.name = 'FetcherError'\n this.response = response\n this.data = data\n }\n}\n\nfunction mergeHeaders(...sources: HeadersInit[]): Headers {\n const result: Record<string, string> = {}\n\n for (const source of sources) {\n const headers = new Headers(source)\n\n for (const [key, value] of headers.entries()) {\n if (value === undefined || value === null) {\n delete result[key]\n } else {\n result[key] = value\n }\n }\n }\n\n return new Headers(result)\n}\n"],"names":["observeElement","selector","callback","target","observer","mutations","mutation","el","waitElement","resolve","debounce","fn","delay","timeoutId","args","tag","attributes","children","text","str","nbsp","domReady","methods","Fetcher","baseURL","baseInit","method","path","init","url","headers","mergeHeaders","fetcher","response","data","FetcherError","sources","result","source","key","value"],"mappings":"AAAO,SAASA,EACdC,GACAC,GACAC,IAAS,SAAS,MACA;AAClB,QAAMC,IAAW,IAAI,iBAAiB,CAACC,MAAc;AACnD,eAAWC,KAAYD,GAAW;AAChC,YAAME,IAAKD,EAAS;AAChB,MAAAC,EAAG,UAAUN,CAAQ,KACvBC,EAASK,GAAIH,CAAQ;AAAA,IAEzB;AAAA,EAAA,CACD;AAED,SAAAA,EAAS,QAAQD,GAAQ;AAAA,IACvB,YAAY;AAAA,IACZ,WAAW;AAAA,IACX,SAAS;AAAA,EAAA,CACV,GAEMC;AACT;ACnBO,SAASI,EACdP,GACAE,IAAS,SAAS,MACN;AACL,SAAA,IAAI,QAAQ,CAACM,MAAY;AACxB,UAAAF,IAAKJ,EAAO,cAAiBF,CAAQ;AAC3C,IAAIM,IACFE,EAAQF,CAAE,IAEVP;AAAA,MACEC;AAAA,MACA,CAACM,GAAIH,MAAa;AAChB,QAAAA,EAAS,WAAW,GACpBK,EAAQF,CAAE;AAAA,MACZ;AAAA,MACAJ;AAAA,IAAA;AAAA,EAEJ,CACD;AACH;ACrBgB,SAAAO,EACdC,GACAC,IAAQ,KACsD;AAC1D,MAAAC;AAEJ,SAAO,IAAIC,MAAS;AAClB,IAAID,KACF,aAAaA,CAAS,GAGxBA,IAAY,WAAW,MAAM;AAC3B,MAAAF,EAAG,GAAGG,CAAI;AAAA,OACTF,CAAK;AAAA,EAAA;AAEZ;ACRgB,SAAAL,EACdQ,GACAC,MACGC,GACuB;AACpBV,QAAAA,IAAK,SAAS,cAAcQ,CAAG;AACjC,SAAA,MAAM,QAAQC,CAAU,IAC1BT,EAAG,OAAO,GAAGS,CAAU,KAEhB,OAAA,OAAOT,GAAIS,CAAU,GAC5BT,EAAG,OAAO,GAAGU,CAAQ,IAGhBV;AACT;AAEO,SAASW,EAAKC,GAAmB;AAC/B,SAAA,SAAS,eAAeA,CAAG;AACpC;AAEO,SAASC,IAAa;AAC3B,SAAOF,EAAK,MAAQ;AACtB;AAEA,eAAsBG,IAA0B;AACvC,SAAA,IAAI,QAAQ,CAACZ,MAAY;AAC1B,IAAA,SAAS,cAAc,YACzB,SAAS,iBAAiB,oBAAoB,MAAMA,EAAA,GAAW;AAAA,MAC7D,MAAM;AAAA,IAAA,CACP,IAEOA;EACV,CACD;AACH;ACjCA,MAAMa,IAAU;AAAA,EACd;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AACF;AAIO,MAAMC,EAAQ;AAAA,EAOnB,YACmBC,GACAC,GACjB;AAFiB,SAAA,UAAAD,GACA,KAAA,WAAAC;AAEjB,eAAWC,KAAUJ;AAEnB,WAAKI,EAAO,YAAiB,KAAA,CAACC,GAAcC,MAC1C,KAAK,QAAQD,GAAM,EAAE,GAAGC,GAAM,QAAAF,EAAQ,CAAA;AAAA,EAE5C;AAAA,EAfA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EACA;AAAA,EAaA,MAAM,QACJC,GACAC,GACY;AACZ,UAAMC,IAAM,IAAI,IAAIF,GAAM,KAAK,OAAO,GAChCG,IAAUC,EAAa,KAAK,UAAU,SAAUH,EAAK,OAAQ;AAC5D,WAAA,MAAMI,EAAWH,GAAK,EAAE,GAAG,KAAK,UAAU,GAAGD,GAAM,SAAAE,EAAA,CAAS;AAAA,EACrE;AACF;AAEA,eAAsBE,KACjBlB,GACS;AACZ,QAAMmB,IAAW,MAAM,MAAM,GAAGnB,CAAI,GAC9BoB,IAAQ,MAAMD,EAAS;AAE7B,MAAIA,EAAS;AACJ,WAAAC;AAGT,QAAM,IAAIC,EAAa;AAAA,IACrB,UAAAF;AAAA,IACA,MAAAC;AAAA,EAAA,CACD;AACH;AAEO,MAAMC,UAAwB,MAAM;AAAA,EACzC;AAAA,EACA;AAAA,EAEA,YAAY,EAAE,UAAAF,GAAU,MAAAC,KAAyC;AAC/D,UAAMD,EAAS,UAAU,GAEzB,KAAK,OAAO,gBACZ,KAAK,WAAWA,GAChB,KAAK,OAAOC;AAAA,EACd;AACF;AAEA,SAASH,KAAgBK,GAAiC;AACxD,QAAMC,IAAiC,CAAA;AAEvC,aAAWC,KAAUF,GAAS;AACtB,UAAAN,IAAU,IAAI,QAAQQ,CAAM;AAElC,eAAW,CAACC,GAAKC,CAAK,KAAKV,EAAQ;AAC7B,MAAuBU,KAAU,OACnC,OAAOH,EAAOE,KAEdF,EAAOE,KAAOC;AAAA,EAGpB;AAEO,SAAA,IAAI,QAAQH,CAAM;AAC3B;"}
|
package/dist/index.umd.js
CHANGED
|
@@ -1,2 +1,2 @@
|
|
|
1
|
-
(function(r,
|
|
1
|
+
(function(r,i){typeof exports=="object"&&typeof module<"u"?i(exports):typeof define=="function"&&define.amd?define(["exports"],i):(r=typeof globalThis<"u"?globalThis:r||self,i(r["@zero-dependency/dom"]={}))})(this,function(r){"use strict";function i(o,e,t=document.body){const n=new MutationObserver(s=>{for(const c of s){const f=c.target;f.matches?.(o)&&e(f,n)}});return n.observe(t,{attributes:!0,childList:!0,subtree:!0}),n}function l(o,e=document.body){return new Promise(t=>{const n=e.querySelector(o);n?t(n):i(o,(s,c)=>{c.disconnect(),t(s)},e)})}function h(o,e=500){let t;return(...n)=>{t&&clearTimeout(t),t=setTimeout(()=>{o(...n)},e)}}function m(o,e,...t){const n=document.createElement(o);return Array.isArray(e)?n.append(...e):(Object.assign(n,e),n.append(...t)),n}function u(o){return document.createTextNode(o)}function b(){return u("\xA0")}async function y(){return new Promise(o=>{document.readyState=="loading"?document.addEventListener("DOMContentLoaded",()=>o(),{once:!0}):o()})}const w=["GET","POST","PUT","PATCH","DELETE"];class E{constructor(e,t){this.baseURL=e,this.baseInit=t;for(const n of w)this[n.toLowerCase()]=(s,c)=>this.request(s,{...c,method:n})}get;post;put;patch;delete;async request(e,t){const n=new URL(e,this.baseURL),s=T(this.baseInit?.headers,t.headers);return await d(n,{...this.baseInit,...t,headers:s})}}async function d(...o){const e=await fetch(...o),t=await e.json();if(e.ok)return t;throw new a({response:e,data:t})}class a extends Error{response;data;constructor({response:e,data:t}){super(e.statusText),this.name="FetcherError",this.response=e,this.data=t}}function T(...o){const e={};for(const t of o){const n=new Headers(t);for(const[s,c]of n.entries())c==null?delete e[s]:e[s]=c}return new Headers(e)}r.Fetcher=E,r.FetcherError=a,r.debounce=h,r.domReady=y,r.el=m,r.fetcher=d,r.nbsp=b,r.observeElement=i,r.text=u,r.waitElement=l,Object.defineProperties(r,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});
|
|
2
2
|
//# sourceMappingURL=index.umd.js.map
|
package/dist/index.umd.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.umd.js","sources":["../src/observeElement.ts","../src/waitElement.ts","../src/debounce.ts","../src/html.ts","../src/fetcher.ts"],"sourcesContent":["export function observeElement<T extends Element = Element>(\n selector: string,\n callback: (el: T) => void,\n target = document.body\n): MutationObserver {\n const observer = new MutationObserver((mutations) => {\n for (const mutation of mutations) {\n const el = mutation.target as T\n if (el.matches?.(selector)) {\n callback(el)\n }\n }\n })\n\n observer.observe(target, {\n attributes: true,\n childList: true,\n subtree: true\n })\n\n return observer\n}\n","import { observeElement } from './observeElement.js'\n\nexport function waitElement<T extends Element = Element>(\n selector: string,\n target = document.body\n): Promise<T> {\n return new Promise((resolve) => {\n const el = target.querySelector<T>(selector)\n if (el) {\n resolve(el)\n } else {\n
|
|
1
|
+
{"version":3,"file":"index.umd.js","sources":["../src/observeElement.ts","../src/waitElement.ts","../src/debounce.ts","../src/html.ts","../src/fetcher.ts"],"sourcesContent":["export function observeElement<T extends Element = Element>(\n selector: string,\n callback: (el: T, observer: MutationObserver) => void,\n target = document.body\n): MutationObserver {\n const observer = new MutationObserver((mutations) => {\n for (const mutation of mutations) {\n const el = mutation.target as T\n if (el.matches?.(selector)) {\n callback(el, observer)\n }\n }\n })\n\n observer.observe(target, {\n attributes: true,\n childList: true,\n subtree: true\n })\n\n return observer\n}\n","import { observeElement } from './observeElement.js'\n\nexport function waitElement<T extends Element = Element>(\n selector: string,\n target = document.body\n): Promise<T> {\n return new Promise((resolve) => {\n const el = target.querySelector<T>(selector)\n if (el) {\n resolve(el)\n } else {\n observeElement<T>(\n selector,\n (el, observer) => {\n observer.disconnect()\n resolve(el)\n },\n target\n )\n }\n })\n}\n","export function debounce<T extends (...args: any[]) => void>(\n fn: T,\n delay = 500\n): (this: ThisParameterType<T>, ...args: Parameters<T>) => void {\n let timeoutId: ReturnType<typeof setTimeout>\n\n return (...args) => {\n if (timeoutId) {\n clearTimeout(timeoutId)\n }\n\n timeoutId = setTimeout(() => {\n fn(...args)\n }, delay)\n }\n}\n","// prettier-ignore\ntype Attributes<T extends keyof HTMLElementTagNameMap> = Partial<{\n style: Partial<CSSStyleDeclaration>\n} & Omit<HTMLElementTagNameMap[T], 'style'>>\n\ntype Children = (string | Node | HTMLElement)[]\n\nexport function el<T extends keyof HTMLElementTagNameMap>(\n tag: T,\n attributes?: Children | Attributes<T>,\n ...children: Children\n): HTMLElementTagNameMap[T] {\n const el = document.createElement(tag)\n if (Array.isArray(attributes)) {\n el.append(...attributes)\n } else {\n Object.assign(el, attributes)\n el.append(...children)\n }\n\n return el\n}\n\nexport function text(str: string): Text {\n return document.createTextNode(str)\n}\n\nexport function nbsp(): Text {\n return text('\\u00a0')\n}\n\nexport async function domReady(): Promise<void> {\n return new Promise((resolve) => {\n if (document.readyState == 'loading') {\n document.addEventListener('DOMContentLoaded', () => resolve(), {\n once: true\n })\n } else {\n resolve()\n }\n })\n}\n","interface FetcherInit\n extends Pick<\n RequestInit,\n 'headers' | 'credentials' | 'mode' | 'cache' | 'redirect' | 'referrerPolicy'\n > {}\n\ninterface FetcherRequest extends Omit<RequestInit, 'method'> {}\n\nconst methods = [\n 'GET',\n 'POST',\n 'PUT',\n 'PATCH',\n 'DELETE'\n] as const\n\ntype RequestMethods = typeof methods[number]\n\nexport class Fetcher {\n get: <T>(path: string, init?: FetcherRequest) => Promise<T>\n post: <T>(path: string, init?: FetcherRequest) => Promise<T>\n put: <T>(path: string, init?: FetcherRequest) => Promise<T>\n patch: <T>(path: string, init?: FetcherRequest) => Promise<T>\n delete: <T>(path: string, init?: FetcherRequest) => Promise<T>\n\n constructor(\n private readonly baseURL: string,\n private readonly baseInit?: FetcherInit\n ) {\n for (const method of methods) {\n // @ts-ignore\n this[method.toLowerCase()] = (path: string, init?: FetcherRequest) =>\n this.request(path, { ...init, method })\n }\n }\n\n async request<T>(\n path: string,\n init: FetcherRequest & { method: RequestMethods }\n ): Promise<T> {\n const url = new URL(path, this.baseURL)\n const headers = mergeHeaders(this.baseInit?.headers!, init.headers!)\n return await fetcher<T>(url, { ...this.baseInit, ...init, headers })\n }\n}\n\nexport async function fetcher<T = unknown>(\n ...args: Parameters<typeof fetch>\n): Promise<T> {\n const response = await fetch(...args)\n const data = (await response.json()) as T\n\n if (response.ok) {\n return data\n }\n\n throw new FetcherError({\n response,\n data\n })\n}\n\nexport class FetcherError<T> extends Error {\n response: Response\n data: T\n\n constructor({ response, data }: { response: Response; data: T }) {\n super(response.statusText)\n\n this.name = 'FetcherError'\n this.response = response\n this.data = data\n }\n}\n\nfunction mergeHeaders(...sources: HeadersInit[]): Headers {\n const result: Record<string, string> = {}\n\n for (const source of sources) {\n const headers = new Headers(source)\n\n for (const [key, value] of headers.entries()) {\n if (value === undefined || value === null) {\n delete result[key]\n } else {\n result[key] = value\n }\n }\n }\n\n return new Headers(result)\n}\n"],"names":["observeElement","selector","callback","target","observer","mutations","mutation","el","waitElement","resolve","debounce","fn","delay","timeoutId","args","tag","attributes","children","text","str","nbsp","domReady","methods","Fetcher","baseURL","baseInit","method","path","init","url","headers","mergeHeaders","fetcher","response","data","FetcherError","sources","result","source","key","value"],"mappings":"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"}
|
package/dist/observeElement.d.ts
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
export declare function observeElement<T extends Element = Element>(selector: string, callback: (el: T) => void, target?: HTMLElement): MutationObserver;
|
|
1
|
+
export declare function observeElement<T extends Element = Element>(selector: string, callback: (el: T, observer: MutationObserver) => void, target?: HTMLElement): MutationObserver;
|