@aracna/react 1.0.46 → 1.0.48

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.
Files changed (37) hide show
  1. package/components/memo.d.ts +5 -0
  2. package/components/memo.js +1 -1
  3. package/definitions/interfaces.d.ts +35 -0
  4. package/definitions/interfaces.js +0 -0
  5. package/definitions/props.d.ts +3 -3
  6. package/definitions/types.d.ts +4 -1
  7. package/functions/create-base-element-component.d.ts +6 -0
  8. package/functions/create-element-component.d.ts +6 -0
  9. package/functions/create-floating-element-component.d.ts +6 -0
  10. package/functions/create-focus-trap-element-component.d.ts +6 -0
  11. package/functions/create-form-control-element-component.d.ts +6 -0
  12. package/functions/forward-ref.d.ts +12 -0
  13. package/hooks/use-dispatch.d.ts +7 -1
  14. package/hooks/use-dispatch.js +1 -1
  15. package/hooks/use-dom-rect.d.ts +9 -0
  16. package/hooks/use-dom-rect.js +1 -0
  17. package/hooks/use-element-ref.d.ts +13 -0
  18. package/hooks/use-element-ref.js +1 -0
  19. package/hooks/use-event-listener.d.ts +23 -4
  20. package/hooks/use-event-listener.js +1 -1
  21. package/hooks/use-intersection-observer.d.ts +12 -8
  22. package/hooks/use-intersection-observer.js +1 -1
  23. package/hooks/use-life-cycle.d.ts +9 -0
  24. package/hooks/use-life-cycle.js +1 -1
  25. package/hooks/use-observable-element-component.d.ts +10 -17
  26. package/hooks/use-observable-element-component.js +1 -1
  27. package/hooks/use-window-event-listener.d.ts +6 -0
  28. package/hooks/use-window-event-listener.js +1 -1
  29. package/hooks/use-window-size.d.ts +8 -1
  30. package/hooks/use-window-size.js +1 -1
  31. package/index.cjs +1 -1
  32. package/index.d.ts +179 -30
  33. package/index.iife.js +9 -1
  34. package/index.js +1 -1
  35. package/package.json +2 -2
  36. package/hooks/use-safe-ref.d.ts +0 -3
  37. package/hooks/use-safe-ref.js +0 -1
@@ -1,3 +1,8 @@
1
1
  import { ReactNode } from 'react';
2
2
  import type { MemoProps } from '../definitions/props.js';
3
+ /**
4
+ * The `Memo` component is a wrapper for the `useMemo` hook.
5
+ *
6
+ * [Aracna Reference](https://aracna.dariosechi.it/react/components/memo)
7
+ */
3
8
  export declare function Memo(props: MemoProps): ReactNode;
@@ -1 +1 @@
1
- import{useMemo as o}from"react";function m(e){return o(()=>e.children,e.deps)}export{m as Memo};
1
+ import{useMemo as o}from"react";function m(e){return o(()=>e.children,e.deps??[])}export{m as Memo};
@@ -0,0 +1,35 @@
1
+ import type { AttributeChangeEvent, StateChangeEvent } from '@aracna/web';
2
+ import type { MutableRefObject } from 'react';
3
+ import type { UseIntersectionObserverElement } from './types.js';
4
+ export interface UseIntersectionObserverAreSomeIntersecting {
5
+ (elements: UseIntersectionObserverElement[]): boolean;
6
+ (...elements: UseIntersectionObserverElement[]): boolean;
7
+ }
8
+ export interface UseIntersectionObserverIsEveryIntersecting extends UseIntersectionObserverAreSomeIntersecting {
9
+ }
10
+ export interface UseIntersectionObserverIsIntersecting extends UseIntersectionObserverAreSomeIntersecting {
11
+ }
12
+ export interface UseIntersectionObserverReturn {
13
+ areSomeIntersecting: UseIntersectionObserverAreSomeIntersecting;
14
+ entries: IntersectionObserverEntry[];
15
+ isIntersecting: UseIntersectionObserverIsIntersecting;
16
+ isEveryIntersecting: UseIntersectionObserverIsEveryIntersecting;
17
+ observer: MutableRefObject<IntersectionObserver | undefined>;
18
+ }
19
+ export interface UseObservableElementComponentOptions {
20
+ blacklist?: string[];
21
+ whitelist?: string[];
22
+ }
23
+ export interface UseObservableElementComponentReturn<K extends keyof HTMLElementTagNameMap, P extends Record<string, string> = Record<string, string>> {
24
+ element: HTMLElementTagNameMap[K] | null;
25
+ onAttributeChange: (event: AttributeChangeEvent) => void;
26
+ onStateChange: (event: StateChangeEvent<any>) => void;
27
+ properties: P;
28
+ ref: MutableRefObject<HTMLElementTagNameMap[K] | null>;
29
+ }
30
+ export interface UseWindowSizeReturn {
31
+ innerHeight: number;
32
+ innerWidth: number;
33
+ outerHeight: number;
34
+ outerWidth: number;
35
+ }
File without changes
@@ -1,5 +1,5 @@
1
- import { DependencyList, ReactNode } from 'react';
1
+ import type { DependencyList, ReactNode } from 'react';
2
2
  export interface MemoProps {
3
- children: ReactNode;
4
- deps: DependencyList;
3
+ children?: ReactNode;
4
+ deps?: DependencyList;
5
5
  }
@@ -1,4 +1,4 @@
1
- import type { ForwardRefExoticComponent, HTMLAttributes, RefAttributes } from 'react';
1
+ import type { ForwardRefExoticComponent, HTMLAttributes, MutableRefObject, RefAttributes } from 'react';
2
2
  export type ElementComponent<Element extends HTMLElement, Props extends HTMLAttributes<Element> = {}> = ForwardRefExoticComponent<Props>;
3
3
  export type ElementComponentAttributes = Record<string, any>;
4
4
  export type ElementComponentEvents = Record<string, any>;
@@ -8,4 +8,7 @@ export type MapComponentEvents<Events extends ElementComponentEvents> = {
8
8
  };
9
9
  type KebabToCamelCase<S extends string> = S extends `${infer T}-${infer U}` ? `${T}${Capitalize<KebabToCamelCase<U>>}` : S;
10
10
  type KebabToPascalCase<S extends string> = Capitalize<KebabToCamelCase<S>>;
11
+ export type UseDOMRectElement<T extends Element> = MutableRefObject<T | null | undefined> | T | null | undefined;
12
+ export type UseEventListenerElement<T extends Element> = MutableRefObject<T | null | undefined> | T | null | undefined;
13
+ export type UseIntersectionObserverElement = MutableRefObject<Element | null | undefined> | Element | null | undefined;
11
14
  export {};
@@ -1,4 +1,10 @@
1
1
  import { KeyOf } from '@aracna/core';
2
2
  import { BaseElementAttributes, BaseElementEventMap } from '@aracna/web';
3
3
  import { ElementComponent, ElementComponentProps } from '../definitions/types.js';
4
+ /**
5
+ * Creates a new React component that renders a custom element which extends `BaseElement`.
6
+ * Optionally the events can be defined as well.
7
+ *
8
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-base-element-component)
9
+ */
4
10
  export declare function createBaseElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends BaseElementAttributes = BaseElementAttributes, Events extends BaseElementEventMap = BaseElementEventMap, Props extends ElementComponentProps<Element, Attributes, Events> = ElementComponentProps<Element, Attributes, Events>, Key extends keyof HTMLElementTagNameMap = keyof HTMLElementTagNameMap>(tag: Key, element: new () => Element, events?: KeyOf.Shallow<Events>[]): ElementComponent<Element, Props>;
@@ -1,3 +1,9 @@
1
1
  import { KeyOf } from '@aracna/core';
2
2
  import { ElementComponent, ElementComponentAttributes, ElementComponentEvents, ElementComponentProps } from '../definitions/types.js';
3
+ /**
4
+ * Creates a new React component that renders a custom element.
5
+ * Optionally the events can be defined as well.
6
+ *
7
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-element-component)
8
+ */
3
9
  export declare function createElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends ElementComponentAttributes = ElementComponentAttributes, Events extends ElementComponentEvents = ElementComponentEvents, Props extends ElementComponentProps<Element, Attributes, Events> = ElementComponentProps<Element, Attributes, Events>, Key extends keyof HTMLElementTagNameMap = keyof HTMLElementTagNameMap>(tag: Key, element: new () => Element, events?: KeyOf.Shallow<Events>[]): ElementComponent<Element, Props>;
@@ -1,4 +1,10 @@
1
1
  import { KeyOf } from '@aracna/core';
2
2
  import { FloatingElementAttributes, FloatingElementEventMap } from '@aracna/web';
3
3
  import { ElementComponent, ElementComponentProps } from '../definitions/types.js';
4
+ /**
5
+ * Creates a new React component that renders a custom element which extends `FloatingElement`.
6
+ * Optionally the events can be defined as well.
7
+ *
8
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-floating-element-component)
9
+ */
4
10
  export declare function createFloatingElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends FloatingElementAttributes = FloatingElementAttributes, Events extends FloatingElementEventMap = FloatingElementEventMap, Props extends ElementComponentProps<Element, Attributes, Events> = ElementComponentProps<Element, Attributes, Events>, Key extends keyof HTMLElementTagNameMap = keyof HTMLElementTagNameMap>(tag: Key, element: new () => Element, events?: KeyOf.Shallow<Events>[]): ElementComponent<Element, Props>;
@@ -1,4 +1,10 @@
1
1
  import { KeyOf } from '@aracna/core';
2
2
  import { FocusTrapElementAttributes, FocusTrapElementEventMap } from '@aracna/web';
3
3
  import { ElementComponent, ElementComponentProps } from '../definitions/types.js';
4
+ /**
5
+ * Creates a new React component that renders a custom element which extends `FocusTrapElement`.
6
+ * Optionally the events can be defined as well.
7
+ *
8
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-focus-trap-element-component)
9
+ */
4
10
  export declare function createFocusTrapElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends FocusTrapElementAttributes = FocusTrapElementAttributes, Events extends FocusTrapElementEventMap = FocusTrapElementEventMap, Props extends ElementComponentProps<Element, Attributes, Events> = ElementComponentProps<Element, Attributes, Events>, Key extends keyof HTMLElementTagNameMap = keyof HTMLElementTagNameMap>(tag: Key, element: new () => Element, events?: KeyOf.Shallow<Events>[]): ElementComponent<Element, Props>;
@@ -1,4 +1,10 @@
1
1
  import { KeyOf } from '@aracna/core';
2
2
  import { FormControlElementAttributes, FormControlElementEventMap } from '@aracna/web';
3
3
  import { ElementComponent, ElementComponentProps } from '../definitions/types.js';
4
+ /**
5
+ * Creates a new React component that renders a custom element which extends `FormControlElement`.
6
+ * Optionally the events can be defined as well.
7
+ *
8
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-form-control-element-component)
9
+ */
4
10
  export declare function createFormControlElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends FormControlElementAttributes = FormControlElementAttributes, Events extends FormControlElementEventMap = FormControlElementEventMap, Props extends ElementComponentProps<Element, Attributes, Events> = ElementComponentProps<Element, Attributes, Events>, Key extends keyof HTMLElementTagNameMap = keyof HTMLElementTagNameMap>(tag: Key, element: new () => Element, events?: KeyOf.Shallow<Events>[]): ElementComponent<Element, Props>;
@@ -3,6 +3,18 @@ type ForwardRefRenderFunction<T, P = {}> = (props: P, ref: ForwardedRef<T>) => R
3
3
  type NullableForwardRefRenderFunction<T, P = {}> = (props: P, ref: ForwardedRef<T>) => ReactElement<P> | null;
4
4
  type ForwardRefExoticComponent<P = {}> = (props: P) => ReactElement;
5
5
  type NullableForwardRefExoticComponent<P = {}> = (props: P) => ReactElement<P> | null;
6
+ /**
7
+ * Lets your component expose a DOM node to parent component with a ref.
8
+ * The difference with the original `forwardRef` is that this function has less strict types.
9
+ *
10
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/forward-ref)
11
+ */
6
12
  declare function forwardRef<T, P = {}>(render: ForwardRefRenderFunction<T, P>): ForwardRefExoticComponent<P>;
13
+ /**
14
+ * Lets your component expose a DOM node to parent component with a ref.
15
+ * The difference with the original `forwardRef` is that this function has less strict types.
16
+ *
17
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/forward-ref)
18
+ */
7
19
  declare function forwardRef<T, P = {}>(render: NullableForwardRefRenderFunction<T, P>): NullableForwardRefExoticComponent<P>;
8
20
  export { forwardRef };
