@aracna/react 1.0.48 → 1.0.50

package/definitions/interfaces.d.ts

@@ -1,4 +1,4 @@
-import type { AttributeChangeEvent, StateChangeEvent } from '@aracna/web';
+import type { AttributeChangeEvent, StateChangeEvent } from '@aracna/web-components';
 import type { MutableRefObject } from 'react';
 import type { UseIntersectionObserverElement } from './types.js';
 export interface UseIntersectionObserverAreSomeIntersecting {

package/functions/create-base-element-component.d.ts

@@ -1,10 +1,10 @@
-import { KeyOf } from '@aracna/core';
-import { BaseElementAttributes, BaseElementEventMap } from '@aracna/web';
-import { ElementComponent, ElementComponentProps } from '../definitions/types.js';
+import type { KeyOf } from '@aracna/core';
+import type { AracnaBaseElementAttributes, AracnaBaseElementEventMap } from '@aracna/web-components';
+import type { ElementComponent, ElementComponentProps } from '../definitions/types.js';
 /**
  * Creates a new React component that renders a custom element which extends `BaseElement`.
  * Optionally the events can be defined as well.
  *
  * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-base-element-component)
  */
-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>;
+export declare function createBaseElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends AracnaBaseElementAttributes = AracnaBaseElementAttributes, Events extends AracnaBaseElementEventMap = AracnaBaseElementEventMap, 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>;

package/functions/create-base-element-component.js

@@ -1 +1 @@
-import{createElementComponent as m}from"./create-element-component.js";function f(e,t,n=[]){return m(e,t,["attribute-change","state-change",...n])}export{f as createBaseElementComponent};
+import{createElementComponent as a}from"./create-element-component.js";function o(e,t,n=[]){return a(e,t,["attribute-change","state-change",...n])}export{o as createBaseElementComponent};

package/functions/create-element-component.d.ts

@@ -1,5 +1,5 @@
-import { KeyOf } from '@aracna/core';
-import { ElementComponent, ElementComponentAttributes, ElementComponentEvents, ElementComponentProps } from '../definitions/types.js';
+import { type KeyOf } from '@aracna/core';
+import type { ElementComponent, ElementComponentAttributes, ElementComponentEvents, ElementComponentProps } from '../definitions/types.js';
 /**
  * Creates a new React component that renders a custom element.
  * Optionally the events can be defined as well.

package/functions/create-element-component.js

@@ -1 +1 @@
-import{getPascalCaseString as E}from"@aracna/core";import{createComponent as r}from"@lit/react";import s from"react";import{DEFAULT_ELEMENT_COMPONENT_EVENTS as p}from"../definitions/constants.js";function N(t,n,m=[]){return r({elementClass:n,events:{...p,...m.reduce((o,e)=>({...o,["on"+E(String(e))]:e}),{})},react:s,tagName:t})}export{N as createElementComponent};
+import{getPascalCaseString as E}from"@aracna/core";import{createComponent as s}from"@lit/react";import p from"react";import{DEFAULT_ELEMENT_COMPONENT_EVENTS as r}from"../definitions/constants.js";function f(t,n,o=[]){return s({elementClass:n,events:{...r,...o.reduce((m,e)=>({...m,["on"+E(String(e))]:e}),{})},react:p,tagName:t})}export{f as createElementComponent};

package/functions/create-floating-element-component.d.ts

@@ -1,10 +1,10 @@
-import { KeyOf } from '@aracna/core';
-import { FloatingElementAttributes, FloatingElementEventMap } from '@aracna/web';
-import { ElementComponent, ElementComponentProps } from '../definitions/types.js';
+import type { KeyOf } from '@aracna/core';
+import type { AracnaFloatingElementAttributes, AracnaFloatingElementEventMap } from '@aracna/web-components';
+import type { ElementComponent, ElementComponentProps } from '../definitions/types.js';
 /**
  * Creates a new React component that renders a custom element which extends `FloatingElement`.
  * Optionally the events can be defined as well.
  *
  * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-floating-element-component)
  */
-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>;
+export declare function createFloatingElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends AracnaFloatingElementAttributes = AracnaFloatingElementAttributes, Events extends AracnaFloatingElementEventMap = AracnaFloatingElementEventMap, 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>;

package/functions/create-floating-element-component.js

@@ -1 +1 @@
-import{createBaseElementComponent as m}from"./create-base-element-component.js";function f(e,t,n){return m(e,t,n)}export{f as createFloatingElementComponent};
+import{createBaseElementComponent as o}from"./create-base-element-component.js";function m(e,t,n){return o(e,t,n)}export{m as createFloatingElementComponent};

package/functions/create-focus-trap-element-component.d.ts

@@ -1,10 +1,10 @@
-import { KeyOf } from '@aracna/core';
-import { FocusTrapElementAttributes, FocusTrapElementEventMap } from '@aracna/web';
-import { ElementComponent, ElementComponentProps } from '../definitions/types.js';
+import type { KeyOf } from '@aracna/core';
+import type { AracnaFocusTrapElementAttributes, AracnaFocusTrapElementEventMap } from '@aracna/web-components';
+import type { ElementComponent, ElementComponentProps } from '../definitions/types.js';
 /**
  * Creates a new React component that renders a custom element which extends `FocusTrapElement`.
  * Optionally the events can be defined as well.
  *
  * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-focus-trap-element-component)
  */
-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>;
+export declare function createFocusTrapElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends AracnaFocusTrapElementAttributes = AracnaFocusTrapElementAttributes, Events extends AracnaFocusTrapElementEventMap = AracnaFocusTrapElementEventMap, 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>;

package/functions/create-focus-trap-element-component.js

@@ -1 +1 @@
-import{createBaseElementComponent as o}from"./create-base-element-component.js";function i(e,t,n=[]){return o(e,t,["focus-trap-activate","focus-trap-deactivate","focus-trap-post-activate","focus-trap-post-deactivate",...n])}export{i as createFocusTrapElementComponent};
+import{createBaseElementComponent as a}from"./create-base-element-component.js";function r(e,t,n=[]){return a(e,t,["focus-trap-activate","focus-trap-deactivate","focus-trap-post-activate","focus-trap-post-deactivate",...n])}export{r as createFocusTrapElementComponent};

package/functions/create-form-control-element-component.d.ts

@@ -1,10 +1,10 @@
-import { KeyOf } from '@aracna/core';
-import { FormControlElementAttributes, FormControlElementEventMap } from '@aracna/web';
-import { ElementComponent, ElementComponentProps } from '../definitions/types.js';
+import type { KeyOf } from '@aracna/core';
+import type { AracnaFormControlElementAttributes, AracnaFormControlElementEventMap } from '@aracna/web-components';
+import type { ElementComponent, ElementComponentProps } from '../definitions/types.js';
 /**
  * Creates a new React component that renders a custom element which extends `FormControlElement`.
  * Optionally the events can be defined as well.
  *
  * [Aracna Reference](https://aracna.dariosechi.it/react/functions/create-form-control-element-component)
  */
-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>;
+export declare function createFormControlElementComponent<Element extends HTMLElementTagNameMap[Key], Attributes extends AracnaFormControlElementAttributes = AracnaFormControlElementAttributes, Events extends AracnaFormControlElementEventMap = AracnaFormControlElementEventMap, 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>;

package/functions/create-form-control-element-component.js

@@ -1 +1 @@
-import{createBaseElementComponent as o}from"./create-base-element-component.js";function f(e,t,n){return o(e,t,n)}export{f as createFormControlElementComponent};
+import{createBaseElementComponent as o}from"./create-base-element-component.js";function m(e,t,n){return o(e,t,n)}export{m as createFormControlElementComponent};

package/hooks/use-intersection-observer.js

@@ -1 +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};
+import{isArray as b}from"@aracna/core";import{useEffect as y,useRef as a,useState as d}from"react";function L(c,r,u=[]){const t=a(),[s,f]=d([]),o=(...e)=>{const n=b(e[0])?e[0][0]instanceof Element?e[0]:[]:e[0]instanceof Element?e:[];if(n.length>0)return s.filter(i=>n.includes(i.target));const I=b(e[0])?e[0][0]?.current instanceof Element?e[0]:[]:e[0]?.current instanceof Element?e:[];return I.length>0?s.filter(i=>I.some(O=>O.current===i.target)):s},l=(...e)=>o(...e).some(n=>n.isIntersecting),v=(...e)=>o(...e).every(n=>n.isIntersecting),E=(...e)=>l(...e),m=e=>{f(e)};return y(()=>{t.current=new IntersectionObserver(m,r);for(let e of c){if(e instanceof Element){t.current.observe(e);continue}e?.current instanceof Element&&t.current.observe(e.current)}return()=>t.current?.disconnect()},[...c,r?.root,r?.rootMargin,r?.threshold,...u]),{entries:s,observer:t,areSomeIntersecting:l,isEveryIntersecting:v,isIntersecting:E}}export{L as useIntersectionObserver};

