Skip to content
This repository was archived by the owner on Sep 20, 2024. It is now read-only.

Commit 01547bc

Browse files
codebender828codebender828
authored
Merge pull request #540 from chakra-ui/develop
Release: Bug Fixes and Dependency Updates
2 parents 8f4cc4c + 0800981 commit 01547bc

File tree

7 files changed

+209
-783
lines changed

7 files changed

+209
-783
lines changed

‎.changeset/empty-dryers-rescue.md

+9
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
---
2+
'nuxt-js': minor
3+
'@chakra-ui/vue': minor
4+
'@chakra-ui/nuxt': minor
5+
'@chakra-ui/theme-vue': minor
6+
'chakra-ui-docs': minor
7+
---
8+
9+
fix: Include all position values in CToast, fix: import in custom theme code snippet

‎package.json

+6-4
Original file line numberDiff line numberDiff line change
@@ -100,7 +100,6 @@
100100
"@vue/cli-plugin-eslint": "^3.11.0",
101101
"@vue/cli-plugin-pwa": "^3.11.0",
102102
"@vue/cli-plugin-unit-jest": "^3.11.0",
103-
"@vue/devtools": "^5.3.3",
104103
"@vue/eslint-config-standard": "^4.0.0",
105104
"@vue/test-utils": "1.0.0-beta.29",
106105
"add": "^2.0.6",
@@ -126,7 +125,7 @@
126125
"copy-to-clipboard": "^3.3.1",
127126
"core-js": "^3.15.1",
128127
"cross-env": "^7.0.2",
129-
"defu": "^2.0.4",
128+
"defu": "^6.0.0",
130129
"dotenv-defaults": "^1.1.1",
131130
"eslint": "^7.12.1",
132131
"eslint-config-prettier": "^6.10.0",
@@ -165,7 +164,7 @@
165164
"rollup-plugin-json": "^4.0.0",
166165
"rollup-plugin-jsx": "^1.0.3",
167166
"rollup-plugin-node-resolve": "^5.2.0",
168-
"rollup-plugin-scss": "^2.1.0",
167+
"rollup-plugin-scss": "3",
169168
"rollup-plugin-terser": "^5.1.2",
170169
"rollup-plugin-vue": "^5.1.4",
171170
"sass-loader": "^8.0.2",
@@ -196,5 +195,8 @@
196195
"styled-system",
197196
"kittens ;)"
198197
],
199-
"version": "0.0.0"
198+
"version": "0.0.0",
199+
"devDependencies": {
200+
"sass": "^1.52.3"
201+
}
200202
}