@@ -1 +1,7 @@
1
- export declare function useDispatch(onDispatch?: () => any): () => void;
1
+ /**
2
+ * Returns a function that can be used to cause a re-render of the component.
3
+ * Optionally a callback can be passed that will be executed after the dispatch.
4
+ *
5
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-dispatch)
6
+ */
7
+ export declare function useDispatch(onDispatch?: () => unknown): () => void;
@@ -1 +1 @@
1
- import{useReducer as o}from"react";import{ComponentLifeCycle as e}from"../definitions/enums.js";import{useLifeCycle as i}from"./use-life-cycle.js";function u(r){const c=i(),t=o(()=>({}),{});return()=>{switch(c.current){case e.CONSTRUCTED:case e.UNMOUNTED:break;case e.MOUNTED:t[1](),r&&r();break}}}export{u as useDispatch};
1
+ import{useReducer as t}from"react";import{ComponentLifeCycle as e}from"../definitions/enums.js";import{useLifeCycle as i}from"./use-life-cycle.js";function a(r){const c=i(),o=t(()=>({}),{});return()=>{switch(c.current){case e.CONSTRUCTED:case e.UNMOUNTED:break;case e.MOUNTED:o[1](),r&&r();break}}}export{a as useDispatch};
@@ -0,0 +1,9 @@
1
+ import { DependencyList } from 'react';
2
+ import { UseDOMRectElement } from '../index.js';
3
+ /**
4
+ * Returns the DOMRect of an element.
5
+ * Optionally a dependency list can be passed to refresh the DOMRect.
6
+ *
7
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-element-dom-rect)
8
+ */
9
+ export declare function useDOMRect<T extends Element>(element: UseDOMRectElement<T>, deps?: DependencyList): DOMRect;
@@ -0,0 +1 @@
1
+ import{StubDOMRect as r}from"@aracna/web";import{useEffect as i,useState as o}from"react";function D(e,n=[]){const[c,t]=o(new r);return i(()=>{if(e instanceof Element){t(e.getBoundingClientRect());return}e?.current instanceof Element&&t(e.current.getBoundingClientRect())},[e,...n]),c}export{D as useDOMRect};
@@ -0,0 +1,13 @@
1
+ import { MutableRefObject } from 'react';
2
+ /**
3
+ * Returns a mutable ref object whose `.current` property is initialized with a matching element.
4
+ *
5
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-element-ref)
6
+ */
7
+ export declare function useElementRef<K extends keyof HTMLElementTagNameMap>(tagName: K, options?: ElementCreationOptions): MutableRefObject<HTMLElementTagNameMap[K]>;
8
+ /**
9
+ * Returns a mutable ref object whose `.current` property is initialized with a matching element.
10
+ *
11
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-element-ref)
12
+ */
13
+ export declare function useElementRef<K extends keyof SVGElementTagNameMap>(tagName: K, options?: ElementCreationOptions): MutableRefObject<SVGElementTagNameMap[K]>;
@@ -0,0 +1 @@
1
+ import{isWindowDefined as n}from"@aracna/core";import{useRef as a}from"react";function f(e,t){return a(n()?document.createElement(e,t):{current:{}})}export{f as useElementRef};
@@ -1,4 +1,23 @@
1
- import { DependencyList, MutableRefObject } from 'react';
2
- export declare function useEventListener<T extends Element, E extends Event, K extends keyof HTMLElementEventMap>(ref: MutableRefObject<T | null>, type: K, listener: (event: HTMLElementEventMap[K]) => any, deps?: DependencyList): void;
3
- export declare function useEventListener<T extends Element, E extends Event, K extends keyof SVGElementEventMap>(ref: MutableRefObject<T | null>, type: K, listener: (event: SVGElementEventMap[K]) => any, deps?: DependencyList): void;
4
- export declare function useEventListener<T extends Element, E extends Event>(ref: MutableRefObject<T | null>, type: string, listener: (event: E) => any, deps?: DependencyList): void;
1
+ import { DependencyList } from 'react';
2
+ import { UseEventListenerElement } from '../index.js';
3
+ /**
4
+ * Adds an event listener to the given element.
5
+ * Optionally a list of dependencies can be passed to refresh the listener.
6
+ *
7
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-event-listener)
8
+ */
9
+ export declare function useEventListener<T extends Element, K extends keyof HTMLElementEventMap>(element: UseEventListenerElement<T>, type: K, listener: (event: HTMLElementEventMap[K]) => unknown, deps?: DependencyList): void;
10
+ /**
11
+ * Adds an event listener to the given element.
12
+ * Optionally a list of dependencies can be passed to refresh the listener.
13
+ *
14
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-event-listener)
15
+ */
16
+ export declare function useEventListener<T extends Element, K extends keyof SVGElementEventMap>(element: UseEventListenerElement<T>, type: K, listener: (event: SVGElementEventMap[K]) => unknown, deps?: DependencyList): void;
17
+ /**
18
+ * Adds an event listener to the given element.
19
+ * Optionally a list of dependencies can be passed to refresh the listener.
20
+ *
21
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-event-listener)
22
+ */
23
+ export declare function useEventListener<T extends Element, E extends Event>(element: UseEventListenerElement<T>, type: string, listener: (event: E) => unknown, deps?: DependencyList): void;
@@ -1 +1 @@
1
- import{useEffect as E}from"react";function l(e,n,t,s=[]){E(()=>(e.current?.addEventListener(n,t),()=>e.current?.removeEventListener(n,t)),s)}export{l as useEventListener};
1
+ import{useEffect as E}from"react";function d(e,n,t,s=[]){E(()=>{if(e instanceof Element)return e.addEventListener(n,t),()=>e.removeEventListener(n,t);if(e?.current instanceof Element)return e.current.addEventListener(n,t),()=>e.current?.removeEventListener(n,t)},[e,n,t,...s])}export{d as useEventListener};
@@ -1,8 +1,12 @@
1
- import { MutableRefObject } from 'react';
2
- export declare function useIntersectionObserver(targets: MutableRefObject<HTMLElement | SVGElement | null>[], options?: IntersectionObserverInit): {
3
- entries: IntersectionObserverEntry[];
4
- observer: MutableRefObject<IntersectionObserver | undefined>;
5
- areSomeIntersecting: boolean;
6
- isEveryIntersecting: boolean;
7
- isIntersecting: boolean;
8
- };
1
+ import { DependencyList } from 'react';
2
+ import { UseIntersectionObserverReturn } from '../definitions/interfaces.js';
3
+ import { UseIntersectionObserverElement } from '../index.js';
4
+ /**
5
+ * Creates an IntersectionObserver and observes the given targets.
6
+ *
7
+ * - Optionally the root element, root margin and threshold can be configured.
8
+ * - Optionally a list of dependencies can be passed to refresh the IntersectionObserver.
9
+ *
10
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-intersection-observer)
11
+ */
12
+ export declare function useIntersectionObserver(targets: UseIntersectionObserverElement[], options?: IntersectionObserverInit, deps?: DependencyList): UseIntersectionObserverReturn;
@@ -1 +1 @@
1
- import{useEffect as v,useMemo as s,useRef as f,useState as O}from"react";function a(c,o){const r=f(),[t,i]=O([]),n=s(()=>t.some(e=>e.isIntersecting),[t]),u=s(()=>t.every(e=>e.isIntersecting),[t]),b=n,I=e=>{i(e)};return v(()=>{r.current=new IntersectionObserver(I,o);for(let e of c){if(!e.current)return;r.current.observe(e.current)}return()=>r.current?.disconnect()},[]),{entries:t,observer:r,areSomeIntersecting:n,isEveryIntersecting:u,isIntersecting:b}}export{a as useIntersectionObserver};
1
+ import{useEffect as O,useRef as E,useState as d}from"react";function A(i,l,b=[]){const t=E(),[r,I]=d([]),u=(...e)=>{const s=e[0]instanceof Element?e:e[0]??[],c=typeof e[0]=="object"&&Reflect.has(e[0],"current")?e:e[0]??[];return r.filter(n=>[s.includes(n.target),c.some(o=>o.current===n.target)].some(Boolean)).some(n=>n.isIntersecting)},f=(...e)=>{const s=e[0]instanceof Element?e:e[0]??[],c=typeof e[0]=="object"&&Reflect.has(e[0],"current")?e:e[0]??[];return r.filter(n=>[s.includes(n.target),c.some(o=>o.current===n.target)].some(Boolean)).every(n=>n.isIntersecting)},m=(...e)=>u(...e),v=e=>{I(e)};return O(()=>{t.current=new IntersectionObserver(v,l);for(let e of i){if(e instanceof Element){t.current.observe(e);continue}e?.current instanceof Element&&t.current.observe(e.current)}return()=>t.current?.disconnect()},[i,l,...b]),{entries:r,observer:t,areSomeIntersecting:u,isEveryIntersecting:f,isIntersecting:m}}export{A as useIntersectionObserver};
@@ -1,3 +1,12 @@
1
1
  import { MutableRefObject } from 'react';
2
2
  import { ComponentLifeCycle } from '../definitions/enums.js';
3
+ /**
4
+ * Returns the current life cycle of the component.
5
+ *
6
+ * - The `CONSTRUCTED` state means that the component has been created but not yet mounted.
7
+ * - The `MOUNTED` state means that the component has been mounted.
8
+ * - The `UNMOUNTED` state means that the component has been unmounted.
9
+ *
10
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-life-cycle)
11
+ */
3
12
  export declare function useLifeCycle(): MutableRefObject<ComponentLifeCycle>;
@@ -1 +1 @@
1
- import{useEffect as n,useRef as o}from"react";import{ComponentLifeCycle as t}from"../definitions/enums.js";function u(){const e=o(t.CONSTRUCTED);return n(()=>(e.current=t.MOUNTED,()=>{e.current=t.UNMOUNTED})),e}export{u as useLifeCycle};
1
+ import{useEffect as n,useRef as o}from"react";import{ComponentLifeCycle as t}from"../definitions/enums.js";function u(){const e=o(t.CONSTRUCTED);return n(()=>(e.current=t.MOUNTED,()=>{e.current=t.UNMOUNTED}),[]),e}export{u as useLifeCycle};
@@ -1,17 +1,10 @@
1
- import type { AttributeChangeEvent, StateChangeEvent } from '@aracna/web';
2
- import { MutableRefObject } from 'react';
3
- interface Options {
4
- blacklist?: string[];
5
- whitelist?: string[];
6
- }
7
- interface Properties extends Record<string, any> {
8
- }
9
- interface ReturnInterface<K extends keyof HTMLElementTagNameMap, P extends Properties = Properties> {
10
- element: HTMLElementTagNameMap[K] | null;
11
- onAttributeChange: (event: AttributeChangeEvent) => void;
12
- onStateChange: (event: StateChangeEvent<any>) => void;
13
- properties: P;
14
- ref: MutableRefObject<HTMLElementTagNameMap[K] | null>;
15
- }
16
- export declare function useObservableElementComponent<K extends keyof HTMLElementTagNameMap, P extends Properties = Properties>(options?: Options): ReturnInterface<K, P>;
17
- export {};
1
+ import { UseObservableElementComponentOptions, UseObservableElementComponentReturn } from '../definitions/interfaces.js';
2
+ /**
3
+ * Observes a custom element that extends `BaseElement` by listening to its attribute and state changes.
4
+ *
5
+ * - Optionally a blacklist of attributes and states can be passed to ignore them.
6
+ * - Optionally a whitelist of attributes and states can be passed to only observe them.
7
+ *
8
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-observable-element-component)
9
+ */
10
+ export declare function useObservableElementComponent<K extends keyof HTMLElementTagNameMap, P extends Record<string, string> = Record<string, string>>(options?: UseObservableElementComponentOptions): UseObservableElementComponentReturn<K, P>;
@@ -1 +1 @@
1
- import{useCallback as l,useEffect as m,useRef as d,useState as f}from"react";import{useDispatch as b}from"./use-dispatch.js";function E(t){const n=d(null),r=b(),[s,i]=f({}),u=l(e=>{e.detail&&(t?.blacklist&&t.blacklist.includes(e.detail.name)||t?.whitelist&&!t.whitelist.includes(e.detail.name)||i(a=>e.detail?{...a,[e.detail.name]:e.detail.value}:a))},[t?.blacklist,t?.whitelist]),c=l(e=>{e.detail&&(t?.blacklist&&t.blacklist.includes(e.detail.name)||t?.whitelist&&!t.whitelist.includes(e.detail.name)||i(a=>e.detail?{...a,[e.detail.name]:e.detail.value}:a))},[t?.blacklist,t?.whitelist]);return m(()=>r(),[n.current]),{element:n.current,onAttributeChange:u,onStateChange:c,properties:s,ref:n}}export{E as useObservableElementComponent};
1
+ import{useCallback as i,useEffect as c,useRef as b,useState as d}from"react";import{useDispatch as f}from"./use-dispatch.js";function k(t){const l=b(null),r=f(),[s,n]=d({}),m=i(e=>{e.detail&&(t?.blacklist&&t.blacklist.includes(e.detail.name)||t?.whitelist&&!t.whitelist.includes(e.detail.name)||n(a=>e.detail?{...a,[e.detail.name]:e.detail.value}:a))},[t?.blacklist,t?.whitelist]),u=i(e=>{e.detail&&(t?.blacklist&&t.blacklist.includes(e.detail.name)||t?.whitelist&&!t.whitelist.includes(e.detail.name)||n(a=>e.detail?{...a,[e.detail.name]:e.detail.value}:a))},[t?.blacklist,t?.whitelist]);return c(()=>r(),[l.current]),{element:l.current,onAttributeChange:m,onStateChange:u,properties:s,ref:l}}export{k as useObservableElementComponent};
@@ -1,2 +1,8 @@
1
1
  import { DependencyList } from 'react';
2
+ /**
3
+ * Adds an event listener to the window.
4
+ * Optionally a dependency list can be passed to refresh the listener.
5
+ *
6
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-window-event-listener)
7
+ */
2
8
  export declare function useWindowEventListener<K extends keyof WindowEventMap>(type: K, listener: (event: WindowEventMap[K]) => any, deps?: DependencyList): void;
