@upstash/react-redis-browser 0.0.0 → 0.1.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/index.css +542 -514
  2. package/dist/index.js +25 -14
  3. package/dist/index.mjs +25 -14
  4. package/package.json +1 -82
package/dist/index.js CHANGED
@@ -3571,6 +3571,17 @@ var _reactcontextmenu = require('@radix-ui/react-context-menu'); var ContextMenu
3571
3571
 
3572
3572
 
3573
3573
 
3574
+ // src/lib/portal-root.ts
3575
+ var root;
3576
+ if (typeof document !== "undefined") {
3577
+ root = document.createElement("div");
3578
+ root.classList.add("ups-db");
3579
+ document.body.append(root);
3580
+ }
3581
+ var portalRoot = root;
3582
+
3583
+ // src/components/ui/context-menu.tsx
3584
+
3574
3585
  var ContextMenu = ContextMenuPrimitive.Root;
3575
3586
  var ContextMenuTrigger = ContextMenuPrimitive.Trigger;
3576
3587
  var ContextMenuSubTrigger = React4.forwardRef(({ className, inset, children, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
@@ -3595,19 +3606,19 @@ var ContextMenuSubContent = React4.forwardRef(({ className, ...props }, ref) =>
3595
3606
  {
3596
3607
  ref,
3597
3608
  className: cn(
3598
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 bg-white p-1 text-neutral-950 shadow-lg dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
3609
+ "z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 bg-white p-1 text-neutral-950 shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
3599
3610
  className
3600
3611
  ),
3601
3612
  ...props
3602
3613
  }
3603
3614
  ));
3604
3615
  ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
3605
- var ContextMenuContent = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ContextMenuPrimitive.Portal, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
3616
+ var ContextMenuContent = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, ContextMenuPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
3606
3617
  ContextMenuPrimitive.Content,
3607
3618
  {
3608
3619
  ref,
3609
3620
  className: cn(
3610
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 bg-white p-1 text-neutral-950 shadow-md dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
3621
+ "z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 bg-white p-1 text-neutral-950 shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
3611
3622
  className
3612
3623
  ),
3613
3624
  ...props
@@ -3702,13 +3713,13 @@ var _reactalertdialog = require('@radix-ui/react-alert-dialog'); var AlertDialog
3702
3713
 
3703
3714
  var AlertDialog = AlertDialogPrimitive.Root;
3704
3715
  var AlertDialogTrigger = AlertDialogPrimitive.Trigger;
3705
- var AlertDialogPortal = ({ ...props }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AlertDialogPrimitive.Portal, { ...props });
3716
+ var AlertDialogPortal = ({ ...props }) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, AlertDialogPrimitive.Portal, { container: portalRoot, ...props });
3706
3717
  AlertDialogPortal.displayName = AlertDialogPrimitive.Portal.displayName;
3707
3718
  var AlertDialogOverlay = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
3708
3719
  AlertDialogPrimitive.Overlay,
3709
3720
  {
3710
3721
  className: cn(
3711
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-white/80 backdrop-blur-sm dark:bg-zinc-950/80",
3722
+ "fixed inset-0 z-50 bg-white/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 dark:bg-zinc-950/80",
3712
3723
  className
3713
3724
  ),
3714
3725
  ...props,
@@ -3723,7 +3734,7 @@ var AlertDialogContent = React5.forwardRef(({ className, ...props }, ref) => /*
3723
3734
  {
3724
3735
  ref,
3725
3736
  className: cn(
3726
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 antialiased data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-zinc-200 bg-white p-6 shadow-lg duration-200 sm:rounded-lg md:w-full dark:border-zinc-800 dark:bg-zinc-950",
3737
+ "antialiased data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-zinc-200 bg-white p-6 shadow-lg duration-200 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] dark:border-zinc-800 dark:bg-zinc-950 sm:rounded-lg md:w-full",
3727
3738
  className
3728
3739
  ),
3729
3740
  ...props
@@ -4072,7 +4083,7 @@ var _reactpopover = require('@radix-ui/react-popover'); var PopoverPrimitive = _
4072
4083
 
4073
4084
  var Popover = PopoverPrimitive.Root;
4074
4085
  var PopoverTrigger = PopoverPrimitive.Trigger;
4075
- var PopoverContent = React8.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PopoverPrimitive.Portal, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
4086
+ var PopoverContent = React8.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, PopoverPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
4076
4087
  PopoverPrimitive.Content,
4077
4088
  {
4078
4089
  ref,
@@ -4130,12 +4141,12 @@ var SelectTrigger = React9.forwardRef(({ className, children, ...props }, ref) =
4130
4141
  }
4131
4142
  ));
4132
4143
  SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
4133
- var SelectContent = React9.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectPrimitive.Portal, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
4144
+ var SelectContent = React9.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, SelectPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
4134
4145
  SelectPrimitive.Content,
4135
4146
  {
4136
4147
  ref,
4137
4148
  className: cn(
4138
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 min-w-[8rem] overflow-hidden rounded-md border border-zinc-200 bg-white text-zinc-950 shadow-md dark:border-zinc-800 dark:bg-zinc-950 dark:text-neutral-50",
4149
+ "relative z-50 min-w-[8rem] overflow-hidden rounded-md border border-zinc-200 bg-white text-zinc-950 shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-zinc-800 dark:bg-zinc-950 dark:text-neutral-50",
4139
4150
  position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
4140
4151
  className
4141
4152
  ),
@@ -4418,14 +4429,14 @@ var DropdownMenuSubContent = React10.forwardRef(({ className, ...props }, ref) =
4418
4429
  {
4419
4430
  ref,
4420
4431
  className: cn(
4421
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 bg-white p-1 text-neutral-950 shadow-lg dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
4432
+ "z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 bg-white p-1 text-neutral-950 shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
4422
4433
  className
4423
4434
  ),
4424
4435
  ...props
4425
4436
  }
4426
4437
  ));
4427
4438
  DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
4428
- var DropdownMenuContent = React10.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
4439
+ var DropdownMenuContent = React10.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DropdownMenuPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
4429
4440
  DropdownMenuPrimitive.Content,
4430
4441
  {
4431
4442
  ref,
@@ -5059,7 +5070,7 @@ var _reactdialog = require('@radix-ui/react-dialog'); var DialogPrimitive = _int
5059
5070
 
5060
5071
  var Dialog = DialogPrimitive.Root;
5061
5072
  var DialogTrigger = DialogPrimitive.Trigger;
5062
- var DialogPortal = (props) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogPrimitive.Portal, { ...props });
5073
+ var DialogPortal = (props) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DialogPrimitive.Portal, { container: portalRoot, ...props });
5063
5074
  DialogPortal.displayName = DialogPrimitive.Portal.displayName;
5064
5075
  var DialogOverlay = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ _jsxruntime.jsx.call(void 0,
5065
5076
  DialogPrimitive.Overlay,
@@ -5432,7 +5443,7 @@ function Sidebar() {
5432
5443
  var RedisBrowser = ({ token, url }) => {
5433
5444
  const credentials = _react.useMemo.call(void 0, () => ({ token, url }), [token, url]);
5434
5445
  return /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactquery.QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reacttooltip.TooltipProvider, { children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DatabrowserProvider, { redisCredentials: credentials, children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0, KeysProvider, { children: [
5435
- /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
5446
+ /* @__PURE__ */ _jsxruntime.jsx.call(void 0, "div", { className: "ups-db", children: /* @__PURE__ */ _jsxruntime.jsxs.call(void 0,
5436
5447
  _reactresizablepanels.PanelGroup,
5437
5448
  {
5438
5449
  autoSaveId: "persistence",
@@ -5451,7 +5462,7 @@ var RedisBrowser = ({ token, url }) => {
5451
5462
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, _reactresizablepanels.Panel, { minSize: 40, children: /* @__PURE__ */ _jsxruntime.jsx.call(void 0, DataDisplay, {}) })
5452
5463
  ]
5453
5464
  }
5454
- ),
5465
+ ) }),
5455
5466
  /* @__PURE__ */ _jsxruntime.jsx.call(void 0, Toaster, {})
5456
5467
  ] }) }) }) });
