8000 Merge remote-tracking branch 'upstream/main' · xvaara/bootstrap-vue-next@01c7223 · GitHub
[go: up one dir, main page]

Skip to content

Commit 01c7223

Browse files
committed
Merge remote-tracking branch 'upstream/main'
* upstream/main: fix(BFormFile): add properties placement and browser as in BootstrapVue (bootstrap-vue-next#1797) feat(BCheckbox)!: Implement reverse and without label (bootstrap-vue-next#1825) docs: Add documentation and parity section to contributing.md (bootstrap-vue-next#1834) vscode vue typescript plugin is now depricated and included in volar feat(BOffcanvas): add props backdropBlur and shadow to customize the BOverlay instance fix(BFormTags): limitTagsText props is not used fixes bootstrap-vue-next#1804 fix(BTable): BTable rowDblClicked event not working fixes bootstrap-vue-next#1795 open/close -> show/hide (bootstrap-vue-next#1813) fix(BDropdown): ignore keynav inside form (bootstrap-vue-next#1812)
2 parents 611886c + 2fe4e69 commit 01c7223

34 files changed

+2262
-245
lines changed

.vscode/extensions.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,3 +1,3 @@
11
{
2-
"recommendations": ["Vue.volar", "Vue.vscode-typescript-vue-plugin"]
2+
"recommendations": ["Vue.volar"]
33
}

CONTRIBUTING.md

Lines changed: 28 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -51,11 +51,36 @@ This will begin the process to merge your changes into the upstream repository's
5151

5252
## Developing
5353

54-
The project uses a monorepo architecture. The main source files for the package exist in `./packages/bootstrap-vue-next`, this is primarily where developing is done. You can then run `pnpm dev` and it will start all possible development environments. When developing the main package, you will want to open the **bootstrap-vue-next:dev** host. This has hot-reloading to make developing easier. You can use the `./packages/bootstrap-vue-next/src/app.vue` file as a test area for any changes that you make
54+
The project uses a monorepo architecture. The main source files for the package exist in `./packages/bootstrap-vue-next`, this is primarily where developing is done. You can then run `pnpm dev` and it will start all possible development environments. When developing the main package, you will want to open the **bootstrap-vue-next:dev** host. This has hot-reloading to make developing easier. You can use the `./packages/bootstrap-vue-next/src/app.vue` file as a test area for any changes that you make.
5555

56-
You can also make use of the `./apps/playground` directory. The `./apps/playground` directory mimics a user's library and can demonstrate some bugs that may not be visible in the main package. However, it does not contain native hot-reloading and makes for a poor development experience since it requires a built dist copy of the main package (simply run `pnpm build`). The playground is not typically used for development. It is more of a place to view the full behavior of a component
56+
You can also make use of the `./apps/playground` directory. The `./apps/playground` directory mimics a user's library and can demonstrate some bugs that may not be visible in the main package. However, it does not contain native hot-reloading and makes for a poor development experience since it requires a built dist copy of the main package (simply run `pnpm build`). The playground is not typically used for development. It is more of a place to view the full behavior of a component.
5757

58-
You can also use `pnpm dev --filter bootstrap-vue-next` to only open the main host
58+
You can also use `pnpm dev --filter bootstrap-vue-next` to only open the main host.
59+
60+
## Improving the documentation
61+
62+
Improving the documentation is a great way to contribute to this project, especially if you're not quite ready to dive into the code.
63+
64+
We use [vitepress](https://vitepress.dev/) to build our documentation in the `./apps/docs` directory. In order to test the docs, first make sure that you follow the steps in [Setting up your workspace](#setting-up-your-workspace). Then you can run `pnpm dev` from the root and then open the **docs:dev** host. This will hot-reload the documentation to let you easily see your edits. The `*.md` files under `./apps/docs/src/docs` contains the core documentation and the `*.data.ts` files under `./apps/docs/src/data/components` contains JSON files that contains the data to build the component definitions in the documentation.
65+
66+
## Help Verify BootstrapVue and Bootstrap v5 Parity
67+
68+
As we close in on a v1 of bootstrap-vue-next, we would like to verify our feature parity with both
69+
[boostrap-vue](https://bootstrap-vue.org/) and [Boottrap v5](https://getbootstrap.com/).
70+
71+
This verification requires that someone take a close look at the documention for both of the parity
72+
systems and the code and documentation for bootstrap-vue-next to evaluate feature parity. We're using a
73+
spreadsheet to track the fine grained assement, and anyone who consumes bootstrap-vue(-next) should
74+
be able to do the first pass evaluation of a component.
75+
76+
To contribute:
77+
78+
- Take a look at the read-only version of the spreadsheet, available [here](https://1drv.ms/x/s!AiUqzkjNYGL6ieBPpQpcR41wo1laZQ). You can filter on `BFormCheckbox` and `BFormCheckboxGroup` in the `Component` column to see an example of components that are being evaludated and just about anything else to see the initial state.
79+
- Read through the `Instructions` tab of the spreadsheet, which provides a suggested process to verify a component.
80+
- Once you're satisfied that you understand the process, request access top the [read/write version of the spreadsheet](https://1drv.ms/x/s!AiUqzkjNYGL6ieBPJZV0b2mgOVgnYw) on the [Bootstrap Vue 3 discord server](https://discord.gg/8VjEkneh).
81+
- Evaluate a component (or two) and get us one step closer to v1!
82+
83+
More context is available in the comments for [this issue](https://github.com/bootstrap-vue-next/bootstrap-vue-next/issues/1775).
5984

6085
## Registering New Components
6186

apps/docs/src/data/components/ComponentReference.ts

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -17,7 +17,7 @@ export interface ComponentReference {
1717
description?: string
1818
}[]
1919
slots: {
20-
scope: SlotScopeReference[]
20+
scope?: SlotScopeReference[]
2121
name: string
2222
description?: string
2323
}[]

apps/docs/src/data/components/formCheckbox.data.ts

Lines changed: 12 additions & 46 deletions
Original file line numberDiff line numberDiff line change
@@ -116,6 +116,12 @@ export default {
116116
description:
117117
'Controls the validation state appearance of the component. `true` for valid, `false` for invalid, or `null` for no validation state',
118118
},
119+
{
120+
prop: 'reverse',
121+
type: 'boolean',
122+
default: false,
123+
description: 'When set, renders the checkbox or switch on the opposite side',
124+
},
119125
{
120126
prop: 'switch',
121127
type: 'boolean',
@@ -161,30 +167,6 @@ export default {
161167
},
162168
],
163169
},
164-
{
165-
event: 'input',
166-
description: 'Emitted before the checked value is changed',
167-
args: [
168-
{
169-
arg: 'checked',
170-
type: 'CheckboxValue | readonly CheckboxValue[]',
171-
description:
172-
'Value of the checkbox before the event. Value will be an array for grouped checkboxes or a single value for standalone checkboxes.',
173-
},
174-
],
175-
},
176-
{
177-
event: 'change',
178-
description: 'Emitted when the checked value is changed',
179-
args: [
180-
{
181-
arg: 'checked',
182-
type: 'CheckboxValue | readonly CheckboxValue[]',
183-
description:
184-
'Value of the checkbox. Value will be an array for grouped checkboxes or a single value for standalone checkboxes.',
185-
},
186-
],
187-
},
188170
],
189171
slots: [
190172
{
@@ -289,6 +271,12 @@ export default {
289271
default: false,
290272
description: 'Adds the `required` attribute to the form control',
291273
},
274+
{
275+
prop: 'reverse',
276+
type: 'boolean',
277+
default: false,
278+
description: 'When set, renders the checkboxes and switches on the opposite side',
279+
},
292280
{
293281
prop: 'size',
294282
type: 'Size',
@@ -345,28 +333,6 @@ export default {
345333
},
346334
],
347335
},
348-
{
349-
event: 'input',
350-
description: 'Emitted before the selected value(s) are changed',
351-
args: [
352-
{
353-
arg: 'input',
354-
type: 'CheckboxValue[]',
355-
description: 'Value of the checkboxes before the event. Value will be an array.',
356-
},
357-
],
358-
},
359-
{
360-
event: 'change',
361-
description: 'Emitted when the selected value(s) are changed',
362-
args: [
363-
{
364-
arg: 'change',
365-
type: 'CheckboxValue[]',
366-
description: 'Value of the checkboxes. Value will be an array.',
367-
},
368-
],
369-
},
370336
],
371337
slots: [
372338
{

apps/docs/src/data/components/formFile.data.ts

Lines changed: 54 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -5,107 +5,158 @@ export default {
55
{
66
component: 'BFormFile',
77
props: [
8+
{
9+
prop: 'ariaLabel',
10+
type: 'string',
11+
default: undefined,
12+
description: 'Sets the value of `aria-label` attribute on the rendered element',
13+
},
14+
{
15+
prop: 'ariaLabelledBy',
16+
type: 'string',
17+
default: undefined,
18+
description:
19+
'The ID of the element that provides a label for this component. Used as the value for the `aria-labelledby` attribute',
20+
},
821
{
922
prop: 'accept',
1023
type: 'string | string[]',
1124
default: '',
25+
description: "Value to set on the file input's `accept` attribute",
1226
},
1327
{
1428
prop: 'autofocus',
1529
type: 'boolean',
1630
default: false,
31+
description:
32+
'When set to `true`, attempts to auto-focus the control when it is mounted, or re-activated when in a keep-alive. Does not set the `autofocus` attribute on the control',
1733
},
1834
{
1935
prop: 'capture',
2036
type: "'boolean' | 'user' | 'environment'",
2137
default: false,
38+
description:
39+
'When set, will instruction the browser to use the devices camera (if supported)',
2240
},
2341
{
2442
prop: 'directory',
2543
type: 'boolean',
2644
default: false,
45+
description: 'Enable `directory` mode (on browsers that support it)',
2746
},
2847
{
2948
prop: 'disabled',
3049
type: 'boolean',
3150
default: false,
51+
description:
52+
"When set to `true`, disables the component's functionality and places it in a disabled state",
3253
},
3354
{
3455
prop: 'form',
3556
type: 'string',
3657
default: undefined,
58+
description:
59+
'ID of the form that the form control belongs to. Sets the `form` attribute on the control',
3760
},
3861
{
3962
prop: 'id',
4063
type: 'string',
4164
default: undefined,
65+
description:
66+
'Used to set the `id` attribute on the rendered content, and used as the base to generate any additional element IDs as needed',
4267
},
4368
{
4469
prop: 'multiple',
4570
type: 'boolean',
4671
default: false,
72+
description:
73+
'When set, will allow multiple files to be selected. `v-model` will be an array',
4774
},
4875
{
4976
prop: 'name',
5077
type: 'string',
5178
default: undefined,
79+
description: 'Sets the value of the `name` attribute on the form control',
5280
},
5381
{
5482
prop: 'noDrop',
5583
type: 'boolean',
5684
default: false,
85+
description: 'Disable drag and drop mode',
5786
},
5887
{
5988
prop: 'noTraverse',
6089
type: 'boolean',
6190
default: false,
91+
description: 'Wether to returns files as a flat array when in `directory` mode',
6292
},
6393
{
6494
prop: 'required',
6595
type: 'boolean',
6696
default: false,
97+
description: 'Adds the `required` attribute to the form control',
6798
},
6899
{
69100
prop: 'size',
70101
type: 'Size',
71102
default: undefined,
103+
description: "Set the size of the component's appearance. 'sm', 'md' (default), or 'lg'",
72104
},
73105
{
74106
prop: 'state',
75107
type: 'boolean | null',
76108
default: undefined,
109+
description:
110+
'Controls the validation state appearance of the component. `true` for valid, `false` for invalid, or `null` for no validation state',
77111
},
78112
{
79113
prop: 'modelValue',
80114
type: 'File[] | File | null',
81115
default: undefined,
116+
description:
117+
'The current value of the file input. Will be a single `File` object or an array of `File` objects (if `multiple` or `directory` is set). Can be set to `null`, or an empty array to reset the file input',
82118
},
83119
{
84120
prop: 'label',
85121
type: 'string',
86122
default: '',
123+
description: 'Sets the label for the form group which the file input is rendered',
87124
},
88125
{
89126
prop: 'labelClass',
90127
type: 'ClassValue',
91128
default: undefined,
129+
description: 'Sets the styling for the label',
130+
},
131+
{
132+
prop: 'placement',
133+
type: `'start' | 'end'`,
134+
default: `'start'`,
135+
description: 'Sets the placement for the file button',
136+
},
137+
{
138+
prop: 'browser',
139+
type: 'String',
140+
default: 'Browse',
141+
description: 'Text content for the file browse button',
92142
},
93143
],
94144
emits: [
95145
{
96146
event: 'update:modelValue',
97-
description: '',
147+
description: 'Updates the `v-model` value (see docs for more details)',
98148
args: [
99149
{
100150
arg: 'value',
101151
type: 'File | File[] | null',
102-
description: '',
152+
description:
153+
'Will be a single File object in single mode or an array of File objects in multiple mode',
103154
},
104155
],
105156
},
106157
{
107158
event: 'change',
108-
description: '',
159+
description: 'Original change event of the input',
109160
args: [
110161
{
111162
arg: 'value',

apps/docs/src/data/components/formRadio.data.ts

Lines changed: 6 additions & 44 deletions
Original file line numberDiff line numberDiff line change
@@ -80,6 +80,12 @@ export default {
8080
type: 'boolean',
8181
default: false,
8282
},
83+
{
84+
prop: 'reverse',
85+
type: 'boolean',
86+
default: false,
87+
description: 'When set, renders the radio button on the opposite side',
88+
},
8389
{
8490
prop: 'state',
8591
type: 'boolean | null',
@@ -92,28 +98,6 @@ export default {
9298
},
9399
],
94100
emits: [
95-
{
96-
event: 'input',
97-
description: '',
98-
args: [
99-
{
100-
arg: 'input',
101-
description: '',
102-
type: 'boolean | string | unknown[] | Record<string, unknown> | number',
103-
},
104-
],
105-
},
106-
{
107-
event: 'change',
108-
description: '',
109-
args: [
110-
{
111-
arg: 'change',
112-
description: '',
113-
type: 'boolean | string | unknown[] | Record<string, unknown> | number',
114-
},
115-
],
116-
},
117101
{
118102
event: 'update:modelValue',
119103
description: '',
@@ -239,17 +223,6 @@ export default {
239223
},
240224
],
241225
emits: [
242-
{
243-
args: [
244-
{
245-
arg: 'input',
246-
description: '',
247-
type: 'unknown',
248-
},
249-
],
250-
description: '',
251-
event: 'input',
252-
},
253226
{
254227
args: [
255228
{
@@ -261,17 +234,6 @@ export default {
261234
description: '',
262235
event: 'update:modelValue',
263236
},
264-
{
265-
args: [
266-
{
267-
arg: 'change',
268-
description: '',
269-
type: 'unknown',
270-
},
271-
],
272-
description: '',
273-
event: 'change',
274-
},
275237
],
276238
slots: [],
277239
},

0 commit comments

Comments
 (0)
0