@xyo-network/react-event 7.5.7 → 7.5.8
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/dist/browser/hooks/useCustomEvent.d.ts +1 -1
- package/dist/browser/hooks/useCustomEvent.d.ts.map +1 -1
- package/dist/browser/hooks/useEvent.d.ts +5 -2
- package/dist/browser/hooks/useEvent.d.ts.map +1 -1
- package/dist/browser/index.mjs +9 -7
- package/dist/browser/index.mjs.map +1 -1
- package/package.json +1 -1
- package/src/hooks/useCustomEvent.ts +7 -4
- package/src/hooks/useEvent.ts +8 -6
|
@@ -1,4 +1,4 @@
|
|
|
1
1
|
import type { RefObject } from 'react';
|
|
2
|
-
export type CustomEventListener<T = unknown> = (detail: T, event?:
|
|
2
|
+
export type CustomEventListener<T = unknown> = (detail: T, event?: Event) => boolean | void;
|
|
3
3
|
export declare const useCustomEvent: <TElement extends HTMLElement, TDetail = unknown>(type: string, listener?: CustomEventListener<TDetail>, customRef?: RefObject<TElement | null>) => [RefObject<TElement | null>, CustomEventListener<TDetail>];
|
|
4
4
|
//# sourceMappingURL=useCustomEvent.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useCustomEvent.d.ts","sourceRoot":"","sources":["../../../src/hooks/useCustomEvent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC,MAAM,MAAM,mBAAmB,CAAC,CAAC,GAAG,OAAO,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,EAAE,
|
|
1
|
+
{"version":3,"file":"useCustomEvent.d.ts","sourceRoot":"","sources":["../../../src/hooks/useCustomEvent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAGtC,MAAM,MAAM,mBAAmB,CAAC,CAAC,GAAG,OAAO,IAAI,CAAC,MAAM,EAAE,CAAC,EAAE,KAAK,CAAC,EAAE,KAAK,KAAK,OAAO,GAAG,IAAI,CAAA;AAE3F,eAAO,MAAM,cAAc,GAAI,QAAQ,SAAS,WAAW,EAAE,OAAO,GAAG,OAAO,EAC5E,MAAM,MAAM,EACZ,WAAW,mBAAmB,CAAC,OAAO,CAAC,EACvC,YAAY,SAAS,CAAC,QAAQ,GAAG,IAAI,CAAC,KACrC,CAAC,SAAS,CAAC,QAAQ,GAAG,IAAI,CAAC,EAAE,mBAAmB,CAAC,OAAO,CAAC,CAwC3D,CAAA"}
|
|
@@ -2,12 +2,15 @@ import type { RefObject } from 'react';
|
|
|
2
2
|
export type EventNoun = 'payload' | 'boundwitness' | 'address' | 'hash' | 'signature' | 'schema';
|
|
3
3
|
export type ExtendEventNoun<Extension extends string | void = void> = Extension extends string ? Extension : EventNoun;
|
|
4
4
|
export type EventVerb = 'click' | 'favorite';
|
|
5
|
+
export type EventData = {
|
|
6
|
+
sourceEvent?: globalThis.Event;
|
|
7
|
+
};
|
|
5
8
|
export interface Event<TNoun = ExtendEventNoun, TVerb = EventVerb, TData = string> {
|
|
6
9
|
data?: TData;
|
|
7
10
|
noun: TNoun;
|
|
8
|
-
|
|
11
|
+
sourceEvent?: globalThis.Event;
|
|
9
12
|
verb: TVerb;
|
|
10
13
|
}
|
|
11
|
-
export type EventDispatch<TNoun = ExtendEventNoun, TVerb = EventVerb, TData = string> = (noun: TNoun, verb: TVerb, data?: TData,
|
|
14
|
+
export type EventDispatch<TNoun = ExtendEventNoun, TVerb = EventVerb, TData = string> = (noun: TNoun, verb: TVerb, data?: TData, sourceEvent?: globalThis.Event) => boolean | void;
|
|
12
15
|
export declare const useEvent: <T extends HTMLElement, TNoun = ExtendEventNoun, TVerb = EventVerb, TData = string>(listener?: EventDispatch<TNoun, TVerb, TData>, sharableRef?: RefObject<T | null>) => [RefObject<T | null>, EventDispatch<TNoun, TVerb, TData>];
|
|
13
16
|
//# sourceMappingURL=useEvent.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useEvent.d.ts","sourceRoot":"","sources":["../../../src/hooks/useEvent.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAItC,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,cAAc,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,GAAG,QAAQ,CAAA;AAChG,MAAM,MAAM,eAAe,CAAC,SAAS,SAAS,MAAM,GAAG,IAAI,GAAG,IAAI,IAAI,SAAS,SAAS,MAAM,GAAG,SAAS,GAAG,SAAS,CAAA;AAEtH,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,UAAU,CAAA;AAE5C,MAAM,WAAW,KAAK,CAAC,KAAK,GAAG,eAAe,EAAE,KAAK,GAAG,SAAS,EAAE,KAAK,GAAG,MAAM;IAC/E,IAAI,CAAC,EAAE,KAAK,CAAA;IACZ,IAAI,EAAE,KAAK,CAAA;IACX,
|
|
1
|
+
{"version":3,"file":"useEvent.d.ts","sourceRoot":"","sources":["../../../src/hooks/useEvent.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,OAAO,CAAA;AAItC,MAAM,MAAM,SAAS,GAAG,SAAS,GAAG,cAAc,GAAG,SAAS,GAAG,MAAM,GAAG,WAAW,GAAG,QAAQ,CAAA;AAChG,MAAM,MAAM,eAAe,CAAC,SAAS,SAAS,MAAM,GAAG,IAAI,GAAG,IAAI,IAAI,SAAS,SAAS,MAAM,GAAG,SAAS,GAAG,SAAS,CAAA;AAEtH,MAAM,MAAM,SAAS,GAAG,OAAO,GAAG,UAAU,CAAA;AAE5C,MAAM,MAAM,SAAS,GAAG;IAAE,WAAW,CAAC,EAAE,UAAU,CAAC,KAAK,CAAA;CAAE,CAAA;AAE1D,MAAM,WAAW,KAAK,CAAC,KAAK,GAAG,eAAe,EAAE,KAAK,GAAG,SAAS,EAAE,KAAK,GAAG,MAAM;IAC/E,IAAI,CAAC,EAAE,KAAK,CAAA;IACZ,IAAI,EAAE,KAAK,CAAA;IACX,WAAW,CAAC,EAAE,UAAU,CAAC,KAAK,CAAA;IAC9B,IAAI,EAAE,KAAK,CAAA;CACZ;AAED,MAAM,MAAM,aAAa,CAAC,KAAK,GAAG,eAAe,EAAE,KAAK,GAAG,SAAS,EAAE,KAAK,GAAG,MAAM,IAAI,CACtF,IAAI,EAAE,KAAK,EACX,IAAI,EAAE,KAAK,EACX,IAAI,CAAC,EAAE,KAAK,EACZ,WAAW,CAAC,EAAE,UAAU,CAAC,KAAK,KAC3B,OAAO,GAAG,IAAI,CAAA;AAEnB,eAAO,MAAM,QAAQ,GAAI,CAAC,SAAS,WAAW,EAAE,KAAK,GAAG,eAAe,EAAE,KAAK,GAAG,SAAS,EAAE,KAAK,GAAG,MAAM,EACxG,WAAW,aAAa,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,EAC7C,cAAc,SAAS,CAAC,CAAC,GAAG,IAAI,CAAC,KAChC,CAAC,SAAS,CAAC,CAAC,GAAG,IAAI,CAAC,EAAE,aAAa,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,CAiB1D,CAAA"}
|
package/dist/browser/index.mjs
CHANGED
|
@@ -13,7 +13,7 @@ var useCustomEvent = /* @__PURE__ */ __name((type, listener, customRef) => {
|
|
|
13
13
|
const handler = currentListener ? (event) => {
|
|
14
14
|
const customEvent = event;
|
|
15
15
|
const detail = assertEx(customEvent.detail, () => "Event missing detail");
|
|
16
|
-
const stop = currentListener(detail
|
|
16
|
+
const stop = currentListener(detail);
|
|
17
17
|
if (stop) {
|
|
18
18
|
event.stopPropagation();
|
|
19
19
|
}
|
|
@@ -27,12 +27,15 @@ var useCustomEvent = /* @__PURE__ */ __name((type, listener, customRef) => {
|
|
|
27
27
|
}
|
|
28
28
|
};
|
|
29
29
|
});
|
|
30
|
-
const dispatch = /* @__PURE__ */ __name((detail) => {
|
|
30
|
+
const dispatch = /* @__PURE__ */ __name((detail, sourceEvent) => {
|
|
31
31
|
const event = new CustomEvent(type, {
|
|
32
32
|
bubbles: true,
|
|
33
33
|
cancelable: true,
|
|
34
34
|
composed: true,
|
|
35
|
-
detail
|
|
35
|
+
detail: {
|
|
36
|
+
...detail,
|
|
37
|
+
sourceEvent
|
|
38
|
+
}
|
|
36
39
|
});
|
|
37
40
|
ref.current?.dispatchEvent(event);
|
|
38
41
|
}, "dispatch");
|
|
@@ -45,15 +48,14 @@ var useCustomEvent = /* @__PURE__ */ __name((type, listener, customRef) => {
|
|
|
45
48
|
// src/hooks/useEvent.ts
|
|
46
49
|
var useEvent = /* @__PURE__ */ __name((listener, sharableRef) => {
|
|
47
50
|
const [ref, customDispatch] = useCustomEvent("xyo", listener ? (detail) => {
|
|
48
|
-
return listener(detail.noun, detail.verb, detail.data, detail.
|
|
51
|
+
return listener(detail.noun, detail.verb, detail.data, detail.sourceEvent);
|
|
49
52
|
} : void 0, sharableRef);
|
|
50
|
-
const dispatch = /* @__PURE__ */ __name((noun, verb, data,
|
|
53
|
+
const dispatch = /* @__PURE__ */ __name((noun, verb, data, sourceEvent) => {
|
|
51
54
|
return customDispatch({
|
|
52
55
|
data,
|
|
53
56
|
noun,
|
|
54
|
-
originalEvent,
|
|
55
57
|
verb
|
|
56
|
-
});
|
|
58
|
+
}, sourceEvent);
|
|
57
59
|
}, "dispatch");
|
|
58
60
|
return [
|
|
59
61
|
ref,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/hooks/useCustomEvent.ts","../../src/hooks/useEvent.ts"],"sourcesContent":["import { assertEx } from '@xylabs/sdk-js'\nimport type { RefObject } from 'react'\nimport { useEffect, useRef } from 'react'\n\nexport type CustomEventListener<T = unknown> = (detail: T, event?:
|
|
1
|
+
{"version":3,"sources":["../../src/hooks/useCustomEvent.ts","../../src/hooks/useEvent.ts"],"sourcesContent":["import { assertEx } from '@xylabs/sdk-js'\nimport type { RefObject } from 'react'\nimport { useEffect, useRef } from 'react'\n\nexport type CustomEventListener<T = unknown> = (detail: T, event?: Event) => boolean | void\n\nexport const useCustomEvent = <TElement extends HTMLElement, TDetail = unknown>(\n type: string,\n listener?: CustomEventListener<TDetail>,\n customRef?: RefObject<TElement | null>,\n): [RefObject<TElement | null>, CustomEventListener<TDetail>] => {\n const newRef = useRef<TElement>(null)\n const ref = customRef ?? newRef\n useEffect(() => {\n const element = ref?.current\n const currentListener = listener\n const handler\n = currentListener\n ? (event: Event) => {\n const customEvent = event as CustomEvent<TDetail>\n const detail = assertEx(customEvent.detail, () => 'Event missing detail')\n const stop = currentListener(detail)\n if (stop) {\n event.stopPropagation()\n }\n }\n : undefined\n\n if (handler && element) {\n element?.addEventListener(type, handler)\n }\n return () => {\n if (handler && element) {\n element?.removeEventListener(type, handler)\n }\n }\n })\n const dispatch: CustomEventListener<TDetail> = (detail?: TDetail, sourceEvent?: Event) => {\n const event = new CustomEvent<TDetail>(type, {\n bubbles: true,\n cancelable: true,\n composed: true,\n detail: {\n ...detail,\n sourceEvent,\n } as TDetail,\n })\n ref.current?.dispatchEvent(event)\n }\n return [ref, dispatch]\n}\n","import type { RefObject } from 'react'\n\nimport { useCustomEvent } from './useCustomEvent.ts'\n\nexport type EventNoun = 'payload' | 'boundwitness' | 'address' | 'hash' | 'signature' | 'schema'\nexport type ExtendEventNoun<Extension extends string | void = void> = Extension extends string ? Extension : EventNoun\n\nexport type EventVerb = 'click' | 'favorite'\n\nexport type EventData = { sourceEvent?: globalThis.Event }\n\nexport interface Event<TNoun = ExtendEventNoun, TVerb = EventVerb, TData = string> {\n data?: TData\n noun: TNoun\n sourceEvent?: globalThis.Event\n verb: TVerb\n}\n\nexport type EventDispatch<TNoun = ExtendEventNoun, TVerb = EventVerb, TData = string> = (\n noun: TNoun,\n verb: TVerb,\n data?: TData,\n sourceEvent?: globalThis.Event,\n) => boolean | void\n\nexport const useEvent = <T extends HTMLElement, TNoun = ExtendEventNoun, TVerb = EventVerb, TData = string>(\n listener?: EventDispatch<TNoun, TVerb, TData>,\n sharableRef?: RefObject<T | null>,\n): [RefObject<T | null>, EventDispatch<TNoun, TVerb, TData>] => {\n const [ref, customDispatch] = useCustomEvent<T, Event<TNoun, TVerb, TData>>(\n 'xyo',\n listener\n ? (detail: Event<TNoun, TVerb, TData>) => {\n return listener(detail.noun, detail.verb, detail.data, detail.sourceEvent)\n }\n : undefined,\n sharableRef,\n )\n\n const dispatch: EventDispatch<TNoun, TVerb, TData> = (noun: TNoun, verb: TVerb, data?: TData, sourceEvent?: globalThis.Event) => {\n return customDispatch({\n data, noun, verb,\n }, sourceEvent)\n }\n return [ref, dispatch]\n}\n"],"mappings":";;;;AAAA,SAASA,gBAAgB;AAEzB,SAASC,WAAWC,cAAc;AAI3B,IAAMC,iBAAiB,wBAC5BC,MACAC,UACAC,cAAAA;AAEA,QAAMC,SAASC,OAAiB,IAAA;AAChC,QAAMC,MAAMH,aAAaC;AACzBG,YAAU,MAAA;AACR,UAAMC,UAAUF,KAAKG;AACrB,UAAMC,kBAAkBR;AACxB,UAAMS,UACFD,kBACE,CAACE,UAAAA;AACC,YAAMC,cAAcD;AACpB,YAAME,SAASC,SAASF,YAAYC,QAAQ,MAAM,sBAAA;AAClD,YAAME,OAAON,gBAAgBI,MAAAA;AAC7B,UAAIE,MAAM;AACRJ,cAAMK,gBAAe;MACvB;IACF,IACAC;AAEN,QAAIP,WAAWH,SAAS;AACtBA,eAASW,iBAAiBlB,MAAMU,OAAAA;IAClC;AACA,WAAO,MAAA;AACL,UAAIA,WAAWH,SAAS;AACtBA,iBAASY,oBAAoBnB,MAAMU,OAAAA;MACrC;IACF;EACF,CAAA;AACA,QAAMU,WAAyC,wBAACP,QAAkBQ,gBAAAA;AAChE,UAAMV,QAAQ,IAAIW,YAAqBtB,MAAM;MAC3CuB,SAAS;MACTC,YAAY;MACZC,UAAU;MACVZ,QAAQ;QACN,GAAGA;QACHQ;MACF;IACF,CAAA;AACAhB,QAAIG,SAASkB,cAAcf,KAAAA;EAC7B,GAX+C;AAY/C,SAAO;IAACN;IAAKe;;AACf,GA5C8B;;;ACmBvB,IAAMO,WAAW,wBACtBC,UACAC,gBAAAA;AAEA,QAAM,CAACC,KAAKC,cAAAA,IAAkBC,eAC5B,OACAJ,WACI,CAACK,WAAAA;AACC,WAAOL,SAASK,OAAOC,MAAMD,OAAOE,MAAMF,OAAOG,MAAMH,OAAOI,WAAW;EAC3E,IACAC,QACJT,WAAAA;AAGF,QAAMU,WAA+C,wBAACL,MAAaC,MAAaC,MAAcC,gBAAAA;AAC5F,WAAON,eAAe;MACpBK;MAAMF;MAAMC;IACd,GAAGE,WAAAA;EACL,GAJqD;AAKrD,SAAO;IAACP;IAAKS;;AACf,GApBwB;","names":["assertEx","useEffect","useRef","useCustomEvent","type","listener","customRef","newRef","useRef","ref","useEffect","element","current","currentListener","handler","event","customEvent","detail","assertEx","stop","stopPropagation","undefined","addEventListener","removeEventListener","dispatch","sourceEvent","CustomEvent","bubbles","cancelable","composed","dispatchEvent","useEvent","listener","sharableRef","ref","customDispatch","useCustomEvent","detail","noun","verb","data","sourceEvent","undefined","dispatch"]}
|
package/package.json
CHANGED
|
@@ -2,7 +2,7 @@ import { assertEx } from '@xylabs/sdk-js'
|
|
|
2
2
|
import type { RefObject } from 'react'
|
|
3
3
|
import { useEffect, useRef } from 'react'
|
|
4
4
|
|
|
5
|
-
export type CustomEventListener<T = unknown> = (detail: T, event?:
|
|
5
|
+
export type CustomEventListener<T = unknown> = (detail: T, event?: Event) => boolean | void
|
|
6
6
|
|
|
7
7
|
export const useCustomEvent = <TElement extends HTMLElement, TDetail = unknown>(
|
|
8
8
|
type: string,
|
|
@@ -19,7 +19,7 @@ export const useCustomEvent = <TElement extends HTMLElement, TDetail = unknown>(
|
|
|
19
19
|
? (event: Event) => {
|
|
20
20
|
const customEvent = event as CustomEvent<TDetail>
|
|
21
21
|
const detail = assertEx(customEvent.detail, () => 'Event missing detail')
|
|
22
|
-
const stop = currentListener(detail
|
|
22
|
+
const stop = currentListener(detail)
|
|
23
23
|
if (stop) {
|
|
24
24
|
event.stopPropagation()
|
|
25
25
|
}
|
|
@@ -35,12 +35,15 @@ export const useCustomEvent = <TElement extends HTMLElement, TDetail = unknown>(
|
|
|
35
35
|
}
|
|
36
36
|
}
|
|
37
37
|
})
|
|
38
|
-
const dispatch: CustomEventListener<TDetail> = (detail?: TDetail) => {
|
|
38
|
+
const dispatch: CustomEventListener<TDetail> = (detail?: TDetail, sourceEvent?: Event) => {
|
|
39
39
|
const event = new CustomEvent<TDetail>(type, {
|
|
40
40
|
bubbles: true,
|
|
41
41
|
cancelable: true,
|
|
42
42
|
composed: true,
|
|
43
|
-
detail
|
|
43
|
+
detail: {
|
|
44
|
+
...detail,
|
|
45
|
+
sourceEvent,
|
|
46
|
+
} as TDetail,
|
|
44
47
|
})
|
|
45
48
|
ref.current?.dispatchEvent(event)
|
|
46
49
|
}
|
package/src/hooks/useEvent.ts
CHANGED
|
@@ -7,10 +7,12 @@ export type ExtendEventNoun<Extension extends string | void = void> = Extension
|
|
|
7
7
|
|
|
8
8
|
export type EventVerb = 'click' | 'favorite'
|
|
9
9
|
|
|
10
|
+
export type EventData = { sourceEvent?: globalThis.Event }
|
|
11
|
+
|
|
10
12
|
export interface Event<TNoun = ExtendEventNoun, TVerb = EventVerb, TData = string> {
|
|
11
13
|
data?: TData
|
|
12
14
|
noun: TNoun
|
|
13
|
-
|
|
15
|
+
sourceEvent?: globalThis.Event
|
|
14
16
|
verb: TVerb
|
|
15
17
|
}
|
|
16
18
|
|
|
@@ -18,7 +20,7 @@ export type EventDispatch<TNoun = ExtendEventNoun, TVerb = EventVerb, TData = st
|
|
|
18
20
|
noun: TNoun,
|
|
19
21
|
verb: TVerb,
|
|
20
22
|
data?: TData,
|
|
21
|
-
|
|
23
|
+
sourceEvent?: globalThis.Event,
|
|
22
24
|
) => boolean | void
|
|
23
25
|
|
|
24
26
|
export const useEvent = <T extends HTMLElement, TNoun = ExtendEventNoun, TVerb = EventVerb, TData = string>(
|
|
@@ -29,16 +31,16 @@ export const useEvent = <T extends HTMLElement, TNoun = ExtendEventNoun, TVerb =
|
|
|
29
31
|
'xyo',
|
|
30
32
|
listener
|
|
31
33
|
? (detail: Event<TNoun, TVerb, TData>) => {
|
|
32
|
-
return listener(detail.noun, detail.verb, detail.data, detail.
|
|
34
|
+
return listener(detail.noun, detail.verb, detail.data, detail.sourceEvent)
|
|
33
35
|
}
|
|
34
36
|
: undefined,
|
|
35
37
|
sharableRef,
|
|
36
38
|
)
|
|
37
39
|
|
|
38
|
-
const dispatch: EventDispatch<TNoun, TVerb, TData> = (noun: TNoun, verb: TVerb, data?: TData,
|
|
40
|
+
const dispatch: EventDispatch<TNoun, TVerb, TData> = (noun: TNoun, verb: TVerb, data?: TData, sourceEvent?: globalThis.Event) => {
|
|
39
41
|
return customDispatch({
|
|
40
|
-
data, noun,
|
|
41
|
-
})
|
|
42
|
+
data, noun, verb,
|
|
43
|
+
}, sourceEvent)
|
|
42
44
|
}
|
|
43
45
|
return [ref, dispatch]
|
|
44
46
|
}
|