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

Commit 4564d8d

Browse files
codebender828codebender828
authored
Merge pull request #279 from chakra-ui/feat/c-live-region
feat: `CLiveRegion`, `CTextarea` `useBreakpoint` and `useBreakpointValue` hooks
2 parents 362b362 + 73bd87a commit 4564d8d

31 files changed

+696
-94
lines changed

‎.changeset/spicy-doors-heal.md

Lines changed: 34 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,34 @@
1+
---
2+
"@chakra-ui/vue-composables": minor
3+
"@chakra-ui/c-close-button": minor
4+
"@chakra-ui/c-form-control": minor
5+
"@chakra-ui/c-live-region": minor
6+
"@chakra-ui/c-media-query": minor
7+
"@chakra-ui/c-scroll-lock": minor
8+
"@chakra-ui/c-breadcrumb": minor
9+
"@chakra-ui/c-accordion": minor
10+
"@chakra-ui/c-pin-input": minor
11+
"@chakra-ui/c-checkbox": minor
12+
"@chakra-ui/c-skip-nav": minor
13+
"@chakra-ui/c-textarea": minor
14+
"@chakra-ui/c-spinner": minor
15+
"@chakra-ui/c-avatar": minor
16+
"@chakra-ui/c-button": minor
17+
"@chakra-ui/c-motion": minor
18+
"@chakra-ui/vue-accessibilty": minor
19+
"@chakra-ui/c-alert": minor
20+
"@chakra-ui/c-image": minor
21+
"@chakra-ui/c-input": minor
22+
"@chakra-ui/c-modal": minor
23+
"@chakra-ui/c-table": minor
24+
"@chakra-ui/c-code": minor
25+
"@chakra-ui/c-menu": minor
26+
"@chakra-ui/vue-layout": minor
27+
"@chakra-ui/vue-system": minor
28+
"@chakra-ui/c-tag": minor
29+
"@chakra-ui/vue-utils": minor
30+
"@chakra-ui/vue-next": minor
31+
---
32+
33+
Create Live Region, Textarea and useBreakpoint and useBreakpointValue hooks and
34+
components

‎@types/components.d.ts

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
*
77
* This is a generated file. Do not edit it's contents.
88
*
9-
* This file was generated on 2023-02-26T18:55:26.214Z
9+
* This file was generated on 2023-02-26T20:07:20.175Z
1010
*/
1111

