Add missing FloatingArrowProps export. (#147)

Author: Hugos68

.changeset/silly-donkeys-suffer.md

@@ -0,0 +1,5 @@
+---
+"@skeletonlabs/floating-ui-svelte": patch
+---
+
+Add missing `FloatingArrowProps` export.

packages/floating-ui-svelte/package.json

@@ -33,6 +33,7 @@
 		"@testing-library/jest-dom": "^6.6.3",
 		"@testing-library/svelte": "^5.2.6",
 		"@testing-library/user-event": "^14.5.2",
+		"csstype": "^3.1.3",
 		"svelte": "^5.16.0",
 		"typescript": "^5.7.2",
 		"vite": "^6.0.6",

packages/floating-ui-svelte/src/components/floating-arrow.svelte

@@ -1,9 +1,61 @@
+<script lang="ts" module>
+import type { SVGAttributes } from "svelte/elements";
+import type { FloatingContext } from "../../src/index.js";
+
+export interface FloatingArrowProps extends SVGAttributes<SVGElement> {
+	/** The bound HTML element reference. */
+	ref: Element | null;
+	/** The floating context. */
+	context: FloatingContext;
+	/**
+	 * Width of the arrow.
+	 * @default 14
+	 */
+	width?: number;
+	/**
+	 * Height of the arrow.
+	 * @default 7
+	 */
+	height?: number;
+	/**
+	 * The corner radius (rounding) of the arrow tip.
+	 * @default 0 (sharp)
+	 */
+	tipRadius?: number;
+	/**
+	 * Forces a static offset over dynamic positioning under a certain condition.
+	 * @default undefined (use dynamic position)
+	 */
+	staticOffset?: string | number | null;
+	/**
+	 * Custom path string.
+	 * @default undefined (use dynamic path)
+	 */
+	d?: string;
+	/**
+	 * Stroke (border) color of the arrow.
+	 * @default "none"
+	 */
+	stroke?: string;
+	/**
+	 * Stroke (border) width of the arrow.
+	 * @default 0
+	 */
+	strokeWidth?: number;
+
+	// Styling ---
+	/** Set transform styles. */
+	transform?: string;
+	/** Set fill styles. */
+	fill?: string;
+}
+</script>
+
 <script lang="ts">
 import type { Alignment, Side } from "@floating-ui/dom";
 import { platform } from "@floating-ui/dom";
 import { useId } from "../hooks/use-id.js";
 import { styleObjectToString } from "../internal/style-object-to-string.js";
-import type { FloatingArrowProps } from "../internal/types.js";
 
 let {
 	ref = $bindable(null),

packages/floating-ui-svelte/src/index.ts

@@ -1,4 +1,5 @@
 export * from "@floating-ui/dom";
+export * from "./components/floating-arrow.svelte";
 export { default as FloatingArrow } from "./components/floating-arrow.svelte";
 export * from "./hooks/use-click.svelte.js";
 export * from "./hooks/use-dismiss.svelte.js";

packages/floating-ui-svelte/test/hooks/use-floating.svelte.ts

@@ -6,11 +6,8 @@ import {
 	offset,
 } from "@floating-ui/dom";
 import { describe, expect, expectTypeOf, it, vi } from "vitest";
-import {
-	type FloatingContext,
-	useFloating,
-} from "../../src/hooks/use-floating.svelte.js";
-import { useId } from "../../src/hooks/use-id.js";
+import { type FloatingContext, useFloating } from "../../src/index.js";
+import { useId } from "../../src/index.js";
 import { withRunes } from "../internal/with-runes.svelte.js";
 
 function createElements(): { reference: HTMLElement; floating: HTMLElement } {

packages/floating-ui-svelte/test/hooks/use-id.ts

@@ -1,5 +1,5 @@
 import { describe, expect, expectTypeOf, test } from "vitest";
-import { useId } from "../../src/hooks/use-id.js";
+import { useId } from "../../src/index.js";
 
 describe("useId", () => {
 	test("returns an id", () => {

packages/floating-ui-svelte/test/hooks/use-interactions.svelte.ts

@@ -1,8 +1,5 @@
 import { describe, expect, it, vi } from "vitest";
-import {
-	type ElementProps,
-	useInteractions,
-} from "../../src/hooks/use-interactions.svelte.js";
+import { type ElementProps, useInteractions } from "../../src/index.js";
 import { withRunes } from "../internal/with-runes.svelte";
 
 describe("useInteractions", () => {

packages/floating-ui-svelte/tsconfig.json

@@ -10,6 +10,8 @@
 		"sourceMap": true,
 		"strict": true,
 		"module": "NodeNext",
-		"moduleResolution": "NodeNext"
-	}
+		"moduleResolution": "NodeNext",
+		"types": ["svelte"]
+	},
+	"include": ["src", "test"]
 }

packages/floating-ui-svelte/vite.config.ts

@@ -8,8 +8,5 @@ export default defineConfig({
 		include: ["./test/{hooks, components}/*.ts"],
 		setupFiles: ["./test/internal/setup.ts"],
 		environment: "jsdom",
-		coverage: {
-			reporter: ["text"],
-		},
 	},
 });