5457
5468
  };
package/dist/index.mjs CHANGED
@@ -3570,6 +3570,17 @@ import { ContextMenuSeparator as ContextMenuSeparator2 } from "@radix-ui/react-c
3570
3570
  import * as React4 from "react";
3571
3571
  import * as ContextMenuPrimitive from "@radix-ui/react-context-menu";
3572
3572
  import { CheckIcon, ChevronRightIcon, DotFilledIcon } from "@radix-ui/react-icons";
3573
+
3574
+ // src/lib/portal-root.ts
3575
+ var root;
3576
+ if (typeof document !== "undefined") {
3577
+ root = document.createElement("div");
3578
+ root.classList.add("ups-db");
3579
+ document.body.append(root);
3580
+ }
3581
+ var portalRoot = root;
3582
+
3583
+ // src/components/ui/context-menu.tsx
3573
3584
  import { jsx as jsx8, jsxs as jsxs3 } from "react/jsx-runtime";
3574
3585
  var ContextMenu = ContextMenuPrimitive.Root;
3575
3586
  var ContextMenuTrigger = ContextMenuPrimitive.Trigger;
@@ -3595,19 +3606,19 @@ var ContextMenuSubContent = React4.forwardRef(({ className, ...props }, ref) =>
3595
3606
  {
3596
3607
  ref,
3597
3608
  className: cn(
3598
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 bg-white p-1 text-neutral-950 shadow-lg dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
3609
+ "z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 bg-white p-1 text-neutral-950 shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
3599
3610
  className
3600
3611
  ),
3601
3612
  ...props
3602
3613
  }
3603
3614
  ));
