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

Commit 72af228

Browse files
Merge branch 'develop' into patch-1
2 parents 893354a + 4e89e4c commit 72af228

File tree

17 files changed

+146
-24
lines changed

17 files changed

+146
-24
lines changed

.all-contributorsrc

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -155,6 +155,15 @@
155155
"contributions": [
156156
"doc"
157157
]
158+
},
159+
{
160+
"login": "freality",
161+
"name": "Ken Love",
162+
"avatar_url": "https://avatars3.githubusercontent.com/u/15808?v=4",
163+
"profile": "https://github.com/freality",
164+
"contributions": [
165+
"code"
166+
]
158167
}
159168
],
160169
"contributorsPerLine": 7,

.github/semantic.yml

Lines changed: 15 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,15 @@
1+
# Always validate the PR title, and ignore the commits
2+
titleOnly: true
3+
4+
# Require at least one commit to be valid
5+
# this is only relevant when using commitsOnly: true or titleAndCommits: true,
6+
# which validate all commits by default
7+
anyCommit: true
8+
9+
# Allow use of Merge commits (eg on github: "Merge branch 'master' into feature/ride-unicorns")
10+
# this is only relevant when using commitsOnly: true (or titleAndCommits: true)
11+
allowMergeCommits: true
12+
13+
# Allow use of Revert commits (eg on github: "Revert "feat: ride unicorns"")
14+
# this is only relevant when using commitsOnly: true (or titleAndCommits: true)
15+
allowRevertCommits: true

README.md

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -211,6 +211,7 @@ Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/d
211211
<tr>
212212
<td align="center"><a href="https://github.com/Anmol270900"><img src="https://avatars2.githubusercontent.com/u/43845658?v=4" width="50px;" alt=""/><br /><sub><b>Anmol</b></sub></a><br /><a href="https://github.com/chakra-ui/chakra-ui-vue/commits?author=Anmol270900" title="Documentation">📖</a></td>
213213
<td align="center"><a href="https://github.com/vishnumohanrk"><img src="https://avatars3.githubusercontent.com/u/51525368?v=4" width="50px;" alt=""/><br /><sub><b>Vishnumohan R K</b></sub></a><br /><a href="https://github.com/chakra-ui/chakra-ui-vue/commits?author=vishnumohanrk" title="Documentation">📖</a></td>
214+
<td align="center"><a href="https://github.com/freality"><img src="https://avatars3.githubusercontent.com/u/15808?v=4" width="50px;" alt=""/><br /><sub><b>Ken Love</b></sub></a><br /><a href="https://github.com/chakra-ui/chakra-ui-vue/commits?author=freality" title="Code">💻</a></td>
214215
</tr>
215216
</table>
216217

packages/chakra-ui-core/CHANGELOG.md

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,17 @@
11
# Change Log
22

3+
## 0.6.2
4+
5+
### Patch Changes
6+
7+
- 3533e00: Fix: CSwitch component v-model + @change event handler.
8+
9+
## 0.6.2-next.0
10+
11+
### Patch Changes
12+
13+
- Fix: CSwitch component v-model + @change event handler.
14+
315
## 0.6.1
416

517
### Patch Changes

packages/chakra-ui-core/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "@chakra-ui/vue",
3-
"version": "0.6.1",
3+
"version": "0.6.2",
44
"description": "Build Accessible and Responsive Vue.js websites and applications with speed ⚡️",
55
"main": "dist/cjs/index.js",
66
"module": "dist/esm/index.js",

packages/chakra-ui-core/src/CReset/CReset.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -51,7 +51,7 @@ const CReset = {
5151
}
5252
},
5353
props: {
54-
config: Object
54+
config: Function
5555
},
5656
created () {
5757
const { color, bg, borderColor, placeholderColor } = this.styleConfig[this.colorMode]

packages/chakra-ui-core/src/CSwitch/CSwitch.js

Lines changed: 15 additions & 11 deletions
Original file line numberDiff line numberDiff line change
@@ -8,7 +8,7 @@
88
* @see Source https://github.com/chakra-ui/chakra-ui-vue/blob/master/packages/chakra-ui-core/src/CSwitch/CSwitch.js
99
*/
1010

11-
import { forwardProps, extractListeners } from '../utils'
11+
import { forwardProps } from '../utils'
1212

1313
import CBox from '../CBox'
1414
import CVisuallyHidden from '../CVisuallyHidden'
@@ -29,6 +29,15 @@ const switchSizes = {
2929
}
3030
}
3131

