automoby-kit 1.0.41 → 1.0.43
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +99 -99
- package/dist/cjs/Pagination.js +1 -1
- package/dist/esm/Pagination.js +1 -1
- package/dist/types/Pagination.js +49 -20
- package/dist/types/components/Pagination/Pagination.d.ts +8 -0
- package/dist/types/components/Pagination/Pagination.stories.d.ts +23 -2
- package/package.json +176 -176
package/README.md
CHANGED
|
@@ -1,100 +1,100 @@
|
|
|
1
|
-
# Automoby Kit
|
|
2
|
-
|
|
3
|
-
A comprehensive React UI component library - created in war 2025.
|
|
4
|
-
|
|
5
|
-
## 🚀 Installation
|
|
6
|
-
|
|
7
|
-
```bash
|
|
8
|
-
npm install automoby-kit
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
## 📦 Usage
|
|
12
|
-
|
|
13
|
-
```typescript
|
|
14
|
-
import {
|
|
15
|
-
Button,
|
|
16
|
-
Typography,
|
|
17
|
-
Input,
|
|
18
|
-
Tabs
|
|
19
|
-
} from 'automoby-kit';
|
|
20
|
-
|
|
21
|
-
function App() {
|
|
22
|
-
return (
|
|
23
|
-
<div>
|
|
24
|
-
<Typography variant="h1">Welcome to Automoby Kit</Typography>
|
|
25
|
-
<Button variant="primary" size="lg">
|
|
26
|
-
Click me!
|
|
27
|
-
</Button>
|
|
28
|
-
<Input placeholder="Enter text..." />
|
|
29
|
-
</div>
|
|
30
|
-
);
|
|
31
|
-
}
|
|
32
|
-
```
|
|
33
|
-
|
|
34
|
-
## 🧩 Available Components
|
|
35
|
-
|
|
36
|
-
- **Typography** - Text rendering with various styles
|
|
37
|
-
- **Button** - Interactive buttons with multiple variants
|
|
38
|
-
- **Input** - Form input fields
|
|
39
|
-
- **Tabs** - Tabbed interfaces
|
|
40
|
-
- **Drawer** - Slide-out panels
|
|
41
|
-
- **Backdrop** - Modal overlays
|
|
42
|
-
- **Breadcrumb** - Navigation breadcrumbs
|
|
43
|
-
- **Pagination** - Page navigation
|
|
44
|
-
- **Accordion** - Collapsible content sections
|
|
45
|
-
- **Divider** - Visual separators
|
|
46
|
-
- **RadioGroup** - Radio button groups
|
|
47
|
-
- **Chips** - Tag-like elements
|
|
48
|
-
- **Menu** - Context menus and dropdowns
|
|
49
|
-
|
|
50
|
-
## 🏗️ TypeScript Support
|
|
51
|
-
|
|
52
|
-
All components come with full TypeScript support:
|
|
53
|
-
|
|
54
|
-
```typescript
|
|
55
|
-
import { ButtonProps, TypographyVariant } from 'automoby-kit';
|
|
56
|
-
|
|
57
|
-
const MyButton: React.FC<ButtonProps> = (props) => {
|
|
58
|
-
return <Button {...props} />;
|
|
59
|
-
};
|
|
60
|
-
```
|
|
61
|
-
|
|
62
|
-
## 📱 Mobile Context
|
|
63
|
-
|
|
64
|
-
The library includes a mobile detection context:
|
|
65
|
-
|
|
66
|
-
```typescript
|
|
67
|
-
import { MobileProvider } from 'automoby-kit';
|
|
68
|
-
|
|
69
|
-
function App() {
|
|
70
|
-
return (
|
|
71
|
-
<MobileProvider userAgent={navigator.userAgent}>
|
|
72
|
-
<MyComponent />
|
|
73
|
-
</MobileProvider>
|
|
74
|
-
);
|
|
75
|
-
}
|
|
76
|
-
```
|
|
77
|
-
|
|
78
|
-
## 🛠️ Development
|
|
79
|
-
|
|
80
|
-
This package requires the following peer dependencies:
|
|
81
|
-
|
|
82
|
-
```json
|
|
83
|
-
{
|
|
84
|
-
"react": "^19.1.0",
|
|
85
|
-
"react-dom": "^19.1.0",
|
|
86
|
-
"clsx": "^2.1.1",
|
|
87
|
-
"tailwindcss": "^4.1.10"
|
|
88
|
-
}
|
|
89
|
-
```
|
|
90
|
-
|
|
91
|
-
## 🆘 Support
|
|
92
|
-
|
|
93
|
-
If you have issues:
|
|
94
|
-
|
|
95
|
-
1. Check the [GitHub issues](https://github.com/yourusername/automoby-kit/issues) for known problems
|
|
96
|
-
2. Submit a new issue with detailed information about your problem
|
|
97
|
-
|
|
98
|
-
## 🔄 Version History
|
|
99
|
-
|
|
1
|
+
# Automoby Kit
|
|
2
|
+
|
|
3
|
+
A comprehensive React UI component library - created in war 2025.
|
|
4
|
+
|
|
5
|
+
## 🚀 Installation
|
|
6
|
+
|
|
7
|
+
```bash
|
|
8
|
+
npm install automoby-kit
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
## 📦 Usage
|
|
12
|
+
|
|
13
|
+
```typescript
|
|
14
|
+
import {
|
|
15
|
+
Button,
|
|
16
|
+
Typography,
|
|
17
|
+
Input,
|
|
18
|
+
Tabs
|
|
19
|
+
} from 'automoby-kit';
|
|
20
|
+
|
|
21
|
+
function App() {
|
|
22
|
+
return (
|
|
23
|
+
<div>
|
|
24
|
+
<Typography variant="h1">Welcome to Automoby Kit</Typography>
|
|
25
|
+
<Button variant="primary" size="lg">
|
|
26
|
+
Click me!
|
|
27
|
+
</Button>
|
|
28
|
+
<Input placeholder="Enter text..." />
|
|
29
|
+
</div>
|
|
30
|
+
);
|
|
31
|
+
}
|
|
32
|
+
```
|
|
33
|
+
|
|
34
|
+
## 🧩 Available Components
|
|
35
|
+
|
|
36
|
+
- **Typography** - Text rendering with various styles
|
|
37
|
+
- **Button** - Interactive buttons with multiple variants
|
|
38
|
+
- **Input** - Form input fields
|
|
39
|
+
- **Tabs** - Tabbed interfaces
|
|
40
|
+
- **Drawer** - Slide-out panels
|
|
41
|
+
- **Backdrop** - Modal overlays
|
|
42
|
+
- **Breadcrumb** - Navigation breadcrumbs
|
|
43
|
+
- **Pagination** - Page navigation
|
|
44
|
+
- **Accordion** - Collapsible content sections
|
|
45
|
+
- **Divider** - Visual separators
|
|
46
|
+
- **RadioGroup** - Radio button groups
|
|
47
|
+
- **Chips** - Tag-like elements
|
|
48
|
+
- **Menu** - Context menus and dropdowns
|
|
49
|
+
|
|
50
|
+
## 🏗️ TypeScript Support
|
|
51
|
+
|
|
52
|
+
All components come with full TypeScript support:
|
|
53
|
+
|
|
54
|
+
```typescript
|
|
55
|
+
import { ButtonProps, TypographyVariant } from 'automoby-kit';
|
|
56
|
+
|
|
57
|
+
const MyButton: React.FC<ButtonProps> = (props) => {
|
|
58
|
+
return <Button {...props} />;
|
|
59
|
+
};
|
|
60
|
+
```
|
|
61
|
+
|
|
62
|
+
## 📱 Mobile Context
|
|
63
|
+
|
|
64
|
+
The library includes a mobile detection context:
|
|
65
|
+
|
|
66
|
+
```typescript
|
|
67
|
+
import { MobileProvider } from 'automoby-kit';
|
|
68
|
+
|
|
69
|
+
function App() {
|
|
70
|
+
return (
|
|
71
|
+
<MobileProvider userAgent={navigator.userAgent}>
|
|
72
|
+
<MyComponent />
|
|
73
|
+
</MobileProvider>
|
|
74
|
+
);
|
|
75
|
+
}
|
|
76
|
+
```
|
|
77
|
+
|
|
78
|
+
## 🛠️ Development
|
|
79
|
+
|
|
80
|
+
This package requires the following peer dependencies:
|
|
81
|
+
|
|
82
|
+
```json
|
|
83
|
+
{
|
|
84
|
+
"react": "^19.1.0",
|
|
85
|
+
"react-dom": "^19.1.0",
|
|
86
|
+
"clsx": "^2.1.1",
|
|
87
|
+
"tailwindcss": "^4.1.10"
|
|
88
|
+
}
|
|
89
|
+
```
|
|
90
|
+
|
|
91
|
+
## 🆘 Support
|
|
92
|
+
|
|
93
|
+
If you have issues:
|
|
94
|
+
|
|
95
|
+
1. Check the [GitHub issues](https://github.com/yourusername/automoby-kit/issues) for known problems
|
|
96
|
+
2. Submit a new issue with detailed information about your problem
|
|
97
|
+
|
|
98
|
+
## 🔄 Version History
|
|
99
|
+
|
|
100
100
|
- **1.0.0** - Initial release
|
package/dist/cjs/Pagination.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";"use strict";var e=require("react/jsx-runtime"),i=require("react"),
|
|
1
|
+
"use client";"use strict";var e=require("react/jsx-runtime"),i=require("react"),n=require("./utils.js"),t=require("./contexts.js"),a=require("./chunks/createLucideIcon-BqJVOzoK.js"),r=require("./chunks/chevron-left-Do__K6cA.js");const s=a.createLucideIcon("chevron-right",[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]]),o=a.createLucideIcon("chevrons-left",[["path",{d:"m11 17-5-5 5-5",key:"13zhaf"}],["path",{d:"m18 17-5-5 5-5",key:"h8a8et"}]]),c=a.createLucideIcon("chevrons-right",[["path",{d:"m6 17 5-5-5-5",key:"xnjwq"}],["path",{d:"m13 17 5-5-5-5",key:"17xmmf"}]]),l=a.createLucideIcon("ellipsis",[["circle",{cx:"12",cy:"12",r:"1",key:"41hilf"}],["circle",{cx:"19",cy:"12",r:"1",key:"1wjl8i"}],["circle",{cx:"5",cy:"12",r:"1",key:"1pcz8c"}]]);function PaginationRoot({className:i,...t}){return e.jsx("nav",{role:"navigation","aria-label":"pagination","data-slot":"pagination",className:n("mx-auto flex w-full justify-center",i),...t})}function PaginationContent({className:i,device:t,...a}){return e.jsx("ul",{"data-slot":"pagination-content",className:n("flex flex-row items-center","mobile"===t?"gap-1.5":"gap-2",i),...a})}function PaginationItem({...i}){return e.jsx("li",{"data-slot":"pagination-item",...i})}function PaginationLink({className:i,device:t,variant:a,isActive:r,linkComponent:s,...o}){const c=s??"a";return e.jsx(c,{"aria-current":r?"page":void 0,"data-slot":"pagination-link","data-active":r,className:n(buttonVariants({variant:"nextPrev"===a?a:r?"active":"outline",device:t}),i),tabIndex:o["aria-disabled"]?-1:0,...o})}function PaginationPrevious({className:i,device:n,variant:t,...a}){const r="mobile"===n,o={mobile:e.jsx(s,{size:18}),desktop:e.jsxs(e.Fragment,{children:[e.jsx(c,{size:20})," ",e.jsx("span",{children:"قبلی"})]})};return e.jsx(PaginationLink,{"aria-label":"Go to previous page",className:r?"ml-2.5":"flex justify-center items-center gap-2 w-20 h-12 ml-4",device:n,variant:"nextPrev",...a,children:"mobile"===n?o.mobile:o.desktop})}function PaginationNext({className:i,device:n,variant:t,...a}){const s="mobile"===n,c={mobile:e.jsx(r.ChevronLeft,{size:18}),desktop:e.jsxs(e.Fragment,{children:[e.jsx("span",{children:"بعدی"}),e.jsx(o,{size:20})]})};return e.jsx(PaginationLink,{"aria-label":"Go to next page",className:s?"mr-2.5":"flex justify-center items-center gap-2 w-20 h-12 mr-4",device:n,variant:"nextPrev",...a,children:"mobile"===n?c.mobile:c.desktop})}function PaginationEllipsis({className:i,...t}){return e.jsx("span",{"aria-hidden":!0,"data-slot":"pagination-ellipsis",className:n("flex size-9 items-center justify-center",i),...t,children:e.jsx(l,{className:"size-4"})})}function buttonVariants({variant:e,device:i}){const t="mobile"===i;return[n({"flex items-center justify-center rounded-[6px]":!0,"w-10 h-10 text-s font-heavy":t,"w-12 h-12 text-l font-heavy":!t}),{outline:"border border-neutral-light bg-white text-neutral-darker",active:"bg-primary text-white",nextPrev:"border border-neutral-light bg-white text-neutral-darker"}[e]].join(" ")}exports.Pagination=({pageCount:n,page:a,defaultPage:r=1,onPageChange:s,className:o,isMobile:c,baseUrl:l,linkComponent:d,...u})=>{const h=t.useMobile(),m=c??h,x=void 0!==a,[p,v]=i.useState(r),g=x?a:p,f=m?"mobile":"desktop";i.useEffect(()=>{x||v(r)},[r,x]);const changePage=e=>{x||v(e),s?.(e)},buildHref=e=>{if(!l)return"#";try{const i=new URL(l,"http://localhost");i.searchParams.set("page",String(e));const{pathname:n,search:t,hash:a}=i;return`${n}${t}${a}`}catch{const i=l.includes("?");return`${l}${i?"&":"?"}page=${e}`}};return e.jsx(PaginationRoot,{className:o,...u,children:e.jsxs(PaginationContent,{device:f,children:[e.jsx(PaginationItem,{children:e.jsx(PaginationPrevious,{href:buildHref(Math.max(1,g-1)),linkComponent:d,onClick:e=>{s&&e.preventDefault(),g>1&&changePage(g-1)},variant:"nextPrev",device:f,"aria-disabled":1===g,tabIndex:1===g?-1:0})}),function(){const i=[];if(n<=5)for(let t=1;t<=n;t++)i.push(e.jsx(PaginationItem,{children:e.jsx(PaginationLink,{href:buildHref(t),isActive:g===t,variant:"main",device:f,linkComponent:d,onClick:e=>{s&&e.preventDefault(),g!==t&&changePage(t)},"aria-disabled":g===t,tabIndex:g===t?-1:0,children:t})},t));else{i.push(e.jsx(PaginationItem,{children:e.jsx(PaginationLink,{href:buildHref(1),isActive:1===g,device:f,variant:"main",linkComponent:d,onClick:e=>{s&&e.preventDefault(),1!==g&&changePage(1)},"aria-disabled":1===g,tabIndex:1===g?-1:0,children:"1"})},1)),g>3&&i.push(e.jsx(PaginationItem,{children:e.jsx(PaginationEllipsis,{})},"start-ellipsis"));const t=Math.max(2,g-1),a=Math.min(n-1,g+1);for(let n=t;n<=a;n++)i.push(e.jsx(PaginationItem,{children:e.jsx(PaginationLink,{href:buildHref(n),isActive:g===n,device:f,variant:"main",linkComponent:d,onClick:e=>{s&&e.preventDefault(),g!==n&&changePage(n)},"aria-disabled":g===n,tabIndex:g===n?-1:0,children:n})},n));g<n-2&&i.push(e.jsx(PaginationItem,{children:e.jsx(PaginationEllipsis,{})},"end-ellipsis")),i.push(e.jsx(PaginationItem,{children:e.jsx(PaginationLink,{href:buildHref(n),isActive:g===n,device:f,variant:"main",linkComponent:d,onClick:e=>{s&&e.preventDefault(),g!==n&&changePage(n)},"aria-disabled":g===n,tabIndex:g===n?-1:0,children:n})},n))}return i}(),e.jsx(PaginationItem,{children:e.jsx(PaginationNext,{href:buildHref(Math.min(n,g+1)),linkComponent:d,onClick:e=>{s&&e.preventDefault(),g<n&&changePage(g+1)},variant:"nextPrev",device:f,"aria-disabled":g===n,tabIndex:g===n?-1:0})})]})})};
|
package/dist/esm/Pagination.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use client";import{jsx as e,jsxs as i,Fragment as
|
|
1
|
+
"use client";import{jsx as e,jsxs as i,Fragment as n}from"react/jsx-runtime";import{useState as t,useEffect as a}from"react";import r from"./utils.js";import{useMobile as o}from"./contexts.js";import{c as l}from"./chunks/createLucideIcon-DGp0SoUT.js";import{C as s}from"./chunks/chevron-left-4HSuTes3.js";const c=l("chevron-right",[["path",{d:"m9 18 6-6-6-6",key:"mthhwq"}]]),d=l("chevrons-left",[["path",{d:"m11 17-5-5 5-5",key:"13zhaf"}],["path",{d:"m18 17-5-5 5-5",key:"h8a8et"}]]),m=l("chevrons-right",[["path",{d:"m6 17 5-5-5-5",key:"xnjwq"}],["path",{d:"m13 17 5-5-5-5",key:"17xmmf"}]]),h=l("ellipsis",[["circle",{cx:"12",cy:"12",r:"1",key:"41hilf"}],["circle",{cx:"19",cy:"12",r:"1",key:"1wjl8i"}],["circle",{cx:"5",cy:"12",r:"1",key:"1pcz8c"}]]);function PaginationRoot({className:i,...n}){return e("nav",{role:"navigation","aria-label":"pagination","data-slot":"pagination",className:r("mx-auto flex w-full justify-center",i),...n})}function PaginationContent({className:i,device:n,...t}){return e("ul",{"data-slot":"pagination-content",className:r("flex flex-row items-center","mobile"===n?"gap-1.5":"gap-2",i),...t})}function PaginationItem({...i}){return e("li",{"data-slot":"pagination-item",...i})}function PaginationLink({className:i,device:n,variant:t,isActive:a,linkComponent:o,...l}){return e(o??"a",{"aria-current":a?"page":void 0,"data-slot":"pagination-link","data-active":a,className:r(buttonVariants({variant:"nextPrev"===t?t:a?"active":"outline",device:n}),i),tabIndex:l["aria-disabled"]?-1:0,...l})}function PaginationPrevious({className:t,device:a,variant:r,...o}){const l="mobile"===a,s={mobile:e(c,{size:18}),desktop:i(n,{children:[e(m,{size:20})," ",e("span",{children:"قبلی"})]})};return e(PaginationLink,{"aria-label":"Go to previous page",className:l?"ml-2.5":"flex justify-center items-center gap-2 w-20 h-12 ml-4",device:a,variant:"nextPrev",...o,children:"mobile"===a?s.mobile:s.desktop})}function PaginationNext({className:t,device:a,variant:r,...o}){const l="mobile"===a,c={mobile:e(s,{size:18}),desktop:i(n,{children:[e("span",{children:"بعدی"}),e(d,{size:20})]})};return e(PaginationLink,{"aria-label":"Go to next page",className:l?"mr-2.5":"flex justify-center items-center gap-2 w-20 h-12 mr-4",device:a,variant:"nextPrev",...o,children:"mobile"===a?c.mobile:c.desktop})}function PaginationEllipsis({className:i,...n}){return e("span",{"aria-hidden":!0,"data-slot":"pagination-ellipsis",className:r("flex size-9 items-center justify-center",i),...n,children:e(h,{className:"size-4"})})}function buttonVariants({variant:e,device:i}){const n="mobile"===i;return[r({"flex items-center justify-center rounded-[6px]":!0,"w-10 h-10 text-s font-heavy":n,"w-12 h-12 text-l font-heavy":!n}),{outline:"border border-neutral-light bg-white text-neutral-darker",active:"bg-primary text-white",nextPrev:"border border-neutral-light bg-white text-neutral-darker"}[e]].join(" ")}const Pagination=({pageCount:n,page:r,defaultPage:l=1,onPageChange:s,className:c,isMobile:d,baseUrl:m,linkComponent:h,...p})=>{const u=o(),v=d??u,g=void 0!==r,[f,x]=t(l),b=g?r:f,k=v?"mobile":"desktop";a(()=>{g||x(l)},[l,g]);const changePage=e=>{g||x(e),s?.(e)},buildHref=e=>{if(!m)return"#";try{const i=new URL(m,"http://localhost");i.searchParams.set("page",String(e));const{pathname:n,search:t,hash:a}=i;return`${n}${t}${a}`}catch{const i=m.includes("?");return`${m}${i?"&":"?"}page=${e}`}};return e(PaginationRoot,{className:c,...p,children:i(PaginationContent,{device:k,children:[e(PaginationItem,{children:e(PaginationPrevious,{href:buildHref(Math.max(1,b-1)),linkComponent:h,onClick:e=>{s&&e.preventDefault(),b>1&&changePage(b-1)},variant:"nextPrev",device:k,"aria-disabled":1===b,tabIndex:1===b?-1:0})}),function(){const i=[];if(n<=5)for(let t=1;t<=n;t++)i.push(e(PaginationItem,{children:e(PaginationLink,{href:buildHref(t),isActive:b===t,variant:"main",device:k,linkComponent:h,onClick:e=>{s&&e.preventDefault(),b!==t&&changePage(t)},"aria-disabled":b===t,tabIndex:b===t?-1:0,children:t})},t));else{i.push(e(PaginationItem,{children:e(PaginationLink,{href:buildHref(1),isActive:1===b,device:k,variant:"main",linkComponent:h,onClick:e=>{s&&e.preventDefault(),1!==b&&changePage(1)},"aria-disabled":1===b,tabIndex:1===b?-1:0,children:"1"})},1)),b>3&&i.push(e(PaginationItem,{children:e(PaginationEllipsis,{})},"start-ellipsis"));const t=Math.max(2,b-1),a=Math.min(n-1,b+1);for(let n=t;n<=a;n++)i.push(e(PaginationItem,{children:e(PaginationLink,{href:buildHref(n),isActive:b===n,device:k,variant:"main",linkComponent:h,onClick:e=>{s&&e.preventDefault(),b!==n&&changePage(n)},"aria-disabled":b===n,tabIndex:b===n?-1:0,children:n})},n));b<n-2&&i.push(e(PaginationItem,{children:e(PaginationEllipsis,{})},"end-ellipsis")),i.push(e(PaginationItem,{children:e(PaginationLink,{href:buildHref(n),isActive:b===n,device:k,variant:"main",linkComponent:h,onClick:e=>{s&&e.preventDefault(),b!==n&&changePage(n)},"aria-disabled":b===n,tabIndex:b===n?-1:0,children:n})},n))}return i}(),e(PaginationItem,{children:e(PaginationNext,{href:buildHref(Math.min(n,b+1)),linkComponent:h,onClick:e=>{s&&e.preventDefault(),b<n&&changePage(b+1)},variant:"nextPrev",device:k,"aria-disabled":b===n,tabIndex:b===n?-1:0})})]})})};export{Pagination};
|
package/dist/types/Pagination.js
CHANGED
|
@@ -63,13 +63,14 @@ function PaginationRoot({ className, ...props }) {
|
|
|
63
63
|
return (jsx("nav", { role: "navigation", "aria-label": "pagination", "data-slot": "pagination", className: cn('mx-auto flex w-full justify-center', className), ...props }));
|
|
64
64
|
}
|
|
65
65
|
function PaginationContent({ className, device, ...props }) {
|
|
66
|
-
return (jsx("ul", { "data-slot": "pagination-content", className: cn('flex flex-row items-center', device === 'mobile' ? 'gap-
|
|
66
|
+
return (jsx("ul", { "data-slot": "pagination-content", className: cn('flex flex-row items-center', device === 'mobile' ? 'gap-1.5' : 'gap-2', className), ...props }));
|
|
67
67
|
}
|
|
68
68
|
function PaginationItem({ ...props }) {
|
|
69
69
|
return jsx("li", { "data-slot": "pagination-item", ...props });
|
|
70
70
|
}
|
|
71
|
-
function PaginationLink({ className, device, variant, isActive, ...props }) {
|
|
72
|
-
|
|
71
|
+
function PaginationLink({ className, device, variant, isActive, linkComponent, ...props }) {
|
|
72
|
+
const Comp = linkComponent ?? 'a';
|
|
73
|
+
return (jsx(Comp, { "aria-current": isActive ? 'page' : undefined, "data-slot": "pagination-link", "data-active": isActive, className: cn(buttonVariants({
|
|
73
74
|
variant: variant === 'nextPrev' ? variant : isActive ? 'active' : 'outline',
|
|
74
75
|
device,
|
|
75
76
|
}), className), tabIndex: props['aria-disabled'] ? -1 : 0, ...props }));
|
|
@@ -81,7 +82,7 @@ function PaginationPrevious({ className, device, variant, ...props }) {
|
|
|
81
82
|
desktop: (jsxs(Fragment, { children: [jsx(ChevronsRight, { size: 20 }), " ", jsx("span", { children: "\u0642\u0628\u0644\u06CC" })] })),
|
|
82
83
|
};
|
|
83
84
|
return (jsx(PaginationLink, { "aria-label": "Go to previous page", className: !isMobile
|
|
84
|
-
? 'flex justify-center items-center gap-2 w-
|
|
85
|
+
? 'flex justify-center items-center gap-2 w-20 h-12 ml-4'
|
|
85
86
|
: 'ml-2.5', device: device, variant: "nextPrev", ...props, children: device === 'mobile' ? content.mobile : content.desktop }));
|
|
86
87
|
}
|
|
87
88
|
function PaginationNext({ className, device, variant, ...props }) {
|
|
@@ -91,7 +92,7 @@ function PaginationNext({ className, device, variant, ...props }) {
|
|
|
91
92
|
desktop: (jsxs(Fragment, { children: [jsx("span", { children: "\u0628\u0639\u062F\u06CC" }), jsx(ChevronsLeft, { size: 20 })] })),
|
|
92
93
|
};
|
|
93
94
|
return (jsx(PaginationLink, { "aria-label": "Go to next page", className: !isMobile
|
|
94
|
-
? 'flex justify-center items-center gap-2 w-
|
|
95
|
+
? 'flex justify-center items-center gap-2 w-20 h-12 mr-4'
|
|
95
96
|
: 'mr-2.5', device: device, variant: "nextPrev", ...props, children: device === 'mobile' ? content.mobile : content.desktop }));
|
|
96
97
|
}
|
|
97
98
|
function PaginationEllipsis({ className, ...props }) {
|
|
@@ -101,8 +102,8 @@ function buttonVariants({ variant, device, }) {
|
|
|
101
102
|
const isMobile = device === 'mobile';
|
|
102
103
|
const base = cn({
|
|
103
104
|
'flex items-center justify-center rounded-[6px]': true,
|
|
104
|
-
'w-
|
|
105
|
-
'w-
|
|
105
|
+
'w-10 h-10 text-s font-heavy': isMobile,
|
|
106
|
+
'w-12 h-12 text-l font-heavy': !isMobile,
|
|
106
107
|
});
|
|
107
108
|
const variants = {
|
|
108
109
|
outline: 'border border-neutral-light bg-white text-neutral-darker',
|
|
@@ -111,7 +112,7 @@ function buttonVariants({ variant, device, }) {
|
|
|
111
112
|
};
|
|
112
113
|
return [base, variants[variant]].join(' ');
|
|
113
114
|
}
|
|
114
|
-
const Pagination = ({ pageCount, page: controlledPage, defaultPage = 1, onPageChange, className, isMobile, ...navProps }) => {
|
|
115
|
+
const Pagination = ({ pageCount, page: controlledPage, defaultPage = 1, onPageChange, className, isMobile, baseUrl, linkComponent, ...navProps }) => {
|
|
115
116
|
const detectedIsMobile = useMobile();
|
|
116
117
|
const actualIsMobile = isMobile ?? detectedIsMobile;
|
|
117
118
|
const isControlled = controlledPage !== undefined;
|
|
@@ -127,12 +128,30 @@ const Pagination = ({ pageCount, page: controlledPage, defaultPage = 1, onPageCh
|
|
|
127
128
|
setInternalPage(newPage);
|
|
128
129
|
onPageChange?.(newPage);
|
|
129
130
|
};
|
|
131
|
+
const buildHref = (targetPage) => {
|
|
132
|
+
if (!baseUrl)
|
|
133
|
+
return '#';
|
|
134
|
+
try {
|
|
135
|
+
const url = new URL(baseUrl, 'http://localhost');
|
|
136
|
+
url.searchParams.set('page', String(targetPage));
|
|
137
|
+
const { pathname, search, hash } = url; // search already includes leading '?'
|
|
138
|
+
return `${pathname}${search}${hash}`;
|
|
139
|
+
}
|
|
140
|
+
catch {
|
|
141
|
+
// Fallback naive concatenation
|
|
142
|
+
const hasQuery = baseUrl.includes('?');
|
|
143
|
+
const sep = hasQuery ? '&' : '?';
|
|
144
|
+
return `${baseUrl}${sep}page=${targetPage}`;
|
|
145
|
+
}
|
|
146
|
+
};
|
|
130
147
|
function renderPages() {
|
|
131
148
|
const items = [];
|
|
132
149
|
if (pageCount <= 5) {
|
|
133
150
|
for (let i = 1; i <= pageCount; i++) {
|
|
134
|
-
items.push(jsx(PaginationItem, { children: jsx(PaginationLink, { href:
|
|
135
|
-
|
|
151
|
+
items.push(jsx(PaginationItem, { children: jsx(PaginationLink, { href: buildHref(i), isActive: page === i, variant: "main", device: device, linkComponent: linkComponent, onClick: (e) => {
|
|
152
|
+
if (onPageChange) {
|
|
153
|
+
e.preventDefault();
|
|
154
|
+
}
|
|
136
155
|
if (page !== i)
|
|
137
156
|
changePage(i);
|
|
138
157
|
}, "aria-disabled": page === i, tabIndex: page === i ? -1 : 0, children: i }) }, i));
|
|
@@ -140,8 +159,10 @@ const Pagination = ({ pageCount, page: controlledPage, defaultPage = 1, onPageCh
|
|
|
140
159
|
}
|
|
141
160
|
else {
|
|
142
161
|
// First page
|
|
143
|
-
items.push(jsx(PaginationItem, { children: jsx(PaginationLink, { href:
|
|
144
|
-
|
|
162
|
+
items.push(jsx(PaginationItem, { children: jsx(PaginationLink, { href: buildHref(1), isActive: page === 1, device: device, variant: "main", linkComponent: linkComponent, onClick: (e) => {
|
|
163
|
+
if (onPageChange) {
|
|
164
|
+
e.preventDefault();
|
|
165
|
+
}
|
|
145
166
|
if (page !== 1)
|
|
146
167
|
changePage(1);
|
|
147
168
|
}, "aria-disabled": page === 1, tabIndex: page === 1 ? -1 : 0, children: "1" }) }, 1));
|
|
@@ -153,8 +174,10 @@ const Pagination = ({ pageCount, page: controlledPage, defaultPage = 1, onPageCh
|
|
|
153
174
|
const start = Math.max(2, page - 1);
|
|
154
175
|
const end = Math.min(pageCount - 1, page + 1);
|
|
155
176
|
for (let i = start; i <= end; i++) {
|
|
156
|
-
items.push(jsx(PaginationItem, { children: jsx(PaginationLink, { href:
|
|
157
|
-
|
|
177
|
+
items.push(jsx(PaginationItem, { children: jsx(PaginationLink, { href: buildHref(i), isActive: page === i, device: device, variant: "main", linkComponent: linkComponent, onClick: (e) => {
|
|
178
|
+
if (onPageChange) {
|
|
179
|
+
e.preventDefault();
|
|
180
|
+
}
|
|
158
181
|
if (page !== i)
|
|
159
182
|
changePage(i);
|
|
160
183
|
}, "aria-disabled": page === i, tabIndex: page === i ? -1 : 0, children: i }) }, i));
|
|
@@ -164,20 +187,26 @@ const Pagination = ({ pageCount, page: controlledPage, defaultPage = 1, onPageCh
|
|
|
164
187
|
items.push(jsx(PaginationItem, { children: jsx(PaginationEllipsis, {}) }, "end-ellipsis"));
|
|
165
188
|
}
|
|
166
189
|
// Last page
|
|
167
|
-
items.push(jsx(PaginationItem, { children: jsx(PaginationLink, { href:
|
|
168
|
-
|
|
190
|
+
items.push(jsx(PaginationItem, { children: jsx(PaginationLink, { href: buildHref(pageCount), isActive: page === pageCount, device: device, variant: "main", linkComponent: linkComponent, onClick: (e) => {
|
|
191
|
+
if (onPageChange) {
|
|
192
|
+
e.preventDefault();
|
|
193
|
+
}
|
|
169
194
|
if (page !== pageCount)
|
|
170
195
|
changePage(pageCount);
|
|
171
196
|
}, "aria-disabled": page === pageCount, tabIndex: page === pageCount ? -1 : 0, children: pageCount }) }, pageCount));
|
|
172
197
|
}
|
|
173
198
|
return items;
|
|
174
199
|
}
|
|
175
|
-
return (jsx(PaginationRoot, { className: className, ...navProps, children: jsxs(PaginationContent, { device:
|
|
176
|
-
|
|
200
|
+
return (jsx(PaginationRoot, { className: className, ...navProps, children: jsxs(PaginationContent, { device: device, children: [jsx(PaginationItem, { children: jsx(PaginationPrevious, { href: buildHref(Math.max(1, page - 1)), linkComponent: linkComponent, onClick: (e) => {
|
|
201
|
+
if (onPageChange) {
|
|
202
|
+
e.preventDefault();
|
|
203
|
+
}
|
|
177
204
|
if (page > 1)
|
|
178
205
|
changePage(page - 1);
|
|
179
|
-
}, variant: "nextPrev", device: device, "aria-disabled": page === 1, tabIndex: page === 1 ? -1 : 0 }) }), renderPages(), jsx(PaginationItem, { children: jsx(PaginationNext, { href:
|
|
180
|
-
|
|
206
|
+
}, variant: "nextPrev", device: device, "aria-disabled": page === 1, tabIndex: page === 1 ? -1 : 0 }) }), renderPages(), jsx(PaginationItem, { children: jsx(PaginationNext, { href: buildHref(Math.min(pageCount, page + 1)), linkComponent: linkComponent, onClick: (e) => {
|
|
207
|
+
if (onPageChange) {
|
|
208
|
+
e.preventDefault();
|
|
209
|
+
}
|
|
181
210
|
if (page < pageCount)
|
|
182
211
|
changePage(page + 1);
|
|
183
212
|
}, variant: "nextPrev", device: device, "aria-disabled": page === pageCount, tabIndex: page === pageCount ? -1 : 0 }) })] }) }));
|
|
@@ -8,5 +8,13 @@ export interface UnifiedPaginationProps {
|
|
|
8
8
|
* Whether the component is in mobile mode (optional, auto-detected if not provided)
|
|
9
9
|
*/
|
|
10
10
|
isMobile?: boolean;
|
|
11
|
+
/**
|
|
12
|
+
* Base URL to construct hrefs, e.g. "/products" -> "/products?page=2"
|
|
13
|
+
*/
|
|
14
|
+
baseUrl?: string;
|
|
15
|
+
/**
|
|
16
|
+
* Custom link component to render instead of <a/>
|
|
17
|
+
*/
|
|
18
|
+
linkComponent?: React.ElementType<React.AnchorHTMLAttributes<HTMLAnchorElement>>;
|
|
11
19
|
}
|
|
12
20
|
export declare const Pagination: React.FC<UnifiedPaginationProps>;
|
|
@@ -36,6 +36,14 @@ declare const _default: {
|
|
|
36
36
|
};
|
|
37
37
|
defaultValue: undefined;
|
|
38
38
|
};
|
|
39
|
+
baseUrl: {
|
|
40
|
+
name: string;
|
|
41
|
+
control: {
|
|
42
|
+
type: string;
|
|
43
|
+
};
|
|
44
|
+
defaultValue: string;
|
|
45
|
+
description: string;
|
|
46
|
+
};
|
|
39
47
|
isMobile: {
|
|
40
48
|
name: string;
|
|
41
49
|
control: {
|
|
@@ -50,23 +58,26 @@ export default _default;
|
|
|
50
58
|
type StoryProps = {
|
|
51
59
|
pageCount: number;
|
|
52
60
|
defaultPage: number;
|
|
61
|
+
baseUrl: string;
|
|
53
62
|
isMobile: boolean;
|
|
54
63
|
};
|
|
55
64
|
export declare const Uncontrolled: {
|
|
56
|
-
({ pageCount, defaultPage, isMobile, }: StoryProps): import("react/jsx-runtime").JSX.Element;
|
|
65
|
+
({ pageCount, defaultPage, baseUrl, isMobile, }: StoryProps): import("react/jsx-runtime").JSX.Element;
|
|
57
66
|
storyName: string;
|
|
58
67
|
args: {
|
|
59
68
|
pageCount: number;
|
|
60
69
|
defaultPage: number;
|
|
70
|
+
baseUrl: string;
|
|
61
71
|
isMobile: boolean;
|
|
62
72
|
};
|
|
63
73
|
};
|
|
64
74
|
export declare const Controlled: {
|
|
65
|
-
({ pageCount, defaultPage, isMobile, }: StoryProps): import("react/jsx-runtime").JSX.Element;
|
|
75
|
+
({ pageCount, defaultPage, baseUrl, isMobile, }: StoryProps): import("react/jsx-runtime").JSX.Element;
|
|
66
76
|
storyName: string;
|
|
67
77
|
args: {
|
|
68
78
|
pageCount: number;
|
|
69
79
|
defaultPage: number;
|
|
80
|
+
baseUrl: string;
|
|
70
81
|
isMobile: boolean;
|
|
71
82
|
};
|
|
72
83
|
};
|
|
@@ -74,3 +85,13 @@ export declare const ResponsiveComparison: {
|
|
|
74
85
|
(): import("react/jsx-runtime").JSX.Element;
|
|
75
86
|
storyName: string;
|
|
76
87
|
};
|
|
88
|
+
export declare const WithCustomLinkComponent: {
|
|
89
|
+
({ pageCount, defaultPage, baseUrl, isMobile, }: StoryProps): import("react/jsx-runtime").JSX.Element;
|
|
90
|
+
storyName: string;
|
|
91
|
+
args: {
|
|
92
|
+
pageCount: number;
|
|
93
|
+
defaultPage: number;
|
|
94
|
+
baseUrl: string;
|
|
95
|
+
isMobile: boolean;
|
|
96
|
+
};
|
|
97
|
+
};
|
package/package.json
CHANGED
|
@@ -1,176 +1,176 @@
|
|
|
1
|
-
{
|
|
2
|
-
"name": "automoby-kit",
|
|
3
|
-
"version": "1.0.
|
|
4
|
-
"description": "A comprehensive React UI component library - created in war 2025",
|
|
5
|
-
"main": "dist/cjs/index.js",
|
|
6
|
-
"module": "dist/esm/index.js",
|
|
7
|
-
"types": "dist/types/index.d.ts",
|
|
8
|
-
"files": [
|
|
9
|
-
"dist"
|
|
10
|
-
],
|
|
11
|
-
"exports": {
|
|
12
|
-
".": {
|
|
13
|
-
"import": "./dist/esm/index.js",
|
|
14
|
-
"require": "./dist/cjs/index.js",
|
|
15
|
-
"types": "./dist/types/index.d.ts"
|
|
16
|
-
},
|
|
17
|
-
"./Typography": {
|
|
18
|
-
"import": "./dist/esm/Typography.js",
|
|
19
|
-
"require": "./dist/cjs/Typography.js",
|
|
20
|
-
"types": "./dist/types/components/Typography/Typography.d.ts"
|
|
21
|
-
},
|
|
22
|
-
"./Button": {
|
|
23
|
-
"import": "./dist/esm/Button.js",
|
|
24
|
-
"require": "./dist/cjs/Button.js",
|
|
25
|
-
"types": "./dist/types/components/Button/Button.d.ts"
|
|
26
|
-
},
|
|
27
|
-
"./Input": {
|
|
28
|
-
"import": "./dist/esm/Input.js",
|
|
29
|
-
"require": "./dist/cjs/Input.js",
|
|
30
|
-
"types": "./dist/types/components/Input/Input.d.ts"
|
|
31
|
-
},
|
|
32
|
-
"./Tabs": {
|
|
33
|
-
"import": "./dist/esm/Tabs.js",
|
|
34
|
-
"require": "./dist/cjs/Tabs.js",
|
|
35
|
-
"types": "./dist/types/components/Tabs/Tabs.d.ts"
|
|
36
|
-
},
|
|
37
|
-
"./Drawer": {
|
|
38
|
-
"import": "./dist/esm/Drawer.js",
|
|
39
|
-
"require": "./dist/cjs/Drawer.js",
|
|
40
|
-
"types": "./dist/types/components/Drawer/Drawer.d.ts"
|
|
41
|
-
},
|
|
42
|
-
"./Backdrop": {
|
|
43
|
-
"import": "./dist/esm/Backdrop.js",
|
|
44
|
-
"require": "./dist/cjs/Backdrop.js",
|
|
45
|
-
"types": "./dist/types/components/Backdrop/Backdrop.d.ts"
|
|
46
|
-
},
|
|
47
|
-
"./Breadcrumb": {
|
|
48
|
-
"import": "./dist/esm/Breadcrumb.js",
|
|
49
|
-
"require": "./dist/cjs/Breadcrumb.js",
|
|
50
|
-
"types": "./dist/types/components/Breadcrumb/Breadcrumb.d.ts"
|
|
51
|
-
},
|
|
52
|
-
"./Pagination": {
|
|
53
|
-
"import": "./dist/esm/Pagination.js",
|
|
54
|
-
"require": "./dist/cjs/Pagination.js",
|
|
55
|
-
"types": "./dist/types/components/Pagination/Pagination.d.ts"
|
|
56
|
-
},
|
|
57
|
-
"./Accordion": {
|
|
58
|
-
"import": "./dist/esm/Accordion.js",
|
|
59
|
-
"require": "./dist/cjs/Accordion.js",
|
|
60
|
-
"types": "./dist/types/components/Accordion/Accordion.d.ts"
|
|
61
|
-
},
|
|
62
|
-
"./Divider": {
|
|
63
|
-
"import": "./dist/esm/Divider.js",
|
|
64
|
-
"require": "./dist/cjs/Divider.js",
|
|
65
|
-
"types": "./dist/types/components/Divider/Divider.d.ts"
|
|
66
|
-
},
|
|
67
|
-
"./RadioGroup": {
|
|
68
|
-
"import": "./dist/esm/RadioGroup.js",
|
|
69
|
-
"require": "./dist/cjs/RadioGroup.js",
|
|
70
|
-
"types": "./dist/types/components/RadioGroup/RadioGroup.d.ts"
|
|
71
|
-
},
|
|
72
|
-
"./Chips": {
|
|
73
|
-
"import": "./dist/esm/Chips.js",
|
|
74
|
-
"require": "./dist/cjs/Chips.js",
|
|
75
|
-
"types": "./dist/types/components/Chips/Chips.d.ts"
|
|
76
|
-
},
|
|
77
|
-
"./Menu": {
|
|
78
|
-
"import": "./dist/esm/Menu.js",
|
|
79
|
-
"require": "./dist/cjs/Menu.js",
|
|
80
|
-
"types": "./dist/types/components/Menu/Menu.d.ts"
|
|
81
|
-
},
|
|
82
|
-
"./contexts": {
|
|
83
|
-
"import": "./dist/esm/contexts.js",
|
|
84
|
-
"require": "./dist/cjs/contexts.js",
|
|
85
|
-
"types": "./dist/types/contexts/index.d.ts"
|
|
86
|
-
},
|
|
87
|
-
"./utils": {
|
|
88
|
-
"import": "./dist/esm/utils.js",
|
|
89
|
-
"require": "./dist/cjs/utils.js",
|
|
90
|
-
"types": "./dist/types/utils/cn.d.ts"
|
|
91
|
-
}
|
|
92
|
-
},
|
|
93
|
-
"keywords": [
|
|
94
|
-
"react",
|
|
95
|
-
"ui",
|
|
96
|
-
"components",
|
|
97
|
-
"typescript",
|
|
98
|
-
"tailwind",
|
|
99
|
-
"kit"
|
|
100
|
-
],
|
|
101
|
-
"scripts": {
|
|
102
|
-
"test": "echo \"Error: no test specified\" && exit 1",
|
|
103
|
-
"lint": "eslint \"src/**/*.{js,ts,jsx,tsx}\" --fix",
|
|
104
|
-
"format": "prettier --write \"src/**/*.{js,jsx,ts,tsx,json,css,md}\"",
|
|
105
|
-
"check-format": "prettier --check \"src/**/*.{js,jsx,ts,tsx,json,css,md}\"",
|
|
106
|
-
"check-lint": "eslint \"src/**/*.{js,ts,jsx,tsx}\"",
|
|
107
|
-
"check-types": "tsc --noEmit",
|
|
108
|
-
"prepare": "husky",
|
|
109
|
-
"prepublishOnly": "npm run build",
|
|
110
|
-
"storybook": "storybook dev -p 6006",
|
|
111
|
-
"storybook:dev": "concurrently \"npm:build:storybook:css:watch\" \"cross-env STORYBOOK_FORCE_MOBILE=true storybook dev -p 6006 \"",
|
|
112
|
-
"storybook:dev:mobile": "concurrently \"npm:build:storybook:css:watch\" \"cross-env STORYBOOK_FORCE_MOBILE=true storybook dev -p 6006 \"",
|
|
113
|
-
"storybook:dev:desktop": "concurrently \"npm:build:storybook:css:watch\" \"cross-env STORYBOOK_FORCE_MOBILE=false storybook dev -p 6006 \"",
|
|
114
|
-
"build-storybook": "storybook build",
|
|
115
|
-
"build:storybook:css:watch": "npx @tailwindcss/cli -i ./.storybook/tailwind.css -o ./tailwind-build/tailwind.build.css --watch",
|
|
116
|
-
"build:storybook:css": "npx @tailwindcss/cli -i ./.storybook/tailwind.css -o ./tailwind-build/tailwind.build.css",
|
|
117
|
-
"clean": "rimraf dist",
|
|
118
|
-
"build": "npm run clean && rollup -c"
|
|
119
|
-
},
|
|
120
|
-
"author": "Ghazal_kordi Alireza_mirzaee",
|
|
121
|
-
"license": "ISC",
|
|
122
|
-
"peerDependencies": {
|
|
123
|
-
"clsx": "^2.1.1",
|
|
124
|
-
"lucide-react": "^0.522.0",
|
|
125
|
-
"react": "^19.1.0",
|
|
126
|
-
"react-dom": "^19.1.0",
|
|
127
|
-
"tailwindcss": "^4.1.10",
|
|
128
|
-
"typescript": "^5.8.3",
|
|
129
|
-
"ua-parser-js": "^2.0.4"
|
|
130
|
-
},
|
|
131
|
-
"devDependencies": {
|
|
132
|
-
"@rollup/plugin-alias": "^5.1.1",
|
|
133
|
-
"@rollup/plugin-commonjs": "^28.0.6",
|
|
134
|
-
"@rollup/plugin-node-resolve": "^16.0.1",
|
|
135
|
-
"@rollup/plugin-terser": "^0.4.4",
|
|
136
|
-
"@rollup/plugin-typescript": "^12.1.3",
|
|
137
|
-
"@storybook/addon-docs": "^9.0.6",
|
|
138
|
-
"@storybook/addon-onboarding": "^9.0.6",
|
|
139
|
-
"@storybook/react-vite": "^9.0.6",
|
|
140
|
-
"@tailwindcss/cli": "^4.1.10",
|
|
141
|
-
"@tailwindcss/postcss": "^4.1.10",
|
|
142
|
-
"@types/node": "^24.0.3",
|
|
143
|
-
"@types/react": "^19.1.4",
|
|
144
|
-
"@types/react-dom": "^19.1.5",
|
|
145
|
-
"@types/ua-parser-js": "^0.7.39",
|
|
146
|
-
"@typescript-eslint/eslint-plugin": "^7.18.0",
|
|
147
|
-
"@typescript-eslint/parser": "^7.18.0",
|
|
148
|
-
"autoprefixer": "^10.4.21",
|
|
149
|
-
"clsx": "^2.1.1",
|
|
150
|
-
"concurrently": "^9.2.0",
|
|
151
|
-
"cross-env": "^7.0.3",
|
|
152
|
-
"eslint": "^8.57.0",
|
|
153
|
-
"eslint-config-airbnb": "^19.0.4",
|
|
154
|
-
"eslint-config-airbnb-typescript": "^18.0.0",
|
|
155
|
-
"eslint-config-prettier": "^10.1.5",
|
|
156
|
-
"eslint-import-resolver-typescript": "^4.4.3",
|
|
157
|
-
"eslint-plugin-import": "^2.32.0",
|
|
158
|
-
"eslint-plugin-jsx-a11y": "^6.10.2",
|
|
159
|
-
"eslint-plugin-prettier": "^5.5.0",
|
|
160
|
-
"eslint-plugin-react": "^7.37.5",
|
|
161
|
-
"eslint-plugin-storybook": "^9.0.6",
|
|
162
|
-
"husky": "^9.1.7",
|
|
163
|
-
"lucide-react": "^0.522.0",
|
|
164
|
-
"prettier": "^3.5.3",
|
|
165
|
-
"react": "^19.1.0",
|
|
166
|
-
"react-dom": "^19.1.0",
|
|
167
|
-
"rimraf": "^6.0.1",
|
|
168
|
-
"rollup": "^4.44.0",
|
|
169
|
-
"serve": "^14.2.4",
|
|
170
|
-
"storybook": "^9.0.6",
|
|
171
|
-
"tailwind-merge": "^3.3.1",
|
|
172
|
-
"tailwindcss": "^4.1.10",
|
|
173
|
-
"typescript": "^5.8.3",
|
|
174
|
-
"ua-parser-js": "^2.0.4"
|
|
175
|
-
}
|
|
176
|
-
}
|
|
1
|
+
{
|
|
2
|
+
"name": "automoby-kit",
|
|
3
|
+
"version": "1.0.43",
|
|
4
|
+
"description": "A comprehensive React UI component library - created in war 2025",
|
|
5
|
+
"main": "dist/cjs/index.js",
|
|
6
|
+
"module": "dist/esm/index.js",
|
|
7
|
+
"types": "dist/types/index.d.ts",
|
|
8
|
+
"files": [
|
|
9
|
+
"dist"
|
|
10
|
+
],
|
|
11
|
+
"exports": {
|
|
12
|
+
".": {
|
|
13
|
+
"import": "./dist/esm/index.js",
|
|
14
|
+
"require": "./dist/cjs/index.js",
|
|
15
|
+
"types": "./dist/types/index.d.ts"
|
|
16
|
+
},
|
|
17
|
+
"./Typography": {
|
|
18
|
+
"import": "./dist/esm/Typography.js",
|
|
19
|
+
"require": "./dist/cjs/Typography.js",
|
|
20
|
+
"types": "./dist/types/components/Typography/Typography.d.ts"
|
|
21
|
+
},
|
|
22
|
+
"./Button": {
|
|
23
|
+
"import": "./dist/esm/Button.js",
|
|
24
|
+
"require": "./dist/cjs/Button.js",
|
|
25
|
+
"types": "./dist/types/components/Button/Button.d.ts"
|
|
26
|
+
},
|
|
27
|
+
"./Input": {
|
|
28
|
+
"import": "./dist/esm/Input.js",
|
|
29
|
+
"require": "./dist/cjs/Input.js",
|
|
30
|
+
"types": "./dist/types/components/Input/Input.d.ts"
|
|
31
|
+
},
|
|
32
|
+
"./Tabs": {
|
|
33
|
+
"import": "./dist/esm/Tabs.js",
|
|
34
|
+
"require": "./dist/cjs/Tabs.js",
|
|
35
|
+
"types": "./dist/types/components/Tabs/Tabs.d.ts"
|
|
36
|
+
},
|
|
37
|
+
"./Drawer": {
|
|
38
|
+
"import": "./dist/esm/Drawer.js",
|
|
39
|
+
"require": "./dist/cjs/Drawer.js",
|
|
40
|
+
"types": "./dist/types/components/Drawer/Drawer.d.ts"
|
|
41
|
+
},
|
|
42
|
+
"./Backdrop": {
|
|
43
|
+
"import": "./dist/esm/Backdrop.js",
|
|
44
|
+
"require": "./dist/cjs/Backdrop.js",
|
|
45
|
+
"types": "./dist/types/components/Backdrop/Backdrop.d.ts"
|
|
46
|
+
},
|
|
47
|
+
"./Breadcrumb": {
|
|
48
|
+
"import": "./dist/esm/Breadcrumb.js",
|
|
49
|
+
"require": "./dist/cjs/Breadcrumb.js",
|
|
50
|
+
"types": "./dist/types/components/Breadcrumb/Breadcrumb.d.ts"
|
|
51
|
+
},
|
|
52
|
+
"./Pagination": {
|
|
53
|
+
"import": "./dist/esm/Pagination.js",
|
|
54
|
+
"require": "./dist/cjs/Pagination.js",
|
|
55
|
+
"types": "./dist/types/components/Pagination/Pagination.d.ts"
|
|
56
|
+
},
|
|
57
|
+
"./Accordion": {
|
|
58
|
+
"import": "./dist/esm/Accordion.js",
|
|
59
|
+
"require": "./dist/cjs/Accordion.js",
|
|
60
|
+
"types": "./dist/types/components/Accordion/Accordion.d.ts"
|
|
61
|
+
},
|
|
62
|
+
"./Divider": {
|
|
63
|
+
"import": "./dist/esm/Divider.js",
|
|
64
|
+
"require": "./dist/cjs/Divider.js",
|
|
65
|
+
"types": "./dist/types/components/Divider/Divider.d.ts"
|
|
66
|
+
},
|
|
67
|
+
"./RadioGroup": {
|
|
68
|
+
"import": "./dist/esm/RadioGroup.js",
|
|
69
|
+
"require": "./dist/cjs/RadioGroup.js",
|
|
70
|
+
"types": "./dist/types/components/RadioGroup/RadioGroup.d.ts"
|
|
71
|
+
},
|
|
72
|
+
"./Chips": {
|
|
73
|
+
"import": "./dist/esm/Chips.js",
|
|
74
|
+
"require": "./dist/cjs/Chips.js",
|
|
75
|
+
"types": "./dist/types/components/Chips/Chips.d.ts"
|
|
76
|
+
},
|
|
77
|
+
"./Menu": {
|
|
78
|
+
"import": "./dist/esm/Menu.js",
|
|
79
|
+
"require": "./dist/cjs/Menu.js",
|
|
80
|
+
"types": "./dist/types/components/Menu/Menu.d.ts"
|
|
81
|
+
},
|
|
82
|
+
"./contexts": {
|
|
83
|
+
"import": "./dist/esm/contexts.js",
|
|
84
|
+
"require": "./dist/cjs/contexts.js",
|
|
85
|
+
"types": "./dist/types/contexts/index.d.ts"
|
|
86
|
+
},
|
|
87
|
+
"./utils": {
|
|
88
|
+
"import": "./dist/esm/utils.js",
|
|
89
|
+
"require": "./dist/cjs/utils.js",
|
|
90
|
+
"types": "./dist/types/utils/cn.d.ts"
|
|
91
|
+
}
|
|
92
|
+
},
|
|
93
|
+
"keywords": [
|
|
94
|
+
"react",
|
|
95
|
+
"ui",
|
|
96
|
+
"components",
|
|
97
|
+
"typescript",
|
|
98
|
+
"tailwind",
|
|
99
|
+
"kit"
|
|
100
|
+
],
|
|
101
|
+
"scripts": {
|
|
102
|
+
"test": "echo \"Error: no test specified\" && exit 1",
|
|
103
|
+
"lint": "eslint \"src/**/*.{js,ts,jsx,tsx}\" --fix",
|
|
104
|
+
"format": "prettier --write \"src/**/*.{js,jsx,ts,tsx,json,css,md}\"",
|
|
105
|
+
"check-format": "prettier --check \"src/**/*.{js,jsx,ts,tsx,json,css,md}\"",
|
|
106
|
+
"check-lint": "eslint \"src/**/*.{js,ts,jsx,tsx}\"",
|
|
107
|
+
"check-types": "tsc --noEmit",
|
|
108
|
+
"prepare": "husky",
|
|
109
|
+
"prepublishOnly": "npm run build",
|
|
110
|
+
"storybook": "storybook dev -p 6006",
|
|
111
|
+
"storybook:dev": "concurrently \"npm:build:storybook:css:watch\" \"cross-env STORYBOOK_FORCE_MOBILE=true storybook dev -p 6006 \"",
|
|
112
|
+
"storybook:dev:mobile": "concurrently \"npm:build:storybook:css:watch\" \"cross-env STORYBOOK_FORCE_MOBILE=true storybook dev -p 6006 \"",
|
|
113
|
+
"storybook:dev:desktop": "concurrently \"npm:build:storybook:css:watch\" \"cross-env STORYBOOK_FORCE_MOBILE=false storybook dev -p 6006 \"",
|
|
114
|
+
"build-storybook": "storybook build",
|
|
115
|
+
"build:storybook:css:watch": "npx @tailwindcss/cli -i ./.storybook/tailwind.css -o ./tailwind-build/tailwind.build.css --watch",
|
|
116
|
+
"build:storybook:css": "npx @tailwindcss/cli -i ./.storybook/tailwind.css -o ./tailwind-build/tailwind.build.css",
|
|
117
|
+
"clean": "rimraf dist",
|
|
118
|
+
"build": "npm run clean && rollup -c"
|
|
119
|
+
},
|
|
120
|
+
"author": "Ghazal_kordi Alireza_mirzaee",
|
|
121
|
+
"license": "ISC",
|
|
122
|
+
"peerDependencies": {
|
|
123
|
+
"clsx": "^2.1.1",
|
|
124
|
+
"lucide-react": "^0.522.0",
|
|
125
|
+
"react": "^19.1.0",
|
|
126
|
+
"react-dom": "^19.1.0",
|
|
127
|
+
"tailwindcss": "^4.1.10",
|
|
128
|
+
"typescript": "^5.8.3",
|
|
129
|
+
"ua-parser-js": "^2.0.4"
|
|
130
|
+
},
|
|
131
|
+
"devDependencies": {
|
|
132
|
+
"@rollup/plugin-alias": "^5.1.1",
|
|
133
|
+
"@rollup/plugin-commonjs": "^28.0.6",
|
|
134
|
+
"@rollup/plugin-node-resolve": "^16.0.1",
|
|
135
|
+
"@rollup/plugin-terser": "^0.4.4",
|
|
136
|
+
"@rollup/plugin-typescript": "^12.1.3",
|
|
137
|
+
"@storybook/addon-docs": "^9.0.6",
|
|
138
|
+
"@storybook/addon-onboarding": "^9.0.6",
|
|
139
|
+
"@storybook/react-vite": "^9.0.6",
|
|
140
|
+
"@tailwindcss/cli": "^4.1.10",
|
|
141
|
+
"@tailwindcss/postcss": "^4.1.10",
|
|
142
|
+
"@types/node": "^24.0.3",
|
|
143
|
+
"@types/react": "^19.1.4",
|
|
144
|
+
"@types/react-dom": "^19.1.5",
|
|
145
|
+
"@types/ua-parser-js": "^0.7.39",
|
|
146
|
+
"@typescript-eslint/eslint-plugin": "^7.18.0",
|
|
147
|
+
"@typescript-eslint/parser": "^7.18.0",
|
|
148
|
+
"autoprefixer": "^10.4.21",
|
|
149
|
+
"clsx": "^2.1.1",
|
|
150
|
+
"concurrently": "^9.2.0",
|
|
151
|
+
"cross-env": "^7.0.3",
|
|
152
|
+
"eslint": "^8.57.0",
|
|
153
|
+
"eslint-config-airbnb": "^19.0.4",
|
|
154
|
+
"eslint-config-airbnb-typescript": "^18.0.0",
|
|
155
|
+
"eslint-config-prettier": "^10.1.5",
|
|
156
|
+
"eslint-import-resolver-typescript": "^4.4.3",
|
|
157
|
+
"eslint-plugin-import": "^2.32.0",
|
|
158
|
+
"eslint-plugin-jsx-a11y": "^6.10.2",
|
|
159
|
+
"eslint-plugin-prettier": "^5.5.0",
|
|
160
|
+
"eslint-plugin-react": "^7.37.5",
|
|
161
|
+
"eslint-plugin-storybook": "^9.0.6",
|
|
162
|
+
"husky": "^9.1.7",
|
|
163
|
+
"lucide-react": "^0.522.0",
|
|
164
|
+
"prettier": "^3.5.3",
|
|
165
|
+
"react": "^19.1.0",
|
|
166
|
+
"react-dom": "^19.1.0",
|
|
167
|
+
"rimraf": "^6.0.1",
|
|
168
|
+
"rollup": "^4.44.0",
|
|
169
|
+
"serve": "^14.2.4",
|
|
170
|
+
"storybook": "^9.0.6",
|
|
171
|
+
"tailwind-merge": "^3.3.1",
|
|
172
|
+
"tailwindcss": "^4.1.10",
|
|
173
|
+
"typescript": "^5.8.3",
|
|
174
|
+
"ua-parser-js": "^2.0.4"
|
|
175
|
+
}
|
|
176
|
+
}
|