@yamada-ui/react 0.9.9 → 1.0.0
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 +53 -12
- package/package.json +89 -88
package/README.md
CHANGED
|
@@ -1,12 +1,20 @@
|
|
|
1
1
|
<p align="center">
|
|
2
|
-
<img src="https://raw.githubusercontent.com/hirotomoyamada/yamada-ui/main/logo/logo-colored@2x.png" alt="Yamada UI" width="480"
|
|
2
|
+
<img src="https://raw.githubusercontent.com/hirotomoyamada/yamada-ui/main/logo/logo-colored@2x.png" alt="Yamada UI" width="480"/>
|
|
3
3
|
</p>
|
|
4
4
|
|
|
5
5
|
<p align="center">
|
|
6
|
+
<img alt="NPM Minzip" src="https://img.shields.io/bundlephobia/minzip/@yamada-ui/react"/>
|
|
7
|
+
<a href="https://www.npmjs.com/package/@yamada-ui/react">
|
|
8
|
+
<img alt="MIT License" src="https://img.shields.io/npm/v/@yamada-ui/react"/>
|
|
9
|
+
</a>
|
|
10
|
+
<img alt="NPM Downloads" src="https://img.shields.io/npm/dm/@yamada-ui/react.svg?style=flat"/>
|
|
6
11
|
<a href="https://github.com/hirotomoyamada/yamada-ui/blob/main/LICENSE">
|
|
7
12
|
<img alt="MIT License" src="https://img.shields.io/github/license/hirotomoyamada/yamada-ui"/>
|
|
8
13
|
</a>
|
|
9
|
-
<img alt="Github Stars" src="https://
|
|
14
|
+
<img alt="Github Stars" src="https://img.shields.io/github/stars/hirotomoyamada/yamada-ui" />
|
|
15
|
+
<a href="https://discord.gg/ubYvRAxFEB">
|
|
16
|
+
<img alt="MIT License" src="https://img.shields.io/badge/Chat%20on-Discord-%235865f2"/>
|
|
17
|
+
</a>
|
|
10
18
|
</p>
|
|
11
19
|
|
|
12
20
|
Yamada UI is a React UI component library that streamlines the development of cutting-edge web applications and websites. This library offers a diverse range of components that can be easily combined to construct complex user interfaces, incorporating various features such as color modes and animations, which are not typically supported by other React UI component libraries.
|
|
@@ -14,10 +22,12 @@ Yamada UI is a React UI component library that streamlines the development of cu
|
|
|
14
22
|
## Contents
|
|
15
23
|
|
|
16
24
|
- [Respect](#respect)
|
|
17
|
-
- [Documentation](
|
|
25
|
+
- [Documentation](https://yamada-ui.com)
|
|
18
26
|
- [Features](#features)
|
|
19
27
|
- [Installation](#installation)
|
|
20
28
|
- [Usage](#usage)
|
|
29
|
+
- [CodeSandbox](#codesandbox)
|
|
30
|
+
- [Storybook](https://hirotomoyamada.github.io/yamada-ui/)
|
|
21
31
|
- [Contributing](#contributing)
|
|
22
32
|
- [License](#license)
|
|
23
33
|
|
|
@@ -27,7 +37,7 @@ Yamada UI has drawn a lot of inspiration from [Chakra UI](https://github.com/cha
|
|
|
27
37
|
|
|
28
38
|
## Documentation
|
|
29
39
|
|
|
30
|
-
|
|
40
|
+
It's the https://yamada-ui.com website for the latest version of Yamada UI.
|
|
31
41
|
|
|
32
42
|
## Features
|
|
33
43
|
|
|
@@ -48,20 +58,43 @@ Currently, the documentation is only available in [Storybook](https://hirotomoya
|
|
|
48
58
|
|
|
49
59
|
## Installation
|
|
50
60
|
|
|
61
|
+
To use Yamada UI components, all you need to install the
|
|
62
|
+
`@yamada-ui/react` package.
|
|
63
|
+
|
|
51
64
|
```sh
|
|
52
65
|
$ pnpm add @yamada-ui/react
|
|
53
|
-
```
|
|
54
66
|
|
|
55
|
-
or
|
|
67
|
+
# or
|
|
56
68
|
|
|
57
|
-
```sh
|
|
58
69
|
$ yarn add @yamada-ui/react
|
|
70
|
+
|
|
71
|
+
# or
|
|
72
|
+
|
|
73
|
+
$ npm install @yamada-ui/react
|
|
59
74
|
```
|
|
60
75
|
|
|
61
|
-
|
|
76
|
+
`@yamada-ui/table` and `@yamada-ui/calendar`, among others,
|
|
77
|
+
are not included with `@yamada-ui/react`.
|
|
78
|
+
You will need to install them separately.
|
|
62
79
|
|
|
63
80
|
```sh
|
|
64
|
-
|
|
81
|
+
# Provide a convenient Table component using `@tanstack/react-table`.
|
|
82
|
+
$ pnpm add @yamada-ui/table
|
|
83
|
+
|
|
84
|
+
# Provide a convenient Calendar and datePicker, MonthPicker component
|
|
85
|
+
$ pnpm add @yamada-ui/calendar
|
|
86
|
+
|
|
87
|
+
# Provide a convenient Carousel component using `embla-carousel-react`.
|
|
88
|
+
$ pnpm add @yamada-ui/carousel
|
|
89
|
+
|
|
90
|
+
# Provide a convenient Dropzone component using `react-dropzone`.
|
|
91
|
+
$ pnpm add @yamada-ui/dropzone
|
|
92
|
+
|
|
93
|
+
# Provide a convenient Markdown component using `react-markdown` and `react-syntax-highlighter`.
|
|
94
|
+
$ pnpm add @yamada-ui/markdown
|
|
95
|
+
|
|
96
|
+
# a package for conveniently using `Font Awesome`.
|
|
97
|
+
$ pnpm add @yamada-ui/fontawesome
|
|
65
98
|
```
|
|
66
99
|
|
|
67
100
|
## Usage
|
|
@@ -96,11 +129,19 @@ const Example = () => {
|
|
|
96
129
|
}
|
|
97
130
|
```
|
|
98
131
|
|
|
99
|
-
##
|
|
132
|
+
## CodeSandbox
|
|
133
|
+
|
|
134
|
+
- [JavaScript](https://codesandbox.io/s/yamada-ui-javascript-1m1on8)
|
|
135
|
+
- [TypeScript](https://codesandbox.io/s/yamada-ui-typescript-7xqli9)
|
|
136
|
+
- [Next.js - Pages](https://codesandbox.io/p/sandbox/yamada-ui-next-js-pages-6d13de)
|
|
137
|
+
- [Next.js - App](https://codesandbox.io/p/sandbox/yamada-ui-next-js-app-3911zu)
|
|
138
|
+
|
|
139
|
+
## Contributing
|
|
100
140
|
|
|
101
141
|
Wouldn't you like to contribute? That's amazing! We have prepared a [contribution guide](https://github.com/hirotomoyamada/yamada-ui/blob/main/CONTRIBUTING.md) to assist you.
|
|
102
142
|
|
|
143
|
+
The documentation site for Yamada UI is located in a separate [repository](https://github.com/hirotomoyamada/yamada-docs). If you're interested in contributing to the documentation, please refer to this [contribution guide](https://github.com/hirotomoyamada/yamada-docs/blob/main/CONTRIBUTING.md).
|
|
144
|
+
|
|
103
145
|
## License
|
|
104
146
|
|
|
105
|
-
|
|
106
|
-
[MIT license](https://github.com/hirotomoyamada/yamada-ui/blob/main/LICENSE).
|
|
147
|
+
MIT © [Hirotomo Yamada](https://github.com/hirotomoyamada)
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@yamada-ui/react",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.0",
|
|
4
4
|
"description": "React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"yamada",
|
|
@@ -26,6 +26,7 @@
|
|
|
26
26
|
"publishConfig": {
|
|
27
27
|
"access": "public"
|
|
28
28
|
},
|
|
29
|
+
"homepage": "https://yamada-ui.com",
|
|
29
30
|
"repository": {
|
|
30
31
|
"type": "git",
|
|
31
32
|
"url": "git+https://github.com/hirotomoyamada/yamada-ui",
|
|
@@ -35,93 +36,93 @@
|
|
|
35
36
|
"url": "https://github.com/hirotomoyamada/yamada-ui/issues"
|
|
36
37
|
},
|
|
37
38
|
"dependencies": {
|
|
38
|
-
"@yamada-ui/accordion": "0.
|
|
39
|
-
"@yamada-ui/alert": "0.
|
|
40
|
-
"@yamada-ui/autocomplete": "0.
|
|
41
|
-
"@yamada-ui/avatar": "0.
|
|
42
|
-
"@yamada-ui/badge": "0.
|
|
43
|
-
"@yamada-ui/breadcrumb": "0.
|
|
44
|
-
"@yamada-ui/button": "0.
|
|
45
|
-
"@yamada-ui/card": "0.
|
|
46
|
-
"@yamada-ui/checkbox": "0.
|
|
47
|
-
"@yamada-ui/close-button": "0.
|
|
48
|
-
"@yamada-ui/core": "0.
|
|
49
|
-
"@yamada-ui/editable": "0.
|
|
50
|
-
"@yamada-ui/file-button": "0.
|
|
51
|
-
"@yamada-ui/file-input": "0.
|
|
52
|
-
"@yamada-ui/focus-lock": "0.
|
|
53
|
-
"@yamada-ui/form-control": "0.
|
|
54
|
-
"@yamada-ui/highlight": "0.
|
|
55
|
-
"@yamada-ui/icon": "0.
|
|
56
|
-
"@yamada-ui/image": "0.
|
|
57
|
-
"@yamada-ui/indicator": "0.
|
|
58
|
-
"@yamada-ui/input": "0.
|
|
59
|
-
"@yamada-ui/kbd": "0.
|
|
60
|
-
"@yamada-ui/layouts": "0.
|
|
61
|
-
"@yamada-ui/link": "0.
|
|
62
|
-
"@yamada-ui/list": "0.
|
|
63
|
-
"@yamada-ui/loading": "0.
|
|
64
|
-
"@yamada-ui/menu": "0.
|
|
65
|
-
"@yamada-ui/modal": "0.
|
|
66
|
-
"@yamada-ui/motion": "0.
|
|
67
|
-
"@yamada-ui/native-select": "0.
|
|
68
|
-
"@yamada-ui/native-table": "0.
|
|
69
|
-
"@yamada-ui/notice": "0.
|
|
70
|
-
"@yamada-ui/number-input": "0.
|
|
71
|
-
"@yamada-ui/pagination": "0.
|
|
72
|
-
"@yamada-ui/pin-input": "0.
|
|
73
|
-
"@yamada-ui/popover": "0.
|
|
74
|
-
"@yamada-ui/portal": "0.
|
|
75
|
-
"@yamada-ui/progress": "0.
|
|
76
|
-
"@yamada-ui/providers": "0.
|
|
77
|
-
"@yamada-ui/radio": "0.
|
|
78
|
-
"@yamada-ui/reorder": "0.
|
|
79
|
-
"@yamada-ui/ripple": "0.
|
|
80
|
-
"@yamada-ui/scroll-area": "0.
|
|
81
|
-
"@yamada-ui/segmented-control": "0.
|
|
82
|
-
"@yamada-ui/select": "0.
|
|
83
|
-
"@yamada-ui/skeleton": "0.
|
|
84
|
-
"@yamada-ui/slider": "0.
|
|
85
|
-
"@yamada-ui/stepper": "0.
|
|
86
|
-
"@yamada-ui/switch": "0.
|
|
87
|
-
"@yamada-ui/tabs": "0.
|
|
88
|
-
"@yamada-ui/tag": "0.
|
|
89
|
-
"@yamada-ui/textarea": "0.
|
|
90
|
-
"@yamada-ui/theme": "0.
|
|
91
|
-
"@yamada-ui/theme-tools": "0.
|
|
92
|
-
"@yamada-ui/tooltip": "0.
|
|
93
|
-
"@yamada-ui/transitions": "0.
|
|
94
|
-
"@yamada-ui/typography": "0.
|
|
95
|
-
"@yamada-ui/use-animation": "0.
|
|
96
|
-
"@yamada-ui/use-boolean": "0.
|
|
97
|
-
"@yamada-ui/use-breakpoint": "0.
|
|
98
|
-
"@yamada-ui/use-clickable": "0.
|
|
99
|
-
"@yamada-ui/use-clipboard": "0.
|
|
100
|
-
"@yamada-ui/use-controllable-state": "0.
|
|
101
|
-
"@yamada-ui/use-counter": "0.
|
|
102
|
-
"@yamada-ui/use-descendant": "0.
|
|
103
|
-
"@yamada-ui/use-disclosure": "0.
|
|
104
|
-
"@yamada-ui/use-event-listener": "0.
|
|
105
|
-
"@yamada-ui/use-focus": "0.
|
|
106
|
-
"@yamada-ui/use-focus-visible": "0.
|
|
107
|
-
"@yamada-ui/use-hover": "0.
|
|
108
|
-
"@yamada-ui/use-idle": "0.
|
|
109
|
-
"@yamada-ui/use-interval": "0.
|
|
110
|
-
"@yamada-ui/use-latest-ref": "0.
|
|
111
|
-
"@yamada-ui/use-local-storage": "0.
|
|
112
|
-
"@yamada-ui/use-media-query": "0.
|
|
113
|
-
"@yamada-ui/use-os": "0.
|
|
114
|
-
"@yamada-ui/use-outside-click": "0.
|
|
115
|
-
"@yamada-ui/use-pan-event": "0.
|
|
116
|
-
"@yamada-ui/use-popper": "0.
|
|
117
|
-
"@yamada-ui/use-previous": "0.
|
|
118
|
-
"@yamada-ui/use-resize-observer": "0.
|
|
119
|
-
"@yamada-ui/use-size": "0.
|
|
120
|
-
"@yamada-ui/use-timeout": "0.
|
|
121
|
-
"@yamada-ui/use-token": "0.
|
|
122
|
-
"@yamada-ui/use-value": "0.
|
|
123
|
-
"@yamada-ui/use-window-event": "0.
|
|
124
|
-
"@yamada-ui/utils": "0.
|
|
39
|
+
"@yamada-ui/accordion": "1.0.0",
|
|
40
|
+
"@yamada-ui/alert": "1.0.0",
|
|
41
|
+
"@yamada-ui/autocomplete": "1.0.0",
|
|
42
|
+
"@yamada-ui/avatar": "1.0.0",
|
|
43
|
+
"@yamada-ui/badge": "1.0.0",
|
|
44
|
+
"@yamada-ui/breadcrumb": "1.0.0",
|
|
45
|
+
"@yamada-ui/button": "1.0.0",
|
|
46
|
+
"@yamada-ui/card": "1.0.0",
|
|
47
|
+
"@yamada-ui/checkbox": "1.0.0",
|
|
48
|
+
"@yamada-ui/close-button": "1.0.0",
|
|
49
|
+
"@yamada-ui/core": "1.0.0",
|
|
50
|
+
"@yamada-ui/editable": "1.0.0",
|
|
51
|
+
"@yamada-ui/file-button": "1.0.0",
|
|
52
|
+
"@yamada-ui/file-input": "1.0.0",
|
|
53
|
+
"@yamada-ui/focus-lock": "1.0.0",
|
|
54
|
+
"@yamada-ui/form-control": "1.0.0",
|
|
55
|
+
"@yamada-ui/highlight": "1.0.0",
|
|
56
|
+
"@yamada-ui/icon": "1.0.0",
|
|
57
|
+
"@yamada-ui/image": "1.0.0",
|
|
58
|
+
"@yamada-ui/indicator": "1.0.0",
|
|
59
|
+
"@yamada-ui/input": "1.0.0",
|
|
60
|
+
"@yamada-ui/kbd": "1.0.0",
|
|
61
|
+
"@yamada-ui/layouts": "1.0.0",
|
|
62
|
+
"@yamada-ui/link": "1.0.0",
|
|
63
|
+
"@yamada-ui/list": "1.0.0",
|
|
64
|
+
"@yamada-ui/loading": "1.0.0",
|
|
65
|
+
"@yamada-ui/menu": "1.0.0",
|
|
66
|
+
"@yamada-ui/modal": "1.0.0",
|
|
67
|
+
"@yamada-ui/motion": "1.0.0",
|
|
68
|
+
"@yamada-ui/native-select": "1.0.0",
|
|
69
|
+
"@yamada-ui/native-table": "1.0.0",
|
|
70
|
+
"@yamada-ui/notice": "1.0.0",
|
|
71
|
+
"@yamada-ui/number-input": "1.0.0",
|
|
72
|
+
"@yamada-ui/pagination": "1.0.0",
|
|
73
|
+
"@yamada-ui/pin-input": "1.0.0",
|
|
74
|
+
"@yamada-ui/popover": "1.0.0",
|
|
75
|
+
"@yamada-ui/portal": "1.0.0",
|
|
76
|
+
"@yamada-ui/progress": "1.0.0",
|
|
77
|
+
"@yamada-ui/providers": "1.0.0",
|
|
78
|
+
"@yamada-ui/radio": "1.0.0",
|
|
79
|
+
"@yamada-ui/reorder": "1.0.0",
|
|
80
|
+
"@yamada-ui/ripple": "1.0.0",
|
|
81
|
+
"@yamada-ui/scroll-area": "1.0.0",
|
|
82
|
+
"@yamada-ui/segmented-control": "1.0.0",
|
|
83
|
+
"@yamada-ui/select": "1.0.0",
|
|
84
|
+
"@yamada-ui/skeleton": "1.0.0",
|
|
85
|
+
"@yamada-ui/slider": "1.0.0",
|
|
86
|
+
"@yamada-ui/stepper": "1.0.0",
|
|
87
|
+
"@yamada-ui/switch": "1.0.0",
|
|
88
|
+
"@yamada-ui/tabs": "1.0.0",
|
|
89
|
+
"@yamada-ui/tag": "1.0.0",
|
|
90
|
+
"@yamada-ui/textarea": "1.0.0",
|
|
91
|
+
"@yamada-ui/theme": "1.0.0",
|
|
92
|
+
"@yamada-ui/theme-tools": "1.0.0",
|
|
93
|
+
"@yamada-ui/tooltip": "1.0.0",
|
|
94
|
+
"@yamada-ui/transitions": "1.0.0",
|
|
95
|
+
"@yamada-ui/typography": "1.0.0",
|
|
96
|
+
"@yamada-ui/use-animation": "1.0.0",
|
|
97
|
+
"@yamada-ui/use-boolean": "1.0.0",
|
|
98
|
+
"@yamada-ui/use-breakpoint": "1.0.0",
|
|
99
|
+
"@yamada-ui/use-clickable": "1.0.0",
|
|
100
|
+
"@yamada-ui/use-clipboard": "1.0.0",
|
|
101
|
+
"@yamada-ui/use-controllable-state": "1.0.0",
|
|
102
|
+
"@yamada-ui/use-counter": "1.0.0",
|
|
103
|
+
"@yamada-ui/use-descendant": "1.0.0",
|
|
104
|
+
"@yamada-ui/use-disclosure": "1.0.0",
|
|
105
|
+
"@yamada-ui/use-event-listener": "1.0.0",
|
|
106
|
+
"@yamada-ui/use-focus": "1.0.0",
|
|
107
|
+
"@yamada-ui/use-focus-visible": "1.0.0",
|
|
108
|
+
"@yamada-ui/use-hover": "1.0.0",
|
|
109
|
+
"@yamada-ui/use-idle": "1.0.0",
|
|
110
|
+
"@yamada-ui/use-interval": "1.0.0",
|
|
111
|
+
"@yamada-ui/use-latest-ref": "1.0.0",
|
|
112
|
+
"@yamada-ui/use-local-storage": "1.0.0",
|
|
113
|
+
"@yamada-ui/use-media-query": "1.0.0",
|
|
114
|
+
"@yamada-ui/use-os": "1.0.0",
|
|
115
|
+
"@yamada-ui/use-outside-click": "1.0.0",
|
|
116
|
+
"@yamada-ui/use-pan-event": "1.0.0",
|
|
117
|
+
"@yamada-ui/use-popper": "1.0.0",
|
|
118
|
+
"@yamada-ui/use-previous": "1.0.0",
|
|
119
|
+
"@yamada-ui/use-resize-observer": "1.0.0",
|
|
120
|
+
"@yamada-ui/use-size": "1.0.0",
|
|
121
|
+
"@yamada-ui/use-timeout": "1.0.0",
|
|
122
|
+
"@yamada-ui/use-token": "1.0.0",
|
|
123
|
+
"@yamada-ui/use-value": "1.0.0",
|
|
124
|
+
"@yamada-ui/use-window-event": "1.0.0",
|
|
125
|
+
"@yamada-ui/utils": "1.0.0"
|
|
125
126
|
},
|
|
126
127
|
"devDependencies": {
|
|
127
128
|
"clean-package": "2.2.0",
|