@govbr-ds/webcomponents 2.0.0-next.17 → 2.0.0-next.19

package/dist/collection/components/list/list.js

@@ -1,3 +1,7 @@
+/*!
+ * Construído com @govbr-ds/webcomponents
+ * Padrão Digital de Governo.
+ */
 import { Host, h } from "@stencil/core";
 import { inheritAriaAttributes } from "../../utils/inherited-attributes";
 /**
@@ -11,20 +15,16 @@ export class List {
         this.inheritedAttributes = {};
         this.renderHeader = () => {
             var _a;
-            if (((_a = this.listTitle) === null || _a === void 0 ? void 0 : _a.length) > 0 || this.hasSlotContent('header')) {
-                return (h("div", { class: "header" }, this.listTitle && h("div", { class: "title" }, this.listTitle), this.hasSlotContent('header') && (h("div", { class: "d-flex" }, h("slot", { name: "header" })))));
+            if (((_a = this.header) === null || _a === void 0 ? void 0 : _a.length) > 0 || this.hasSlotContent('header')) {
+                return (h("div", { class: "header" }, this.header && h("div", { class: "title" }, this.header), this.hasSlotContent('header') && (h("div", { class: "d-flex" }, h("slot", { name: "header" })))));
             }
             return null;
         };
-        this.listTitle = undefined;
+        this.header = undefined;
         this.isHorizontal = false;
         this.hideHeaderDivider = false;
     }
-    connectedCallback() {
-        this.brDidConnect.emit();
-    }
     componentWillLoad() {
-        this.brWillLoad.emit();
         this.inheritedAttributes = inheritAriaAttributes(this.el);
     }
     componentDidLoad() {
@@ -43,37 +43,6 @@ export class List {
         items.forEach((item) => {
             item.setAttribute('role', 'listitem');
         });
-        this.brDidLoad.emit();
-    }
-    componentWillRender() {
-        this.brWillRender.emit();
-    }
-    componentDidRender() {
-        this.brDidRender.emit();
-    }
-    componentShouldUpdate() {
-        this.brShouldUpdate.emit();
-    }
-    componentWillUpdate() {
-        this.brWillUpdate.emit();
-    }
-    componentDidUpdate() {
-        this.brDidUpdate.emit();
-    }
-    disconnectedCallback() {
-        this.brDidDisconnect.emit();
-    }
-    formAssociatedCallback(form) {
-        this.brFormAssociatedCallback.emit(form);
-    }
-    formDisabledCallback(disabled) {
-        this.brFormDisabledCallback.emit(disabled);
-    }
-    formResetCallback() {
-        this.brFormResetCallback.emit();
-    }
-    formStateRestoreCallback(state, _mode) {
-        this.brFormStateRestoreCallback.emit([state, _mode]);
     }
     getCssClassMap() {
         return {
@@ -85,13 +54,13 @@ export class List {
         return this.el.querySelector(`[slot="${slotName}"]`) !== null;
     }
     renderDivider() {
-        if ((this.listTitle || this.hasSlotContent('header')) && !this.hideHeaderDivider) {
+        if ((this.header || this.hasSlotContent('header')) && !this.hideHeaderDivider) {
             return h("div", { class: "br-divider" });
         }
         return null;
     }
     render() {
-        return (h(Host, { key: 'bf56fd2ff3f57265a05521c8447630106f261fd9' }, h("div", Object.assign({ key: '710c166b13c9e02eb167bcfb4bfddc044469b85b', class: this.getCssClassMap() }, this.inheritedAttributes, { role: "list" }), this.renderHeader(), this.renderDivider(), h("slot", { key: 'b41329f3ecd8cd06df7c186d52ea08e42679e31f' }))));
+        return (h(Host, { key: '278e1c81fca5d8789ee8d6c2bf8dfac723135246' }, h("div", Object.assign({ key: '2772b9ef20bb4537f2de28395261b2eb273dd396', class: this.getCssClassMap() }, this.inheritedAttributes, { role: "list" }), this.renderHeader(), this.renderDivider(), h("slot", { key: '5fe5afdd6081641872b63d9a9a9a5909e72d6f0b' }))));
     }
     static get is() { return "br-list"; }
     static get encapsulation() { return "shadow"; }
@@ -108,7 +77,7 @@ export class List {
     }
     static get properties() {
         return {
-            "listTitle": {
+            "header": {
                 "type": "string",
                 "mutable": false,
                 "complexType": {
@@ -120,9 +89,9 @@ export class List {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Define o t\u00EDtulo para a lista."
+                    "text": "Define o cabe\u00E7alho para a lista."
                 },
-                "attribute": "list-title",
+                "attribute": "header",
                 "reflect": true
             },
             "isHorizontal": {
@@ -163,221 +132,6 @@ export class List {
             }
         };
     }
-    static get events() {
-        return [{
-                "method": "brDidConnect",
-                "name": "brDidConnect",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emite um evento quando o componente \u00E9 conectado ao DOM.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/component-lifecycle#connectedcallback) para mais detalhes."
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "brWillLoad",
-                "name": "brWillLoad",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emite um evento antes que o componente seja carregado pela primeira vez.\nUtilize este evento para realizar tarefas de inicializa\u00E7\u00E3o antes do componente ser exibido.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillload) para mais detalhes."
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "brDidLoad",
-                "name": "brDidLoad",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emite um evento ap\u00F3s o componente ter sido carregado pela primeira vez.\nUtilize este evento para realizar a\u00E7\u00F5es que devem ocorrer depois que o componente foi totalmente carregado.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes."
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "brWillRender",
-                "name": "brWillRender",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emite um evento antes do componente ser renderizado.\nUtilize este evento para preparar o componente antes de sua renderiza\u00E7\u00E3o.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillrender) para mais detalhes."
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "brDidRender",
-                "name": "brDidRender",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emite um evento ap\u00F3s o componente ter sido renderizado.\nUtilize este evento para executar a\u00E7\u00F5es que devem ocorrer ap\u00F3s a renderiza\u00E7\u00E3o do componente.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidrender) para mais detalhes."
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "brShouldUpdate",
-                "name": "brShouldUpdate",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emite um evento para indicar se o componente deve ser atualizado ou n\u00E3o.\nEste evento \u00E9 chamado antes de qualquer atualiza\u00E7\u00E3o do componente para decidir se a atualiza\u00E7\u00E3o deve prosseguir.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentshouldupdate) para mais detalhes."
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "brWillUpdate",
-                "name": "brWillUpdate",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emite um evento antes de o componente ser atualizado.\nUtilize este evento para realizar a\u00E7\u00F5es preparat\u00F3rias antes da atualiza\u00E7\u00E3o do componente.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillupdate) para mais detalhes."
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "brDidUpdate",
-                "name": "brDidUpdate",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emite um evento ap\u00F3s o componente ter sido atualizado.\nUtilize este evento para realizar a\u00E7\u00F5es ap\u00F3s a atualiza\u00E7\u00E3o do componente.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidupdate) para mais detalhes."
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "brDidDisconnect",
-                "name": "brDidDisconnect",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emite um evento quando o componente \u00E9 desconectado do DOM.\nUtilize este evento para realizar a limpeza ou outras a\u00E7\u00F5es necess\u00E1rias quando o componente \u00E9 removido.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/component-lifecycle#disconnectedcallback) para mais detalhes."
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "brFormAssociatedCallback",
-                "name": "brFormAssociatedCallback",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [{
-                            "name": "param",
-                            "text": "form - Dados do formul\u00E1rio associado."
-                        }],
-                    "text": "Emite um evento quando o componente \u00E9 associado ou removido de um `<form>`.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/form-associated#formassociatedcallback) para mais detalhes."
-                },
-                "complexType": {
-                    "original": "FormData",
-                    "resolved": "FormData",
-                    "references": {
-                        "FormData": {
-                            "location": "global",
-                            "id": "global::FormData"
-                        }
-                    }
-                }
-            }, {
-                "method": "brFormDisabledCallback",
-                "name": "brFormDisabledCallback",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [{
-                            "name": "param",
-                            "text": "disabled - Novo estado `disabled` do componente dentro do formul\u00E1rio."
-                        }],
-                    "text": "Emite um evento quando o estado `disabled` do componente muda dentro de um `<form>`.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/form-associated#formdisabledcallback) para mais informa\u00E7\u00F5es."
-                },
-                "complexType": {
-                    "original": "boolean",
-                    "resolved": "boolean",
-                    "references": {}
-                }
-            }, {
-                "method": "brFormResetCallback",
-                "name": "brFormResetCallback",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [],
-                    "text": "Emite um evento quando um `<form>` \u00E9 resetado.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/form-associated#formresetcallback) para mais detalhes."
-                },
-                "complexType": {
-                    "original": "void",
-                    "resolved": "void",
-                    "references": {}
-                }
-            }, {
-                "method": "brFormStateRestoreCallback",
-                "name": "brFormStateRestoreCallback",
-                "bubbles": true,
-                "cancelable": true,
-                "composed": true,
-                "docs": {
-                    "tags": [{
-                            "name": "param",
-                            "text": "state - Estado restaurado do formul\u00E1rio."
-                        }, {
-                            "name": "param",
-                            "text": "_mode - Modo de preenchimento autom\u00E1tico do navegador."
-                        }],
-                    "text": "Emite um evento quando o navegador preenche automaticamente os campos de um `<form>`.\nConsulte a documenta\u00E7\u00E3o do [Stencil](https://stenciljs.com/docs/form-associated#formstaterestorecallback) para mais informa\u00E7\u00F5es."
-                },
-                "complexType": {
-                    "original": "[state: string, _mode: string]",
-                    "resolved": "[state: string, _mode: string]",
-                    "references": {}
-                }
-            }];
-    }
     static get elementRef() { return "el"; }
     static get attachInternalsMemberName() { return "elementInternals"; }
 }

package/dist/collection/components/list/list.js.map

@@ -1 +1 @@
-{"version":3,"file":"list.js","sourceRoot":"","sources":["../../../src/components/list/list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { AttachInternals, Component, Element, Event, EventEmitter, Host, Prop, h } from '@stencil/core'\nimport { Attributes, inheritAriaAttributes } from '../../utils/inherited-attributes'\nimport { CssClassMap } from '../../utils/interfaces'\n\n/**\n * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/list?tab=designer).\n *\n * @slot default - Slot padrão para inclusão dos itens da lista.\n * @slot header - Slot nomeado para inclusão de ações relacionadas ao cabeçalho do list (uso de botões por exemplo).\n */\n@Component({\n  tag: 'br-list',\n  styleUrl: 'list.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class List {\n  /**\n   * Referência ao elemento host do componente.\n   * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.\n   */\n  @Element() el: HTMLBrListElement\n\n  @AttachInternals() elementInternals: ElementInternals\n\n  /**\n   * Define o título para a lista.\n   */\n  @Prop({ reflect: true }) listTitle: string\n\n  /**\n   * Indica se a lista será horizontal. Por padrão, a lista é vertical.\n   */\n  @Prop({ reflect: true }) isHorizontal: boolean = false\n\n  /**\n   * Indica que o divider para o título da lista estará oculto.\n   */\n  @Prop({ reflect: true }) hideHeaderDivider: boolean = false\n\n  /**\n   * Emite um evento quando o componente é conectado ao DOM.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#connectedcallback) para mais detalhes.\n   */\n  @Event() brDidConnect: EventEmitter<void>\n  connectedCallback() {\n    this.brDidConnect.emit()\n  }\n\n  /**\n   * Emite um evento antes que o componente seja carregado pela primeira vez.\n   * Utilize este evento para realizar tarefas de inicialização antes do componente ser exibido.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillload) para mais detalhes.\n   */\n  @Event() brWillLoad: EventEmitter<void>\n  componentWillLoad() {\n    this.brWillLoad.emit()\n    this.inheritedAttributes = inheritAriaAttributes(this.el)\n  }\n\n  /**\n   * Emite um evento após o componente ter sido carregado pela primeira vez.\n   * Utilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.\n   */\n  @Event() brDidLoad: EventEmitter<void>\n  componentDidLoad() {\n    if (this.isHorizontal) {\n      const slotItems = Array.from(this.el.querySelectorAll('br-item'))\n\n      slotItems.forEach((item) => {\n        const nextElement = item.nextElementSibling\n        if (nextElement?.classList.contains('br-divider')) {\n          const divider = nextElement as HTMLElement\n          divider.style.borderWidth = '0 1px 0 0'\n          divider.style.width = '1px'\n        }\n      })\n    }\n\n    const items = Array.from(this.el.querySelectorAll('br-item'))\n    items.forEach((item) => {\n      item.setAttribute('role', 'listitem')\n    })\n\n    this.brDidLoad.emit()\n  }\n\n  /**\n   * Emite um evento antes do componente ser renderizado.\n   * Utilize este evento para preparar o componente antes de sua renderização.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillrender) para mais detalhes.\n   */\n  @Event() brWillRender: EventEmitter<void>\n  componentWillRender() {\n    this.brWillRender.emit()\n  }\n\n  /**\n   * Emite um evento após o componente ter sido renderizado.\n   * Utilize este evento para executar ações que devem ocorrer após a renderização do componente.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidrender) para mais detalhes.\n   */\n  @Event() brDidRender: EventEmitter<void>\n  componentDidRender() {\n    this.brDidRender.emit()\n  }\n\n  /**\n   * Emite um evento para indicar se o componente deve ser atualizado ou não.\n   * Este evento é chamado antes de qualquer atualização do componente para decidir se a atualização deve prosseguir.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentshouldupdate) para mais detalhes.\n   */\n  @Event() brShouldUpdate: EventEmitter<void>\n  componentShouldUpdate() {\n    this.brShouldUpdate.emit()\n  }\n\n  /**\n   * Emite um evento antes de o componente ser atualizado.\n   * Utilize este evento para realizar ações preparatórias antes da atualização do componente.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillupdate) para mais detalhes.\n   */\n  @Event() brWillUpdate: EventEmitter<void>\n  componentWillUpdate() {\n    this.brWillUpdate.emit()\n  }\n\n  /**\n   * Emite um evento após o componente ter sido atualizado.\n   * Utilize este evento para realizar ações após a atualização do componente.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidupdate) para mais detalhes.\n   */\n  @Event() brDidUpdate: EventEmitter<void>\n  componentDidUpdate() {\n    this.brDidUpdate.emit()\n  }\n\n  /**\n   * Emite um evento quando o componente é desconectado do DOM.\n   * Utilize este evento para realizar a limpeza ou outras ações necessárias quando o componente é removido.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#disconnectedcallback) para mais detalhes.\n   */\n  @Event() brDidDisconnect: EventEmitter<void>\n  disconnectedCallback() {\n    this.brDidDisconnect.emit()\n  }\n\n  /**\n   * Emite um evento quando o componente é associado ou removido de um `<form>`.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formassociatedcallback) para mais detalhes.\n   *\n   * @param form - Dados do formulário associado.\n   */\n  @Event() brFormAssociatedCallback: EventEmitter<FormData>\n  formAssociatedCallback(form: FormData) {\n    this.brFormAssociatedCallback.emit(form)\n  }\n\n  /**\n   * Emite um evento quando o estado `disabled` do componente muda dentro de um `<form>`.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formdisabledcallback) para mais informações.\n   *\n   * @param disabled - Novo estado `disabled` do componente dentro do formulário.\n   */\n  @Event() brFormDisabledCallback: EventEmitter<boolean>\n  formDisabledCallback(disabled: boolean) {\n    this.brFormDisabledCallback.emit(disabled)\n  }\n\n  /**\n   * Emite um evento quando um `<form>` é resetado.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formresetcallback) para mais detalhes.\n   */\n  @Event() brFormResetCallback: EventEmitter<void>\n  formResetCallback() {\n    this.brFormResetCallback.emit()\n  }\n\n  /**\n   * Emite um evento quando o navegador preenche automaticamente os campos de um `<form>`.\n   * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formstaterestorecallback) para mais informações.\n   *\n   * @param state - Estado restaurado do formulário.\n   * @param _mode - Modo de preenchimento automático do navegador.\n   */\n  @Event() brFormStateRestoreCallback: EventEmitter<[state: string, _mode: string]>\n  formStateRestoreCallback(state: string, _mode: string) {\n    this.brFormStateRestoreCallback.emit([state, _mode])\n  }\n\n  private getCssClassMap(): CssClassMap {\n    return {\n      'br-list': true,\n      horizontal: this.isHorizontal,\n    }\n  }\n\n  private inheritedAttributes: Attributes = {}\n\n  private hasSlotContent(slotName: string): boolean {\n    return this.el.querySelector(`[slot=\"${slotName}\"]`) !== null\n  }\n  private readonly renderHeader = () => {\n    if (this.listTitle?.length > 0 || this.hasSlotContent('header')) {\n      return (\n        <div class=\"header\">\n          {this.listTitle && <div class=\"title\">{this.listTitle}</div>}\n          {this.hasSlotContent('header') && (\n            <div class=\"d-flex\">\n              <slot name=\"header\"></slot>\n            </div>\n          )}\n        </div>\n      )\n    }\n    return null\n  }\n\n  private renderDivider() {\n    if ((this.listTitle || this.hasSlotContent('header')) && !this.hideHeaderDivider) {\n      return <div class=\"br-divider\"></div>\n    }\n    return null\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={this.getCssClassMap()} {...this.inheritedAttributes} role=\"list\">\n          {this.renderHeader()}\n          {this.renderDivider()}\n          <slot></slot>\n        </div>\n      </Host>\n    )\n  }\n}\n"]}
+{"version":3,"file":"list.js","sourceRoot":"","sources":["../../../../src/components/list/list.tsx"],"names":[],"mappings":"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","sourcesContent":["import { AttachInternals, Component, Element, Host, Prop, h } from '@stencil/core'\nimport { Attributes, inheritAriaAttributes } from '../../utils/inherited-attributes'\nimport { CssClassMap } from '../../utils/interfaces'\n\n/**\n * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/list?tab=designer).\n *\n * @slot default - Slot padrão para inclusão dos itens da lista.\n * @slot header - Slot nomeado para inclusão de ações relacionadas ao cabeçalho do list (uso de botões por exemplo).\n */\n@Component({\n  tag: 'br-list',\n  styleUrl: 'list.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class List {\n  /**\n   * Referência ao elemento host do componente.\n   * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.\n   */\n  @Element() el: HTMLBrListElement\n\n  @AttachInternals() elementInternals: ElementInternals\n\n  /**\n   * Define o cabeçalho para a lista.\n   */\n  @Prop({ reflect: true }) header: string\n\n  /**\n   * Indica se a lista será horizontal. Por padrão, a lista é vertical.\n   */\n  @Prop({ reflect: true }) isHorizontal: boolean = false\n\n  /**\n   * Indica que o divider para o título da lista estará oculto.\n   */\n  @Prop({ reflect: true }) hideHeaderDivider: boolean = false\n\n  componentWillLoad() {\n    this.inheritedAttributes = inheritAriaAttributes(this.el)\n  }\n\n  componentDidLoad() {\n    if (this.isHorizontal) {\n      const slotItems = Array.from(this.el.querySelectorAll('br-item'))\n\n      slotItems.forEach((item) => {\n        const nextElement = item.nextElementSibling\n        if (nextElement?.classList.contains('br-divider')) {\n          const divider = nextElement as HTMLElement\n          divider.style.borderWidth = '0 1px 0 0'\n          divider.style.width = '1px'\n        }\n      })\n    }\n\n    const items = Array.from(this.el.querySelectorAll('br-item'))\n    items.forEach((item) => {\n      item.setAttribute('role', 'listitem')\n    })\n  }\n\n  private getCssClassMap(): CssClassMap {\n    return {\n      'br-list': true,\n      horizontal: this.isHorizontal,\n    }\n  }\n\n  private inheritedAttributes: Attributes = {}\n\n  private hasSlotContent(slotName: string): boolean {\n    return this.el.querySelector(`[slot=\"${slotName}\"]`) !== null\n  }\n  private readonly renderHeader = () => {\n    if (this.header?.length > 0 || this.hasSlotContent('header')) {\n      return (\n        <div class=\"header\">\n          {this.header && <div class=\"title\">{this.header}</div>}\n          {this.hasSlotContent('header') && (\n            <div class=\"d-flex\">\n              <slot name=\"header\"></slot>\n            </div>\n          )}\n        </div>\n      )\n    }\n    return null\n  }\n\n  private renderDivider() {\n    if ((this.header || this.hasSlotContent('header')) && !this.hideHeaderDivider) {\n      return <div class=\"br-divider\"></div>\n    }\n    return null\n  }\n\n  render() {\n    return (\n      <Host>\n        <div class={this.getCssClassMap()} {...this.inheritedAttributes} role=\"list\">\n          {this.renderHeader()}\n          {this.renderDivider()}\n          <slot></slot>\n        </div>\n      </Host>\n    )\n  }\n}\n"]}

package/dist/collection/components/loading/loading.css

@@ -215,10 +215,18 @@ textarea {
   margin-right: var(--spacing-scale-base) !important;
 }
 
+.mr-n2 {
+  margin-right: calc(var(--spacing-scale-base) * -1) !important;
+}
+
 .mb-3 {
   margin-bottom: var(--spacing-scale-2x) !important;
 }
 
+.mr-auto {
+  margin-right: auto !important;
+}
+
 .pt-half {
   padding-top: var(--spacing-scale-half) !important;
 }
@@ -351,6 +359,10 @@ textarea,
   color: var(--pure-0) !important;
 }
 
+.text-primary-default {
+  color: var(--color-primary-default) !important;
+}
+
 .bg-support-01 {
   --color: var(--color-dark);
   --color-rgb: var(--color-dark-rgb);
@@ -551,13 +563,6 @@ textarea,
   animation: fill ease-in-out 2s;
   transform: rotate(9deg);
 }
-.loading[data-progress="8"] .br-loading-mask.full,
-.loading[data-progress="8"] .br-loading-fill,
-.br-loading[data-progress="8"] .br-loading-mask.full,
-.br-loading[data-progress="8"] .br-loading-fill {
-  animation: fill ease-in-out 2s;
-  transform: rotate(14.4deg);
-}
 .loading[data-progress="10"] .br-loading-mask.full,
 .loading[data-progress="10"] .br-loading-fill,
 .br-loading[data-progress="10"] .br-loading-mask.full,
@@ -586,20 +591,6 @@ textarea,
   animation: fill ease-in-out 2s;
   transform: rotate(43.2deg);
 }
