layerchart 2.0.0-next.60 → 2.0.0-next.62

package/dist/components/Grid/Grid.svg.svelte

@@ -0,0 +1,18 @@
+<script lang="ts" module>
+  export type { GridProps, GridPropsWithoutHTML } from './Grid.shared.svelte.js';
+</script>
+
+<script lang="ts" generics="T extends Transition = Transition">
+  import GridBase from './Grid.base.svelte';
+  import Group from '../Group/Group.svg.svelte';
+  import Line from '../Line/Line.svg.svelte';
+  import Circle from '../Circle/Circle.svg.svelte';
+  import Rule from '../Rule/Rule.svg.svelte';
+
+  import type { Transition } from '../../utils/types.js';
+  import type { GridProps } from './Grid.shared.svelte.js';
+
+  let props: GridProps<T> = $props();
+</script>
+
+<GridBase {Group} {Line} {Circle} {Rule} {...props} />

package/dist/components/Grid/Grid.svg.svelte.d.ts

@@ -0,0 +1,27 @@
+export type { GridProps, GridPropsWithoutHTML } from './Grid.shared.svelte.js';
+import type { Transition } from '../../utils/types.js';
+import type { GridProps } from './Grid.shared.svelte.js';
+declare function $$render<T extends Transition = Transition>(): {
+    props: GridProps<T>;
+    exports: {};
+    bindings: "";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<T extends Transition = Transition> {
+    props(): ReturnType<typeof $$render<T>>['props'];
+    events(): ReturnType<typeof $$render<T>>['events'];
+    slots(): ReturnType<typeof $$render<T>>['slots'];
+    bindings(): "";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <T extends Transition = Transition>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
+    } & ReturnType<__sveltets_Render<T>['exports']>;
+    <T extends Transition = Transition>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {}): ReturnType<__sveltets_Render<T>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const Grid: $$IsomorphicComponent;
+type Grid<T extends Transition = Transition> = InstanceType<typeof Grid<T>>;
+export default Grid;

package/dist/components/Group/Group.canvas.svelte

@@ -0,0 +1,38 @@
+<script lang="ts" module>
+  export type {
+    GroupProps,
+    GroupPropsWithoutHTML,
+  } from './Group.shared.svelte.js';
+</script>
+
+<script lang="ts">
+  import { GroupState, type GroupProps } from './Group.shared.svelte.js';
+
+  let { children, ...rest }: GroupProps = $props();
+
+  const c = new GroupState(() => ({ children, ...rest }) as GroupProps);
+
+  c.chartCtx.registerComponent({
+    name: 'Group',
+    kind: 'group',
+    canvasRender: {
+      render: (ctx) => {
+        ctx.translate(c.motionX ?? 0, c.motionY ?? 0);
+        if (rest.opacity != null) {
+          ctx.globalAlpha *= rest.opacity;
+        }
+      },
+      events: {
+        click: (rest as any).onclick,
+        dblclick: (rest as any).ondblclick,
+        pointerenter: (rest as any).onpointerenter,
+        pointermove: (rest as any).onpointermove,
+        pointerleave: (rest as any).onpointerleave,
+        pointerdown: (rest as any).onpointerdown,
+      },
+      deps: () => [c.motionX, c.motionY, rest.opacity],
+    },
+  });
+</script>
+
+{@render children?.()}

package/dist/components/Group/Group.canvas.svelte.d.ts

@@ -0,0 +1,5 @@
+export type { GroupProps, GroupPropsWithoutHTML, } from './Group.shared.svelte.js';
+import { type GroupProps } from './Group.shared.svelte.js';
+declare const Group: import("svelte").Component<GroupProps, {}, "">;
+type Group = ReturnType<typeof Group>;
+export default Group;

package/dist/components/Group/Group.html.svelte

