-
-
Notifications
You must be signed in to change notification settings - Fork 158
docs(migration): add component aliases guidelines #2771
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
base: main
Are you sure you want to change the base?
docs(migration): add component aliases guidelines #2771
Conversation
|
WalkthroughThis update addresses several typographical errors and improves clarity across documentation and descriptive comments in the codebase. It also adds a new section and a comprehensive alias table to the migration guide, clarifying the lack of component alias support in BootstrapVueNext. No functional or logic changes are present. Changes
Possibly related PRs
Suggested reviewers
Poem
✨ Finishing Touches
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. Note: Be mindful of the bot's finite context window. It's strongly recommended to break down tasks such as reading entire modules into smaller chunks. For a focused discussion, use review comments to chat about specific files and their changes, instead of using the PR comments. CodeRabbit Commands (Invoked using PR comments)
Other keywords and placeholders
CodeRabbit Configuration File (
|
commit: |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (9)
apps/docs/src/docs/components/form-spinbutton.md (1)
125-126
: Subject/verb agreement & punctuationPlural subjects need the plural verb, and the sentence ends abruptly without a period.
-Note the `repeat-delay`, `repeat-threshold` and `repeat-interval` only applies to the <kbd>ArrowUp</kbd> or <kbd>ArrowDown</kbd> keys +Note that the `repeat-delay`, `repeat-threshold`, and `repeat-interval` settings only apply to the <kbd>ArrowUp</kbd> and <kbd>ArrowDown</kbd> keys.apps/docs/src/data/components/tabs.data.ts (1)
88-89
: Minor wording tweak (optional)You could drop “to be” for a slightly smoother read:
-"When set to true, renders the tabs with the appropriate styles to be placed into a 'b-card'", +"When set to true, renders the tabs with styles appropriate for placement in a <BCard>",Purely stylistic—feel free to keep as-is.
apps/docs/src/docs/migration-guide.md (7)
52-54
: Sentence still fragmentedThe second line is dangling. Joining it tightens the statement.
-on the model (generally named models). +by model properties (typically named `models`).
54-55
: Component name & wording
BFormCheckbox
is the actual component name and the sentence can be more concise.-For instance, in order to two-way bind to the `indeterminate` property in `BFormCheckBox` you `v-bind` to the model named `indeterminate` rather than adding the sync modifier to the `indeterminate` property: +For example, to two-way bind the `indeterminate` state of `<BFormCheckbox>`, bind to the `indeterminate` model instead of using the `.sync` modifier:
150-156
: Grammar, spelling & flowSeveral small issues (“have” → “has”, “instace”, commas). Suggested rewrite:
-Bootstrap Vue have component aliases, for instace `<b-button>` could be used as `<b-btn>`. -BootstrapVueNext will not support them and hence you should use the non-aliased version. - -Here is a table giving all of the aliases and their replacements: +BootstrapVue had a number of component aliases; for instance, `<b-button>` could be written as `<b-btn>`. +BootstrapVueNext does not support these aliases, so you must use the full component names. + +The following table lists each alias alongside its replacement:
348-349
: ClaritySlight re-phrasing makes the intent clearer.
-The boolean argument to control returning focus to the toggle button on the `hide` scoped property of the default slot is deprecated. +The boolean argument that controls whether focus returns to the toggle button in the `hide` scoped slot is deprecated.
414-420
: Streamline & avoid back-ticks around plain text-`Vue 3` changed the way that `v-model` binding works and in the process changed the guidance -when naming the main model property and events for the primary model. `bootstrap-vue-next` follows -this guidance, which affects all of the wrappers for form input. If you're looking for the `value` -property or the `change` and `input` events, you'll find that functionality in the `modelValue` -property and `update:model-value` events. Bootstrap-vue-next no longer provides custom `change` and -`input` events, so the native versions of those events are now exposed. +Vue 3 changed how `v-model` works and, as a result, updated the recommended names for the primary model property and its events. BootstrapVueNext follows this guidance: all form-input wrappers now use the `modelValue` property and the `update:model-value` event instead of the legacy `value`, `change`, or `input` APIs. Consequently, only the native `change` and `input` events are exposed.
658-659
: Missing concluding phraseAdd “for details” for a smoother finish and period for consistency.
-The `type` prop is deprecated. Use the `v-b-color-mode` directive or `useColorMode` composable instead. Details in our [docs](/components/navbar#color-scheme) +The `type` prop is deprecated. Use the `v-b-color-mode` directive or `useColorMode` composable instead. See our [docs](/components/navbar#color-scheme) for details.
730-732
: Optional punctuationConsider adding a comma after “deprecated” for readability:
-`<BSkeletonIcon>` is deprecated along with the rest of the BootstrapVue icon support. +`<BSkeletonIcon>` is deprecated, along with the rest of the BootstrapVue icon support.Purely stylistic.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
apps/docs/src/data/components/tabs.data.ts
(1 hunks)apps/docs/src/docs/components/form-spinbutton.md
(1 hunks)apps/docs/src/docs/migration-guide.md
(6 hunks)apps/docs/src/utils/image-props.ts
(1 hunks)
🧰 Additional context used
🧠 Learnings (3)
📓 Common learnings
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:622-626
Timestamp: 2025-06-05T11:43:10.793Z
Learning: In migration guides, links to the old/previous version's documentation (like bootstrap-vue.org) are appropriate and helpful when explaining deprecated features, as they provide users with reference points for what they're migrating from.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2669
File: apps/docs/src/data/components/table.data.ts:334-336
Timestamp: 2025-04-24T20:35:48.629Z
Learning: The generic type parameter for table items should use the singular form `Item` rather than the plural `Items` to improve readability and follow TypeScript conventions. This change would primarily affect two files: `packages/bootstrap-vue-next/src/types/ComponentProps.ts` and `apps/docs/src/data/components/table.data.ts`.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:630-632
Timestamp: 2025-05-23T23:58:07.165Z
Learning: The `<NotYetImplemented/>` component in the bootstrap-vue-next documentation automatically renders text indicating "Not Yet Implemented", so additional explanatory text about features not being implemented is redundant when this component is used.
apps/docs/src/data/components/tabs.data.ts (7)
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2669
File: apps/docs/src/data/components/table.data.ts:334-336
Timestamp: 2025-04-24T20:35:48.629Z
Learning: The generic type parameter for table items should use the singular form `Item` rather than the plural `Items` to improve readability and follow TypeScript conventions. This change would primarily affect two files: `packages/bootstrap-vue-next/src/types/ComponentProps.ts` and `apps/docs/src/data/components/table.data.ts`.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:425-430
Timestamp: 2025-05-28T07:32:45.658Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the activeIndex synchronization within sortTabs() is necessary and correct. When sorting tabs by DOM position, indices change, so activeIndex must be updated immediately to maintain consistency with activeId. This is not an unwanted side effect but a required consequence of the sorting operation.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:240-261
Timestamp: 2025-05-28T07:01:55.095Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the complex initialization logic with updateInitialActiveIndex and updateInitialActiveId flags is necessary for SSR compatibility. Tab initialization cannot be deferred to mounted lifecycle because tabs must be available for server-side rendering of the initial HTML state.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2669
File: apps/docs/src/data/components/table.data.ts:334-336
Timestamp: 2025-04-24T20:35:48.629Z
Learning: The generic type for table items should use the singular form `Item` rather than the plural `Items` to follow TypeScript conventions and improve readability. This makes expressions like `item: Item` and `items: Item[]` more intuitive than `item: Items` and `items: Items[]`.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2669
File: apps/docs/src/data/components/table.data.ts:334-336
Timestamp: 2025-04-24T20:35:48.629Z
Learning: The generic type for table items should use the singular form `Item` rather than the plural `Items` to follow TypeScript conventions and improve readability in type definitions.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2669
File: apps/docs/src/data/components/table.data.ts:334-336
Timestamp: 2025-04-24T20:35:48.629Z
Learning: The generic type for table items should be named in singular form (`Item`) rather than plural (`Items`) to follow TypeScript conventions and improve readability in type definitions.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:384-404
Timestamp: 2025-05-28T07:57:19.915Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the activeIndex and activeId watchers are intentionally designed with separation of concerns: activeIndex watcher handles activate-tab event emission and complex validation logic, while activeId watcher is kept simple for synchronization between activeId and activeIndex values only.
apps/docs/src/docs/migration-guide.md (12)
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:622-626
Timestamp: 2025-06-05T11:43:10.793Z
Learning: In migration guides, links to the old/previous version's documentation (like bootstrap-vue.org) are appropriate and helpful when explaining deprecated features, as they provide users with reference points for what they're migrating from.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:630-632
Timestamp: 2025-05-23T23:58:07.165Z
Learning: The `<NotYetImplemented/>` component in the bootstrap-vue-next documentation automatically renders text indicating "Not Yet Implemented", so additional explanatory text about features not being implemented is redundant when this component is used.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2669
File: apps/docs/src/data/components/table.data.ts:334-336
Timestamp: 2025-04-24T20:35:48.629Z
Learning: The generic type parameter for table items should use the singular form `Item` rather than the plural `Items` to improve readability and follow TypeScript conventions. This change would primarily affect two files: `packages/bootstrap-vue-next/src/types/ComponentProps.ts` and `apps/docs/src/data/components/table.data.ts`.
Learnt from: unstoppablecarl
PR: bootstrap-vue-next/bootstrap-vue-next#2671
File: packages/bootstrap-vue-next/src/components/BToast/_toast.scss:1-3
Timestamp: 2025-04-27T17:30:42.045Z
Learning: In global SCSS files for bootstrap-vue-next, `:deep()` combinator should not be used as it only works in Vue's scoped style blocks. Standard CSS/SCSS selectors should be used instead.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:384-404
Timestamp: 2025-05-28T07:57:19.915Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the activeIndex and activeId watchers are intentionally designed with separation of concerns: activeIndex watcher handles activate-tab event emission and complex validation logic, while activeId watcher is kept simple for synchronization between activeId and activeIndex values only.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:240-261
Timestamp: 2025-05-28T07:01:55.095Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the complex initialization logic with updateInitialActiveIndex and updateInitialActiveId flags is necessary for SSR compatibility. Tab initialization cannot be deferred to mounted lifecycle because tabs must be available for server-side rendering of the initial HTML state.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:425-430
Timestamp: 2025-05-28T07:32:45.658Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the activeIndex synchronization within sortTabs() is necessary and correct. When sorting tabs by DOM position, indices change, so activeIndex must be updated immediately to maintain consistency with activeId. This is not an unwanted side effect but a required consequence of the sorting operation.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2679
File: apps/docs/.vitepress/theme/Layout.vue:0-0
Timestamp: 2025-05-01T23:40:56.146Z
Learning: In bootstrap-vue-next, the `useScrollspy` hook returns an object with a `current` property which is the ID string (or null) of the currently active item, not an object containing an ID.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2762
File: apps/docs/src/docs/components/tooltip.md:0-0
Timestamp: 2025-06-26T19:46:19.333Z
Learning: BTooltip is a very thin wrapper around BPopover in bootstrap-vue-next. There is no separate `useTooltipController` composable - the `usePopoverController` composable can be used to programmatically control both popovers and tooltips.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2425
File: packages/bootstrap-vue-next/src/plugins/popoverController/index.ts:138-140
Timestamp: 2025-04-28T22:48:46.738Z
Learning: In bootstrap-vue-next, `PopoverOrchestratorParam` includes an `id` field of type `ControllerKey` through inheritance from base types. This field is declared in the `BvControllerOptions` interface and propagated through the type hierarchy.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2672
File: packages/bootstrap-vue-next/src/components/BPopover/BPopover.vue:269-277
Timestamp: 2025-04-28T20:33:04.113Z
Learning: In Vue 3.3+, `toRef(() => props.strategy)` creates a reactive readonly ref. This getter-based syntax was introduced in Vue 3.3 as an ergonomic alternative to `computed()` and is the recommended approach for creating refs from props or other reactive sources.
Learnt from: VividLemon
PR: bootstrap-vue-next/bootstrap-vue-next#2691
File: packages/bootstrap-vue-next/src/composables/useBLinkHelper.ts:85-86
Timestamp: 2025-05-26T17:28:35.902Z
Learning: In the `useBLinkTagResolver` function in `packages/bootstrap-vue-next/src/composables/useBLinkHelper.ts`, the `routerComponentName` parameter is required and typed as `MaybeRefOrGetter<string>`, ensuring it cannot be undefined.
🪛 LanguageTool
apps/docs/src/docs/components/form-spinbutton.md
[grammar] ~125-~125: Correctly pair commas and coordinating conjunctions.
Context: ...plieramount Note the
repeat-delay,
repeat-thresholdand
repeat-interval` only applies to t...
(QB_NEW_EN_OTHER_ERROR_IDS_000073)
[grammar] ~125-~125: There might be a mistake here.
Context: ...t-thresholdand
repeat-interval` only applies to the ArrowUp or Arrow...
(QB_NEW_EN_OTHER)
[grammar] ~125-~125: Place a period at the end of declarative sentences.
Context: ...rowUp or ArrowDown keys <script setup lang="ts"> import {data} from '../../data/components/formSpinbutton.data' </script>
(QB_NEW_EN_OTHER_ERROR_IDS_000178)
apps/docs/src/docs/migration-guide.md
[grammar] ~54-~54: There might be a mistake here.
Context: ...bind to the indeterminate
property in BFormCheckBox
you v-bind
to the model named `indete...
(QB_NEW_EN_OTHER)
[grammar] ~54-~54: There might be a mistake here.
Context: ...BFormCheckBoxyou
v-bindto the model named
indeterminate` rather than adding...
(QB_NEW_EN_OTHER)
[grammar] ~150-~150: Use proper spacing conventions.
Context: ...roupMigration.vue ## Components aliases Bootstrap Vue have component aliases, fo...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~152-~152: Ensure subjects and verbs match in plurality.
Context: ...e ## Components aliases Bootstrap Vue have component aliases, for instace `<b-butt...
(QB_NEW_EN_OTHER_ERROR_IDS_000074)
[grammar] ~152-~152: There might be a mistake here.
Context: ...es Bootstrap Vue have component aliases, for instace <b-button>
could be used ...
(QB_NEW_EN_OTHER)
[grammar] ~152-~152: Ensure spelling is correct.
Context: ...otstrap Vue have component aliases, for instace <b-button>
could be used as <b-btn>
...
(QB_NEW_EN_ORTHOGRAPHY_ERROR_IDS_000051)
[grammar] ~152-~152: Use proper spacing conventions.
Context: ...<b-button>
could be used as <b-btn>
. BootstrapVueNext will not support them a...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[style] ~155-~155: Consider removing “of” to be more concise
Context: ...liased version. Here is a table giving all of the aliases and their replacements: | Boot...
(ALL_OF_THE)
[grammar] ~155-~155: Use proper spacing conventions.
Context: ...l of the aliases and their replacements: | BootstrapVue ...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~348-~348: Use proper spacing conventions.
Context: ...perty of the default slot is deprecated. It is less important in BootstrapVueNext...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~658-~658: Use proper spacing conventions.
Context: ...composable instead. Details in our docs #### BNavbarNav align
prop now takes value...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~730-~730: Use proper spacing conventions.
Context: ...holder*>components.
` is deprecated along with the rest of the...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~730-~730: There might be a mistake here.
Context: ...f the BootstrapVue icon support. See our icon documentation for de...
(QB_NEW_EN_OTHER)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: build
- GitHub Check: test-unit
🔇 Additional comments (1)
apps/docs/src/utils/image-props.ts (1)
29-30
: Typo fix looks goodThe corrected wording removes the duplicated “the”. No further changes needed.
d96d8ee
to
3bb4f13
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (6)
apps/docs/src/docs/components/form-spinbutton.md (1)
125-125
: Fix plural-verb agreement and punctuationThe subject is a list of three settings, so use “apply” + end the sentence with a period.
-Note the `repeat-delay`, `repeat-threshold` and `repeat-interval` only applies to the <kbd>ArrowUp</kbd> or <kbd>ArrowDown</kbd> keys +Note that the `repeat-delay`, `repeat-threshold`, and `repeat-interval` only apply to the <kbd>ArrowUp</kbd> and <kbd>ArrowDown</kbd> keys.apps/docs/src/docs/migration-guide.md (5)
52-54
: Clarify wording & fix grammar in “Sync modifier” paragraph-This modifier has been replaced by properties -on the model (generally named models). +This modifier has been replaced by dedicated model properties (usually named `modelValue`). -For instance, in order to two-way bind to the `indeterminate` property in `BFormCheckBox` you `v-bind` to the model -named `indeterminate` rather than adding the sync modifier to the `indeterminate` property: +For example, to two-way bind the `indeterminate` property of `BFormCheckBox`, bind to the model named `indeterminate` instead of adding the `.sync` modifier to that prop:
150-156
: Rename heading & clean up alias section grammar-## Components aliases +## Component aliases -Bootstrap Vue have component aliases, for instace `<b-button>` could be used as `<b-btn>`. -BootstrapVueNext will not support them and hence you should use the non-aliased version. +BootstrapVue had a number of component aliases—for instance, `<b-btn>` was an alias for `<b-button>`. +BootstrapVueNext does not support these aliases, so you must use the canonical component names. -Here is a table giving all of the aliases and their replacements: +The table below lists each BootstrapVue alias and its BootstrapVueNext replacement:
348-348
: Sentence is hard to parseRecommend re-phrasing for clarity:
-The boolean argument to control returning focus to the toggle button on the `hide` scoped property of the default slot is deprecated. +The boolean argument in the `hide` scoped slot that controlled whether focus returned to the toggle button is deprecated.
658-658
: Terminate sentence properly-The `type` prop is deprecated. Use the `v-b-color-mode` directive or `useColorMode` composable instead. Details in our [docs](/components/navbar#color-scheme) +The `type` prop is deprecated. Use the `v-b-color-mode` directive or `useColorMode` composable instead. See our [docs](/components/navbar#color-scheme) for details.
730-730
: Minor spacing & punctuation nit-`<BSkeletonIcon>` is deprecated along with the rest of the BootstrapVue icon support. See our -[icon documentation](/docs/icons) for details. +`<BSkeletonIcon>` is deprecated along with the rest of the BootstrapVue icon support. +See our [icon documentation](/docs/icons) for details.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
apps/docs/src/data/components/tabs.data.ts
(1 hunks)apps/docs/src/docs/components/form-spinbutton.md
(1 hunks)apps/docs/src/docs/migration-guide.md
(6 hunks)apps/docs/src/utils/image-props.ts
(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (2)
- apps/docs/src/utils/image-props.ts
- apps/docs/src/data/components/tabs.data.ts
🧰 Additional context used
🧠 Learnings (2)
📓 Common learnings
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:622-626
Timestamp: 2025-06-05T11:43:10.793Z
Learning: In migration guides, links to the old/previous version's documentation (like bootstrap-vue.org) are appropriate and helpful when explaining deprecated features, as they provide users with reference points for what they're migrating from.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2669
File: apps/docs/src/data/components/table.data.ts:334-336
Timestamp: 2025-04-24T20:35:48.629Z
Learning: The generic type parameter for table items should use the singular form `Item` rather than the plural `Items` to improve readability and follow TypeScript conventions. This change would primarily affect two files: `packages/bootstrap-vue-next/src/types/ComponentProps.ts` and `apps/docs/src/data/components/table.data.ts`.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:630-632
Timestamp: 2025-05-23T23:58:07.165Z
Learning: The `<NotYetImplemented/>` component in the bootstrap-vue-next documentation automatically renders text indicating "Not Yet Implemented", so additional explanatory text about features not being implemented is redundant when this component is used.
apps/docs/src/docs/migration-guide.md (12)
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:622-626
Timestamp: 2025-06-05T11:43:10.793Z
Learning: In migration guides, links to the old/previous version's documentation (like bootstrap-vue.org) are appropriate and helpful when explaining deprecated features, as they provide users with reference points for what they're migrating from.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:630-632
Timestamp: 2025-05-23T23:58:07.165Z
Learning: The `<NotYetImplemented/>` component in the bootstrap-vue-next documentation automatically renders text indicating "Not Yet Implemented", so additional explanatory text about features not being implemented is redundant when this component is used.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2669
File: apps/docs/src/data/components/table.data.ts:334-336
Timestamp: 2025-04-24T20:35:48.629Z
Learning: The generic type parameter for table items should use the singular form `Item` rather than the plural `Items` to improve readability and follow TypeScript conventions. This change would primarily affect two files: `packages/bootstrap-vue-next/src/types/ComponentProps.ts` and `apps/docs/src/data/components/table.data.ts`.
Learnt from: unstoppablecarl
PR: bootstrap-vue-next/bootstrap-vue-next#2671
File: packages/bootstrap-vue-next/src/components/BToast/_toast.scss:1-3
Timestamp: 2025-04-27T17:30:42.045Z
Learning: In global SCSS files for bootstrap-vue-next, `:deep()` combinator should not be used as it only works in Vue's scoped style blocks. Standard CSS/SCSS selectors should be used instead.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:384-404
Timestamp: 2025-05-28T07:57:19.915Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the activeIndex and activeId watchers are intentionally designed with separation of concerns: activeIndex watcher handles activate-tab event emission and complex validation logic, while activeId watcher is kept simple for synchronization between activeId and activeIndex values only.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:240-261
Timestamp: 2025-05-28T07:01:55.095Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the complex initialization logic with updateInitialActiveIndex and updateInitialActiveId flags is necessary for SSR compatibility. Tab initialization cannot be deferred to mounted lifecycle because tabs must be available for server-side rendering of the initial HTML state.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:425-430
Timestamp: 2025-05-28T07:32:45.658Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the activeIndex synchronization within sortTabs() is necessary and correct. When sorting tabs by DOM position, indices change, so activeIndex must be updated immediately to maintain consistency with activeId. This is not an unwanted side effect but a required consequence of the sorting operation.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2679
File: apps/docs/.vitepress/theme/Layout.vue:0-0
Timestamp: 2025-05-01T23:40:56.146Z
Learning: In bootstrap-vue-next, the `useScrollspy` hook returns an object with a `current` property which is the ID string (or null) of the currently active item, not an object containing an ID.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2762
File: apps/docs/src/docs/components/tooltip.md:0-0
Timestamp: 2025-06-26T19:46:19.333Z
Learning: BTooltip is a very thin wrapper around BPopover in bootstrap-vue-next. There is no separate `useTooltipController` composable - the `usePopoverController` composable can be used to programmatically control both popovers and tooltips.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2425
File: packages/bootstrap-vue-next/src/plugins/popoverController/index.ts:138-140
Timestamp: 2025-04-28T22:48:46.738Z
Learning: In bootstrap-vue-next, `PopoverOrchestratorParam` includes an `id` field of type `ControllerKey` through inheritance from base types. This field is declared in the `BvControllerOptions` interface and propagated through the type hierarchy.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2672
File: packages/bootstrap-vue-next/src/components/BPopover/BPopover.vue:269-277
Timestamp: 2025-04-28T20:33:04.113Z
Learning: In Vue 3.3+, `toRef(() => props.strategy)` creates a reactive readonly ref. This getter-based syntax was introduced in Vue 3.3 as an ergonomic alternative to `computed()` and is the recommended approach for creating refs from props or other reactive sources.
Learnt from: VividLemon
PR: bootstrap-vue-next/bootstrap-vue-next#2691
File: packages/bootstrap-vue-next/src/composables/useBLinkHelper.ts:85-86
Timestamp: 2025-05-26T17:28:35.902Z
Learning: In the `useBLinkTagResolver` function in `packages/bootstrap-vue-next/src/composables/useBLinkHelper.ts`, the `routerComponentName` parameter is required and typed as `MaybeRefOrGetter<string>`, ensuring it cannot be undefined.
🪛 LanguageTool
apps/docs/src/docs/components/form-spinbutton.md
[grammar] ~125-~125: Correctly pair commas and coordinating conjunctions.
Context: ...plieramount Note the
repeat-delay,
repeat-thresholdand
repeat-interval` only applies to t...
(QB_NEW_EN_OTHER_ERROR_IDS_000073)
[grammar] ~125-~125: There might be a mistake here.
Context: ...t-thresholdand
repeat-interval` only applies to the ArrowUp or Arrow...
(QB_NEW_EN_OTHER)
[grammar] ~125-~125: Place a period at the end of declarative sentences.
Context: ...rowUp or ArrowDown keys <script setup lang="ts"> import {data} from '../../data/components/formSpinbutton.data' </script>
(QB_NEW_EN_OTHER_ERROR_IDS_000178)
apps/docs/src/docs/migration-guide.md
[grammar] ~54-~54: There might be a mistake here.
Context: ...bind to the indeterminate
property in BFormCheckBox
you v-bind
to the model named `indete...
(QB_NEW_EN_OTHER)
[grammar] ~54-~54: There might be a mistake here.
Context: ...BFormCheckBoxyou
v-bindto the model named
indeterminate` rather than adding...
(QB_NEW_EN_OTHER)
[grammar] ~150-~150: Use proper spacing conventions.
Context: ...roupMigration.vue ## Components aliases Bootstrap Vue have component aliases, fo...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~152-~152: Ensure subjects and verbs match in plurality.
Context: ...e ## Components aliases Bootstrap Vue have component aliases, for instace `<b-butt...
(QB_NEW_EN_OTHER_ERROR_IDS_000074)
[grammar] ~152-~152: There might be a mistake here.
Context: ...es Bootstrap Vue have component aliases, for instace <b-button>
could be used ...
(QB_NEW_EN_OTHER)
[grammar] ~152-~152: Ensure spelling is correct.
Context: ...otstrap Vue have component aliases, for instace <b-button>
could be used as <b-btn>
...
(QB_NEW_EN_ORTHOGRAPHY_ERROR_IDS_000051)
[grammar] ~152-~152: Use proper spacing conventions.
Context: ...<b-button>
could be used as <b-btn>
. BootstrapVueNext will not support them a...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[style] ~155-~155: Consider removing “of” to be more concise
Context: ...liased version. Here is a table giving all of the aliases and their replacements: | Boot...
(ALL_OF_THE)
[grammar] ~155-~155: Use proper spacing conventions.
Context: ...l of the aliases and their replacements: | BootstrapVue ...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~348-~348: Use proper spacing conventions.
Context: ...perty of the default slot is deprecated. It is less important in BootstrapVueNext...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~658-~658: Use proper spacing conventions.
Context: ...composable instead. Details in our docs #### BNavbarNav align
prop now takes value...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~730-~730: Use proper spacing conventions.
Context: ...holder*>components.
` is deprecated along with the rest of the...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~730-~730: There might be a mistake here.
Context: ...f the BootstrapVue icon support. See our icon documentation for de...
(QB_NEW_EN_OTHER)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: test-unit
- GitHub Check: build
3bb4f13
to
72f2768
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (3)
apps/docs/src/docs/components/form-spinbutton.md (1)
125-126
: Plural-verb agreement + punctuation
repeat-delay
,repeat-threshold
, andrepeat-interval
are plural; use “apply”, not “applies”, and finish the sentence with a period.-Note that the `repeat-delay`, `repeat-threshold` and `repeat-interval` only applies to the <kbd>ArrowUp</kbd> or <kbd>ArrowDown</kbd> keys +Note that the `repeat-delay`, `repeat-threshold`, and `repeat-interval` only apply to the <kbd>ArrowUp</kbd> and <kbd>ArrowDown</kbd> keys.apps/docs/src/docs/migration-guide.md (2)
52-53
: Clarify wording of replacement for.sync
“properties on the model (generally named models)” is hard to parse. Consider rephrasing to make the guidance unambiguous.
-This modifier has been replaced by properties on the model (generally named models). +This modifier has been replaced by additional named `v-model` bindings (usually with model names).
54-55
: Component name casing
BFormCheckbox
is the canonical component name (no capital “B” inside “Check”). Using the correct casing avoids confusion and keeps the docs searchable.-...property in `BFormCheckBox` you `v-bind`... +...property in `BFormCheckbox` you `v-bind`...
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
apps/docs/src/data/components/tabs.data.ts
(1 hunks)apps/docs/src/docs/components/form-spinbutton.md
(1 hunks)apps/docs/src/docs/migration-guide.md
(6 hunks)apps/docs/src/utils/image-props.ts
(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (2)
- apps/docs/src/utils/image-props.ts
- apps/docs/src/data/components/tabs.data.ts
🧰 Additional context used
🧠 Learnings (2)
📓 Common learnings
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:622-626
Timestamp: 2025-06-05T11:43:10.793Z
Learning: In migration guides, links to the old/previous version's documentation (like bootstrap-vue.org) are appropriate and helpful when explaining deprecated features, as they provide users with reference points for what they're migrating from.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2669
File: apps/docs/src/data/components/table.data.ts:334-336
Timestamp: 2025-04-24T20:35:48.629Z
Learning: The generic type parameter for table items should use the singular form `Item` rather than the plural `Items` to improve readability and follow TypeScript conventions. This change would primarily affect two files: `packages/bootstrap-vue-next/src/types/ComponentProps.ts` and `apps/docs/src/data/components/table.data.ts`.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:630-632
Timestamp: 2025-05-23T23:58:07.165Z
Learning: The `<NotYetImplemented/>` component in the bootstrap-vue-next documentation automatically renders text indicating "Not Yet Implemented", so additional explanatory text about features not being implemented is redundant when this component is used.
apps/docs/src/docs/migration-guide.md (12)
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:622-626
Timestamp: 2025-06-05T11:43:10.793Z
Learning: In migration guides, links to the old/previous version's documentation (like bootstrap-vue.org) are appropriate and helpful when explaining deprecated features, as they provide users with reference points for what they're migrating from.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:630-632
Timestamp: 2025-05-23T23:58:07.165Z
Learning: The `<NotYetImplemented/>` component in the bootstrap-vue-next documentation automatically renders text indicating "Not Yet Implemented", so additional explanatory text about features not being implemented is redundant when this component is used.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2669
File: apps/docs/src/data/components/table.data.ts:334-336
Timestamp: 2025-04-24T20:35:48.629Z
Learning: The generic type parameter for table items should use the singular form `Item` rather than the plural `Items` to improve readability and follow TypeScript conventions. This change would primarily affect two files: `packages/bootstrap-vue-next/src/types/ComponentProps.ts` and `apps/docs/src/data/components/table.data.ts`.
Learnt from: unstoppablecarl
PR: bootstrap-vue-next/bootstrap-vue-next#2671
File: packages/bootstrap-vue-next/src/components/BToast/_toast.scss:1-3
Timestamp: 2025-04-27T17:30:42.045Z
Learning: In global SCSS files for bootstrap-vue-next, `:deep()` combinator should not be used as it only works in Vue's scoped style blocks. Standard CSS/SCSS selectors should be used instead.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:384-404
Timestamp: 2025-05-28T07:57:19.915Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the activeIndex and activeId watchers are intentionally designed with separation of concerns: activeIndex watcher handles activate-tab event emission and complex validation logic, while activeId watcher is kept simple for synchronization between activeId and activeIndex values only.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:240-261
Timestamp: 2025-05-28T07:01:55.095Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the complex initialization logic with updateInitialActiveIndex and updateInitialActiveId flags is necessary for SSR compatibility. Tab initialization cannot be deferred to mounted lifecycle because tabs must be available for server-side rendering of the initial HTML state.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:425-430
Timestamp: 2025-05-28T07:32:45.658Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the activeIndex synchronization within sortTabs() is necessary and correct. When sorting tabs by DOM position, indices change, so activeIndex must be updated immediately to maintain consistency with activeId. This is not an unwanted side effect but a required consequence of the sorting operation.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2679
File: apps/docs/.vitepress/theme/Layout.vue:0-0
Timestamp: 2025-05-01T23:40:56.146Z
Learning: In bootstrap-vue-next, the `useScrollspy` hook returns an object with a `current` property which is the ID string (or null) of the currently active item, not an object containing an ID.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2762
File: apps/docs/src/docs/components/tooltip.md:0-0
Timestamp: 2025-06-26T19:46:19.333Z
Learning: BTooltip is a very thin wrapper around BPopover in bootstrap-vue-next. There is no separate `useTooltipController` composable - the `usePopoverController` composable can be used to programmatically control both popovers and tooltips.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2425
File: packages/bootstrap-vue-next/src/plugins/popoverController/index.ts:138-140
Timestamp: 2025-04-28T22:48:46.738Z
Learning: In bootstrap-vue-next, `PopoverOrchestratorParam` includes an `id` field of type `ControllerKey` through inheritance from base types. This field is declared in the `BvControllerOptions` interface and propagated through the type hierarchy.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2672
File: packages/bootstrap-vue-next/src/components/BPopover/BPopover.vue:269-277
Timestamp: 2025-04-28T20:33:04.113Z
Learning: In Vue 3.3+, `toRef(() => props.strategy)` creates a reactive readonly ref. This getter-based syntax was introduced in Vue 3.3 as an ergonomic alternative to `computed()` and is the recommended approach for creating refs from props or other reactive sources.
Learnt from: VividLemon
PR: bootstrap-vue-next/bootstrap-vue-next#2691
File: packages/bootstrap-vue-next/src/composables/useBLinkHelper.ts:85-86
Timestamp: 2025-05-26T17:28:35.902Z
Learning: In the `useBLinkTagResolver` function in `packages/bootstrap-vue-next/src/composables/useBLinkHelper.ts`, the `routerComponentName` parameter is required and typed as `MaybeRefOrGetter<string>`, ensuring it cannot be undefined.
🪛 LanguageTool
apps/docs/src/docs/components/form-spinbutton.md
[grammar] ~125-~125: Correctly pair commas and coordinating conjunctions.
Context: ...amount Note that the
repeat-delay,
repeat-thresholdand
repeat-interval` only applies to t...
(QB_NEW_EN_OTHER_ERROR_IDS_000073)
[grammar] ~125-~125: There might be a mistake here.
Context: ...t-thresholdand
repeat-interval` only applies to the ArrowUp or Arrow...
(QB_NEW_EN_OTHER)
[grammar] ~125-~125: Place a period at the end of declarative sentences.
Context: ...rowUp or ArrowDown keys <script setup lang="ts"> import {data} from '../../data/components/formSpinbutton.data' </script>
(QB_NEW_EN_OTHER_ERROR_IDS_000178)
apps/docs/src/docs/migration-guide.md
[grammar] ~54-~54: There might be a mistake here.
Context: ...bind to the indeterminate
property in BFormCheckBox
you v-bind
to the model named `indete...
(QB_NEW_EN_OTHER)
[grammar] ~54-~54: There might be a mistake here.
Context: ...BFormCheckBoxyou
v-bindto the model named
indeterminate` rather than adding...
(QB_NEW_EN_OTHER)
[grammar] ~150-~150: Use proper spacing conventions.
Context: ...GroupMigration.vue ## Component aliases BootstrapVue had a number of component a...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~152-~152: There might be a problem here.
Context: ...rapVue had a number of component aliases — for instance, <b-btn>
was an alias for...
(QB_NEW_EN_MERGED_MATCH)
[grammar] ~152-~152: Use proper spacing conventions.
Context: ...<b-btn>
was an alias for <b-button>
. BootstrapVueNext does not support these ...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~153-~153: Use proper spacing conventions.
Context: ... must use the canonical component names. The table below lists each BootstrapVue ...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~155-~155: Use proper spacing conventions.
Context: ...as and its BootstrapVueNext replacement: | BootstrapVue ...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~348-~348: Use proper spacing conventions.
Context: ...perty of the default slot is deprecated. It is less important in BootstrapVueNext...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~658-~658: Use proper spacing conventions.
Context: ...composable instead. Details in our docs #### BNavbarNav align
prop now takes value...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~730-~730: Use proper spacing conventions.
Context: ...holder*>components.
` is deprecated along with the rest of the...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~730-~730: There might be a mistake here.
Context: ...f the BootstrapVue icon support. See our icon documentation for de...
(QB_NEW_EN_OTHER)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: test-unit
- GitHub Check: build
🔇 Additional comments (1)
apps/docs/src/docs/migration-guide.md (1)
150-186
: Alias table completeness – please verifyGreat addition! A few common aliases from BootstrapVue appear to be missing (e.g.
b-radio
,b-checkbox-group
,b-check-group
,b-dd-header
vs. already listedb-d-dropdown-header
). Double-check that the table is exhaustive so users don’t miss an alias during migration.
Also fix "the the" typos
72f2768
to
ada7591
Compare
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Actionable comments posted: 0
🧹 Nitpick comments (5)
apps/docs/src/docs/components/form-spinbutton.md (1)
125-125
: Clarify wording & punctuation for better readabilityConsider tightening the sentence and adding a final period:
-Note that the `repeat-delay`, `repeat-threshold` and `repeat-interval` only apply to the <kbd>ArrowUp</kbd> or <kbd>ArrowDown</kbd> keys +Note that the `repeat-delay`, `repeat-threshold`, and `repeat-interval` settings apply only to the <kbd>ArrowUp</kbd> and <kbd>ArrowDown</kbd> keys.This introduces the Oxford comma, moves “only” next to the verb it qualifies, switches “or” to “and” (both keys are affected), and terminates the sentence with a period.
apps/docs/src/docs/migration-guide.md (4)
52-55
: Re-phrase “properties … (generally named models)”The parenthetical is confusing because “models” suggests plurality while Vue’s primary model prop is normally singular (
modelValue
). A crisper alternative:-This modifier has been replaced by properties on the model (generally named models). +This modifier is replaced by dedicated model props (typically named `modelValue` or similar).Also,
BFormCheckBox
→BFormCheckbox
(camel-casing matches the actual component).
54-56
: Fix component name & missing articleAdd “to” before “
v-bind
” and correct component name:-For instance, in order to two-way bind to the `indeterminate` property in `BFormCheckBox` you `v-bind` to the model +For instance, to two-way bind the `indeterminate` property in `BFormCheckbox`, you should `v-bind` to the model
150-156
: Provide backlink to legacy alias docs for quicker migrationPer previous guidance, a short link to the BootstrapVue alias reference would help users verify the mapping:
_For the original alias list, see the [BootstrapVue documentation](https://bootstrap-vue.github.io/bootstrap-vue/docs/reference/aliases)._Placing this just after the introductory paragraph offers an immediate reference without cluttering the table.
348-350
: Sharpen wording around deprecated boolean argumentThe phrase “boolean argument to control returning focus … is deprecated” is hard to parse. Suggested tweak:
-The boolean argument to control returning focus to the toggle button on the `hide` scoped property of the default slot is deprecated. +The boolean parameter that previously controlled whether focus returned to the toggle button in the `hide` scoped slot is deprecated.This makes the subject (“boolean parameter”) explicit and reduces nesting.
📜 Review details
Configuration used: CodeRabbit UI
Review profile: CHILL
Plan: Pro
📒 Files selected for processing (4)
apps/docs/src/data/components/tabs.data.ts
(1 hunks)apps/docs/src/docs/components/form-spinbutton.md
(1 hunks)apps/docs/src/docs/migration-guide.md
(6 hunks)apps/docs/src/utils/image-props.ts
(1 hunks)
🚧 Files skipped from review as they are similar to previous changes (2)
- apps/docs/src/utils/image-props.ts
- apps/docs/src/data/components/tabs.data.ts
🧰 Additional context used
🧠 Learnings (2)
📓 Common learnings
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:622-626
Timestamp: 2025-06-05T11:43:10.793Z
Learning: In migration guides, links to the old/previous version's documentation (like bootstrap-vue.org) are appropriate and helpful when explaining deprecated features, as they provide users with reference points for what they're migrating from.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2669
File: apps/docs/src/data/components/table.data.ts:334-336
Timestamp: 2025-04-24T20:35:48.629Z
Learning: The generic type parameter for table items should use the singular form `Item` rather than the plural `Items` to improve readability and follow TypeScript conventions. This change would primarily affect two files: `packages/bootstrap-vue-next/src/types/ComponentProps.ts` and `apps/docs/src/data/components/table.data.ts`.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:630-632
Timestamp: 2025-05-23T23:58:07.165Z
Learning: The `<NotYetImplemented/>` component in the bootstrap-vue-next documentation automatically renders text indicating "Not Yet Implemented", so additional explanatory text about features not being implemented is redundant when this component is used.
apps/docs/src/docs/migration-guide.md (12)
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:622-626
Timestamp: 2025-06-05T11:43:10.793Z
Learning: In migration guides, links to the old/previous version's documentation (like bootstrap-vue.org) are appropriate and helpful when explaining deprecated features, as they provide users with reference points for what they're migrating from.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2701
File: apps/docs/src/docs/migration-guide.md:630-632
Timestamp: 2025-05-23T23:58:07.165Z
Learning: The `<NotYetImplemented/>` component in the bootstrap-vue-next documentation automatically renders text indicating "Not Yet Implemented", so additional explanatory text about features not being implemented is redundant when this component is used.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2669
File: apps/docs/src/data/components/table.data.ts:334-336
Timestamp: 2025-04-24T20:35:48.629Z
Learning: The generic type parameter for table items should use the singular form `Item` rather than the plural `Items` to improve readability and follow TypeScript conventions. This change would primarily affect two files: `packages/bootstrap-vue-next/src/types/ComponentProps.ts` and `apps/docs/src/data/components/table.data.ts`.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:425-430
Timestamp: 2025-05-28T07:32:45.658Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the activeIndex synchronization within sortTabs() is necessary and correct. When sorting tabs by DOM position, indices change, so activeIndex must be updated immediately to maintain consistency with activeId. This is not an unwanted side effect but a required consequence of the sorting operation.
Learnt from: unstoppablecarl
PR: bootstrap-vue-next/bootstrap-vue-next#2671
File: packages/bootstrap-vue-next/src/components/BToast/_toast.scss:1-3
Timestamp: 2025-04-27T17:30:42.045Z
Learning: In global SCSS files for bootstrap-vue-next, `:deep()` combinator should not be used as it only works in Vue's scoped style blocks. Standard CSS/SCSS selectors should be used instead.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:384-404
Timestamp: 2025-05-28T07:57:19.915Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the activeIndex and activeId watchers are intentionally designed with separation of concerns: activeIndex watcher handles activate-tab event emission and complex validation logic, while activeId watcher is kept simple for synchronization between activeId and activeIndex values only.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2716
File: packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue:240-261
Timestamp: 2025-05-28T07:01:55.095Z
Learning: In BTabs component (packages/bootstrap-vue-next/src/components/BTabs/BTabs.vue), the complex initialization logic with updateInitialActiveIndex and updateInitialActiveId flags is necessary for SSR compatibility. Tab initialization cannot be deferred to mounted lifecycle because tabs must be available for server-side rendering of the initial HTML state.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2679
File: apps/docs/.vitepress/theme/Layout.vue:0-0
Timestamp: 2025-05-01T23:40:56.146Z
Learning: In bootstrap-vue-next, the `useScrollspy` hook returns an object with a `current` property which is the ID string (or null) of the currently active item, not an object containing an ID.
Learnt from: dwgray
PR: bootstrap-vue-next/bootstrap-vue-next#2762
File: apps/docs/src/docs/components/tooltip.md:0-0
Timestamp: 2025-06-26T19:46:19.333Z
Learning: BTooltip is a very thin wrapper around BPopover in bootstrap-vue-next. There is no separate `useTooltipController` composable - the `usePopoverController` composable can be used to programmatically control both popovers and tooltips.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2425
File: packages/bootstrap-vue-next/src/plugins/popoverController/index.ts:138-140
Timestamp: 2025-04-28T22:48:46.738Z
Learning: In bootstrap-vue-next, `PopoverOrchestratorParam` includes an `id` field of type `ControllerKey` through inheritance from base types. This field is declared in the `BvControllerOptions` interface and propagated through the type hierarchy.
Learnt from: xvaara
PR: bootstrap-vue-next/bootstrap-vue-next#2672
File: packages/bootstrap-vue-next/src/components/BPopover/BPopover.vue:269-277
Timestamp: 2025-04-28T20:33:04.113Z
Learning: In Vue 3.3+, `toRef(() => props.strategy)` creates a reactive readonly ref. This getter-based syntax was introduced in Vue 3.3 as an ergonomic alternative to `computed()` and is the recommended approach for creating refs from props or other reactive sources.
Learnt from: VividLemon
PR: bootstrap-vue-next/bootstrap-vue-next#2691
File: packages/bootstrap-vue-next/src/composables/useBLinkHelper.ts:85-86
Timestamp: 2025-05-26T17:28:35.902Z
Learning: In the `useBLinkTagResolver` function in `packages/bootstrap-vue-next/src/composables/useBLinkHelper.ts`, the `routerComponentName` parameter is required and typed as `MaybeRefOrGetter<string>`, ensuring it cannot be undefined.
🪛 LanguageTool
apps/docs/src/docs/components/form-spinbutton.md
[grammar] ~125-~125: Correctly pair commas and coordinating conjunctions.
Context: ...amount Note that the
repeat-delay,
repeat-thresholdand
repeat-interval` only apply to the...
(QB_NEW_EN_OTHER_ERROR_IDS_000073)
[grammar] ~125-~125: Place a period at the end of declarative sentences.
Context: ...rowUp or ArrowDown keys <script setup lang="ts"> import {data} from '../../data/components/formSpinbutton.data' </script>
(QB_NEW_EN_OTHER_ERROR_IDS_000178)
apps/docs/src/docs/migration-guide.md
[grammar] ~54-~54: There might be a mistake here.
Context: ...bind to the indeterminate
property in BFormCheckBox
you v-bind
to the model named `indete...
(QB_NEW_EN_OTHER)
[grammar] ~54-~54: There might be a mistake here.
Context: ...BFormCheckBoxyou
v-bindto the model named
indeterminate` rather than adding...
(QB_NEW_EN_OTHER)
[grammar] ~150-~150: Use proper spacing conventions.
Context: ...GroupMigration.vue ## Component aliases BootstrapVue had a number of component a...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~152-~152: There might be a problem here.
Context: ...rapVue had a number of component aliases — for instance, <b-btn>
was an alias for...
(QB_NEW_EN_MERGED_MATCH)
[grammar] ~152-~152: Use proper spacing conventions.
Context: ...<b-btn>
was an alias for <b-button>
. BootstrapVueNext does not support these ...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~153-~153: Use proper spacing conventions.
Context: ... must use the canonical component names. The table below lists each BootstrapVue ...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~155-~155: Use proper spacing conventions.
Context: ...as and its BootstrapVueNext replacement: | BootstrapVue ...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~348-~348: Use proper spacing conventions.
Context: ...perty of the default slot is deprecated. It is less important in BootstrapVueNext...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~658-~658: Use proper spacing conventions.
Context: ...composable instead. Details in our docs #### BNavbarNav align
prop now takes value...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~730-~730: Use proper spacing conventions.
Context: ...holder*>components.
` is deprecated along with the rest of the...
(QB_NEW_EN_OTHER_ERROR_IDS_000007)
[grammar] ~730-~730: There might be a mistake here.
Context: ...f the BootstrapVue icon support. See our icon documentation for de...
(QB_NEW_EN_OTHER)
⏰ Context from checks skipped due to timeout of 90000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: build
Perhaps we should just export them instead of discontinuing them? What do you think |
In my opinion we should not, not having them means:
But having them also has advantages:
We could also argue that anyone can declare those component aliases themselves if they need to. |
But we do support binput as an alias. And I think one other. Thats the only one though |
But I do agree. One unified api is my prefered |
Should this alias be removed ? Or at least not documented (if it is currently) ? |
@@ -147,6 +147,43 @@ user supplied string, but the BootstrapVueNext library isn't adding an extra lay | |||
|
|||
<<< DEMO ./demo/RadioGroupMigration.vue | |||
|
|||
## Component aliases | |||
|
|||
BootstrapVue had a number of component aliases — for instance, `<b-btn>` was an alias for `<b-button>`. |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Thanks for addressing this @homersimpsons! A couple of thoughts:
Shouldn't we point folks to the option of adding their own aliases to the unplugin-vue resolver if they so choose? And assuming we intend to continue to support that option.
Also, I'm not quite sure how I would do this, but we're trying to keep the names in the docs and samples to the preferred Vue 3 naming conventions (e.g. BButton
rather than b-button
). Maybe make the BSVN column use that convention and note the kebab syntax is still supported (since a newbie might get confused between the idea of aliasing and Vue's support for different naming conventions).
Describe the PR
Add section in migration guide about removal of component aliases.
Also fix "the the" typos (I can extract this in another pull request if necessary).
Note that I built (manually) the list of aliases from BootstrapVue's documentation, but maybe some of them do not exist on BootstrapVueNext.
Small replication
NA
PR checklist
What kind of change does this PR introduce? (check at least one)
fix(...)
feat(...)
fix(...)
docs(...)
The PR fulfills these requirements:
CHANGELOG
is generated from these messages, and determines the next version type. Pull requests that do not follow conventional commits or do not have an override will be deniedSummary by CodeRabbit