1212
import { ChakraProps, chakra } from "@chakra-ui/vue-system"
@@ -155,9 +155,19 @@ declare module "@vue/runtime-core" {
155155
CStack: typeof import("@chakra-ui/vue-next")["CStack"]
156156
CStackDivider: typeof import("@chakra-ui/vue-next")["CStackDivider"]
157157
CStackItem: typeof import("@chakra-ui/vue-next")["CStackItem"]
158+
CTable: typeof import("@chakra-ui/vue-next")["CTable"]
159+
CTableCaption: typeof import("@chakra-ui/vue-next")["CTableCaption"]
160+
CTableContainer: typeof import("@chakra-ui/vue-next")["CTableContainer"]
161+
CTbody: typeof import("@chakra-ui/vue-next")["CTbody"]
162+
CTd: typeof import("@chakra-ui/vue-next")["CTd"]
158163
CText: typeof import("@chakra-ui/vue-next")["CText"]
164+
CTextarea: typeof import("@chakra-ui/vue-next")["CTextarea"]
165+
CTfoot: typeof import("@chakra-ui/vue-next")["CTfoot"]
166+
CTh: typeof import("@chakra-ui/vue-next")["CTh"]
167+
CThead: typeof import("@chakra-ui/vue-next")["CThead"]
159168
CThemeProvider: typeof import("@chakra-ui/vue-next")["CThemeProvider"]
160169
CToastContainer: typeof import("@chakra-ui/vue-next")["CToastContainer"]
170+
CTr: typeof import("@chakra-ui/vue-next")["CTr"]
161171
CUnorderedList: typeof import("@chakra-ui/vue-next")["CUnorderedList"]
162172
CVStack: typeof import("@chakra-ui/vue-next")["CVStack"]
163173
CVisuallyHidden: typeof import("@chakra-ui/vue-next")["CVisuallyHidden"]

‎_templates/generator/component/package.json.ejs.t

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -5,7 +5,7 @@ to: packages/<%=h.changeCase.paramCase(name)%>/package.json
55
{
66
"name": "<%= '@chakra-ui/' + h.changeCase.paramCase(name)%>",
77
"description": "<%= 'Chakra UI Vue | ' + h.changeCase.sentence(description) + ' component'%>",
8-
"version": "0.0.0-next.0",
8+
"version": "0.0.0-beta.0",
99
"author": "Jonathan Bakebwa <codebender828@gmail.com>",
1010
"homepage": "https://github.com/chakra-ui/chakra-ui-vue-next#readme",
1111
"license": "MIT",

‎_templates/generator/module/package.json.ejs.t

Lines changed: 24 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -4,29 +4,37 @@ to: packages/<%=h.changeCase.paramCase(name)%>/package.json
44

55
{
66
"name": "<%= '@chakra-ui/' + h.changeCase.paramCase(name)%>",
7-
"version": "0.0.0-next.0",
8-
"main": "<%= 'dist/chakra-ui-' + h.changeCase.paramCase(name) + '.cjs.js' %>",
9-
"module": "<%= 'dist/chakra-ui-' + h.changeCase.paramCase(name) + '.esm.js' %>",
7+
"description": "<%= 'Chakra UI Vue | ' + h.changeCase.pascalCase(name) + ' module'%>",
8+
"repository": "https://github.com/chakra-ui/chakra-ui-vue-next.git",
9+
"author": "Jonathan Bakebwa [email protected]",
10+
"version": "0.0.0-beta.0",
11+
"license": "MIT",
12+
"main": "dist/index.js",
13+
"module": "dist/index.mjs",
14+
"typings": "dist/index.d.ts",
1015
"files": [
1116
"dist"
1217
],
1318
"exports": {
1419
".": {
15-
"require": "<%= './dist/chakra-ui-' + h.changeCase.paramCase(name) + '.cjs.js' %>",
16-
"default": "<%= './dist/chakra-ui-' + h.changeCase.paramCase(name) + '.esm.js' %>"
20+
"require": "./dist/index.js",
21+
"default": "./dist/index.mjs"
1722
}
1823
},
19-
"description": "<%= 'Chakra UI Vue | ' + h.changeCase.pascalCase(name) + ' module'%>",
20-
"repository": "https://github.com/chakra-ui/chakra-ui-vue-next.git",
21-
"author": "Jonathan Bakebwa [email protected]",
22-
"license": "MIT",
24+
"repository": {
25+
"type": "git",
26+
"url": "git+https://github.com/chakra-ui/chakra-ui-vue-next.git"
27+
},
28+
"bugs": {
29+
"url": "https://github.com/chakra-ui/chakra-ui-vue-next/issues"
30+
},
31+
"sideEffects": false,
2332
"scripts": {
24-
"build": "rimraf ./dist && concurrently yarn:build:*",
25-
"build:esm": "cross-env BABEL_ENV=esm babel src --root-mode upward --extensions .ts,.tsx -d dist/esm --source-maps",
26-
"build:cjs": "cross-env BABEL_ENV=cjs babel src --root-mode upward --extensions .ts,.tsx -d dist/cjs --source-maps",
27-
"watch": "concurrently yarn:watch:*",
28-
"watch:esm": "cross-env BABEL_ENV=esm babel src --root-mode upward --extensions .ts,.tsx -d dist/esm --source-maps --watch",
29-
"watch:cjs": "cross-env BABEL_ENV=cjs babel src --root-mode upward --extensions .ts,.tsx -d dist/cjs --source-maps --watch",
30-
"watch:types": "cross-env tsc --emitDeclarationOnly --declaration --declarationDir dist/types --watch --incremental"
33+
"clean": "rimraf dist .turbo",
34+
"build": "tsup && pnpm build:types",
35+
"build:fast": "tsup",
36+
"build:types": "tsup src --dts-only",
37+
"types:check": "tsc --noEmit",
38+
"dev": "tsup --watch"
3139
}
3240
}

‎_templates/generator/tooling/package.json.ejs.t

Lines changed: 11 additions & 12 deletions
Original file line numberDiff line numberDiff line change
@@ -5,29 +5,28 @@ to: tooling/<%=h.changeCase.paramCase(name)%>/package.json
55
{
66
"name": "<%= '@chakra-ui/' + h.changeCase.paramCase(name)%>",
77
"version": "1.0.0",
8-
"main": "dist/cjs/index.js",
9-
"module": "dist/esm/index.js",
8+
"main": "dist/index.js",
9+
"module": "dist/index.mjs",
10+
"typings": "dist/index.d.ts",
1011
"files": [
1112
"dist"
1213
],
1314
"exports": {
1415
".": {
15-
"require": "./dist/cjs/index.js",
16-
"default": "./dist/esm/index.js"
16+
"require": "./dist/index.js",
17+
"default": "./dist/index.mjs"
1718
}
1819
},
1920
"description": "<%= 'Chakra UI Vue | ' + h.changeCase.pascalCase(name) + ' module'%>",
2021
"repository": "https://github.com/chakra-ui/chakra-ui-vue-next.git",
2122
"author": "Jonathan Bakebwa [email protected]",
2223
"license": "MIT",
2324
"scripts": {
24-
"build": "rimraf ./dist && concurrently yarn:build:*",
25-
"build:esm": "cross-env BABEL_ENV=esm babel src --root-mode upward --extensions .ts,.tsx -d dist/esm --source-maps",
26-
"build:cjs": "cross-env BABEL_ENV=cjs babel src --root-mode upward --extensions .ts,.tsx -d dist/cjs --source-maps",
27-
"build:types": "cross-env tsc --emitDeclarationOnly --declaration --declarationDir dist/types",
28-
"watch": "concurrently yarn:watch:*",
29-
"watch:esm": "cross-env BABEL_ENV=esm babel src --root-mode upward --extensions .ts,.tsx -d dist/esm --source-maps --watch",
30-
"watch:cjs": "cross-env BABEL_ENV=cjs babel src --root-mode upward --extensions .ts,.tsx -d dist/cjs --source-maps --watch",
31-
"watch:types": "cross-env tsc --emitDeclarationOnly --declaration --declarationDir dist/types --watch --incremental"
25+
"clean": "rimraf dist .turbo",
26+
"build": "tsup && pnpm build:types",
27+
"build:fast": "tsup",
28+
"build:types": "tsup src --dts-only",
29+
"types:check": "tsc --noEmit",
30+
"dev": "tsup --watch"
3231
}
3332
}

‎components.d.ts

Lines changed: 11 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -6,7 +6,7 @@
66
*
77
* This is a generated file. Do not edit it's contents.
88
*
9-
* This file was generated on 2023-02-26T18:55:26.214Z
9+
* This file was generated on 2023-02-26T20:07:20.175Z
1010
*/
1111

1212
import { ChakraProps, chakra } from "@chakra-ui/vue-system"
@@ -155,9 +155,19 @@ declare module "@vue/runtime-core" {
155155
CStack: typeof import("@chakra-ui/vue-next")["CStack"]
156156
CStackDivider: typeof import("@chakra-ui/vue-next")["CStackDivider"]
157157
CStackItem: typeof import("@chakra-ui/vue-next")["CStackItem"]
158+
CTable: typeof import("@chakra-ui/vue-next")["CTable"]
159+
CTableCaption: typeof import("@chakra-ui/vue-next")["CTableCaption"]
160+
CTableContainer: typeof import("@chakra-ui/vue-next")["CTableContainer"]
161+
CTbody: typeof import("@chakra-ui/vue-next")["CTbody"]
162+
CTd: typeof import("@chakra-ui/vue-next")["CTd"]
158163
CText: typeof import("@chakra-ui/vue-next")["CText"]
164+
CTextarea: typeof import("@chakra-ui/vue-next")["CTextarea"]
165+
CTfoot: typeof import("@chakra-ui/vue-next")["CTfoot"]
166+
CTh: typeof import("@chakra-ui/vue-next")["CTh"]
167+
CThead: typeof import("@chakra-ui/vue-next")["CThead"]
159168
CThemeProvider: typeof import("@chakra-ui/vue-next")["CThemeProvider"]
160169
CToastContainer: typeof import("@chakra-ui/vue-next")["CToastContainer"]
170+
CTr: typeof import("@chakra-ui/vue-next")["CTr"]
161171
CUnorderedList: typeof import("@chakra-ui/vue-next")["CUnorderedList"]
162172
CVStack: typeof import("@chakra-ui/vue-next")["CVStack"]
163173
CVisuallyHidden: typeof import("@chakra-ui/vue-next")["CVisuallyHidden"]

‎packages/c-live-region/README.md

Lines changed: 14 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,14 @@
1+
# `@chakra-ui/c-live-region`
2+
3+
Creates a hidden live region with dynamic content based on triggered events to be read out by the screen reader on change of the content
4+
5+
## Installation
6+
7+
```sh
8+
# with pnpm
9+
pnpm add @chakra-ui/c-live-region
10+
# or with Yarn
11+
yarn i @chakra-ui/c-live-region
12+
# or with npm
13+
npm i @chakra-ui/c-live-region
14+
```

‎packages/c-live-region/examples/simple-live-region.vue

Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
<template>
2+
<button @click="region.speak('Filtering categories was successful')">
3+
Click Me
4+
</button>
5+
</template>
6+
<script setup lang="ts">
7+
import { useLiveRegion } from "../src/use-live-region"
8+
const region = useLiveRegion()
9+
</script>

‎packages/c-live-region/index.tsx

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1 @@
1+
export * from "./src"

‎packages/c-live-region/package.json

Lines changed: 48 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,48 @@
1+
{
2+
"name": "@chakra-ui/c-live-region",
3+
"description": "Chakra UI Vue | Creates a hidden live region with dynamic content based on triggered events to be read out by the screen reader on change of the content component",
4+
"version": "2.0.0-beta.0",
5+
"author": "Jonathan Bakebwa <[email protected]>",
6+
"homepage": "https://github.com/chakra-ui/chakra-ui-vue-next#readme",
7+
"license": "MIT",
8+
"main": "dist/index.js",
9+
"module": "dist/index.mjs",
10+
"typings": "dist/index.d.ts",
11+
"files": [
12+
"dist"
13+
],
14+
"exports": {
15+
".": {
16+
"require": "./dist/index.js",
17+
"default": "./dist/index.mjs"
18+
}
19+
},
20+
"repository": {
21+
"type": "git",
22+
"url": "git+https://github.com/chakra-ui/chakra-ui-vue-next.git"
23+
},
24+
"bugs": {
25+
"url": "https://github.com/chakra-ui/chakra-ui-vue-next/issues"
26+
},
27+
"sideEffects": false,
28+
"scripts": {
29+
"clean": "rimraf dist .turbo",
30+
"build": "tsup && pnpm build:types",
31+
"build:fast": "tsup",
32+
"build:types": "tsup src --dts-only",
33+
"types:check": "tsc --noEmit",
34+
"dev": "tsup --watch"
35+
},
36+
"dependencies": {
37+
"@chakra-ui/vue-system": "workspace:*"
38+
},
39+
"devDependencies": {
40+
"vue": "^3.2.37"
41+
},
42+
"peerDependencies": {
43+
"vue": "^3.1.4"
44+
},
45+
"publishConfig": {
46+
"access": "public"
47+
}
48+
}

0 commit comments

Comments
 (0)