@@ -0,0 +1,100 @@
+<script lang="ts" module>
+  export type {
+    GroupProps,
+    GroupPropsWithoutHTML,
+  } from './Group.shared.svelte.js';
+</script>
+
+<script lang="ts" generics="T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition">
+  import type { TouchEventHandler } from 'svelte/elements';
+  import { GroupState, type GroupProps } from './Group.shared.svelte.js';
+
+  let {
+    preventTouchMove = false,
+    transitionIn: transitionInProp,
+    transitionInParams: transitionInParamsProp,
+    class: className,
+    children,
+    ref: refProp = $bindable(),
+    // Internal-only: pulled out so `{...rest}` doesn't pollute DOM attrs.
+    x,
+    y,
+    initialX,
+    initialY,
+    data,
+    key,
+    center,
+    motion,
+    ...rest
+  }: GroupProps<T> = $props();
+
+  const c = new GroupState(
+    () =>
+      ({
+        preventTouchMove,
+        transitionIn: transitionInProp,
+        transitionInParams: transitionInParamsProp,
+        class: className,
+        children,
+        x,
+        y,
+        initialX,
+        initialY,
+        data,
+        key,
+        center,
+        motion,
+        ...rest,
+      }) as GroupProps
+  );
+
+  let ref = $state<Element>();
+
+  $effect.pre(() => {
+    refProp = ref;
+  });
+
+  const transitionIn = $derived(transitionInProp ?? c.defaultTransitionIn) as T;
+  const transitionInParams = $derived(transitionInParamsProp ?? c.defaultTransitionInParams);
+
+  const handleTouchMove: TouchEventHandler<Element> = (e) => {
+    if (preventTouchMove) {
+      e.preventDefault();
+    }
+    (rest as any).ontouchmove?.(e);
+  };
+</script>
+
+{#if c.dataMode}
+  {#each c.resolvedItems as item (item.key)}
+    <div
+      style:transform="translate({item.x}px, {item.y}px)"
+      style:opacity={rest.opacity}
+      {...rest}
+      class={['lc-group-div', className]}
+      ontouchmove={handleTouchMove}
+    >
+      {@render children?.()}
+    </div>
+  {/each}
+{:else}
+  <div
+    bind:this={ref}
+    style:transform={c.transform}
+    style:opacity={rest.opacity}
+    in:transitionIn={transitionInParams}
+    {...rest}
+    class={['lc-group-div', className]}
+    ontouchmove={handleTouchMove}
+  >
+    {@render children?.()}
+  </div>
+{/if}
+
+<style>
+  @layer base {
+    :where(.lc-group-div) {
+      position: absolute;
+    }
+  }
+</style>

package/dist/components/Group/Group.html.svelte.d.ts

@@ -0,0 +1,26 @@
+export type { GroupProps, GroupPropsWithoutHTML, } from './Group.shared.svelte.js';
+import { type GroupProps } from './Group.shared.svelte.js';
+declare function $$render<T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition>(): {
+    props: GroupProps<T>;
+    exports: {};
+    bindings: "ref";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition> {
+    props(): ReturnType<typeof $$render<T>>['props'];
+    events(): ReturnType<typeof $$render<T>>['events'];
+    slots(): ReturnType<typeof $$render<T>>['slots'];
+    bindings(): "ref";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
+    } & ReturnType<__sveltets_Render<T>['exports']>;
+    <T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {}): ReturnType<__sveltets_Render<T>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const Group: $$IsomorphicComponent;
+type Group<T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition> = InstanceType<typeof Group<T>>;
+export default Group;

package/dist/components/Group/Group.shared.svelte.d.ts

@@ -0,0 +1,91 @@
+import type { Snippet } from 'svelte';
+import type { HTMLAttributes } from 'svelte/elements';
+import type { Transition, TransitionParams, Without } from '../../utils/types.js';
+import type { DataProp } from '../../utils/dataProp.js';
+import { type MotionProp } from '../../utils/motion.svelte.js';
+import { fade } from 'svelte/transition';
+import { cubicIn } from 'svelte/easing';
+import type { ChartState } from '../../states/chart.svelte.js';
+import type { GeoState } from '../../states/geo.svelte.js';
+export type GroupPropsWithoutHTML<In extends Transition = Transition> = {
+    /**
+     * Translate x position of the group.
+     * - `number`: pixel value (direct)
+     * - `string`: data property name, resolved via xScale
+     * - `function(d)`: accessor called per data item, result passed through xScale
+     */
+    x?: DataProp;
+    /** Initial translate x (pixel mode only). @default x */
+    initialX?: number;
+    /**
+     * Translate y position of the group.
+     * - `number`: pixel value (direct)
+     * - `string`: data property name, resolved via yScale
+     * - `function(d)`: accessor called per data item, result passed through yScale
+     */
+    y?: DataProp;
+    /** Initial translate y (pixel mode only). @default y */
+    initialY?: number;
+    /**
+     * Data array to iterate over in data mode.
+     * Falls back to chart context data when not provided.
+     */
+    data?: any[];
+    /**
+     * Key function for keyed {#each} rendering in data mode.
+     *
+     * @default (d, i) => i
+     */
+    key?: (d: any, index: number) => any;
+    /** Center within chart. @default false */
+    center?: boolean | 'x' | 'y';
+    /**
+     * Prevent `touchmove` default, which can interfere with `pointermove` when
+     * used with `Tooltip`, for example.
+     *
+     * @default false
+     */
+    preventTouchMove?: boolean;
+    /** The opacity of the element. (0 to 1) */
+    opacity?: number;
+    children?: Snippet;
+    /**
+     * A reference to the rendered DOM element, which could be
+     * either nothing, a `<g>` element (when using `<Svg>`), or a `<div>` element
+     * (when using `<Html>`).
+     *
+     * @bindable
+     */
+    ref?: Element;
+    motion?: MotionProp;
+    /** Transition function for entering elements @default fade if motion is tweened */
+    transitionIn?: In;
+    /** Parameters for the transitionIn function @default { easing: cubicIn } */
+    transitionInParams?: TransitionParams<In>;
+};
+export type GroupProps<In extends Transition = Transition> = GroupPropsWithoutHTML<In> & Without<HTMLAttributes<Element>, GroupPropsWithoutHTML<In>>;
+/**
+ * Reactive state shared by every per-layer Group variant.
+ */
+export declare class GroupState {
+    #private;
+    chartCtx: ChartState;
+    geo: GeoState;
+    dataMode: boolean;
+    resolvedItems: {
+        d: any;
+        key: any;
+        x: number;
+        y: number;
+    }[];
+    trueX: number;
+    trueY: number;
+    get motionX(): any;
+    get motionY(): any;
+    transform: string | undefined;
+    defaultTransitionIn: typeof fade | (() => {});
+    defaultTransitionInParams: {
+        easing: typeof cubicIn;
+    };
+    constructor(getProps: () => GroupProps);
+}

package/dist/components/Group/Group.shared.svelte.js

@@ -0,0 +1,112 @@
+import { untrack } from 'svelte';
+import { hasAnyDataProp, resolveDataProp, resolveGeoDataPair, } from '../../utils/dataProp.js';
+import { chartDataArray } from '../../utils/common.js';
+import { createMotion, createDataMotionMap, extractTweenConfig, } from '../../utils/motion.svelte.js';
+import { fade } from 'svelte/transition';
+import { cubicIn } from 'svelte/easing';
+import { getChartContext } from '../../contexts/chart.js';
+import { getGeoContext } from '../../contexts/geo.js';
+const defaultKey = (_, i) => i;
+/**
+ * Reactive state shared by every per-layer Group variant.
+ */
+export class GroupState {
+    #getProps = () => ({});
+    chartCtx = getChartContext();
+    geo = getGeoContext();
+    // Data mode detection
+    dataMode = $derived(hasAnyDataProp(this.#getProps().x, this.#getProps().y));
+    #resolvedData = $derived(this.dataMode ? (this.#getProps().data ?? chartDataArray(this.chartCtx.data)) : []);
+    resolvedItems = $derived.by(() => {
+        if (!this.dataMode)
+            return [];
+        const props = this.#getProps();
+        const keyFn = props.key ?? defaultKey;
+        return this.#resolvedData.map((d, i) => {
+            const key = keyFn(d, i);
+            const resolved = this.#resolveGroup(d);
+            const animated = this.#dataMotionMap?.get(key);
+            return {
+                d,
+                key,
+                x: animated?.x ?? resolved.x,
+                y: animated?.y ?? resolved.y,
+            };
+        });
+    });
+    #resolveGroup(d) {
+        const props = this.#getProps();
+        if (this.geo.projection) {
+            const [projX, projY] = resolveGeoDataPair(props.x, props.y, d, this.geo.projection);
+            return { x: projX, y: projY };
+        }
+        return {
+            x: resolveDataProp(props.x, d, this.chartCtx.xScale, 0),
+            y: resolveDataProp(props.y, d, this.chartCtx.yScale, 0),
+        };
+    }
+    // Pixel-mode position (with center support)
+    trueX = $derived.by(() => {
+        const props = this.#getProps();
+        if (typeof props.x === 'number')
+            return props.x;
+        if (props.x == null && (props.center === 'x' || props.center === true))
+            return this.chartCtx.width / 2;
+        return 0;
+    });
+    trueY = $derived.by(() => {
+        const props = this.#getProps();
+        if (typeof props.y === 'number')
+            return props.y;
+        if (props.y == null && (props.center === 'y' || props.center === true))
+            return this.chartCtx.height / 2;
+        return 0;
+    });
+    #dataMotionMap = null;
+    #motionX;
+    #motionY;
+    get motionX() {
+        return this.#motionX.current;
+    }
+    get motionY() {
+        return this.#motionY.current;
+    }
+    // Transform string for SVG/HTML pixel mode
+    transform = $derived.by(() => {
+        const props = this.#getProps();
+        if (props.center || props.x != null || props.y != null) {
+            return `translate(${this.motionX}px, ${this.motionY}px)`;
+        }
+        return undefined;
+    });
+    // Default transition (fade when motion is tweened)
+    defaultTransitionIn = $derived(extractTweenConfig(this.#getProps().motion)?.options ? fade : () => ({}));
+    defaultTransitionInParams = { easing: cubicIn };
+    constructor(getProps) {
+        this.#getProps = getProps;
+        const initial = getProps();
+        const initialX = initial.initialX ?? (typeof initial.x === 'number' ? initial.x : undefined);
+        const initialY = initial.initialY ?? (typeof initial.y === 'number' ? initial.y : undefined);
+        this.#motionX = createMotion(initialX, () => this.trueX, initial.motion);
+        this.#motionY = createMotion(initialY, () => this.trueY, initial.motion);
+        this.#dataMotionMap = createDataMotionMap(initial.motion);
+        if (this.#dataMotionMap) {
+            const motionMap = this.#dataMotionMap;
+            $effect(() => {
+                if (!this.dataMode)
+                    return;
+                const props = getProps();
+                const keyFn = props.key ?? defaultKey;
+                const activeKeys = new Set();
+                for (let i = 0; i < this.#resolvedData.length; i++) {
+                    const d = this.#resolvedData[i];
+                    const key = keyFn(d, i);
+                    activeKeys.add(key);
+                    const resolved = this.#resolveGroup(d);
+                    untrack(() => motionMap.update(key, resolved));
+                }
+                untrack(() => motionMap.cleanup(activeKeys));
+            });
+        }
+    }
+}

package/dist/components/Group/Group.svelte

@@ -0,0 +1,26 @@
+<script lang="ts" module>
+  export type {
+    GroupProps,
+    GroupPropsWithoutHTML,
+  } from './Group.shared.svelte.js';
+</script>
+
+<script lang="ts" generics="T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition">
+  import { getLayerContext } from '../../contexts/layer.js';
+  import GroupSvg from './Group.svg.svelte';
+  import GroupCanvas from './Group.canvas.svelte';
+  import GroupHtml from './Group.html.svelte';
+  import type { GroupProps } from './Group.shared.svelte.js';
+
+  const layerCtx = getLayerContext();
+
+  let { ref = $bindable(), ...rest }: GroupProps<T> = $props();
+</script>
+
+{#if layerCtx === 'svg'}
+  <GroupSvg bind:ref {...rest} />
+{:else if layerCtx === 'canvas'}
+  <GroupCanvas {...rest} />
+{:else if layerCtx === 'html'}
+  <GroupHtml bind:ref {...rest} />
+{/if}

package/dist/components/Group/Group.svelte.d.ts

@@ -0,0 +1,26 @@
+export type { GroupProps, GroupPropsWithoutHTML, } from './Group.shared.svelte.js';
+import type { GroupProps } from './Group.shared.svelte.js';
+declare function $$render<T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition>(): {
+    props: GroupProps<T>;
+    exports: {};
+    bindings: "ref";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition> {
+    props(): ReturnType<typeof $$render<T>>['props'];
+    events(): ReturnType<typeof $$render<T>>['events'];
+    slots(): ReturnType<typeof $$render<T>>['slots'];
+    bindings(): "ref";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
+    } & ReturnType<__sveltets_Render<T>['exports']>;
+    <T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {}): ReturnType<__sveltets_Render<T>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const Group: $$IsomorphicComponent;
+type Group<T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition> = InstanceType<typeof Group<T>>;
+export default Group;

package/dist/components/Group/Group.svelte.test.d.ts

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

package/dist/components/{Group.svelte.test.js → Group/Group.svelte.test.js}

@@ -1,7 +1,7 @@
 import { describe, expect, it } from 'vitest';
 import { render } from 'vitest-browser-svelte';
 import { page } from 'vitest/browser';
-import TestHarness, { componentTestId } from './tests/TestHarness.svelte';
+import TestHarness, { componentTestId } from '../tests/TestHarness.svelte';
 import Group from './Group.svelte';
 describe('Group', () => {
     describe('pixel mode', () => {

package/dist/components/Group/Group.svg.svelte

@@ -0,0 +1,93 @@
+<script lang="ts" module>
+  export type {
+    GroupProps,
+    GroupPropsWithoutHTML,
+  } from './Group.shared.svelte.js';
+</script>
+
+<script lang="ts" generics="T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition">
+  import type { TouchEventHandler } from 'svelte/elements';
+  import { GroupState, type GroupProps } from './Group.shared.svelte.js';
+
+  let {
+    preventTouchMove = false,
+    transitionIn: transitionInProp,
+    transitionInParams: transitionInParamsProp,
+    class: className,
+    children,
+    ref: refProp = $bindable(),
+    // Pull out props that collide with `<g>` SVG attribute names so the
+    // `{...rest}` spread doesn't mistakenly set `x="someAccessor"` etc.
+    x,
+    y,
+    initialX,
+    initialY,
+    data,
+    key,
+    center,
+    motion,
+    ...rest
+  }: GroupProps<T> = $props();
+
+  const c = new GroupState(
+    () =>
+      ({
+        preventTouchMove,
+        transitionIn: transitionInProp,
+        transitionInParams: transitionInParamsProp,
+        class: className,
+        children,
+        x,
+        y,
+        initialX,
+        initialY,
+        data,
+        key,
+        center,
+        motion,
+        ...rest,
+      }) as GroupProps
+  );
+
+  let ref = $state<Element>();
+
+  $effect.pre(() => {
+    refProp = ref;
+  });
+
+  const transitionIn = $derived(transitionInProp ?? c.defaultTransitionIn) as T;
+  const transitionInParams = $derived(transitionInParamsProp ?? c.defaultTransitionInParams);
+
+  const handleTouchMove: TouchEventHandler<Element> = (e) => {
+    if (preventTouchMove) {
+      e.preventDefault();
+    }
+    (rest as any).ontouchmove?.(e);
+  };
+</script>
+
+{#if c.dataMode}
+  {#each c.resolvedItems as item (item.key)}
+    <g
+      style:transform="translate({item.x}px, {item.y}px)"
+      class={['lc-group-g', className]}
+      opacity={rest.opacity}
+      {...rest}
+      ontouchmove={handleTouchMove}
+    >
+      {@render children?.()}
+    </g>
+  {/each}
+{:else}
+  <g
+    style:transform={c.transform}
+    class={['lc-group-g', className]}
+    in:transitionIn={transitionInParams}
+    opacity={rest.opacity}
+    {...rest}
+    ontouchmove={handleTouchMove}
+    bind:this={ref}
+  >
+    {@render children?.()}
+  </g>
+{/if}

package/dist/components/Group/Group.svg.svelte.d.ts

@@ -0,0 +1,26 @@
+export type { GroupProps, GroupPropsWithoutHTML, } from './Group.shared.svelte.js';
+import { type GroupProps } from './Group.shared.svelte.js';
+declare function $$render<T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition>(): {
+    props: GroupProps<T>;
+    exports: {};
+    bindings: "ref";
+    slots: {};
+    events: {};
+};
+declare class __sveltets_Render<T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition> {
+    props(): ReturnType<typeof $$render<T>>['props'];
+    events(): ReturnType<typeof $$render<T>>['events'];
+    slots(): ReturnType<typeof $$render<T>>['slots'];
+    bindings(): "ref";
+    exports(): {};
+}
+interface $$IsomorphicComponent {
+    new <T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition>(options: import('svelte').ComponentConstructorOptions<ReturnType<__sveltets_Render<T>['props']>>): import('svelte').SvelteComponent<ReturnType<__sveltets_Render<T>['props']>, ReturnType<__sveltets_Render<T>['events']>, ReturnType<__sveltets_Render<T>['slots']>> & {
+        $$bindings?: ReturnType<__sveltets_Render<T>['bindings']>;
+    } & ReturnType<__sveltets_Render<T>['exports']>;
+    <T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition>(internal: unknown, props: ReturnType<__sveltets_Render<T>['props']> & {}): ReturnType<__sveltets_Render<T>['exports']>;
+    z_$$bindings?: ReturnType<__sveltets_Render<any>['bindings']>;
+}
+declare const Group: $$IsomorphicComponent;
+type Group<T extends import('../../utils/types.js').Transition = import('../../utils/types.js').Transition> = InstanceType<typeof Group<T>>;
+export default Group;