3604
3615
  ContextMenuSubContent.displayName = ContextMenuPrimitive.SubContent.displayName;
3605
- var ContextMenuContent = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8(ContextMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx8(
3616
+ var ContextMenuContent = React4.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx8(ContextMenuPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ jsx8(
3606
3617
  ContextMenuPrimitive.Content,
3607
3618
  {
3608
3619
  ref,
3609
3620
  className: cn(
3610
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 bg-white p-1 text-neutral-950 shadow-md dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
3621
+ "z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 bg-white p-1 text-neutral-950 shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
3611
3622
  className
3612
3623
  ),
3613
3624
  ...props
@@ -3702,13 +3713,13 @@ import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog";
3702
3713
  import { jsx as jsx9, jsxs as jsxs4 } from "react/jsx-runtime";
3703
3714
  var AlertDialog = AlertDialogPrimitive.Root;
3704
3715
  var AlertDialogTrigger = AlertDialogPrimitive.Trigger;
3705
- var AlertDialogPortal = ({ ...props }) => /* @__PURE__ */ jsx9(AlertDialogPrimitive.Portal, { ...props });
3716
+ var AlertDialogPortal = ({ ...props }) => /* @__PURE__ */ jsx9(AlertDialogPrimitive.Portal, { container: portalRoot, ...props });
3706
3717
  AlertDialogPortal.displayName = AlertDialogPrimitive.Portal.displayName;
3707
3718
  var AlertDialogOverlay = React5.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx9(
3708
3719
  AlertDialogPrimitive.Overlay,
3709
3720
  {
3710
3721
  className: cn(
3711
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-white/80 backdrop-blur-sm dark:bg-zinc-950/80",
3722
+ "fixed inset-0 z-50 bg-white/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 dark:bg-zinc-950/80",
3712
3723
  className
3713
3724
  ),
3714
3725
  ...props,
@@ -3723,7 +3734,7 @@ var AlertDialogContent = React5.forwardRef(({ className, ...props }, ref) => /*
3723
3734
  {
3724
3735
  ref,
3725
3736
  className: cn(
3726
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 antialiased data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-zinc-200 bg-white p-6 shadow-lg duration-200 sm:rounded-lg md:w-full dark:border-zinc-800 dark:bg-zinc-950",
3737
+ "antialiased data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border border-zinc-200 bg-white p-6 shadow-lg duration-200 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] dark:border-zinc-800 dark:bg-zinc-950 sm:rounded-lg md:w-full",
3727
3738
  className
3728
3739
  ),
3729
3740
  ...props
@@ -4072,7 +4083,7 @@ import * as PopoverPrimitive from "@radix-ui/react-popover";
4072
4083
  import { jsx as jsx16 } from "react/jsx-runtime";
4073
4084
  var Popover = PopoverPrimitive.Root;
4074
4085
  var PopoverTrigger = PopoverPrimitive.Trigger;
4075
- var PopoverContent = React8.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx16(PopoverPrimitive.Portal, { children: /* @__PURE__ */ jsx16(
4086
+ var PopoverContent = React8.forwardRef(({ className, align = "center", sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx16(PopoverPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ jsx16(
4076
4087
  PopoverPrimitive.Content,
4077
4088
  {
4078
4089
  ref,
@@ -4130,12 +4141,12 @@ var SelectTrigger = React9.forwardRef(({ className, children, ...props }, ref) =
4130
4141
  }
4131
4142
  ));
4132
4143
  SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
4133
- var SelectContent = React9.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx17(SelectPrimitive.Portal, { children: /* @__PURE__ */ jsx17(
4144
+ var SelectContent = React9.forwardRef(({ className, children, position = "popper", ...props }, ref) => /* @__PURE__ */ jsx17(SelectPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ jsx17(
4134
4145
  SelectPrimitive.Content,
4135
4146
  {
4136
4147
  ref,
4137
4148
  className: cn(
4138
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 relative z-50 min-w-[8rem] overflow-hidden rounded-md border border-zinc-200 bg-white text-zinc-950 shadow-md dark:border-zinc-800 dark:bg-zinc-950 dark:text-neutral-50",
4149
+ "relative z-50 min-w-[8rem] overflow-hidden rounded-md border border-zinc-200 bg-white text-zinc-950 shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-zinc-800 dark:bg-zinc-950 dark:text-neutral-50",
4139
4150
  position === "popper" && "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
4140
4151
  className
4141
4152
  ),
@@ -4418,14 +4429,14 @@ var DropdownMenuSubContent = React10.forwardRef(({ className, ...props }, ref) =
4418
4429
  {
4419
4430
  ref,
4420
4431
  className: cn(
4421
- "data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 bg-white p-1 text-neutral-950 shadow-lg dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
4432
+ "z-50 min-w-[8rem] overflow-hidden rounded-md border border-neutral-200 bg-white p-1 text-neutral-950 shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2 dark:border-neutral-800 dark:bg-neutral-950 dark:text-neutral-50",
4422
4433
  className
4423
4434
  ),
4424
4435
  ...props
4425
4436
  }
4426
4437
  ));
4427
4438
  DropdownMenuSubContent.displayName = DropdownMenuPrimitive.SubContent.displayName;
4428
- var DropdownMenuContent = React10.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx21(DropdownMenuPrimitive.Portal, { children: /* @__PURE__ */ jsx21(
4439
+ var DropdownMenuContent = React10.forwardRef(({ className, sideOffset = 4, ...props }, ref) => /* @__PURE__ */ jsx21(DropdownMenuPrimitive.Portal, { container: portalRoot, children: /* @__PURE__ */ jsx21(
4429
4440
  DropdownMenuPrimitive.Content,
4430
4441
  {
4431
4442
  ref,
@@ -5059,7 +5070,7 @@ import * as DialogPrimitive from "@radix-ui/react-dialog";
5059
5070
  import { jsx as jsx33, jsxs as jsxs22 } from "react/jsx-runtime";
5060
5071
  var Dialog = DialogPrimitive.Root;
5061
5072
  var DialogTrigger = DialogPrimitive.Trigger;
5062
- var DialogPortal = (props) => /* @__PURE__ */ jsx33(DialogPrimitive.Portal, { ...props });
5073
+ var DialogPortal = (props) => /* @__PURE__ */ jsx33(DialogPrimitive.Portal, { container: portalRoot, ...props });
5063
5074
  DialogPortal.displayName = DialogPrimitive.Portal.displayName;
5064
5075
  var DialogOverlay = React12.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx33(
5065
5076
  DialogPrimitive.Overlay,
@@ -5432,7 +5443,7 @@ import { jsx as jsx42, jsxs as jsxs31 } from "react/jsx-runtime";
5432
5443
  var RedisBrowser = ({ token, url }) => {
5433
5444
  const credentials = useMemo6(() => ({ token, url }), [token, url]);
5434
5445
  return /* @__PURE__ */ jsx42(QueryClientProvider, { client: queryClient, children: /* @__PURE__ */ jsx42(TooltipProvider, { children: /* @__PURE__ */ jsx42(DatabrowserProvider, { redisCredentials: credentials, children: /* @__PURE__ */ jsxs31(KeysProvider, { children: [
5435
- /* @__PURE__ */ jsxs31(
5446
+ /* @__PURE__ */ jsx42("div", { className: "ups-db", children: /* @__PURE__ */ jsxs31(
5436
5447
  PanelGroup,
5437
5448
  {
5438
5449
  autoSaveId: "persistence",
@@ -5451,7 +5462,7 @@ var RedisBrowser = ({ token, url }) => {
5451
5462
  /* @__PURE__ */ jsx42(Panel, { minSize: 40, children: /* @__PURE__ */ jsx42(DataDisplay, {}) })
5452
5463
  ]
5453
5464
  }
5454
- ),
5465
+ ) }),
5455
5466
  /* @__PURE__ */ jsx42(Toaster, {})
5456
5467
  ] }) }) }) });
5457
5468
  };
package/package.json CHANGED
@@ -1,82 +1 @@
1
- {
2
- "name": "@upstash/react-redis-browser",
3
- "version": "0.0.0",
4
- "main": "./dist/index.js",
5
- "types": "./dist/index.d.ts",
6
- "license": "MIT",
7
- "private": false,
8
- "publishConfig": {
9
- "access": "public"
10
- },
11
- "bugs": {
12
- "url": "https://github.com/upstash/react-redis-browser/issues"
13
- },
14
- "homepage": "https://github.com/upstash/react-redis-browser",
15
- "files": [
16
- "./dist/**"
17
- ],
18
- "scripts": {
19
- "build": "tsup",
20
- "dev": "vite",
21
- "lint": "tsc && eslint",
22
- "fmt": "prettier --write ."
23
- },
24
- "lint-staged": {
25
- "**/*.{js,ts,tsx}": [
26
- "prettier --write",
27
- "eslint --fix"
28
- ]
29
- },
30
- "dependencies": {
31
- "@ianvs/prettier-plugin-sort-imports": "^4.4.0",
32
- "@monaco-editor/react": "^4.6.0",
33
- "@radix-ui/react-alert-dialog": "^1.0.5",
34
- "@radix-ui/react-context-menu": "^2.2.2",
35
- "@radix-ui/react-dialog": "^1.0.5",
36
- "@radix-ui/react-dropdown-menu": "^2.1.2",
37
- "@radix-ui/react-icons": "1.3.0",
38
- "@radix-ui/react-popover": "^1.0.7",
39
- "@radix-ui/react-scroll-area": "^1.0.3",
40
- "@radix-ui/react-select": "^2.0.0",
41
- "@radix-ui/react-slot": "^1.0.2",
42
- "@radix-ui/react-toast": "^1.1.5",
43
- "@radix-ui/react-tooltip": "^1.0.7",
44
- "@tabler/icons-react": "^3.19.0",
45
- "@tanstack/react-query": "^5.32.0",
46
- "@types/bytes": "^3.1.4",
47
- "@upstash/redis": "^1.31.6",
48
- "bytes": "^3.1.2",
49
- "react-hook-form": "^7.53.0",
50
- "react-resizable-panels": "^2.1.4",
51
- "zustand": "5.0.0"
52
- },
53
- "devDependencies": {
54
- "@types/node": "^22.8.4",
55
- "@types/react": "^18.3.12",
56
- "@types/react-dom": "^18.3.1",
57
- "@typescript-eslint/eslint-plugin": "8.4.0",
58
- "@typescript-eslint/parser": "8.4.0",
59
- "@vitejs/plugin-react": "^4.1.0",
60
- "autoprefixer": "^10.4.14",
61
- "class-variance-authority": "^0.7.0",
62
- "clsx": "^2.0.0",
63
- "eslint": "9.10.0",
64
- "eslint-plugin-unicorn": "55.0.0",
65
- "postcss": "^8.4.31",
66
- "prettier": "^3.0.3",
67
- "prettier-plugin-tailwindcss": "^0.5.5",
68
- "react": "^18.3.1",
69
- "react-dom": "^18.3.1",
70
- "tailwind-merge": "^2.5.4",
71
- "tailwindcss": "^3.4.14",
72
- "tailwindcss-animate": "^1.0.7",
73
- "tsup": "^8.3.5",
74
- "typescript": "^5.0.4",
75
- "vite": "^5.4.10",
76
- "vite-tsconfig-paths": "^5.0.1"
77
- },
78
- "peerDependencies": {
79
- "react": "^18.2.0 || ^19",
80
- "react-dom": "^18.2.0 || ^19"
81
- }
82
- }
1
+ { "name": "@upstash/react-redis-browser", "version": "v0.1.1", "main": "./dist/index.js", "types": "./dist/index.d.ts", "license": "MIT", "private": false, "publishConfig": { "access": "public" }, "bugs": { "url": "https://github.com/upstash/react-redis-browser/issues" }, "homepage": "https://github.com/upstash/react-redis-browser", "files": [ "./dist/**" ], "scripts": { "build": "tsup", "dev": "vite", "lint": "tsc && eslint", "fmt": "prettier --write ." }, "lint-staged": { "**/*.{js,ts,tsx}": [ "prettier --write", "eslint --fix" ] }, "dependencies": { "@ianvs/prettier-plugin-sort-imports": "^4.4.0", "@monaco-editor/react": "^4.6.0", "@radix-ui/react-alert-dialog": "^1.0.5", "@radix-ui/react-context-menu": "^2.2.2", "@radix-ui/react-dialog": "^1.0.5", "@radix-ui/react-dropdown-menu": "^2.1.2", "@radix-ui/react-icons": "1.3.0", "@radix-ui/react-popover": "^1.0.7", "@radix-ui/react-scroll-area": "^1.0.3", "@radix-ui/react-select": "^2.0.0", "@radix-ui/react-slot": "^1.0.2", "@radix-ui/react-toast": "^1.1.5", "@radix-ui/react-tooltip": "^1.0.7", "@tabler/icons-react": "^3.19.0", "@tanstack/react-query": "^5.32.0", "@types/bytes": "^3.1.4", "@upstash/redis": "^1.31.6", "bytes": "^3.1.2", "react-hook-form": "^7.53.0", "react-resizable-panels": "^2.1.4", "zustand": "5.0.0" }, "devDependencies": { "postcss-prefix-selector": "^2.1.0", "@types/node": "^22.8.4", "@types/react": "^18.3.12", "@types/react-dom": "^18.3.1", "@typescript-eslint/eslint-plugin": "8.4.0", "@typescript-eslint/parser": "8.4.0", "@vitejs/plugin-react": "^4.1.0", "autoprefixer": "^10.4.14", "class-variance-authority": "^0.7.0", "clsx": "^2.0.0", "eslint": "9.10.0", "eslint-plugin-unicorn": "55.0.0", "postcss": "^8.4.31", "prettier": "^3.0.3", "prettier-plugin-tailwindcss": "^0.5.5", "react": "^18.3.1", "react-dom": "^18.3.1", "tailwind-merge": "^2.5.4", "tailwindcss": "^3.4.14", "tailwindcss-animate": "^1.0.7", "tsup": "^8.3.5", "typescript": "^5.0.4", "vite": "^5.4.10", "vite-tsconfig-paths": "^5.0.1" }, "peerDependencies": { "react": "^18.2.0 || ^19", "react-dom": "^18.2.0 || ^19" } }