@@ -1 +1 @@
1
- import{useEffect as i}from"react";function r(e,n,t=[]){i(()=>(window.addEventListener(e,n),()=>window.removeEventListener(e,n)),t)}export{r as useWindowEventListener};
1
+ import{useEffect as o}from"react";function r(e,n,t=[]){o(()=>(window.addEventListener(e,n),()=>window.removeEventListener(e,n)),[e,n,...t])}export{r as useWindowEventListener};
@@ -1,4 +1,11 @@
1
- export declare function useWindowSize(): {
1
+ import { DependencyList } from 'react';
2
+ /**
3
+ * Returns the window size.
4
+ * Optionally a dependency list can be passed to refresh the dimensions.
5
+ *
6
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-window-size)
7
+ */
8
+ export declare function useWindowSize(deps?: DependencyList): {
2
9
  innerHeight: number;
3
10
  innerWidth: number;
4
11
  outerHeight: number;
@@ -1 +1 @@
1
- import{isWindowDefined as e}from"@aracna/core";import{useState as i}from"react";import{useWindowEventListener as s}from"./use-window-event-listener.js";function H(){const[t,n]=i(e()?window.innerHeight:0),[r,o]=i(e()?window.innerWidth:0),[d,w]=i(e()?window.outerHeight:0),[u,h]=i(e()?window.outerWidth:0);return s("resize",()=>{n(window.innerHeight),o(window.innerWidth),w(window.outerHeight),h(window.outerWidth)}),{innerHeight:t,innerWidth:r,outerHeight:d,outerWidth:u}}export{H as useWindowSize};
1
+ import{isWindowDefined as e}from"@aracna/core";import{useState as n}from"react";import{useWindowEventListener as W}from"./use-window-event-listener.js";function p(i=[]){const[t,r]=n(e()?window.innerHeight:0),[o,d]=n(e()?window.innerWidth:0),[w,u]=n(e()?window.outerHeight:0),[h,s]=n(e()?window.outerWidth:0);return W("resize",()=>{r(window.innerHeight),d(window.innerWidth),u(window.outerHeight),s(window.outerWidth)},i),{innerHeight:t,innerWidth:o,outerHeight:w,outerWidth:h}}export{p as useWindowSize};
package/index.cjs CHANGED
@@ -1 +1 @@
1
- "use strict";var k=Object.create;var f=Object.defineProperty;var F=Object.getOwnPropertyDescriptor;var D=Object.getOwnPropertyNames;var H=Object.getPrototypeOf,U=Object.prototype.hasOwnProperty;var I=(e,t)=>{for(var n in t)f(e,n,{get:t[n],enumerable:!0})},g=(e,t,n,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let a of D(t))!U.call(e,a)&&a!==n&&f(e,a,{get:()=>t[a],enumerable:!(o=F(t,a))||o.enumerable});return e};var j=(e,t,n)=>(n=e!=null?k(H(e)):{},g(t||!e||!e.__esModule?f(n,"default",{value:e,enumerable:!0}):n,e)),W=e=>g(f({},"__esModule",{value:!0}),e);var Z={};I(Z,{ComponentLifeCycle:()=>x,Memo:()=>B,createBaseElementComponent:()=>p,createElementComponent:()=>v,createFloatingElementComponent:()=>V,createFocusTrapElementComponent:()=>G,createFormControlElementComponent:()=>_,forwardRef:()=>z,useDispatch:()=>T,useEventListener:()=>q,useIntersectionObserver:()=>J,useLifeCycle:()=>b,useObservableElementComponent:()=>Q,useSafeRef:()=>X,useWindowEventListener:()=>y,useWindowSize:()=>Y});module.exports=W(Z);var C=require("react");function B(e){return(0,C.useMemo)(()=>e.children,e.deps)}var x=(o=>(o.CONSTRUCTED="CONSTRUCTED",o.MOUNTED="MOUNTED",o.UNMOUNTED="UNMOUNTED",o))(x||{});var w=require("@aracna/core"),h=require("@lit/react"),O=j(require("react"),1);var P={onAbort:"abort",onAnimationEnd:"animationend",onAnimationIteration:"animationiteration",onAnimationStart:"animationstart",onAuxClick:"auxclick",onBeforeInput:"beforeinput",onBlur:"blur",onCanPlay:"canplay",onCanPlayThrough:"canplaythrough",onChange:"change",onClick:"click",onCompositionEnd:"compositionend",onCompositionStart:"compositionstart",onCompositionUpdate:"compositionupdate",onContextMenu:"contextmenu",onCopy:"copy",onCut:"cut",onDoubleClick:"doubleclick",onDrag:"drag",onDragEnd:"dragend",onDragEnter:"dragenter",onDragExit:"dragexit",onDragLeave:"dragleave",onDragOver:"dragover",onDragStart:"dragstart",onDrop:"drop",onDurationChange:"durationchange",onEmptied:"emptied",onEncrypted:"encrypted",onEnded:"ended",onError:"error",onEventHandler:"eventhandler",onFocus:"focus",onInput:"input",onInvalid:"invalid",onKeyDown:"keydown",onKeyPress:"keypress",onKeyUp:"keyup",onLoad:"load",onLoadStart:"loadstart",onLoadedData:"loadeddata",onLoadedMetadata:"loadedmetadata",onMouseDown:"mousedown",onMouseEnter:"mouseenter",onMouseLeave:"mouseleave",onMouseMove:"mousemove",onMouseOut:"mouseout",onMouseOver:"mouseover",onMouseUp:"mouseup",onPaste:"paste",onPause:"pause",onPlay:"play",onPlaying:"playing",onPointerCancel:"pointercancel",onPointerDown:"pointerdown",onPointerEnter:"pointerenter",onPointerLeave:"pointerleave",onPointerMove:"pointermove",onPointerOut:"pointerout",onPointerOver:"pointerover",onPointerUp:"pointerup",onProgress:"progress",onRateChange:"ratechange",onReset:"reset",onResize:"resize",onScroll:"scroll",onSeeked:"seeked",onSeeking:"seeking",onSelect:"select",onStalled:"stalled",onSubmit:"submit",onSuspend:"suspend",onTimeUpdate:"timeupdate",onTouchCancel:"touchcancel",onTouchEnd:"touchend",onTouchMove:"touchmove",onTouchStart:"touchstart",onTransitionEnd:"transitionend",onVolumeChange:"volumechange",onWaiting:"waiting",onWheel:"wheel"};function v(e,t,n=[]){return(0,h.createComponent)({elementClass:t,events:{...P,...n.reduce((o,a)=>({...o,["on"+(0,w.getPascalCaseString)(String(a))]:a}),{})},react:O.default,tagName:e})}function p(e,t,n=[]){return v(e,t,["attribute-change","state-change",...n])}function V(e,t,n){return p(e,t,n)}function G(e,t,n=[]){return p(e,t,["focus-trap-activate","focus-trap-deactivate","focus-trap-post-activate","focus-trap-post-deactivate",...n])}function _(e,t,n){return p(e,t,n)}var R=require("react");function z(...e){return(0,R.forwardRef)(e[0])}var N=require("react");var M=require("react");function b(){let e=(0,M.useRef)("CONSTRUCTED");return(0,M.useEffect)(()=>(e.current="MOUNTED",()=>{e.current="UNMOUNTED"})),e}function T(e){let t=b(),n=(0,N.useReducer)(()=>({}),{});return()=>{switch(t.current){case"CONSTRUCTED":case"UNMOUNTED":break;case"MOUNTED":n[1](),e&&e();break}}}var K=require("react");function q(e,t,n,o=[]){(0,K.useEffect)(()=>(e.current?.addEventListener(t,n),()=>e.current?.removeEventListener(t,n)),o)}var s=require("react");function J(e,t){let n=(0,s.useRef)(),[o,a]=(0,s.useState)([]),E=(0,s.useMemo)(()=>o.some(i=>i.isIntersecting),[o]),u=(0,s.useMemo)(()=>o.every(i=>i.isIntersecting),[o]),r=E,l=i=>{a(i)};return(0,s.useEffect)(()=>{n.current=new IntersectionObserver(l,t);for(let i of e){if(!i.current)return;n.current.observe(i.current)}return()=>n.current?.disconnect()},[]),{entries:o,observer:n,areSomeIntersecting:E,isEveryIntersecting:u,isIntersecting:r}}var m=require("react");function Q(e){let t=(0,m.useRef)(null),n=T(),[o,a]=(0,m.useState)({}),E=(0,m.useCallback)(r=>{r.detail&&(e?.blacklist&&e.blacklist.includes(r.detail.name)||e?.whitelist&&!e.whitelist.includes(r.detail.name)||a(l=>r.detail?{...l,[r.detail.name]:r.detail.value}:l))},[e?.blacklist,e?.whitelist]),u=(0,m.useCallback)(r=>{r.detail&&(e?.blacklist&&e.blacklist.includes(r.detail.name)||e?.whitelist&&!e.whitelist.includes(r.detail.name)||a(l=>r.detail?{...l,[r.detail.name]:r.detail.value}:l))},[e?.blacklist,e?.whitelist]);return(0,m.useEffect)(()=>n(),[t.current]),{element:t.current,onAttributeChange:E,onStateChange:u,properties:o,ref:t}}var L=require("@aracna/core"),A=require("react");function X(e,t){return(0,A.useRef)((0,L.isWindowDefined)()?document.createElement(e,t):{current:{}})}var S=require("react");function y(e,t,n=[]){(0,S.useEffect)(()=>(window.addEventListener(e,t),()=>window.removeEventListener(e,t)),n)}var c=require("@aracna/core"),d=require("react");function Y(){let[e,t]=(0,d.useState)((0,c.isWindowDefined)()?window.innerHeight:0),[n,o]=(0,d.useState)((0,c.isWindowDefined)()?window.innerWidth:0),[a,E]=(0,d.useState)((0,c.isWindowDefined)()?window.outerHeight:0),[u,r]=(0,d.useState)((0,c.isWindowDefined)()?window.outerWidth:0);return y("resize",()=>{t(window.innerHeight),o(window.innerWidth),E(window.outerHeight),r(window.outerWidth)}),{innerHeight:e,innerWidth:n,outerHeight:a,outerWidth:u}}
1
+ "use strict";var W=Object.create;var v=Object.defineProperty;var B=Object.getOwnPropertyDescriptor;var V=Object.getOwnPropertyNames;var _=Object.getPrototypeOf,z=Object.prototype.hasOwnProperty;var G=(e,t)=>{for(var n in t)v(e,n,{get:t[n],enumerable:!0})},P=(e,t,n,o)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of V(t))!z.call(e,s)&&s!==n&&v(e,s,{get:()=>t[s],enumerable:!(o=B(t,s))||o.enumerable});return e};var q=(e,t,n)=>(n=e!=null?W(_(e)):{},P(t||!e||!e.__esModule?v(n,"default",{value:e,enumerable:!0}):n,e)),J=e=>P(v({},"__esModule",{value:!0}),e);var ie={};G(ie,{ComponentLifeCycle:()=>h,Memo:()=>Q,createBaseElementComponent:()=>p,createElementComponent:()=>T,createFloatingElementComponent:()=>X,createFocusTrapElementComponent:()=>Y,createFormControlElementComponent:()=>Z,forwardRef:()=>$,useDOMRect:()=>ee,useDispatch:()=>O,useElementRef:()=>te,useEventListener:()=>ne,useIntersectionObserver:()=>oe,useLifeCycle:()=>x,useObservableElementComponent:()=>re,useWindowEventListener:()=>w,useWindowSize:()=>se});module.exports=J(ie);var R=require("react");function Q(e){return(0,R.useMemo)(()=>e.children,e.deps??[])}var h=(o=>(o.CONSTRUCTED="CONSTRUCTED",o.MOUNTED="MOUNTED",o.UNMOUNTED="UNMOUNTED",o))(h||{});var N=require("@aracna/core"),K=require("@lit/react"),D=q(require("react"),1);var L={onAbort:"abort",onAnimationEnd:"animationend",onAnimationIteration:"animationiteration",onAnimationStart:"animationstart",onAuxClick:"auxclick",onBeforeInput:"beforeinput",onBlur:"blur",onCanPlay:"canplay",onCanPlayThrough:"canplaythrough",onChange:"change",onClick:"click",onCompositionEnd:"compositionend",onCompositionStart:"compositionstart",onCompositionUpdate:"compositionupdate",onContextMenu:"contextmenu",onCopy:"copy",onCut:"cut",onDoubleClick:"doubleclick",onDrag:"drag",onDragEnd:"dragend",onDragEnter:"dragenter",onDragExit:"dragexit",onDragLeave:"dragleave",onDragOver:"dragover",onDragStart:"dragstart",onDrop:"drop",onDurationChange:"durationchange",onEmptied:"emptied",onEncrypted:"encrypted",onEnded:"ended",onError:"error",onEventHandler:"eventhandler",onFocus:"focus",onInput:"input",onInvalid:"invalid",onKeyDown:"keydown",onKeyPress:"keypress",onKeyUp:"keyup",onLoad:"load",onLoadStart:"loadstart",onLoadedData:"loadeddata",onLoadedMetadata:"loadedmetadata",onMouseDown:"mousedown",onMouseEnter:"mouseenter",onMouseLeave:"mouseleave",onMouseMove:"mousemove",onMouseOut:"mouseout",onMouseOver:"mouseover",onMouseUp:"mouseup",onPaste:"paste",onPause:"pause",onPlay:"play",onPlaying:"playing",onPointerCancel:"pointercancel",onPointerDown:"pointerdown",onPointerEnter:"pointerenter",onPointerLeave:"pointerleave",onPointerMove:"pointermove",onPointerOut:"pointerout",onPointerOver:"pointerover",onPointerUp:"pointerup",onProgress:"progress",onRateChange:"ratechange",onReset:"reset",onResize:"resize",onScroll:"scroll",onSeeked:"seeked",onSeeking:"seeking",onSelect:"select",onStalled:"stalled",onSubmit:"submit",onSuspend:"suspend",onTimeUpdate:"timeupdate",onTouchCancel:"touchcancel",onTouchEnd:"touchend",onTouchMove:"touchmove",onTouchStart:"touchstart",onTransitionEnd:"transitionend",onVolumeChange:"volumechange",onWaiting:"waiting",onWheel:"wheel"};function T(e,t,n=[]){return(0,K.createComponent)({elementClass:t,events:{...L,...n.reduce((o,s)=>({...o,["on"+(0,N.getPascalCaseString)(String(s))]:s}),{})},react:D.default,tagName:e})}function p(e,t,n=[]){return T(e,t,["attribute-change","state-change",...n])}function X(e,t,n){return p(e,t,n)}function Y(e,t,n=[]){return p(e,t,["focus-trap-activate","focus-trap-deactivate","focus-trap-post-activate","focus-trap-post-deactivate",...n])}function Z(e,t,n){return p(e,t,n)}var k=require("react");function $(...e){return(0,k.forwardRef)(e[0])}var A=require("react");var b=require("react");function x(){let e=(0,b.useRef)("CONSTRUCTED");return(0,b.useEffect)(()=>(e.current="MOUNTED",()=>{e.current="UNMOUNTED"}),[]),e}function O(e){let t=x(),n=(0,A.useReducer)(()=>({}),{});return()=>{switch(t.current){case"CONSTRUCTED":case"UNMOUNTED":break;case"MOUNTED":n[1](),e&&e();break}}}var U=require("@aracna/web"),y=require("react");function ee(e,t=[]){let[n,o]=(0,y.useState)(new U.StubDOMRect);return(0,y.useEffect)(()=>{if(e instanceof Element){o(e.getBoundingClientRect());return}e?.current instanceof Element&&o(e.current.getBoundingClientRect())},[e,...t]),n}var I=require("@aracna/core"),S=require("react");function te(e,t){return(0,S.useRef)((0,I.isWindowDefined)()?document.createElement(e,t):{current:{}})}var F=require("react");function ne(e,t,n,o=[]){(0,F.useEffect)(()=>{if(e instanceof Element)return e.addEventListener(t,n),()=>e.removeEventListener(t,n);if(e?.current instanceof Element)return e.current.addEventListener(t,n),()=>e.current?.removeEventListener(t,n)},[e,t,n,...o])}var u=require("react");function oe(e,t,n=[]){let o=(0,u.useRef)(),[s,c]=(0,u.useState)([]),E=(...r)=>{let M=r[0]instanceof Element?r:r[0]??[],C=typeof r[0]=="object"&&Reflect.has(r[0],"current")?r:r[0]??[];return s.filter(a=>[M.includes(a.target),C.some(g=>g.current===a.target)].some(Boolean)).some(a=>a.isIntersecting)},i=(...r)=>{let M=r[0]instanceof Element?r:r[0]??[],C=typeof r[0]=="object"&&Reflect.has(r[0],"current")?r:r[0]??[];return s.filter(a=>[M.includes(a.target),C.some(g=>g.current===a.target)].some(Boolean)).every(a=>a.isIntersecting)},m=(...r)=>E(...r),j=r=>{c(r)};return(0,u.useEffect)(()=>{o.current=new IntersectionObserver(j,t);for(let r of e){if(r instanceof Element){o.current.observe(r);continue}r?.current instanceof Element&&o.current.observe(r.current)}return()=>o.current?.disconnect()},[e,t,...n]),{entries:s,observer:o,areSomeIntersecting:E,isEveryIntersecting:i,isIntersecting:m}}var l=require("react");function re(e){let t=(0,l.useRef)(null),n=O(),[o,s]=(0,l.useState)({}),c=(0,l.useCallback)(i=>{i.detail&&(e?.blacklist&&e.blacklist.includes(i.detail.name)||e?.whitelist&&!e.whitelist.includes(i.detail.name)||s(m=>i.detail?{...m,[i.detail.name]:i.detail.value}:m))},[e?.blacklist,e?.whitelist]),E=(0,l.useCallback)(i=>{i.detail&&(e?.blacklist&&e.blacklist.includes(i.detail.name)||e?.whitelist&&!e.whitelist.includes(i.detail.name)||s(m=>i.detail?{...m,[i.detail.name]:i.detail.value}:m))},[e?.blacklist,e?.whitelist]);return(0,l.useEffect)(()=>n(),[t.current]),{element:t.current,onAttributeChange:c,onStateChange:E,properties:o,ref:t}}var H=require("react");function w(e,t,n=[]){(0,H.useEffect)(()=>(window.addEventListener(e,t),()=>window.removeEventListener(e,t)),[e,t,...n])}var d=require("@aracna/core"),f=require("react");function se(e=[]){let[t,n]=(0,f.useState)((0,d.isWindowDefined)()?window.innerHeight:0),[o,s]=(0,f.useState)((0,d.isWindowDefined)()?window.innerWidth:0),[c,E]=(0,f.useState)((0,d.isWindowDefined)()?window.outerHeight:0),[i,m]=(0,f.useState)((0,d.isWindowDefined)()?window.outerWidth:0);return w("resize",()=>{n(window.innerHeight),s(window.innerWidth),E(window.outerHeight),m(window.outerWidth)},e),{innerHeight:t,innerWidth:o,outerHeight:c,outerWidth:i}}
package/index.d.ts CHANGED
@@ -709,14 +709,44 @@ export declare enum ComponentLifeCycle {
709
709
  UNMOUNTED = "UNMOUNTED"
710
710
  }
