From cbcc7a17926dddfbfde6265afaae871ec9e117ff Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 11:25:44 +0200
Subject: [PATCH 01/15] Create some shared components

---
 .../base/src/shared/components/Button.tsx     | 46 ++++++++++++
 .../src/shared/components/ToggleGroup.tsx     | 75 +++++++++++++++++++
 packages/base/src/shared/components/utils.ts  |  5 ++
 packages/base/style/base.css                  |  2 +
 4 files changed, 128 insertions(+)
 create mode 100644 packages/base/src/shared/components/Button.tsx
 create mode 100644 packages/base/src/shared/components/ToggleGroup.tsx
 create mode 100644 packages/base/src/shared/components/utils.ts

diff --git a/packages/base/src/shared/components/Button.tsx b/packages/base/src/shared/components/Button.tsx
new file mode 100644
index 000000000..11e912657
--- /dev/null
+++ b/packages/base/src/shared/components/Button.tsx
@@ -0,0 +1,46 @@
+import { VariantProps, cva } from 'class-variance-authority';
+import * as React from 'react';
+import { cn } from './utils';
+
+const buttonVariants = cva('jgis-button-shared', {
+  variants: {
+    variant: {
+      default: 'bg-primary text-primary-foreground hover:bg-primary/90',
+      destructive:
+        'bg-destructive text-destructive-foreground hover:bg-destructive/90',
+      outline: 'jgis-button-variant-outline',
+      secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',
+      ghost: 'hover:bg-accent hover:text-accent-foreground',
+      link: 'underline-offset-4 hover:underline text-primary',
+      bubble: 'jgis-button-variant-bubble'
+    },
+    size: {
+      default: 'jgis-button-size-default',
+      sm: 'jgis-button-size-sm',
+      lg: 'h-11 px-8 rounded-md'
+    }
+  },
+  defaultVariants: {
+    variant: 'default',
+    size: 'default'
+  }
+});
+
+export interface IButtonProps
+  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
+    VariantProps<typeof buttonVariants> {}
+
+const Button = React.forwardRef<HTMLButtonElement, IButtonProps>(
+  ({ className, variant, size, ...props }, ref) => {
+    return (
+      <button
+        className={cn(buttonVariants({ variant, size, className }))}
+        ref={ref}
+        {...props}
+      />
+    );
+  }
+);
+Button.displayName = 'Button';
+
+export { Button, buttonVariants };
diff --git a/packages/base/src/shared/components/ToggleGroup.tsx b/packages/base/src/shared/components/ToggleGroup.tsx
new file mode 100644
index 000000000..898c08355
--- /dev/null
+++ b/packages/base/src/shared/components/ToggleGroup.tsx
@@ -0,0 +1,75 @@
+import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
+import { cva, type VariantProps } from 'class-variance-authority';
+import * as React from 'react';
+import { cn } from './utils';
+
+const toggleVariants = cva('Toggle', {
+  variants: {
+    variant: {
+      default: 'ToggleDefault',
+      outline: 'ToggleOutline'
+    },
+    size: {
+      default: 'ToggleDefaultSize',
+      sm: 'ToggleSmallSize',
+      lg: 'ToggleLargeSize'
+    }
+  },
+  defaultVariants: {
+    variant: 'default',
+    size: 'default'
+  }
+});
+
+const ToggleGroupContext = React.createContext<
+  VariantProps<typeof toggleVariants>
+>({
+  size: 'default',
+  variant: 'default'
+});
+
+const ToggleGroup = React.forwardRef<
+  React.ElementRef<typeof ToggleGroupPrimitive.Root>,
+  React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Root> &
+    VariantProps<typeof toggleVariants>
+>(({ className, variant, size, children, ...props }, ref) => (
+  <ToggleGroupPrimitive.Root
+    ref={ref}
+    className={cn('ToggleGroupContext', className)}
+    {...props}
+  >
+    <ToggleGroupContext.Provider value={{ variant, size }}>
+      {children}
+    </ToggleGroupContext.Provider>
+  </ToggleGroupPrimitive.Root>
+));
+
+ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName;
+
+const ToggleGroupItem = React.forwardRef<
+  React.ElementRef<typeof ToggleGroupPrimitive.Item>,
+  React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Item> &
+    VariantProps<typeof toggleVariants>
+>(({ className, children, variant, size, ...props }, ref) => {
+  const context = React.useContext(ToggleGroupContext);
+
+  return (
+    <ToggleGroupPrimitive.Item
+      ref={ref}
+      className={cn(
+        toggleVariants({
+          variant: context.variant || variant,
+          size: context.size || size
+        }),
+        className
+      )}
+      {...props}
+    >
+      {children}
+    </ToggleGroupPrimitive.Item>
+  );
+});
+
+ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName;
+
+export { ToggleGroup, ToggleGroupItem };
diff --git a/packages/base/src/shared/components/utils.ts b/packages/base/src/shared/components/utils.ts
new file mode 100644
index 000000000..b4b4fa298
--- /dev/null
+++ b/packages/base/src/shared/components/utils.ts
@@ -0,0 +1,5 @@
+import { type ClassValue, clsx } from 'clsx';
+
+export function cn(...inputs: ClassValue[]) {
+  return clsx(inputs);
+}
diff --git a/packages/base/style/base.css b/packages/base/style/base.css
index 9ab46b86d..1409c0e40 100644
--- a/packages/base/style/base.css
+++ b/packages/base/style/base.css
@@ -11,6 +11,8 @@
 @import url('./statusBar.css');
 @import url('./temporalSlider.css');
 @import url('ol/ol.css');
