diff --git a/README.md b/README.md index 71218e7..ecf8cc1 100644 --- a/README.md +++ b/README.md @@ -1,67 +1,49 @@ - # uikit -کتابخانه‌ی مشترک React برای استفاده بین پروژه‌های BI. +Shared library for BI next.js projects. -این پکیج به چند entry جدا تقسیم شده تا پروژه‌ها فقط همان بخشی را import کنند که لازم دارند و مجبور نباشند برای یک helper ساده، dependencyهای سنگین مثل Chakra، Keycloak یا React Query نصب کنند. --- -## نصب +## Install ```bash yarn add git+https://git.d.aiengines.ir/bi/uikit.git ``` -یا اگر branch/tag خاصی لازم داری: - -```bash -yarn add git+https://git.d.aiengines.ir/bi/uikit.git#main -``` - --- -## آپدیت +## Update ```bash yarn upgrade uikit ``` -اگر از git dependency استفاده می‌کنی و نسخه جدید نگرفتی، lockfile را هم بررسی کن: - -```bash -yarn remove uikit -yarn add git+https://git.d.aiengines.ir/bi/uikit.git -``` - --- -# ساختار importها +# imports -| مسیر | کاربرد | dependency اضافی | +| مسیر | کاربرد | dependency اضافی | | ------------------ | ------------------------------------- | --------------------------------------- | -| `uikit` | خروجی سبک، فعلاً فقط utils | ندارد | -| `uikit/utils` | helperهای ساده مثل تبدیل عدد | ندارد | -| `uikit/pagination` | کامپوننت‌های pagination | Chakra + React + react-icons | -| `uikit/layout` | کامپوننت‌های layout مثل Header | Chakra + React | -| `uikit/core` | API، BiProvider، Keycloak، Permission | Chakra + React Query + Axios + Keycloak | +| `uikit` | utility functions | - | +| `uikit/utils` | utility functions | - | +| `uikit/pagination` | pagination | Chakra + React + react-icons | +| `uikit/layout` | Header | Chakra + React | +| `uikit/core` | API، BiProvider، Keycloak، Permission | Chakra + React Query + Axios + Keycloak | | `uikit/table` | DataTable | Chakra + TanStack Table + Pagination | --- -# استفاده از utils - -برای helperهای ساده نیازی به نصب هیچ dependency اضافه‌ای نیست. +# utils ```js import { toFaDigits, toEnDigits, toFaNumber } from "uikit/utils"; -toFaDigits(123456); // ۱۲۳۴۵۶ -toEnDigits("۱۲۳۴۵۶"); // 123456 -toFaNumber(123456); // عدد فارسی‌شده +toFaDigits(123456); +toEnDigits("۱۲۳۴۵۶"); +toFaNumber(123456); ``` - -همچنین چون root package فقط utils را export می‌کند، این هم قابل استفاده است: +or ```js import { toFaDigits } from "uikit"; @@ -69,15 +51,15 @@ import { toFaDigits } from "uikit"; --- -# استفاده از pagination +# pagination -اگر از pagination استفاده می‌کنی، این dependencyها باید در پروژه نصب باشند: +required dependencies ```bash yarn add @chakra-ui/react @emotion/react @emotion/styled framer-motion react-icons ``` -استفاده: +using ```jsx import { Pagination, LightPagination, SimplePagination } from "uikit/pagination"; @@ -96,17 +78,15 @@ function Page() { --- -# استفاده از Header +# Header -`Header` داخل مسیر `uikit/layout` قرار دارد. - -dependencyهای لازم: +required dependencies: ```bash yarn add @chakra-ui/react @emotion/react @emotion/styled framer-motion ``` -استفاده: +using: ```jsx import { Header } from "uikit/layout"; @@ -129,18 +109,6 @@ function AppHeader() { } ``` -اجزای موجود: - -```jsx -
- - - - - - -``` - --- # استفاده از core @@ -155,7 +123,7 @@ function AppHeader() { * React Query provider * Chakra provider -برای استفاده از core این dependencyها باید در پروژه نصب باشند: +Required dependencies: ```bash yarn add @chakra-ui/react @emotion/react @emotion/styled framer-motion @tanstack/react-query axios keycloak-js @@ -533,99 +501,3 @@ function UsersTable({ data, columns }) { ``` --- - -# dependencyهای پیشنهادی بر اساس نیاز - -## فقط utils - -نیازی به نصب dependency اضافه نیست. - -```bash -yarn add git+https://git.d.aiengines.ir/bi/uikit.git -``` - ---- - -## pagination یا layout - -```bash -yarn add @chakra-ui/react @emotion/react @emotion/styled framer-motion react-icons -``` - -برای `layout` معمولاً `react-icons` لازم نیست، ولی اگر پروژه از pagination هم استفاده می‌کند، نصبش کن. - ---- - -## core - -```bash -yarn add @chakra-ui/react @emotion/react @emotion/styled framer-motion @tanstack/react-query axios keycloak-js -``` - ---- - -## table - -```bash -yarn add @chakra-ui/react @emotion/react @emotion/styled framer-motion @tanstack/react-table react-icons -``` - ---- - -# نکات مهم توسعه - -بعد از تغییر فایل‌ها، build بگیر: - -```bash -yarn build -``` - -فایل‌های خروجی مورد انتظار: - -```txt -dist/index.js -dist/utils.js -dist/pagination.js -dist/layout.js -dist/core.js -dist/table.js -``` - -اگر entry جدید اضافه شد، باید هم در `vite.config.js` و هم در `package.json > exports` ثبت شود. - ---- - -# قانون کلی - -هر چیزی که dependency سنگین ندارد: - -```txt -uikit/utils -``` - -هر چیزی که UI سبک است و Chakra می‌خواهد: - -```txt -uikit/pagination -uikit/layout -``` - -هر چیزی که مربوط به API، auth، permission و provider است: - -```txt -uikit/core -``` - -هر چیزی که مربوط به table است: - -```txt -uikit/table -``` - -Root package یعنی: - -```txt -uikit -``` - -باید سبک بماند و فقط چیزهایی مثل utils را export کند.