fix: props not being passed to Bits Dialog (#42)

Author: huntabyte

.changeset/mean-cherries-dance.md

@@ -0,0 +1,5 @@
+---
+"vaul-svelte": patch
+---
+
+fix: forward `$$restProps` to Bits UI dialog

.eslintrc.cjs

@@ -5,19 +5,19 @@ module.exports = {
 		"eslint:recommended",
 		"plugin:@typescript-eslint/recommended",
 		"plugin:svelte/recommended",
-		"prettier"
+		"prettier",
 	],
 	parser: "@typescript-eslint/parser",
 	plugins: ["@typescript-eslint"],
 	parserOptions: {
 		sourceType: "module",
 		ecmaVersion: "latest",
-		extraFileExtensions: [".svelte"]
+		extraFileExtensions: [".svelte"],
 	},
 	env: {
 		browser: true,
 		es2024: true,
-		node: true
+		node: true,
 	},
 	globals: { $$Generic: "readable", NodeJS: true },
 	rules: {
@@ -26,8 +26,8 @@ module.exports = {
 			"warn",
 			{
 				argsIgnorePattern: "^_",
-				varsIgnorePattern: "^_"
-			}
+				varsIgnorePattern: "^_",
+			},
 		],
 		"svelte/no-target-blank": "off",
 		"svelte/no-immutable-reactive-statements": "error",
@@ -39,24 +39,24 @@ module.exports = {
 		"svelte/no-at-html-tags": "off",
 		"svelte/no-unused-svelte-ignore": "off",
 		"svelte/require-stores-init": "off",
-		"svelte/css-unused-selector": "off"
+		"svelte/css-unused-selector": "off",
 	},
 	overrides: [
 		{
 			files: ["*.svelte"],
 			parser: "svelte-eslint-parser",
 			parserOptions: {
-				parser: "@typescript-eslint/parser"
+				parser: "@typescript-eslint/parser",
 			},
 			rules: {
 				"@typescript-eslint/no-unused-vars": [
 					"warn",
 					{
 						argsIgnorePattern: "^_",
-						varsIgnorePattern: "^(\\$\\$(Props|Events|Slots|Generic)|_*)$"
-					}
-				]
-			}
+						varsIgnorePattern: "^(\\$\\$(Props|Events|Slots|Generic)|_*)$",
+					},
+				],
+			},
 		},
 		{
 			files: ["*.ts"],
@@ -67,11 +67,11 @@ module.exports = {
 					{
 						extendDefaults: true,
 						types: {
-							"{}": false
-						}
-					}
-				]
-			}
-		}
-	]
+							"{}": false,
+						},
+					},
+				],
+			},
+		},
+	],
 };

.prettierrc

@@ -1,7 +1,7 @@
 {
 	"useTabs": true,
 	"singleQuote": false,
-	"trailingComma": "none",
+	"trailingComma": "es5",
 	"printWidth": 100,
 	"plugins": ["prettier-plugin-svelte", "prettier-plugin-tailwindcss"],
 	"overrides": [

playwright.config.ts

@@ -3,10 +3,10 @@ import type { PlaywrightTestConfig } from "@playwright/test";
 const config: PlaywrightTestConfig = {
 	webServer: {
 		command: "npm run build && npm run preview",
-		port: 4173
+		port: 4173,
 	},
 	testDir: "tests",
-	testMatch: /(.+\.)?(test|spec)\.[jt]s/
+	testMatch: /(.+\.)?(test|spec)\.[jt]s/,
 };
 
 export default config;

postcss.config.cjs

@@ -6,8 +6,8 @@ const config = {
 		//Some plugins, like tailwindcss/nesting, need to run before Tailwind,
 		tailwindcss(),
 		//But others, like autoprefixer, need to run after,
-		autoprefixer
-	]
+		autoprefixer,
+	],
 };
 
 module.exports = config;

src/config/site.ts

@@ -5,9 +5,9 @@ export const siteConfig = {
 	ogImage: "https://www.vaul-svelte.com/og.jpg",
 	links: {
 		twitter: "https://twitter.com/huntabyte",
-		github: "https://github.com/huntabyte/vaul-svelte"
+		github: "https://github.com/huntabyte/vaul-svelte",
 	},
-	keywords: `Svelte,SvelteKit,Svelte Components,Headless Svelte Components,Headless UI Svelte,Drawer for Svelte,SvelteKit Drawer,Svelte Drawer,Vaul Svelte`
+	keywords: `Svelte,SvelteKit,Svelte Components,Headless Svelte Components,Headless UI Svelte,Drawer for Svelte,SvelteKit Drawer,Svelte Drawer,Vaul Svelte`,
 };
 
 export type SiteConfig = typeof siteConfig;

src/lib/internal/constants.ts

@@ -1,6 +1,6 @@
 export const TRANSITIONS = {
 	DURATION: 0.5,
-	EASE: [0.32, 0.72, 0, 1]
+	EASE: [0.32, 0.72, 0, 1],
 };
 
 export const VELOCITY_THRESHOLD = 0.4;

src/lib/internal/escape-keydown.ts

@@ -26,7 +26,7 @@ const documentEscapeKeyStore = readable<KeyboardEvent | undefined>(
 
 		// Adds a keydown event listener to the document, calling the keydown function when triggered.
 		const unsubscribe = addEventListener(document, "keydown", keydown, {
-			passive: false
+			passive: false,
 		});
 
 		// Returns a function to unsubscribe from the event listener and stop tracking keydown events.

src/lib/internal/helpers/is.ts

@@ -10,7 +10,7 @@ const nonTextInputTypes = new Set([
 	"image",
 	"button",
 	"submit",
-	"reset"
+	"reset",
 ]);
 
 export const isBrowser = typeof document !== "undefined";

src/lib/internal/helpers/options.ts

@@ -5,7 +5,7 @@ type Options = Record<string, Writable<unknown>>;
 export function getOptionUpdater(options: Options) {
 	return function <
 		K extends keyof typeof options,
-		V extends StoresValues<(typeof options)[keyof typeof options]>
+		V extends StoresValues<(typeof options)[keyof typeof options]>,
 	>(key: K, value: V | undefined) {
 		if (value === undefined) return;
 		const store = options[key];