@gv-tech/design-system 2.5.0 → 2.5.2

package/packages/ui-native/src/toast.tsx

@@ -1,88 +0,0 @@
-import * as ToastPrimitive from '@rn-primitives/toast';
-import { X } from 'lucide-react-native';
-import * as React from 'react';
-import Animated, { FadeInUp, FadeOutDown, Layout } from 'react-native-reanimated';
-
-import { cn } from './lib/utils';
-
-// Toast for native doesn't use a Provider or Viewport in the same way as web.
-// We export fragments if they are needed for structural parity in shared components.
-const ToastProvider = ({ children }: { children: React.ReactNode }) => <>{children}</>;
-const ToastViewport = () => null;
-
-const Toast = React.forwardRef<
-  React.ElementRef<typeof ToastPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof ToastPrimitive.Root> & { variant?: 'default' | 'destructive' }
->(({ className, variant = 'default', ...props }, ref) => {
-  return (
-    <ToastPrimitive.Root
-      ref={ref}
-      className={cn(
-        'group pointer-events-auto relative flex w-full items-center justify-between space-x-2 overflow-hidden rounded-md border p-4 pr-6 shadow-lg',
-        variant === 'default' ? 'border-border bg-background' : 'border-destructive bg-destructive',
-        className,
-      )}
-      {...props}
-    >
-      <Animated.View entering={FadeInUp} exiting={FadeOutDown} layout={Layout} className="flex-row items-center w-full">
-        {props.children}
-      </Animated.View>
-    </ToastPrimitive.Root>
-  );
-});
-Toast.displayName = ToastPrimitive.Root.displayName;
-
-const ToastTitle = React.forwardRef<
-  React.ElementRef<typeof ToastPrimitive.Title>,
-  React.ComponentPropsWithoutRef<typeof ToastPrimitive.Title>
->(({ className, ...props }, ref) => (
-  <ToastPrimitive.Title ref={ref} className={cn('text-sm font-semibold text-foreground', className)} {...props} />
-));
-ToastTitle.displayName = ToastPrimitive.Title.displayName;
-
-const ToastDescription = React.forwardRef<
-  React.ElementRef<typeof ToastPrimitive.Description>,
-  React.ComponentPropsWithoutRef<typeof ToastPrimitive.Description>
->(({ className, ...props }, ref) => (
-  <ToastPrimitive.Description
-    ref={ref}
-    className={cn('text-sm opacity-90 text-muted-foreground', className)}
-    {...props}
-  />
-));
-ToastDescription.displayName = ToastPrimitive.Description.displayName;
-
-const ToastClose = React.forwardRef<
-  React.ElementRef<typeof ToastPrimitive.Close>,
-  React.ComponentPropsWithoutRef<typeof ToastPrimitive.Close>
->(({ className, ...props }, ref) => (
-  <ToastPrimitive.Close
-    ref={ref}
-    className={cn(
-      'absolute right-1 top-1 rounded-md p-1 text-foreground/50 opacity-0 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-1 group-hover:opacity-100',
-      className,
-    )}
-    {...props}
-  >
-    <X size={16} className="text-muted-foreground" />
-  </ToastPrimitive.Close>
-));
-ToastClose.displayName = ToastPrimitive.Close.displayName;
-
-const ToastAction = React.forwardRef<
-  React.ElementRef<typeof ToastPrimitive.Action>,
-  React.ComponentPropsWithoutRef<typeof ToastPrimitive.Action>
->(({ className, ...props }, ref) => (
-  <ToastPrimitive.Action
-    ref={ref}
-    className={cn(
-      'inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-sm font-medium transition-colors hover:bg-secondary focus:outline-none focus:ring-1 focus:ring-ring disabled:pointer-events-none disabled:opacity-50',
-      className,
-    )}
-    {...props}
-  />
-));
-ToastAction.displayName = ToastPrimitive.Action.displayName;
-
-export type ToastProps = React.ComponentPropsWithoutRef<typeof Toast>;
-export { Toast, ToastAction, ToastClose, ToastDescription, ToastProvider, ToastTitle, ToastViewport };

package/packages/ui-native/src/toaster.tsx

@@ -1,9 +0,0 @@
-import { Text, View } from 'react-native';
-
-export function Toaster() {
-  return (
-    <View>
-      <Text>Toaster is not yet implemented for React Native</Text>
-    </View>
-  );
-}

