@mdigital_ui/ui 0.1.0 → 0.1.1

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.
Files changed (3) hide show
  1. package/README.md +50 -6
  2. package/dist/index.js +9 -9
  3. package/package.json +81 -4
package/README.md CHANGED
@@ -21,12 +21,42 @@ npm install @mdigital/ui
21
21
 
22
22
  ### Peer Dependencies
23
23
 
24
- Make sure you have these installed:
24
+ Required dependencies:
25
25
 
26
26
  ```bash
27
27
  npm install react react-dom tailwindcss
28
28
  ```
29
29
 
30
+ Optional dependencies (install only what you need based on components you use):
31
+
32
+ ```bash
33
+ # For advanced components (Modal, Tooltip, Dropdown, Popover)
34
+ npm install @radix-ui/react-dialog @radix-ui/react-popover @radix-ui/react-tooltip
35
+
36
+ # For icons
37
+ npm install lucide-react
38
+
39
+ # For DatePicker
40
+ npm install react-datepicker dayjs
41
+
42
+ # For Table
43
+ npm install @tanstack/react-table @tanstack/react-virtual
44
+
45
+ # For Carousel
46
+ npm install swiper
47
+
48
+ # For Command
49
+ npm install cmdk
50
+
51
+ # For Charts
52
+ npm install recharts
53
+
54
+ # For Drawer
55
+ npm install vaul
56
+ ```
57
+
58
+ See [TREE_SHAKING_GUIDE.md](./TREE_SHAKING_GUIDE.md) for detailed information on optimizing your bundle.
59
+
30
60
  ## Quick Start
31
61
 
32
62
  ### 1. Configure Tailwind