package/index.cjs

@@ -1 +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}}
+"use strict";var V=Object.create;var v=Object.defineProperty;var _=Object.getOwnPropertyDescriptor;var z=Object.getOwnPropertyNames;var G=Object.getPrototypeOf,q=Object.prototype.hasOwnProperty;var J=(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 z(t))!q.call(e,s)&&s!==n&&v(e,s,{get:()=>t[s],enumerable:!(o=_(t,s))||o.enumerable});return e};var Q=(e,t,n)=>(n=e!=null?V(G(e)):{},P(t||!e||!e.__esModule?v(n,"default",{value:e,enumerable:!0}):n,e)),X=e=>P(v({},"__esModule",{value:!0}),e);var me={};J(me,{ComponentLifeCycle:()=>h,Memo:()=>Y,createBaseElementComponent:()=>l,createElementComponent:()=>g,createFloatingElementComponent:()=>Z,createFocusTrapElementComponent:()=>$,createFormControlElementComponent:()=>ee,forwardRef:()=>te,useDOMRect:()=>ne,useDispatch:()=>T,useElementRef:()=>oe,useEventListener:()=>re,useIntersectionObserver:()=>se,useLifeCycle:()=>C,useObservableElementComponent:()=>ae,useWindowEventListener:()=>O,useWindowSize:()=>ie});module.exports=X(me);var A=require("react");function Y(e){return(0,A.useMemo)(()=>e.children,e.deps??[])}var h=(o=>(o.CONSTRUCTED="CONSTRUCTED",o.MOUNTED="MOUNTED",o.UNMOUNTED="UNMOUNTED",o))(h||{});var L=require("@aracna/core"),N=require("@lit/react"),K=Q(require("react"),1);var R={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 g(e,t,n=[]){return(0,N.createComponent)({elementClass:t,events:{...R,...n.reduce((o,s)=>({...o,["on"+(0,L.getPascalCaseString)(String(s))]:s}),{})},react:K.default,tagName:e})}function l(e,t,n=[]){return g(e,t,["attribute-change","state-change",...n])}function Z(e,t,n){return l(e,t,n)}function $(e,t,n=[]){return l(e,t,["focus-trap-activate","focus-trap-deactivate","focus-trap-post-activate","focus-trap-post-deactivate",...n])}function ee(e,t,n){return l(e,t,n)}var D=require("react");function te(...e){return(0,D.forwardRef)(e[0])}var I=require("react");var b=require("react");function C(){let e=(0,b.useRef)("CONSTRUCTED");return(0,b.useEffect)(()=>(e.current="MOUNTED",()=>{e.current="UNMOUNTED"}),[]),e}function T(e){let t=C(),n=(0,I.useReducer)(()=>({}),{});return()=>{switch(t.current){case"CONSTRUCTED":case"UNMOUNTED":break;case"MOUNTED":n[1](),e&&e();break}}}var k=require("@aracna/web"),y=require("react");function ne(e,t=[]){let[n,o]=(0,y.useState)(new k.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 U=require("@aracna/core"),F=require("react");function oe(e,t){return(0,F.useRef)((0,U.isWindowDefined)()?document.createElement(e,t):{current:{}})}var S=require("react");function re(e,t,n,o=[]){(0,S.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 x=require("@aracna/core"),E=require("react");function se(e,t,n=[]){let o=(0,E.useRef)(),[s,u]=(0,E.useState)([]),p=(...r)=>{let c=(0,x.isArray)(r[0])?r[0][0]instanceof Element?r[0]:[]:r[0]instanceof Element?r:[];if(c.length>0)return s.filter(M=>c.includes(M.target));let w=(0,x.isArray)(r[0])?r[0][0]?.current instanceof Element?r[0]:[]:r[0]?.current instanceof Element?r:[];return w.length>0?s.filter(M=>w.some(B=>B.current===M.target)):s},a=(...r)=>p(...r).some(c=>c.isIntersecting),i=(...r)=>p(...r).every(c=>c.isIntersecting),j=(...r)=>a(...r),W=r=>{u(r)};return(0,E.useEffect)(()=>{o.current=new IntersectionObserver(W,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?.root,t?.rootMargin,t?.threshold,...n]),{entries:s,observer:o,areSomeIntersecting:a,isEveryIntersecting:i,isIntersecting:j}}var m=require("react");function ae(e){let t=(0,m.useRef)(null),n=T(),[o,s]=(0,m.useState)({}),u=(0,m.useCallback)(a=>{a.detail&&(e?.blacklist&&e.blacklist.includes(a.detail.name)||e?.whitelist&&!e.whitelist.includes(a.detail.name)||s(i=>a.detail?{...i,[a.detail.name]:a.detail.value}:i))},[e?.blacklist,e?.whitelist]),p=(0,m.useCallback)(a=>{a.detail&&(e?.blacklist&&e.blacklist.includes(a.detail.name)||e?.whitelist&&!e.whitelist.includes(a.detail.name)||s(i=>a.detail?{...i,[a.detail.name]:a.detail.value}:i))},[e?.blacklist,e?.whitelist]);return(0,m.useEffect)(()=>n(),[t.current]),{element:t.current,onAttributeChange:u,onStateChange:p,properties:o,ref:t}}var H=require("react");function O(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 ie(e=[]){let[t,n]=(0,f.useState)((0,d.isWindowDefined)()?window.innerHeight:0),[o,s]=(0,f.useState)((0,d.isWindowDefined)()?window.innerWidth:0),[u,p]=(0,f.useState)((0,d.isWindowDefined)()?window.outerHeight:0),[a,i]=(0,f.useState)((0,d.isWindowDefined)()?window.outerWidth:0);return O("resize",()=>{n(window.innerHeight),s(window.innerWidth),p(window.outerHeight),i(window.outerWidth)},e),{innerHeight:t,innerWidth:o,outerHeight:u,outerWidth:a}}