bits-ui 2.3.1 → 2.4.0

package/dist/bits/calendar/components/calendar.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import { watch } from "runed";
 	import { box, mergeProps } from "svelte-toolbelt";
 	import { type DateValue } from "@internationalized/date";
 	import { useCalendarRoot } from "../calendar.svelte.js";
@@ -6,7 +7,7 @@
 	import { useId } from "../../../internal/use-id.js";
 	import { noop } from "../../../internal/noop.js";
 	import { getDefaultDate } from "../../../internal/date-time/utils.js";
-	import { watch } from "runed";
+	import { resolveLocaleProp } from "../../utilities/config/prop-resolvers.js";
 
 	let {
 		child,
@@ -24,7 +25,7 @@
 		isDateUnavailable = () => false,
 		fixedWeeks = false,
 		numberOfMonths = 1,
-		locale = "en",
+		locale,
 		calendarLabel = "Event",
 		disabled = false,
 		readonly = false,
@@ -84,7 +85,7 @@
 		isDateUnavailable: box.with(() => isDateUnavailable),
 		fixedWeeks: box.with(() => fixedWeeks),
 		numberOfMonths: box.with(() => numberOfMonths),
-		locale: box.with(() => locale),
+		locale: resolveLocaleProp(() => locale),
 		calendarLabel: box.with(() => calendarLabel),
 		readonly: box.with(() => readonly),
 		disabled: box.with(() => disabled),

package/dist/bits/date-field/components/date-field.svelte

@@ -1,18 +1,19 @@
 <script lang="ts">
+	import { watch } from "runed";
 	import { box } from "svelte-toolbelt";
 	import type { DateValue } from "@internationalized/date";
 	import { useDateFieldRoot } from "../date-field.svelte.js";
 	import type { DateFieldRootProps } from "../types.js";
 	import { noop } from "../../../internal/noop.js";
 	import { getDefaultDate } from "../../../internal/date-time/utils.js";
-	import { watch } from "runed";
+	import { resolveLocaleProp } from "../../utilities/config/prop-resolvers.js";
 
 	let {
 		disabled = false,
 		granularity,
 		hideTimeZone = false,
 		hourCycle,
-		locale = "en",
+		locale,
 		maxValue,
 		minValue,
 		onPlaceholderChange = noop,
@@ -73,7 +74,7 @@
 		granularity: box.with(() => granularity),
 		hideTimeZone: box.with(() => hideTimeZone),
 		hourCycle: box.with(() => hourCycle),
-		locale: box.with(() => locale),
+		locale: resolveLocaleProp(() => locale),
 		maxValue: box.with(() => maxValue),
 		minValue: box.with(() => minValue),
 		validate: box.with(() => validate),

package/dist/bits/date-picker/components/date-picker.svelte

@@ -1,5 +1,6 @@
 <script lang="ts">
 	// Date Picker composes the DateField, Popover, and Calendar components
+	import { watch } from "runed";
 	import { box } from "svelte-toolbelt";
 	import type { DateValue } from "@internationalized/date";
 	import { useDatePickerRoot } from "../date-picker.svelte.js";
@@ -9,7 +10,7 @@
 	import { useDateFieldRoot } from "../../date-field/date-field.svelte.js";
 	import { FloatingLayer } from "../../utilities/floating-layer/index.js";
 	import { getDefaultDate } from "../../../internal/date-time/utils.js";
-	import { watch } from "runed";
+	import { resolveLocaleProp } from "../../utilities/config/prop-resolvers.js";
 
 	let {
 		open = $bindable(false),
@@ -28,7 +29,7 @@
 		granularity,
 		readonlySegments = [],
 		hourCycle,
-		locale = "en",
+		locale,
 		hideTimeZone = false,
 		required = false,
 		calendarLabel = "Event",
@@ -107,7 +108,7 @@
 		granularity: box.with(() => granularity),
 		readonlySegments: box.with(() => readonlySegments),
 		hourCycle: box.with(() => hourCycle),
-		locale: box.with(() => locale),
+		locale: resolveLocaleProp(() => locale),
 		hideTimeZone: box.with(() => hideTimeZone),
 		required: box.with(() => required),
 		calendarLabel: box.with(() => calendarLabel),

package/dist/bits/date-range-field/components/date-range-field.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import { watch } from "runed";
 	import { box, mergeProps } from "svelte-toolbelt";
 	import type { DateValue } from "@internationalized/date";
 	import { useDateRangeFieldRoot } from "../date-range-field.svelte.js";
@@ -7,7 +8,7 @@
 	import { noop } from "../../../internal/noop.js";
 	import type { DateRange } from "../../../shared/index.js";
 	import { getDefaultDate } from "../../../internal/date-time/utils.js";
-	import { watch } from "runed";
+	import { resolveLocaleProp } from "../../utilities/config/prop-resolvers.js";
 
 	const uid = $props.id();
 
@@ -23,7 +24,7 @@
 		required = false,
 		hourCycle,
 		granularity,
-		locale = "en-US",
+		locale,
 		hideTimeZone = false,
 		validate = noop,
 		onInvalid = noop,
@@ -89,7 +90,7 @@
 		required: box.with(() => required),
 		hourCycle: box.with(() => hourCycle),
 		granularity: box.with(() => granularity),
-		locale: box.with(() => locale),
+		locale: resolveLocaleProp(() => locale),
 		hideTimeZone: box.with(() => hideTimeZone),
 		validate: box.with(() => validate),
 		maxValue: box.with(() => maxValue),

package/dist/bits/date-range-picker/components/date-range-picker.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import { watch } from "runed";
 	import { box, mergeProps } from "svelte-toolbelt";
 	import type { DateValue } from "@internationalized/date";
 	import { useDateRangePickerRoot } from "../date-range-picker.svelte.js";
@@ -10,7 +11,7 @@
 	import { useId } from "../../../internal/use-id.js";
 	import type { DateRange } from "../../../shared/index.js";
 	import { getDefaultDate } from "../../../internal/date-time/utils.js";
-	import { watch } from "runed";
+	import { resolveLocaleProp } from "../../utilities/config/prop-resolvers.js";
 
 	let {
 		open = $bindable(false),
@@ -30,7 +31,7 @@
 		granularity,
 		readonlySegments = [],
 		hourCycle,
-		locale = "en",
+		locale,
 		hideTimeZone = false,
 		required = false,
 		calendarLabel = "Event",
@@ -136,7 +137,7 @@
 		granularity: box.with(() => granularity),
 		readonlySegments: box.with(() => readonlySegments),
 		hourCycle: box.with(() => hourCycle),
-		locale: box.with(() => locale),
+		locale: resolveLocaleProp(() => locale),
 		hideTimeZone: box.with(() => hideTimeZone),
 		required: box.with(() => required),
 		calendarLabel: box.with(() => calendarLabel),

package/dist/bits/index.d.ts

@@ -2,6 +2,7 @@ export { Accordion } from "./accordion/index.js";
 export { AlertDialog } from "./alert-dialog/index.js";
 export { AspectRatio } from "./aspect-ratio/index.js";
 export { Avatar } from "./avatar/index.js";
+export { BitsConfig, getBitsConfig } from "./utilities/config/index.js";
 export { Button } from "./button/index.js";
 export { Calendar } from "./calendar/index.js";
 export { Checkbox } from "./checkbox/index.js";

package/dist/bits/index.js

@@ -2,6 +2,7 @@ export { Accordion } from "./accordion/index.js";
 export { AlertDialog } from "./alert-dialog/index.js";
 export { AspectRatio } from "./aspect-ratio/index.js";
 export { Avatar } from "./avatar/index.js";
+export { BitsConfig, getBitsConfig } from "./utilities/config/index.js";
 export { Button } from "./button/index.js";
 export { Calendar } from "./calendar/index.js";
 export { Checkbox } from "./checkbox/index.js";

package/dist/bits/range-calendar/components/range-calendar.svelte

@@ -1,4 +1,5 @@
 <script lang="ts">
+	import { watch } from "runed";
 	import { box, mergeProps } from "svelte-toolbelt";
 	import { type DateValue } from "@internationalized/date";
 	import type { RangeCalendarRootProps } from "../types.js";
@@ -6,7 +7,7 @@
 	import { noop } from "../../../internal/noop.js";
 	import { createId } from "../../../internal/create-id.js";
 	import { getDefaultDate } from "../../../internal/date-time/utils.js";
-	import { watch } from "runed";
+	import { resolveLocaleProp } from "../../utilities/config/prop-resolvers.js";
 
 	const uid = $props.id();
 
@@ -26,7 +27,7 @@
 		isDateUnavailable = () => false,
 		fixedWeeks = false,
 		numberOfMonths = 1,
-		locale = "en",
+		locale,
 		calendarLabel = "Event",
 		disabled = false,
 		readonly = false,
@@ -107,7 +108,7 @@
 		weekStartsOn: box.with(() => weekStartsOn),
 		weekdayFormat: box.with(() => weekdayFormat),
 		numberOfMonths: box.with(() => numberOfMonths),
-		locale: box.with(() => locale),
+		locale: resolveLocaleProp(() => locale),
 		calendarLabel: box.with(() => calendarLabel),
 		fixedWeeks: box.with(() => fixedWeeks),
 		disableDaysOutsideMonth: box.with(() => disableDaysOutsideMonth),

package/dist/bits/select/select.svelte.js

@@ -442,7 +442,7 @@ class SelectTriggerState {
                     return;
                 this.root.opts.value.current = matchedItem.value;
             },
-            enabled: !this.root.isMulti && this.root.dataTypeaheadEnabled,
+            enabled: () => !this.root.isMulti && this.root.dataTypeaheadEnabled,
             candidateValues: () => (this.root.isMulti ? [] : this.root.candidateLabels),
             getWindow: () => this.root.domContext.getWindow(),
         });

package/dist/bits/time-field/components/time-field.svelte

@@ -5,19 +5,20 @@
 </script>
 
 <script lang="ts" generics="T extends TimeValue = Time">
+	import { watch } from "runed";
 	import { box } from "svelte-toolbelt";
 	import { useTimeFieldRoot } from "../time-field.svelte.js";
 	import type { TimeFieldRootProps } from "../types.js";
 	import { noop } from "../../../internal/noop.js";
 	import { getDefaultTime } from "../../../internal/date-time/utils.js";
-	import { watch } from "runed";
+	import { resolveLocaleProp } from "../../utilities/config/prop-resolvers.js";
 
 	let {
 		disabled = false,
 		granularity,
 		hideTimeZone = false,
 		hourCycle,
-		locale = "en",
+		locale,
 		maxValue,
 		minValue,
 		onPlaceholderChange = noop,
@@ -78,7 +79,7 @@
 		granularity: box.with(() => granularity),
 		hideTimeZone: box.with(() => hideTimeZone),
 		hourCycle: box.with(() => hourCycle),
-		locale: box.with(() => locale),
+		locale: resolveLocaleProp(() => locale),
 		maxValue: box.with(() => maxValue),
 		minValue: box.with(() => minValue),
 		validate: box.with(() => validate),

package/dist/bits/time-range-field/components/time-range-field.svelte

@@ -6,13 +6,14 @@
 </script>
 
 <script lang="ts" generics="T extends TimeValue = Time">
+	import { watch } from "runed";
 	import { box, mergeProps } from "svelte-toolbelt";
 	import { useTimeRangeFieldRoot } from "../time-range-field.svelte.js";
 	import type { TimeRangeFieldRootProps } from "../types.js";
 	import { createId } from "../../../internal/create-id.js";
 	import { noop } from "../../../internal/noop.js";
 	import { getDefaultTime } from "../../../internal/date-time/utils.js";
-	import { watch } from "runed";
+	import { resolveLocaleProp } from "../../utilities/config/prop-resolvers.js";
 
 	const uid = $props.id();
 
@@ -28,7 +29,7 @@
 		required = false,
 		hourCycle,
 		granularity,
-		locale = "en-US",
+		locale,
 		hideTimeZone = false,
 		validate = noop,
 		onInvalid = noop,
@@ -94,7 +95,7 @@
 		required: box.with(() => required),
 		hourCycle: box.with(() => hourCycle),
 		granularity: box.with(() => granularity),
-		locale: box.with(() => locale),
+		locale: resolveLocaleProp(() => locale),
 		hideTimeZone: box.with(() => hideTimeZone),
 		validate: box.with(() => validate),
 		maxValue: box.with(() => maxValue),

package/dist/bits/utilities/config/bits-config.d.ts

@@ -0,0 +1,44 @@
+import { Context } from "runed";
+import type { ReadableBoxedValues } from "../../../internal/box.svelte.js";
+import type { BitsConfigPropsWithoutChildren } from "./types.js";
+type BitsConfigStateProps = ReadableBoxedValues<BitsConfigPropsWithoutChildren>;
+export declare const BitsConfigContext: Context<BitsConfigState>;
+/**
+ * Gets the current Bits UI configuration state from the context.
+ *
+ * Returns a default configuration (where all values are `undefined`) if no configuration is found.
+ */
+export declare function getBitsConfig(): Required<ReadableBoxedValues<BitsConfigPropsWithoutChildren>>;
+/**
+ * Creates and sets a new Bits UI configuration state that inherits from parent configs.
+ *
+ * @param opts - Configuration options for this level
+ * @returns The configuration state instance
+ *
+ * @example
+ * ```typescript
+ * // In a component that wants to set a default portal target
+ * const config = useBitsConfig({ defaultPortalTo: box("#some-element") });
+ *
+ * // Child components will inherit this config and can override specific values
+ * const childConfig = useBitsConfig({ someOtherProp: box("value") });
+ * // childConfig still has defaultPortalTo="#some-element" from parent
+ * ```
+ */
+export declare function useBitsConfig(opts: BitsConfigStateProps): BitsConfigState;
+/**
+ * Configuration state that inherits from parent configurations.
+ *
+ * @example
+ * Config resolution:
+ * ```
+ * Level 1: { defaultPortalTo: "#some-element", theme: "dark" }
+ * Level 2: { spacing: "large" } // inherits defaultPortalTo="#some-element", theme="dark"
+ * Level 3: { theme: "light" }   // inherits defaultPortalTo="#some-element", spacing="large", overrides theme="light"
+ * ```
+ */
+export declare class BitsConfigState {
+    readonly opts: Required<BitsConfigStateProps>;
+    constructor(parent: BitsConfigState | null, opts: BitsConfigStateProps);
+}
+export {};

package/dist/bits/utilities/config/bits-config.js

@@ -0,0 +1,92 @@
+import { Context } from "runed";
+import { box } from "svelte-toolbelt";
+export const BitsConfigContext = new Context("BitsConfig");
+/**
+ * Gets the current Bits UI configuration state from the context.
+ *
+ * Returns a default configuration (where all values are `undefined`) if no configuration is found.
+ */
+export function getBitsConfig() {
+    const fallback = new BitsConfigState(null, {});
+    return BitsConfigContext.getOr(fallback).opts;
+}
+/**
+ * Creates and sets a new Bits UI configuration state that inherits from parent configs.
+ *
+ * @param opts - Configuration options for this level
+ * @returns The configuration state instance
+ *
+ * @example
+ * ```typescript
+ * // In a component that wants to set a default portal target
+ * const config = useBitsConfig({ defaultPortalTo: box("#some-element") });
+ *
+ * // Child components will inherit this config and can override specific values
+ * const childConfig = useBitsConfig({ someOtherProp: box("value") });
+ * // childConfig still has defaultPortalTo="#some-element" from parent
+ * ```
+ */
+export function useBitsConfig(opts) {
+    return BitsConfigContext.set(new BitsConfigState(BitsConfigContext.getOr(null), opts));
+}
+/**
+ * Configuration state that inherits from parent configurations.
+ *
+ * @example
+ * Config resolution:
+ * ```
+ * Level 1: { defaultPortalTo: "#some-element", theme: "dark" }
+ * Level 2: { spacing: "large" } // inherits defaultPortalTo="#some-element", theme="dark"
+ * Level 3: { theme: "light" }   // inherits defaultPortalTo="#some-element", spacing="large", overrides theme="light"
+ * ```
+ */
+export class BitsConfigState {
+    opts;
+    constructor(parent, opts) {
+        const resolveConfigOption = createConfigResolver(parent, opts);
+        this.opts = {
+            defaultPortalTo: resolveConfigOption((config) => config.defaultPortalTo),
+            defaultLocale: resolveConfigOption((config) => config.defaultLocale),
+        };
+    }
+}
+/**
+ * Returns a config resolver that resolves a given config option's value.
+ *
+ * The resolver creates reactive boxes that resolve config option values using this priority:
+ * 1. Current level's value (if defined)
+ * 2. Parent level's value (if defined and current is undefined)
+ * 3. `undefined` (if no value is found in either parent or child)
+ *
+ * @param parent - Parent configuration state (null if this is root level)
+ * @param currentOpts - Current level's configuration options
+ *
+ * @example
+ * ```typescript
+ * // Given this hierarchy:
+ * // Root: { defaultPortalTo: "#some-element" }
+ * // Child: { someOtherProp: "value" } // no defaultPortalTo specified
+ *
+ * const resolveConfigOption = createConfigResolver(parent, opts);
+ * const portalTo = resolveConfigOption(config => config.defaultPortalTo);
+ *
+ * // portalTo.current === "#some-element" (inherited from parent)
+ * // even when child didn't specify `defaultPortalTo`
+ * ```
+ */
+function createConfigResolver(parent, currentOpts) {
+    return (getter) => {
+        const configOption = box.with(() => {
+            // try current opts first
+            const value = getter(currentOpts)?.current;
+            if (value !== undefined)
+                return value;
+            // if no parent, return undefined
+            if (parent === null)
+                return undefined;
+            // get value from parent (which already has its own chain resolved)
+            return getter(parent.opts)?.current;
+        });
+        return configOption;
+    };
+}

package/dist/bits/utilities/config/components/bits-config.svelte

@@ -0,0 +1,14 @@
+<script lang="ts">
+	import type { BitsConfigProps } from "../types.js";
+	import { useBitsConfig } from "../bits-config.js";
+	import { box } from "svelte-toolbelt";
+
+	let { children, defaultPortalTo, defaultLocale }: BitsConfigProps = $props();
+
+	useBitsConfig({
+		defaultPortalTo: box.with(() => defaultPortalTo),
+		defaultLocale: box.with(() => defaultLocale),
+	});
+</script>
+
+{@render children?.()}

package/dist/bits/utilities/config/components/bits-config.svelte.d.ts

@@ -0,0 +1,4 @@
+import type { BitsConfigProps } from "../types.js";
+declare const BitsConfig: import("svelte").Component<BitsConfigProps, {}, "">;
+type BitsConfig = ReturnType<typeof BitsConfig>;
+export default BitsConfig;

package/dist/bits/utilities/config/exports.d.ts

@@ -0,0 +1,2 @@
+export { default as BitsConfig } from "./components/bits-config.svelte";
+export { getBitsConfig, BitsConfigState } from "./bits-config.js";

package/dist/bits/utilities/config/exports.js

@@ -0,0 +1,2 @@
+export { default as BitsConfig } from "./components/bits-config.svelte";
+export { getBitsConfig, BitsConfigState } from "./bits-config.js";

package/dist/bits/utilities/config/index.d.ts

@@ -0,0 +1 @@
+export * from "./exports.js";

package/dist/bits/utilities/config/index.js

@@ -0,0 +1 @@
+export * from "./exports.js";

package/dist/bits/utilities/config/prop-resolvers.d.ts

@@ -0,0 +1,13 @@
+import { type Getter, type ReadableBox } from "svelte-toolbelt";
+/**
+ * Resolves a locale value using the prop, the config default, or a fallback.
+ *
+ * Default value: `"en"`
+ */
+export declare const resolveLocaleProp: (getProp: Getter<string | undefined>) => ReadableBox<string>;
+/**
+ * Resolves a portal's `to` value using the prop, the config default, or a fallback.
+ *
+ * Default value: `"body"`
+ */
+export declare const resolvePortalToProp: (getProp: Getter<string | Element | undefined>) => ReadableBox<string | Element>;

package/dist/bits/utilities/config/prop-resolvers.js

@@ -0,0 +1,37 @@
+import { box } from "svelte-toolbelt";
+import { getBitsConfig } from "./bits-config.js";
+/**
+ * Creates a generic prop resolver that follows a standard priority chain:
+ * 1. The getter's prop value (if defined)
+ * 2. The config default value (if no getter prop value is defined)
+ * 3. The fallback value (if no config value found)
+ */
+function createPropResolver(configOption, fallback) {
+    return (getProp) => {
+        const config = getBitsConfig();
+        return box.with(() => {
+            // 1. return the prop's value, if provided
+            const propValue = getProp();
+            if (propValue !== undefined)
+                return propValue;
+            // 2. return the resolved config option value, if available
+            const option = configOption(config).current;
+            if (option !== undefined)
+                return option;
+            // 3. return the fallback if no other value is found
+            return fallback;
+        });
+    };
+}
+/**
+ * Resolves a locale value using the prop, the config default, or a fallback.
+ *
+ * Default value: `"en"`
+ */
+export const resolveLocaleProp = createPropResolver((config) => config.defaultLocale, "en");
+/**
+ * Resolves a portal's `to` value using the prop, the config default, or a fallback.
+ *
+ * Default value: `"body"`
+ */
+export const resolvePortalToProp = createPropResolver((config) => config.defaultPortalTo, "body");

package/dist/bits/utilities/config/types.d.ts

@@ -0,0 +1,13 @@
+import type { WithChildren } from "../../../internal/types.js";
+import type { PortalTarget } from "../portal/types.js";
+export type BitsConfigPropsWithoutChildren = {
+    /**
+     * The default portal `to`/target to use for the `Portal` components throughout the app.
+     */
+    defaultPortalTo?: PortalTarget;
+    /**
+     * The default locale to use for the components that support localization.
+     */
+    defaultLocale?: string;
+};
+export type BitsConfigProps = WithChildren<BitsConfigPropsWithoutChildren>;

package/dist/bits/utilities/config/types.js

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

package/dist/bits/utilities/portal/portal.svelte

@@ -5,40 +5,41 @@
 	import PortalConsumer from "./portal-consumer.svelte";
 	import type { PortalProps } from "./types.js";
 	import { isBrowser } from "../../../internal/is.js";
+	import { resolvePortalToProp } from "../config/prop-resolvers.js";
 
-	let { to = "body", children, disabled }: PortalProps = $props();
+	let { to: toProp, children, disabled }: PortalProps = $props();
 
+	const to = resolvePortalToProp(() => toProp);
 	const context = getAllContexts();
 
 	let target = $derived(getTarget());
 
 	function getTarget() {
 		if (!isBrowser || disabled) return null;
-		let localTarget: HTMLElement | null | DocumentFragment | Element = null;
-		if (typeof to === "string") {
-			localTarget = document.querySelector(to);
-			if (localTarget === null) {
-				if (DEV) {
-					throw new Error(`Target element "${to}" not found.`);
-				}
+
+		let localTarget: Element | null = null;
+
+		if (typeof to.current === "string") {
+			const target = document.querySelector(to.current);
+			if (DEV && target === null) {
+				throw new Error(`Target element "${to.current}" not found.`);
 			}
-		} else if (to instanceof HTMLElement || to instanceof DocumentFragment) {
-			localTarget = to;
+			localTarget = target;
 		} else {
-			if (DEV) {
-				throw new TypeError(
-					`Unknown portal target type: ${
-						to === null ? "null" : typeof to
-					}. Allowed types: string (query selector), HTMLElement, or DocumentFragment.`
-				);
-			}
+			localTarget = to.current;
+		}
+
+		if (DEV && !(localTarget instanceof Element)) {
+			const type = localTarget === null ? "null" : typeof localTarget;
+			throw new TypeError(
+				`Unknown portal target type: ${type}. Allowed types: string (query selector) or Element.`
+			);
 		}
 
 		return localTarget;
 	}
 
-	// eslint-disable-next-line @typescript-eslint/no-explicit-any
-	let instance: any;
+	let instance: ReturnType<typeof mount> | null;
 
 	function unmountInstance() {
 		if (instance) {
@@ -53,8 +54,7 @@
 			return;
 		}
 		instance = mount(PortalConsumer, {
-			// eslint-disable-next-line @typescript-eslint/no-explicit-any
-			target: target as any,
+			target: target,
 			props: { children },
 			context,
 		});

package/dist/bits/utilities/portal/types.d.ts

@@ -1,11 +1,12 @@
 import type { Snippet } from "svelte";
+export type PortalTarget = Element | string;
 export type PortalProps = {
     /**
      * Where to portal the content to.
      *
      * @default document.body
      */
-    to?: HTMLElement | string | DocumentFragment;
+    to?: PortalTarget;
     /**
      * Disable portalling and render the component inline
      *

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-export { Accordion, AlertDialog, AspectRatio, Avatar, Button, Calendar, Checkbox, Collapsible, Combobox, Command, ContextMenu, DateField, DatePicker, DateRangeField, DateRangePicker, Dialog, DropdownMenu, Label, LinkPreview, Menubar, Meter, NavigationMenu, Pagination, PinInput, Popover, Progress, RadioGroup, RangeCalendar, RatingGroup as unstable_RatingGroup, ScrollArea, Select, Separator, Slider, Switch, Tabs, TimeField, TimeRangeField, Toggle, ToggleGroup, Toolbar, Tooltip, Portal, IsUsingKeyboard, computeCommandScore, } from "./bits/index.js";
+export { Accordion, AlertDialog, AspectRatio, Avatar, BitsConfig, Button, Calendar, Checkbox, Collapsible, Combobox, Command, ContextMenu, DateField, DatePicker, DateRangeField, DateRangePicker, Dialog, DropdownMenu, Label, LinkPreview, Menubar, Meter, NavigationMenu, Pagination, PinInput, Popover, Progress, RadioGroup, RangeCalendar, RatingGroup as unstable_RatingGroup, ScrollArea, Select, Separator, Slider, Switch, Tabs, TimeField, TimeRangeField, Toggle, ToggleGroup, Toolbar, Tooltip, Portal, IsUsingKeyboard, computeCommandScore, getBitsConfig, } from "./bits/index.js";
 export * from "./shared/index.js";
 export type * from "./shared/index.js";
 export * from "./types.js";

package/dist/index.js

@@ -1,3 +1,3 @@
-export { Accordion, AlertDialog, AspectRatio, Avatar, Button, Calendar, Checkbox, Collapsible, Combobox, Command, ContextMenu, DateField, DatePicker, DateRangeField, DateRangePicker, Dialog, DropdownMenu, Label, LinkPreview, Menubar, Meter, NavigationMenu, Pagination, PinInput, Popover, Progress, RadioGroup, RangeCalendar, RatingGroup as unstable_RatingGroup, ScrollArea, Select, Separator, Slider, Switch, Tabs, TimeField, TimeRangeField, Toggle, ToggleGroup, Toolbar, Tooltip, Portal, IsUsingKeyboard, computeCommandScore, } from "./bits/index.js";
+export { Accordion, AlertDialog, AspectRatio, Avatar, BitsConfig, Button, Calendar, Checkbox, Collapsible, Combobox, Command, ContextMenu, DateField, DatePicker, DateRangeField, DateRangePicker, Dialog, DropdownMenu, Label, LinkPreview, Menubar, Meter, NavigationMenu, Pagination, PinInput, Popover, Progress, RadioGroup, RangeCalendar, RatingGroup as unstable_RatingGroup, ScrollArea, Select, Separator, Slider, Switch, Tabs, TimeField, TimeRangeField, Toggle, ToggleGroup, Toolbar, Tooltip, Portal, IsUsingKeyboard, computeCommandScore, getBitsConfig, } from "./bits/index.js";
 export * from "./shared/index.js";
 export * from "./types.js";

package/dist/internal/use-data-typeahead.svelte.d.ts

@@ -4,7 +4,7 @@ type UseDataTypeaheadOpts = {
     onMatch: (value: string) => void;
     getCurrentItem: () => string;
     candidateValues: Getter<string[]>;
-    enabled: boolean;
+    enabled: Getter<boolean>;
     getWindow: () => Window & typeof globalThis;
 };
 export declare function useDataTypeahead(opts: UseDataTypeaheadOpts): {

package/dist/internal/use-data-typeahead.svelte.js

@@ -8,7 +8,7 @@ export function useDataTypeahead(opts) {
     });
     const candidateValues = $derived(opts.candidateValues());
     function handleTypeaheadSearch(key) {
-        if (!opts.enabled)
+        if (!opts.enabled())
             return;
         if (!candidateValues.length)
             return;

package/dist/types.d.ts

@@ -40,4 +40,5 @@ export type * from "./bits/toggle/types.js";
 export type * from "./bits/toggle-group/types.js";
 export type * from "./bits/toolbar/types.js";
 export type * from "./bits/tooltip/types.js";
+export type * from "./bits/utilities/config/types.js";
 export type { PortalProps } from "./bits/utilities/portal/types.js";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bits-ui",
-  "version": "2.3.1",
+  "version": "2.4.0",
   "license": "MIT",
   "repository": "github:huntabyte/bits-ui",
   "funding": "https://github.com/sponsors/huntabyte",