package/packages/ui-native/src/toggle-group.tsx

@@ -1,78 +0,0 @@
-import { ToggleGroupBaseProps, ToggleGroupItemBaseProps } from '@gv-tech/ui-core';
-import * as ToggleGroupPrimitive from '@rn-primitives/toggle-group';
-import { type VariantProps } from 'class-variance-authority';
-import * as React from 'react';
-
-import { cn } from './lib/utils';
-import { TextClassContext } from './text';
-import { toggleVariants } from './toggle';
-
-const ToggleGroupContext = React.createContext<VariantProps<typeof toggleVariants>>({
-  size: 'default',
-  variant: 'default',
-});
-
-export interface ToggleGroupProps
-  extends
-    Omit<React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Root>, 'value' | 'onValueChange' | 'type'>,
-    ToggleGroupBaseProps {}
-
-const ToggleGroup = React.forwardRef<React.ElementRef<typeof ToggleGroupPrimitive.Root>, ToggleGroupProps>(
-  ({ className, variant, size, children, type, value, onValueChange, ...props }, ref) => (
-    <ToggleGroupPrimitive.Root
-      ref={ref}
-      {...({
-        type,
-        value,
-        onValueChange,
-      } as unknown as React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Root>)}
-      className={cn('flex flex-row items-center justify-center gap-1', className)}
-      {...props}
-    >
-      <ToggleGroupContext.Provider value={{ variant, size }}>{children}</ToggleGroupContext.Provider>
-    </ToggleGroupPrimitive.Root>
-  ),
-);
-
-ToggleGroup.displayName = ToggleGroupPrimitive.Root?.displayName || 'ToggleGroup';
-
-export interface ToggleGroupItemProps
-  extends
-    Omit<React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Item>, 'children' | 'disabled'>,
-    ToggleGroupItemBaseProps {}
-
-const ToggleGroupItem = React.forwardRef<React.ElementRef<typeof ToggleGroupPrimitive.Item>, ToggleGroupItemProps>(
-  ({ className, children, variant, size, value, ...props }, ref) => {
-    const context = React.useContext(ToggleGroupContext);
-
-    return (
-      <TextClassContext.Provider
-        value={cn(
-          'text-sm native:text-base text-foreground font-medium',
-          props.disabled && 'web:cursor-not-allowed opacity-50',
-          value === '' && 'text-accent-foreground',
-          className,
-        )}
-      >
-        <ToggleGroupPrimitive.Item
-          ref={ref}
-          value={value}
-          className={cn(
-            toggleVariants({
-              variant: context.variant || variant,
-              size: context.size || size,
-            }),
-            className,
-          )}
-          {...props}
-        >
-          {children}
-        </ToggleGroupPrimitive.Item>
-      </TextClassContext.Provider>
-    );
-  },
-);
-
-ToggleGroupItem.displayName = ToggleGroupPrimitive.Item?.displayName || 'ToggleGroupItem';
-
-export { ToggleGroup, ToggleGroupItem };

package/packages/ui-native/src/toggle.tsx

@@ -1,35 +0,0 @@
-import { ToggleBaseProps, toggleVariants } from '@gv-tech/ui-core';
-import * as TogglePrimitive from '@rn-primitives/toggle';
-import * as React from 'react';
-
-import { cn } from './lib/utils';
-import { TextClassContext } from './text';
-
-export interface ToggleProps
-  extends
-    Omit<React.ComponentPropsWithoutRef<typeof TogglePrimitive.Root>, 'pressed' | 'onPressedChange' | 'children'>,
-    ToggleBaseProps {}
-
-const Toggle = React.forwardRef<React.ElementRef<typeof TogglePrimitive.Root>, ToggleProps>(
-  ({ className, variant, size, ...props }, ref) => (
-    <TextClassContext.Provider
-      value={cn(
-        'text-sm native:text-base text-foreground font-medium',
-        props.pressed && 'text-accent-foreground',
-        className,
-      )}
-    >
-      <TogglePrimitive.Root
-        ref={ref}
-        className={cn(toggleVariants({ variant, size, className }))}
-        {...props}
-        pressed={props.pressed || false}
-        onPressedChange={props.onPressedChange || (() => {})}
-      />
-    </TextClassContext.Provider>
-  ),
-);
-
-Toggle.displayName = TogglePrimitive.Root?.displayName || 'Toggle';
-
-export { Toggle, toggleVariants };