-.loading[data-progress="32"] .br-loading-mask.full,
-.loading[data-progress="32"] .br-loading-fill,
-.br-loading[data-progress="32"] .br-loading-mask.full,
-.br-loading[data-progress="32"] .br-loading-fill {
-  animation: fill ease-in-out 2s;
-  transform: rotate(57.6deg);
-}
-.loading[data-progress="40"] .br-loading-mask.full,
-.loading[data-progress="40"] .br-loading-fill,
-.br-loading[data-progress="40"] .br-loading-mask.full,
-.br-loading[data-progress="40"] .br-loading-fill {
-  animation: fill ease-in-out 2s;
-  transform: rotate(72deg);
-}
 .loading[data-progress="48"] .br-loading-mask.full,
 .loading[data-progress="48"] .br-loading-fill,
 .br-loading[data-progress="48"] .br-loading-mask.full,
@@ -628,20 +619,6 @@ textarea,
   animation: fill ease-in-out 2s;
   transform: rotate(129.6deg);
 }
-.loading[data-progress="80"] .br-loading-mask.full,
-.loading[data-progress="80"] .br-loading-fill,
-.br-loading[data-progress="80"] .br-loading-mask.full,
-.br-loading[data-progress="80"] .br-loading-fill {
-  animation: fill ease-in-out 2s;
-  transform: rotate(144deg);
-}
-.loading[data-progress="88"] .br-loading-mask.full,
-.loading[data-progress="88"] .br-loading-fill,
-.br-loading[data-progress="88"] .br-loading-mask.full,
-.br-loading[data-progress="88"] .br-loading-fill {
-  animation: fill ease-in-out 2s;
-  transform: rotate(158.4deg);
-}
 .loading[data-progress="100"] .br-loading-mask.full,
 .loading[data-progress="100"] .br-loading-fill,
 .br-loading[data-progress="100"] .br-loading-mask.full,