‎packages/chakra-ui-core/src/CToast/CToast.d.ts

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
interface ChakraToastOptions {
2-
position?: 'bottom' | 'top' | 'right' | 'left'
2+
position?: 'bottom' | 'top' | 'right' | 'left' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right'
33
duration?: number
44
render?: (options: { onClose?: VoidFunction, id: any }) => any
55
title?: string

‎packages/chakra-ui-nuxt/lib/module.js

+1-1
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,5 @@
11
const { resolve } = require('path')
2-
const defu = require('defu')
2+
const { defu } = require('defu')
33
const { parsePackIcons, internalIcons, createServerDirective } = require('@chakra-ui/vue')
44
const defaultTheme = require('@chakra-ui/theme-vue')
55
const { ChakraLoaderPlugin } = require('chakra-loader')

‎packages/chakra-ui-nuxt/package.json

+2-1
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,8 @@
2525
"chakra-loader": "latest"
2626
},
2727
"peerDependencies": {
28-
"@nuxtjs/emotion": "^0.1.0"
28+
"@nuxtjs/emotion": "^0.1.0",
29+
"defu": ">=6.0.0"
2930
},
3031
"devDependencies": {
3132
"@babel/core": "^7.9.6",

‎website/pages/circularprogress.mdx

+22-24
Original file line numberDiff line numberDiff line change
@@ -1,21 +1,20 @@
11
import SEO from "../components/SEO";
22

3-
<SEO title="Circular Progress" description="Circular Progress is used to indicates the progress for determinate and indeterminate processes." />
4-
5-
6-
3+
<SEO
4+
title="Circular Progress"
5+
description="Circular Progress is used to indicates the progress for determinate and indeterminate processes."
6+
/>
77

88
# Circular Progress
9+
910
The Circular Progress component is used to indicates the progress for both determinate and indeterminate processes.
1011

1112
- Determinate progress fills the circular track with color, as the indicator
1213
moves from 0 to 360 degrees.
1314
- Indeterminate progress grows and shrinks the indicator while moving along the
1415
circular track.
1516

16-
17-
See `CCircularProgress`'s <a target="_blank" href="https://github.com/chakra-ui/chakra-ui-vue/blob/master/packages/chakra-ui-core/src/CCircularProgress/accesibility.md">accessibility report</a>
18-
17+
See `CCircularProgress`'s <a target="_blank" href="https://github.com/chakra-ui/chakra-ui-vue/blob/master/packages/chakra-ui-core/src/CCircularProgress/accessibility.md">accessibility report</a>
1918

2019
<carbon-ad />
2120

@@ -25,14 +24,12 @@ See `CCircularProgress`'s <a target="_blank" href="https://github.com/chakra-ui/
2524
import { CCircularProgress, CCircularProgressLabel } from "@chakra-ui/vue";
2625
```
2726

28-
2927
## Usage
3028

3129
```vue live=true
3230
<c-circular-progress :value="80" />
3331
```
3432

35-
3633
### Changing the size
3734

3835
You can add `size` prop to the progress bar to add a custom size.
@@ -79,7 +76,7 @@ Setting the progress to indeterminate means you're not able to determine the
7976
`value` upfront, so won't need to pass the `value` prop.
8077

8178
```vue live=true
82-
<c-circular-progress is-indeterminate/>
79+
<c-circular-progress is-indeterminate />
8380
```
8481

8582
### Accessibility
@@ -90,19 +87,20 @@ Setting the progress to indeterminate means you're not able to determine the
9087

9188
## Props
9289

93-
| Name | Type | Default | Description |
94-
| --------------- | ----------------- | ------- | ---------------------------------------------------------------------------------------------------------------- |
95-
| size | `string` | `48px` | The size of the circular progress in CSS units |
96-
| max | `number` | `100` | Maximum value defining 100% progress made (must be higher than 'min') |
97-
| min | `number` | `0` | Minimum value defining 'no progress' (must be lower than 'max') |
98-
| value | `number` | | Current progress (must be between min/max) |
99-
| isIndeterminate | `boolean` | | Puts the component into 'indeterminate' state; Ignores 'value' prop |
100-
| thickness | `number` | `0.2` | The thickness of progress indicator as a ratio of `size`. Must be between `0` and `1` |
101-
| angle | `number` | `0` | Angle to rotate progress indicator by |
102-
| trackColor | `string` | `gray` | The color name of the progress track. Use a color key in the theme object |
103-
| color | `string` | `blue` | The color of the progress indicator. Use a color key in the theme object |
90+
| Name | Type | Default | Description |
91+
| --------------- | --------- | ------- | ------------------------------------------------------------------------------------- |
92+
| size | `string` | `48px` | The size of the circular progress in CSS units |
93+
| max | `number` | `100` | Maximum value defining 100% progress made (must be higher than 'min') |
94+
| min | `number` | `0` | Minimum value defining 'no progress' (must be lower than 'max') |
95+
| value | `number` | | Current progress (must be between min/max) |
96+
| isIndeterminate | `boolean` | | Puts the component into 'indeterminate' state; Ignores 'value' prop |
97+
| thickness | `number` | `0.2` | The thickness of progress indicator as a ratio of `size`. Must be between `0` and `1` |
98+
| angle | `number` | `0` | Angle to rotate progress indicator by |
99+
| trackColor | `string` | `gray` | The color name of the progress track. Use a color key in the theme object |
100+
| color | `string` | `blue` | The color of the progress indicator. Use a color key in the theme object |
104101

105102
## Slots
106-
| Name | Description |
107-
| ---------- | --------------------------------------------------------------------------------- |
108-
| default | Used for the `CCircularProgressLabel` to display the current progress percentage |
103+
104+
| Name | Description |
105+
| ------- | -------------------------------------------------------------------------------- |
106+
| default | Used for the `CCircularProgressLabel` to display the current progress percentage |

0 commit comments

Comments
 (0)