package/packages/ui-native/src/tooltip.tsx

@@ -1,44 +0,0 @@
-import * as TooltipPrimitive from '@rn-primitives/tooltip';
-import * as React from 'react';
-import { Platform, StyleSheet } from 'react-native';
-import Animated, { FadeIn, FadeOut } from 'react-native-reanimated';
-
-import { cn } from './lib/utils';
-import { Text } from './text';
-
-const Tooltip = TooltipPrimitive.Root;
-
-const TooltipTrigger = TooltipPrimitive.Trigger;
-
-const TooltipContent = React.forwardRef<
-  React.ElementRef<typeof TooltipPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof TooltipPrimitive.Content> & {
-    portalHost?: string;
-  }
->(
-  (
-    { className, portalHost, ...props },
-    // eslint-disable-next-line @typescript-eslint/no-unused-vars
-    _ref,
-  ) => (
-    <TooltipPrimitive.Portal hostName={portalHost}>
-      <TooltipPrimitive.Overlay style={Platform.OS !== 'web' ? StyleSheet.absoluteFill : undefined}>
-        <Animated.View
-          entering={FadeIn}
-          exiting={FadeOut}
-          className={cn(
-            'z-50 overflow-hidden rounded-md border border-border bg-popover px-3 py-1.5 shadow-md web:animate-in web:fade-in-0 web:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2',
-            className,
-          )}
-        >
-          <Text className="text-sm text-popover-foreground native:text-base">{props.children}</Text>
-        </Animated.View>
-      </TooltipPrimitive.Overlay>
-    </TooltipPrimitive.Portal>
-  ),
-);
-TooltipContent.displayName = TooltipPrimitive.Content?.displayName || 'TooltipContent';
-
-const TooltipProvider = ({ children }: { children: React.ReactNode }) => <>{children}</>;
-
-export { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger };

package/packages/ui-native/tsconfig.json

@@ -1,23 +0,0 @@
-{
-  "compilerOptions": {
-    "target": "ES2020",
-    "module": "ESNext",
-    "moduleResolution": "bundler",
-    "declaration": true,
-    "declarationMap": true,
-    "sourceMap": true,
-    "strict": true,
-    "esModuleInterop": true,
-    "skipLibCheck": true,
-    "forceConsistentCasingInFileNames": true,
-    "jsx": "react-jsx",
-    "outDir": "dist",
-    "paths": {
-      "@gv-tech/design-tokens": ["../design-tokens/src"],
-      "@gv-tech/ui-core": ["../ui-core/src"],
-      "@/*": ["./src/*"]
-    },
-    "types": ["vitest/globals", "@testing-library/jest-dom"]
-  },
-  "include": ["src"]
-}

package/packages/ui-native/vite.config.ts

@@ -1,17 +0,0 @@
-import react from '@vitejs/plugin-react-swc';
-import { resolve } from 'path';
-import { defineConfig } from 'vitest/config';
-
-export default defineConfig({
-  plugins: [react()],
-  test: {
-    globals: true,
-    environment: 'jsdom',
-    setupFiles: [resolve(__dirname, '../../src/setupTests.ts')],
-  },
-  resolve: {
-    alias: {
-      'react-native': resolve(__dirname, '../../apps/playground-web/src/lib/react-native-shim.js'),
-    },
-  },
-});

package/packages/ui-web/CHANGELOG.md