711
711
 
712
+ /**
713
+ * Creates a new React component that renders a custom element which extends `BaseElement`.
714
+ * Optionally the events can be defined as well.
715
+ *
716
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-base-element-component)
717
+ */
712
718
  export declare function createBaseElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends BaseElementAttributes = BaseElementAttributes, Events extends BaseElementEventMap = BaseElementEventMap, Props extends ElementComponentProps<Element, Attributes, Events> = ElementComponentProps<Element, Attributes, Events>, Key extends keyof HTMLElementTagNameMap = keyof HTMLElementTagNameMap>(tag: Key, element: new () => Element, events?: KeyOf.Shallow<Events>[]): ElementComponent<Element, Props>;
713
719
 
720
+ /**
721
+ * Creates a new React component that renders a custom element.
722
+ * Optionally the events can be defined as well.
723
+ *
724
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-element-component)
725
+ */
714
726
  export declare function createElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends ElementComponentAttributes = ElementComponentAttributes, Events extends ElementComponentEvents = ElementComponentEvents, Props extends ElementComponentProps<Element, Attributes, Events> = ElementComponentProps<Element, Attributes, Events>, Key extends keyof HTMLElementTagNameMap = keyof HTMLElementTagNameMap>(tag: Key, element: new () => Element, events?: KeyOf.Shallow<Events>[]): ElementComponent<Element, Props>;
715
727
 
728
+ /**
729
+ * Creates a new React component that renders a custom element which extends `FloatingElement`.
730
+ * Optionally the events can be defined as well.
731
+ *
732
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-floating-element-component)
733
+ */
716
734
  export declare function createFloatingElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends FloatingElementAttributes = FloatingElementAttributes, Events extends FloatingElementEventMap = FloatingElementEventMap, Props extends ElementComponentProps<Element, Attributes, Events> = ElementComponentProps<Element, Attributes, Events>, Key extends keyof HTMLElementTagNameMap = keyof HTMLElementTagNameMap>(tag: Key, element: new () => Element, events?: KeyOf.Shallow<Events>[]): ElementComponent<Element, Props>;
717
735
 
736
+ /**
737
+ * Creates a new React component that renders a custom element which extends `FocusTrapElement`.
738
+ * Optionally the events can be defined as well.
739
+ *
740
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-focus-trap-element-component)
741
+ */
718
742
  export declare function createFocusTrapElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends FocusTrapElementAttributes = FocusTrapElementAttributes, Events extends FocusTrapElementEventMap = FocusTrapElementEventMap, Props extends ElementComponentProps<Element, Attributes, Events> = ElementComponentProps<Element, Attributes, Events>, Key extends keyof HTMLElementTagNameMap = keyof HTMLElementTagNameMap>(tag: Key, element: new () => Element, events?: KeyOf.Shallow<Events>[]): ElementComponent<Element, Props>;
719
743
 
744
+ /**
745
+ * Creates a new React component that renders a custom element which extends `FormControlElement`.
746
+ * Optionally the events can be defined as well.
747
+ *
748
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-form-control-element-component)
749
+ */
720
750
  export declare function createFormControlElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends FormControlElementAttributes = FormControlElementAttributes, Events extends FormControlElementEventMap = FormControlElementEventMap, Props extends ElementComponentProps<Element, Attributes, Events> = ElementComponentProps<Element, Attributes, Events>, Key extends keyof HTMLElementTagNameMap = keyof HTMLElementTagNameMap>(tag: Key, element: new () => Element, events?: KeyOf.Shallow<Events>[]): ElementComponent<Element, Props>;
721
751
 
722
752
  export declare type ElementComponent<Element extends HTMLElement, Props extends HTMLAttributes<Element> = {}> = ForwardRefExoticComponent<Props>;
@@ -727,8 +757,20 @@ export declare type ElementComponentEvents = Record<string, any>;
727
757
 
728
758
  export declare type ElementComponentProps<Element extends HTMLElement, Attributes extends ElementComponentAttributes = ElementComponentAttributes, Events extends ElementComponentEvents = ElementComponentEvents> = HTMLAttributes<Element> & RefAttributes<Element> & Attributes & MapComponentEvents<Events>;
729
759
 
760
+ /**
761
+ * Lets your component expose a DOM node to parent component with a ref.
762
+ * The difference with the original `forwardRef` is that this function has less strict types.
763
+ *
764
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/forward-ref)
765
+ */
730
766
  export declare function forwardRef<T, P = {}>(render: ForwardRefRenderFunction<T, P>): ForwardRefExoticComponent_2<P>;
731
767
 
768
+ /**
769
+ * Lets your component expose a DOM node to parent component with a ref.
770
+ * The difference with the original `forwardRef` is that this function has less strict types.
771
+ *
772
+ * [Aracna Reference](https://aracna.dariosechi.it/react/functions/forward-ref)
773
+ */
732
774
  export declare function forwardRef<T, P = {}>(render: NullableForwardRefRenderFunction<T, P>): NullableForwardRefExoticComponent<P>;
733
775
 
734
776
  declare type ForwardRefExoticComponent_2<P = {}> = (props: P) => ReactElement;
@@ -743,64 +785,171 @@ export declare type MapComponentEvents<Events extends ElementComponentEvents> =
743
785
  [key in keyof Events as key extends string ? `on${KebabToPascalCase<key>}` : key]?: (event: Events[key]) => any;
744
786
  };
745
787
 
788
+ /**
789
+ * The `Memo` component is a wrapper for the `useMemo` hook.
790
+ *
791
+ * [Aracna Reference](https://aracna.dariosechi.it/react/components/memo)
792
+ */
746
793
  export declare function Memo(props: MemoProps): ReactNode;
747
794
 
748
795
  export declare interface MemoProps {
749
- children: ReactNode;
750
- deps: DependencyList;
796
+ children?: ReactNode;
797
+ deps?: DependencyList;
751
798
  }
752
799
 
753
800
  declare type NullableForwardRefExoticComponent<P = {}> = (props: P) => ReactElement<P> | null;
754
801
 
755
802
  declare type NullableForwardRefRenderFunction<T, P = {}> = (props: P, ref: ForwardedRef<T>) => ReactElement<P> | null;
756
803
 
