From 53c4968c488d8a1ade58801a4da284f8c781ab59 Mon Sep 17 00:00:00 2001 From: Hunter Johnston Date: Sun, 16 Jun 2024 19:20:39 -0400 Subject: [PATCH] downgrade svelte --- package.json | 2 +- packages/bits-ui/package.json | 2 +- .../components/context-menu-content.svelte | 15 +- .../components/context-menu-trigger.svelte | 6 +- .../components/dropdown-menu-content.svelte | 19 +- .../menu/components/menu-checkbox-item.svelte | 6 +- .../bits/menu/components/menu-content.svelte | 15 +- .../lib/bits/menu/components/menu-item.svelte | 6 +- .../menu/components/menu-radio-group.svelte | 9 +- .../menu/components/menu-radio-item.svelte | 6 +- .../menu/components/menu-sub-content.svelte | 17 +- .../menu/components/menu-sub-trigger.svelte | 6 +- .../bits/menu/components/menu-trigger.svelte | 6 +- .../bits-ui/src/lib/bits/menu/menu.svelte.ts | 145 ++++++++++--- .../popper-layer/popper-layer.svelte | 10 +- pnpm-lock.yaml | 190 +++++++++--------- sites/docs/package.json | 2 +- 17 files changed, 309 insertions(+), 153 deletions(-) diff --git a/package.json b/package.json index 0ec25dc1d..73fc05a59 100644 --- a/package.json +++ b/package.json @@ -26,7 +26,7 @@ "prettier": "^3.2.5", "prettier-plugin-svelte": "^3.2.2", "prettier-plugin-tailwindcss": "0.5.13", - "svelte": "5.0.0-next.155", + "svelte": "5.0.0-next.143", "svelte-eslint-parser": "^0.34.1", "wrangler": "^3.44.0" }, diff --git a/packages/bits-ui/package.json b/packages/bits-ui/package.json index 16aca21a5..0467998cc 100644 --- a/packages/bits-ui/package.json +++ b/packages/bits-ui/package.json @@ -45,7 +45,7 @@ "jsdom": "^24.0.0", "publint": "^0.2.7", "resize-observer-polyfill": "^1.5.1", - "svelte": "5.0.0-next.155", + "svelte": "5.0.0-next.143", "svelte-check": "^3.6.9", "tslib": "^2.6.2", "typescript": "^5.3.3", diff --git a/packages/bits-ui/src/lib/bits/context-menu/components/context-menu-content.svelte b/packages/bits-ui/src/lib/bits/context-menu/components/context-menu-content.svelte index 35558dc12..ddf55af66 100644 --- a/packages/bits-ui/src/lib/bits/context-menu/components/context-menu-content.svelte +++ b/packages/bits-ui/src/lib/bits/context-menu/components/context-menu-content.svelte @@ -8,13 +8,14 @@ import PopperLayer from "$lib/bits/utilities/popper-layer/popper-layer.svelte"; import { isElement } from "$lib/internal/is.js"; import type { InteractOutsideEvent } from "$lib/bits/utilities/dismissable-layer/types.js"; + import Mounted from "$lib/bits/utilities/mounted.svelte"; let { id = useId(), asChild, child, children, - ref = $bindable(), + ref = $bindable(null), loop = true, onInteractOutside = noop, // we need to explicitly pass this prop to the PopperLayer to override @@ -25,18 +26,25 @@ ...restProps }: ContentProps = $props(); + let isMounted = $state(false); + const contentState = useMenuContent({ id: box.with(() => id), loop: box.with(() => loop), + ref: box.with( + () => ref, + (v) => (ref = v) + ), + isMounted: box.with(() => isMounted), }); function handleInteractOutsideStart(e: InteractOutsideEvent) { if (!isElement(e.target)) return; - if (e.target.id === contentState.parentMenu.triggerId.value) { + if (e.target.id === contentState.parentMenu.triggerNode?.id) { e.preventDefault(); return; } - if (e.target.closest(`#${contentState.parentMenu.triggerId.value}`)) { + if (e.target.closest(`#${contentState.parentMenu.triggerNode?.id}`)) { e.preventDefault(); } } @@ -88,5 +96,6 @@ {@render children?.()} {/if} + {/snippet} diff --git a/packages/bits-ui/src/lib/bits/context-menu/components/context-menu-trigger.svelte b/packages/bits-ui/src/lib/bits/context-menu/components/context-menu-trigger.svelte index 4f589407b..bfe54e87a 100644 --- a/packages/bits-ui/src/lib/bits/context-menu/components/context-menu-trigger.svelte +++ b/packages/bits-ui/src/lib/bits/context-menu/components/context-menu-trigger.svelte @@ -8,7 +8,7 @@ let { id = useId(), - ref = $bindable(), + ref = $bindable(null), asChild, child, children, @@ -19,6 +19,10 @@ const triggerState = useMenuContextTrigger({ id: box.with(() => id), disabled: box.with(() => disabled), + ref: box.with( + () => ref, + (v) => (ref = v) + ), }); const mergedProps = $derived( diff --git a/packages/bits-ui/src/lib/bits/dropdown-menu/components/dropdown-menu-content.svelte b/packages/bits-ui/src/lib/bits/dropdown-menu/components/dropdown-menu-content.svelte index 3ecf9cecf..241200d32 100644 --- a/packages/bits-ui/src/lib/bits/dropdown-menu/components/dropdown-menu-content.svelte +++ b/packages/bits-ui/src/lib/bits/dropdown-menu/components/dropdown-menu-content.svelte @@ -7,13 +7,14 @@ import { noop } from "$lib/internal/callbacks.js"; import PopperLayer from "$lib/bits/utilities/popper-layer/popper-layer.svelte"; import { isElementOrSVGElement } from "$lib/internal/is.js"; + import Mounted from "$lib/bits/utilities/mounted.svelte"; let { id = useId(), asChild, child, children, - ref = $bindable(), + ref = $bindable(null), loop = true, onInteractOutside = noop, onEscapeKeydown = noop, @@ -21,9 +22,16 @@ ...restProps }: ContentProps = $props(); + let isMounted = $state(false); + const contentState = useMenuContent({ id: box.with(() => id), loop: box.with(() => loop), + ref: box.with( + () => ref, + (v) => (ref = v) + ), + isMounted: box.with(() => isMounted), }); const mergedProps = $derived( @@ -48,21 +56,21 @@ present={contentState.parentMenu.open.value || forceMount} onInteractOutsideStart={(e) => { if (!isElementOrSVGElement(e.target)) return; - if (e.target.id === contentState.parentMenu.triggerId.value) { + if (e.target.id === contentState.parentMenu.triggerNode?.id) { e.preventDefault(); return; } - if (e.target.closest(`#${contentState.parentMenu.triggerId.value}`)) { + if (e.target.closest(`#${contentState.parentMenu.triggerNode?.id}`)) { e.preventDefault(); } }} onInteractOutside={(e) => { if (!isElementOrSVGElement(e.target)) return; - if (e.target.id === contentState.parentMenu.triggerId.value) { + if (e.target.id === contentState.parentMenu.triggerNode?.id) { e.preventDefault(); return; } - if (e.target.closest(`#${contentState.parentMenu.triggerId.value}`)) { + if (e.target.closest(`#${contentState.parentMenu.triggerNode?.id}`)) { e.preventDefault(); return; } @@ -87,5 +95,6 @@ {@render children?.()} {/if} + {/snippet} diff --git a/packages/bits-ui/src/lib/bits/menu/components/menu-checkbox-item.svelte b/packages/bits-ui/src/lib/bits/menu/components/menu-checkbox-item.svelte index c441f2982..0f2e53bda 100644 --- a/packages/bits-ui/src/lib/bits/menu/components/menu-checkbox-item.svelte +++ b/packages/bits-ui/src/lib/bits/menu/components/menu-checkbox-item.svelte @@ -10,7 +10,7 @@ asChild, child, children, - ref = $bindable(), + ref = $bindable(null), checked = $bindable(false), id = useId(), onCheckedChange = noop, @@ -32,6 +32,10 @@ id: box.with(() => id), disabled: box.with(() => disabled), onSelect: box.with(() => handleSelect), + ref: box.with( + () => ref, + (v) => (ref = v) + ), }); function handleSelect(e: Event) { diff --git a/packages/bits-ui/src/lib/bits/menu/components/menu-content.svelte b/packages/bits-ui/src/lib/bits/menu/components/menu-content.svelte index 6f7d9afce..48bfd3021 100644 --- a/packages/bits-ui/src/lib/bits/menu/components/menu-content.svelte +++ b/packages/bits-ui/src/lib/bits/menu/components/menu-content.svelte @@ -8,13 +8,14 @@ import PopperLayer from "$lib/bits/utilities/popper-layer/popper-layer.svelte"; import { isElement } from "$lib/internal/is.js"; import type { InteractOutsideEvent } from "$lib/bits/utilities/dismissable-layer/types.js"; + import Mounted from "$lib/bits/utilities/mounted.svelte"; let { id = useId(), asChild, child, children, - ref = $bindable(), + ref = $bindable(null), loop = true, onInteractOutside = noop, onEscapeKeydown = noop, @@ -22,18 +23,25 @@ ...restProps }: ContentProps = $props(); + let isMounted = $state(false); + const contentState = useMenuContent({ id: box.with(() => id), loop: box.with(() => loop), + ref: box.with( + () => ref, + (v) => (ref = v) + ), + isMounted: box.with(() => isMounted), }); function handleInteractOutsideStart(e: InteractOutsideEvent) { if (!isElement(e.target)) return; - if (e.target.id === contentState.parentMenu.triggerId.value) { + if (e.target.id === contentState.parentMenu.triggerNode?.id) { e.preventDefault(); return; } - if (e.target.closest(`#${contentState.parentMenu.triggerId.value}`)) { + if (e.target.closest(`#${contentState.parentMenu.triggerNode?.id}`)) { e.preventDefault(); } } @@ -71,5 +79,6 @@ {@render children?.()} {/if} + {/snippet} diff --git a/packages/bits-ui/src/lib/bits/menu/components/menu-item.svelte b/packages/bits-ui/src/lib/bits/menu/components/menu-item.svelte index 30d1eb6fd..b742a2190 100644 --- a/packages/bits-ui/src/lib/bits/menu/components/menu-item.svelte +++ b/packages/bits-ui/src/lib/bits/menu/components/menu-item.svelte @@ -10,7 +10,7 @@ asChild, child, children, - ref = $bindable(), + ref = $bindable(null), id = useId(), disabled = false, onSelect = noop, @@ -21,6 +21,10 @@ id: box.with(() => id), disabled: box.with(() => disabled), onSelect: box.with(() => onSelect), + ref: box.with( + () => ref, + (v) => (ref = v) + ), }); const mergedProps = $derived(mergeProps(restProps, itemState.props)); diff --git a/packages/bits-ui/src/lib/bits/menu/components/menu-radio-group.svelte b/packages/bits-ui/src/lib/bits/menu/components/menu-radio-group.svelte index e81dbd9c5..f960091d4 100644 --- a/packages/bits-ui/src/lib/bits/menu/components/menu-radio-group.svelte +++ b/packages/bits-ui/src/lib/bits/menu/components/menu-radio-group.svelte @@ -4,12 +4,14 @@ import { useMenuRadioGroup } from "../menu.svelte.js"; import { noop } from "$lib/internal/callbacks.js"; import { mergeProps } from "$lib/internal/mergeProps.js"; + import { useId } from "$lib/internal/useId.svelte.js"; let { + id = useId(), asChild, children, child, - ref = $bindable(), + ref = $bindable(null), value = $bindable(""), onValueChange = noop, ...restProps @@ -25,6 +27,11 @@ } } ), + ref: box.with( + () => ref, + (v) => (ref = v) + ), + id: box.with(() => id), }); const mergedProps = $derived(mergeProps(restProps, radioGroupState.props)); diff --git a/packages/bits-ui/src/lib/bits/menu/components/menu-radio-item.svelte b/packages/bits-ui/src/lib/bits/menu/components/menu-radio-item.svelte index b4c67e0ec..d83263ac9 100644 --- a/packages/bits-ui/src/lib/bits/menu/components/menu-radio-item.svelte +++ b/packages/bits-ui/src/lib/bits/menu/components/menu-radio-item.svelte @@ -10,7 +10,7 @@ asChild, children, child, - ref = $bindable(), + ref = $bindable(null), value, onSelect = noop, id = useId(), @@ -23,6 +23,10 @@ id: box.with(() => id), disabled: box.with(() => disabled), onSelect: box.with(() => handleSelect), + ref: box.with( + () => ref, + (v) => (ref = v) + ), }); function handleSelect(e: Event) { diff --git a/packages/bits-ui/src/lib/bits/menu/components/menu-sub-content.svelte b/packages/bits-ui/src/lib/bits/menu/components/menu-sub-content.svelte index fdca52637..4e98aa960 100644 --- a/packages/bits-ui/src/lib/bits/menu/components/menu-sub-content.svelte +++ b/packages/bits-ui/src/lib/bits/menu/components/menu-sub-content.svelte @@ -9,10 +9,11 @@ import { noop } from "$lib/internal/callbacks.js"; import { isHTMLElement } from "$lib/internal/is.js"; import { afterTick } from "$lib/internal/afterTick.js"; + import Mounted from "$lib/bits/utilities/mounted.svelte"; let { id = useId(), - ref = $bindable(), + ref = $bindable(null), asChild, children, child, @@ -26,9 +27,16 @@ ...restProps }: SubContentProps = $props(); + let isMounted = $state(false); + const subContentState = useMenuContent({ id: box.with(() => id), loop: box.with(() => loop), + ref: box.with( + () => ref, + (v) => (ref = v) + ), + isMounted: box.with(() => isMounted), }); function onkeydown(e: KeyboardEvent) { @@ -38,9 +46,7 @@ ); if (isKeyDownInside && isCloseKey) { subContentState.parentMenu.onClose(); - const triggerNode = document.getElementById( - subContentState.parentMenu.triggerId.value ?? "" - ); + const triggerNode = subContentState.parentMenu.triggerNode; triggerNode?.focus(); e.preventDefault(); } @@ -92,7 +98,7 @@ // on pointer interaction. if (!isHTMLElement(e.target)) return; - if (e.target.id !== subContentState.parentMenu.triggerId.value) { + if (e.target.id !== subContentState.parentMenu.triggerNode?.id) { subContentState.parentMenu.onClose(); } }} @@ -108,5 +114,6 @@ {@render children?.()} {/if} + {/snippet} diff --git a/packages/bits-ui/src/lib/bits/menu/components/menu-sub-trigger.svelte b/packages/bits-ui/src/lib/bits/menu/components/menu-sub-trigger.svelte index 69d92665b..ce9a6b5f6 100644 --- a/packages/bits-ui/src/lib/bits/menu/components/menu-sub-trigger.svelte +++ b/packages/bits-ui/src/lib/bits/menu/components/menu-sub-trigger.svelte @@ -8,7 +8,7 @@ let { id = useId(), disabled = false, - ref = $bindable(), + ref = $bindable(null), asChild, children, child, @@ -18,6 +18,10 @@ const subTriggerState = useMenuSubTrigger({ disabled: box.with(() => disabled), id: box.with(() => id), + ref: box.with( + () => ref, + (v) => (ref = v) + ), }); const mergedProps = $derived(mergeProps(restProps, subTriggerState.props)); diff --git a/packages/bits-ui/src/lib/bits/menu/components/menu-trigger.svelte b/packages/bits-ui/src/lib/bits/menu/components/menu-trigger.svelte index 277ad7877..2bfdb342d 100644 --- a/packages/bits-ui/src/lib/bits/menu/components/menu-trigger.svelte +++ b/packages/bits-ui/src/lib/bits/menu/components/menu-trigger.svelte @@ -8,7 +8,7 @@ let { id = useId(), - ref = $bindable(), + ref = $bindable(null), asChild, child, children, @@ -19,6 +19,10 @@ const triggerState = useMenuDropdownTrigger({ id: box.with(() => id), disabled: box.with(() => disabled), + ref: box.with( + () => ref, + (v) => (ref = v) + ), }); const mergedProps = $derived(mergeProps(restProps, triggerState.props)); diff --git a/packages/bits-ui/src/lib/bits/menu/menu.svelte.ts b/packages/bits-ui/src/lib/bits/menu/menu.svelte.ts index d33a8f2fd..68b902159 100644 --- a/packages/bits-ui/src/lib/bits/menu/menu.svelte.ts +++ b/packages/bits-ui/src/lib/bits/menu/menu.svelte.ts @@ -1,4 +1,4 @@ -import { box } from "svelte-toolbelt"; +import { box, type WritableBox } from "svelte-toolbelt"; import { tick } from "svelte"; import { focusFirst } from "../utilities/focus-scope/utils.js"; import { @@ -37,6 +37,7 @@ import { mergeProps } from "$lib/internal/mergeProps.js"; import { createContext } from "$lib/internal/createContext.js"; import type { Direction } from "$lib/shared/index.js"; import { afterTick } from "$lib/internal/afterTick.js"; +import { useRefById } from "$lib/internal/useNodeById.svelte.js"; const TRIGGER_ATTR = "data-menu-trigger"; const CONTENT_ATTR = "data-menu-content"; @@ -128,7 +129,8 @@ class MenuMenuState { root: MenuRootState; open: MenuMenuStateProps["open"]; contentId = box.with(() => ""); - triggerId = box.with(() => ""); + contentNode = $state(null); + triggerNode = $state(null); parentMenu?: MenuMenuState; constructor(props: MenuMenuStateProps, root: MenuRootState, parentMenu?: MenuMenuState) { @@ -175,10 +177,15 @@ class MenuMenuState { type MenuContentStateProps = ReadableBoxedValues<{ id: string; loop: boolean; -}>; + isMounted: boolean; +}> & + WritableBoxedValues<{ + ref: HTMLElement | null; + }>; class MenuContentState { #id: MenuContentStateProps["id"]; + contentRef: MenuContentStateProps["ref"]; parentMenu: MenuMenuState; search = $state(""); #loop: MenuContentStateProps["loop"]; @@ -189,12 +196,21 @@ class MenuContentState { #lastPointerX = $state(0); #handleTypeaheadSearch: ReturnType["handleTypeaheadSearch"]; rovingFocusGroup: ReturnType; + isMounted: MenuContentStateProps["isMounted"]; constructor(props: MenuContentStateProps, parentMenu: MenuMenuState) { this.#id = props.id; this.#loop = props.loop; this.parentMenu = parentMenu; this.parentMenu.contentId = props.id; + this.contentRef = props.ref; + this.isMounted = props.isMounted; + + useRefById({ + id: this.#id, + ref: this.contentRef, + condition: () => this.isMounted.value, + }); onDestroyEffect(() => { window.clearTimeout(this.#timer); @@ -210,7 +226,7 @@ class MenuContentState { } getCandidateNodes() { - const node = document.getElementById(this.parentMenu.contentId.value); + const node = this.parentMenu.contentNode; if (!node) return []; const candidates = Array.from( node.querySelectorAll(`[${ITEM_ATTR}]:not([data-disabled])`) @@ -307,7 +323,7 @@ class MenuContentState { onItemLeave(e: PointerEvent) { if (this.isPointerMovingToSubmenu(e)) return; - const contentNode = document.getElementById(this.parentMenu.contentId.value); + const contentNode = this.parentMenu.contentNode; contentNode?.focus(); this.rovingFocusGroup.setCurrentTabStopId(""); } @@ -320,10 +336,8 @@ class MenuContentState { onMountAutoFocus(e: Event) { if (e.defaultPrevented) return; e.preventDefault(); - afterTick(() => { - const contentNode = document.getElementById(this.parentMenu.contentId.value); - contentNode?.focus(); - }); + const contentNode = this.parentMenu.contentNode; + contentNode?.focus(); } props = $derived.by( @@ -360,7 +374,6 @@ class MenuContentState { createSubTrigger(props: MenuItemSharedStateProps) { const item = new MenuItemSharedState(props, this); const submenu = getMenuMenuContext(); - submenu.triggerId = props.id; return new MenuSubTriggerState(item, this, submenu); } } @@ -368,10 +381,14 @@ class MenuContentState { type MenuItemSharedStateProps = ReadableBoxedValues<{ disabled: boolean; id: string; -}>; +}> & + WritableBoxedValues<{ + ref: HTMLElement | null; + }>; class MenuItemSharedState { content: MenuContentState; + ref: MenuItemSharedStateProps["ref"]; id: MenuItemSharedStateProps["id"]; disabled: MenuItemSharedStateProps["disabled"]; #isFocused = $state(false); @@ -380,6 +397,13 @@ class MenuItemSharedState { this.content = content; this.id = props.id; this.disabled = props.disabled; + this.ref = props.ref; + + useRefById({ + id: this.id, + ref: this.ref, + condition: () => this.content.isMounted.value, + }); } #onpointermove = (e: PointerEvent) => { @@ -519,7 +543,6 @@ class MenuSubTriggerState { this.#item = item; this.#content = content; this.#submenu = submenu; - this.#submenu.triggerId = item.id; onDestroyEffect(() => { this.#clearOpenTimer(); @@ -548,7 +571,8 @@ class MenuSubTriggerState { #onpointerleave = (e: PointerEvent) => { if (!isMouseEvent(e)) return; this.#clearOpenTimer(); - const contentNode = document.getElementById(this.#content.parentMenu.contentId.value); + + const contentNode = this.#content.parentMenu.contentNode; const contentRect = contentNode?.getBoundingClientRect(); if (contentRect?.width) { @@ -593,11 +617,10 @@ class MenuSubTriggerState { if (SUB_OPEN_KEYS[this.#submenu.root.dir.value].includes(e.key)) { this.#submenu.onOpen(); - afterTick(() => { - const contentNode = document.getElementById(this.#submenu.contentId.value); - contentNode?.focus(); - e.preventDefault(); - }); + const contentNode = this.#submenu.contentNode; + + contentNode?.focus(); + e.preventDefault(); } }; @@ -632,15 +655,28 @@ class MenuSubTriggerState { type MenuCheckboxItemStateProps = WritableBoxedValues<{ checked: boolean | "indeterminate"; -}>; + ref: HTMLElement | null; +}> & + ReadableBoxedValues<{ + id: string; + }>; class MenuCheckboxItemState { + #id: MenuCheckboxItemStateProps["id"]; #item: MenuItemState; #checked: MenuCheckboxItemStateProps["checked"]; + #ref: MenuCheckboxItemStateProps["ref"]; constructor(props: MenuCheckboxItemStateProps, item: MenuItemState) { this.#item = item; this.#checked = props.checked; + this.#ref = props.ref; + this.#id = props.id; + + useRefById({ + id: this.#id, + ref: this.#ref, + }); } toggleChecked() { @@ -694,15 +730,28 @@ class MenuArrowState { type MenuRadioGroupStateProps = WritableBoxedValues<{ value: string; -}>; + ref: HTMLElement | null; +}> & + ReadableBoxedValues<{ + id: string; + }>; class MenuRadioGroupState { + #id: MenuRadioGroupStateProps["id"]; value: MenuRadioGroupStateProps["value"]; + #ref: MenuRadioGroupStateProps["ref"]; #content: MenuContentState; constructor(props: MenuRadioGroupStateProps, content: MenuContentState) { this.value = props.value; + this.#id = props.id; + this.#ref = props.ref; this.#content = content; + + useRefById({ + id: this.#id, + ref: this.#ref, + }); } setValue(v: string) { @@ -727,9 +776,15 @@ class MenuRadioGroupState { type MenuRadioItemStateProps = ReadableBoxedValues<{ value: string; -}>; + id: string; +}> & + WritableBoxedValues<{ + ref: HTMLElement | null; + }>; class MenuRadioItemState { + #id: MenuRadioItemStateProps["id"]; + #ref: MenuRadioItemStateProps["ref"]; #item: MenuItemState; #value: MenuRadioItemStateProps["value"]; #group: MenuRadioGroupState; @@ -737,8 +792,15 @@ class MenuRadioItemState { constructor(props: MenuRadioItemStateProps, item: MenuItemState, group: MenuRadioGroupState) { this.#item = item; + this.#id = props.id; + this.#ref = props.ref; this.#group = group; this.#value = props.value; + + useRefById({ + id: this.#id, + ref: this.#ref, + }); } selectValue() { @@ -764,15 +826,30 @@ class MenuRadioItemState { type DropdownMenuTriggerStateProps = ReadableBoxedValues<{ id: string; disabled: boolean; -}>; +}> & + WritableBoxedValues<{ + ref: HTMLElement | null; + }>; class DropdownMenuTriggerState { + #id: DropdownMenuTriggerStateProps["id"]; + #ref: DropdownMenuTriggerStateProps["ref"]; #parentMenu: MenuMenuState; #disabled: DropdownMenuTriggerStateProps["disabled"]; + constructor(props: DropdownMenuTriggerStateProps, parentMenu: MenuMenuState) { + this.#ref = props.ref; + this.#id = props.id; this.#parentMenu = parentMenu; this.#disabled = props.disabled; - this.#parentMenu.triggerId = props.id; + + useRefById({ + id: this.#id, + ref: this.#ref, + onRefChange: (ref) => { + this.#parentMenu.triggerNode = ref; + }, + }); } #onpointerdown = (e: PointerEvent) => { @@ -806,7 +883,7 @@ class DropdownMenuTriggerState { props = $derived.by( () => ({ - id: this.#parentMenu.triggerId.value, + id: this.#id.value, disabled: this.#disabled.value, "aria-haspopup": "menu", "aria-expanded": getAriaExpanded(this.#parentMenu.open.value), @@ -824,9 +901,14 @@ class DropdownMenuTriggerState { type ContextMenuTriggerStateProps = ReadableBoxedValues<{ id: string; disabled: boolean; -}>; +}> & + WritableBoxedValues<{ + ref: HTMLElement | null; + }>; class ContextMenuTriggerState { + #id: ContextMenuTriggerStateProps["id"]; + #ref: ContextMenuTriggerStateProps["ref"]; #parentMenu: MenuMenuState; #disabled: ContextMenuTriggerStateProps["disabled"]; #point = $state({ x: 0, y: 0 }); @@ -840,7 +922,16 @@ class ContextMenuTriggerState { constructor(props: ContextMenuTriggerStateProps, parentMenu: MenuMenuState) { this.#parentMenu = parentMenu; this.#disabled = props.disabled; - this.#parentMenu.triggerId = props.id; + this.#id = props.id; + this.#ref = props.ref; + + useRefById({ + id: this.#id, + ref: this.#ref, + onRefChange: (node) => { + this.#parentMenu.triggerNode = node; + }, + }); $effect(() => { // eslint-disable-next-line no-unused-expressions @@ -905,7 +996,7 @@ class ContextMenuTriggerState { props = $derived.by( () => ({ - id: this.#parentMenu.triggerId.value, + id: this.#id.value, disabled: this.#disabled.value, "data-disabled": getDataDisabled(this.#disabled.value), "data-state": getDataOpenClosed(this.#parentMenu.open.value), diff --git a/packages/bits-ui/src/lib/bits/utilities/popper-layer/popper-layer.svelte b/packages/bits-ui/src/lib/bits/utilities/popper-layer/popper-layer.svelte index 33b5828d5..11b701040 100644 --- a/packages/bits-ui/src/lib/bits/utilities/popper-layer/popper-layer.svelte +++ b/packages/bits-ui/src/lib/bits/utilities/popper-layer/popper-layer.svelte @@ -12,15 +12,15 @@ - {#snippet presence()} - + {#snippet presence({ present })} + {#snippet content({ props: floatingProps })} {#snippet focusScope({ props: focusScopeProps })} - - + + {#snippet children({ props: dismissableProps })} - + {@render popper?.({ props: mergeProps( restProps, diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index c852d9515..20aa66921 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -13,7 +13,7 @@ importers: version: 2.27.5 '@huntabyte/eslint-config': specifier: ^0.3.1 - version: 0.3.1(@vue/compiler-sfc@3.4.27)(eslint-plugin-svelte@2.39.0(eslint@9.3.0)(svelte@5.0.0-next.155))(eslint@9.3.0)(svelte-eslint-parser@0.34.1(svelte@5.0.0-next.155))(svelte@5.0.0-next.155)(typescript@5.4.5)(vitest@1.6.0) + version: 0.3.1(@vue/compiler-sfc@3.4.27)(eslint-plugin-svelte@2.39.0(eslint@9.3.0)(svelte@5.0.0-next.143))(eslint@9.3.0)(svelte-eslint-parser@0.34.1(svelte@5.0.0-next.143))(svelte@5.0.0-next.143)(typescript@5.4.5)(vitest@1.6.0) '@huntabyte/eslint-plugin': specifier: ^0.1.0 version: 0.1.0(eslint@9.3.0) @@ -25,22 +25,22 @@ importers: version: 9.3.0 eslint-plugin-svelte: specifier: ^2.37.0 - version: 2.39.0(eslint@9.3.0)(svelte@5.0.0-next.155) + version: 2.39.0(eslint@9.3.0)(svelte@5.0.0-next.143) prettier: specifier: ^3.2.5 version: 3.2.5 prettier-plugin-svelte: specifier: ^3.2.2 - version: 3.2.3(prettier@3.2.5)(svelte@5.0.0-next.155) + version: 3.2.3(prettier@3.2.5)(svelte@5.0.0-next.143) prettier-plugin-tailwindcss: specifier: 0.5.13 - version: 0.5.13(prettier-plugin-svelte@3.2.3(prettier@3.2.5)(svelte@5.0.0-next.155))(prettier@3.2.5) + version: 0.5.13(prettier-plugin-svelte@3.2.3(prettier@3.2.5)(svelte@5.0.0-next.143))(prettier@3.2.5) svelte: - specifier: 5.0.0-next.155 - version: 5.0.0-next.155 + specifier: 5.0.0-next.143 + version: 5.0.0-next.143 svelte-eslint-parser: specifier: ^0.34.1 - version: 0.34.1(svelte@5.0.0-next.155) + version: 0.34.1(svelte@5.0.0-next.143) wrangler: specifier: ^3.44.0 version: 3.57.2(@cloudflare/workers-types@4.20240524.0) @@ -58,7 +58,7 @@ importers: version: 3.5.4 '@melt-ui/svelte': specifier: 0.76.2 - version: 0.76.2(svelte@5.0.0-next.155) + version: 0.76.2(svelte@5.0.0-next.143) clsx: specifier: ^2.1.0 version: 2.1.1 @@ -70,7 +70,7 @@ importers: version: 5.0.7 runed: specifier: ^0.12.1 - version: 0.12.1(svelte@5.0.0-next.155) + version: 0.12.1(svelte@5.0.0-next.143) scule: specifier: ^1.3.0 version: 1.3.0 @@ -82,20 +82,20 @@ importers: version: 1.0.6 svelte-toolbelt: specifier: ^0.0.2 - version: 0.0.2(svelte@5.0.0-next.155) + version: 0.0.2(svelte@5.0.0-next.143) devDependencies: '@melt-ui/pp': specifier: ^0.3.0 - version: 0.3.2(@melt-ui/svelte@0.76.2(svelte@5.0.0-next.155))(svelte@5.0.0-next.155) + version: 0.3.2(@melt-ui/svelte@0.76.2(svelte@5.0.0-next.143))(svelte@5.0.0-next.143) '@sveltejs/kit': specifier: ^2.5.0 - version: 2.5.10(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)) + version: 2.5.10(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)) '@sveltejs/package': specifier: ^2.2.7 - version: 2.3.1(svelte@5.0.0-next.155)(typescript@5.4.5) + version: 2.3.1(svelte@5.0.0-next.143)(typescript@5.4.5) '@sveltejs/vite-plugin-svelte': specifier: ^3.1.0 - version: 3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)) + version: 3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)) '@testing-library/dom': specifier: ^10.0.0 version: 10.1.0 @@ -104,7 +104,7 @@ importers: version: 6.4.5(@types/jest@29.5.12)(vitest@1.6.0(@types/node@20.12.13)(@vitest/ui@1.6.0)(jsdom@24.1.0)) '@testing-library/svelte': specifier: ^5.0.1 - version: 5.1.0(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13))(vitest@1.6.0(@types/node@20.12.13)(@vitest/ui@1.6.0)(jsdom@24.1.0)) + version: 5.1.0(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13))(vitest@1.6.0(@types/node@20.12.13)(@vitest/ui@1.6.0)(jsdom@24.1.0)) '@testing-library/user-event': specifier: ^14.5.2 version: 14.5.2(@testing-library/dom@10.1.0) @@ -139,11 +139,11 @@ importers: specifier: ^1.5.1 version: 1.5.1 svelte: - specifier: 5.0.0-next.155 - version: 5.0.0-next.155 + specifier: 5.0.0-next.143 + version: 5.0.0-next.143 svelte-check: specifier: ^3.6.9 - version: 3.8.0(postcss-load-config@5.1.0(postcss@8.4.38))(postcss@8.4.38)(svelte@5.0.0-next.155) + version: 3.8.0(postcss-load-config@5.1.0(jiti@1.21.0)(postcss@8.4.38))(postcss@8.4.38)(svelte@5.0.0-next.143) tslib: specifier: ^2.6.2 version: 2.6.2 @@ -164,26 +164,26 @@ importers: version: 3.5.4 '@melt-ui/svelte': specifier: 0.76.2 - version: 0.76.2(svelte@5.0.0-next.155) + version: 0.76.2(svelte@5.0.0-next.143) bits-ui: specifier: workspace:* version: link:../../packages/bits-ui devDependencies: '@melt-ui/pp': specifier: ^0.3.0 - version: 0.3.2(@melt-ui/svelte@0.76.2(svelte@5.0.0-next.155))(svelte@5.0.0-next.155) + version: 0.3.2(@melt-ui/svelte@0.76.2(svelte@5.0.0-next.143))(svelte@5.0.0-next.143) '@prettier/sync': specifier: 0.3.0 version: 0.3.0(prettier@3.2.5) '@sveltejs/adapter-cloudflare': specifier: ^4.2.0 - version: 4.4.0(@sveltejs/kit@2.5.10(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)))(wrangler@3.57.2(@cloudflare/workers-types@4.20240524.0)) + version: 4.4.0(@sveltejs/kit@2.5.10(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)))(wrangler@3.57.2(@cloudflare/workers-types@4.20240524.0)) '@sveltejs/kit': specifier: ^2.5.0 - version: 2.5.10(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)) + version: 2.5.10(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)) '@sveltejs/vite-plugin-svelte': specifier: ^3.1.0 - version: 3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)) + version: 3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)) '@tailwindcss/typography': specifier: ^0.5.10 version: 0.5.13(tailwindcss@3.4.3) @@ -216,13 +216,13 @@ importers: version: 3.0.1 mdsx: specifier: ^0.0.5 - version: 0.0.5(svelte@5.0.0-next.155) + version: 0.0.5(svelte@5.0.0-next.143) mode-watcher: specifier: ^0.2.0 - version: 0.2.2(svelte@5.0.0-next.155) + version: 0.2.2(svelte@5.0.0-next.143) phosphor-svelte: specifier: ^1.4.2 - version: 1.4.2(svelte@5.0.0-next.155) + version: 1.4.2(svelte@5.0.0-next.143) postcss: specifier: ^8.4.33 version: 8.4.38 @@ -242,11 +242,11 @@ importers: specifier: ^1.1.1 version: 1.6.1 svelte: - specifier: 5.0.0-next.155 - version: 5.0.0-next.155 + specifier: 5.0.0-next.143 + version: 5.0.0-next.143 svelte-check: specifier: ^3.6.9 - version: 3.8.0(postcss-load-config@5.1.0(postcss@8.4.38))(postcss@8.4.38)(svelte@5.0.0-next.155) + version: 3.8.0(postcss-load-config@5.1.0(jiti@1.21.0)(postcss@8.4.38))(postcss@8.4.38)(svelte@5.0.0-next.143) tailwind-merge: specifier: ^2.2.1 version: 2.3.0 @@ -4762,8 +4762,8 @@ packages: svelte: ^3.55 || ^4.0.0-next.0 || ^4.0 || ^5.0.0-next.0 typescript: ^4.9.4 || ^5.0.0 - svelte@5.0.0-next.155: - resolution: {integrity: sha512-4a4EZuiTmg4eQJuQ6LTyK+DxRAZCYm4mXgqSWcZ7TellzLfaC1Je5nxBl1aZP3xdNhvPFIstQ8c7I6d+99FdZQ==} + svelte@5.0.0-next.143: + resolution: {integrity: sha512-hRm52FjYUfd24eUlkBS41JSmqHOx6wt0cV+wMzgwqhhxIpJoz96eiMcnvcLqXx+gTxM1m0Pt/+7xP3vlm2QvPg==} engines: {node: '>=18'} symbol-tree@3.2.4: @@ -5345,7 +5345,7 @@ snapshots: '@jridgewell/gen-mapping': 0.3.5 '@jridgewell/trace-mapping': 0.3.25 - '@antfu/eslint-config@2.19.1(@vue/compiler-sfc@3.4.27)(eslint-plugin-svelte@2.39.0(eslint@9.3.0)(svelte@5.0.0-next.155))(eslint@9.3.0)(svelte-eslint-parser@0.34.1(svelte@5.0.0-next.155))(svelte@5.0.0-next.155)(typescript@5.4.5)(vitest@1.6.0)': + '@antfu/eslint-config@2.19.1(@vue/compiler-sfc@3.4.27)(eslint-plugin-svelte@2.39.0(eslint@9.3.0)(svelte@5.0.0-next.143))(eslint@9.3.0)(svelte-eslint-parser@0.34.1(svelte@5.0.0-next.143))(svelte@5.0.0-next.143)(typescript@5.4.5)(vitest@1.6.0)': dependencies: '@antfu/install-pkg': 0.3.3 '@clack/prompts': 0.7.0 @@ -5365,7 +5365,7 @@ snapshots: eslint-plugin-markdown: 5.0.0(eslint@9.3.0) eslint-plugin-n: 17.7.0(eslint@9.3.0) eslint-plugin-no-only-tests: 3.1.0 - eslint-plugin-perfectionist: 2.10.0(eslint@9.3.0)(svelte-eslint-parser@0.34.1(svelte@5.0.0-next.155))(svelte@5.0.0-next.155)(typescript@5.4.5)(vue-eslint-parser@9.4.2(eslint@9.3.0)) + eslint-plugin-perfectionist: 2.10.0(eslint@9.3.0)(svelte-eslint-parser@0.34.1(svelte@5.0.0-next.143))(svelte@5.0.0-next.143)(typescript@5.4.5)(vue-eslint-parser@9.4.2(eslint@9.3.0)) eslint-plugin-regexp: 2.6.0(eslint@9.3.0) eslint-plugin-toml: 0.11.0(eslint@9.3.0) eslint-plugin-unicorn: 53.0.0(eslint@9.3.0) @@ -5384,8 +5384,8 @@ snapshots: yaml-eslint-parser: 1.2.3 yargs: 17.7.2 optionalDependencies: - eslint-plugin-svelte: 2.39.0(eslint@9.3.0)(svelte@5.0.0-next.155) - svelte-eslint-parser: 0.34.1(svelte@5.0.0-next.155) + eslint-plugin-svelte: 2.39.0(eslint@9.3.0)(svelte@5.0.0-next.143) + svelte-eslint-parser: 0.34.1(svelte@5.0.0-next.143) transitivePeerDependencies: - '@vue/compiler-sfc' - supports-color @@ -6050,9 +6050,9 @@ snapshots: '@humanwhocodes/retry@0.3.0': {} - '@huntabyte/eslint-config@0.3.1(@vue/compiler-sfc@3.4.27)(eslint-plugin-svelte@2.39.0(eslint@9.3.0)(svelte@5.0.0-next.155))(eslint@9.3.0)(svelte-eslint-parser@0.34.1(svelte@5.0.0-next.155))(svelte@5.0.0-next.155)(typescript@5.4.5)(vitest@1.6.0)': + '@huntabyte/eslint-config@0.3.1(@vue/compiler-sfc@3.4.27)(eslint-plugin-svelte@2.39.0(eslint@9.3.0)(svelte@5.0.0-next.143))(eslint@9.3.0)(svelte-eslint-parser@0.34.1(svelte@5.0.0-next.143))(svelte@5.0.0-next.143)(typescript@5.4.5)(vitest@1.6.0)': dependencies: - '@antfu/eslint-config': 2.19.1(@vue/compiler-sfc@3.4.27)(eslint-plugin-svelte@2.39.0(eslint@9.3.0)(svelte@5.0.0-next.155))(eslint@9.3.0)(svelte-eslint-parser@0.34.1(svelte@5.0.0-next.155))(svelte@5.0.0-next.155)(typescript@5.4.5)(vitest@1.6.0) + '@antfu/eslint-config': 2.19.1(@vue/compiler-sfc@3.4.27)(eslint-plugin-svelte@2.39.0(eslint@9.3.0)(svelte@5.0.0-next.143))(eslint@9.3.0)(svelte-eslint-parser@0.34.1(svelte@5.0.0-next.143))(svelte@5.0.0-next.143)(typescript@5.4.5)(vitest@1.6.0) '@antfu/install-pkg': 0.3.3 '@clack/prompts': 0.7.0 '@huntabyte/eslint-plugin': 0.1.0(eslint@9.3.0) @@ -6061,10 +6061,10 @@ snapshots: chalk: 5.3.0 eslint: 9.3.0 eslint-flat-config-utils: 0.2.5 - eslint-plugin-svelte: 2.39.0(eslint@9.3.0)(svelte@5.0.0-next.155) + eslint-plugin-svelte: 2.39.0(eslint@9.3.0)(svelte@5.0.0-next.143) local-pkg: 0.5.0 parse-gitignore: 2.0.0 - svelte-eslint-parser: 0.34.1(svelte@5.0.0-next.155) + svelte-eslint-parser: 0.34.1(svelte@5.0.0-next.143) yargs: 17.7.2 transitivePeerDependencies: - '@eslint-react/eslint-plugin' @@ -6201,14 +6201,14 @@ snapshots: transitivePeerDependencies: - supports-color - '@melt-ui/pp@0.3.2(@melt-ui/svelte@0.76.2(svelte@5.0.0-next.155))(svelte@5.0.0-next.155)': + '@melt-ui/pp@0.3.2(@melt-ui/svelte@0.76.2(svelte@5.0.0-next.143))(svelte@5.0.0-next.143)': dependencies: - '@melt-ui/svelte': 0.76.2(svelte@5.0.0-next.155) + '@melt-ui/svelte': 0.76.2(svelte@5.0.0-next.143) estree-walker: 3.0.3 magic-string: 0.30.10 - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 - '@melt-ui/svelte@0.76.2(svelte@5.0.0-next.155)': + '@melt-ui/svelte@0.76.2(svelte@5.0.0-next.143)': dependencies: '@floating-ui/core': 1.6.2 '@floating-ui/dom': 1.6.5 @@ -6216,7 +6216,7 @@ snapshots: dequal: 2.0.3 focus-trap: 7.5.4 nanoid: 5.0.7 - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 '@nodelib/fs.scandir@2.1.5': dependencies: @@ -6478,17 +6478,17 @@ snapshots: - supports-color - typescript - '@sveltejs/adapter-cloudflare@4.4.0(@sveltejs/kit@2.5.10(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)))(wrangler@3.57.2(@cloudflare/workers-types@4.20240524.0))': + '@sveltejs/adapter-cloudflare@4.4.0(@sveltejs/kit@2.5.10(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)))(wrangler@3.57.2(@cloudflare/workers-types@4.20240524.0))': dependencies: '@cloudflare/workers-types': 4.20240524.0 - '@sveltejs/kit': 2.5.10(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)) + '@sveltejs/kit': 2.5.10(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)) esbuild: 0.20.2 worktop: 0.8.0-next.18 wrangler: 3.57.2(@cloudflare/workers-types@4.20240524.0) - '@sveltejs/kit@2.5.10(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13))': + '@sveltejs/kit@2.5.10(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13))': dependencies: - '@sveltejs/vite-plugin-svelte': 3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)) + '@sveltejs/vite-plugin-svelte': 3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)) '@types/cookie': 0.6.0 cookie: 0.6.0 devalue: 5.0.0 @@ -6500,39 +6500,39 @@ snapshots: sade: 1.8.1 set-cookie-parser: 2.6.0 sirv: 2.0.4 - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 tiny-glob: 0.2.9 vite: 5.2.12(@types/node@20.12.13) - '@sveltejs/package@2.3.1(svelte@5.0.0-next.155)(typescript@5.4.5)': + '@sveltejs/package@2.3.1(svelte@5.0.0-next.143)(typescript@5.4.5)': dependencies: chokidar: 3.6.0 kleur: 4.1.5 sade: 1.8.1 semver: 7.6.2 - svelte: 5.0.0-next.155 - svelte2tsx: 0.7.9(svelte@5.0.0-next.155)(typescript@5.4.5) + svelte: 5.0.0-next.143 + svelte2tsx: 0.7.9(svelte@5.0.0-next.143)(typescript@5.4.5) transitivePeerDependencies: - typescript - '@sveltejs/vite-plugin-svelte-inspector@2.1.0(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13))': + '@sveltejs/vite-plugin-svelte-inspector@2.1.0(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13))': dependencies: - '@sveltejs/vite-plugin-svelte': 3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)) + '@sveltejs/vite-plugin-svelte': 3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)) debug: 4.3.4 - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 vite: 5.2.12(@types/node@20.12.13) transitivePeerDependencies: - supports-color - '@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13))': + '@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13))': dependencies: - '@sveltejs/vite-plugin-svelte-inspector': 2.1.0(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13)) + '@sveltejs/vite-plugin-svelte-inspector': 2.1.0(@sveltejs/vite-plugin-svelte@3.1.1(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)))(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13)) debug: 4.3.4 deepmerge: 4.3.1 kleur: 4.1.5 magic-string: 0.30.10 - svelte: 5.0.0-next.155 - svelte-hmr: 0.16.0(svelte@5.0.0-next.155) + svelte: 5.0.0-next.143 + svelte-hmr: 0.16.0(svelte@5.0.0-next.143) vite: 5.2.12(@types/node@20.12.13) vitefu: 0.2.5(vite@5.2.12(@types/node@20.12.13)) transitivePeerDependencies: @@ -6593,10 +6593,10 @@ snapshots: '@types/jest': 29.5.12 vitest: 1.6.0(@types/node@20.12.13)(@vitest/ui@1.6.0)(jsdom@24.1.0) - '@testing-library/svelte@5.1.0(svelte@5.0.0-next.155)(vite@5.2.12(@types/node@20.12.13))(vitest@1.6.0(@types/node@20.12.13)(@vitest/ui@1.6.0)(jsdom@24.1.0))': + '@testing-library/svelte@5.1.0(svelte@5.0.0-next.143)(vite@5.2.12(@types/node@20.12.13))(vitest@1.6.0(@types/node@20.12.13)(@vitest/ui@1.6.0)(jsdom@24.1.0))': dependencies: '@testing-library/dom': 9.3.4 - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 optionalDependencies: vite: 5.2.12(@types/node@20.12.13) vitest: 1.6.0(@types/node@20.12.13)(@vitest/ui@1.6.0)(jsdom@24.1.0) @@ -7720,15 +7720,15 @@ snapshots: eslint-plugin-no-only-tests@3.1.0: {} - eslint-plugin-perfectionist@2.10.0(eslint@9.3.0)(svelte-eslint-parser@0.34.1(svelte@5.0.0-next.155))(svelte@5.0.0-next.155)(typescript@5.4.5)(vue-eslint-parser@9.4.2(eslint@9.3.0)): + eslint-plugin-perfectionist@2.10.0(eslint@9.3.0)(svelte-eslint-parser@0.34.1(svelte@5.0.0-next.143))(svelte@5.0.0-next.143)(typescript@5.4.5)(vue-eslint-parser@9.4.2(eslint@9.3.0)): dependencies: '@typescript-eslint/utils': 7.11.0(eslint@9.3.0)(typescript@5.4.5) eslint: 9.3.0 minimatch: 9.0.4 natural-compare-lite: 1.4.0 optionalDependencies: - svelte: 5.0.0-next.155 - svelte-eslint-parser: 0.34.1(svelte@5.0.0-next.155) + svelte: 5.0.0-next.143 + svelte-eslint-parser: 0.34.1(svelte@5.0.0-next.143) vue-eslint-parser: 9.4.2(eslint@9.3.0) transitivePeerDependencies: - supports-color @@ -7745,7 +7745,7 @@ snapshots: regexp-ast-analysis: 0.7.1 scslre: 0.3.0 - eslint-plugin-svelte@2.39.0(eslint@9.3.0)(svelte@5.0.0-next.155): + eslint-plugin-svelte@2.39.0(eslint@9.3.0)(svelte@5.0.0-next.143): dependencies: '@eslint-community/eslint-utils': 4.4.0(eslint@9.3.0) '@jridgewell/sourcemap-codec': 1.4.15 @@ -7759,9 +7759,9 @@ snapshots: postcss-safe-parser: 6.0.0(postcss@8.4.38) postcss-selector-parser: 6.1.0 semver: 7.6.2 - svelte-eslint-parser: 0.36.0(svelte@5.0.0-next.155) + svelte-eslint-parser: 0.36.0(svelte@5.0.0-next.143) optionalDependencies: - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 transitivePeerDependencies: - supports-color - ts-node @@ -9108,7 +9108,7 @@ snapshots: dependencies: '@types/mdast': 4.0.4 - mdsx@0.0.5(svelte@5.0.0-next.155): + mdsx@0.0.5(svelte@5.0.0-next.143): dependencies: esrap: 1.2.2 hast-util-to-html: 9.0.1 @@ -9117,7 +9117,7 @@ snapshots: rehype-stringify: 10.0.0 remark-parse: 11.0.0 remark-rehype: 11.1.0 - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 unified: 11.0.4 unist-util-visit: 5.0.0 vfile: 6.0.1 @@ -9645,9 +9645,9 @@ snapshots: pkg-types: 1.1.1 ufo: 1.5.3 - mode-watcher@0.2.2(svelte@5.0.0-next.155): + mode-watcher@0.2.2(svelte@5.0.0-next.143): dependencies: - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 mri@1.2.0: {} @@ -9884,9 +9884,9 @@ snapshots: estree-walker: 3.0.3 is-reference: 3.0.2 - phosphor-svelte@1.4.2(svelte@5.0.0-next.155): + phosphor-svelte@1.4.2(svelte@5.0.0-next.143): dependencies: - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 picocolors@1.0.1: {} @@ -9988,16 +9988,16 @@ snapshots: prelude-ls@1.2.1: {} - prettier-plugin-svelte@3.2.3(prettier@3.2.5)(svelte@5.0.0-next.155): + prettier-plugin-svelte@3.2.3(prettier@3.2.5)(svelte@5.0.0-next.143): dependencies: prettier: 3.2.5 - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 - prettier-plugin-tailwindcss@0.5.13(prettier-plugin-svelte@3.2.3(prettier@3.2.5)(svelte@5.0.0-next.155))(prettier@3.2.5): + prettier-plugin-tailwindcss@0.5.13(prettier-plugin-svelte@3.2.3(prettier@3.2.5)(svelte@5.0.0-next.143))(prettier@3.2.5): dependencies: prettier: 3.2.5 optionalDependencies: - prettier-plugin-svelte: 3.2.3(prettier@3.2.5)(svelte@5.0.0-next.155) + prettier-plugin-svelte: 3.2.3(prettier@3.2.5)(svelte@5.0.0-next.143) prettier@2.8.8: {} @@ -10295,11 +10295,11 @@ snapshots: dependencies: queue-microtask: 1.2.3 - runed@0.12.1(svelte@5.0.0-next.155): + runed@0.12.1(svelte@5.0.0-next.143): dependencies: esm-env: 1.0.0 nanoid: 5.0.7 - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 rxjs@7.8.1: dependencies: @@ -10596,7 +10596,7 @@ snapshots: supports-preserve-symlinks-flag@1.0.0: {} - svelte-check@3.8.0(postcss-load-config@5.1.0(postcss@8.4.38))(postcss@8.4.38)(svelte@5.0.0-next.155): + svelte-check@3.8.0(postcss-load-config@5.1.0(jiti@1.21.0)(postcss@8.4.38))(postcss@8.4.38)(svelte@5.0.0-next.143): dependencies: '@jridgewell/trace-mapping': 0.3.25 chokidar: 3.6.0 @@ -10604,8 +10604,8 @@ snapshots: import-fresh: 3.3.0 picocolors: 1.0.1 sade: 1.8.1 - svelte: 5.0.0-next.155 - svelte-preprocess: 5.1.4(postcss-load-config@5.1.0(postcss@8.4.38))(postcss@8.4.38)(svelte@5.0.0-next.155)(typescript@5.4.5) + svelte: 5.0.0-next.143 + svelte-preprocess: 5.1.4(postcss-load-config@5.1.0(jiti@1.21.0)(postcss@8.4.38))(postcss@8.4.38)(svelte@5.0.0-next.143)(typescript@5.4.5) typescript: 5.4.5 transitivePeerDependencies: - '@babel/core' @@ -10618,7 +10618,7 @@ snapshots: - stylus - sugarss - svelte-eslint-parser@0.34.1(svelte@5.0.0-next.155): + svelte-eslint-parser@0.34.1(svelte@5.0.0-next.143): dependencies: eslint-scope: 7.2.2 eslint-visitor-keys: 3.4.3 @@ -10626,9 +10626,9 @@ snapshots: postcss: 8.4.38 postcss-scss: 4.0.9(postcss@8.4.38) optionalDependencies: - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 - svelte-eslint-parser@0.36.0(svelte@5.0.0-next.155): + svelte-eslint-parser@0.36.0(svelte@5.0.0-next.143): dependencies: eslint-scope: 7.2.2 eslint-visitor-keys: 3.4.3 @@ -10636,37 +10636,37 @@ snapshots: postcss: 8.4.38 postcss-scss: 4.0.9(postcss@8.4.38) optionalDependencies: - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 - svelte-hmr@0.16.0(svelte@5.0.0-next.155): + svelte-hmr@0.16.0(svelte@5.0.0-next.143): dependencies: - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 - svelte-preprocess@5.1.4(postcss-load-config@5.1.0(postcss@8.4.38))(postcss@8.4.38)(svelte@5.0.0-next.155)(typescript@5.4.5): + svelte-preprocess@5.1.4(postcss-load-config@5.1.0(jiti@1.21.0)(postcss@8.4.38))(postcss@8.4.38)(svelte@5.0.0-next.143)(typescript@5.4.5): dependencies: '@types/pug': 2.0.10 detect-indent: 6.1.0 magic-string: 0.30.10 sorcery: 0.11.0 strip-indent: 3.0.0 - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 optionalDependencies: postcss: 8.4.38 postcss-load-config: 5.1.0(jiti@1.21.0)(postcss@8.4.38) typescript: 5.4.5 - svelte-toolbelt@0.0.2(svelte@5.0.0-next.155): + svelte-toolbelt@0.0.2(svelte@5.0.0-next.143): dependencies: - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 - svelte2tsx@0.7.9(svelte@5.0.0-next.155)(typescript@5.4.5): + svelte2tsx@0.7.9(svelte@5.0.0-next.143)(typescript@5.4.5): dependencies: dedent-js: 1.0.1 pascal-case: 3.1.2 - svelte: 5.0.0-next.155 + svelte: 5.0.0-next.143 typescript: 5.4.5 - svelte@5.0.0-next.155: + svelte@5.0.0-next.143: dependencies: '@ampproject/remapping': 2.3.0 '@jridgewell/sourcemap-codec': 1.4.15 diff --git a/sites/docs/package.json b/sites/docs/package.json index b5e5c9a62..b95c165ef 100644 --- a/sites/docs/package.json +++ b/sites/docs/package.json @@ -39,7 +39,7 @@ "rehype-slug": "^6.0.0", "remark-gfm": "^4.0.0", "shiki": "^1.1.1", - "svelte": "5.0.0-next.155", + "svelte": "5.0.0-next.143", "svelte-check": "^3.6.9", "tailwind-merge": "^2.2.1", "tailwind-variants": "^0.1.20",