@@ -1,8 +0,0 @@
-# Changelog
-
-## [0.1.0](https://github.com/Garcia-Ventures/gvtech-design/compare/ui-web-v0.0.1...ui-web-v0.1.0) (2026-02-20)
-
-
-### Features
-
-* **universal:** pivot to monorepo architecture and stabilize react native support ([#63](https://github.com/Garcia-Ventures/gvtech-design/issues/63)) ([3458938](https://github.com/Garcia-Ventures/gvtech-design/commit/3458938c17bdfc7a7f5eea0053b7bf1786a571fa))

package/packages/ui-web/package.json

@@ -1,84 +0,0 @@
-{
-  "name": "@gv-tech/ui-web",
-  "version": "0.1.0",
-  "description": "Web (DOM/Radix) implementations of the GV Tech design system components",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/Garcia-Ventures/gvtech-design.git",
-    "directory": "packages/ui-web"
-  },
-  "license": "MIT",
-  "author": "Eric N. Garcia <eng618@garciaericn.com>",
-  "exports": {
-    ".": {
-      "types": "./src/index.ts",
-      "default": "./src/index.ts"
-    },
-    "./*": {
-      "types": "./src/*/index.ts",
-      "default": "./src/*/index.ts"
-    }
-  },
-  "main": "src/index.ts",
-  "types": "src/index.ts",
-  "scripts": {
-    "build": "echo 'No build step — consumed as TS source by sibling packages'",
-    "lint": "echo 'Linted from workspace root'",
-    "test": "vitest run",
-    "typecheck": "yarn tsc --noEmit"
-  },
-  "dependencies": {
-    "@gv-tech/design-tokens": "workspace:*",
-    "@gv-tech/ui-core": "workspace:*",
-    "@hookform/resolvers": "^5.2.2",
-    "@radix-ui/react-accordion": "^1.2.12",
-    "@radix-ui/react-alert-dialog": "^1.1.15",
-    "@radix-ui/react-aspect-ratio": "^1.1.8",
-    "@radix-ui/react-avatar": "^1.1.11",
-    "@radix-ui/react-checkbox": "^1.3.3",
-    "@radix-ui/react-collapsible": "^1.1.12",
-    "@radix-ui/react-context-menu": "^2.2.16",
-    "@radix-ui/react-dialog": "^1.1.15",
-    "@radix-ui/react-dropdown-menu": "^2.1.16",
-    "@radix-ui/react-hover-card": "^1.1.15",
-    "@radix-ui/react-label": "^2.1.8",
-    "@radix-ui/react-menubar": "^1.1.16",
-    "@radix-ui/react-navigation-menu": "^1.2.14",
-    "@radix-ui/react-popover": "^1.1.15",
-    "@radix-ui/react-progress": "^1.1.8",
-    "@radix-ui/react-radio-group": "^1.3.8",
-    "@radix-ui/react-scroll-area": "^1.2.10",
-    "@radix-ui/react-select": "^2.2.6",
-    "@radix-ui/react-separator": "^1.1.8",
-    "@radix-ui/react-slider": "^1.3.6",
-    "@radix-ui/react-slot": "^1.2.4",
-    "@radix-ui/react-switch": "^1.2.6",
-    "@radix-ui/react-tabs": "^1.1.13",
-    "@radix-ui/react-toast": "^1.2.15",
-    "@radix-ui/react-toggle": "^1.1.10",
-    "@radix-ui/react-toggle-group": "^1.1.11",
-    "@radix-ui/react-tooltip": "^1.2.8",
-    "class-variance-authority": "^0.7.1",
-    "clsx": "^2.1.1",
-    "cmdk": "^1.1.1",
-    "date-fns": "^4.1.0",
-    "embla-carousel-react": "^8.6.0",
-    "lucide-react": "^0.563.0",
-    "react-day-picker": "^9.13.2",
-    "react-hook-form": "^7.71.1",
-    "react-resizable-panels": "^4.6.4",
-    "recharts": "2.15.4",
-    "sonner": "^2.0.7",
-    "tailwind-merge": "^3.4.1",
-    "vaul": "^1.1.2",
-    "zod": "^4.3.6"
-  },
-  "peerDependencies": {
-    "react": ">=18",
-    "react-dom": ">=18"
-  },
-  "publishConfig": {
-    "access": "public",
-    "provenance": true
-  }
-}

package/packages/ui-web/src/accordion.test.tsx

@@ -1,86 +0,0 @@
-import { render, screen, waitFor } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { describe, expect, it } from 'vitest';
-import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from './accordion';
-
-describe('Accordion', () => {
-  it('renders correctly', () => {
-    render(
-      <Accordion type="single" collapsible>
-        <AccordionItem value="item-1">
-          <AccordionTrigger>Trigger 1</AccordionTrigger>
-          <AccordionContent>Content 1</AccordionContent>
-        </AccordionItem>
-      </Accordion>,
-    );
-
-    expect(screen.getByText('Trigger 1')).toBeInTheDocument();
-    // Content should not be visible initially
-    expect(screen.queryByText('Content 1')).not.toBeInTheDocument();
-  });
-
-  it('expands when clicked', async () => {
-    render(
-      <Accordion type="single" collapsible>
-        <AccordionItem value="item-1">
-          <AccordionTrigger>Trigger 1</AccordionTrigger>
-          <AccordionContent>Content 1</AccordionContent>
-        </AccordionItem>
-      </Accordion>,
-    );
-
-    const trigger = screen.getByText('Trigger 1');
-    await userEvent.click(trigger);
-
-    await waitFor(() => {
-      expect(screen.getByText('Content 1')).toBeVisible();
-    });
-  });
-
-  it('collapses when clicked again', async () => {
-    render(
-      <Accordion type="single" collapsible defaultValue="item-1">
-        <AccordionItem value="item-1">
-          <AccordionTrigger>Trigger 1</AccordionTrigger>
-          <AccordionContent>Content 1</AccordionContent>
-        </AccordionItem>
-      </Accordion>,
-    );
-
-    // Initial state open
-    expect(screen.getByText('Content 1')).toBeVisible();
-
-    const trigger = screen.getByText('Trigger 1');
-    await userEvent.click(trigger);
-
-    await waitFor(() => {
-      expect(screen.queryByText('Content 1')).not.toBeInTheDocument();
-    });
-  });
-
-  it('handles single mode correctly', async () => {
-    render(
-      <Accordion type="single" collapsible>
-        <AccordionItem value="item-1">
-          <AccordionTrigger>Trigger 1</AccordionTrigger>
-          <AccordionContent>Content 1</AccordionContent>
-        </AccordionItem>
-        <AccordionItem value="item-2">
-          <AccordionTrigger>Trigger 2</AccordionTrigger>
-          <AccordionContent>Content 2</AccordionContent>
-        </AccordionItem>
-      </Accordion>,
-    );
-
-    // Click item 1
-    await userEvent.click(screen.getByText('Trigger 1'));
-    await waitFor(() => expect(screen.getByText('Content 1')).toBeVisible());
-
-    // Click item 2
-    await userEvent.click(screen.getByText('Trigger 2'));
-    await waitFor(() => expect(screen.getByText('Content 2')).toBeVisible());
-
-    // Item 1 should be closed
-    await waitFor(() => expect(screen.queryByText('Content 1')).not.toBeInTheDocument());
-  });
-});

package/packages/ui-web/src/accordion.tsx

@@ -1,58 +0,0 @@
-import * as AccordionPrimitive from '@radix-ui/react-accordion';
-import { ChevronDown } from 'lucide-react';
-import * as React from 'react';
-
-import {
-  AccordionBaseProps,
-  AccordionContentBaseProps,
-  AccordionItemBaseProps,
-  AccordionTriggerBaseProps,
-} from '@gv-tech/ui-core';
-import { cn } from './lib/utils';
-
-const Accordion = AccordionPrimitive.Root;
-
-const AccordionItem = React.forwardRef<
-  React.ElementRef<typeof AccordionPrimitive.Item>,
-  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item> & AccordionItemBaseProps
->(({ className, ...props }, ref) => (
-  <AccordionPrimitive.Item ref={ref} className={cn('border-b', className)} {...props} />
-));
-AccordionItem.displayName = 'AccordionItem';
-
-const AccordionTrigger = React.forwardRef<
-  React.ElementRef<typeof AccordionPrimitive.Trigger>,
-  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger> & AccordionTriggerBaseProps
->(({ className, children, ...props }, ref) => (
-  <AccordionPrimitive.Header className="flex">
-    <AccordionPrimitive.Trigger
-      ref={ref}
-      className={cn(
-        'flex flex-1 items-center justify-between py-4 text-sm font-medium transition-all hover:underline text-left [&[data-state=open]>svg]:rotate-180',
-        className,
-      )}
-      {...props}
-    >
-      {children}
-      <ChevronDown className="h-4 w-4 shrink-0 text-muted-foreground transition-transform duration-200" />
-    </AccordionPrimitive.Trigger>
-  </AccordionPrimitive.Header>
-));
-AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
-
-const AccordionContent = React.forwardRef<
-  React.ElementRef<typeof AccordionPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content> & AccordionContentBaseProps
->(({ className, children, ...props }, ref) => (
-  <AccordionPrimitive.Content
-    ref={ref}
-    className="overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
-    {...props}
-  >
-    <div className={cn('pb-4 pt-0', className)}>{children}</div>
-  </AccordionPrimitive.Content>
-));
-AccordionContent.displayName = AccordionPrimitive.Content.displayName;
-
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
-export type { AccordionBaseProps as AccordionProps };

package/packages/ui-web/src/alert-dialog.test.tsx

@@ -1,91 +0,0 @@
-import { render, screen, waitFor } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { describe, expect, it } from 'vitest';
-import {
-  AlertDialog,
-  AlertDialogAction,
-  AlertDialogCancel,
-  AlertDialogContent,
-  AlertDialogDescription,
-  AlertDialogFooter,
-  AlertDialogHeader,
-  AlertDialogTitle,
-  AlertDialogTrigger,
-} from '.';
-
-describe('AlertDialog', () => {
-  it('renders correctly', async () => {
-    render(
-      <AlertDialog>
-        <AlertDialogTrigger>Open</AlertDialogTrigger>
-        <AlertDialogContent>
-          <AlertDialogHeader>
-            <AlertDialogTitle>Are you sure?</AlertDialogTitle>
-            <AlertDialogDescription>This action cannot be undone.</AlertDialogDescription>
-          </AlertDialogHeader>
-          <AlertDialogFooter>
-            <AlertDialogCancel>Cancel</AlertDialogCancel>
-            <AlertDialogAction>Continue</AlertDialogAction>
-          </AlertDialogFooter>
-        </AlertDialogContent>
-      </AlertDialog>,
-    );
-
-    expect(screen.getByText('Open')).toBeInTheDocument();
-    expect(screen.queryByText('Are you sure?')).not.toBeInTheDocument();
-
-    await userEvent.click(screen.getByText('Open'));
-
-    await waitFor(() => {
-      expect(screen.getByRole('alertdialog')).toBeInTheDocument();
-      expect(screen.getByText('Are you sure?')).toBeInTheDocument();
-      expect(screen.getByText('This action cannot be undone.')).toBeInTheDocument();
-    });
-  });
-
-  it('closes when cancel is clicked', async () => {
-    render(
-      <AlertDialog>
-        <AlertDialogTrigger>Open</AlertDialogTrigger>
-        <AlertDialogContent>
-          <AlertDialogHeader>
-            <AlertDialogTitle>Are you sure?</AlertDialogTitle>
-            <AlertDialogDescription>This action cannot be undone.</AlertDialogDescription>
-          </AlertDialogHeader>
-          <AlertDialogFooter>
-            <AlertDialogCancel>Cancel</AlertDialogCancel>
-          </AlertDialogFooter>
-        </AlertDialogContent>
-      </AlertDialog>,
-    );
-
-    await userEvent.click(screen.getByText('Open'));
-    await waitFor(() => expect(screen.getByRole('alertdialog')).toBeInTheDocument());
-
-    await userEvent.click(screen.getByText('Cancel'));
-    await waitFor(() => expect(screen.queryByRole('alertdialog')).not.toBeInTheDocument());
-  });
-
-  it('closes when action is clicked', async () => {
-    render(
-      <AlertDialog>
-        <AlertDialogTrigger>Open</AlertDialogTrigger>
-        <AlertDialogContent>
-          <AlertDialogHeader>
-            <AlertDialogTitle>Are you sure?</AlertDialogTitle>
-            <AlertDialogDescription>This action cannot be undone.</AlertDialogDescription>
-          </AlertDialogHeader>
-          <AlertDialogFooter>
-            <AlertDialogAction>Continue</AlertDialogAction>
-          </AlertDialogFooter>
-        </AlertDialogContent>
-      </AlertDialog>,
-    );
-
-    await userEvent.click(screen.getByText('Open'));
-    await waitFor(() => expect(screen.getByRole('alertdialog')).toBeInTheDocument());
-
-    await userEvent.click(screen.getByText('Continue'));
-    await waitFor(() => expect(screen.queryByRole('alertdialog')).not.toBeInTheDocument());
-  });
-});