From 8c0ca3ff51f4876ab02c2e726bc97b4c6064d3a8 Mon Sep 17 00:00:00 2001 From: Cory Tyburski Date: Wed, 13 Nov 2024 15:58:28 -0500 Subject: [PATCH 1/9] Add ability control portal for dialogs --- .../default/ui/alert-dialog/alert-dialog-content.svelte | 7 +++++-- .../lib/registry/default/ui/dialog/dialog-content.svelte | 4 +++- .../new-york/ui/alert-dialog/alert-dialog-content.svelte | 7 +++++-- .../lib/registry/new-york/ui/dialog/dialog-content.svelte | 4 +++- 4 files changed, 16 insertions(+), 6 deletions(-) diff --git a/sites/docs/src/lib/registry/default/ui/alert-dialog/alert-dialog-content.svelte b/sites/docs/src/lib/registry/default/ui/alert-dialog/alert-dialog-content.svelte index ad9c080b8..5e1b28e05 100644 --- a/sites/docs/src/lib/registry/default/ui/alert-dialog/alert-dialog-content.svelte +++ b/sites/docs/src/lib/registry/default/ui/alert-dialog/alert-dialog-content.svelte @@ -6,11 +6,14 @@ let { ref = $bindable(null), class: className, + portal, ...restProps - }: WithoutChild = $props(); + }: WithoutChild & { + portal?: boolean; + } = $props(); - + & { + portal?: boolean; children: Snippet; } = $props(); - + = $props(); + }: WithoutChild & { + portal?: boolean; + } = $props(); - + & { + portal?: boolean; children: Snippet; } = $props(); - + Date: Wed, 13 Nov 2024 16:41:07 -0500 Subject: [PATCH 2/9] Add support for popover portal control as well --- .../lib/registry/default/ui/popover/popover-content.svelte | 7 +++++-- .../registry/new-york/ui/popover/popover-content.svelte | 7 +++++-- 2 files changed, 10 insertions(+), 4 deletions(-) diff --git a/sites/docs/src/lib/registry/default/ui/popover/popover-content.svelte b/sites/docs/src/lib/registry/default/ui/popover/popover-content.svelte index a897b3b99..9144a1029 100644 --- a/sites/docs/src/lib/registry/default/ui/popover/popover-content.svelte +++ b/sites/docs/src/lib/registry/default/ui/popover/popover-content.svelte @@ -7,11 +7,14 @@ class: className, sideOffset = 4, align = "center", + portal, ...restProps - }: PopoverPrimitive.ContentProps = $props(); + }: PopoverPrimitive.ContentProps & { + portal?: boolean; + } = $props(); - + - + Date: Wed, 13 Nov 2024 23:09:35 -0500 Subject: [PATCH 3/9] Add support for all portalProps and all floating elements --- .../default/ui/alert-dialog/alert-dialog-content.svelte | 4 ++-- .../lib/registry/default/ui/command/command-dialog.svelte | 4 +++- .../lib/registry/default/ui/dialog/dialog-content.svelte | 4 ++-- .../lib/registry/default/ui/drawer/drawer-content.svelte | 7 +++++-- .../lib/registry/default/ui/popover/popover-content.svelte | 4 ++-- .../lib/registry/default/ui/select/select-content.svelte | 7 +++++-- .../src/lib/registry/default/ui/sheet/sheet-content.svelte | 4 +++- .../new-york/ui/alert-dialog/alert-dialog-content.svelte | 4 ++-- .../lib/registry/new-york/ui/command/command-dialog.svelte | 4 +++- .../lib/registry/new-york/ui/dialog/dialog-content.svelte | 4 ++-- .../lib/registry/new-york/ui/drawer/drawer-content.svelte | 7 +++++-- .../registry/new-york/ui/popover/popover-content.svelte | 4 ++-- .../lib/registry/new-york/ui/select/select-content.svelte | 7 +++++-- .../lib/registry/new-york/ui/sheet/sheet-content.svelte | 4 +++- 14 files changed, 44 insertions(+), 24 deletions(-) diff --git a/sites/docs/src/lib/registry/default/ui/alert-dialog/alert-dialog-content.svelte b/sites/docs/src/lib/registry/default/ui/alert-dialog/alert-dialog-content.svelte index 5e1b28e05..5ee4de701 100644 --- a/sites/docs/src/lib/registry/default/ui/alert-dialog/alert-dialog-content.svelte +++ b/sites/docs/src/lib/registry/default/ui/alert-dialog/alert-dialog-content.svelte @@ -9,11 +9,11 @@ portal, ...restProps }: WithoutChild & { - portal?: boolean; + portal?: AlertDialogPrimitive.PortalProps; } = $props(); - + & WithoutChildrenOrChild & { + portal?: DialogPrimitive.PortalProps; children: Snippet; } = $props(); - + & { - portal?: boolean; + portal?: DialogPrimitive.PortalProps; children: Snippet; } = $props(); - + - + - + = $props(); + }: WithoutChild & { + portal?: SelectPrimitive.PortalProps; + } = $props(); - + & { + portal?: SheetPrimitive.PortalProps; side?: Side; children: Snippet; } = $props(); - + {@render children?.()} diff --git a/sites/docs/src/lib/registry/new-york/ui/alert-dialog/alert-dialog-content.svelte b/sites/docs/src/lib/registry/new-york/ui/alert-dialog/alert-dialog-content.svelte index 5e1b28e05..5ee4de701 100644 --- a/sites/docs/src/lib/registry/new-york/ui/alert-dialog/alert-dialog-content.svelte +++ b/sites/docs/src/lib/registry/new-york/ui/alert-dialog/alert-dialog-content.svelte @@ -9,11 +9,11 @@ portal, ...restProps }: WithoutChild & { - portal?: boolean; + portal?: AlertDialogPrimitive.PortalProps; } = $props(); - + & WithoutChildrenOrChild & { + portal?: DialogPrimitive.PortalProps; children: Snippet; } = $props(); - + & { - portal?: boolean; + portal?: DialogPrimitive.PortalProps; children: Snippet; } = $props(); - + - + - + = $props(); + }: WithoutChild & { + portal?: SelectPrimitive.PortalProps; + } = $props(); - + & { + portal?: SheetPrimitive.PortalProps; side?: Side; children: Snippet; } = $props(); - + {@render children?.()} From 52639e8656d58591ae6281a36a9480bc1fa19bfb Mon Sep 17 00:00:00 2001 From: Cory Tyburski Date: Thu, 14 Nov 2024 20:06:05 -0500 Subject: [PATCH 4/9] Rename to portalProps --- .../default/ui/alert-dialog/alert-dialog-content.svelte | 6 +++--- .../lib/registry/default/ui/command/command-dialog.svelte | 4 ++-- .../lib/registry/default/ui/dialog/dialog-content.svelte | 6 +++--- .../lib/registry/default/ui/drawer/drawer-content.svelte | 6 +++--- .../lib/registry/default/ui/popover/popover-content.svelte | 6 +++--- .../lib/registry/default/ui/select/select-content.svelte | 6 +++--- .../src/lib/registry/default/ui/sheet/sheet-content.svelte | 6 +++--- .../new-york/ui/alert-dialog/alert-dialog-content.svelte | 6 +++--- .../lib/registry/new-york/ui/command/command-dialog.svelte | 4 ++-- .../lib/registry/new-york/ui/dialog/dialog-content.svelte | 6 +++--- .../lib/registry/new-york/ui/drawer/drawer-content.svelte | 6 +++--- .../lib/registry/new-york/ui/popover/popover-content.svelte | 6 +++--- .../lib/registry/new-york/ui/select/select-content.svelte | 6 +++--- .../src/lib/registry/new-york/ui/sheet/sheet-content.svelte | 6 +++--- 14 files changed, 40 insertions(+), 40 deletions(-) diff --git a/sites/docs/src/lib/registry/default/ui/alert-dialog/alert-dialog-content.svelte b/sites/docs/src/lib/registry/default/ui/alert-dialog/alert-dialog-content.svelte index 5ee4de701..858b8bc1b 100644 --- a/sites/docs/src/lib/registry/default/ui/alert-dialog/alert-dialog-content.svelte +++ b/sites/docs/src/lib/registry/default/ui/alert-dialog/alert-dialog-content.svelte @@ -6,14 +6,14 @@ let { ref = $bindable(null), class: className, - portal, + portalProps, ...restProps }: WithoutChild & { - portal?: AlertDialogPrimitive.PortalProps; + portalProps?: AlertDialogPrimitive.PortalProps; } = $props(); - + & WithoutChildrenOrChild & { - portal?: DialogPrimitive.PortalProps; + portalProps?: DialogPrimitive.PortalProps; children: Snippet; } = $props(); diff --git a/sites/docs/src/lib/registry/default/ui/dialog/dialog-content.svelte b/sites/docs/src/lib/registry/default/ui/dialog/dialog-content.svelte index 0af80a966..7e9868c4d 100644 --- a/sites/docs/src/lib/registry/default/ui/dialog/dialog-content.svelte +++ b/sites/docs/src/lib/registry/default/ui/dialog/dialog-content.svelte @@ -8,16 +8,16 @@ let { ref = $bindable(null), class: className, - portal, + portalProps, children, ...restProps }: WithoutChildrenOrChild & { - portal?: DialogPrimitive.PortalProps; + portalProps?: DialogPrimitive.PortalProps; children: Snippet; } = $props(); - + - + - + & { - portal?: SelectPrimitive.PortalProps; + portalProps?: SelectPrimitive.PortalProps; } = $props(); - + & { - portal?: SheetPrimitive.PortalProps; + portalProps?: SheetPrimitive.PortalProps; side?: Side; children: Snippet; } = $props(); - + {@render children?.()} diff --git a/sites/docs/src/lib/registry/new-york/ui/alert-dialog/alert-dialog-content.svelte b/sites/docs/src/lib/registry/new-york/ui/alert-dialog/alert-dialog-content.svelte index 5ee4de701..858b8bc1b 100644 --- a/sites/docs/src/lib/registry/new-york/ui/alert-dialog/alert-dialog-content.svelte +++ b/sites/docs/src/lib/registry/new-york/ui/alert-dialog/alert-dialog-content.svelte @@ -6,14 +6,14 @@ let { ref = $bindable(null), class: className, - portal, + portalProps, ...restProps }: WithoutChild & { - portal?: AlertDialogPrimitive.PortalProps; + portalProps?: AlertDialogPrimitive.PortalProps; } = $props(); - + & WithoutChildrenOrChild & { - portal?: DialogPrimitive.PortalProps; + portalProps?: DialogPrimitive.PortalProps; children: Snippet; } = $props(); diff --git a/sites/docs/src/lib/registry/new-york/ui/dialog/dialog-content.svelte b/sites/docs/src/lib/registry/new-york/ui/dialog/dialog-content.svelte index c4e065968..7d9c113f8 100644 --- a/sites/docs/src/lib/registry/new-york/ui/dialog/dialog-content.svelte +++ b/sites/docs/src/lib/registry/new-york/ui/dialog/dialog-content.svelte @@ -8,16 +8,16 @@ let { ref = $bindable(null), class: className, - portal, + portalProps, children, ...restProps }: WithoutChildrenOrChild & { - portal?: DialogPrimitive.PortalProps; + portalProps?: DialogPrimitive.PortalProps; children: Snippet; } = $props(); - + - + - + & { - portal?: SelectPrimitive.PortalProps; + portalProps?: SelectPrimitive.PortalProps; } = $props(); - + & { - portal?: SheetPrimitive.PortalProps; + portalProps?: SheetPrimitive.PortalProps; side?: Side; children: Snippet; } = $props(); - + {@render children?.()} From 2409a32bdf8452266262aa5135ad19171b65a26d Mon Sep 17 00:00:00 2001 From: Cory Tyburski Date: Thu, 14 Nov 2024 20:10:24 -0500 Subject: [PATCH 5/9] Forgot command --- .../src/lib/registry/default/ui/command/command-dialog.svelte | 2 +- .../src/lib/registry/new-york/ui/command/command-dialog.svelte | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/sites/docs/src/lib/registry/default/ui/command/command-dialog.svelte b/sites/docs/src/lib/registry/default/ui/command/command-dialog.svelte index 141391cd1..e35264c70 100644 --- a/sites/docs/src/lib/registry/default/ui/command/command-dialog.svelte +++ b/sites/docs/src/lib/registry/default/ui/command/command-dialog.svelte @@ -23,7 +23,7 @@ - + - + Date: Fri, 15 Nov 2024 12:43:27 -0500 Subject: [PATCH 6/9] Add portal props to context menu & dropdown menu --- .../context-menu/context-menu-content.svelte | 23 +++++++++------- .../dropdown-menu-content.svelte | 25 ++++++++++------- .../context-menu/context-menu-content.svelte | 23 +++++++++------- .../dropdown-menu-content.svelte | 27 +++++++++++-------- 4 files changed, 59 insertions(+), 39 deletions(-) diff --git a/sites/docs/src/lib/registry/default/ui/context-menu/context-menu-content.svelte b/sites/docs/src/lib/registry/default/ui/context-menu/context-menu-content.svelte index ceef94d89..5316652f0 100644 --- a/sites/docs/src/lib/registry/default/ui/context-menu/context-menu-content.svelte +++ b/sites/docs/src/lib/registry/default/ui/context-menu/context-menu-content.svelte @@ -4,16 +4,21 @@ let { ref = $bindable(null), + portalProps, class: className, ...restProps - }: ContextMenuPrimitive.ContentProps = $props(); + }: ContextMenuPrimitive.ContentProps & { + portalProps?: ContextMenuPrimitive.PortalProps; + } = $props(); - + + + diff --git a/sites/docs/src/lib/registry/default/ui/dropdown-menu/dropdown-menu-content.svelte b/sites/docs/src/lib/registry/default/ui/dropdown-menu/dropdown-menu-content.svelte index 255b1a6e5..fdbaa4710 100644 --- a/sites/docs/src/lib/registry/default/ui/dropdown-menu/dropdown-menu-content.svelte +++ b/sites/docs/src/lib/registry/default/ui/dropdown-menu/dropdown-menu-content.svelte @@ -5,17 +5,22 @@ let { ref = $bindable(null), sideOffset = 4, + portalProps, class: className, ...restProps - }: DropdownMenuPrimitive.ContentProps = $props(); + }: DropdownMenuPrimitive.ContentProps & { + portalProps?: DropdownMenuPrimitive.PortalProps; + } = $props(); - + + + diff --git a/sites/docs/src/lib/registry/new-york/ui/context-menu/context-menu-content.svelte b/sites/docs/src/lib/registry/new-york/ui/context-menu/context-menu-content.svelte index 8110f89ae..eb68a642f 100644 --- a/sites/docs/src/lib/registry/new-york/ui/context-menu/context-menu-content.svelte +++ b/sites/docs/src/lib/registry/new-york/ui/context-menu/context-menu-content.svelte @@ -5,15 +5,20 @@ let { ref = $bindable(null), class: className, + portalProps, ...restProps - }: ContextMenuPrimitive.ContentProps = $props(); + }: ContextMenuPrimitive.ContentProps & { + portalProps?: ContextMenuPrimitive.PortalProps; + } = $props(); - + + + diff --git a/sites/docs/src/lib/registry/new-york/ui/dropdown-menu/dropdown-menu-content.svelte b/sites/docs/src/lib/registry/new-york/ui/dropdown-menu/dropdown-menu-content.svelte index 61957fe1e..00966ff7a 100644 --- a/sites/docs/src/lib/registry/new-york/ui/dropdown-menu/dropdown-menu-content.svelte +++ b/sites/docs/src/lib/registry/new-york/ui/dropdown-menu/dropdown-menu-content.svelte @@ -6,17 +6,22 @@ ref = $bindable(null), class: className, sideOffset = 4, + portalProps, ...restProps - }: DropdownMenuPrimitive.ContentProps = $props(); + }: DropdownMenuPrimitive.ContentProps & { + portalProps?: DropdownMenuPrimitive.PortalProps; + } = $props(); - + + + From 9192a5bccda2ed2b692f1663891f0cd3324b2b7a Mon Sep 17 00:00:00 2001 From: Cory Tyburski Date: Sat, 16 Nov 2024 16:23:02 -0500 Subject: [PATCH 7/9] Add portal to menubar --- .../default/ui/menubar/menubar-content.svelte | 31 +++++++++++-------- .../ui/menubar/menubar-content.svelte | 29 ++++++++++------- 2 files changed, 35 insertions(+), 25 deletions(-) diff --git a/sites/docs/src/lib/registry/default/ui/menubar/menubar-content.svelte b/sites/docs/src/lib/registry/default/ui/menubar/menubar-content.svelte index e88227ff1..7f6311c91 100644 --- a/sites/docs/src/lib/registry/default/ui/menubar/menubar-content.svelte +++ b/sites/docs/src/lib/registry/default/ui/menubar/menubar-content.svelte @@ -9,19 +9,24 @@ alignOffset = -4, align = "start", side = "bottom", + portalProps, ...restProps - }: MenubarPrimitive.ContentProps = $props(); + }: MenubarPrimitive.ContentProps & { + portalProps?: MenubarPrimitive.PortalProps; + } = $props(); - + + + diff --git a/sites/docs/src/lib/registry/new-york/ui/menubar/menubar-content.svelte b/sites/docs/src/lib/registry/new-york/ui/menubar/menubar-content.svelte index f26a8e8f0..a6e3ba190 100644 --- a/sites/docs/src/lib/registry/new-york/ui/menubar/menubar-content.svelte +++ b/sites/docs/src/lib/registry/new-york/ui/menubar/menubar-content.svelte @@ -8,18 +8,23 @@ sideOffset = 8, alignOffset = -4, align = "start", + portalProps, ...restProps - }: MenubarPrimitive.ContentProps = $props(); + }: MenubarPrimitive.ContentProps & { + portalProps?: MenubarPrimitive.PortalProps; + } = $props(); - + + + From 98f2ef16bae44185c82c80f279ebad7fc94daaa0 Mon Sep 17 00:00:00 2001 From: Cory Tyburski Date: Sat, 16 Nov 2024 16:27:09 -0500 Subject: [PATCH 8/9] Add missing `side` prop from new-york menubar registry --- .../src/lib/registry/new-york/ui/menubar/menubar-content.svelte | 2 ++ 1 file changed, 2 insertions(+) diff --git a/sites/docs/src/lib/registry/new-york/ui/menubar/menubar-content.svelte b/sites/docs/src/lib/registry/new-york/ui/menubar/menubar-content.svelte index a6e3ba190..7f6311c91 100644 --- a/sites/docs/src/lib/registry/new-york/ui/menubar/menubar-content.svelte +++ b/sites/docs/src/lib/registry/new-york/ui/menubar/menubar-content.svelte @@ -8,6 +8,7 @@ sideOffset = 8, alignOffset = -4, align = "start", + side = "bottom", portalProps, ...restProps }: MenubarPrimitive.ContentProps & { @@ -21,6 +22,7 @@ {sideOffset} {align} {alignOffset} + {side} class={cn( "bg-popover text-popover-foreground z-50 min-w-[12rem] rounded-md border p-1 shadow-md focus:outline-none", className From 8befc7d78bc295c1d3babff91993dac6b61fd0b7 Mon Sep 17 00:00:00 2001 From: Hunter Johnston Date: Tue, 19 Nov 2024 19:49:47 -0500 Subject: [PATCH 9/9] over the finish line/ --- eslint.config.js | 1 + pnpm-lock.yaml | 10 +++---- sites/docs/package.json | 2 +- .../ui/hover-card/hover-card-content.svelte | 27 +++++++++++-------- .../ui/hover-card/hover-card-content.svelte | 27 +++++++++++-------- 5 files changed, 39 insertions(+), 28 deletions(-) diff --git a/eslint.config.js b/eslint.config.js index f3ff7ffc4..adb6168ca 100644 --- a/eslint.config.js +++ b/eslint.config.js @@ -47,6 +47,7 @@ export default tseslint.config( "sites/docs/.svelte-kit/**/*", ".svelte-kit", "playgrounds/**/*", + "packages/cli/dist/**/*", ], } ); diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index ec16b4e3f..5dbfff8a4 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -172,8 +172,8 @@ importers: specifier: ^10.4.19 version: 10.4.20(postcss@8.4.47) bits-ui: - specifier: 1.0.0-next.49 - version: 1.0.0-next.49(svelte@5.0.4) + specifier: 1.0.0-next.63 + version: 1.0.0-next.63(svelte@5.0.4) clsx: specifier: ^2.1.1 version: 2.1.1 @@ -2299,8 +2299,8 @@ packages: peerDependencies: svelte: ^5.0.0-next.1 - bits-ui@1.0.0-next.49: - resolution: {integrity: sha512-7EoNj7pu9+RVv6MM1kGVvDzH2aA38v07Q+BDSq8yiLIHxZ5dTkDHwoikhtT/+jMU25c0uYvHq44GEQX+027IFw==} + bits-ui@1.0.0-next.63: + resolution: {integrity: sha512-3z4+N+KudMK8AeBzhy/0568zVoEJCUgL4RkElB41BWGjofk68en2TaAfKFhhc/bn4z+uKrs9r1NtybDdsy0bpA==} engines: {node: '>=18', pnpm: '>=8.7.0'} peerDependencies: svelte: ^5.0.0-next.1 @@ -8076,7 +8076,7 @@ snapshots: svelte: 5.0.4 svelte-toolbelt: 0.4.4(svelte@5.0.4) - bits-ui@1.0.0-next.49(svelte@5.0.4): + bits-ui@1.0.0-next.63(svelte@5.0.4): dependencies: '@floating-ui/core': 1.6.4 '@floating-ui/dom': 1.6.7 diff --git a/sites/docs/package.json b/sites/docs/package.json index 935165d0c..8d11d5f1e 100644 --- a/sites/docs/package.json +++ b/sites/docs/package.json @@ -43,7 +43,7 @@ "acorn": "^8.13.0", "acorn-typescript": "^1.4.13", "autoprefixer": "^10.4.19", - "bits-ui": "1.0.0-next.49", + "bits-ui": "1.0.0-next.63", "clsx": "^2.1.1", "concurrently": "^9.0.1", "d3-scale": "^4.0.2", diff --git a/sites/docs/src/lib/registry/default/ui/hover-card/hover-card-content.svelte b/sites/docs/src/lib/registry/default/ui/hover-card/hover-card-content.svelte index ab1ec9389..99d2a0982 100644 --- a/sites/docs/src/lib/registry/default/ui/hover-card/hover-card-content.svelte +++ b/sites/docs/src/lib/registry/default/ui/hover-card/hover-card-content.svelte @@ -7,17 +7,22 @@ class: className, align = "center", sideOffset = 4, + portalProps, ...restProps - }: HoverCardPrimitive.ContentProps = $props(); + }: HoverCardPrimitive.ContentProps & { + portalProps?: HoverCardPrimitive.PortalProps; + } = $props(); - + + + diff --git a/sites/docs/src/lib/registry/new-york/ui/hover-card/hover-card-content.svelte b/sites/docs/src/lib/registry/new-york/ui/hover-card/hover-card-content.svelte index 6e176851d..1c824539a 100644 --- a/sites/docs/src/lib/registry/new-york/ui/hover-card/hover-card-content.svelte +++ b/sites/docs/src/lib/registry/new-york/ui/hover-card/hover-card-content.svelte @@ -7,17 +7,22 @@ class: className, align = "center", sideOffset = 4, + portalProps, ...restProps - }: HoverCardPrimitive.ContentProps = $props(); + }: HoverCardPrimitive.ContentProps & { + portalProps?: HoverCardPrimitive.PortalProps; + } = $props(); - + + +