la pagina principal

 export class GdwcHeading extends LitElement { static get properties() { return { /** * Heading size */ size: { type: String }, /** * Heading level */ level: { type: String }, }; } render() { const styles = { fontSize: `var(${this.size})` }; const style = styleMap(styles); this.size = { fontSize: `var(${this.size})` }; this.sanitizeLevel(); return html` <${unsafeStatic(this.sanitizeLevel(this.level))} style=${style}><slot></slot></${unsafeStatic( this.sanitizeLevel(this.level) )}> `; } sanitizeLevel(level) { switch (this.level) { case `h1`: this.level = 'h1'; break; case `h3`: this.level = 'h3'; break; case `h4`: this.level = 'h4'; break; case `h5`: this.level = 'h5'; break; case `h6`: this.level = 'h6'; break; default: this.level = 'h2'; break; } return level; } }

la página de la historia

 import { html } from 'lit'; import { ifDefined } from 'lit/directives/if-defined.js'; import { controls, themeControls } from '../stories/fixtures/controls.js'; import '../heading.js'; import '../store.js'; import '../provider.js'; import '../stories/components/gdwc-theme.js'; export default { title: 'Elements/Heading', component: 'Heading', description: 'A simple heading component', parameters: { docs: { description: { component: 'A generic heading', }, }, }, argTypes: { defaultSlot: { table: { category: 'slots', }, }, size: { options: controls.sizes.options, control: controls.sizes.control, description: controls.sizes.description, table: { category: 'properties', }, }, level: { options: controls.headingLevels.options, control: controls.headingLevels.control, description: controls.headingLevels.description, table: { category: 'properties', }, }, ...themeControls, }, }; const Template = args => { const { size, defaultSlot, level } = args; return html` <gdwc-theme args=${JSON.stringify(args)}> <gdwc-heading ${ifDefined(size)} ${ifDefined(level)} >${defaultSlot}</gdwc-heading > </gdwc-theme>`; }; export const Primary = Template.bind({}); Primary.args = { defaultSlot: 'My Custom Heading', };

Por aquí, ifDefined debería representar la variable de nivel. pero se mantiene con el nivel 'h2' en la función sanitizeLevel es que cualquier problema en la función de nivel de desinfección. Por favor, intenta ayudarme con esto. Cualquier referencia a la función ifDefined es https://lit.dev/docs/templates/directives/#ifdefined