+@import url('./shared/button.css');
+@import url('./shared/toggle.css');
 
 .jGIS-Toolbar-GroupName {
   font-size: var(--jp-ui-font-size0);

From c2a1b501669a330d1188fe239da2570cf954c2f0 Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 11:29:02 +0200
Subject: [PATCH 02/15] Add tabs; Add CSS

---
 packages/base/src/shared/components/Tabs.tsx | 59 ++++++++++++++
 packages/base/style/base.css                 |  1 +
 packages/base/style/shared/button.css        | 68 ++++++++++++++++
 packages/base/style/shared/tabs.css          | 52 +++++++++++++
 packages/base/style/shared/toggle.css        | 81 ++++++++++++++++++++
 5 files changed, 261 insertions(+)
 create mode 100644 packages/base/src/shared/components/Tabs.tsx
 create mode 100644 packages/base/style/shared/button.css
 create mode 100644 packages/base/style/shared/tabs.css
 create mode 100644 packages/base/style/shared/toggle.css

diff --git a/packages/base/src/shared/components/Tabs.tsx b/packages/base/src/shared/components/Tabs.tsx
new file mode 100644
index 000000000..5222b360f
--- /dev/null
+++ b/packages/base/src/shared/components/Tabs.tsx
@@ -0,0 +1,59 @@
+'use client';
+
+import * as TabsPrimitive from '@radix-ui/react-tabs';
+import * as React from 'react';
+import { cn } from './utils';
+
+function Tabs({
+  className,
+  ...props
+}: React.ComponentProps<typeof TabsPrimitive.Root>) {
+  return (
+    <TabsPrimitive.Root
+      data-slot="tabs"
+      className={cn('TabsList', className)}
+      {...props}
+    />
+  );
+}
+
+function TabsList({
+  className,
+  ...props
+}: React.ComponentProps<typeof TabsPrimitive.List>) {
+  return (
+    <TabsPrimitive.List
+      data-slot="tabs-list"
+      className={cn('TabsList', className)}
+      {...props}
+    />
+  );
+}
+
+function TabsTrigger({
+  className,
+  ...props
+}: React.ComponentProps<typeof TabsPrimitive.Trigger>) {
+  return (
+    <TabsPrimitive.Trigger
+      data-slot="tabs-trigger"
+      className={cn('TabsTrigger', className)}
+      {...props}
+    />
+  );
+}
+
+function TabsContent({
+  className,
+  ...props
+}: React.ComponentProps<typeof TabsPrimitive.Content>) {
+  return (
+    <TabsPrimitive.Content
+      data-slot="tabs-content"
+      className={cn('TabsContent', className)}
+      {...props}
+    />
+  );
+}
+
+export { Tabs, TabsContent, TabsList, TabsTrigger };
diff --git a/packages/base/style/base.css b/packages/base/style/base.css
index 1409c0e40..cc92e5794 100644
--- a/packages/base/style/base.css
+++ b/packages/base/style/base.css
@@ -13,6 +13,7 @@
 @import url('ol/ol.css');
 @import url('./shared/button.css');
 @import url('./shared/toggle.css');
+@import url('./shared/tabs.css');
 
 .jGIS-Toolbar-GroupName {
   font-size: var(--jp-ui-font-size0);
diff --git a/packages/base/style/shared/button.css b/packages/base/style/shared/button.css
new file mode 100644
index 000000000..15364b62c
--- /dev/null
+++ b/packages/base/style/shared/button.css
@@ -0,0 +1,68 @@
+.jgis-button-shared {
+  display: inline-flex; /* inline-flex */
+  align-items: center; /* items-center */
+  color: var(--jp-ui-font-color1);
+  justify-content: center; /* justify-center */
+  border-radius: var(--jp-border-radius); /* rounded-md */
+  font-size: 0.875rem; /* text-sm */
+  line-height: 1.25rem; /* (implied by text-sm) */
+  font-weight: 500; /* font-medium */
+  transition-property: color, background-color; /* transition-colors */
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+
+  /* Focus states */
+  &:focus-visible {
+    outline: none; /* focus-visible:outline-none */
+  }
+
+  /* Disabled states */
+  &:disabled,
+  &[disabled] {
+    opacity: 0.5; /* disabled:opacity-50 */
+    pointer-events: none; /* disabled:pointer-events-none */
+  }
+}
+
+.jgis-button-variant-default {
+}
+
+.jgis-button-variant-destructive {
+}
+
+.jgis-button-variant-outline {
+}
+
+.jgis-button-variant-bubble {
+  border: var(--jp-border-width) solid var(--jp-border-color0); /* border border-input */
+  border-radius: 1rem !important;
+  background-color: transparent;
+
+  &:hover {
+    background-color: var(--jp-layout-color1); /* hover:bg-accent */
+    color: var(--jp-accent-color0); /* hover:text-accent-foreground */
+  }
+}
+
+.jgis-button-variant-secondary {
+}
+
+.jgis-button-variant-ghost {
+}
+
+.jgis-button-variant-link {
+}
+
+.jgis-button-size-default {
+  height: 2.5rem; /* h-10 */
+  padding: 0.5rem 1rem; /* py-2 px-4 (top/bottom first) */
+}
+
+.jgis-button-size-sm {
+  height: 2.25rem;
+  border-radius: 0.375rem;
+  padding: 0 0.75rem;
+}
+
+.jgis-button-size-lg {
+}
diff --git a/packages/base/style/shared/tabs.css b/packages/base/style/shared/tabs.css
new file mode 100644
index 000000000..64a40681b
--- /dev/null
+++ b/packages/base/style/shared/tabs.css
@@ -0,0 +1,52 @@
+.TabsList {
+  display: inline-flex;
+  height: 2.5rem;
+  align-items: center;
+  justify-content: center;
+  border-radius: 0.375rem;
+  background-color: hsl(var(--muted));
+  padding: 0.25rem;
+  color: hsl(var(--muted-foreground));
+}
+
+.TabsTrigger {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  white-space: nowrap;
+  border-radius: 0.25rem;
+  padding: 0.75rem 1rem;
+  font-size: 0.875rem;
+  font-weight: 500;
+  outline: none;
+  transition: all 0.3s ease;
+}
+
+.TabsTrigger:focus-visible {
+  box-shadow:
+    0 0 0 2px hsl(var(--ring)),
+    0 0 0 4px hsl(var(--ring));
+}
+
+.TabsTrigger:disabled {
+  pointer-events: none;
+  opacity: 0.5;
+}
+
+.TabsTrigger[data-state='active'] {
+  background-color: hsl(var(--background));
+  color: hsl(var(--foreground));
+  box-shadow: 0 1px 2px hsl(var(--backround) / 0.1);
+}
+
+.TabsContent {
+  margin-top: 0.5rem;
+  outline: none;
+}
+
+.TabsContent:focus-visible {
+  outline: none;
+  box-shadow:
+    0 0 0 2px hsl(var(--ring)),
+    0 0 0 4px hsl(var(--ring));
+}
diff --git a/packages/base/style/shared/toggle.css b/packages/base/style/shared/toggle.css
new file mode 100644
index 000000000..92cb985c9
--- /dev/null
+++ b/packages/base/style/shared/toggle.css
@@ -0,0 +1,81 @@
+.Toggle {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  border-radius: 0.375rem;
+  font-size: 0.875rem;
+  font-weight: 500;
+  padding: 0.5rem 1rem;
+  transition:
+    color 0.3s,
+    background-color 0.3s;
+  outline: none;
+  color: var(--jp-ui-font-color0);
+  background-color: var(--jp-layout-color0);
+  border: 1px solid transparent;
+}
+
+.Toggle:hover {
+  background-color: var(--jp-ui-font-color0) / 0.1;
+  color: var(--jp-ui-inverse-font-color0);
+}
+
+.Toggle:focus-visible {
+  box-shadow:
+    0 0 0 2px var(--jp-border-color0),
+    0 0 0 4px var(--jp-border-color0);
+}
+
+.Toggle:disabled {
+  pointer-events: none;
+  opacity: 0.5;
+}
+
+.Toggle[data-state='on'] {
+  text-decoration: underline;
+  text-underline-offset: 4px;
+  color: var(--jp-accent-color0);
+}
+
+.ToggleDefault {
+  background-color: transparent;
+}
+
+.ToggleOutline {
+  border: 1px solid var(--jp-border-color0);
+  background-color: transparent;
+  transition:
+    background-color 0.3s,
+    color 0.3s;
+  color: inherit;
+}
+
+.ToggleOutline:hover {
+  background-color: var(--jp-accent-color0);
+  color: var(--jp-ui-font-color0);
+}
+
+.ToggleDefaultSize {
+  height: 2.5rem;
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
+}
+
+.ToggleSmallSize {
+  height: 2.25rem;
+  padding-left: 0.625rem;
+  padding-right: 0.625rem;
+}
+
+.ToggleLargeSize {
+  height: 2.25rem;
+  padding-left: 0.625rem;
+  padding-right: 0.625rem;
+}
+
+.ToggleGroupContext {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  gap: 0.25rem;
+}

From e8d408b2b9f2257c64c653c8d811c9bb9780aead Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 11:30:04 +0200
Subject: [PATCH 03/15] Button CSS

---
 packages/base/src/shared/components/Button.tsx |  7 +++----
 packages/base/style/shared/button.css          | 18 ++++++++++++++++++
 2 files changed, 21 insertions(+), 4 deletions(-)

diff --git a/packages/base/src/shared/components/Button.tsx b/packages/base/src/shared/components/Button.tsx
index 11e912657..18a41f74c 100644
--- a/packages/base/src/shared/components/Button.tsx
+++ b/packages/base/src/shared/components/Button.tsx
@@ -5,11 +5,10 @@ import { cn } from './utils';
 const buttonVariants = cva('jgis-button-shared', {
   variants: {
     variant: {
-      default: 'bg-primary text-primary-foreground hover:bg-primary/90',
-      destructive:
-        'bg-destructive text-destructive-foreground hover:bg-destructive/90',
+      default: 'jgis-button-variant-default',
+      destructive: 'jgis-button-variant-destructive',
       outline: 'jgis-button-variant-outline',
-      secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary/80',
+      secondary: 'jgis-button-variant-secondary',
       ghost: 'hover:bg-accent hover:text-accent-foreground',
       link: 'underline-offset-4 hover:underline text-primary',
       bubble: 'jgis-button-variant-bubble'
diff --git a/packages/base/style/shared/button.css b/packages/base/style/shared/button.css
index 15364b62c..d72059d77 100644
--- a/packages/base/style/shared/button.css
+++ b/packages/base/style/shared/button.css
@@ -25,9 +25,21 @@
 }
 
 .jgis-button-variant-default {
+  background-color: rgb(var(--jp-layout-color1)); /* Solid primary background */
+  color: var(--jp-ui-font-color1); /* Text color */
+
+  &:hover {
+    background-color: rgba(var(--jp-layout-color1), 0.9);
+  }
 }
 
 .jgis-button-variant-destructive {
+  background-color: rgb(var(--destructive));
+  color: var(--destructive-foreground);
+
+  &:hover {
+    background-color: rgba(var(--destructive), 0.9);
+  }
 }
 
 .jgis-button-variant-outline {
@@ -45,6 +57,12 @@
 }
 
 .jgis-button-variant-secondary {
+  background-color: rgb(var(--secondary));
+  color: var(--secondary-foreground);
+
+  &:hover {
+    background-color: rgba(var(--secondary), 0.8);
+  }
 }
 
 .jgis-button-variant-ghost {

From dde662465746228ea4f1dd230e1766a7f95cc765 Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 11:34:57 +0200
Subject: [PATCH 04/15] Use newer button

---
 .../base/src/shared/components/Button.tsx     |  48 ++---
 packages/base/style/shared/button.css         | 169 ++++++++++++------
 2 files changed, 127 insertions(+), 90 deletions(-)

diff --git a/packages/base/src/shared/components/Button.tsx b/packages/base/src/shared/components/Button.tsx
index 18a41f74c..5f31dd039 100644
--- a/packages/base/src/shared/components/Button.tsx
+++ b/packages/base/src/shared/components/Button.tsx
@@ -1,45 +1,27 @@
-import { VariantProps, cva } from 'class-variance-authority';
+import { Slot } from '@radix-ui/react-slot';
 import * as React from 'react';
-import { cn } from './utils';
 
-const buttonVariants = cva('jgis-button-shared', {
-  variants: {
-    variant: {
-      default: 'jgis-button-variant-default',
-      destructive: 'jgis-button-variant-destructive',
-      outline: 'jgis-button-variant-outline',
-      secondary: 'jgis-button-variant-secondary',
-      ghost: 'hover:bg-accent hover:text-accent-foreground',
-      link: 'underline-offset-4 hover:underline text-primary',
-      bubble: 'jgis-button-variant-bubble'
-    },
-    size: {
-      default: 'jgis-button-size-default',
-      sm: 'jgis-button-size-sm',
-      lg: 'h-11 px-8 rounded-md'
-    }
-  },
-  defaultVariants: {
-    variant: 'default',
-    size: 'default'
-  }
-});
-
-export interface IButtonProps
-  extends React.ButtonHTMLAttributes<HTMLButtonElement>,
-    VariantProps<typeof buttonVariants> {}
+interface IButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement> {
+  asChild?: boolean;
+  variant?: 'destructive' | 'outline' | 'secondary' | 'ghost' | 'link' | 'icon';
+  size?: 'sm' | 'lg' | 'icon';
+}
 
 const Button = React.forwardRef<HTMLButtonElement, IButtonProps>(
-  ({ className, variant, size, ...props }, ref) => {
+  ({ variant, className, size, asChild = false, ...props }, ref) => {
+    const Comp = asChild ? Slot : 'button';
     return (
-      <button
-        className={cn(buttonVariants({ variant, size, className }))}
+      <Comp
+        data-size={size}
+        data-variant={variant}
+        className={`Button ${className ? className : ''}`}
         ref={ref}
         {...props}
       />
     );
-  }
+  },
 );
 Button.displayName = 'Button';
 
-export { Button, buttonVariants };
+export { Button };
+export type { IButtonProps as ButtonProps };
diff --git a/packages/base/style/shared/button.css b/packages/base/style/shared/button.css
index d72059d77..e75335fbe 100644
--- a/packages/base/style/shared/button.css
+++ b/packages/base/style/shared/button.css
@@ -1,86 +1,141 @@
-.jgis-button-shared {
-  display: inline-flex; /* inline-flex */
-  align-items: center; /* items-center */
-  color: var(--jp-ui-font-color1);
-  justify-content: center; /* justify-center */
-  border-radius: var(--jp-border-radius); /* rounded-md */
-  font-size: 0.875rem; /* text-sm */
-  line-height: 1.25rem; /* (implied by text-sm) */
-  font-weight: 500; /* font-medium */
-  transition-property: color, background-color; /* transition-colors */
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 150ms;
+.Button {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  white-space: nowrap;
+  border-radius: 0.375rem;
+  font-size: 0.875rem;
+  font-weight: 600;
+  outline: none;
+  background-color: hsl(var(--jp-layout-color0));
+  color: white;
+  border: 0.0375rem solid hsl(var(--jp-border-color0) / 0.8);
+  transition: background-color 0.2s ease;
+  height: 2.5rem;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+  max-width: 20rem;
+}
 
-  /* Focus states */
-  &:focus-visible {
-    outline: none; /* focus-visible:outline-none */
-  }
+.Button:hover {
+  cursor: pointer;
+  background-color: hsl(var(--jp-layout-color2) / 0.8);
+  transition: background-color 0.2s ease;
+}
 
-  /* Disabled states */
-  &:disabled,
-  &[disabled] {
-    opacity: 0.5; /* disabled:opacity-50 */
-    pointer-events: none; /* disabled:pointer-events-none */
-  }
+.Button:focus-visible {
+  outline: none;
+  box-shadow: 0 0 0 3px hsl(var(--jp-ui-font-color0) / 0.5);
 }
 
-.jgis-button-variant-default {
-  background-color: rgb(var(--jp-layout-color1)); /* Solid primary background */
-  color: var(--jp-ui-font-color1); /* Text color */
+.Button:disabled {
+  pointer-events: none;
+  opacity: 0.5;
+}
 
-  &:hover {
-    background-color: rgba(var(--jp-layout-color1), 0.9);
-  }
+.Button:disabled:focus-visible {
+  outline: none;
+  box-shadow: none;
 }
 
-.jgis-button-variant-destructive {
-  background-color: rgb(var(--destructive));
-  color: var(--destructive-foreground);
+.Button[data-variant='destructive'] {
+  background-color: hsl(var(--destructive));
+  color: hsl(var(--destructive-foreground));
+  transition: background-color 0.2s ease;
+}
 
-  &:hover {
-    background-color: rgba(var(--destructive), 0.9);
-  }
+.Button[data-variant='destructive']:hover {
+  background-color: hsl(var(--destructive) / 0.9);
 }
 
-.jgis-button-variant-outline {
+.Button[data-variant='outline'] {
+  border: 1px solid hsl(var(--jp-border-color0));
+  background-color: hsl(var(--jp-layout-color0));
+  color: hsl(var(--jp-ui-font-color0));
+  transition:
+    background-color 0.2s ease,
+    color 0.2s ease;
 }
 
-.jgis-button-variant-bubble {
-  border: var(--jp-border-width) solid var(--jp-border-color0); /* border border-input */
-  border-radius: 1rem !important;
-  background-color: transparent;
+.Button[data-variant='outline']:hover {
+  cursor: pointer;
+  background-color: hsl(var(--jp-ui-font-color0) / 0.05);
+  color: hsl(var(--jp-ui-font-color2));
+}
 
-  &:hover {
-    background-color: var(--jp-layout-color1); /* hover:bg-accent */
-    color: var(--jp-accent-color0); /* hover:text-accent-foreground */
-  }
+.Button[data-variant='secondary'] {
+  background-color: hsl(var(--jp-layout-color2));
+  color: hsl(var(--jp-ui-font-color2));
+  transition: background-color 0.2s ease;
 }
 
-.jgis-button-variant-secondary {
-  background-color: rgb(var(--secondary));
-  color: var(--secondary-foreground);
+.Button[data-variant='secondary']:hover {
+  background-color: hsl(var(--jp-layout-color2) / 0.9);
+}
 
-  &:hover {
-    background-color: rgba(var(--secondary), 0.8);
-  }
+.Button[data-variant='ghost'] {
+  background-color: transparent;
+  border: 1px solid transparent;
+  color: hsl(var(--jp-ui-font-color0));
+  display: flex;
+  align-items: center;
 }
 
-.jgis-button-variant-ghost {
+.Button[data-variant='ghost']:hover {
+  background-color: hsl(var(--jp-ui-font-color0) / 0.1);
 }
 
-.jgis-button-variant-link {
+.Button[data-variant='link'] {
+  color: hsl(var(--jp-ui-font-color0));
+  background-color: transparent;
+  text-decoration: none;
+  transition: text-decoration 0.2s ease;
+  border: none;
+  padding: 0;
+  height: max-content;
+  width: max-content;
+}
+
+.Button[data-variant='link']:hover {
+  color: hsl(var(--jp-layout-color0));
+  text-decoration-color: hsl(var(--jp-ui-font-color0));
+}
+
+.Button[data-variant='icon'] {
+  background-color: hsl(var(--jp-ui-font-color0));
+  border: none;
+  color: hsl(var(--jp-layout-color0));
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 2rem;
+  width: 2rem;
+  padding: 0;
+  border-radius: 9999px;
 }
 
-.jgis-button-size-default {
-  height: 2.5rem; /* h-10 */
-  padding: 0.5rem 1rem; /* py-2 px-4 (top/bottom first) */
+.Button[data-variant='icon']:hover {
+  background-color: hsl(var(--jp-accent-color0) / 0.8);
 }
 
-.jgis-button-size-sm {
+/* sizing */
+.Button[data-size='sm'] {
   height: 2.25rem;
   border-radius: 0.375rem;
-  padding: 0 0.75rem;
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
+}
+
+.Button[data-size='lg'] {
+  height: 2.75rem;
+  border-radius: 0.375rem;
+  padding-left: 2rem;
+  padding-right: 2rem;
 }
 
-.jgis-button-size-lg {
+.Button[data-size='icon'] {
+  height: 2.5rem;
+  width: 2.5rem;
 }

From ee0b94c1fed86ec7dddc77b5d77d2b2c21bab1e2 Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 11:36:01 +0200
Subject: [PATCH 05/15] Add components for date picker

---
 package.json                                  |  12 +
 .../base/src/shared/components/Calendar.tsx   |  88 +++
 .../base/src/shared/components/Popover.tsx    |  42 ++
 packages/base/src/shared/components/Tabs.tsx  |   2 -
 packages/base/style/shared/popover.css        |  52 ++
 yarn.lock                                     | 694 +++++++++++++++++-
 6 files changed, 883 insertions(+), 7 deletions(-)
 create mode 100644 packages/base/src/shared/components/Calendar.tsx
 create mode 100644 packages/base/src/shared/components/Popover.tsx
 create mode 100644 packages/base/style/shared/popover.css

diff --git a/package.json b/package.json
index fc9f4116c..1c3c88f12 100644
--- a/package.json
+++ b/package.json
@@ -72,5 +72,17 @@
     "rimraf": "^3.0.2",
     "typescript": "^5",
     "webpack": "^5.76.3"
+  },
+  "dependencies": {
+    "@radix-ui/react-popover": "^1.1.14",
+    "@radix-ui/react-slot": "^1.2.3",
+    "@radix-ui/react-tabs": "^1.1.12",
+    "@radix-ui/react-toggle-group": "^1.1.10",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
+    "date-fns": "^4.1.0",
+    "lucide-react": "^0.513.0",
+    "ol-stac": "^1.0.0-rc.10",
+    "react-day-picker": "8.10.1"
   }
 }
diff --git a/packages/base/src/shared/components/Calendar.tsx b/packages/base/src/shared/components/Calendar.tsx
new file mode 100644
index 000000000..64803ddda
--- /dev/null
+++ b/packages/base/src/shared/components/Calendar.tsx
@@ -0,0 +1,88 @@
+import { ChevronLeft, ChevronRight } from 'lucide-react';
+import * as React from 'react';
+import { DayPicker } from 'react-day-picker';
+import 'react-day-picker/dist/style.css';
+
+export type CalendarProps = React.ComponentProps<typeof DayPicker>;
+
+function Calendar({ showOutsideDays = true, ...props }: CalendarProps) {
+  return (
+    <DayPicker
+      showOutsideDays={showOutsideDays}
+      weekStartsOn={1}
+      components={{
+        IconLeft: ({ ...props }) => <ChevronLeft color="currentColor" />,
+        IconRight: ({ ...props }) => <ChevronRight color="currentColor" />
+      }}
+      modifiersStyles={{
+        selected: {
+          backgroundColor: 'var(--jp-layout-color2)',
+          color: 'var(--jp-ui-font-color0)',
+          borderRadius: '0.275rem'
+        }
+      }}
+      styles={{
+        root: {
+          width: 'max-content',
+          margin: 0,
+          color: 'var(--jp-ui-font-color0)',
+          background: 'var(--jp-layout-color0)',
+          border: '1px solid var(--jp-border-color0)',
+          borderRadius: 'var(--jp-border-radius)',
+          padding: '0.5rem',
+          position: 'relative'
+        },
+        table: {
+          paddingTop: '1rem'
+        },
+        head_cell: {
+          color: 'var(--muted-foreground)',
+          fontSize: '0.8rem',
+          fontWeight: 400
+        },
+        day: {
+          backgroundColor: 'var(--jp-layout-color0)',
+          display: 'flex',
+          justifyContent: 'center',
+          border: 'none',
+          padding: '0.5rem',
+          margin: 'auto',
+          fontSize: '0.8rem'
+        },
+        caption: {
+          display: 'flex',
+          alignItems: 'center',
+          justifyContent: 'center'
+        },
+        nav_button_previous: {
+          color: 'var(--jp-ui-font-color0)',
+          background: 'transparent',
+          border: '0.5px solid var(--jp-border-color0)',
+          position: 'absolute',
+          top: '0.5rem',
+          left: '0.5rem',
+          borderRadius: 'var(--jp-border-radius)',
+          padding: '0.175rem',
+          width: 'max-content',
+          height: 'max-content'
+        },
+        nav_button_next: {
+          color: 'var(--jp-ui-font-color0)',
+          background: 'transparent',
+          border: '0.5px solid var(--jp-border-color0)',
+          position: 'absolute',
+          top: '0.5rem',
+          right: '0.5rem',
+          borderRadius: 'var(--jp-border-radius)',
+          padding: '0.175rem',
+          width: 'max-content',
+          height: 'max-content'
+        }
+      }}
+      {...props}
+    />
+  );
+}
+Calendar.displayName = 'Calendar';
+
+export default Calendar;
diff --git a/packages/base/src/shared/components/Popover.tsx b/packages/base/src/shared/components/Popover.tsx
new file mode 100644
index 000000000..221c82f62
--- /dev/null
+++ b/packages/base/src/shared/components/Popover.tsx
@@ -0,0 +1,42 @@
+import * as PopoverPrimitive from '@radix-ui/react-popover';
+import * as React from 'react';
+import { cn } from './utils';
+
+function Popover({
+  ...props
+}: React.ComponentProps<typeof PopoverPrimitive.Root>) {
+  return <PopoverPrimitive.Root data-slot="popover" {...props} />;
+}
+
+function PopoverTrigger({
+  ...props
+}: React.ComponentProps<typeof PopoverPrimitive.Trigger>) {
+  return <PopoverPrimitive.Trigger data-slot="popover-trigger" {...props} />;
+}
+
+function PopoverContent({
+  className,
+  align = 'center',
+  sideOffset = 4,
+  ...props
+}: React.ComponentProps<typeof PopoverPrimitive.Content>) {
+  return (
+    <PopoverPrimitive.Portal>
+      <PopoverPrimitive.Content
+        data-slot="popover-content"
+        align={align}
+        sideOffset={sideOffset}
+        className={cn('PopoverContent', className)}
+        {...props}
+      />
+    </PopoverPrimitive.Portal>
+  );
+}
+
+function PopoverAnchor({
+  ...props
+}: React.ComponentProps<typeof PopoverPrimitive.Anchor>) {
+  return <PopoverPrimitive.Anchor data-slot="popover-anchor" {...props} />;
+}
+
+export { Popover, PopoverAnchor, PopoverContent, PopoverTrigger };
diff --git a/packages/base/src/shared/components/Tabs.tsx b/packages/base/src/shared/components/Tabs.tsx
index 5222b360f..7b4cf5d39 100644
--- a/packages/base/src/shared/components/Tabs.tsx
+++ b/packages/base/src/shared/components/Tabs.tsx
@@ -1,5 +1,3 @@
-'use client';
-
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 import * as React from 'react';
 import { cn } from './utils';
diff --git a/packages/base/style/shared/popover.css b/packages/base/style/shared/popover.css
new file mode 100644
index 000000000..75995a4c5
--- /dev/null
+++ b/packages/base/style/shared/popover.css
@@ -0,0 +1,52 @@
+@keyframes enter {
+  from {
+    opacity: 0;
+  }
+  to {
+    opacity: 1;
+  }
+}
+
+@keyframes exit {
+  from {
+    opacity: 1;
+  }
+  to {
+    opacity: 0;
+  }
+}
+
+.PopoverContent {
+  position: relative;
+  width: 18rem;
+  border-radius: 0.375rem;
+  border-width: 1px;
+  background-color: hsl(var(--jp-layout-color0));
+  color: hsl(var(--foreground));
+  box-shadow: 0 4px 6px hsl(var(--jp-ui-font-color0) / 0.1);
+  z-index: 50;
+}
+
+.PopoverContent[data-state='open'] {
+  animation: enter 300ms;
+}
+
+.PopoverContent[data-state='closed'] {
+  animation: exit 300ms;
+}
+
+.PopoverContent[data-side='top'] {
+  animation: enter 300ms;
+}
+
+.PopoverContent[data-side='right'] {
+  animation: enter 300ms;
+}
+
+.PopoverContent[data-side='left'] {
+  animation: enter 300ms;
+}
+
+.PopoverContent[data-side='bottom'] {
+  animation: enter 300ms;
+}
diff --git a/yarn.lock b/yarn.lock
index e562f429d..2604665a0 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -514,6 +514,44 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@floating-ui/core@npm:^1.7.1":
+  version: 1.7.1
+  resolution: "@floating-ui/core@npm:1.7.1"
+  dependencies:
+    "@floating-ui/utils": ^0.2.9
+  checksum: dccd6efe7cdc9039ce62e805efd20f4572996e03decf6b1451b4de649b8841c841b68999148003e1b22e2184afc6d8cd22b38c9697f2b2bb9301ba52ebdf7824
+  languageName: node
+  linkType: hard
+
+"@floating-ui/dom@npm:^1.0.0":
+  version: 1.7.1
+  resolution: "@floating-ui/dom@npm:1.7.1"
+  dependencies:
+    "@floating-ui/core": ^1.7.1
+    "@floating-ui/utils": ^0.2.9
+  checksum: 557c96169fb086b52f83819ec9810aaa06fe50a386edd615ad9f484d1bb8d3de2396ded216482b15c0b6164929d39cb94dffdb5102ba5a736b8c50e02a33c250
+  languageName: node
+  linkType: hard
+
+"@floating-ui/react-dom@npm:^2.0.0":
+  version: 2.1.3
+  resolution: "@floating-ui/react-dom@npm:2.1.3"
+  dependencies:
+    "@floating-ui/dom": ^1.0.0
+  peerDependencies:
+    react: ">=16.8.0"
+    react-dom: ">=16.8.0"
+  checksum: 2e2aab5dcc3c8c8ad706580e6d43fbd3b303b3b7fba08c0cf0d4edd5bf1f2fdcc7db6b07321c4d1ff9a607a03da1a742fc12f55224556bbab37ce0fafd0fae5f
+  languageName: node
+  linkType: hard
+
+"@floating-ui/utils@npm:^0.2.9":
+  version: 0.2.9
+  resolution: "@floating-ui/utils@npm:0.2.9"
+  checksum: d518b80cec5a323e54a069a1dd99a20f8221a4853ed98ac16c75275a0cc22f75de4f8ac5b121b4f8990bd45da7ad1fb015b9a1e4bac27bb1cd62444af84e9784
+  languageName: node
+  linkType: hard
+
 "@fortawesome/fontawesome-common-types@npm:6.7.2":
   version: 6.7.2
   resolution: "@fortawesome/fontawesome-common-types@npm:6.7.2"
@@ -915,17 +953,24 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@jupytergis/jupytergis-root@workspace:."
   dependencies:
+    "@radix-ui/react-popover": ^1.1.14
+    "@radix-ui/react-slot": ^1.2.3
+    "@radix-ui/react-tabs": ^1.1.12
+    "@radix-ui/react-toggle-group": ^1.1.10
     "@types/webpack-env": ^1.18.5
     "@typescript-eslint/eslint-plugin": 5.55.0
     "@typescript-eslint/parser": 5.55.0
     copy-webpack-plugin: ^10.0.0
+    date-fns: ^4.1.0
     eslint: ^8.36.0
     eslint-config-prettier: ^8.8.0
     eslint-plugin-import: ^2.31.0
     eslint-plugin-prettier: ^5.0.1
     lerna: ^8.1.9
+    lucide-react: ^0.513.0
     npm-run-all: ^4.1.5
     prettier: ^3.0.0
+    react-day-picker: 8.10.1
     rimraf: ^3.0.2
     typescript: ^5
     webpack: ^5.76.3
@@ -2573,10 +2618,525 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@pkgr/core@npm:^0.2.4":
-  version: 0.2.7
-  resolution: "@pkgr/core@npm:0.2.7"
-  checksum: b16959878940f3d3016b79a4b2c23fd518aaec6b47295baa3154fbcf6574fee644c51023bb69069fa3ea9cdcaca40432818f54695f11acc0ae326cf56676e4d1
+"@pkgr/core@npm:^0.2.3":
+  version: 0.2.4
+  resolution: "@pkgr/core@npm:0.2.4"
+  checksum: 8544f0346c3f7035b9e2fdf60179c68b12d3c76b3fba9533844099af67cf5c0ce5257538f5faa05953d48cc1536d046f003231f321b2f75b3fb449db8410a2b7
+  languageName: node
+  linkType: hard
+
+"@radiantearth/stac-migrate@npm:^2.0.1":
+  version: 2.0.2
+  resolution: "@radiantearth/stac-migrate@npm:2.0.2"
+  dependencies:
+    compare-versions: ^3.6.0
+    multihashes: ^3.1.2
+    yargs: ^17.6.2
+  bin:
+    stac-migrate: bin/cli.js
+  checksum: 136d11a1bf305fe7d86da8c5e4d37dd4c78906052df5f9477f495cbb586c0890a4266316eed06117d080229fd4c3aab9b5537f701b5d1886215f83167026561d
+  languageName: node
+  linkType: hard
+
+"@radix-ui/primitive@npm:1.1.2":
+  version: 1.1.2
+  resolution: "@radix-ui/primitive@npm:1.1.2"
+  checksum: 6cb2ac097faf77b7288bdfd87d92e983e357252d00ee0d2b51ad8e7897bf9f51ec53eafd7dd64c613671a2b02cb8166177bc3de444a6560ec60835c363321c18
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-arrow@npm:1.1.7":
+  version: 1.1.7
+  resolution: "@radix-ui/react-arrow@npm:1.1.7"
+  dependencies:
+    "@radix-ui/react-primitive": 2.1.3
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 6cdf74f06090f8994cdf6d3935a44ea3ac309163a4f59c476482c4907e8e0775f224045030abf10fa4f9e1cb7743db034429249b9e59354988e247eeb0f4fdcf
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-collection@npm:1.1.7":
+  version: 1.1.7
+  resolution: "@radix-ui/react-collection@npm:1.1.7"
+  dependencies:
+    "@radix-ui/react-compose-refs": 1.1.2
+    "@radix-ui/react-context": 1.1.2
+    "@radix-ui/react-primitive": 2.1.3
+    "@radix-ui/react-slot": 1.2.3
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: dd9bb015ef86205b4246f55bc84e5ad54519bb89b4825dd83e646fe95205191fe376bb31a9e847f9d66b710d0ef7fc9353c0b0ded7e8997a5c1f5be6addf94ef
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-compose-refs@npm:1.1.2":
+  version: 1.1.2
+  resolution: "@radix-ui/react-compose-refs@npm:1.1.2"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 9a91f0213014ffa40c5b8aae4debb993be5654217e504e35aa7422887eb2d114486d37e53c482d0fffb00cd44f51b5269fcdf397b280c71666fa11b7f32f165d
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-context@npm:1.1.2":
+  version: 1.1.2
+  resolution: "@radix-ui/react-context@npm:1.1.2"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 6d08437f23df362672259e535ae463e70bf7a0069f09bfa06c983a5a90e15250bde19da1d63ef8e3da06df1e1b4f92afa9d28ca6aa0297bb1c8aaf6ca83d28c5
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-direction@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-direction@npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 8cc330285f1d06829568042ca9aabd3295be4690ae93683033fc8632b5c4dfc60f5c1312f6e2cae27c196189c719de3cfbcf792ff74800f9ccae0ab4abc1bc92
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-dismissable-layer@npm:1.1.10":
+  version: 1.1.10
+  resolution: "@radix-ui/react-dismissable-layer@npm:1.1.10"
+  dependencies:
+    "@radix-ui/primitive": 1.1.2
+    "@radix-ui/react-compose-refs": 1.1.2
+    "@radix-ui/react-primitive": 2.1.3
+    "@radix-ui/react-use-callback-ref": 1.1.1
+    "@radix-ui/react-use-escape-keydown": 1.1.1
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: c4f31e8e93ae979a1bcd60726f8ebe7b79f23baafcd1d1e65f62cff6b322b2c6ff6132d82f2e63737f9955a8f04407849036f5b64b478e9a5678747d835957d8
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-focus-guards@npm:1.1.2":
+  version: 1.1.2
+  resolution: "@radix-ui/react-focus-guards@npm:1.1.2"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 618658e2b98575198b94ccfdd27f41beb37f83721c9a04617e848afbc47461124ae008d703d713b9644771d96d4852e49de322cf4be3b5f10a4f94d200db5248
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-focus-scope@npm:1.1.7":
+  version: 1.1.7
+  resolution: "@radix-ui/react-focus-scope@npm:1.1.7"
+  dependencies:
+    "@radix-ui/react-compose-refs": 1.1.2
+    "@radix-ui/react-primitive": 2.1.3
+    "@radix-ui/react-use-callback-ref": 1.1.1
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: bb642d192d3da8431f8b39f64959b493a7ba743af8501b76699ef93357c96507c11fb76d468824b52b0e024eaee130a641f3a213268ac7c9af34883b45610c9b
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-id@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-id@npm:1.1.1"
+  dependencies:
+    "@radix-ui/react-use-layout-effect": 1.1.1
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 8d68e200778eb3038906870fc869b3d881f4a46715fb20cddd9c76cba42fdaaa4810a3365b6ec2daf0f185b9201fc99d009167f59c7921bc3a139722c2e976db
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-popover@npm:^1.1.14":
+  version: 1.1.14
+  resolution: "@radix-ui/react-popover@npm:1.1.14"
+  dependencies:
+    "@radix-ui/primitive": 1.1.2
+    "@radix-ui/react-compose-refs": 1.1.2
+    "@radix-ui/react-context": 1.1.2
+    "@radix-ui/react-dismissable-layer": 1.1.10
+    "@radix-ui/react-focus-guards": 1.1.2
+    "@radix-ui/react-focus-scope": 1.1.7
+    "@radix-ui/react-id": 1.1.1
+    "@radix-ui/react-popper": 1.2.7
+    "@radix-ui/react-portal": 1.1.9
+    "@radix-ui/react-presence": 1.1.4
+    "@radix-ui/react-primitive": 2.1.3
+    "@radix-ui/react-slot": 1.2.3
+    "@radix-ui/react-use-controllable-state": 1.2.2
+    aria-hidden: ^1.2.4
+    react-remove-scroll: ^2.6.3
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 50f146117ebf675944181ef2df4fbc2d7ca017c71a2ab78eaa67159eb8a0101c682fa02bafa2b132ea7744592b7f103d02935ace2c1f430ab9040a0ece9246c8
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-popper@npm:1.2.7":
+  version: 1.2.7
+  resolution: "@radix-ui/react-popper@npm:1.2.7"
+  dependencies:
+    "@floating-ui/react-dom": ^2.0.0
+    "@radix-ui/react-arrow": 1.1.7
+    "@radix-ui/react-compose-refs": 1.1.2
+    "@radix-ui/react-context": 1.1.2
+    "@radix-ui/react-primitive": 2.1.3
+    "@radix-ui/react-use-callback-ref": 1.1.1
+    "@radix-ui/react-use-layout-effect": 1.1.1
+    "@radix-ui/react-use-rect": 1.1.1
+    "@radix-ui/react-use-size": 1.1.1
+    "@radix-ui/rect": 1.1.1
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 1d672b8b635846501212eb0cd15273c8acdd31e76e78d2b9ba29ce29730d5a2d3a61a8ed49bb689c94f67f45d1dffe0d49449e0810f08c4e112d8aef8430e76d
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-portal@npm:1.1.9":
+  version: 1.1.9
+  resolution: "@radix-ui/react-portal@npm:1.1.9"
+  dependencies:
+    "@radix-ui/react-primitive": 2.1.3
+    "@radix-ui/react-use-layout-effect": 1.1.1
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: bd6be39bf021d5c917e2474ecba411e2625171f7ef96862b9af04bbd68833bb3662a7f1fbdeb5a7a237111b10e811e76d2cd03e957dadd6e668ef16541bfbd68
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-presence@npm:1.1.4":
+  version: 1.1.4
+  resolution: "@radix-ui/react-presence@npm:1.1.4"
+  dependencies:
+    "@radix-ui/react-compose-refs": 1.1.2
+    "@radix-ui/react-use-layout-effect": 1.1.1
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: d3b0976368fccdfa07100c1f07ca434d0092d4132d1ed4a5c213802f7318d77fc1fd61d1b7038b87e82912688fafa97d8af000a6cca4027b09d92c5477f79dd0
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-primitive@npm:2.1.3":
+  version: 2.1.3
+  resolution: "@radix-ui/react-primitive@npm:2.1.3"
+  dependencies:
+    "@radix-ui/react-slot": 1.2.3
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 01f82e4bad76b57767198762c905e5bcea04f4f52129749791e31adfcb1b36f6fdc89c73c40017d812b6e25e4ac925d837214bb280cfeaa5dc383457ce6940b0
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-roving-focus@npm:1.1.10":
+  version: 1.1.10
+  resolution: "@radix-ui/react-roving-focus@npm:1.1.10"
+  dependencies:
+    "@radix-ui/primitive": 1.1.2
+    "@radix-ui/react-collection": 1.1.7
+    "@radix-ui/react-compose-refs": 1.1.2
+    "@radix-ui/react-context": 1.1.2
+    "@radix-ui/react-direction": 1.1.1
+    "@radix-ui/react-id": 1.1.1
+    "@radix-ui/react-primitive": 2.1.3
+    "@radix-ui/react-use-callback-ref": 1.1.1
+    "@radix-ui/react-use-controllable-state": 1.2.2
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 9f6afabc82e3a018cbb48f4fc94ce046f776f894df2d66c96f6b78bf864d59d71f749406e30c4600f6415a6f703c66fdbb87b2841cfa919f10d1f6602df2a5b6
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-slot@npm:1.2.3, @radix-ui/react-slot@npm:^1.2.3":
+  version: 1.2.3
+  resolution: "@radix-ui/react-slot@npm:1.2.3"
+  dependencies:
+    "@radix-ui/react-compose-refs": 1.1.2
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 2731089e15477dd5eef98a5757c36113dd932d0c52ff05123cd89f05f0412e95e5b205229185d1cd705cda4a674a838479cce2b3b46ed903f82f5d23d9e3f3c2
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-tabs@npm:^1.1.12":
+  version: 1.1.12
+  resolution: "@radix-ui/react-tabs@npm:1.1.12"
+  dependencies:
+    "@radix-ui/primitive": 1.1.2
+    "@radix-ui/react-context": 1.1.2
+    "@radix-ui/react-direction": 1.1.1
+    "@radix-ui/react-id": 1.1.1
+    "@radix-ui/react-presence": 1.1.4
+    "@radix-ui/react-primitive": 2.1.3
+    "@radix-ui/react-roving-focus": 1.1.10
+    "@radix-ui/react-use-controllable-state": 1.2.2
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: eb5eecb4813b784c6f324a947b1f391b1b890bc3f5bd0eb2d08e73f84a10b25bbf482a8dd9785de8a6fe49ff99860c07cf0a6953c9f9631202e5d9c8ebc06758
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-toggle-group@npm:^1.1.10":
+  version: 1.1.10
+  resolution: "@radix-ui/react-toggle-group@npm:1.1.10"
+  dependencies:
+    "@radix-ui/primitive": 1.1.2
+    "@radix-ui/react-context": 1.1.2
+    "@radix-ui/react-direction": 1.1.1
+    "@radix-ui/react-primitive": 2.1.3
+    "@radix-ui/react-roving-focus": 1.1.10
+    "@radix-ui/react-toggle": 1.1.9
+    "@radix-ui/react-use-controllable-state": 1.2.2
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 4be91c95e6c91b9e5d1d92c9fa1c04f50277823c0230880d221446d5e2ce0c84f22e2c0c80c9df3d8b73abfb71e77366e40b89a47792016482253a2df524c63b
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-toggle@npm:1.1.9":
+  version: 1.1.9
+  resolution: "@radix-ui/react-toggle@npm:1.1.9"
+  dependencies:
+    "@radix-ui/primitive": 1.1.2
+    "@radix-ui/react-primitive": 2.1.3
+    "@radix-ui/react-use-controllable-state": 1.2.2
+  peerDependencies:
+    "@types/react": "*"
+    "@types/react-dom": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+    react-dom: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+    "@types/react-dom":
+      optional: true
+  checksum: 844e44da16dea79c005629f96eba40423d6b76c23f4ccfc1a45ccb1afdf681d7434c103d217c0b80e00b809bbbc7b457cdcc1255c3424db3f3d818992995f17f
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-callback-ref@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-use-callback-ref@npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: cde8c40f1d4e79e6e71470218163a746858304bad03758ac84dc1f94247a046478e8e397518350c8d6609c84b7e78565441d7505bb3ed573afce82cfdcd19faf
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-controllable-state@npm:1.2.2":
+  version: 1.2.2
+  resolution: "@radix-ui/react-use-controllable-state@npm:1.2.2"
+  dependencies:
+    "@radix-ui/react-use-effect-event": 0.0.2
+    "@radix-ui/react-use-layout-effect": 1.1.1
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: b438ee199d0630bf95eaafe8bf4bce219e73b371cfc8465f47548bfa4ee231f1134b5c6696b242890a01a0fd25fa34a7b172346bbfc5ee25cfb28b3881b1dc92
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-effect-event@npm:0.0.2":
+  version: 0.0.2
+  resolution: "@radix-ui/react-use-effect-event@npm:0.0.2"
+  dependencies:
+    "@radix-ui/react-use-layout-effect": 1.1.1
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 5a1950a30a399ea7e4b98154da9f536737a610de80189b7aacd4f064a89a3cd0d2a48571d527435227252e72e872bdb544ff6ffcfbdd02de2efd011be4aaa902
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-escape-keydown@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-use-escape-keydown@npm:1.1.1"
+  dependencies:
+    "@radix-ui/react-use-callback-ref": 1.1.1
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 0eb0756c2c55ddcde9ff01446ab01c085ab2bf799173e97db7ef5f85126f9e8600225570801a1f64740e6d14c39ffe8eed7c14d29737345a5797f4622ac96f6f
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-layout-effect@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-use-layout-effect@npm:1.1.1"
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: bad2ba4f206e6255263582bedfb7868773c400836f9a1b423c0b464ffe4a17e13d3f306d1ce19cf7a19a492e9d0e49747464f2656451bb7c6a99f5a57bd34de2
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-rect@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-use-rect@npm:1.1.1"
+  dependencies:
+    "@radix-ui/rect": 1.1.1
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 116461bebc49472f7497e66a9bd413541181b3d00c5e0aaeef45d790dc1fbd7c8dcea80b169ea273306228b9a3c2b70067e902d1fd5004b3057e3bbe35b9d55d
+  languageName: node
+  linkType: hard
+
+"@radix-ui/react-use-size@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/react-use-size@npm:1.1.1"
+  dependencies:
+    "@radix-ui/react-use-layout-effect": 1.1.1
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8 || ^17.0 || ^18.0 || ^19.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 64e61f65feb67ffc80e1fc4a8d5e32480fb6d68475e2640377e021178dead101568cba5f936c9c33e6c142c7cf2fb5d76ad7b23ef80e556ba142d56cf306147b
+  languageName: node
+  linkType: hard
+
+"@radix-ui/rect@npm:1.1.1":
+  version: 1.1.1
+  resolution: "@radix-ui/rect@npm:1.1.1"
+  checksum: c1c111edeab70b14a735bca43601de6468c792482864b766ac8940b43321492e5c0ae62f92b156cecdc9265ec3c680c32b3fa0c8a90b5e796923a9af13c5dc20
   languageName: node
   linkType: hard
 
@@ -3576,6 +4136,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"aria-hidden@npm:^1.2.4":
+  version: 1.2.6
+  resolution: "aria-hidden@npm:1.2.6"
+  dependencies:
+    tslib: ^2.0.0
+  checksum: 56409c55c43ad917607f3f3aa67748dcf30a27e8bb5cb3c5d86b43e38babadd63cd77731a27bc8a8c4332c2291741ed92333bf7ca45f8b99ebc87b94a8070a6e
+  languageName: node
+  linkType: hard
+
 "array-buffer-byte-length@npm:^1.0.1, array-buffer-byte-length@npm:^1.0.2":
   version: 1.0.2
   resolution: "array-buffer-byte-length@npm:1.0.2"
@@ -4750,6 +5319,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"detect-node-es@npm:^1.1.0":
+  version: 1.1.0
+  resolution: "detect-node-es@npm:1.1.0"
+  checksum: e46307d7264644975b71c104b9f028ed1d3d34b83a15b8a22373640ce5ea630e5640b1078b8ea15f202b54641da71e4aa7597093bd4b91f113db520a26a37449
+  languageName: node
+  linkType: hard
+
 "detect-node@npm:^2.1.0":
   version: 2.1.0
   resolution: "detect-node@npm:2.1.0"
@@ -5898,6 +6474,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"get-nonce@npm:^1.0.0":
+  version: 1.0.1
+  resolution: "get-nonce@npm:1.0.1"
+  checksum: e2614e43b4694c78277bb61b0f04583d45786881289285c73770b07ded246a98be7e1f78b940c80cbe6f2b07f55f0b724e6db6fd6f1bcbd1e8bdac16521074ed
+  languageName: node
+  linkType: hard
+
 "get-pkg-repo@npm:^4.2.1":
   version: 4.2.1
   resolution: "get-pkg-repo@npm:4.2.1"
@@ -7657,6 +8240,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"lucide-react@npm:^0.513.0":
+  version: 0.513.0
+  resolution: "lucide-react@npm:0.513.0"
+  peerDependencies:
+    react: ^16.5.1 || ^17.0.0 || ^18.0.0 || ^19.0.0
+  checksum: 76eeae8637afc4ac9ac95f92e2ad8a335151834a6a748ca581dc8f2999a0059e6b60257a47cfae6789db5c6ee4c288a4e68410b302f4227bda86d2807a093097
+  languageName: node
+  linkType: hard
+
 "make-dir@npm:4.0.0":
   version: 4.0.0
   resolution: "make-dir@npm:4.0.0"
@@ -9346,6 +9938,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-day-picker@npm:8.10.1":
+  version: 8.10.1
+  resolution: "react-day-picker@npm:8.10.1"
+  peerDependencies:
+    date-fns: ^2.28.0 || ^3.0.0
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0
+  checksum: daf7fb5aad1e355df9149e954fafc2cd40ceb90de799db4f36ef86d24729aaecfdf022fa9e63f24d093d81dc2beb60f65ae796741dff0f7305a2af80b333fb4c
+  languageName: node
+  linkType: hard
+
 "react-dom@npm:^18.2.0":
   version: 18.3.1
   resolution: "react-dom@npm:18.3.1"
@@ -9392,6 +9994,57 @@ __metadata:
   languageName: node
   linkType: hard
 
+"react-remove-scroll-bar@npm:^2.3.7":
+  version: 2.3.8
+  resolution: "react-remove-scroll-bar@npm:2.3.8"
+  dependencies:
+    react-style-singleton: ^2.2.2
+    tslib: ^2.0.0
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: c4663247f689dbe51c370836edf735487f6d8796acb7f15b09e8a1c14e84c7997360e8e3d54de2bc9c0e782fed2b2c4127d15b4053e4d2cf26839e809e57605f
+  languageName: node
+  linkType: hard
+
+"react-remove-scroll@npm:^2.6.3":
+  version: 2.7.1
+  resolution: "react-remove-scroll@npm:2.7.1"
+  dependencies:
+    react-remove-scroll-bar: ^2.3.7
+    react-style-singleton: ^2.2.3
+    tslib: ^2.1.0
+    use-callback-ref: ^1.3.3
+    use-sidecar: ^1.1.3
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: c8b1988d473ca0b4911a0a42f09dc7806d5db998c3ec938ae2791a5f82d807c2cdebb78a1c58a0bab62a83112528dda2f20d509d0e048fe281b9dfc027c39763
+  languageName: node
+  linkType: hard
+
+"react-style-singleton@npm:^2.2.2, react-style-singleton@npm:^2.2.3":
+  version: 2.2.3
+  resolution: "react-style-singleton@npm:2.2.3"
+  dependencies:
+    get-nonce: ^1.0.0
+    tslib: ^2.0.0
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: a7b0bf493c9231065ebafa84c4237aed997c746c561196121b7de82fe155a5355b372db5070a3ac9fe980cf7f60dc0f1e8cf6402a2aa5b2957392932ccf76e76
+  languageName: node
+  linkType: hard
+
 "react@npm:>=17.0.0 <19.0.0, react@npm:^18.0.1, react@npm:^18.2.0":
   version: 18.3.1
   resolution: "react@npm:18.3.1"
@@ -10762,7 +11415,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"tslib@npm:^2.1.0, tslib@npm:^2.3.0, tslib@npm:^2.4.0":
+"tslib@npm:^2.0.0, tslib@npm:^2.1.0, tslib@npm:^2.3.0, tslib@npm:^2.4.0, tslib@npm:^2.8.1":
   version: 2.8.1
   resolution: "tslib@npm:2.8.1"
   checksum: e4aba30e632b8c8902b47587fd13345e2827fa639e7c3121074d5ee0880723282411a8838f830b55100cbe4517672f84a2472667d355b81e8af165a55dc6203a
@@ -11057,6 +11710,37 @@ __metadata:
   languageName: node
   linkType: hard
 
+"use-callback-ref@npm:^1.3.3":
+  version: 1.3.3
+  resolution: "use-callback-ref@npm:1.3.3"
+  dependencies:
+    tslib: ^2.0.0
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 4da1c82d7a2409cee6c882748a40f4a083decf238308bf12c3d0166f0e338f8d512f37b8d11987eb5a421f14b9b5b991edf3e11ed25c3bb7a6559081f8359b44
+  languageName: node
+  linkType: hard
+
+"use-sidecar@npm:^1.1.3":
+  version: 1.1.3
+  resolution: "use-sidecar@npm:1.1.3"
+  dependencies:
+    detect-node-es: ^1.1.0
+    tslib: ^2.0.0
+  peerDependencies:
+    "@types/react": "*"
+    react: ^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0 || ^19.0.0-rc
+  peerDependenciesMeta:
+    "@types/react":
+      optional: true
+  checksum: 88664c6b2c5b6e53e4d5d987694c9053cea806da43130248c74ca058945c8caa6ccb7b1787205a9eb5b9d124633e42153848904002828acabccdc48cda026622
+  languageName: node
+  linkType: hard
+
 "util-deprecate@npm:^1.0.1, util-deprecate@npm:^1.0.2, util-deprecate@npm:~1.0.1":
   version: 1.0.2
   resolution: "util-deprecate@npm:1.0.2"

From 4e035035cd9f9ba1e04a8ffe3d5ddeb859205acf Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 11:36:58 +0200
Subject: [PATCH 06/15] Add pagination component

---
 .../base/src/shared/components/Pagination.tsx | 110 +++++++++++++
 packages/base/style/shared/pagination.css     | 147 ++++++++++++++++++
 2 files changed, 257 insertions(+)
 create mode 100644 packages/base/src/shared/components/Pagination.tsx
 create mode 100644 packages/base/style/shared/pagination.css

diff --git a/packages/base/src/shared/components/Pagination.tsx b/packages/base/src/shared/components/Pagination.tsx
new file mode 100644
index 000000000..4e9308959
--- /dev/null
+++ b/packages/base/src/shared/components/Pagination.tsx
@@ -0,0 +1,110 @@
+import { ChevronLeft, ChevronRight, MoreHorizontal } from 'lucide-react';
+import * as React from 'react';
+import { ButtonProps } from './Button';
+
+const Pagination = ({ ...props }: React.ComponentProps<'nav'>) => (
+  <nav
+    role="navigation"
+    aria-label="pagination"
+    className={'Pagination'}
+    {...props}
+  />
+);
+Pagination.displayName = 'Pagination';
+
+const PaginationContent = React.forwardRef<
+  HTMLUListElement,
+  React.ComponentProps<'ul'>
+>(({ ...props }, ref) => (
+  <ul ref={ref} className={'PaginationContent'} {...props} />
+));
+PaginationContent.displayName = 'PaginationContent';
+
+const PaginationItem = React.forwardRef<
+  HTMLLIElement,
+  React.ComponentProps<'li'>
+>(({ ...props }, ref) => <li ref={ref} className="" {...props} />);
+PaginationItem.displayName = 'PaginationItem';
+
+type PaginationLinkProps = {
+  isActive?: boolean;
+} & Pick<ButtonProps, 'size'> &
+  React.ComponentProps<'a'>;
+
+const PaginationLink = ({
+  isActive,
+  size = 'icon',
+  ...props
+}: PaginationLinkProps) => (
+  <a
+    aria-current={isActive ? 'page' : undefined}
+    data-variant={isActive ? 'outline' : 'ghost'}
+    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
+    data-size={size}
+    className={'PaginationLink'}
+    {...props}
+  />
+);
+PaginationLink.displayName = 'PaginationLink';
+
+// size is 'default' from both next and previous
+const PaginationPrevious = ({
+  ...props
+}: React.ComponentProps<typeof PaginationLink>) => (
+  <PaginationLink
+    aria-label="Go to previous page"
+    className={'PaginationPrevious'}
+    {...props}
+  >
+    <ChevronLeft
+      style={{
+        height: '1rem',
+        width: '1rem'
+      }}
+    />
+    <span>Previous</span>
+  </PaginationLink>
+);
+PaginationPrevious.displayName = 'PaginationPrevious';
+
+const PaginationNext = ({
+  ...props
+}: React.ComponentProps<typeof PaginationLink>) => (
+  <PaginationLink
+    aria-label="Go to next page"
+    className={'PaginationNext'}
+    {...props}
+  >
+    <span>Next</span>
+    <ChevronRight
+      style={{
+        height: '1rem',
+        width: '1rem'
+      }}
+    />
+  </PaginationLink>
+);
+PaginationNext.displayName = 'PaginationNext';
+
+const PaginationEllipsis = ({ ...props }: React.ComponentProps<'span'>) => (
+  <span aria-hidden className={'PaginationEllipsis'} {...props}>
+    <MoreHorizontal
+      style={{
+        height: '1rem',
+        width: '1rem'
+      }}
+    />
+    <span className="sr-only">More pages</span>
+  </span>
+);
+PaginationEllipsis.displayName = 'PaginationEllipsis';
+
+export {
+  Pagination,
+  PaginationContent,
+  PaginationEllipsis,
+  PaginationItem,
+  PaginationLink,
+  PaginationNext,
+  PaginationPrevious
+};
diff --git a/packages/base/style/shared/pagination.css b/packages/base/style/shared/pagination.css
new file mode 100644
index 000000000..5f366ba4b
--- /dev/null
+++ b/packages/base/style/shared/pagination.css
@@ -0,0 +1,147 @@
+.Pagination {
+  margin-left: auto;
+  margin-right: auto;
+  display: flex;
+  width: 100%;
+  justify-content: center;
+}
+
+.PaginationContent {
+  margin-left: auto;
+  margin-right: auto;
+  display: flex;
+  width: 100%;
+  justify-content: center;
+}
+
+.PaginationLink {
+  display: inline-flex;
+  align-items: center;
+  justify-content: center;
+  white-space: nowrap;
+  border-radius: 0.375rem;
+  font-size: 0.875rem;
+  font-weight: 500;
+  transition-property: color, background-color, border-color;
+  transition-duration: 0.2s;
+  transition-timing-function: ease;
+  outline: none;
+  background-color: hsl(var(--primary));
+  color: hsl(var(--primary-foreground));
+  border: 0.0375rem solid hsl(var(--border) / 0.8);
+  transition: background-color 0.2s ease;
+  height: 2.5rem;
+  padding-left: 1rem;
+  padding-right: 1rem;
+  padding-top: 0.5rem;
+  padding-bottom: 0.5rem;
+}
+
+.PaginationLink:hover {
+  background-color: hsl(var(--primary), 0.9);
+}
+
+.PaginationLink:focus-visible {
+  outline: none;
+  box-shadow: 0 0 0 3px hsl(var(--background) / 0.5);
+}
+
+.PaginationLink:disabled {
+  pointer-events: none;
+  opacity: 0.5;
+}
+
+.PaginationLink:disabled:focus-visible {
+  outline: none;
+  box-shadow: none;
+}
+
+.PaginationLink[data-variant='destructive'] {
+  background-color: hsl(var(--destructive));
+  color: hsl(var(--destructive-foreground));
+  transition: background-color 0.2s ease;
+}
+
+.PaginationLink[data-variant='destructive']:hover {
+  background-color: hsl(var(--destructive), 0.9);
+}
+
+.PaginationLink[data-variant='outline'] {
+  border: 1px solid hsl(var(--border));
+  background-color: hsl(var(--background));
+  transition:
+    background-color 0.2s ease,
+    color 0.2s ease;
+}
+
+.PaginationLink[data-variant='outline']:hover {
+  background-color: hsl(var(--accent));
+  color: hsl(var(--accent-foreground));
+}
+
+.PaginationLink[data-variant='secondary'] {
+  background-color: hsl(var(--secondary));
+  color: hsl(var(--secondary-foreground));
+  transition: background-color 0.2s ease;
+}
+
+.PaginationLink[data-variant='secondary']:hover {
+  background-color: hsl(var(--secondary) / 0.8);
+}
+
+.PaginationLink[data-variant='ghost'] {
+  background-color: hsl(var(--accent));
+  color: hsl(var(--accent-foreground));
+}
+
+.PaginationLink[data-variant='link'] {
+  color: hsl(var(--primary));
+  text-decoration: underline;
+  text-underline-offset: 0.25rem;
+  transition: text-decoration 0.2s ease;
+  border: none;
+  padding: 0;
+}
+
+.PaginationLink[data-variant='link']:hover {
+  color: hsl(var(--primary) / 0.8);
+  text-decoration-color: hsl(var(--primary));
+}
+
+/* sizing */
+.PaginationLink[data-size='sm'] {
+  height: 2.25rem;
+  border-radius: 0.375rem;
+  padding-left: 0.75rem;
+  padding-right: 0.75rem;
+}
+
+.PaginationLink[data-size='lg'] {
+  height: 2.75rem;
+  border-radius: 0.375rem;
+  padding-left: 2rem;
+  padding-right: 2rem;
+}
+
+.PaginationLink[data-size='icon'] {
+  height: 2.5rem;
+  width: 2.5rem;
+}
+
+.PaginationPrevious {
+  gap: 0.25rem;
+  padding-left: 0.625rem;
+}
+
+.PaginationNext {
+  gap: 0.25rem;
+  padding-right: 0.625rem;
+}
+
+.PaginationEllipsis {
+  display: flex;
+  height: 2.25rem;
+  width: 2.25rem;
+  align-items: center;
+  justify-content: center;
+}

From 3a2d065e89290a69ace5e15a4689c124ccd1f02e Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 11:38:30 +0200
Subject: [PATCH 07/15] Iterate on paginator

---
 .../base/src/shared/components/Pagination.tsx | 14 ++++----
 packages/base/style/base.css                  |  1 +
 packages/base/style/shared/pagination.css     | 32 ++++++++++++-------
 3 files changed, 30 insertions(+), 17 deletions(-)

diff --git a/packages/base/src/shared/components/Pagination.tsx b/packages/base/src/shared/components/Pagination.tsx
index 4e9308959..c36777136 100644
--- a/packages/base/src/shared/components/Pagination.tsx
+++ b/packages/base/src/shared/components/Pagination.tsx
@@ -1,6 +1,6 @@
 import { ChevronLeft, ChevronRight, MoreHorizontal } from 'lucide-react';
 import * as React from 'react';
-import { ButtonProps } from './Button';
+import { Button, ButtonProps } from './Button';
 
 const Pagination = ({ ...props }: React.ComponentProps<'nav'>) => (
   <nav
@@ -29,14 +29,14 @@ PaginationItem.displayName = 'PaginationItem';
 type PaginationLinkProps = {
   isActive?: boolean;
 } & Pick<ButtonProps, 'size'> &
-  React.ComponentProps<'a'>;
+  React.ComponentProps<'button'>;
 
 const PaginationLink = ({
   isActive,
   size = 'icon',
   ...props
 }: PaginationLinkProps) => (
-  <a
+  <Button
     aria-current={isActive ? 'page' : undefined}
     data-variant={isActive ? 'outline' : 'ghost'}
     // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
@@ -59,10 +59,11 @@ const PaginationPrevious = ({
     <ChevronLeft
       style={{
         height: '1rem',
-        width: '1rem'
+        width: '1rem',
+        flexShrink: 0
       }}
     />
-    <span>Previous</span>
+    <span>Prev</span>
   </PaginationLink>
 );
 PaginationPrevious.displayName = 'PaginationPrevious';
@@ -79,7 +80,8 @@ const PaginationNext = ({
     <ChevronRight
       style={{
         height: '1rem',
-        width: '1rem'
+        width: '1rem',
+        flexShrink: 0
       }}
     />
   </PaginationLink>
diff --git a/packages/base/style/base.css b/packages/base/style/base.css
index cc92e5794..95f7358c6 100644
--- a/packages/base/style/base.css
+++ b/packages/base/style/base.css
@@ -14,6 +14,7 @@
 @import url('./shared/button.css');
 @import url('./shared/toggle.css');
 @import url('./shared/tabs.css');
+@import url('./shared/pagination.css');
 
 .jGIS-Toolbar-GroupName {
   font-size: var(--jp-ui-font-size0);
diff --git a/packages/base/style/shared/pagination.css b/packages/base/style/shared/pagination.css
index 5f366ba4b..a239cee28 100644
--- a/packages/base/style/shared/pagination.css
+++ b/packages/base/style/shared/pagination.css
@@ -12,6 +12,10 @@
   display: flex;
   width: 100%;
   justify-content: center;
+  list-style-type: none;
+  gap: 0.25rem;
+  padding-left: unset;
+  align-items: center;
 }
 
 .PaginationLink {
@@ -28,13 +32,13 @@
   outline: none;
   background-color: hsl(var(--primary));
   color: hsl(var(--primary-foreground));
-  border: 0.0375rem solid hsl(var(--border) / 0.8);
+  border: 0.0375rem solid hsl(var(--jp-border-color0) / 0.8);
   transition: background-color 0.2s ease;
-  height: 2.5rem;
+  /* height: 2.5rem;
   padding-left: 1rem;
-  padding-right: 1rem;
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
+  padding-right: 1rem; */
+  padding-top: 0.25rem;
+  padding-bottom: 0.25rem;
 }
 
 .PaginationLink:hover {
@@ -67,16 +71,18 @@
 }
 
 .PaginationLink[data-variant='outline'] {
-  border: 1px solid hsl(var(--border));
-  background-color: hsl(var(--background));
+  border: 1px solid var(--jp-border-color0);
+  background-color: var(----jp-layout-color2);
   transition:
     background-color 0.2s ease,
     color 0.2s ease;
 }
 
 .PaginationLink[data-variant='outline']:hover {
-  background-color: hsl(var(--accent));
-  color: hsl(var(--accent-foreground));
+  /* background-color: hsl(var(--accent));
+  color: hsl(var(--accent-foreground)); */
+  background-color: purple;
+  color: peru;
 }
 
 .PaginationLink[data-variant='secondary'] {
@@ -124,18 +130,22 @@
 }
 
 .PaginationLink[data-size='icon'] {
-  height: 2.5rem;
-  width: 2.5rem;
+  /* height: 2.5rem; */
+  width: 1.5rem;
 }
 
 .PaginationPrevious {
   gap: 0.25rem;
   padding-left: 0.625rem;
+  display: flex;
+  cursor: pointer;
 }
 
 .PaginationNext {
   gap: 0.25rem;
   padding-right: 0.625rem;
+  display: flex;
+  cursor: pointer;
 }
 
 .PaginationEllipsis {

From 3421cbd95d6ed5647effb3ebdb8be90af35226f5 Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 11:40:16 +0200
Subject: [PATCH 08/15] Tiny tweaks

---
 packages/base/src/shared/components/Pagination.tsx | 1 -
 1 file changed, 1 deletion(-)

diff --git a/packages/base/src/shared/components/Pagination.tsx b/packages/base/src/shared/components/Pagination.tsx
index c36777136..17be01faf 100644
--- a/packages/base/src/shared/components/Pagination.tsx
+++ b/packages/base/src/shared/components/Pagination.tsx
@@ -39,7 +39,6 @@ const PaginationLink = ({
   <Button
     aria-current={isActive ? 'page' : undefined}
     data-variant={isActive ? 'outline' : 'ghost'}
-    // eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
     data-size={size}
     className={'PaginationLink'}
     {...props}

From 2ea409b30ffa835a82fb6355daa82896c4953c12 Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 11:45:17 +0200
Subject: [PATCH 09/15] Use the correct package.json

---
 package.json               |  12 --
 packages/base/package.json |  13 +-
 yarn.lock                  | 298 ++++++++++++++++++++++++++-----------
 3 files changed, 222 insertions(+), 101 deletions(-)

diff --git a/package.json b/package.json
index 1c3c88f12..fc9f4116c 100644
--- a/package.json
+++ b/package.json
@@ -72,17 +72,5 @@
     "rimraf": "^3.0.2",
     "typescript": "^5",
     "webpack": "^5.76.3"
-  },
-  "dependencies": {
-    "@radix-ui/react-popover": "^1.1.14",
-    "@radix-ui/react-slot": "^1.2.3",
-    "@radix-ui/react-tabs": "^1.1.12",
-    "@radix-ui/react-toggle-group": "^1.1.10",
-    "class-variance-authority": "^0.7.1",
-    "clsx": "^2.1.1",
-    "date-fns": "^4.1.0",
-    "lucide-react": "^0.513.0",
-    "ol-stac": "^1.0.0-rc.10",
-    "react-day-picker": "8.10.1"
   }
 }
diff --git a/packages/base/package.json b/packages/base/package.json
index 8600705a0..8c176137f 100644
--- a/packages/base/package.json
+++ b/packages/base/package.json
@@ -64,27 +64,34 @@
     "@lumino/widgets": "^2.0.0",
     "@mapbox/vector-tile": "^2.0.3",
     "@naisutech/react-tree": "^3.0.1",
+    "@radix-ui/react-popover": "^1.1.14",
+    "@radix-ui/react-slot": "^1.2.3",
+    "@radix-ui/react-tabs": "^1.1.12",
+    "@radix-ui/react-toggle-group": "^1.1.10",
     "@rjsf/core": "^4.2.0",
     "@rjsf/validator-ajv8": "^5.23.1",
     "ajv": "^8.14.0",
+    "class-variance-authority": "^0.7.1",
+    "clsx": "^2.1.1",
     "colormap": "^2.3.2",
     "d3-color": "^3.1.0",
     "date-fns": "^4.1.0",
     "gdal3.js": "^2.8.1",
     "geojson-vt": "^4.0.2",
     "geotiff": "^2.1.3",
+    "lucide-react": "^0.513.0",
     "ol": "^10.1.0",
     "ol-pmtiles": "^0.5.0",
+    "ol-stac": "^1.0.0-rc.10",
     "pbf": "^4.0.1",
     "pmtiles": "^3.0.7",
     "proj4": "^2.14.0",
     "proj4-list": "^1.0.4",
     "react": "^18.0.1",
+    "react-day-picker": "8.10.1",
     "shpjs": "^6.1.0",
     "styled-components": "^5.3.6",
-    "three": "^0.135.0",
-    "three-mesh-bvh": "^0.5.17",
-    "uuid": "^11.0.3"
+    "three": "^0.135.0"
   },
   "devDependencies": {
     "@apidevtools/json-schema-ref-parser": "^9.0.9",
diff --git a/yarn.lock b/yarn.lock
index 2604665a0..dc04ce465 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -142,12 +142,12 @@ __metadata:
   linkType: hard
 
 "@babel/types@npm:^7.27.1, @babel/types@npm:^7.27.3":
-  version: 7.27.3
-  resolution: "@babel/types@npm:7.27.3"
+  version: 7.27.6
+  resolution: "@babel/types@npm:7.27.6"
   dependencies:
     "@babel/helper-string-parser": ^7.27.1
     "@babel/helper-validator-identifier": ^7.27.1
-  checksum: f0d43c0231f3ebc118480e149292dcd92ea128e2650285ced99ff2e5610db2171305f59aa07406ba0cb36af8e4331a53a69576d6b0c3f3176144dd3ad514b9ae
+  checksum: c3bd0984d892b0edec38fd12cf63f620bb52fba8187ec7cbe2d1aff5bee5e185e0fd86a3fb90b4d8f18b072113d07901476d0e39f58d5c988db14b231a6ea735
   languageName: node
   linkType: hard
 
@@ -818,6 +818,10 @@ __metadata:
     "@lumino/widgets": ^2.0.0
     "@mapbox/vector-tile": ^2.0.3
     "@naisutech/react-tree": ^3.0.1
+    "@radix-ui/react-popover": ^1.1.14
+    "@radix-ui/react-slot": ^1.2.3
+    "@radix-ui/react-tabs": ^1.1.12
+    "@radix-ui/react-toggle-group": ^1.1.10
     "@rjsf/core": ^4.2.0
     "@rjsf/validator-ajv8": ^5.23.1
     "@types/colormap": ^2.3.4
@@ -827,28 +831,31 @@ __metadata:
     "@types/shpjs": ^3.4.7
     "@types/uuid": ^10.0.0
     ajv: ^8.14.0
+    class-variance-authority: ^0.7.1
+    clsx: ^2.1.1
     colormap: ^2.3.2
     d3-color: ^3.1.0
     date-fns: ^4.1.0
     gdal3.js: ^2.8.1
     geojson-vt: ^4.0.2
     geotiff: ^2.1.3
+    lucide-react: ^0.513.0
     ol: ^10.1.0
     ol-pmtiles: ^0.5.0
+    ol-stac: ^1.0.0-rc.10
     pbf: ^4.0.1
     pmtiles: ^3.0.7
     proj4: ^2.14.0
     proj4-list: ^1.0.4
     react: ^18.0.1
+    react-day-picker: 8.10.1
     rimraf: ^3.0.2
     shpjs: ^6.1.0
     styled-components: ^5.3.6
     three: ^0.135.0
-    three-mesh-bvh: ^0.5.17
     ts-patch: ^3.3.0
     typescript: ^5
     typescript-transform-paths: ^3.5.5
-    uuid: ^11.0.3
   languageName: unknown
   linkType: soft
 
@@ -953,24 +960,17 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@jupytergis/jupytergis-root@workspace:."
   dependencies:
-    "@radix-ui/react-popover": ^1.1.14
-    "@radix-ui/react-slot": ^1.2.3
-    "@radix-ui/react-tabs": ^1.1.12
-    "@radix-ui/react-toggle-group": ^1.1.10
     "@types/webpack-env": ^1.18.5
     "@typescript-eslint/eslint-plugin": 5.55.0
     "@typescript-eslint/parser": 5.55.0
     copy-webpack-plugin: ^10.0.0
-    date-fns: ^4.1.0
     eslint: ^8.36.0
     eslint-config-prettier: ^8.8.0
     eslint-plugin-import: ^2.31.0
     eslint-plugin-prettier: ^5.0.1
     lerna: ^8.1.9
-    lucide-react: ^0.513.0
     npm-run-all: ^4.1.5
     prettier: ^3.0.0
-    react-day-picker: 8.10.1
     rimraf: ^3.0.2
     typescript: ^5
     webpack: ^5.76.3
@@ -2127,6 +2127,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@multiformats/base-x@npm:^4.0.1":
+  version: 4.0.1
+  resolution: "@multiformats/base-x@npm:4.0.1"
+  checksum: ecbf84bdd7613fd795e4a41f20f3e8cc7df8bbee84690b7feed383d45a638ed228a80ff6f5c930373cbf24539f64857b66023ee3c1e914f6bac9995c76414a87
+  languageName: node
+  linkType: hard
+
 "@naisutech/react-tree@npm:^3.0.1":
   version: 3.1.0
   resolution: "@naisutech/react-tree@npm:3.1.0"
@@ -2618,10 +2625,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@pkgr/core@npm:^0.2.3":
-  version: 0.2.4
-  resolution: "@pkgr/core@npm:0.2.4"
-  checksum: 8544f0346c3f7035b9e2fdf60179c68b12d3c76b3fba9533844099af67cf5c0ce5257538f5faa05953d48cc1536d046f003231f321b2f75b3fb449db8410a2b7
+"@pkgr/core@npm:^0.2.4":
+  version: 0.2.7
+  resolution: "@pkgr/core@npm:0.2.7"
+  checksum: b16959878940f3d3016b79a4b2c23fd518aaec6b47295baa3154fbcf6574fee644c51023bb69069fa3ea9cdcaca40432818f54695f11acc0ae326cf56676e4d1
   languageName: node
   linkType: hard
 
@@ -3161,8 +3168,8 @@ __metadata:
   linkType: hard
 
 "@rjsf/core@npm:^5.13.4":
-  version: 5.24.10
-  resolution: "@rjsf/core@npm:5.24.10"
+  version: 5.24.11
+  resolution: "@rjsf/core@npm:5.24.11"
   dependencies:
     lodash: ^4.17.21
     lodash-es: ^4.17.21
@@ -3172,13 +3179,13 @@ __metadata:
   peerDependencies:
     "@rjsf/utils": ^5.24.x
     react: ^16.14.0 || >=17
-  checksum: 90316d9dd90ae58805fc4f6fa2bb14dfd9a361abebb75bd3b1b7ed55b554e9a7d5145fc09ee5906bc91d362fc8f8c24619d4d4c432bae782da5cebb0a5b9cddf
+  checksum: 7bceac697e7a289fb88c6e88e78a6fc50628ebb3064d63fa7e3244a1189c6a42c582a779c52b828e8b60fdc9ff81b5468c5e60a28392061fa2eab022e6a3c2d4
   languageName: node
   linkType: hard
 
 "@rjsf/utils@npm:^5.13.4":
-  version: 5.24.10
-  resolution: "@rjsf/utils@npm:5.24.10"
+  version: 5.24.11
+  resolution: "@rjsf/utils@npm:5.24.11"
   dependencies:
     json-schema-merge-allof: ^0.8.1
     jsonpointer: ^5.0.1
@@ -3187,13 +3194,13 @@ __metadata:
     react-is: ^18.2.0
   peerDependencies:
     react: ^16.14.0 || >=17
-  checksum: 64d9bcfea100c4b89128c20473982d316e960c01f9887fb3613bc0ecdaa9fdf8804f96ff99b0b415c2cbc7b4f7d5de941328a1a1a5d53148489d395a1f07a78e
+  checksum: 81e716c5e34b5f194a384c75059aff2cb7c7f639f7998179c7648c280bf9c76b6e97ef22e3a99d4afaf8228f48acc499e39eca8574872ed75a97337c0e6072f6
   languageName: node
   linkType: hard
 
 "@rjsf/validator-ajv8@npm:^5.23.1":
-  version: 5.24.10
-  resolution: "@rjsf/validator-ajv8@npm:5.24.10"
+  version: 5.24.11
+  resolution: "@rjsf/validator-ajv8@npm:5.24.11"
   dependencies:
     ajv: ^8.12.0
     ajv-formats: ^2.1.1
@@ -3201,7 +3208,7 @@ __metadata:
     lodash-es: ^4.17.21
   peerDependencies:
     "@rjsf/utils": ^5.24.x
-  checksum: 920d466c972683108a3b093f813a0b77c289068a24c3ae74b6933a5f7346c2a0d7f3d02d0304f419fbfd8376f7ee59972a5f202939c827ac778aedc35bd0ed1b
+  checksum: 807c95806e713889577494ca9e50312665f97fab59effcc70f1d7d1a4bdf48a3b715d2d9f8dc1cf3afcafa407bc52b3db75327af324a8b9e2e0dcbc7baa2612e
   languageName: node
   linkType: hard
 
@@ -3347,9 +3354,9 @@ __metadata:
   linkType: hard
 
 "@types/estree@npm:*, @types/estree@npm:^1.0.6":
-  version: 1.0.7
-  resolution: "@types/estree@npm:1.0.7"
-  checksum: d9312b7075bdd08f3c9e1bb477102f5458aaa42a8eec31a169481ce314ca99ac716645cff4fca81ea65a2294b0276a0de63159d1baca0f8e7b5050a92de950ad
+  version: 1.0.8
+  resolution: "@types/estree@npm:1.0.8"
+  checksum: bd93e2e415b6f182ec4da1074e1f36c480f1d26add3e696d54fb30c09bc470897e41361c8fd957bf0985024f8fbf1e6e2aff977d79352ef7eb93a5c6dcff6c11
   languageName: node
   linkType: hard
 
@@ -3422,20 +3429,20 @@ __metadata:
   linkType: hard
 
 "@types/node@npm:*":
-  version: 22.15.29
-  resolution: "@types/node@npm:22.15.29"
+  version: 24.0.0
+  resolution: "@types/node@npm:24.0.0"
   dependencies:
-    undici-types: ~6.21.0
-  checksum: 201aabe3614d68fdf84f3255e2380381180de26ecdfd091f8809bf46fd2a41e73b2df4d94780c2054597f3c203d1c9d378359c21c551fb4eef8b12406698d6c9
+    undici-types: ~7.8.0
+  checksum: 44cfc867258870ece2c8e593ea643d9666930b449170b4c019838b2fc32ca77a0fdfb75754b02c686286fad79375317bea16005e6ad2666d61ec8c3bc711f0b7
   languageName: node
   linkType: hard
 
 "@types/node@npm:^18.15.11":
-  version: 18.19.110
-  resolution: "@types/node@npm:18.19.110"
+  version: 18.19.111
+  resolution: "@types/node@npm:18.19.111"
   dependencies:
     undici-types: ~5.26.4
-  checksum: 21df1474bda95c5e4c7ea746b369a8050185aea6c7f281c27ec7bc0cb404266f6e9680fc3cdd6d02d5da92183283bc479947e9c9dc7eaf33839d17c2c648aceb
+  checksum: 0696f422bf8c70e01255397767cea2938287d819e5ac92242f0e5629ab69f25ac22c811d0f4f3ae727c6b4f678f88737aa568b17404047cfcf3ea2b1f47786b3
   languageName: node
   linkType: hard
 
@@ -3461,9 +3468,9 @@ __metadata:
   linkType: hard
 
 "@types/prop-types@npm:*":
-  version: 15.7.14
-  resolution: "@types/prop-types@npm:15.7.14"
-  checksum: d0c5407b9ccc3dd5fae0ccf9b1007e7622ba5e6f1c18399b4f24dff33619d469da4b9fa918a374f19dc0d9fe6a013362aab0b844b606cfc10676efba3f5f736d
+  version: 15.7.15
+  resolution: "@types/prop-types@npm:15.7.15"
+  checksum: 31aa2f59b28f24da6fb4f1d70807dae2aedfce090ec63eaf9ea01727a9533ef6eaf017de5bff99fbccad7d1c9e644f52c6c2ba30869465dd22b1a7221c29f356
   languageName: node
   linkType: hard
 
@@ -3485,11 +3492,11 @@ __metadata:
   linkType: hard
 
 "@types/react@npm:*":
-  version: 19.1.6
-  resolution: "@types/react@npm:19.1.6"
+  version: 19.1.7
+  resolution: "@types/react@npm:19.1.7"
   dependencies:
     csstype: ^3.0.2
-  checksum: 7f4d2e5fd0c1afa6aef956e551c982a59c3ccf37cf30b877300306dcae87e0c4bf7b28b54676b1783f4ca92e730af6fb7a4c1b7f6df27ba14579aa1617a58b09
+  checksum: eb36382960a5c1131d636cecf3449f02d1d1c79a5056bc74fdd3b493165675c4e7fd8a0240629a92d790f7cc103e6a9f54b623fc47d007730143c4039583b637
   languageName: node
   linkType: hard
 
@@ -3906,6 +3913,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"@zxing/text-encoding@npm:0.9.0":
+  version: 0.9.0
+  resolution: "@zxing/text-encoding@npm:0.9.0"
+  checksum: c23b12aee7639382e4949961304a1294776afaffa40f579e09ffecd0e5e68cf26ef3edd75009de46da8a536e571448755ca68b3e2ea707d53793c0edb2e2c34a
+  languageName: node
+  linkType: hard
+
 "JSONStream@npm:^1.3.5":
   version: 1.3.5
   resolution: "JSONStream@npm:1.3.5"
@@ -3942,11 +3956,11 @@ __metadata:
   linkType: hard
 
 "acorn@npm:^8.14.0, acorn@npm:^8.9.0":
-  version: 8.14.1
-  resolution: "acorn@npm:8.14.1"
+  version: 8.15.0
+  resolution: "acorn@npm:8.15.0"
   bin:
     acorn: bin/acorn
-  checksum: 260d9bb6017a1b6e42d31364687f0258f78eb20210b36ef2baad38fd619d78d4e95ff7dde9b3dbe0d81f137f79a8d651a845363a26e6985997f7b71145dc5e94
+  checksum: 309c6b49aedf1a2e34aaf266de06de04aab6eb097c02375c66fdeb0f64556a6a823540409914fb364d9a11bc30d79d485a2eba29af47992d3490e9886c4391c3
   languageName: node
   linkType: hard
 
@@ -4539,9 +4553,9 @@ __metadata:
   linkType: hard
 
 "caniuse-lite@npm:^1.0.30001718":
-  version: 1.0.30001720
-  resolution: "caniuse-lite@npm:1.0.30001720"
-  checksum: 97b9f9de842595ff9674001abb9c5bc093c03bb985d481ed97617ea48fc248bfb2cc1f1afe19da2bf20016f28793e495fa2f339e22080d8da3c9714fb7950926
+  version: 1.0.30001721
+  resolution: "caniuse-lite@npm:1.0.30001721"
+  checksum: 1f1e1f5f070f97ee83a08601709413300957be624790a8f7b3aebd5746d648e8d50be4ef9572a50281198b2f7acc63fdfc1a0bc04c23bbffba0ab4b3c69d4b76
   languageName: node
   linkType: hard
 
@@ -4611,6 +4625,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"class-variance-authority@npm:^0.7.1":
+  version: 0.7.1
+  resolution: "class-variance-authority@npm:0.7.1"
+  dependencies:
+    clsx: ^2.1.1
+  checksum: e05ba26ef9ec38f7c675047ce366b067d60af6c954dba08f7802af19a9460a534ae752d8fe1294fff99d0fa94a669b16ccebd87e8a20f637c0736cf2751dd2c5
+  languageName: node
+  linkType: hard
+
 "clean-stack@npm:^2.0.0":
   version: 2.2.0
   resolution: "clean-stack@npm:2.2.0"
@@ -4708,6 +4731,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"clsx@npm:^2.1.1":
+  version: 2.1.1
+  resolution: "clsx@npm:2.1.1"
+  checksum: acd3e1ab9d8a433ecb3cc2f6a05ab95fe50b4a3cfc5ba47abb6cbf3754585fcb87b84e90c822a1f256c4198e3b41c7f6c391577ffc8678ad587fc0976b24fd57
+  languageName: node
+  linkType: hard
+
 "cmd-shim@npm:6.0.3, cmd-shim@npm:^6.0.0":
   version: 6.0.3
   resolution: "cmd-shim@npm:6.0.3"
@@ -4829,6 +4859,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"compare-versions@npm:^3.6.0":
+  version: 3.6.0
+  resolution: "compare-versions@npm:3.6.0"
+  checksum: 7492a50cdaa2c27f5254eee7c4b38856e1c164991bab3d98d7fd067fe4b570d47123ecb92523b78338be86aa221668fd3868bfe8caa5587dc3ebbe1a03d52b5d
+  languageName: node
+  linkType: hard
+
 "compute-gcd@npm:^1.2.1":
   version: 1.2.1
   resolution: "compute-gcd@npm:1.2.1"
@@ -4988,9 +5025,9 @@ __metadata:
   linkType: hard
 
 "core-js-pure@npm:^3.6.5":
-  version: 3.42.0
-  resolution: "core-js-pure@npm:3.42.0"
-  checksum: 37f2488e810db5ea23f623458b8d5861a5a858cde1b4d5777c89b531b00775a3df2cf814f69af0d9d16a421094f6c640c4466b9f86a8580d65263e3219c75440
+  version: 3.43.0
+  resolution: "core-js-pure@npm:3.43.0"
+  checksum: ebad6b57e3fa5eb109f187cdf19348840d30711d10d74fb3f03bd4534908f6e59f8fb43eeebb38c45094052d3d34765c3c442b796b590d350c062fcc2d750df5
   languageName: node
   linkType: hard
 
@@ -5493,9 +5530,9 @@ __metadata:
   linkType: hard
 
 "electron-to-chromium@npm:^1.5.160":
-  version: 1.5.162
-  resolution: "electron-to-chromium@npm:1.5.162"
-  checksum: 777bd278da53730a280166237a9458d6e00bb5c55014146d44fceb74d75fab2149b5484be6f857e3943ba0f6162618c1a028c362950730eeced6921e5c158f6a
+  version: 1.5.166
+  resolution: "electron-to-chromium@npm:1.5.166"
+  checksum: 8924ae3dc3dcf4aaa9262e079496682c1f5bdcef481c88b7c6a3b54a671e16726870a89c566fae77fc8f5ea32dc661e59aaebeea3f51a9b7a85a00c3d930e9a9
   languageName: node
   linkType: hard
 
@@ -6300,14 +6337,15 @@ __metadata:
   linkType: hard
 
 "form-data@npm:^4.0.0":
-  version: 4.0.2
-  resolution: "form-data@npm:4.0.2"
+  version: 4.0.3
+  resolution: "form-data@npm:4.0.3"
   dependencies:
     asynckit: ^0.4.0
     combined-stream: ^1.0.8
     es-set-tostringtag: ^2.1.0
+    hasown: ^2.0.2
     mime-types: ^2.1.12
-  checksum: e887298b22c13c7c9c5a8ba3716f295a479a13ca78bfd855ef11cbce1bcf22bc0ae2062e94808e21d46e5c667664a1a1a8a7f57d7040193c1fefbfb11af58aab
+  checksum: b8e2568c0853ce167b2b9c9c4b81fe563f9ade647178baf6b6381cf8a11e3c01dd2b78a63ba367e6f5eab59afab8284a9438bb5ae768133f9d9fce6567fbc26a
   languageName: node
   linkType: hard
 
@@ -8628,6 +8666,34 @@ __metadata:
   languageName: node
   linkType: hard
 
+"multibase@npm:^3.1.0":
+  version: 3.1.2
+  resolution: "multibase@npm:3.1.2"
+  dependencies:
+    "@multiformats/base-x": ^4.0.1
+    web-encoding: ^1.0.6
+  checksum: 90d820626f3921980ae1c15ca7d079433f8e6b3ed365684b0a1e5160d72f6349e59d551112065d9dc1c939e551b399cd94a036748e040e0e35fbad1e671a0579
+  languageName: node
+  linkType: hard
+
+"multiformats@npm:^9.4.2":
+  version: 9.9.0
+  resolution: "multiformats@npm:9.9.0"
+  checksum: d3e8c1be400c09a014f557ea02251a2710dbc9fca5aa32cc702ff29f636c5471e17979f30bdcb0a9cbb556f162a8591dc2e1219c24fc21394a56115b820bb84e
+  languageName: node
+  linkType: hard
+
+"multihashes@npm:^3.1.2":
+  version: 3.1.2
+  resolution: "multihashes@npm:3.1.2"
+  dependencies:
+    multibase: ^3.1.0
+    uint8arrays: ^2.0.5
+    varint: ^6.0.0
+  checksum: b6a52555580d190b63bd4133b75e0ddeb84b9318c5b54c5943c69fd26843223aedaea4311d25f470d7c6335fd47eca14f66350ca703d2cde29cffaea976f424a
+  languageName: node
+  linkType: hard
+
 "multimatch@npm:5.0.0":
   version: 5.0.0
   resolution: "multimatch@npm:5.0.0"
@@ -9108,6 +9174,29 @@ __metadata:
   languageName: node
   linkType: hard
 
+"ol-pmtiles@npm:~0.2.0":
+  version: 0.2.0
+  resolution: "ol-pmtiles@npm:0.2.0"
+  dependencies:
+    pmtiles: ^2.10.0
+  peerDependencies:
+    ol: ">=7.3.0"
+  checksum: ea62268d6ef918ccdff56bcf96438cbe15acbf7caa33592399dcbbd8f329f53335e2a18e3610331265a39f02de881768c4ceb4bd7581ab005f908c2eeadad0f1
+  languageName: node
+  linkType: hard
+
+"ol-stac@npm:^1.0.0-rc.10":
+  version: 1.0.0-rc.10
+  resolution: "ol-stac@npm:1.0.0-rc.10"
+  dependencies:
+    ol-pmtiles: ~0.2.0
+    stac-js: ~0.1.4
+  peerDependencies:
+    ol: "*"
+  checksum: d9e41db57ea91bf2d5111f2b5d9de57fcc2c988402dd888dde79debfffaa16db9c75496e51962d6bfe04c7013a00aff7ace597b950ad1a794567312bcbb55474
+  languageName: node
+  linkType: hard
+
 "ol@npm:^10.1.0":
   version: 10.5.0
   resolution: "ol@npm:10.5.0"
@@ -9616,6 +9705,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"pmtiles@npm:^2.10.0":
+  version: 2.11.0
+  resolution: "pmtiles@npm:2.11.0"
+  dependencies:
+    fflate: ^0.8.0
+  checksum: 5f3f39605a963c3aa79e02a83b4080a0f9a60f19dde2bcce23daef00dc30cbd8bdbde0b66f4cf93a960d9341f37779c97400f9b97d6cfd79b0671f5ba4f92700
+  languageName: node
+  linkType: hard
+
 "pmtiles@npm:^3.0.4, pmtiles@npm:^3.0.7":
   version: 3.2.1
   resolution: "pmtiles@npm:3.2.1"
@@ -10730,12 +10828,12 @@ __metadata:
   linkType: hard
 
 "socks@npm:^2.8.3":
-  version: 2.8.4
-  resolution: "socks@npm:2.8.4"
+  version: 2.8.5
+  resolution: "socks@npm:2.8.5"
   dependencies:
     ip-address: ^9.0.5
     smart-buffer: ^4.2.0
-  checksum: cd1edc924475d5dfde534adf66038df7e62c7343e6b8c0113e52dc9bb6a0a10e25b2f136197f379d695f18e8f0f2b7f6e42977bf720ddbee912a851201c396ad
+  checksum: d39a77a8c91cfacafc75c67dba45925eccfd884a8a4a68dcda6fb9ab7f37de6e250bb6db3721e8a16a066a8e1ebe872d4affc26f3eb763f4befedcc7b733b7ed
   languageName: node
   linkType: hard
 
@@ -10889,6 +10987,16 @@ __metadata:
   languageName: node
   linkType: hard
 
+"stac-js@npm:~0.1.4":
+  version: 0.1.4
+  resolution: "stac-js@npm:0.1.4"
+  dependencies:
+    "@radiantearth/stac-migrate": ^2.0.1
+    urijs: ^1.19.11
+  checksum: f4adc0aa4fd9b894a999264db2e5cf93c461495f24c026004e7fa27af8cbd88ae5a7beeaea24003fb73558c5ed3a301ea3ae1f95abb0698e2603fa8ee528b29b
+  languageName: node
+  linkType: hard
+
 "stop-iteration-iterator@npm:^1.1.0":
   version: 1.1.0
   resolution: "stop-iteration-iterator@npm:1.1.0"
@@ -11209,8 +11317,8 @@ __metadata:
   linkType: hard
 
 "terser@npm:^5.31.1":
-  version: 5.40.0
-  resolution: "terser@npm:5.40.0"
+  version: 5.42.0
+  resolution: "terser@npm:5.42.0"
   dependencies:
     "@jridgewell/source-map": ^0.3.3
     acorn: ^8.14.0
@@ -11218,7 +11326,7 @@ __metadata:
     source-map-support: ~0.5.20
   bin:
     terser: bin/terser
-  checksum: 2c84b1a06a8417a3443f63b447b276f724221a2b0d5cdbdd642c4753e72c3711f232a87b25b1ecb8a7282a07effe4eba0c1c3d2461c5c92243f0384579a56d11
+  checksum: 1fde6c60d490a58ba92551f524b81a541fd75c41f97aef3e6a12262447b3da66c7d71cf475e0990f82b4decc1a30c3ba3663dc5e940bcbd0db1d263932d2cace
   languageName: node
   linkType: hard
 
@@ -11254,15 +11362,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"three-mesh-bvh@npm:^0.5.17":
-  version: 0.5.24
-  resolution: "three-mesh-bvh@npm:0.5.24"
-  peerDependencies:
-    three: ">= 0.123.0"
-  checksum: 5a5e356111756869cfd00870bca2d881d3019b55e71142b5eee544a2e6bcc3546a340b0defa29c3ebe7ed4cfe99e7ee6addd5671bb89852841107189c0f98157
-  languageName: node
-  linkType: hard
-
 "three@npm:^0.135.0":
   version: 0.135.0
   resolution: "three@npm:0.135.0"
@@ -11415,7 +11514,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"tslib@npm:^2.0.0, tslib@npm:^2.1.0, tslib@npm:^2.3.0, tslib@npm:^2.4.0, tslib@npm:^2.8.1":
+"tslib@npm:^2.0.0, tslib@npm:^2.1.0, tslib@npm:^2.3.0, tslib@npm:^2.4.0":
   version: 2.8.1
   resolution: "tslib@npm:2.8.1"
   checksum: e4aba30e632b8c8902b47587fd13345e2827fa639e7c3121074d5ee0880723282411a8838f830b55100cbe4517672f84a2472667d355b81e8af165a55dc6203a
@@ -11612,6 +11711,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"uint8arrays@npm:^2.0.5":
+  version: 2.1.10
+  resolution: "uint8arrays@npm:2.1.10"
+  dependencies:
+    multiformats: ^9.4.2
+  checksum: 63ceb5fecc09de69641531c847e0b435d15a73587e40d4db23ed9b8a1ebbe839ae39fe81a15ea6079cdf642fcf2583983f9a5d32726edc4bc5e87634f34e3bd5
+  languageName: node
+  linkType: hard
+
 "unbox-primitive@npm:^1.1.0":
   version: 1.1.0
   resolution: "unbox-primitive@npm:1.1.0"
@@ -11631,10 +11739,10 @@ __metadata:
   languageName: node
   linkType: hard
 
-"undici-types@npm:~6.21.0":
-  version: 6.21.0
-  resolution: "undici-types@npm:6.21.0"
-  checksum: 46331c7d6016bf85b3e8f20c159d62f5ae471aba1eb3dc52fff35a0259d58dcc7d592d4cc4f00c5f9243fa738a11cfa48bd20203040d4a9e6bc25e807fab7ab3
+"undici-types@npm:~7.8.0":
+  version: 7.8.0
+  resolution: "undici-types@npm:7.8.0"
+  checksum: 59521a5b9b50e72cb838a29466b3557b4eacbc191a83f4df5a2f7b156bc8263072b145dc4bb8ec41da7d56a7e9b178892458da02af769243d57f801a50ac5751
   languageName: node
   linkType: hard
 
@@ -11700,6 +11808,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"urijs@npm:^1.19.11":
+  version: 1.19.11
+  resolution: "urijs@npm:1.19.11"
+  checksum: f9b95004560754d30fd7dbee44b47414d662dc9863f1cf5632a7c7983648df11d23c0be73b9b4f9554463b61d5b0a520b70df9e1ee963ebb4af02e6da2cc80f3
+  languageName: node
+  linkType: hard
+
 "url-parse@npm:~1.5.4":
   version: 1.5.10
   resolution: "url-parse@npm:1.5.10"
@@ -11748,7 +11863,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"util@npm:^0.12.5":
+"util@npm:^0.12.3, util@npm:^0.12.5":
   version: 0.12.5
   resolution: "util@npm:0.12.5"
   dependencies:
@@ -11770,15 +11885,6 @@ __metadata:
   languageName: node
   linkType: hard
 
-"uuid@npm:^11.0.3":
-  version: 11.1.0
-  resolution: "uuid@npm:11.1.0"
-  bin:
-    uuid: dist/esm/bin/uuid
-  checksum: 840f19758543c4631e58a29439e51b5b669d5f34b4dd2700b6a1d15c5708c7a6e0c3e2c8c4a2eae761a3a7caa7e9884d00c86c02622ba91137bd3deade6b4b4a
-  languageName: node
-  linkType: hard
-
 "uuid@npm:^9.0.0":
   version: 9.0.1
   resolution: "uuid@npm:9.0.1"
@@ -11845,6 +11951,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"varint@npm:^6.0.0":
+  version: 6.0.0
+  resolution: "varint@npm:6.0.0"
+  checksum: 7684113c9d497c01e40396e50169c502eb2176203219b96e1c5ac965a3e15b4892bd22b7e48d87148e10fffe638130516b6dbeedd0efde2b2d0395aa1772eea7
+  languageName: node
+  linkType: hard
+
 "vscode-jsonrpc@npm:8.2.0":
   version: 8.2.0
   resolution: "vscode-jsonrpc@npm:8.2.0"
@@ -11925,6 +12038,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"web-encoding@npm:^1.0.6":
+  version: 1.1.5
+  resolution: "web-encoding@npm:1.1.5"
+  dependencies:
+    "@zxing/text-encoding": 0.9.0
+    util: ^0.12.3
+  dependenciesMeta:
+    "@zxing/text-encoding":
+      optional: true
+  checksum: 2234a2b122f41006ce07859b3c0bf2e18f46144fda2907d5db0b571b76aa5c26977c646100ad9c00d2f8a4f6f2b848bc02147845d8c447ab365ec4eff376338d
+  languageName: node
+  linkType: hard
+
 "web-worker@npm:^1.2.0":
   version: 1.5.0
   resolution: "web-worker@npm:1.5.0"

From d9a68c9e66e0d8909699fa6d046ede09d15c89d1 Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 12:06:04 +0200
Subject: [PATCH 10/15] lint

---
 .../base/src/shared/components/Calendar.tsx   | 24 +++++++++----------
 1 file changed, 12 insertions(+), 12 deletions(-)

diff --git a/packages/base/src/shared/components/Calendar.tsx b/packages/base/src/shared/components/Calendar.tsx
index 64803ddda..1c0851018 100644
--- a/packages/base/src/shared/components/Calendar.tsx
+++ b/packages/base/src/shared/components/Calendar.tsx
@@ -12,14 +12,14 @@ function Calendar({ showOutsideDays = true, ...props }: CalendarProps) {
       weekStartsOn={1}
       components={{
         IconLeft: ({ ...props }) => <ChevronLeft color="currentColor" />,
-        IconRight: ({ ...props }) => <ChevronRight color="currentColor" />
+        IconRight: ({ ...props }) => <ChevronRight color="currentColor" />,
       }}
       modifiersStyles={{
         selected: {
           backgroundColor: 'var(--jp-layout-color2)',
           color: 'var(--jp-ui-font-color0)',
-          borderRadius: '0.275rem'
-        }
+          borderRadius: '0.275rem',
+        },
       }}
       styles={{
         root: {
@@ -30,15 +30,15 @@ function Calendar({ showOutsideDays = true, ...props }: CalendarProps) {
           border: '1px solid var(--jp-border-color0)',
           borderRadius: 'var(--jp-border-radius)',
           padding: '0.5rem',
-          position: 'relative'
+          position: 'relative',
         },
         table: {
-          paddingTop: '1rem'
+          paddingTop: '1rem',
         },
         head_cell: {
-          color: 'var(--muted-foreground)',
+          color: 'var(--jp-ui-font-color0)',
           fontSize: '0.8rem',
-          fontWeight: 400
+          fontWeight: 400,
         },
         day: {
           backgroundColor: 'var(--jp-layout-color0)',
@@ -47,12 +47,12 @@ function Calendar({ showOutsideDays = true, ...props }: CalendarProps) {
           border: 'none',
           padding: '0.5rem',
           margin: 'auto',
-          fontSize: '0.8rem'
+          fontSize: '0.8rem',
         },
         caption: {
           display: 'flex',
           alignItems: 'center',
-          justifyContent: 'center'
+          justifyContent: 'center',
         },
         nav_button_previous: {
           color: 'var(--jp-ui-font-color0)',
@@ -64,7 +64,7 @@ function Calendar({ showOutsideDays = true, ...props }: CalendarProps) {
           borderRadius: 'var(--jp-border-radius)',
           padding: '0.175rem',
           width: 'max-content',
-          height: 'max-content'
+          height: 'max-content',
         },
         nav_button_next: {
           color: 'var(--jp-ui-font-color0)',
@@ -76,8 +76,8 @@ function Calendar({ showOutsideDays = true, ...props }: CalendarProps) {
           borderRadius: 'var(--jp-border-radius)',
           padding: '0.175rem',
           width: 'max-content',
-          height: 'max-content'
-        }
+          height: 'max-content',
+        },
       }}
       {...props}
     />

From 8a0fa252299fef1c81a39d4fbeb164ccbc0d1480 Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 12:11:04 +0200
Subject: [PATCH 11/15] Woops

---
 packages/base/package.json | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/packages/base/package.json b/packages/base/package.json
index 8c176137f..c13842e5d 100644
--- a/packages/base/package.json
+++ b/packages/base/package.json
@@ -91,7 +91,9 @@
     "react-day-picker": "8.10.1",
     "shpjs": "^6.1.0",
     "styled-components": "^5.3.6",
-    "three": "^0.135.0"
+    "three": "^0.135.0",
+    "three-mesh-bvh": "^0.5.17",
+    "uuid": "^11.0.3"
   },
   "devDependencies": {
     "@apidevtools/json-schema-ref-parser": "^9.0.9",

From 0b6e508c88b0f0705c2c024d639c239b4294325b Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 12:16:55 +0200
Subject: [PATCH 12/15] Use jupyter css vars

---
 packages/base/style/shared/button.css     | 70 +++++++++++++--------
 packages/base/style/shared/pagination.css | 75 +++++++++++++++--------
 packages/base/style/shared/popover.css    |  7 ++-
 packages/base/style/shared/tabs.css       | 29 +++++----
 packages/base/style/shared/toggle.css     | 18 +++---
 5 files changed, 127 insertions(+), 72 deletions(-)

diff --git a/packages/base/style/shared/button.css b/packages/base/style/shared/button.css
index e75335fbe..02dc6a076 100644
--- a/packages/base/style/shared/button.css
+++ b/packages/base/style/shared/button.css
@@ -7,9 +7,10 @@
   font-size: 0.875rem;
   font-weight: 600;
   outline: none;
-  background-color: hsl(var(--jp-layout-color0));
-  color: white;
-  border: 0.0375rem solid hsl(var(--jp-border-color0) / 0.8);
+  background-color: var(--jp-layout-color0);
+  color: var(--jp-ui-font-color0);
+  border: 0.0375rem solid
+    color-mix(in srgb, var(--jp-accent-color0), transparent 20%);
   transition: background-color 0.2s ease;
   height: 2.5rem;
   padding-left: 1rem;
@@ -21,13 +22,18 @@
 
 .Button:hover {
   cursor: pointer;
-  background-color: hsl(var(--jp-layout-color2) / 0.8);
+  background-color: color-mix(
+    in srgb,
+    var(--jp-layout-color2),
+    transparent 20%
+  );
   transition: background-color 0.2s ease;
 }
 
 .Button:focus-visible {
   outline: none;
-  box-shadow: 0 0 0 3px hsl(var(--jp-ui-font-color0) / 0.5);
+  box-shadow: 0 0 0 3px
+    color-mix(in srgb, var(--jp-ui-font-color0), transparent 50%);
 }
 
 .Button:disabled {
@@ -41,19 +47,19 @@
 }
 
 .Button[data-variant='destructive'] {
-  background-color: hsl(var(--destructive));
-  color: hsl(var(--destructive-foreground));
+  background-color: var(--jp-error-color0);
+  color: var(--jp-ui-font-color0);
   transition: background-color 0.2s ease;
 }
 
 .Button[data-variant='destructive']:hover {
-  background-color: hsl(var(--destructive) / 0.9);
+  background-color: color-mix(in srgb, var(--jp-error-color0), transparent 10%);
 }
 
 .Button[data-variant='outline'] {
-  border: 1px solid hsl(var(--jp-border-color0));
-  background-color: hsl(var(--jp-layout-color0));
-  color: hsl(var(--jp-ui-font-color0));
+  border: 1px solid var(--jp-border-color0);
+  background-color: var(--jp-layout-color0);
+  color: var(--jp-ui-font-color0);
   transition:
     background-color 0.2s ease,
     color 0.2s ease;
@@ -61,34 +67,46 @@
 
 .Button[data-variant='outline']:hover {
   cursor: pointer;
-  background-color: hsl(var(--jp-ui-font-color0) / 0.05);
-  color: hsl(var(--jp-ui-font-color2));
+  background-color: color-mix(
+    in srgb,
+    var(--jp-ui-font-color0),
+    transparent 95%
+  );
+  color: var(--jp-ui-font-color2);
 }
 
 .Button[data-variant='secondary'] {
-  background-color: hsl(var(--jp-layout-color2));
-  color: hsl(var(--jp-ui-font-color2));
+  background-color: var(--jp-layout-color2);
+  color: var(--jp-ui-font-color2);
   transition: background-color 0.2s ease;
 }
 
 .Button[data-variant='secondary']:hover {
-  background-color: hsl(var(--jp-layout-color2) / 0.9);
+  background-color: color-mix(
+    in srgb,
+    var(--jp-layout-color2),
+    transparent 10%
+  );
 }
 
 .Button[data-variant='ghost'] {
   background-color: transparent;
   border: 1px solid transparent;
-  color: hsl(var(--jp-ui-font-color0));
+  color: var(--jp-ui-font-color0);
   display: flex;
   align-items: center;
 }
 
 .Button[data-variant='ghost']:hover {
-  background-color: hsl(var(--jp-ui-font-color0) / 0.1);
+  background-color: color-mix(
+    in srgb,
+    var(--jp-ui-font-color0),
+    transparent 90%
+  );
 }
 
 .Button[data-variant='link'] {
-  color: hsl(var(--jp-ui-font-color0));
+  color: var(--jp-ui-font-color0);
   background-color: transparent;
   text-decoration: none;
   transition: text-decoration 0.2s ease;
@@ -99,14 +117,14 @@
 }
 
 .Button[data-variant='link']:hover {
-  color: hsl(var(--jp-layout-color0));
-  text-decoration-color: hsl(var(--jp-ui-font-color0));
+  color: var(--jp-layout-color0);
+  text-decoration-color: var(--jp-ui-font-color0);
 }
 
 .Button[data-variant='icon'] {
-  background-color: hsl(var(--jp-ui-font-color0));
+  background-color: var(--jp-ui-font-color0);
   border: none;
-  color: hsl(var(--jp-layout-color0));
+  color: var(--jp-layout-color0);
   display: flex;
   align-items: center;
   justify-content: center;
@@ -117,7 +135,11 @@
 }
 
 .Button[data-variant='icon']:hover {
-  background-color: hsl(var(--jp-accent-color0) / 0.8);
+  background-color: color-mix(
+    in srgb,
+    var(--jp-accent-color0),
+    transparent 20%
+  );
 }
 
 /* sizing */
diff --git a/packages/base/style/shared/pagination.css b/packages/base/style/shared/pagination.css
index a239cee28..9ebe177c7 100644
--- a/packages/base/style/shared/pagination.css
+++ b/packages/base/style/shared/pagination.css
@@ -11,7 +11,7 @@
   margin-right: auto;
   display: flex;
   width: 100%;
-  justify-content: center;
+  justify-content: space-evenly;
   list-style-type: none;
   gap: 0.25rem;
   padding-left: unset;
@@ -30,24 +30,30 @@
   transition-duration: 0.2s;
   transition-timing-function: ease;
   outline: none;
-  background-color: hsl(var(--primary));
-  color: hsl(var(--primary-foreground));
-  border: 0.0375rem solid hsl(var(--jp-border-color0) / 0.8);
+  background-color: var(--jp-layout-color0);
+  color: var(--jp-ui-font-color0);
+  border: 0.0375rem solid
+    color-mix(in srgb, var(--jp-border-color0), transparent 80%);
   transition: background-color 0.2s ease;
   /* height: 2.5rem;
   padding-left: 1rem;
   padding-right: 1rem; */
-  padding-top: 0.25rem;
-  padding-bottom: 0.25rem;
+  padding: 0.25rem;
+  /* padding-bottom: 0.25rem; */
 }
 
 .PaginationLink:hover {
-  background-color: hsl(var(--primary), 0.9);
+  background-color: color-mix(
+    in srgb,
+    var(--jp-layout-color0),
+    transparent 90%
+  );
 }
 
 .PaginationLink:focus-visible {
   outline: none;
-  box-shadow: 0 0 0 3px hsl(var(--background) / 0.5);
+  box-shadow: 0 0 0 3px
+    color-mix(in srgb, var(--jp-layout-color2), transparent 50%);
 }
 
 .PaginationLink:disabled {
@@ -61,47 +67,57 @@
 }
 
 .PaginationLink[data-variant='destructive'] {
-  background-color: hsl(var(--destructive));
-  color: hsl(var(--destructive-foreground));
+  background-color: var(--jp-error-color0);
+  color: var(--jp-ui-font-color0);
   transition: background-color 0.2s ease;
 }
 
 .PaginationLink[data-variant='destructive']:hover {
-  background-color: hsl(var(--destructive), 0.9);
+  background-color: color-mix(in srgb, var(--jp-error-color0), transparent 90%);
 }
 
 .PaginationLink[data-variant='outline'] {
-  border: 1px solid var(--jp-border-color0);
-  background-color: var(----jp-layout-color2);
+  border: 1px solid var(--jp-accent-color0);
+  background-color: var(--jp-layout-color2);
   transition:
     background-color 0.2s ease,
     color 0.2s ease;
 }
 
+.PaginationLink[data-variant='ghost']:hover,
 .PaginationLink[data-variant='outline']:hover {
-  /* background-color: hsl(var(--accent));
-  color: hsl(var(--accent-foreground)); */
-  background-color: purple;
-  color: peru;
+  background-color: var(--jp-accent-color0);
+  color: var(--jp-ui-inverse-font-color0);
+  /* background-color: color-mix(
+    in srgb,
+    var(--jp-accent-color0),
+    transparent 80%
+  );
+  color: color-mix(in srgb, var(--jp-ui-inverse-font-color0), transparent 80%); */
 }
 
 .PaginationLink[data-variant='secondary'] {
-  background-color: hsl(var(--secondary));
-  color: hsl(var(--secondary-foreground));
+  background-color: var(--jp-layout-color2);
+  color: var(--jp-ui-font-color2);
   transition: background-color 0.2s ease;
 }
 
 .PaginationLink[data-variant='secondary']:hover {
-  background-color: hsl(var(--secondary) / 0.8);
+  background-color: color-mix(
+    in srgb,
+    var(--jp-layout-color0),
+    transparent 80%
+  );
 }
 
+/* .PaginationLink[data-variant='ghost']:hover */
 .PaginationLink[data-variant='ghost'] {
-  background-color: hsl(var(--accent));
-  color: hsl(var(--accent-foreground));
+  background-color: var(--jp-layout-color0);
+  color: var(--jp-ui-font-color0);
 }
 
 .PaginationLink[data-variant='link'] {
-  color: hsl(var(--primary));
+  color: var(--jp-ui-font-color0);
   text-decoration: underline;
   text-underline-offset: 0.25rem;
   transition: text-decoration 0.2s ease;
@@ -110,8 +126,9 @@
 }
 
 .PaginationLink[data-variant='link']:hover {
-  color: hsl(var(--primary) / 0.8);
-  text-decoration-color: hsl(var(--primary));
+  /* color: hsl(var(--jp-ui-font-color0) / 0.8); */
+  color: color-mix(in srgb, var(--jp-ui-font-color0), transparent 80%);
+  text-decoration-color: var(--jp-ui-font-color0);
 }
 
 /* sizing */
@@ -130,7 +147,7 @@
 }
 
 .PaginationLink[data-size='icon'] {
-  /* height: 2.5rem; */
+  height: 1.5rem;
   width: 1.5rem;
 }
 
@@ -139,6 +156,9 @@
   padding-left: 0.625rem;
   display: flex;
   cursor: pointer;
+  margin-right: 0.5rem;
+  color: var(--jp-ui-font-color0);
+  background-color: var(--jp-layout-color1);
 }
 
 .PaginationNext {
@@ -146,6 +166,9 @@
   padding-right: 0.625rem;
   display: flex;
   cursor: pointer;
+  margin-left: 0.5rem;
+  color: var(--jp-ui-font-color0);
+  background-color: var(--jp-layout-color1);
 }
 
 .PaginationEllipsis {
diff --git a/packages/base/style/shared/popover.css b/packages/base/style/shared/popover.css
index 75995a4c5..a2be5bb3b 100644
--- a/packages/base/style/shared/popover.css
+++ b/packages/base/style/shared/popover.css
@@ -21,9 +21,10 @@
   width: 18rem;
   border-radius: 0.375rem;
   border-width: 1px;
-  background-color: hsl(var(--jp-layout-color0));
-  color: hsl(var(--foreground));
-  box-shadow: 0 4px 6px hsl(var(--jp-ui-font-color0) / 0.1);
+  background-color: var(--jp-layout-color0);
+  color: var(--jp-ui-font-color0);
+  box-shadow: 0 4px 6px
+    color-mix(in srgb, var(--jp-ui-font-color0), transparent 90%);
   z-index: 50;
 }
 
diff --git a/packages/base/style/shared/tabs.css b/packages/base/style/shared/tabs.css
index 64a40681b..4cdbaa3f3 100644
--- a/packages/base/style/shared/tabs.css
+++ b/packages/base/style/shared/tabs.css
@@ -2,11 +2,13 @@
   display: inline-flex;
   height: 2.5rem;
   align-items: center;
-  justify-content: center;
+  justify-content: space-evenly;
   border-radius: 0.375rem;
-  background-color: hsl(var(--muted));
+  background-color: var(--jp-layout-color2);
   padding: 0.25rem;
-  color: hsl(var(--muted-foreground));
+  color: var(--jp-ui-font-color0);
+  gap: 1rem;
+  width: 100%;
 }
 
 .TabsTrigger {
@@ -15,17 +17,19 @@
   justify-content: center;
   white-space: nowrap;
   border-radius: 0.25rem;
-  padding: 0.75rem 1rem;
-  font-size: 0.875rem;
+  padding: 0.25rem 0.5rem;
+  font-size: var(--jp-ui-font-size2);
   font-weight: 500;
   outline: none;
   transition: all 0.3s ease;
+  border: 1px solid transparent;
+  background-color: transparent;
 }
 
 .TabsTrigger:focus-visible {
   box-shadow:
-    0 0 0 2px hsl(var(--ring)),
-    0 0 0 4px hsl(var(--ring));
+    0 0 0 2px var(--jp-accent-color0),
+    0 0 0 4px var(--jp-accent-color0);
 }
 
 .TabsTrigger:disabled {
@@ -34,9 +38,10 @@
 }
 
 .TabsTrigger[data-state='active'] {
-  background-color: hsl(var(--background));
-  color: hsl(var(--foreground));
-  box-shadow: 0 1px 2px hsl(var(--backround) / 0.1);
+  background-color: var(--jp-layout-color2);
+  color: var(--jp-ui-font-color0);
+  box-shadow: 0 1px 2px
+    color-mix(in srgb, var(--jp-layout-color0), transparent 90%);
 }
 
 .TabsContent {
@@ -47,6 +52,6 @@
 .TabsContent:focus-visible {
   outline: none;
   box-shadow:
-    0 0 0 2px hsl(var(--ring)),
-    0 0 0 4px hsl(var(--ring));
+    0 0 0 2px var(--jp-accent-color0),
+    0 0 0 4px var(--jp-accent-color0);
 }
diff --git a/packages/base/style/shared/toggle.css b/packages/base/style/shared/toggle.css
index 92cb985c9..3100334b6 100644
--- a/packages/base/style/shared/toggle.css
+++ b/packages/base/style/shared/toggle.css
@@ -3,7 +3,7 @@
   align-items: center;
   justify-content: center;
   border-radius: 0.375rem;
-  font-size: 0.875rem;
+  font-size: var(--jp-ui-font-size1);
   font-weight: 500;
   padding: 0.5rem 1rem;
   transition:
@@ -16,14 +16,18 @@
 }
 
 .Toggle:hover {
-  background-color: var(--jp-ui-font-color0) / 0.1;
+  background-color: color-mix(
+    in srgb,
+    var(--jp-ui-font-color0),
+    transparent 90%
+  );
   color: var(--jp-ui-inverse-font-color0);
 }
 
 .Toggle:focus-visible {
   box-shadow:
-    0 0 0 2px var(--jp-border-color0),
-    0 0 0 4px var(--jp-border-color0);
+    0 0 0 2px var(--jp-accent-color0),
+    0 0 0 4px var(--jp-accent-color0);
 }
 
 .Toggle:disabled {
@@ -42,7 +46,7 @@
 }
 
 .ToggleOutline {
-  border: 1px solid var(--jp-border-color0);
+  border: 1px solid var(--jp-accent-color0);
   background-color: transparent;
   transition:
     background-color 0.3s,
@@ -52,7 +56,7 @@
 
 .ToggleOutline:hover {
   background-color: var(--jp-accent-color0);
-  color: var(--jp-ui-font-color0);
+  color: var(--jp-ui-inverse-font-color0);
 }
 
 .ToggleDefaultSize {
@@ -76,6 +80,6 @@
 .ToggleGroupContext {
   display: flex;
   align-items: center;
-  justify-content: center;
+  justify-content: start;
   gap: 0.25rem;
 }

From 752d93e96daa1ce821d9af4489e358d9e0f3afdd Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 12:29:42 +0200
Subject: [PATCH 13/15] Add sr-only class

---
 packages/base/style/base.css | 12 ++++++++++++
 1 file changed, 12 insertions(+)

diff --git a/packages/base/style/base.css b/packages/base/style/base.css
index 95f7358c6..d60223eca 100644
--- a/packages/base/style/base.css
+++ b/packages/base/style/base.css
@@ -63,3 +63,15 @@ button.jp-mod-styled.jp-mod-accept {
 button.jp-mod-styled.jp-mod-reject {
   background-color: var(--jp-layout-color4) !important;
 }
+
+.sr-only {
+  position: absolute;
+  width: 1px;
+  height: 1px;
+  padding: 0;
+  margin: -1px;
+  overflow: hidden;
+  clip: rect(0, 0, 0, 0);
+  white-space: nowrap;
+  border-width: 0;
+}

From 8a87e9c6701be06b6c6ec0acbe0b1770855df1db Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 12:51:16 +0200
Subject: [PATCH 14/15] Lint

---
 .../base/src/shared/components/Pagination.tsx   |  9 +++++----
 packages/base/src/shared/components/Popover.tsx |  1 +
 packages/base/src/shared/components/Tabs.tsx    |  1 +
 .../base/src/shared/components/ToggleGroup.tsx  | 17 +++++++++--------
 4 files changed, 16 insertions(+), 12 deletions(-)

diff --git a/packages/base/src/shared/components/Pagination.tsx b/packages/base/src/shared/components/Pagination.tsx
index 17be01faf..c2a97313b 100644
--- a/packages/base/src/shared/components/Pagination.tsx
+++ b/packages/base/src/shared/components/Pagination.tsx
@@ -1,5 +1,6 @@
 import { ChevronLeft, ChevronRight, MoreHorizontal } from 'lucide-react';
 import * as React from 'react';
+
 import { Button, ButtonProps } from './Button';
 
 const Pagination = ({ ...props }: React.ComponentProps<'nav'>) => (
@@ -59,7 +60,7 @@ const PaginationPrevious = ({
       style={{
         height: '1rem',
         width: '1rem',
-        flexShrink: 0
+        flexShrink: 0,
       }}
     />
     <span>Prev</span>
@@ -80,7 +81,7 @@ const PaginationNext = ({
       style={{
         height: '1rem',
         width: '1rem',
-        flexShrink: 0
+        flexShrink: 0,
       }}
     />
   </PaginationLink>
@@ -92,7 +93,7 @@ const PaginationEllipsis = ({ ...props }: React.ComponentProps<'span'>) => (
     <MoreHorizontal
       style={{
         height: '1rem',
-        width: '1rem'
+        width: '1rem',
       }}
     />
     <span className="sr-only">More pages</span>
@@ -107,5 +108,5 @@ export {
   PaginationItem,
   PaginationLink,
   PaginationNext,
-  PaginationPrevious
+  PaginationPrevious,
 };
diff --git a/packages/base/src/shared/components/Popover.tsx b/packages/base/src/shared/components/Popover.tsx
index 221c82f62..b5d72f9c0 100644
--- a/packages/base/src/shared/components/Popover.tsx
+++ b/packages/base/src/shared/components/Popover.tsx
@@ -1,5 +1,6 @@
 import * as PopoverPrimitive from '@radix-ui/react-popover';
 import * as React from 'react';
+
 import { cn } from './utils';
 
 function Popover({
diff --git a/packages/base/src/shared/components/Tabs.tsx b/packages/base/src/shared/components/Tabs.tsx
index 7b4cf5d39..cfe90cead 100644
--- a/packages/base/src/shared/components/Tabs.tsx
+++ b/packages/base/src/shared/components/Tabs.tsx
@@ -1,5 +1,6 @@
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 import * as React from 'react';
+
 import { cn } from './utils';
 
 function Tabs({
diff --git a/packages/base/src/shared/components/ToggleGroup.tsx b/packages/base/src/shared/components/ToggleGroup.tsx
index 898c08355..6c4e1de3e 100644
--- a/packages/base/src/shared/components/ToggleGroup.tsx
+++ b/packages/base/src/shared/components/ToggleGroup.tsx
@@ -1,31 +1,32 @@
 import * as ToggleGroupPrimitive from '@radix-ui/react-toggle-group';
 import { cva, type VariantProps } from 'class-variance-authority';
 import * as React from 'react';
+
 import { cn } from './utils';
 
 const toggleVariants = cva('Toggle', {
   variants: {
     variant: {
       default: 'ToggleDefault',
-      outline: 'ToggleOutline'
+      outline: 'ToggleOutline',
     },
     size: {
       default: 'ToggleDefaultSize',
       sm: 'ToggleSmallSize',
-      lg: 'ToggleLargeSize'
-    }
+      lg: 'ToggleLargeSize',
+    },
   },
   defaultVariants: {
     variant: 'default',
-    size: 'default'
-  }
+    size: 'default',
+  },
 });
 
 const ToggleGroupContext = React.createContext<
   VariantProps<typeof toggleVariants>
 >({
   size: 'default',
-  variant: 'default'
+  variant: 'default',
 });
 
 const ToggleGroup = React.forwardRef<
@@ -59,9 +60,9 @@ const ToggleGroupItem = React.forwardRef<
       className={cn(
         toggleVariants({
           variant: context.variant || variant,
-          size: context.size || size
+          size: context.size || size,
         }),
-        className
+        className,
       )}
       {...props}
     >

From 0d986e3b075c24203b73831bdd5a41d13f250e4e Mon Sep 17 00:00:00 2001
From: Greg <gregory.mooney@quantstack.net>
Date: Tue, 10 Jun 2025 14:42:13 +0200
Subject: [PATCH 15/15] Clean up

---
 packages/base/style/shared/pagination.css | 13 -------------
 1 file changed, 13 deletions(-)

diff --git a/packages/base/style/shared/pagination.css b/packages/base/style/shared/pagination.css
index 9ebe177c7..2fb1882ad 100644
--- a/packages/base/style/shared/pagination.css
+++ b/packages/base/style/shared/pagination.css
@@ -35,11 +35,7 @@
   border: 0.0375rem solid
     color-mix(in srgb, var(--jp-border-color0), transparent 80%);
   transition: background-color 0.2s ease;
-  /* height: 2.5rem;
-  padding-left: 1rem;
-  padding-right: 1rem; */
   padding: 0.25rem;
-  /* padding-bottom: 0.25rem; */
 }
 
 .PaginationLink:hover {
@@ -88,12 +84,6 @@
 .PaginationLink[data-variant='outline']:hover {
   background-color: var(--jp-accent-color0);
   color: var(--jp-ui-inverse-font-color0);
-  /* background-color: color-mix(
-    in srgb,
-    var(--jp-accent-color0),
-    transparent 80%
-  );
-  color: color-mix(in srgb, var(--jp-ui-inverse-font-color0), transparent 80%); */
 }
 
 .PaginationLink[data-variant='secondary'] {
@@ -110,7 +100,6 @@
   );
 }
 
-/* .PaginationLink[data-variant='ghost']:hover */
 .PaginationLink[data-variant='ghost'] {
   background-color: var(--jp-layout-color0);
   color: var(--jp-ui-font-color0);
@@ -126,12 +115,10 @@
 }
 
 .PaginationLink[data-variant='link']:hover {
-  /* color: hsl(var(--jp-ui-font-color0) / 0.8); */
   color: color-mix(in srgb, var(--jp-ui-font-color0), transparent 80%);
   text-decoration-color: var(--jp-ui-font-color0);
 }
 
-/* sizing */
 .PaginationLink[data-size='sm'] {
   height: 2.25rem;
   border-radius: 0.375rem;