feat(ui): add ui-components package

nodejs · Nov 14, 2024 · 8ec0d3f · 8ec0d3f
1 parent 24925de
commit 8ec0d3f
Show file tree

Hide file tree

Showing 50 changed files with 3,784 additions and 4,290 deletions.
diff --git a/apps/site/app/[locale]/next-data/og/route.tsx b/apps/site/app/[locale]/next-data/og/route.tsx
@@ -1,7 +1,7 @@
+import HexagonGrid from '@node-core/ui-components/Icons/HexagonGrid';
+import JsIconWhite from '@node-core/ui-components/Icons/Logos/JsIconWhite';
 import { ImageResponse } from 'next/og';
 
-import HexagonGrid from '@/components/Icons/HexagonGrid';
-import JsIconWhite from '@/components/Icons/Logos/JsIconWhite';
 import {
   ENABLE_STATIC_EXPORT,
   VERCEL_ENV,

diff --git a/apps/site/components/Common/GlowingBackdrop/index.tsx b/apps/site/components/Common/GlowingBackdrop/index.tsx
@@ -1,7 +1,6 @@
+import HexagonGrid from '@node-core/ui-components/Icons/HexagonGrid';
 import type { FC } from 'react';
 
-import HexagonGrid from '@/components/Icons/HexagonGrid';
-
 import styles from './index.module.css';
 
 const GlowingBackdrop: FC = () => (

diff --git a/apps/site/components/Common/NodejsLogo/index.tsx b/apps/site/components/Common/NodejsLogo/index.tsx
@@ -1,6 +1,6 @@
+import Nodejs from '@node-core/ui-components/Icons/Logos/Nodejs';
 import type { FC } from 'react';
 
-import Nodejs from '@/components/Icons/Logos/Nodejs';
 import type { LogoVariant } from '@/types';
 
 import style from './index.module.css';

diff --git a/apps/site/components/Common/Preview/index.tsx b/apps/site/components/Common/Preview/index.tsx
@@ -1,8 +1,8 @@
+import HexagonGrid from '@node-core/ui-components/Icons/HexagonGrid';
+import JsIconWhite from '@node-core/ui-components/Icons/Logos/JsIconWhite';
 import classNames from 'classnames';
 import type { FC } from 'react';
 
-import HexagonGrid from '@/components/Icons/HexagonGrid';
-import JsIconWhite from '@/components/Icons/Logos/JsIconWhite';
 import type { BlogPreviewType } from '@/types';
 
 import styles from './index.module.css';

diff --git a/apps/site/components/Common/Select/index.stories.tsx b/apps/site/components/Common/Select/index.stories.tsx
@@ -1,9 +1,9 @@
+import Apple from '@node-core/ui-components/Icons/Platform/Apple';
+import Linux from '@node-core/ui-components/Icons/Platform/Linux';
+import Microsoft from '@node-core/ui-components/Icons/Platform/Microsoft';
 import type { Meta as MetaObj, StoryObj } from '@storybook/react';
 
 import Select from '@/components/Common/Select';
-import Apple from '@/components/Icons/Platform/Apple';
-import Linux from '@/components/Icons/Platform/Linux';
-import Microsoft from '@/components/Icons/Platform/Microsoft';
 
 type Story = StoryObj<typeof Select>;
 type Meta = MetaObj<typeof Select>;

diff --git a/apps/site/components/Containers/Footer/index.tsx b/apps/site/components/Containers/Footer/index.tsx
@@ -1,12 +1,12 @@
+import GitHub from '@node-core/ui-components/Icons/Social/GitHub';
+import LinkedIn from '@node-core/ui-components/Icons/Social/LinkedIn';
+import Mastodon from '@node-core/ui-components/Icons/Social/Mastodon';
+import Slack from '@node-core/ui-components/Icons/Social/Slack';
+import Twitter from '@node-core/ui-components/Icons/Social/Twitter';
 import { useTranslations } from 'next-intl';
 import type { FC, SVGProps } from 'react';
 
 import NavItem from '@/components/Containers/NavBar/NavItem';
-import GitHub from '@/components/Icons/Social/GitHub';
-import LinkedIn from '@/components/Icons/Social/LinkedIn';
-import Mastodon from '@/components/Icons/Social/Mastodon';
-import Slack from '@/components/Icons/Social/Slack';
-import Twitter from '@/components/Icons/Social/Twitter';
 import { siteNavigation } from '@/next.json.mjs';
 
 import styles from './index.module.css';

diff --git a/apps/site/components/Containers/MetaBar/index.stories.tsx b/apps/site/components/Containers/MetaBar/index.stories.tsx
@@ -1,9 +1,9 @@
 import { CodeBracketIcon } from '@heroicons/react/24/outline';
+import GitHub from '@node-core/ui-components/Icons/Social/GitHub';
 import type { Meta as MetaObj, StoryObj } from '@storybook/react';
 
 import AvatarGroup from '@/components/Common/AvatarGroup';
 import MetaBar from '@/components/Containers/MetaBar';
-import GitHub from '@/components/Icons/Social/GitHub';
 import Link from '@/components/Link';
 import { getGitHubAvatarUrl } from '@/util/gitHubUtils';
 

diff --git a/apps/site/components/Containers/NavBar/index.tsx b/apps/site/components/Containers/NavBar/index.tsx
@@ -2,6 +2,7 @@
 
 import Hamburger from '@heroicons/react/24/solid/Bars3Icon';
 import XMark from '@heroicons/react/24/solid/XMarkIcon';
+import GitHub from '@node-core/ui-components/Icons/Social/GitHub';
 import * as Label from '@radix-ui/react-label';
 import { useState } from 'react';
 import type { FC, ComponentProps, HTMLAttributeAnchorTarget } from 'react';
@@ -10,7 +11,6 @@ import LanguageDropdown from '@/components/Common/LanguageDropDown';
 import { SearchButton } from '@/components/Common/Search';
 import ThemeToggle from '@/components/Common/ThemeToggle';
 import NavItem from '@/components/Containers/NavBar/NavItem';
-import GitHub from '@/components/Icons/Social/GitHub';
 import Link from '@/components/Link';
 import WithNodejsLogo from '@/components/withNodejsLogo';
 import type { FormattedMessage } from '@/types';

diff --git a/apps/site/components/Downloads/Release/OperatingSystemDropdown.tsx b/apps/site/components/Downloads/Release/OperatingSystemDropdown.tsx
@@ -1,14 +1,14 @@
 'use client';
 
+import Apple from '@node-core/ui-components/Icons/Platform/Apple';
+import Aix from '@node-core/ui-components/Icons/Platform/Generic';
+import Linux from '@node-core/ui-components/Icons/Platform/Linux';
+import Microsoft from '@node-core/ui-components/Icons/Platform/Microsoft';
 import { useTranslations } from 'next-intl';
 import { useContext, useEffect } from 'react';
 import type { FC } from 'react';
 
 import Select from '@/components/Common/Select';
-import Apple from '@/components/Icons/Platform/Apple';
-import Aix from '@/components/Icons/Platform/Generic';
-import Linux from '@/components/Icons/Platform/Linux';
-import Microsoft from '@/components/Icons/Platform/Microsoft';
 import { useDetectOS } from '@/hooks/react-client';
 import { ReleaseContext } from '@/providers/releaseProvider';
 import type { UserOS } from '@/types/userOS';

diff --git a/apps/site/components/Downloads/Release/PlatformDropdown.tsx b/apps/site/components/Downloads/Release/PlatformDropdown.tsx
@@ -1,14 +1,15 @@
 'use client';
+
+import Choco from '@node-core/ui-components/Icons/Platform/Choco';
+import Docker from '@node-core/ui-components/Icons/Platform/Docker';
+import FNM from '@node-core/ui-components/Icons/Platform/FNM';
+import Homebrew from '@node-core/ui-components/Icons/Platform/Homebrew';
+import NVM from '@node-core/ui-components/Icons/Platform/NVM';
 import { useTranslations } from 'next-intl';
-import { useContext, useEffect, useMemo } from 'react';
 import type { FC } from 'react';
+import { useContext, useEffect, useMemo } from 'react';
 
 import Select from '@/components/Common/Select';
-import Choco from '@/components/Icons/Platform/Choco';
-import Docker from '@/components/Icons/Platform/Docker';
-import FNM from '@/components/Icons/Platform/FNM';
-import Homebrew from '@/components/Icons/Platform/Homebrew';
-import NVM from '@/components/Icons/Platform/NVM';
 import { ReleaseContext } from '@/providers/releaseProvider';
 import type { PackageManager } from '@/types/release';
 import { formatDropdownItems, platformItems } from '@/util/downloadUtils';

diff --git a/apps/site/components/withMetaBar.tsx b/apps/site/components/withMetaBar.tsx
@@ -1,10 +1,10 @@
 'use client';
+import GitHub from '@node-core/ui-components/Icons/Social/GitHub';
 import { useFormatter } from 'next-intl';
 import type { FC } from 'react';
 
 import AvatarGroup from '@/components/Common/AvatarGroup';
 import MetaBar from '@/components/Containers/MetaBar';
-import GitHub from '@/components/Icons/Social/GitHub';
 import Link from '@/components/Link';
 import { useClientContext } from '@/hooks/react-client';
 import useMediaQuery from '@/hooks/react-client/useMediaQuery';