32+
/** Emits events for functional components */
33+
const emitFunctionalEvent = (fn, ...args) => {
34+
if (fn && typeof fn === 'function') {
35+
fn(...args)
36+
} else if (Array.isArray(fn)) {
37+
fn.forEach(handler => typeof handler === 'function' && handler(...args))
38+
}
39+
}
40+
3241
/**
3342
* CSwitch component
3443
*
@@ -101,18 +110,14 @@ const CSwitch = {
101110
}
102111
}
103112

104-
// Events
105-
const nonNativeEvents = {
113+
const eventListeners = {
114+
...listeners,
106115
change: (e) => {
107-
const emitChange = listeners.change
108-
if (emitChange && typeof emitChange === 'function') {
109-
emitChange(!props.isChecked)
110-
}
116+
const newValue = !props.isChecked
117+
emitFunctionalEvent(listeners.change, newValue, e)
111118
}
112119
}
113120

114-
const { native, nonNative } = extractListeners({ listeners }, nonNativeEvents)
115-
116121
return h(CBox, {
117122
...rest,
118123
props: {
@@ -142,8 +147,7 @@ const CSwitch = {
142147
checked: props.isChecked,
143148
disabled: props.isDisabled
144149
},
145-
on: nonNative,
146-
nativeOn: native
150+
on: eventListeners
147151
}),
148152
h(CControlBox, {
149153
attrs: styleProps

packages/chakra-ui-core/src/CSwitch/CSwitch.stories.js

Lines changed: 17 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -44,3 +44,20 @@ storiesOf('UI | Switch', module)
4444
}
4545
}
4646
}))
47+
.add('With v-model + @change', () => ({
48+
components: { CBox, CSwitch },
49+
data: () => ({
50+
enable: false
51+
}),
52+
template: `
53+
<p>
54+
<span>{{enable}}</span>
55+
<c-switch v-model="enable" id="email-alerts" @change="action"/>
56+
</p>`,
57+
methods: {
58+
action: action('@change(event) + v-model'),
59+
handleClick (e) {
60+
console.log('Native event handler', e)
61+
}
62+
}
63+
}))

packages/chakra-ui-core/src/CSwitch/tests/CSwitch.test.js

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -49,3 +49,29 @@ test('properly handles v-model', async () => {
4949

5050
expect(screen.getByText('enabled')).toBeInTheDocument()
5151
})
52+
53+
/**
54+
* Because the CSwitch is a functional component, it
55+
* handles event emission differently when the
56+
* consumer uses both v-model and the @change
57+
* event listener.
58+
*/
59+
it('should emit a change event when v-model + event listener are provided', async () => {
60+
const onChange = jest.fn()
61+
renderComponent({
62+
data: () => ({
63+
enable: false
64+
}),
65+
template: `
66+
<div>
67+
<span>{{enable ? 'enabled' : 'disabled'}}</span>
68+
<CSwitch v-model="enable" data-testid="switch" @change="handleChange" />
69+
</div>`,
70+
methods: { handleChange: onChange }
71+
})
72+
73+
expect(screen.getByText('disabled')).toBeInTheDocument()
74+
await userEvent.click(screen.getByTestId('switch'))
75+
expect(screen.getByText('enabled')).toBeInTheDocument()
76+
expect(onChange).toHaveBeenCalledTimes(1)
77+
})

packages/chakra-ui-theme/CHANGELOG.md

Lines changed: 2 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
# Change Log
22

3+
## 0.2.7
4+
35
## 0.2.6
46

57
All notable changes to this project will be documented in this file.

0 commit comments

Comments
 (0)