feat: renames library

Author: hoangdevnull

.github/workflows/release.yml

@@ -0,0 +1,42 @@
+name: Node.js Package
+
+on:
+  release:
+    types: [created]
+
+jobs:
+  release:
+    name: Release
+    runs-on: ubuntu-latest
+    permissions:
+      packages: write
+      pull-requests: write
+      contents: write
+
+    steps:
+      - name: Checkout Repo
+        uses: actions/checkout@v4
+
+      - name: Setup pnpm 8
+        uses: pnpm/action-setup@v2
+        with:
+          version: 8
+
+      - name: Install Dependencies
+        run: pnpm install
+
+      - name: 🏗 Setup Node
+        uses: actions/setup-node@v3
+        with:
+          node-version: 18
+          registry-url: 'https://registry.npmjs.org'
+          cache: 'pnpm'
+
+      - name: 🚀 Create Release Pull Request or Publish to npm
+        id: changesets
+        uses: changesets/action@v1
+        with:
+          publish: pnpm run release
+        env:
+          GITHUB_TOKEN: ${{ secrets.GITHUB_TOKEN }}
+          NPM_TOKEN: ${{ secrets.NPM_TOKEN }}

README.md

@@ -1,4 +1,4 @@
-# VAR UI Library
+# VAR META UI Library
 
 Powered by:
 

apps/web/.eslintrc.js

@@ -1,3 +1,3 @@
 module.exports = {
-  extends: ['@var-meta-tech/eslint-config/library'],
+  extends: ['@var-meta/eslint-config/library'],
 };

apps/web/.storybook/preview.tsx

@@ -3,7 +3,7 @@ import '../src/app/globals.css';
 import { DocsContainer as BaseContainer, DocsContainerProps as BaseContainerProps } from '@storybook/blocks';
 import type { Preview } from '@storybook/react';
 import { themes } from '@storybook/theming';
-import { Toaster } from '@var-meta-tech/ui';
+import { Toaster } from '@var-meta/ui';
 import { useDarkMode } from 'storybook-dark-mode';
 
 const preview: Preview = {

apps/web/.storybook/welcome.stories.mdx

@@ -8,7 +8,7 @@ import { Meta, Story } from '@storybook/addon-docs';
 
 <br />
 
-## VAR-UI Version 1 - Design system
+## VAR-Meta UI Version 1 - Design system
 
 <br />
 
@@ -19,18 +19,18 @@ import { Meta, Story } from '@storybook/addon-docs';
 
 ## Install
 
-The UI came with diffences package namely `@var-meta-tech/icon` and `@var-meta-tech/ui`
+The UI came with diffences package namely `@var-meta/icon`, `@var-meta/theme` and `@var-meta/ui`
 
 ```sh
-npm install @var-meta-tech/ui @var-meta-tech/icon
+npm install @var-meta/ui @var-meta/theme @var-meta/icon
 ```
 
 ```sh
-yarn add @var-meta-tech/ui @var-meta-tech/icon
+yarn add @var-meta/ui @var-meta/theme @var-meta/icon
 ```
 
 ```sh
-pnpm i @var-meta-tech/ui @var-meta-tech/icon
+pnpm i @var-meta/ui @var-meta/theme @var-meta/icon
 ```
 
 ## Tailwind CSS Setup
@@ -41,7 +41,7 @@ the following code to your `tailwind.config.js` file:
 
 ```ts
 // tailwind.config.ts
-import { createThemes } from '@var-meta-tech/theme';
+import { createThemes } from '@var-meta/theme';
 import { withTV } from 'tailwind-variants/transformer';
 import type { Config } from 'tailwindcss';
 
@@ -51,7 +51,7 @@ const config: Config = {
     './.storybook/welcome.stories.mdx',
     './src/components/**/*.{js,ts,jsx,tsx,mdx}',
     './src/app/**/*.{js,ts,jsx,tsx,mdx}',
-    './node_modules/@var-meta-tech/ui/**/*.{js,ts,jsx,tsx}',
+    './node_modules/@var-meta/ui/**/*.{js,ts,jsx,tsx}',
   ],
   plugins: [createThemes()],
 };
@@ -65,7 +65,7 @@ Now, you can use the component you installed in your application:
 
 ```jsx
 import * as React from 'react';
-import { Button } from '@var-meta-tech/ui';
+import { Button } from '@var-meta/ui';
 
 function App() {
   return <Button>Press me</Button>;

apps/web/next.config.js

@@ -2,7 +2,7 @@
 /** @type {import('next').NextConfig} */
 const nextConfig = {
   experimental: {
-    optimizePackageImports: ['@var-meta-tech/icon', '@var-meta-tech/ui'],
+    optimizePackageImports: ['@var-meta/icon', '@var-meta/ui'],
   },
 };
 

apps/web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "web",
-  "version": "1.0.6",
+  "version": "0.0.1",
   "private": true,
   "scripts": {
     "dev": "storybook dev -p 6006",
@@ -16,9 +16,9 @@
     "clean": "rimraf .turbo && rimraf .next out && rimraf storybook-static && rimraf node_modules "
   },
   "dependencies": {
-    "@var-meta-tech/ui": "workspace:*",
-    "@var-meta-tech/icons": "workspace:^",
-    "@var-meta-tech/theme": "workspace:*",
+    "@var-meta/ui": "workspace:*",
+    "@var-meta/icons": "workspace:^",
+    "@var-meta/theme": "workspace:*",
     "class-variance-authority": "^0.7.0",
     "dayjs": "^1.11.10",
     "next": "^14.0.3",
@@ -44,7 +44,7 @@
     "@types/node": "^18.11.17",
     "@types/react": "^18.2.5",
     "@types/react-dom": "^18.2.4",
-    "@var-meta-tech/eslint-config": "workspace:*",
+    "@var-meta/eslint-config": "workspace:*",
     "autoprefixer": "^10.4.13",
     "postcss": "^8.4.20",
     "storybook": "^7.5.3",

apps/web/src/app/page.tsx

@@ -10,7 +10,7 @@ import {
   Select,
   toast,
   type AutocompleteProps,
-} from '@var-meta-tech/ui';
+} from '@var-meta/ui';
 
 const options: AutocompleteProps['options'] = [
   {

apps/web/src/app/provider.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import React from 'react';
-import { Toaster, type FCC } from '@var-meta-tech/ui';
+import { Toaster, type FCC } from '@var-meta/ui';
 import { ThemeProvider } from 'next-themes';
 
 const Provider: FCC = ({ children }) => {

apps/web/src/stories/accordion.stories.tsx

@@ -1,6 +1,6 @@
 import React from 'react';
 import type { Meta, StoryFn } from '@storybook/react';
-import { Accordion, AccordionContent, AccordionItem, AccordionTrigger, type AccordionProps } from '@var-meta-tech/ui';
+import { Accordion, AccordionContent, AccordionItem, AccordionTrigger, type AccordionProps } from '@var-meta/ui';
 
 import { EnhancedView } from '@/components/View';