757
- declare interface Options {
758
- blacklist?: string[];
759
- whitelist?: string[];
804
+ /**
805
+ * Returns a function that can be used to cause a re-render of the component.
806
+ * Optionally a callback can be passed that will be executed after the dispatch.
807
+ *
808
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-dispatch)
809
+ */
810
+ export declare function useDispatch(onDispatch?: () => unknown): () => void;
811
+
812
+ /**
813
+ * Returns the DOMRect of an element.
814
+ * Optionally a dependency list can be passed to refresh the DOMRect.
815
+ *
816
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-element-dom-rect)
817
+ */
818
+ export declare function useDOMRect<T extends Element>(element: UseDOMRectElement<T>, deps?: DependencyList): DOMRect;
819
+
820
+ export declare type UseDOMRectElement<T extends Element> = MutableRefObject<T | null | undefined> | T | null | undefined;
821
+
822
+ /**
823
+ * Returns a mutable ref object whose `.current` property is initialized with a matching element.
824
+ *
825
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-element-ref)
826
+ */
827
+ export declare function useElementRef<K extends keyof HTMLElementTagNameMap>(tagName: K, options?: ElementCreationOptions): MutableRefObject<HTMLElementTagNameMap[K]>;
828
+
829
+ /**
830
+ * Returns a mutable ref object whose `.current` property is initialized with a matching element.
831
+ *
832
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-element-ref)
833
+ */
834
+ export declare function useElementRef<K extends keyof SVGElementTagNameMap>(tagName: K, options?: ElementCreationOptions): MutableRefObject<SVGElementTagNameMap[K]>;
835
+
836
+ /**
837
+ * Adds an event listener to the given element.
838
+ * Optionally a list of dependencies can be passed to refresh the listener.
839
+ *
840
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-event-listener)
841
+ */
842
+ export declare function useEventListener<T extends Element, K extends keyof HTMLElementEventMap>(element: UseEventListenerElement<T>, type: K, listener: (event: HTMLElementEventMap[K]) => unknown, deps?: DependencyList): void;
843
+
844
+ /**
845
+ * Adds an event listener to the given element.
846
+ * Optionally a list of dependencies can be passed to refresh the listener.
847
+ *
848
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-event-listener)
849
+ */
850
+ export declare function useEventListener<T extends Element, K extends keyof SVGElementEventMap>(element: UseEventListenerElement<T>, type: K, listener: (event: SVGElementEventMap[K]) => unknown, deps?: DependencyList): void;
851
+
852
+ /**
853
+ * Adds an event listener to the given element.
854
+ * Optionally a list of dependencies can be passed to refresh the listener.
855
+ *
856
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-event-listener)
857
+ */
858
+ export declare function useEventListener<T extends Element, E extends Event>(element: UseEventListenerElement<T>, type: string, listener: (event: E) => unknown, deps?: DependencyList): void;
859
+
860
+ export declare type UseEventListenerElement<T extends Element> = MutableRefObject<T | null | undefined> | T | null | undefined;
861
+
862
+ /**
863
+ * Creates an IntersectionObserver and observes the given targets.
864
+ *
865
+ * - Optionally the root element, root margin and threshold can be configured.
866
+ * - Optionally a list of dependencies can be passed to refresh the IntersectionObserver.
867
+ *
868
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-intersection-observer)
869
+ */
870
+ export declare function useIntersectionObserver(targets: UseIntersectionObserverElement[], options?: IntersectionObserverInit, deps?: DependencyList): UseIntersectionObserverReturn;
871
+
872
+ export declare interface UseIntersectionObserverAreSomeIntersecting {
873
+ (elements: UseIntersectionObserverElement[]): boolean;
874
+ (...elements: UseIntersectionObserverElement[]): boolean;
760
875
  }
761
876
 
762
- declare interface Properties extends Record<string, any> {
763
- }
877
+ export declare type UseIntersectionObserverElement = MutableRefObject<Element | null | undefined> | Element | null | undefined;
764
878
 
765
- declare interface ReturnInterface<K extends keyof HTMLElementTagNameMap, P extends Properties = Properties> {
766
- element: HTMLElementTagNameMap[K] | null;
767
- onAttributeChange: (event: AttributeChangeEvent) => void;
768
- onStateChange: (event: StateChangeEvent<any>) => void;
769
- properties: P;
770
- ref: MutableRefObject<HTMLElementTagNameMap[K] | null>;
879
+ export declare interface UseIntersectionObserverIsEveryIntersecting extends UseIntersectionObserverAreSomeIntersecting {
771
880
  }
772
881
 
773
- export declare function useDispatch(onDispatch?: () => any): () => void;
774
-
775
- export declare function useEventListener<T extends Element, E extends Event, K extends keyof HTMLElementEventMap>(ref: MutableRefObject<T | null>, type: K, listener: (event: HTMLElementEventMap[K]) => any, deps?: DependencyList): void;
776
-
777
- export declare function useEventListener<T extends Element, E extends Event, K extends keyof SVGElementEventMap>(ref: MutableRefObject<T | null>, type: K, listener: (event: SVGElementEventMap[K]) => any, deps?: DependencyList): void;
778
-
779
- export declare function useEventListener<T extends Element, E extends Event>(ref: MutableRefObject<T | null>, type: string, listener: (event: E) => any, deps?: DependencyList): void;
882
+ export declare interface UseIntersectionObserverIsIntersecting extends UseIntersectionObserverAreSomeIntersecting {
883
+ }
780
884
 
781
- export declare function useIntersectionObserver(targets: MutableRefObject<HTMLElement | SVGElement | null>[], options?: IntersectionObserverInit): {
885
+ export declare interface UseIntersectionObserverReturn {
886
+ areSomeIntersecting: UseIntersectionObserverAreSomeIntersecting;
782
887
  entries: IntersectionObserverEntry[];
888
+ isIntersecting: UseIntersectionObserverIsIntersecting;
889
+ isEveryIntersecting: UseIntersectionObserverIsEveryIntersecting;
783
890
  observer: MutableRefObject<IntersectionObserver | undefined>;
784
- areSomeIntersecting: boolean;
785
- isEveryIntersecting: boolean;
786
- isIntersecting: boolean;
787
- };
891
+ }
788
892
 
893
+ /**
894
+ * Returns the current life cycle of the component.
895
+ *
896
+ * - The `CONSTRUCTED` state means that the component has been created but not yet mounted.
897
+ * - The `MOUNTED` state means that the component has been mounted.
898
+ * - The `UNMOUNTED` state means that the component has been unmounted.
899
+ *
900
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-life-cycle)
901
+ */
789
902
  export declare function useLifeCycle(): MutableRefObject<ComponentLifeCycle>;
790
903
 
791
- export declare function useObservableElementComponent<K extends keyof HTMLElementTagNameMap, P extends Properties = Properties>(options?: Options): ReturnInterface<K, P>;
792
-
793
- export declare function useSafeRef<K extends keyof HTMLElementTagNameMap>(tagName: K, options?: ElementCreationOptions): MutableRefObject<HTMLElementTagNameMap[K]>;
904
+ /**
905
+ * Observes a custom element that extends `BaseElement` by listening to its attribute and state changes.
906
+ *
907
+ * - Optionally a blacklist of attributes and states can be passed to ignore them.
908
+ * - Optionally a whitelist of attributes and states can be passed to only observe them.
909
+ *
910
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-observable-element-component)
911
+ */
912
+ export declare function useObservableElementComponent<K extends keyof HTMLElementTagNameMap, P extends Record<string, string> = Record<string, string>>(options?: UseObservableElementComponentOptions): UseObservableElementComponentReturn<K, P>;
913
+
914
+ export declare interface UseObservableElementComponentOptions {
915
+ blacklist?: string[];
916
+ whitelist?: string[];
917
+ }
794
918
 
795
- export declare function useSafeRef<K extends keyof SVGElementTagNameMap>(tagName: K, options?: ElementCreationOptions): MutableRefObject<SVGElementTagNameMap[K]>;
919
+ export declare interface UseObservableElementComponentReturn<K extends keyof HTMLElementTagNameMap, P extends Record<string, string> = Record<string, string>> {
920
+ element: HTMLElementTagNameMap[K] | null;
921
+ onAttributeChange: (event: AttributeChangeEvent) => void;
922
+ onStateChange: (event: StateChangeEvent<any>) => void;
923
+ properties: P;
924
+ ref: MutableRefObject<HTMLElementTagNameMap[K] | null>;
925
+ }
796
926
 
927
+ /**
928
+ * Adds an event listener to the window.
929
+ * Optionally a dependency list can be passed to refresh the listener.
930
+ *
931
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-window-event-listener)
932
+ */
797
933
  export declare function useWindowEventListener<K extends keyof WindowEventMap>(type: K, listener: (event: WindowEventMap[K]) => any, deps?: DependencyList): void;
798
934
 
799
- export declare function useWindowSize(): {
935
+ /**
936
+ * Returns the window size.
937
+ * Optionally a dependency list can be passed to refresh the dimensions.
938
+ *
939
+ * [Aracna Reference](https://aracna.dariosechi.it/react/hooks/use-window-size)
940
+ */
941
+ export declare function useWindowSize(deps?: DependencyList): {
800
942
  innerHeight: number;
801
943
  innerWidth: number;
802
944
  outerHeight: number;
803
945
  outerWidth: number;
804
946
  };
805
947
 
948
+ export declare interface UseWindowSizeReturn {
949
+ innerHeight: number;
950
+ innerWidth: number;
951
+ outerHeight: number;
952
+ outerWidth: number;
953
+ }
954
+
806
955
  export { }
package/index.iife.js CHANGED
@@ -1,4 +1,4 @@
1
- "use strict";var AracnaReact=(()=>{var me=Object.create;var N=Object.defineProperty;var de=Object.getOwnPropertyDescriptor;var Te=Object.getOwnPropertyNames;var ye=Object.getPrototypeOf,_e=Object.prototype.hasOwnProperty;var G=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports),Re=(e,t)=>{for(var n in t)N(e,n,{get:t[n],enumerable:!0})},j=(e,t,n,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let s of Te(t))!_e.call(e,s)&&s!==n&&N(e,s,{get:()=>t[s],enumerable:!(r=de(t,s))||r.enumerable});return e};var d=(e,t,n)=>(n=e!=null?me(ye(e)):{},j(t||!e||!e.__esModule?N(n,"default",{value:e,enumerable:!0}):n,e)),Ae=e=>j(N({},"__esModule",{value:!0}),e);var ee=G(a=>{"use strict";var v=Symbol.for("react.element"),ve=Symbol.for("react.portal"),Ce=Symbol.for("react.fragment"),Me=Symbol.for("react.strict_mode"),Ne=Symbol.for("react.profiler"),Se=Symbol.for("react.provider"),Pe=Symbol.for("react.context"),ge=Symbol.for("react.forward_ref"),be=Symbol.for("react.suspense"),Oe=Symbol.for("react.memo"),Le=Symbol.for("react.lazy"),W=Symbol.iterator;function De(e){return e===null||typeof e!="object"?null:(e=W&&e[W]||e["@@iterator"],typeof e=="function"?e:null)}var J={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}},X=Object.assign,z={};function A(e,t,n){this.props=e,this.context=t,this.refs=z,this.updater=n||J}A.prototype.isReactComponent={};A.prototype.setState=function(e,t){if(typeof e!="object"&&typeof e!="function"&&e!=null)throw Error("setState(...): takes an object of state variables to update or a function which returns an object of state variables.");this.updater.enqueueSetState(this,e,t,"setState")};A.prototype.forceUpdate=function(e){this.updater.enqueueForceUpdate(this,e,"forceUpdate")};function Y(){}Y.prototype=A.prototype;function D(e,t,n){this.props=e,this.context=t,this.refs=z,this.updater=n||J}var h=D.prototype=new Y;h.constructor=D;X(h,A.prototype);h.isPureReactComponent=!0;var V=Array.isArray,q=Object.prototype.hasOwnProperty,x={current:null},Z={key:!0,ref:!0,__self:!0,__source:!0};function Q(e,t,n){var r,s={},E=null,u=null;if(t!=null)for(r in t.ref!==void 0&&(u=t.ref),t.key!==void 0&&(E=""+t.key),t)q.call(t,r)&&!Z.hasOwnProperty(r)&&(s[r]=t[r]);var o=arguments.length-2;if(o===1)s.children=n;else if(1<o){for(var i=Array(o),c=0;c<o;c++)i[c]=arguments[c+2];s.children=i}if(e&&e.defaultProps)for(r in o=e.defaultProps,o)s[r]===void 0&&(s[r]=o[r]);return{$$typeof:v,type:e,key:E,ref:u,props:s,_owner:x.current}}function he(e,t){return{$$typeof:v,type:e.type,key:t,ref:e.ref,props:e.props,_owner:e._owner}}function w(e){return typeof e=="object"&&e!==null&&e.$$typeof===v}function xe(e){var t={"=":"=0",":":"=2"};return"$"+e.replace(/[=:]/g,function(n){return t[n]})}var $=/\/+/g;function L(e,t){return typeof e=="object"&&e!==null&&e.key!=null?xe(""+e.key):t.toString(36)}function P(e,t,n,r,s){var E=typeof e;(E==="undefined"||E==="boolean")&&(e=null);var u=!1;if(e===null)u=!0;else switch(E){case"string":case"number":u=!0;break;case"object":switch(e.$$typeof){case v:case ve:u=!0}}if(u)return u=e,s=s(u),e=r===""?"."+L(u,0):r,V(s)?(n="",e!=null&&(n=e.replace($,"$&/")+"/"),P(s,t,n,"",function(c){return c})):s!=null&&(w(s)&&(s=he(s,n+(!s.key||u&&u.key===s.key?"":(""+s.key).replace($,"$&/")+"/")+e)),t.push(s)),1;if(u=0,r=r===""?".":r+":",V(e))for(var o=0;o<e.length;o++){E=e[o];var i=r+L(E,o);u+=P(E,t,n,i,s)}else if(i=De(e),typeof i=="function")for(e=i.call(e),o=0;!(E=e.next()).done;)E=E.value,i=r+L(E,o++),u+=P(E,t,n,i,s);else if(E==="object")throw t=String(e),Error("Objects are not valid as a React child (found: "+(t==="[object Object]"?"object with keys {"+Object.keys(e).join(", ")+"}":t)+"). If you meant to render a collection of children, use an array instead.");return u}function S(e,t,n){if(e==null)return e;var r=[],s=0;return P(e,r,"","",function(E){return t.call(n,E,s++)}),r}function we(e){if(e._status===-1){var t=e._result;t=t(),t.then(function(n){(e._status===0||e._status===-1)&&(e._status=1,e._result=n)},function(n){(e._status===0||e._status===-1)&&(e._status=2,e._result=n)}),e._status===-1&&(e._status=0,e._result=t)}if(e._status===1)return e._result.default;throw e._result}var f={current:null},g={transition:null},Fe={ReactCurrentDispatcher:f,ReactCurrentBatchConfig:g,ReactCurrentOwner:x};a.Children={map:S,forEach:function(e,t,n){S(e,function(){t.apply(this,arguments)},n)},count:function(e){var t=0;return S(e,function(){t++}),t},toArray:function(e){return S(e,function(t){return t})||[]},only:function(e){if(!w(e))throw Error("React.Children.only expected to receive a single React element child.");return e}};a.Component=A;a.Fragment=Ce;a.Profiler=Ne;a.PureComponent=D;a.StrictMode=Me;a.Suspense=be;a.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED=Fe;a.cloneElement=function(e,t,n){if(e==null)throw Error("React.cloneElement(...): The argument must be a React element, but you passed "+e+".");var r=X({},e.props),s=e.key,E=e.ref,u=e._owner;if(t!=null){if(t.ref!==void 0&&(E=t.ref,u=x.current),t.key!==void 0&&(s=""+t.key),e.type&&e.type.defaultProps)var o=e.type.defaultProps;for(i in t)q.call(t,i)&&!Z.hasOwnProperty(i)&&(r[i]=t[i]===void 0&&o!==void 0?o[i]:t[i])}var i=arguments.length-2;if(i===1)r.children=n;else if(1<i){o=Array(i);for(var c=0;c<i;c++)o[c]=arguments[c+2];r.children=o}return{$$typeof:v,type:e.type,key:s,ref:E,props:r,_owner:u}};a.createContext=function(e){return e={$$typeof:Pe,_currentValue:e,_currentValue2:e,_threadCount:0,Provider:null,Consumer:null,_defaultValue:null,_globalName:null},e.Provider={$$typeof:Se,_context:e},e.Consumer=e};a.createElement=Q;a.createFactory=function(e){var t=Q.bind(null,e);return t.type=e,t};a.createRef=function(){return{current:null}};a.forwardRef=function(e){return{$$typeof:ge,render:e}};a.isValidElement=w;a.lazy=function(e){return{$$typeof:Le,_payload:{_status:-1,_result:e},_init:we}};a.memo=function(e,t){return{$$typeof:Oe,type:e,compare:t===void 0?null:t}};a.startTransition=function(e){var t=g.transition;g.transition={};try{e()}finally{g.transition=t}};a.unstable_act=function(){throw Error("act(...) is not supported in production builds of React.")};a.useCallback=function(e,t){return f.current.useCallback(e,t)};a.useContext=function(e){return f.current.useContext(e)};a.useDebugValue=function(){};a.useDeferredValue=function(e){return f.current.useDeferredValue(e)};a.useEffect=function(e,t){return f.current.useEffect(e,t)};a.useId=function(){return f.current.useId()};a.useImperativeHandle=function(e,t,n){return f.current.useImperativeHandle(e,t,n)};a.useInsertionEffect=function(e,t){return f.current.useInsertionEffect(e,t)};a.useLayoutEffect=function(e,t){return f.current.useLayoutEffect(e,t)};a.useMemo=function(e,t){return f.current.useMemo(e,t)};a.useReducer=function(e,t,n){return f.current.useReducer(e,t,n)};a.useRef=function(e){return f.current.useRef(e)};a.useState=function(e){return f.current.useState(e)};a.useSyncExternalStore=function(e,t,n){return f.current.useSyncExternalStore(e,t,n)};a.useTransition=function(){return f.current.useTransition()};a.version="18.2.0"});var p=G((et,te)=>{"use strict";te.exports=ee()});var qe={};Re(qe,{ComponentLifeCycle:()=>re,Memo:()=>Ue,createBaseElementComponent:()=>R,createElementComponent:()=>I,createFloatingElementComponent:()=>Ge,createFocusTrapElementComponent:()=>je,createFormControlElementComponent:()=>We,forwardRef:()=>Ve,useDispatch:()=>k,useEventListener:()=>$e,useIntersectionObserver:()=>Je,useLifeCycle:()=>K,useObservableElementComponent:()=>Xe,useSafeRef:()=>ze,useWindowEventListener:()=>H,useWindowSize:()=>Ye});var ne=d(p(),1);function Ue(e){return(0,ne.useMemo)(()=>e.children,e.deps)}var re=(r=>(r.CONSTRUCTED="CONSTRUCTED",r.MOUNTED="MOUNTED",r.UNMOUNTED="UNMOUNTED",r))(re||{});var Ie="abcdefghijklmnopqrstuvwxyz";var F="0123456789",Ke="ABCDEFGHIJKLMNOPQRSTUVWXYZ",ot=F+Ie+Ke,st=F+"abcdef",it=F+"ABCDEF";var oe=/[^a-zA-Z0-9]/g;function _(){return typeof window<"u"}function ke(e,t=!1){return e.charAt(0).toUpperCase()+(t?e.slice(1).toLowerCase():e.slice(1))}function se(e){let t,n;t="",n=!1;for(let r of e){if(oe.test(r)){n=!0;continue}if(n){t+=r.toUpperCase(),n=!1;continue}t+=r}return ke(t)}var He=new Set(["children","localName","ref","style","className"]),ie=new WeakMap,Be=(e,t,n,r,s)=>{let E=s?.[t];E===void 0||n===r?(e[t]=n,n==null&&t in HTMLElement.prototype&&e.removeAttribute(t)):((u,o,i)=>{let c=ie.get(u);c===void 0&&ie.set(u,c=new Map);let m=c.get(o);i!==void 0?m===void 0?(c.set(o,m={handleEvent:i}),u.addEventListener(o,m)):m.handleEvent=i:m!==void 0&&(c.delete(o),u.removeEventListener(o,m))})(e,E,n)},U=({react:e,tagName:t,elementClass:n,events:r,displayName:s})=>{let E=new Set(Object.keys(r??{})),u=e.forwardRef((o,i)=>{let c=e.useRef(null),m=e.useRef(null),M={},B={};for(let[l,O]of Object.entries(o))He.has(l)?M[l==="className"?"class":l]=O:E.has(l)||l in n.prototype?B[l]=O:M[l]=O;return e.useLayoutEffect(()=>{if(m.current!==null){for(let l in B)Be(m.current,l,o[l],c.current?c.current[l]:void 0,r);c.current=o}}),e.useLayoutEffect(()=>{m.current?.removeAttribute("defer-hydration")},[]),M.suppressHydrationWarning=!0,e.createElement(t,{...M,ref:e.useCallback(l=>{m.current=l,typeof i=="function"?i(l):i!==null&&(i.current=l)},[i])})});return u.displayName=s??n.name,u};var ue=d(p(),1);var ae={onAbort:"abort",onAnimationEnd:"animationend",onAnimationIteration:"animationiteration",onAnimationStart:"animationstart",onAuxClick:"auxclick",onBeforeInput:"beforeinput",onBlur:"blur",onCanPlay:"canplay",onCanPlayThrough:"canplaythrough",onChange:"change",onClick:"click",onCompositionEnd:"compositionend",onCompositionStart:"compositionstart",onCompositionUpdate:"compositionupdate",onContextMenu:"contextmenu",onCopy:"copy",onCut:"cut",onDoubleClick:"doubleclick",onDrag:"drag",onDragEnd:"dragend",onDragEnter:"dragenter",onDragExit:"dragexit",onDragLeave:"dragleave",onDragOver:"dragover",onDragStart:"dragstart",onDrop:"drop",onDurationChange:"durationchange",onEmptied:"emptied",onEncrypted:"encrypted",onEnded:"ended",onError:"error",onEventHandler:"eventhandler",onFocus:"focus",onInput:"input",onInvalid:"invalid",onKeyDown:"keydown",onKeyPress:"keypress",onKeyUp:"keyup",onLoad:"load",onLoadStart:"loadstart",onLoadedData:"loadeddata",onLoadedMetadata:"loadedmetadata",onMouseDown:"mousedown",onMouseEnter:"mouseenter",onMouseLeave:"mouseleave",onMouseMove:"mousemove",onMouseOut:"mouseout",onMouseOver:"mouseover",onMouseUp:"mouseup",onPaste:"paste",onPause:"pause",onPlay:"play",onPlaying:"playing",onPointerCancel:"pointercancel",onPointerDown:"pointerdown",onPointerEnter:"pointerenter",onPointerLeave:"pointerleave",onPointerMove:"pointermove",onPointerOut:"pointerout",onPointerOver:"pointerover",onPointerUp:"pointerup",onProgress:"progress",onRateChange:"ratechange",onReset:"reset",onResize:"resize",onScroll:"scroll",onSeeked:"seeked",onSeeking:"seeking",onSelect:"select",onStalled:"stalled",onSubmit:"submit",onSuspend:"suspend",onTimeUpdate:"timeupdate",onTouchCancel:"touchcancel",onTouchEnd:"touchend",onTouchMove:"touchmove",onTouchStart:"touchstart",onTransitionEnd:"transitionend",onVolumeChange:"volumechange",onWaiting:"waiting",onWheel:"wheel"};function I(e,t,n=[]){return U({elementClass:t,events:{...ae,...n.reduce((r,s)=>({...r,["on"+se(String(s))]:s}),{})},react:ue.default,tagName:e})}function R(e,t,n=[]){return I(e,t,["attribute-change","state-change",...n])}function Ge(e,t,n){return R(e,t,n)}function je(e,t,n=[]){return R(e,t,["focus-trap-activate","focus-trap-deactivate","focus-trap-post-activate","focus-trap-post-deactivate",...n])}function We(e,t,n){return R(e,t,n)}var Ee=d(p(),1);function Ve(...e){return(0,Ee.forwardRef)(e[0])}var ce=d(p(),1);var b=d(p(),1);function K(){let e=(0,b.useRef)("CONSTRUCTED");return(0,b.useEffect)(()=>(e.current="MOUNTED",()=>{e.current="UNMOUNTED"})),e}function k(e){let t=K(),n=(0,ce.useReducer)(()=>({}),{});return()=>{switch(t.current){case"CONSTRUCTED":case"UNMOUNTED":break;case"MOUNTED":n[1](),e&&e();break}}}var le=d(p(),1);function $e(e,t,n,r=[]){(0,le.useEffect)(()=>(e.current?.addEventListener(t,n),()=>e.current?.removeEventListener(t,n)),r)}var T=d(p(),1);function Je(e,t){let n=(0,T.useRef)(),[r,s]=(0,T.useState)([]),E=(0,T.useMemo)(()=>r.some(c=>c.isIntersecting),[r]),u=(0,T.useMemo)(()=>r.every(c=>c.isIntersecting),[r]),o=E,i=c=>{s(c)};return(0,T.useEffect)(()=>{n.current=new IntersectionObserver(i,t);for(let c of e){if(!c.current)return;n.current.observe(c.current)}return()=>n.current?.disconnect()},[]),{entries:r,observer:n,areSomeIntersecting:E,isEveryIntersecting:u,isIntersecting:o}}var y=d(p(),1);function Xe(e){let t=(0,y.useRef)(null),n=k(),[r,s]=(0,y.useState)({}),E=(0,y.useCallback)(o=>{o.detail&&(e?.blacklist&&e.blacklist.includes(o.detail.name)||e?.whitelist&&!e.whitelist.includes(o.detail.name)||s(i=>o.detail?{...i,[o.detail.name]:o.detail.value}:i))},[e?.blacklist,e?.whitelist]),u=(0,y.useCallback)(o=>{o.detail&&(e?.blacklist&&e.blacklist.includes(o.detail.name)||e?.whitelist&&!e.whitelist.includes(o.detail.name)||s(i=>o.detail?{...i,[o.detail.name]:o.detail.value}:i))},[e?.blacklist,e?.whitelist]);return(0,y.useEffect)(()=>n(),[t.current]),{element:t.current,onAttributeChange:E,onStateChange:u,properties:r,ref:t}}var fe=d(p(),1);function ze(e,t){return(0,fe.useRef)(_()?document.createElement(e,t):{current:{}})}var pe=d(p(),1);function H(e,t,n=[]){(0,pe.useEffect)(()=>(window.addEventListener(e,t),()=>window.removeEventListener(e,t)),n)}var C=d(p(),1);function Ye(){let[e,t]=(0,C.useState)(_()?window.innerHeight:0),[n,r]=(0,C.useState)(_()?window.innerWidth:0),[s,E]=(0,C.useState)(_()?window.outerHeight:0),[u,o]=(0,C.useState)(_()?window.outerWidth:0);return H("resize",()=>{t(window.innerHeight),r(window.innerWidth),E(window.outerHeight),o(window.outerWidth)}),{innerHeight:e,innerWidth:n,outerHeight:s,outerWidth:u}}return Ae(qe);})();
1
+ "use strict";var AracnaReact=(()=>{var Ne=Object.create;var g=Object.defineProperty;var Me=Object.getOwnPropertyDescriptor;var Pe=Object.getOwnPropertyNames;var De=Object.getPrototypeOf,we=Object.prototype.hasOwnProperty;var U=(e,t)=>()=>(t||e((t={exports:{}}).exports,t),t.exports),Le=(e,t)=>{for(var n in t)g(e,n,{get:t[n],enumerable:!0})},Y=(e,t,n,r)=>{if(t&&typeof t=="object"||typeof t=="function")for(let o of Pe(t))!we.call(e,o)&&o!==n&&g(e,o,{get:()=>t[o],enumerable:!(r=Me(t,o))||r.enumerable});return e};var m=(e,t,n)=>(n=e!=null?Ne(De(e)):{},Y(t||!e||!e.__esModule?g(n,"default",{value:e,enumerable:!0}):n,e)),xe=e=>Y(g({},"__esModule",{value:!0}),e);var ae=U(l=>{"use strict";var b=Symbol.for("react.element"),Ue=Symbol.for("react.portal"),Ie=Symbol.for("react.fragment"),Fe=Symbol.for("react.strict_mode"),ke=Symbol.for("react.profiler"),Be=Symbol.for("react.provider"),Ke=Symbol.for("react.context"),Ge=Symbol.for("react.forward_ref"),He=Symbol.for("react.suspense"),je=Symbol.for("react.memo"),We=Symbol.for("react.lazy"),q=Symbol.iterator;function Ve(e){return e===null||typeof e!="object"?null:(e=q&&e[q]||e["@@iterator"],typeof e=="function"?e:null)}var ee={isMounted:function(){return!1},enqueueForceUpdate:function(){},enqueueReplaceState:function(){},enqueueSetState:function(){}},te=Object.assign,ne={};function A(e,t,n){this.props=e,this.context=t,this.refs=ne,this.updater=n||ee}A.prototype.isReactComponent={};A.prototype.setState=function(e,t){if(typeof e!="object"&&typeof e!="function"&&e!=null)throw Error("setState(...): takes an object of state variables to update or a function which returns an object of state variables.");this.updater.enqueueSetState(this,e,t,"setState")};A.prototype.forceUpdate=function(e){this.updater.enqueueForceUpdate(this,e,"forceUpdate")};function re(){}re.prototype=A.prototype;function F(e,t,n){this.props=e,this.context=t,this.refs=ne,this.updater=n||ee}var k=F.prototype=new re;k.constructor=F;te(k,A.prototype);k.isPureReactComponent=!0;var Z=Array.isArray,oe=Object.prototype.hasOwnProperty,B={current:null},se={key:!0,ref:!0,__self:!0,__source:!0};function ie(e,t,n){var r,o={},u=null,i=null;if(t!=null)for(r in t.ref!==void 0&&(i=t.ref),t.key!==void 0&&(u=""+t.key),t)oe.call(t,r)&&!se.hasOwnProperty(r)&&(o[r]=t[r]);var s=arguments.length-2;if(s===1)o.children=n;else if(1<s){for(var a=Array(s),E=0;E<s;E++)a[E]=arguments[E+2];o.children=a}if(e&&e.defaultProps)for(r in s=e.defaultProps,s)o[r]===void 0&&(o[r]=s[r]);return{$$typeof:b,type:e,key:u,ref:i,props:o,_owner:B.current}}function ze(e,t){return{$$typeof:b,type:e.type,key:t,ref:e.ref,props:e.props,_owner:e._owner}}function K(e){return typeof e=="object"&&e!==null&&e.$$typeof===b}function $e(e){var t={"=":"=0",":":"=2"};return"$"+e.replace(/[=:]/g,function(n){return t[n]})}var Q=/\/+/g;function I(e,t){return typeof e=="object"&&e!==null&&e.key!=null?$e(""+e.key):t.toString(36)}function M(e,t,n,r,o){var u=typeof e;(u==="undefined"||u==="boolean")&&(e=null);var i=!1;if(e===null)i=!0;else switch(u){case"string":case"number":i=!0;break;case"object":switch(e.$$typeof){case b:case Ue:i=!0}}if(i)return i=e,o=o(i),e=r===""?"."+I(i,0):r,Z(o)?(n="",e!=null&&(n=e.replace(Q,"$&/")+"/"),M(o,t,n,"",function(E){return E})):o!=null&&(K(o)&&(o=ze(o,n+(!o.key||i&&i.key===o.key?"":(""+o.key).replace(Q,"$&/")+"/")+e)),t.push(o)),1;if(i=0,r=r===""?".":r+":",Z(e))for(var s=0;s<e.length;s++){u=e[s];var a=r+I(u,s);i+=M(u,t,n,a,o)}else if(a=Ve(e),typeof a=="function")for(e=a.call(e),s=0;!(u=e.next()).done;)u=u.value,a=r+I(u,s++),i+=M(u,t,n,a,o);else if(u==="object")throw t=String(e),Error("Objects are not valid as a React child (found: "+(t==="[object Object]"?"object with keys {"+Object.keys(e).join(", ")+"}":t)+"). If you meant to render a collection of children, use an array instead.");return i}function N(e,t,n){if(e==null)return e;var r=[],o=0;return M(e,r,"","",function(u){return t.call(n,u,o++)}),r}function Je(e){if(e._status===-1){var t=e._result;t=t(),t.then(function(n){(e._status===0||e._status===-1)&&(e._status=1,e._result=n)},function(n){(e._status===0||e._status===-1)&&(e._status=2,e._result=n)}),e._status===-1&&(e._status=0,e._result=t)}if(e._status===1)return e._result.default;throw e._result}var p={current:null},P={transition:null},Xe={ReactCurrentDispatcher:p,ReactCurrentBatchConfig:P,ReactCurrentOwner:B};l.Children={map:N,forEach:function(e,t,n){N(e,function(){t.apply(this,arguments)},n)},count:function(e){var t=0;return N(e,function(){t++}),t},toArray:function(e){return N(e,function(t){return t})||[]},only:function(e){if(!K(e))throw Error("React.Children.only expected to receive a single React element child.");return e}};l.Component=A;l.Fragment=Ie;l.Profiler=ke;l.PureComponent=F;l.StrictMode=Fe;l.Suspense=He;l.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED=Xe;l.cloneElement=function(e,t,n){if(e==null)throw Error("React.cloneElement(...): The argument must be a React element, but you passed "+e+".");var r=te({},e.props),o=e.key,u=e.ref,i=e._owner;if(t!=null){if(t.ref!==void 0&&(u=t.ref,i=B.current),t.key!==void 0&&(o=""+t.key),e.type&&e.type.defaultProps)var s=e.type.defaultProps;for(a in t)oe.call(t,a)&&!se.hasOwnProperty(a)&&(r[a]=t[a]===void 0&&s!==void 0?s[a]:t[a])}var a=arguments.length-2;if(a===1)r.children=n;else if(1<a){s=Array(a);for(var E=0;E<a;E++)s[E]=arguments[E+2];r.children=s}return{$$typeof:b,type:e.type,key:o,ref:u,props:r,_owner:i}};l.createContext=function(e){return e={$$typeof:Ke,_currentValue:e,_currentValue2:e,_threadCount:0,Provider:null,Consumer:null,_defaultValue:null,_globalName:null},e.Provider={$$typeof:Be,_context:e},e.Consumer=e};l.createElement=ie;l.createFactory=function(e){var t=ie.bind(null,e);return t.type=e,t};l.createRef=function(){return{current:null}};l.forwardRef=function(e){return{$$typeof:Ge,render:e}};l.isValidElement=K;l.lazy=function(e){return{$$typeof:We,_payload:{_status:-1,_result:e},_init:Je}};l.memo=function(e,t){return{$$typeof:je,type:e,compare:t===void 0?null:t}};l.startTransition=function(e){var t=P.transition;P.transition={};try{e()}finally{P.transition=t}};l.unstable_act=function(){throw Error("act(...) is not supported in production builds of React.")};l.useCallback=function(e,t){return p.current.useCallback(e,t)};l.useContext=function(e){return p.current.useContext(e)};l.useDebugValue=function(){};l.useDeferredValue=function(e){return p.current.useDeferredValue(e)};l.useEffect=function(e,t){return p.current.useEffect(e,t)};l.useId=function(){return p.current.useId()};l.useImperativeHandle=function(e,t,n){return p.current.useImperativeHandle(e,t,n)};l.useInsertionEffect=function(e,t){return p.current.useInsertionEffect(e,t)};l.useLayoutEffect=function(e,t){return p.current.useLayoutEffect(e,t)};l.useMemo=function(e,t){return p.current.useMemo(e,t)};l.useReducer=function(e,t,n){return p.current.useReducer(e,t,n)};l.useRef=function(e){return p.current.useRef(e)};l.useState=function(e){return p.current.useState(e)};l.useSyncExternalStore=function(e,t,n){return p.current.useSyncExternalStore(e,t,n)};l.useTransition=function(){return p.current.useTransition()};l.version="18.2.0"});var d=U((bt,ue)=>{"use strict";ue.exports=ae()});var de=U(H=>{"use strict";H.parse=tt;H.serialize=nt;var et=Object.prototype.toString,D=/^[\u0009\u0020-\u007e\u0080-\u00ff]+$/;function tt(e,t){if(typeof e!="string")throw new TypeError("argument str must be a string");for(var n={},r=t||{},o=r.decode||rt,u=0;u<e.length;){var i=e.indexOf("=",u);if(i===-1)break;var s=e.indexOf(";",u);if(s===-1)s=e.length;else if(s<i){u=e.lastIndexOf(";",i-1)+1;continue}var a=e.slice(u,i).trim();if(n[a]===void 0){var E=e.slice(i+1,s).trim();E.charCodeAt(0)===34&&(E=E.slice(1,-1)),n[a]=it(E,o)}u=s+1}return n}function nt(e,t,n){var r=n||{},o=r.encode||ot;if(typeof o!="function")throw new TypeError("option encode is invalid");if(!D.test(e))throw new TypeError("argument name is invalid");var u=o(t);if(u&&!D.test(u))throw new TypeError("argument val is invalid");var i=e+"="+u;if(r.maxAge!=null){var s=r.maxAge-0;if(isNaN(s)||!isFinite(s))throw new TypeError("option maxAge is invalid");i+="; Max-Age="+Math.floor(s)}if(r.domain){if(!D.test(r.domain))throw new TypeError("option domain is invalid");i+="; Domain="+r.domain}if(r.path){if(!D.test(r.path))throw new TypeError("option path is invalid");i+="; Path="+r.path}if(r.expires){var a=r.expires;if(!st(a)||isNaN(a.valueOf()))throw new TypeError("option expires is invalid");i+="; Expires="+a.toUTCString()}if(r.httpOnly&&(i+="; HttpOnly"),r.secure&&(i+="; Secure"),r.partitioned&&(i+="; Partitioned"),r.priority){var E=typeof r.priority=="string"?r.priority.toLowerCase():r.priority;switch(E){case"low":i+="; Priority=Low";break;case"medium":i+="; Priority=Medium";break;case"high":i+="; Priority=High";break;default:throw new TypeError("option priority is invalid")}}if(r.sameSite){var c=typeof r.sameSite=="string"?r.sameSite.toLowerCase():r.sameSite;switch(c){case!0:i+="; SameSite=Strict";break;case"lax":i+="; SameSite=Lax";break;case"strict":i+="; SameSite=Strict";break;case"none":i+="; SameSite=None";break;default:throw new TypeError("option sameSite is invalid")}}return i}function rt(e){return e.indexOf("%")!==-1?decodeURIComponent(e):e}function ot(e){return encodeURIComponent(e)}function st(e){return et.call(e)==="[object Date]"||e instanceof Date}function it(e,t){try{return t(e)}catch{return e}}});var ht={};Le(ht,{ComponentLifeCycle:()=>le,Memo:()=>Ye,createBaseElementComponent:()=>R,createElementComponent:()=>z,createFloatingElementComponent:()=>ct,createFocusTrapElementComponent:()=>lt,createFormControlElementComponent:()=>Et,forwardRef:()=>ft,useDOMRect:()=>dt,useDispatch:()=>J,useElementRef:()=>Tt,useEventListener:()=>yt,useIntersectionObserver:()=>_t,useLifeCycle:()=>$,useObservableElementComponent:()=>vt,useWindowEventListener:()=>X,useWindowSize:()=>Rt});var ce=m(d(),1);function Ye(e){return(0,ce.useMemo)(()=>e.children,e.deps??[])}var le=(r=>(r.CONSTRUCTED="CONSTRUCTED",r.MOUNTED="MOUNTED",r.UNMOUNTED="UNMOUNTED",r))(le||{});var Ee=()=>({tc:{log:!0,onCatch:()=>{}},tcp:{log:!0,onCatch:()=>{}}});var qe="abcdefghijklmnopqrstuvwxyz";var G="0123456789",Ze="ABCDEFGHIJKLMNOPQRSTUVWXYZ",Nt=G+qe+Ze,Mt=G+"abcdef",Pt=G+"ABCDEF";var fe=/[^a-zA-Z0-9]/g;var O=class{static functions=Ee()};function pe(e,t=O.functions.tc.log){try{return e()}catch(n){return t&&console.error(n),O.functions.tc.onCatch(n,t),n}}function v(){return typeof window<"u"}function Qe(e,t=!1){return e.charAt(0).toUpperCase()+(t?e.slice(1).toLowerCase():e.slice(1))}function me(e){let t,n;t="",n=!1;for(let r of e){if(fe.test(r)){n=!0;continue}if(n){t+=r.toUpperCase(),n=!1;continue}t+=r}return Qe(t)}var j=m(de(),1);function Te(e,t){let n;return n=pe(()=>(0,j.parse)(e,t)),n instanceof Error?{}:n}var ye=e=>()=>[...e.entries()].map(([t,n])=>[t,n].join("=")).join(";"),_e=(e,t=Te)=>n=>{let r;if(r=t(n),!(r instanceof Error))for(let o in r){if(n.includes("Expires=Thu, 01 Jan 1970 00:00:00 GMT")){e.delete(o);continue}e.set(o,r[o])}};var W=e=>({clear:()=>e.clear(),getItem:t=>{let n;return n=e.get(t),typeof n>"u"?null:n},key:t=>{let n;return n=[...e.keys()][t],typeof n>"u"?null:n},removeItem:t=>{e.delete(t)},setItem:(t,n)=>{e.set(t,n)},get length(){return e.size}}),Xt=Object.freeze({decode:()=>"",encoding:"",fatal:!1,ignoreBOM:!1}),Yt=Object.freeze({encode:()=>new Uint8Array,encodeInto:()=>({read:0,written:0}),encoding:""});var at=new Set(["children","localName","ref","style","className"]),ve=new WeakMap,ut=(e,t,n,r,o)=>{let u=o?.[t];u===void 0||n===r?(e[t]=n,n==null&&t in HTMLElement.prototype&&e.removeAttribute(t)):((i,s,a)=>{let E=ve.get(i);E===void 0&&ve.set(i,E=new Map);let c=E.get(s);a!==void 0?c===void 0?(E.set(s,c={handleEvent:a}),i.addEventListener(s,c)):c.handleEvent=a:c!==void 0&&(E.delete(s),i.removeEventListener(s,c))})(e,u,n)},V=({react:e,tagName:t,elementClass:n,events:r,displayName:o})=>{let u=new Set(Object.keys(r??{})),i=e.forwardRef((s,a)=>{let E=e.useRef(null),c=e.useRef(null),y={},h={};for(let[f,_]of Object.entries(s))at.has(f)?y[f==="className"?"class":f]=_:u.has(f)||f in n.prototype?h[f]=_:y[f]=_;return e.useLayoutEffect(()=>{if(c.current!==null){for(let f in h)ut(c.current,f,s[f],E.current?E.current[f]:void 0,r);E.current=s}}),e.useLayoutEffect(()=>{c.current?.removeAttribute("defer-hydration")},[]),y.suppressHydrationWarning=!0,e.createElement(t,{...y,ref:e.useCallback(f=>{c.current=f,typeof a=="function"?a(f):a!==null&&(a.current=f)},[a])})});return i.displayName=o??n.name,i};var he=m(d(),1);var Re={onAbort:"abort",onAnimationEnd:"animationend",onAnimationIteration:"animationiteration",onAnimationStart:"animationstart",onAuxClick:"auxclick",onBeforeInput:"beforeinput",onBlur:"blur",onCanPlay:"canplay",onCanPlayThrough:"canplaythrough",onChange:"change",onClick:"click",onCompositionEnd:"compositionend",onCompositionStart:"compositionstart",onCompositionUpdate:"compositionupdate",onContextMenu:"contextmenu",onCopy:"copy",onCut:"cut",onDoubleClick:"doubleclick",onDrag:"drag",onDragEnd:"dragend",onDragEnter:"dragenter",onDragExit:"dragexit",onDragLeave:"dragleave",onDragOver:"dragover",onDragStart:"dragstart",onDrop:"drop",onDurationChange:"durationchange",onEmptied:"emptied",onEncrypted:"encrypted",onEnded:"ended",onError:"error",onEventHandler:"eventhandler",onFocus:"focus",onInput:"input",onInvalid:"invalid",onKeyDown:"keydown",onKeyPress:"keypress",onKeyUp:"keyup",onLoad:"load",onLoadStart:"loadstart",onLoadedData:"loadeddata",onLoadedMetadata:"loadedmetadata",onMouseDown:"mousedown",onMouseEnter:"mouseenter",onMouseLeave:"mouseleave",onMouseMove:"mousemove",onMouseOut:"mouseout",onMouseOver:"mouseover",onMouseUp:"mouseup",onPaste:"paste",onPause:"pause",onPlay:"play",onPlaying:"playing",onPointerCancel:"pointercancel",onPointerDown:"pointerdown",onPointerEnter:"pointerenter",onPointerLeave:"pointerleave",onPointerMove:"pointermove",onPointerOut:"pointerout",onPointerOver:"pointerover",onPointerUp:"pointerup",onProgress:"progress",onRateChange:"ratechange",onReset:"reset",onResize:"resize",onScroll:"scroll",onSeeked:"seeked",onSeeking:"seeking",onSelect:"select",onStalled:"stalled",onSubmit:"submit",onSuspend:"suspend",onTimeUpdate:"timeupdate",onTouchCancel:"touchcancel",onTouchEnd:"touchend",onTouchMove:"touchmove",onTouchStart:"touchstart",onTransitionEnd:"transitionend",onVolumeChange:"volumechange",onWaiting:"waiting",onWheel:"wheel"};function z(e,t,n=[]){return V({elementClass:t,events:{...Re,...n.reduce((r,o)=>({...r,["on"+me(String(o))]:o}),{})},react:he.default,tagName:e})}function R(e,t,n=[]){return z(e,t,["attribute-change","state-change",...n])}function ct(e,t,n){return R(e,t,n)}function lt(e,t,n=[]){return R(e,t,["focus-trap-activate","focus-trap-deactivate","focus-trap-post-activate","focus-trap-post-deactivate",...n])}function Et(e,t,n){return R(e,t,n)}var Ae=m(d(),1);function ft(...e){return(0,Ae.forwardRef)(e[0])}var Se=m(d(),1);var w=m(d(),1);function $(){let e=(0,w.useRef)("CONSTRUCTED");return(0,w.useEffect)(()=>(e.current="MOUNTED",()=>{e.current="UNMOUNTED"}),[]),e}function J(e){let t=$(),n=(0,Se.useReducer)(()=>({}),{});return()=>{switch(t.current){case"CONSTRUCTED":case"UNMOUNTED":break;case"MOUNTED":n[1](),e&&e();break}}}var L=class e{bottom;height;left;right;top;width;x;y;constructor(t,n,r,o){this.bottom=0,this.height=o??0,this.left=0,this.right=0,this.top=0,this.width=r??0,this.x=t??0,this.y=n??0}fromRect(t){return new e(t?.x,t?.y,t?.width,t?.height)}toJSON(){return{bottom:this.bottom,height:this.height,left:this.left,right:this.right,top:this.top,width:this.width,x:this.x,y:this.y}}};var be=new Map,On={get:ye(be),set:_e(be)},pt=new Map,Cn=W(pt),mt=new Map,gn=W(mt);var x=m(d(),1);function dt(e,t=[]){let[n,r]=(0,x.useState)(new L);return(0,x.useEffect)(()=>{if(e instanceof Element){r(e.getBoundingClientRect());return}e?.current instanceof Element&&r(e.current.getBoundingClientRect())},[e,...t]),n}var Oe=m(d(),1);function Tt(e,t){return(0,Oe.useRef)(v()?document.createElement(e,t):{current:{}})}var Ce=m(d(),1);function yt(e,t,n,r=[]){(0,Ce.useEffect)(()=>{if(e instanceof Element)return e.addEventListener(t,n),()=>e.removeEventListener(t,n);if(e?.current instanceof Element)return e.current.addEventListener(t,n),()=>e.current?.removeEventListener(t,n)},[e,t,n,...r])}var S=m(d(),1);function _t(e,t,n=[]){let r=(0,S.useRef)(),[o,u]=(0,S.useState)([]),i=(...c)=>{let y=c[0]instanceof Element?c:c[0]??[],h=typeof c[0]=="object"&&Reflect.has(c[0],"current")?c:c[0]??[];return o.filter(f=>[y.includes(f.target),h.some(_=>_.current===f.target)].some(Boolean)).some(f=>f.isIntersecting)},s=(...c)=>{let y=c[0]instanceof Element?c:c[0]??[],h=typeof c[0]=="object"&&Reflect.has(c[0],"current")?c:c[0]??[];return o.filter(f=>[y.includes(f.target),h.some(_=>_.current===f.target)].some(Boolean)).every(f=>f.isIntersecting)},a=(...c)=>i(...c),E=c=>{u(c)};return(0,S.useEffect)(()=>{r.current=new IntersectionObserver(E,t);for(let c of e){if(c instanceof Element){r.current.observe(c);continue}c?.current instanceof Element&&r.current.observe(c.current)}return()=>r.current?.disconnect()},[e,t,...n]),{entries:o,observer:r,areSomeIntersecting:i,isEveryIntersecting:s,isIntersecting:a}}var T=m(d(),1);function vt(e){let t=(0,T.useRef)(null),n=J(),[r,o]=(0,T.useState)({}),u=(0,T.useCallback)(s=>{s.detail&&(e?.blacklist&&e.blacklist.includes(s.detail.name)||e?.whitelist&&!e.whitelist.includes(s.detail.name)||o(a=>s.detail?{...a,[s.detail.name]:s.detail.value}:a))},[e?.blacklist,e?.whitelist]),i=(0,T.useCallback)(s=>{s.detail&&(e?.blacklist&&e.blacklist.includes(s.detail.name)||e?.whitelist&&!e.whitelist.includes(s.detail.name)||o(a=>s.detail?{...a,[s.detail.name]:s.detail.value}:a))},[e?.blacklist,e?.whitelist]);return(0,T.useEffect)(()=>n(),[t.current]),{element:t.current,onAttributeChange:u,onStateChange:i,properties:r,ref:t}}var ge=m(d(),1);function X(e,t,n=[]){(0,ge.useEffect)(()=>(window.addEventListener(e,t),()=>window.removeEventListener(e,t)),[e,t,...n])}var C=m(d(),1);function Rt(e=[]){let[t,n]=(0,C.useState)(v()?window.innerHeight:0),[r,o]=(0,C.useState)(v()?window.innerWidth:0),[u,i]=(0,C.useState)(v()?window.outerHeight:0),[s,a]=(0,C.useState)(v()?window.outerWidth:0);return X("resize",()=>{n(window.innerHeight),o(window.innerWidth),i(window.outerHeight),a(window.outerWidth)},e),{innerHeight:t,innerWidth:r,outerHeight:u,outerWidth:s}}return xe(ht);})();
2
2
  /*! Bundled license information:
3
3
 
4
4
  react/cjs/react.production.min.js:
@@ -12,6 +12,14 @@ react/cjs/react.production.min.js:
12
12
  * LICENSE file in the root directory of this source tree.
13
13
  *)
14
14
 
15
+ cookie/index.js:
16
+ (*!
17
+ * cookie
18
+ * Copyright(c) 2012-2014 Roman Shtylman
19
+ * Copyright(c) 2015 Douglas Christopher Wilson
20
+ * MIT Licensed
21
+ *)
22
+
15
23
  @lit/react/create-component.js:
16
24
  (**
17
25
  * @license
package/index.js CHANGED
@@ -1 +1 @@
1
- export*from"./components/memo.js";export*from"./definitions/enums.js";export*from"./functions/create-base-element-component.js";export*from"./functions/create-element-component.js";export*from"./functions/create-floating-element-component.js";export*from"./functions/create-focus-trap-element-component.js";export*from"./functions/create-form-control-element-component.js";export*from"./functions/forward-ref.js";export*from"./hooks/use-dispatch.js";export*from"./hooks/use-event-listener.js";export*from"./hooks/use-intersection-observer.js";export*from"./hooks/use-life-cycle.js";export*from"./hooks/use-observable-element-component.js";export*from"./hooks/use-safe-ref.js";export*from"./hooks/use-window-event-listener.js";export*from"./hooks/use-window-size.js";
1
+ export*from"./components/memo.js";export*from"./definitions/enums.js";export*from"./functions/create-base-element-component.js";export*from"./functions/create-element-component.js";export*from"./functions/create-floating-element-component.js";export*from"./functions/create-focus-trap-element-component.js";export*from"./functions/create-form-control-element-component.js";export*from"./functions/forward-ref.js";export*from"./hooks/use-dispatch.js";export*from"./hooks/use-dom-rect.js";export*from"./hooks/use-element-ref.js";export*from"./hooks/use-event-listener.js";export*from"./hooks/use-intersection-observer.js";export*from"./hooks/use-life-cycle.js";export*from"./hooks/use-observable-element-component.js";export*from"./hooks/use-window-event-listener.js";export*from"./hooks/use-window-size.js";
package/package.json CHANGED
@@ -5,7 +5,7 @@
5
5
  },
6
6
  "devDependencies": {
7
7
  "@aracna/core": "^1.1.77",
8
- "@aracna/web": "^1.0.69",
8
+ "@aracna/web": "^1.0.72",
9
9
  "@aracna/web-components": "^1.0.72",
10
10
  "@microsoft/api-extractor": "^7.39.0",
11
11
  "@testing-library/react": "^14.1.2",
@@ -51,7 +51,7 @@
51
51
  "sideEffects": false,
52
52
  "type": "module",
53
53
  "types": "index.d.ts",
54
- "version": "1.0.46",
54
+ "version": "1.0.48",
55
55
  "scripts": {
56
56
  "build": "rm -rf dist && node esbuild.mjs && pnpm tsc && pnpm api-extractor run --local",
57
57
  "prepublish": "pnpm test && pnpm build && pnpm version patch && cp LICENSE package.json README.md dist",
@@ -1,3 +0,0 @@
1
- import { MutableRefObject } from 'react';
2
- export declare function useSafeRef<K extends keyof HTMLElementTagNameMap>(tagName: K, options?: ElementCreationOptions): MutableRefObject<HTMLElementTagNameMap[K]>;
3
- export declare function useSafeRef<K extends keyof SVGElementTagNameMap>(tagName: K, options?: ElementCreationOptions): MutableRefObject<SVGElementTagNameMap[K]>;
@@ -1 +0,0 @@
1
- import{isWindowDefined as a}from"@aracna/core";import{useRef as n}from"react";function p(e,t){return n(a()?document.createElement(e,t):{current:{}})}export{p as useSafeRef};