@threlte/flex 2.0.0-next.10 → 2.0.0-next.11

package/dist/Box/Box.svelte.d.ts

@@ -1,21 +1,4 @@
-import { SvelteComponent, type Snippet } from 'svelte'
-import type { NodeProps } from '../lib/props'
-
-type BoxProps = NodeProps & {
-  order?: number | undefined
-  class?: string
-
-  children?: Snippet<
-    [
-      {
-        reflow: () => void
-        width: number
-        height: number
-      }
-    ]
-  >
-
-  onreflow?: (event: { width: number; height: number }) => void
-}
-
-export default class Box extends SvelteComponent<BoxProps> {}
+/// <reference types="svelte" />
+import type { BoxProps } from './types';
+declare const Box: import("svelte").Component<BoxProps, {}, "">;
+export default Box;

package/dist/Box/types.d.ts

@@ -0,0 +1,17 @@
+import { type Snippet } from 'svelte';
+import type { NodeProps } from '../lib/props';
+export type BoxProps = NodeProps & {
+    order?: number | undefined;
+    class?: string;
+    children?: Snippet<[
+        {
+            reflow: () => void;
+            width: number;
+            height: number;
+        }
+    ]>;
+    onreflow?: (event: {
+        width: number;
+        height: number;
+    }) => void;
+};

package/dist/Box/types.js

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

package/dist/Flex/Flex.svelte

@@ -1,6 +1,6 @@
 <script lang="ts">import { loadYoga } from 'yoga-layout/load';
 import InnerFlex from './InnerFlex.svelte';
-let { children: innerChildren, ...props } = $props();
+let { children: innerChildren, ref = $bindable(), ...props } = $props();
 let yoga = $state(undefined);
 const initialize = async () => {
     yoga = await loadYoga();
@@ -11,6 +11,7 @@ initialize();
 {#if yoga}
   <InnerFlex
     {yoga}
+    bind:ref
     {...props}
   >
     {#snippet children({ reflow, width, height })}

package/dist/Flex/Flex.svelte.d.ts

@@ -1,7 +1,4 @@
-import { SvelteComponent } from 'svelte'
-import type { ComponentProps } from 'svelte'
-import type InnerFlex from './InnerFlex.svelte'
-
-type FlexProps = Omit<ComponentProps<InnerFlex>, 'yoga'>
-
-export default class Flex extends SvelteComponent<FlexProps> {}
+/// <reference types="svelte" />
+import type { FlexProps } from './types';
+declare const Flex: import("svelte").Component<FlexProps, {}, "ref">;
+export default Flex;

package/dist/Flex/InnerFlex.svelte.d.ts

@@ -1,32 +1,4 @@
-import type { Stage } from '@threlte/core'
-import { SvelteComponent, type Snippet } from 'svelte'
-import type { Direction, Yoga } from 'yoga-layout'
-import type { ClassParser, FlexPlane, NodeProps } from '../lib/props'
-import type { Group } from 'three'
-
-type InnerFlexProps = NodeProps & {
-  yoga: Yoga
-  width?: number
-  height?: number
-  plane?: FlexPlane
-  direction?: keyof typeof Direction
-  scaleFactor?: number
-  class?: string
-  classParser?: ClassParser
-  reflowStage?: Stage
-  ref?: Group
-
-  children?: Snippet<
-    [
-      {
-        reflow: () => void
-        width: number
-        height: number
-      }
-    ]
-  >
-
-  onreflow?: (event: { width: number; height: number }) => void
-}
-
-export default class InnerFlex extends SvelteComponent<InnerFlexProps> {}
+/// <reference types="svelte" />
+import type { InnerFlexProps } from './types';
+declare const InnerFlex: import("svelte").Component<InnerFlexProps, {}, "ref">;
+export default InnerFlex;

package/dist/Flex/context.d.ts

@@ -1,7 +1,8 @@
 import type { CurrentWritable } from '@threlte/core';
 import { type Emitter } from 'mitt';
 import type { Group } from 'three';
-import type { Node, Yoga } from 'yoga-layout';
+import type { Node } from 'yoga-layout';
+import type Yoga from 'yoga-layout';
 import type { Axis, ClassParser, NodeProps } from '../lib/props';
 type FlexContextEvents = {
     'reflow:before': void;
@@ -13,7 +14,7 @@ type FlexContextNode = {
     props: NodeProps;
 };
 export type FlexContextData = {
-    yoga: Yoga;
+    yoga: typeof Yoga;
     nodes: Map<Node, FlexContextNode>;
     addNode: (node: Node, group: Group, props: NodeProps) => void;
     updateNodeProps: (node: Node, props: NodeProps, force?: boolean) => void;

package/dist/Flex/types.d.ts

@@ -0,0 +1,30 @@
+import type { Stage } from '@threlte/core';
+import type { Snippet } from 'svelte';
+import type { Group } from 'three';
+import type Yoga from 'yoga-layout';
+import type { Direction } from 'yoga-layout';
+import type { ClassParser, FlexPlane, NodeProps } from '../lib/props';
+export type InnerFlexProps = NodeProps & {
+    yoga: typeof Yoga;
+    width?: number;
+    height?: number;
+    plane?: FlexPlane;
+    direction?: keyof typeof Direction;
+    scaleFactor?: number;
+    class?: string;
+    classParser?: ClassParser;
+    reflowStage?: Stage;
+    ref?: Group;
+    children?: Snippet<[
+        {
+            reflow: () => void;
+            width: number;
+            height: number;
+        }
+    ]>;
+    onreflow?: (event: {
+        width: number;
+        height: number;
+    }) => void;
+};
+export type FlexProps = Omit<InnerFlexProps, 'yoga'>;

package/dist/Flex/types.js

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

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@threlte/flex",
-  "version": "2.0.0-next.10",
+  "version": "2.0.0-next.11",
   "author": "Grischa Erbe <hello@legrisch.com> (https://legrisch.com)",
   "license": "MIT",
   "description": "Components to easily use the flexbox spec with Threlte",
@@ -30,7 +30,7 @@
     "typescript": "^5.4.5",
     "vite": "^5.2.8",
     "@threlte/core": "8.0.0-next.23",
-    "@threlte/extras": "9.0.0-next.32"
+    "@threlte/extras": "9.0.0-next.33"
   },
   "dependencies": {
     "mitt": "^3.0.1",