Skip to content

docs(BToast): Parity #2887

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.

Sign up for GitHub

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

Merged
VividLemon merged 5 commits into from
Oct 26, 2025
Merged

docs(BToast): Parity #2887

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
5 commits
Select commit Hold shift + click to select a range
1e4b584
docs(BToast): parity pass
dwgray Oct 24, 2025
8734d86
docs(BToast): Fill out component data
dwgray Oct 24, 2025
75351dd
docs(BAlert): consolidate emits for toast and alert
dwgray Oct 24, 2025
fe52e73
docs(BToast): changes based on code review
dwgray Oct 24, 2025
53b76f1
docs: move okay and cancel into showHide emits to match the code
dwgray Oct 24, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
84 changes: 15 additions & 69 deletions apps/docs/src/data/components/alert.data.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -7,7 +7,7 @@ import {
type SlotRecord,
} from '../../types'
import {linkedBLinkSection, type linkProps} from '../../utils/linkProps'
import {showHideEmits, showHideProps} from '../../utils/showHideData'
import {buildDismissibleEmits, showHideProps} from '../../utils/showHideData'
import {buildCommonProps} from '../../utils/commonProps'
import {omit, pick} from '../../utils/objectUtils'

Expand All @@ -19,85 +19,42 @@ export default {
[defaultPropSectionSymbol]: {
...omit(showHideProps, ['modelValue']),
...pick(buildCommonProps(), [
'bgVariant',
'body',
'bodyClass',
'closeClass',
'closeContent',
'closeLabel',
'closeVariant',
'headerClass',
'headerTag',
'id',
'title',
'variant',
'interval',
'isStatus',
'noHoverPause',
'noResumeOnHoverLeave',
'progressProps',
'showOnPause',
'textVariant',
'title',
'variant',
]),
alertClass: {
type: 'ClassValue',
default: undefined,
description: 'CSS class (or classes) to add to the alert wrapper element',
},
bgVariant: {
type: 'ColorVariant | null',
default: null,
// description: 'Background color variant for the alert' // TODO missing description
}, // TODO prop inconsistency ColorVariant | null (matches ColorExtendables, not directly in BAlertProps, but valid via inheritance)
closeClass: {
type: 'ClassValue',
default: undefined,
description: 'Applies one or more custom classes to the close button',
},
closeContent: {
type: 'string',
default: undefined,
description: 'Sets the text of the close button. The `close` slot takes precedence',
},
closeLabel: {
type: 'string',
default: 'Close',
description: 'Sets the aria-label attribute on the close button',
},
closeVariant: {
type: 'string | null',
default: null,
description: 'Color variant for the close button', // TODO prop inconsistency string | null (BAlertProps expects ButtonVariant | null)
},
dismissible: {
type: 'boolean',
default: false,
description: 'When set, enables the close button',
},
interval: {
type: 'number | requestAnimationFrame',
default: 'requestAnimationFrame',
description: 'The interval in milliseconds to update the countdown timer',
},
isStatus: {
type: 'boolean',
default: false,
description:
"When set to 'true', makes the alert have attributes aria-live=polite and role=status. When 'false' aria-live will be 'assertive' and role will be 'alert'",
},
modelValue: {
type: 'boolean | number',
default: false,
description:
'Controls the visibility of the alert. A `boolean` value directly controls the visibility. A number starts the countdown timer',
},
progressProps: {
type: "Omit<BProgressBarProps, 'label' | 'max' | 'value'>",
default: undefined,
description:
'The properties to define the progress bar in the alert. No progress will be shown if left undefined',
},
showOnPause: {
type: 'boolean',
default: true,
description:
'Setting this property to `false` will override the behavior of showing the Alert when the timer is paused',
},
textVariant: {
type: 'TextColorVariant | null',
default: null,
// description: 'Text color variant for the alert' // TODO missing description
}, // TODO prop inconsistency TextColorVariant | null (matches ColorExtendables, not directly in BAlertProps, but valid via inheritance)
} satisfies PropRecord<Exclude<keyof BAlertProps, keyof typeof linkProps>>,
'BLink props': linkedBLinkSection,
},
Expand All @@ -114,10 +71,7 @@ export default {
},
} satisfies SlotRecord<keyof BAlertSlots>,
emits: {
...showHideEmits,
'close': {
description: 'Emitted when the alert begins its transition to close',
},
...buildDismissibleEmits(),
'close-countdown': {
description: 'Emitted during the countdown with the time remaining',
args: {
Expand All @@ -128,22 +82,14 @@ export default {
},
},
'update:model-value': {
description: 'Standard event to update the v-model', // TODO similar content to BAccordion/update:model-value (similar description phrasing)
description: 'Standard event to update the v-model',
args: {
'update:model-value': {
description: 'modelValue',
type: 'boolean | number',
},
},
},
'cancel': {
args: undefined,
description: undefined,
},
'ok': {
args: undefined,
description: undefined,
},
} satisfies EmitRecord<keyof BAlertEmits | 'update:model-value'>,
},
}),
Expand Down
8 changes: 0 additions & 8 deletions apps/docs/src/data/components/collapse.data.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -72,14 +72,6 @@ export default {
},
},
},
'cancel': {
args: undefined,
description: undefined,
},
'ok': {
args: undefined,
description: undefined,
},
} satisfies EmitRecord<keyof BCollapseEmits | 'update:model-value'>,
slots: {
default: {
Expand Down
8 changes: 0 additions & 8 deletions apps/docs/src/data/components/offcanvas.data.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -166,14 +166,6 @@ export default {
args: undefined,
description: undefined,
},
'cancel': {
args: undefined,
description: undefined,
},
'ok': {
args: undefined,
description: undefined,
},
} satisfies EmitRecord<keyof BOffcanvasEmits | 'update:model-value'>,
slots: {
'title': {
Expand Down
167 changes: 97 additions & 70 deletions apps/docs/src/data/components/toast.data.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,7 @@ import {
import {omit, pick} from '../../utils/objectUtils'
import {buildCommonProps} from '../../utils/commonProps'
import {linkedBLinkSection, type linkProps} from '../../utils/linkProps'
import {showHideEmits, showHideProps} from '../../utils/showHideData'
import {buildDismissibleEmits, showHideProps} from '../../utils/showHideData'

export default {
load: (): ComponentReference => ({
Expand All @@ -21,48 +21,24 @@ export default {
'bgVariant',
'body',
'bodyClass',
'closeClass',
'closeContent',
'closeLabel',
'closeVariant',
'headerClass',
'headerTag',
'id',
'interval',
'isStatus',
'noHoverPause',
'noResumeOnHoverLeave',
'progressProps',
'showOnPause',
'textVariant',
'title',
'variant',
]),

closeClass: {
type: 'ClassValue',
default: undefined,
description: 'Sets the CSS class(es) for the close button.',
},
closeContent: {
type: 'string',
default: undefined,
description: 'Sets the text for the close button. The `close` slot takes precedence.',
},
closeLabel: {
type: 'string',
default: 'Close',
description: 'Sets the `aria-label` attribute for the close button.',
},
closeVariant: {
type: 'string | null',
default: null,
description: 'Sets the color variant for the close button.',
},

interval: {
type: 'number | requestAnimationFrame',
default: 'requestAnimationFrame',
description: 'Sets the interval for refreshing the countdown timer.',
},
isStatus: {
type: 'boolean',
default: false,
description:
'Sets `aria-live="polite"` and `role="status"` when `true`; otherwise, `aria-live="assertive"` and `role="alert"`.',
},
modelValue: {
type: 'boolean | number',
default: false,
Expand All @@ -79,23 +55,11 @@ export default {
default: false,
description: 'Hides the progress bar in the toast.',
},
progressProps: {
type: "Omit<BProgressBarProps, 'label' | 'max' | 'value'>",
default: undefined,
description:
'Configures the progress bar in the toast. No progress bar is shown if undefined.',
},
showOnPause: {
type: 'boolean',
default: true,
description: 'Keeps the toast visible when paused.',
},
solid: {
type: 'boolean',
default: false,
description: 'Renders the toast with a solid background instead of a translucent one.',
},

toastClass: {
type: 'ClassValue',
default: undefined,
Expand All @@ -105,44 +69,107 @@ export default {
'BLink props': linkedBLinkSection,
},
emits: {
...showHideEmits,
...buildDismissibleEmits(),
'update:model-value': {
description: 'Emitted when the toast visibility changes.', // TODO similar content to BAlert/update:model-value (similar purpose)
description: 'Emitted when the toast visibility or countdown duration changes.',
args: {
value: {
type: 'Boolean',
description: 'The new visibility state of the toast.',
type: 'boolean | number',
description:
'The new visibility state (boolean) or countdown duration in milliseconds (number). When boolean: true = visible, false = hidden. When number: > 0 = countdown duration, 0 = countdown finished.',
},
},
},
'close': {
description: 'Emitted when the close button is clicked.', // TODO missing description in original
args: {
value: {
type: 'BvTriggerableEvent',
description: '', // TODO missing description
} satisfies EmitRecord<keyof BToastEmits | 'update:model-value'>,
slots: {
default: {
description: 'Content to place in the toast body',
scope: {
id: {
type: 'string',
description: 'The toast component ID',
},
show: {
type: '() => void',
description: 'Function to show the toast',
},
hide: {
type: '(trigger?: string, noTriggerEmit?: boolean) => void',
description: 'Function to hide the toast',
},
toggle: {
type: '() => void',
description: 'Function to toggle toast visibility',
},
active: {
type: 'boolean',
description: 'Whether the countdown timer is active',
},
visible: {
type: 'boolean',
description: 'Current visibility state of the toast',
},
},
},
'close-countdown': {
description: 'Emitted during the countdown to auto-dismiss.', // TODO missing description in original
args: {
value: {
type: 'number',
description: '', // TODO missing description
title: {
description: 'Content to place in the toast header as title',
scope: {
id: {
type: 'string',
description: 'The toast component ID',
},
show: {
type: '() => void',
description: 'Function to show the toast',
},
hide: {
type: '(trigger?: string, noTriggerEmit?: boolean) => void',
description: 'Function to hide the toast',
},
toggle: {
type: '() => void',
description: 'Function to toggle toast visibility',
},
active: {
type: 'boolean',
description: 'Whether the countdown timer is active',
},
visible: {
type: 'boolean',
description: 'Current visibility state of the toast',
},
},
},
'cancel': {
args: undefined,
description: undefined,
},
'ok': {
args: undefined,
description: undefined,
close: {
description: 'Content to place in the close button',
scope: {
id: {
type: 'string',
description: 'The toast component ID',
},
show: {
type: '() => void',
description: 'Function to show the toast',
},
hide: {
type: '(trigger?: string, noTriggerEmit?: boolean) => void',
description: 'Function to hide the toast',
},
toggle: {
type: '() => void',
description: 'Function to toggle toast visibility',
},
active: {
type: 'boolean',
description: 'Whether the countdown timer is active',
},
visible: {
type: 'boolean',
description: 'Current visibility state of the toast',
},
},
},
} satisfies EmitRecord<keyof BToastEmits | 'update:model-value'>,
slots: {},
},
},
}),
}
Loading
Loading