diff --git a/packages/components/src/components.d.ts b/packages/components/src/components.d.ts index 582f7e367c..1d29e5c336 100644 --- a/packages/components/src/components.d.ts +++ b/packages/components/src/components.d.ts @@ -1272,6 +1272,10 @@ export namespace Components { * Heading level with value 'h4' on default */ "level": Props.BalHeadingLevel; + /** + * Make the visual style mimic a specific heading level. This option allows you to make e.g. h1 visually look like h3, but still keep it h1 in the markup. + */ + "visualLevel"?: Props.BalHeadingLevel; } interface BalLogo { /** @@ -4884,6 +4888,10 @@ declare namespace LocalJSX { * Heading level with value 'h4' on default */ "level"?: Props.BalHeadingLevel; + /** + * Make the visual style mimic a specific heading level. This option allows you to make e.g. h1 visually look like h3, but still keep it h1 in the markup. + */ + "visualLevel"?: Props.BalHeadingLevel; } interface BalLogo { /** diff --git a/packages/components/src/components/bal-list/bal-list-item-title/bal-list-item-title.tsx b/packages/components/src/components/bal-list/bal-list-item-title/bal-list-item-title.tsx index 36f61709ad..6dc8bdf8c9 100644 --- a/packages/components/src/components/bal-list/bal-list-item-title/bal-list-item-title.tsx +++ b/packages/components/src/components/bal-list/bal-list-item-title/bal-list-item-title.tsx @@ -12,10 +12,17 @@ export class ListItemTitle { */ @Prop() level: Props.BalHeadingLevel = 'h5' + /** + * Make the visual style mimic a specific heading level. + * This option allows you to make e.g. h1 visually look like h3, + * but still keep it h1 in the markup. + */ + @Prop() visualLevel?: Props.BalHeadingLevel + render() { return ( - +