feat(ui): shared button styles

apps/website/package.json

@@ -58,7 +58,6 @@
 		"@vercel/og": "^0.5.4",
 		"ariakit": "^2.0.0-next.44",
 		"bright": "^0.8.2",
-		"class-variance-authority": "^0.6.0",
 		"cmdk": "^0.2.0",
 		"meilisearch": "^0.32.3",
 		"next": "^13.4.2",

apps/website/src/app/docs/packages/[package]/page.tsx

@@ -1,9 +1,9 @@
+import { buttonVariants } from '@discordjs/ui/Button';
 import { VscArrowLeft } from '@react-icons/all-files/vsc/VscArrowLeft';
 import { VscArrowRight } from '@react-icons/all-files/vsc/VscArrowRight';
 import { VscVersions } from '@react-icons/all-files/vsc/VscVersions';
 import Link from 'next/link';
 import { notFound } from 'next/navigation';
-import { buttonVariants } from '~/styles/Button';
 import { PACKAGES } from '~/util/constants';
 
 export const runtime = 'edge';

apps/website/src/app/docs/packages/page.tsx

@@ -1,9 +1,9 @@
+import { buttonVariants } from '@discordjs/ui/Button';
 import { FiExternalLink } from '@react-icons/all-files/fi/FiExternalLink';
 import { VscArrowLeft } from '@react-icons/all-files/vsc/VscArrowLeft';
 import { VscArrowRight } from '@react-icons/all-files/vsc/VscArrowRight';
 import { VscPackage } from '@react-icons/all-files/vsc/VscPackage';
 import Link from 'next/link';
-import { buttonVariants } from '~/styles/Button';
 import { PACKAGES } from '~/util/constants';
 
 export const runtime = 'edge';

apps/website/src/app/page.tsx

@@ -1,3 +1,4 @@
+import { buttonVariants } from '@discordjs/ui';
 import { FiExternalLink } from '@react-icons/all-files/fi/FiExternalLink';
 import Image from 'next/image';
 import Link from 'next/link';
@@ -5,7 +6,6 @@ import vercelLogo from '~/assets/powered-by-vercel.svg';
 import workersLogo from '~/assets/powered-by-workers.png';
 import { Banner } from '~/components/Banner';
 import { InstallButton } from '~/components/InstallButton';
-import { buttonVariants } from '~/styles/Button';
 import { DESCRIPTION } from '~/util/constants';
 
 export default function Page() {

apps/website/src/components/InstallButton.tsx

@@ -1,10 +1,10 @@
 'use client';
 
+import { buttonVariants } from '@discordjs/ui';
 import { FiCheck } from '@react-icons/all-files/fi/FiCheck';
 import { FiCopy } from '@react-icons/all-files/fi/FiCopy';
 import { useEffect, useState } from 'react';
 import { useCopyToClipboard } from 'react-use';
-import { buttonVariants } from '~/styles/Button';
 
 export function InstallButton() {
 	const [interacted, setInteracted] = useState(false);

apps/website/tsconfig.json

@@ -19,7 +19,7 @@
 			"~/*": ["./src/*"]
 		},
 		"strictNullChecks": true,
-		"moduleResolution": "node"
+		"moduleResolution": "bundler"
 	},
 	"include": ["src/**/*.ts", "src/**/*.tsx", "next-env.d.ts", ".next/types/**/*.ts"],
 	"exclude": ["node_modules"]

packages/ui/package.json

@@ -18,8 +18,14 @@
 	"main": "./dist/index.js",
 	"typings": "./dist/index.d.ts",
 	"exports": {
-		"types": "./dist/index.d.ts",
-		"import": "./dist/index.js"
+		"./*": {
+			"import": "./dist/*.js",
+			"types": "./dist/index.d.ts"
+		},
+		".": {
+			"types": "./dist/index.d.ts",
+			"import": "./dist/index.js"
+		}
 	},
 	"sideEffects": false,
 	"directories": {
@@ -48,6 +54,7 @@
 	"dependencies": {
 		"@react-icons/all-files": "^4.1.0",
 		"ariakit": "^2.0.0-next.44",
+		"class-variance-authority": "^0.6.0",
 		"react": "^18.2.0",
 		"react-dom": "^18.2.0"
 	},

packages/ui/src/lib/index.ts

@@ -1,6 +1,8 @@
 export * from './components/Alert.js';
 export * from './components/Section.js';
 
+export * from './styles/Button.js';
+
 export * from './components/discord/Message.js';
 export * from './components/discord/MessageAuthor.js';
 export * from './components/discord/MessageAuthorReply.js';

packages/ui/tsconfig.json

@@ -11,7 +11,8 @@
 		"skipLibCheck": true,
 		"paths": {
 			"~/*": ["./src/*"]
-		}
+		},
+		"moduleResolution": "node"
 	},
 	"include": ["src/**/*.ts", "src/**/*.tsx", ".ladle/**/*.tsx", "types.d.ts"],
 	"exclude": ["node_modules"]

packages/ui/vite.config.ts

@@ -10,6 +10,7 @@ export default defineConfig({
 		lib: {
 			entry: [
 				'src/lib/index.ts',
+				'src/lib/styles/Button.ts',
 				'src/lib/components/Alert.tsx',
 				'src/lib/components/Section.tsx',
 				'src/lib/components/discord/Message.tsx',

yarn.lock

@@ -2393,6 +2393,7 @@ __metadata:
     "@vitest/coverage-c8": ^0.31.0
     ariakit: ^2.0.0-next.44
     chromatic: ^6.17.4
+    class-variance-authority: ^0.6.0
     cross-env: ^7.0.3
     eslint: ^8.40.0
     eslint-config-neon: ^0.1.47
@@ -2492,7 +2493,6 @@ __metadata:
     "@vitest/coverage-c8": ^0.31.0
     ariakit: ^2.0.0-next.44
     bright: ^0.8.2
-    class-variance-authority: ^0.6.0
     cmdk: ^0.2.0
     concurrently: ^8.0.1
     cpy-cli: ^4.2.0