@@ -74,25 +104,39 @@ function App() {
74
104
 
75
105
  ## Import Patterns
76
106
 
77
- ### Named Imports (Recommended)
107
+ ### Subpath Imports (Recommended for Tree-Shaking)
108
+
109
+ For optimal bundle size and to avoid installing unnecessary dependencies:
78
110
 
79
111
  ```tsx
80
- import { Button, Input, Select } from '@mdigital/ui'
112
+ import Button from '@mdigital/ui/button'
113
+ import Input from '@mdigital/ui/input'
114
+ import Select from '@mdigital/ui/select'
81
115
  ```
82
116
 
83
- ### Direct Imports (Better Tree-Shaking)
117
+ **Benefits:**
118
+ - Only bundles the components you use
119
+ - Avoids peer dependency warnings for unused components
120
+ - Fastest build times
121
+
122
+ ### Named Imports (Requires All Peer Dependencies)
123
+
124
+ If you've installed all optional peer dependencies, you can use named imports:
84
125
 
85
126
  ```tsx
86
- import Button from '@mdigital/ui/button'
87
- import Input from '@mdigital/ui/input'
127
+ import { Button, Input, Select, Table, DatePicker } from '@mdigital/ui'
88
128
  ```
89
129
 
130
+ **Note:** This requires installing all optional peer dependencies, even for components you don't use. Your bundler may fail if dependencies for unused components aren't installed.
131
+
90
132
  ### Type Imports
91
133
 
92
134
  ```tsx
93
135
  import type { ButtonProps, InputProps } from '@mdigital/ui'
94
136
  ```
95
137
 
138
+ **See [TREE_SHAKING_GUIDE.md](./TREE_SHAKING_GUIDE.md) for detailed import strategies.**
139
+
96
140
  ## Theming
97
141
 
98
142
  ### CSS Variable Overrides
package/dist/index.js CHANGED
@@ -1,30 +1,30 @@
1
- export { Transfer } from './chunk-EYTOKUBM.js';
2
- export { tabs_default as Tabs } from './chunk-OW5A5IIF.js';
1
+ export { tree_select_default as TreeSelect } from './chunk-JZCHZ4B3.js';
3
2
  export { table_default as Table } from './chunk-L3SP7GHC.js';
4
- export { textarea_default as Textarea } from './chunk-FPOXTCYV.js';
5
3
  export { toggle_default as Toggle } from './chunk-DPOSWW22.js';
4
+ export { textarea_default as Textarea } from './chunk-FPOXTCYV.js';
5
+ export { tabs_default as Tabs } from './chunk-OW5A5IIF.js';
6
6
  export { tooltip_default as Tooltip } from './chunk-D3JWPGCA.js';
7
7
  export { toggle_group_default as ToggleGroup } from './chunk-SK5ECBBK.js';
8
- export { tree_select_default as TreeSelect } from './chunk-JZCHZ4B3.js';
8
+ export { Transfer } from './chunk-EYTOKUBM.js';
9
9
  export { tree_default as Tree } from './chunk-SAVE5ACL.js';
10
- export { radio_default as Radio } from './chunk-KTBPIEP2.js';
10
+ export { rating_default as Rating } from './chunk-FYHQDFKE.js';
11
11
  export { ribbon_default as Ribbon } from './chunk-C7SXY3ZV.js';
12
12
  export { select_default as Select } from './chunk-CLLQDCDR.js';
13
+ export { skeleton_default as Skeleton } from './chunk-75XESYGN.js';
13
14
  export { slider_default as Slider } from './chunk-NNSS366W.js';
14
15
  export { stepper_default as Stepper } from './chunk-MLDX3Z67.js';
15
16
  export { switch_default as Switch } from './chunk-AOITJRSV.js';
16
- export { skeleton_default as Skeleton } from './chunk-75XESYGN.js';
17
17
  export { multi_select_default as MultiSelect } from './chunk-W7BQYIXF.js';
18
18
  export { notification_default as Notification } from './chunk-YZVSDRJD.js';
19
19
  export { pagination_default as Pagination } from './chunk-FGWSUPVW.js';
20
20
  export { progress_default as Progress } from './chunk-RQBXZKTH.js';
21
- export { rating_default as Rating } from './chunk-FYHQDFKE.js';
21
+ export { radio_default as Radio } from './chunk-KTBPIEP2.js';
22
22
  export { radio_group_default as RadioGroup } from './chunk-DOKTHDG3.js';
23
23
  export { empty_default as Empty } from './chunk-ROR4E6IE.js';
24
24
  export { fetching_overlay_default as FetchingOverlay } from './chunk-BNILRB4T.js';
25
25
  export { image_default as Image } from './chunk-XMAH5PDW.js';
26
- export { input_otp_default as InputOTP } from './chunk-R225A5II.js';
27
26
  export { input_group_default as InputGroup } from './chunk-KBCBVH7B.js';
27
+ export { input_otp_default as InputOTP } from './chunk-R225A5II.js';
28
28
  export { input_password_default as InputPassword } from './chunk-E2CYDDYC.js';
29
29
  export { input_default as Input } from './chunk-2JGAYDZR.js';
30
30
  export { kbd_default as Kbd } from './chunk-OQANRZPV.js';
@@ -39,8 +39,8 @@ export { Drawer, DrawerClose, DrawerContent, DrawerDescription, DrawerFooter, Dr
39
39
  import { dropdown_default } from './chunk-KNQ7UQ2W.js';
40
40
  export { dropdown_default as Dropdown } from './chunk-KNQ7UQ2W.js';
41
41
  export { Popover, PopoverAnchor, PopoverContent, PopoverTrigger } from './chunk-3PFA3YG6.js';
42
- export { badge_default as Badge } from './chunk-FTJOSVTY.js';
43
42
  export { accordion_default as Accordion } from './chunk-CWHFK7ZC.js';
43
+ export { badge_default as Badge } from './chunk-FTJOSVTY.js';
44
44
  export { button_default as Button } from './chunk-LBJG2UWT.js';
45
45
  export { spinner_default as Spinner } from './chunk-J3G5WWGR.js';
46
46
  import { textColorVariants } from './chunk-5UEWVFF6.js';
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mdigital_ui/ui",
3
- "version": "0.1.0",
3
+ "version": "0.1.1",
4
4
  "description": "Modern React component library built with Tailwind CSS v4",
5
5
  "type": "module",
6
6
  "main": "./dist/index.js",
@@ -16,10 +16,54 @@
16
16
  ],
17
17
  "exports": {
18
18
  ".": "./dist/index.js",
19
+ "./accordion": "./dist/accordion/index.js",
20
+ "./badge": "./dist/badge/index.js",
19
21
  "./button": "./dist/button/index.js",
22
+ "./card": "./dist/card/index.js",
23
+ "./carousel": "./dist/carousel/index.js",
24
+ "./cascader": "./dist/cascader/index.js",
25
+ "./chart": "./dist/chart/index.js",
26
+ "./checkbox": "./dist/checkbox/index.js",
27
+ "./checkbox-group": "./dist/checkbox-group/index.js",
28
+ "./collapse": "./dist/collapse/index.js",
29
+ "./command": "./dist/command/index.js",
30
+ "./date-picker": "./dist/date-picker/index.js",
31
+ "./descriptions": "./dist/descriptions/index.js",
32
+ "./drawer": "./dist/drawer/index.js",
33
+ "./dropdown": "./dist/dropdown/index.js",
34
+ "./empty": "./dist/empty/index.js",
35
+ "./fetching-overlay": "./dist/fetching-overlay/index.js",
36
+ "./image": "./dist/image/index.js",
20
37
  "./input": "./dist/input/index.js",
38
+ "./input-group": "./dist/input-group/index.js",
39
+ "./input-otp": "./dist/input-otp/index.js",
40
+ "./input-password": "./dist/input-password/index.js",
41
+ "./kbd": "./dist/kbd/index.js",
42
+ "./modal": "./dist/modal/index.js",
43
+ "./multi-select": "./dist/multi-select/index.js",
44
+ "./notification": "./dist/notification/index.js",
45
+ "./pagination": "./dist/pagination/index.js",
46
+ "./popover": "./dist/popover/index.js",
47
+ "./progress": "./dist/progress/index.js",
48
+ "./radio": "./dist/radio/index.js",
49
+ "./radio-group": "./dist/radio-group/index.js",
50
+ "./rating": "./dist/rating/index.js",
51
+ "./ribbon": "./dist/ribbon/index.js",
21
52
  "./select": "./dist/select/index.js",
22
- "./checkbox": "./dist/checkbox/index.js",
53
+ "./skeleton": "./dist/skeleton/index.js",
54
+ "./slider": "./dist/slider/index.js",
55
+ "./spinner": "./dist/spinner/index.js",
56
+ "./stepper": "./dist/stepper/index.js",
57
+ "./switch": "./dist/switch/index.js",
58
+ "./table": "./dist/table/index.js",
59
+ "./tabs": "./dist/tabs/index.js",
60
+ "./textarea": "./dist/textarea/index.js",
61
+ "./toggle": "./dist/toggle/index.js",
62
+ "./toggle-group": "./dist/toggle-group/index.js",
63
+ "./tooltip": "./dist/tooltip/index.js",
64
+ "./transfer": "./dist/transfer/index.js",
65
+ "./tree": "./dist/tree/index.js",
66
+ "./tree-select": "./dist/tree-select/index.js",
23
67
  "./styles/global.css": "./dist/styles/global.css",
24
68
  "./styles/base.css": "./dist/styles/base.css",
25
69
  "./styles/themes/light.css": "./dist/styles/themes/light.css",
@@ -42,7 +86,19 @@
42
86
  "peerDependencies": {
43
87
  "react": "^18.0.0 || ^19.0.0",
44
88
  "react-dom": "^18.0.0 || ^19.0.0",
45
- "tailwindcss": "^4.0.0"
89
+ "tailwindcss": "^4.0.0",
90
+ "@radix-ui/react-dialog": "^1.0.0",
91
+ "@radix-ui/react-popover": "^1.0.0",
92
+ "@radix-ui/react-tooltip": "^1.0.0",
93
+ "@tanstack/react-table": "^8.0.0",
94
+ "@tanstack/react-virtual": "^3.0.0",
95
+ "cmdk": "^1.0.0",
96
+ "dayjs": "^1.11.0",
97
+ "lucide-react": "^0.400.0",
98
+ "react-datepicker": "^6.0.0 || ^7.0.0 || ^8.0.0",
99
+ "recharts": "^2.0.0 || ^3.0.0",
100
+ "swiper": "^11.0.0 || ^12.0.0",
101
+ "vaul": "^0.9.0 || ^1.0.0"
46
102
  },
47
103
  "peerDependenciesMeta": {
48
104
  "@radix-ui/react-dialog": {
@@ -54,11 +110,32 @@
54
110
  "@radix-ui/react-tooltip": {
55
111
  "optional": true
56
112
  },
57
- "lucide-react": {
113
+ "@tanstack/react-table": {
114
+ "optional": true
115
+ },
116
+ "@tanstack/react-virtual": {
117
+ "optional": true
118
+ },
119
+ "cmdk": {
58
120
  "optional": true
59
121
  },
60
122
  "dayjs": {
61
123
  "optional": true
124
+ },
125
+ "lucide-react": {
126
+ "optional": true
127
+ },
128
+ "react-datepicker": {
129
+ "optional": true
130
+ },
131
+ "recharts": {
132
+ "optional": true
133
+ },
134
+ "swiper": {
135
+ "optional": true
136
+ },
137
+ "vaul": {
138
+ "optional": true
62
139
  }
63
140
  },
64
141
  "devDependencies": {