From 95162fa015d7d2b2f611b9d7c39f90d032a66610 Mon Sep 17 00:00:00 2001 From: Ivan Vasilov Date: Mon, 23 Sep 2024 16:45:39 +0200 Subject: [PATCH] Clean up the dependencies in design-system app. --- .../design-system/components/command-menu.tsx | 4 +--- .../components/component-props.tsx | 1 - apps/design-system/components/copy-button.tsx | 3 +-- .../content/docs/components/tree-view.mdx | 3 +-- apps/design-system/package.json | 9 ++----- .../example/dropdown-menu-checkboxes.tsx | 2 +- .../default/example/input-otp-pattern.tsx | 4 +--- .../default/example/tree-view-demo.tsx | 3 +-- .../default/example/tree-view-directories.tsx | 3 +-- .../default/example/tree-view-edit.tsx | 3 +-- .../example/tree-view-multi-select.tsx | 3 +-- .../components/shadcn/ui/dropdown-menu.tsx | 6 +++++ .../ui/src/components/shadcn/ui/input-otp.tsx | 4 ++-- pnpm-lock.yaml | 24 ++----------------- 14 files changed, 21 insertions(+), 51 deletions(-) diff --git a/apps/design-system/components/command-menu.tsx b/apps/design-system/components/command-menu.tsx index a770e33d315..a9fd471aaa9 100644 --- a/apps/design-system/components/command-menu.tsx +++ b/apps/design-system/components/command-menu.tsx @@ -2,7 +2,6 @@ import * as React from 'react' import { useRouter } from 'next/navigation' -import { DialogProps } from '@radix-ui/react-alert-dialog' import { CircleIcon, LaptopIcon, MoonIcon, SunIcon } from 'lucide-react' import { useTheme } from 'next-themes' @@ -19,7 +18,7 @@ import { CommandSeparator_Shadcn_, } from 'ui' -export function CommandMenu({ ...props }: DialogProps) { +export function CommandMenu() { const router = useRouter() const [open, setOpen] = React.useState(false) const { setTheme } = useTheme() @@ -60,7 +59,6 @@ export function CommandMenu({ ...props }: DialogProps) { ` )} onClick={() => setOpen(true)} - {...props} > Search Design System... Search... diff --git a/apps/design-system/components/component-props.tsx b/apps/design-system/components/component-props.tsx index de41a1ac42e..fa173cf3e77 100644 --- a/apps/design-system/components/component-props.tsx +++ b/apps/design-system/components/component-props.tsx @@ -1,4 +1,3 @@ -import fs from 'fs' import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from 'ui' // import { parse } from 'react-docgen' diff --git a/apps/design-system/components/copy-button.tsx b/apps/design-system/components/copy-button.tsx index ed823d518c6..16b89ce5e9c 100644 --- a/apps/design-system/components/copy-button.tsx +++ b/apps/design-system/components/copy-button.tsx @@ -1,12 +1,11 @@ 'use client' import * as React from 'react' -import { DropdownMenuTriggerProps } from '@radix-ui/react-dropdown-menu' // import { NpmCommands } from 'types/unist' // import { Event, trackEvent } from '@/lib/events' -import { cn } from 'ui' +import { cn, DropdownMenuTriggerProps } from 'ui' import { Button } from 'ui' import { DropdownMenu, DropdownMenuContent, DropdownMenuItem, DropdownMenuTrigger } from 'ui' import { Check, Copy } from 'lucide-react' diff --git a/apps/design-system/content/docs/components/tree-view.mdx b/apps/design-system/content/docs/components/tree-view.mdx index afd4b2b65c5..55c76afa7c9 100644 --- a/apps/design-system/content/docs/components/tree-view.mdx +++ b/apps/design-system/content/docs/components/tree-view.mdx @@ -14,8 +14,7 @@ source: ## Usage ```tsx -import { TreeView, TreeViewItem } from 'ui' -import { flattenTree } from 'react-accessible-treeview' +import { TreeView, TreeViewItem, flattenTree } from 'ui' ``` ```tsx diff --git a/apps/design-system/package.json b/apps/design-system/package.json index df592603216..96e28107abe 100644 --- a/apps/design-system/package.json +++ b/apps/design-system/package.json @@ -13,15 +13,11 @@ "typecheck": "contentlayer2 build && tsc --noEmit -p tsconfig.json" }, "dependencies": { - "@hookform/resolvers": "^3.1.1", - "@radix-ui/react-alert-dialog": "^1.0.5", - "@radix-ui/react-dropdown-menu": "^2.0.6", + "@hookform/resolvers": "*", "clsx": "^1.2.1", "contentlayer2": "0.4.6", "eslint-config-supabase": "workspace:*", - "fs": "^0.0.1-security", "icons": "workspace:*", - "input-otp": "^1.2.3", "jotai": "^2.8.0", "lodash.template": "4.5.0", "lucide-react": "*", @@ -30,10 +26,9 @@ "next-contentlayer2": "0.4.6", "next-themes": "^0.3.0", "react": "^18.2.0", - "react-accessible-treeview": "^2.8.3", "react-docgen": "^7.0.3", "react-dom": "^18.2.0", - "react-hook-form": "^7.45.0", + "react-hook-form": "*", "react-inlinesvg": "^4.0.4", "react-wrap-balancer": "^1.1.0", "recharts": "^2.12.7", diff --git a/apps/design-system/registry/default/example/dropdown-menu-checkboxes.tsx b/apps/design-system/registry/default/example/dropdown-menu-checkboxes.tsx index 048d60d750d..f078463327f 100644 --- a/apps/design-system/registry/default/example/dropdown-menu-checkboxes.tsx +++ b/apps/design-system/registry/default/example/dropdown-menu-checkboxes.tsx @@ -1,7 +1,6 @@ 'use client' import * as React from 'react' -import { DropdownMenuCheckboxItemProps } from '@radix-ui/react-dropdown-menu' import { Button } from 'ui' import { @@ -11,6 +10,7 @@ import { DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, + DropdownMenuCheckboxItemProps, } from 'ui' type Checked = DropdownMenuCheckboxItemProps['checked'] diff --git a/apps/design-system/registry/default/example/input-otp-pattern.tsx b/apps/design-system/registry/default/example/input-otp-pattern.tsx index ce136748fc7..2d605de5181 100644 --- a/apps/design-system/registry/default/example/input-otp-pattern.tsx +++ b/apps/design-system/registry/default/example/input-otp-pattern.tsx @@ -1,6 +1,4 @@ -import { REGEXP_ONLY_DIGITS_AND_CHARS } from 'input-otp' - -import { InputOTP, InputOTPGroup, InputOTPSlot } from 'ui' +import { InputOTP, InputOTPGroup, InputOTPSlot, REGEXP_ONLY_DIGITS_AND_CHARS } from 'ui' export default function InputOTPPattern() { return ( diff --git a/apps/design-system/registry/default/example/tree-view-demo.tsx b/apps/design-system/registry/default/example/tree-view-demo.tsx index 1f9c3094695..022084ee7fb 100644 --- a/apps/design-system/registry/default/example/tree-view-demo.tsx +++ b/apps/design-system/registry/default/example/tree-view-demo.tsx @@ -1,5 +1,4 @@ -import { TreeView, TreeViewItem } from 'ui' -import { flattenTree } from 'react-accessible-treeview' +import { flattenTree, TreeView, TreeViewItem } from 'ui' export default function TreeViewDemo() { const data = { diff --git a/apps/design-system/registry/default/example/tree-view-directories.tsx b/apps/design-system/registry/default/example/tree-view-directories.tsx index 78071a743f3..e895afb1298 100644 --- a/apps/design-system/registry/default/example/tree-view-directories.tsx +++ b/apps/design-system/registry/default/example/tree-view-directories.tsx @@ -1,5 +1,4 @@ -import { TreeView, TreeViewItem } from 'ui' -import { flattenTree } from 'react-accessible-treeview' +import { flattenTree, TreeView, TreeViewItem } from 'ui' export default function TreeViewDemo() { const data = { diff --git a/apps/design-system/registry/default/example/tree-view-edit.tsx b/apps/design-system/registry/default/example/tree-view-edit.tsx index 873583e8896..88c6673240c 100644 --- a/apps/design-system/registry/default/example/tree-view-edit.tsx +++ b/apps/design-system/registry/default/example/tree-view-edit.tsx @@ -1,6 +1,5 @@ import { useState } from 'react' -import { TreeView, TreeViewItem } from 'ui' -import { flattenTree } from 'react-accessible-treeview' +import { flattenTree, TreeView, TreeViewItem } from 'ui' import { ContextMenu_Shadcn_, ContextMenuContent_Shadcn_, diff --git a/apps/design-system/registry/default/example/tree-view-multi-select.tsx b/apps/design-system/registry/default/example/tree-view-multi-select.tsx index 2a6665302d2..4b0d3cad449 100644 --- a/apps/design-system/registry/default/example/tree-view-multi-select.tsx +++ b/apps/design-system/registry/default/example/tree-view-multi-select.tsx @@ -1,6 +1,5 @@ import { useState } from 'react' -import { TreeView, TreeViewItem } from 'ui' -import { flattenTree } from 'react-accessible-treeview' +import { flattenTree, TreeView, TreeViewItem } from 'ui' import { ContextMenu_Shadcn_, ContextMenuContent_Shadcn_, diff --git a/packages/ui/src/components/shadcn/ui/dropdown-menu.tsx b/packages/ui/src/components/shadcn/ui/dropdown-menu.tsx index 9f34c377704..b470d66da1d 100644 --- a/packages/ui/src/components/shadcn/ui/dropdown-menu.tsx +++ b/packages/ui/src/components/shadcn/ui/dropdown-menu.tsx @@ -5,6 +5,10 @@ import { Check, ChevronRight, Circle } from 'lucide-react' import * as React from 'react' import { cn } from '../../../lib/utils/cn' +import { + DropdownMenuCheckboxItemProps, + DropdownMenuTriggerProps, +} from '@radix-ui/react-dropdown-menu' const DropdownMenu = (props: React.ComponentPropsWithoutRef) => ( @@ -184,4 +188,6 @@ export { DropdownMenuSubContent, DropdownMenuSubTrigger, DropdownMenuTrigger, + type DropdownMenuTriggerProps, + type DropdownMenuCheckboxItemProps, } diff --git a/packages/ui/src/components/shadcn/ui/input-otp.tsx b/packages/ui/src/components/shadcn/ui/input-otp.tsx index d3c75c21ac6..8a45a873aa5 100644 --- a/packages/ui/src/components/shadcn/ui/input-otp.tsx +++ b/packages/ui/src/components/shadcn/ui/input-otp.tsx @@ -1,7 +1,7 @@ 'use client' import * as React from 'react' -import { OTPInput, OTPInputContext } from 'input-otp' +import { OTPInput, OTPInputContext, REGEXP_ONLY_DIGITS_AND_CHARS } from 'input-otp' import { Dot } from 'lucide-react' import { cn } from '../../../lib/utils/cn' @@ -68,4 +68,4 @@ const InputOTPSeparator = React.forwardRef< )) InputOTPSeparator.displayName = 'InputOTPSeparator' -export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator } +export { InputOTP, InputOTPGroup, InputOTPSlot, InputOTPSeparator, REGEXP_ONLY_DIGITS_AND_CHARS } diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 84f3a94b97b..c97cee3abf2 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -33,14 +33,8 @@ importers: apps/design-system: dependencies: '@hookform/resolvers': - specifier: ^3.1.1 + specifier: '*' version: 3.3.1(react-hook-form@7.47.0(react@18.2.0)) - '@radix-ui/react-alert-dialog': - specifier: ^1.0.5 - version: 1.0.5(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) - '@radix-ui/react-dropdown-menu': - specifier: ^2.0.6 - version: 2.0.6(@types/react-dom@18.3.0)(@types/react@18.3.3)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) clsx: specifier: ^1.2.1 version: 1.2.1 @@ -50,15 +44,9 @@ importers: eslint-config-supabase: specifier: workspace:* version: link:../../packages/eslint-config-supabase - fs: - specifier: ^0.0.1-security - version: 0.0.1-security icons: specifier: workspace:* version: link:../../packages/icons - input-otp: - specifier: ^1.2.3 - version: 1.2.3(react-dom@18.2.0(react@18.2.0))(react@18.2.0) jotai: specifier: ^2.8.0 version: 2.8.1(@types/react@18.3.3)(react@18.2.0) @@ -83,9 +71,6 @@ importers: react: specifier: ^18.2.0 version: 18.2.0 - react-accessible-treeview: - specifier: ^2.8.3 - version: 2.8.3(classnames@2.3.2)(prop-types@15.8.1)(react-dom@18.2.0(react@18.2.0))(react@18.2.0) react-docgen: specifier: ^7.0.3 version: 7.0.3 @@ -93,7 +78,7 @@ importers: specifier: ^18.2.0 version: 18.2.0(react@18.2.0) react-hook-form: - specifier: ^7.45.0 + specifier: '*' version: 7.47.0(react@18.2.0) react-inlinesvg: specifier: ^4.0.4 @@ -8429,9 +8414,6 @@ packages: fs.realpath@1.0.0: resolution: {integrity: sha512-OO0pH2lK6a0hZnAdau5ItzHPI6pUlvI7jMVnxUQRtw4owF2wk8lOSabtGDCTP4Ggrg2MbGnWO9X8K1t4+fGMDw==} - fs@0.0.1-security: - resolution: {integrity: sha512-3XY9e1pP0CVEUCdj5BmfIZxRBTSDycnbqhIOGec9QYtmVH2fbLpj86CFWkrNOkt/Fvty4KZG5lTglL9j/gJ87w==} - fsevents@2.3.2: resolution: {integrity: sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==} engines: {node: ^8.16.0 || ^10.6.0 || >=11.0.0} @@ -21865,8 +21847,6 @@ snapshots: fs.realpath@1.0.0: {} - fs@0.0.1-security: {} - fsevents@2.3.2: optional: true