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

package/dist/collection/components/switch/switch.js

@@ -1,3 +1,7 @@
+/*!
+ * Construído com @govbr-ds/webcomponents
+ * Padrão Digital de Governo.
+ */
 import { Host, h } from "@stencil/core";
 import { v4 as uuidv4 } from "uuid";
 import { inheritAriaAttributes } from "../../utils/inherited-attributes";
@@ -8,11 +12,6 @@ import { inheritAriaAttributes } from "../../utils/inherited-attributes";
  */
 export class Switch {
     constructor() {
-        /**
-         * Identificador único do campo de entrada.
-         * Caso não seja fornecido, um ID gerado automaticamente será usado.
-         */
-        this._idDefault = `br-switch-${uuidv4()}`;
         this.handleCheckedChange = (event) => {
             this._checkedValue = event.target.checked;
             this.brDidCheckedChange.emit(this._checkedValue);
@@ -20,60 +19,23 @@ export class Switch {
         this.inheritedAttributes = {};
         this.disabled = false;
         this.checked = false;
-        this.customId = undefined;
+        this.customId = `br-input-${uuidv4()}`;
         this.label = undefined;
         this.labelPosition = 'left';
-        this.labelOn = null;
-        this.labelOff = null;
+        this.labelOn = undefined;
+        this.labelOff = undefined;
         this.hasIcon = false;
         this.name = undefined;
         this.value = undefined;
-        this.density = null;
+        this.density = 'medium';
         this._slotDefault = false;
         this._checkedValue = undefined;
     }
-    connectedCallback() {
-        this.brDidConnect.emit();
-    }
     componentWillLoad() {
         this._hasSlotContentDefault();
         this._checkedValue = this.checked;
-        this.brWillLoad.emit();
         this.inheritedAttributes = inheritAriaAttributes(this.el);
     }
-    componentDidLoad() {
-        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]);
-    }
     _hasSlotContentDefault() {
         this._slotDefault = this.el.innerHTML !== '';
     }
@@ -84,10 +46,6 @@ export class Switch {
         this._checkedValue = !this._checkedValue;
         this.brDidCheckedChange.emit(this._checkedValue);
     }
-    _getComputedId() {
-        var _a;
-        return ((_a = this.customId) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.customId : this._idDefault;
-    }
     getCssClassMap() {
         return {
             'br-switch': true,
@@ -99,7 +57,7 @@ export class Switch {
         };
     }
     render() {
-        return (h(Host, { key: 'd2cc950b9044ce062e96f3b1dd9eda0829d02b9e' }, h("div", Object.assign({ key: '8783b57e8133cb0f53354cf48eee863123c4197b', class: this.getCssClassMap() }, this.inheritedAttributes), h("input", { key: '396d817ecc1dca472abb3e95fe5869f266047dcc', id: this._getComputedId(), type: "checkbox", name: this.name, checked: this._checkedValue, disabled: this.disabled, role: "switch", "aria-checked": this._checkedValue.toString(), "aria-disabled": this.disabled ? 'true' : null, onChange: this.handleCheckedChange }), h("label", { key: 'b0c4dff57a94c2661859b18a9e55ee8a77d541a6', htmlFor: this._getComputedId() }, this._slotDefault ? h("slot", null) : this.label), this.labelOn && this.labelOff && (h("div", { key: '18f77feda3016dcd4c645cedd943312dcaa0db1a', class: "switch-data", "data-enabled": this.labelOn, "data-disabled": this.labelOff })))));
+        return (h(Host, { key: '52838e1fe630318fe34af78b47a42781646f291c' }, h("div", Object.assign({ key: 'bc2c656294f72bee0d9778791ab9a6b00cea7c9e', class: this.getCssClassMap() }, this.inheritedAttributes), h("input", { key: '8ac78e3880ce376faa5e224d0fdab9602104e9ef', id: this.customId, type: "checkbox", name: this.name, checked: this._checkedValue, disabled: this.disabled, role: "switch", "aria-checked": this._checkedValue.toString(), "aria-disabled": this.disabled ? 'true' : null, onChange: this.handleCheckedChange }), h("label", { key: '4e85a4b6d51059a4a899dc24bb7a3f181e99db25', htmlFor: this.customId }, this._slotDefault ? h("slot", null) : this.label), this.labelOn && this.labelOff && (h("div", { key: '30b401aed4ede6e5159240b8337d429d6a7f8aff', class: "switch-data", "data-enabled": this.labelOn, "data-disabled": this.labelOff })))));
     }
     static get is() { return "br-switch"; }
     static get encapsulation() { return "shadow"; }
@@ -164,10 +122,11 @@ export class Switch {
                 "optional": false,
                 "docs": {
                     "tags": [],
-                    "text": "Especifica o ID do componente, que \u00E9 usado para conectar o label correspondente ao checkbox.\nSe n\u00E3o for fornecido, o ID ser\u00E1 o mesmo valor atribu\u00EDdo \u00E0 propriedade `name`."
+                    "text": "Identificador \u00FAnico do switch.\nCaso n\u00E3o seja fornecido, um ID gerado automaticamente ser\u00E1 usado."
                 },
                 "attribute": "id",
-                "reflect": true
+                "reflect": true,
+                "defaultValue": "`br-input-${uuidv4()}`"
             },
             "label": {
                 "type": "string",
@@ -219,8 +178,7 @@ export class Switch {
                     "text": "Texto exibido quando o switch est\u00E1 ativado."
                 },
                 "attribute": "label-on",
-                "reflect": true,
-                "defaultValue": "null"
+                "reflect": true
             },
             "labelOff": {
                 "type": "string",
@@ -237,8 +195,7 @@ export class Switch {
                     "text": "Texto exibido quando o switch est\u00E1 desativado."
                 },
                 "attribute": "label-off",
-                "reflect": true,
-                "defaultValue": "null"
+                "reflect": true
             },
             "hasIcon": {
                 "type": "boolean",
@@ -308,7 +265,7 @@ export class Switch {
                 },
                 "attribute": "density",
                 "reflect": true,
-                "defaultValue": "null"
+                "defaultValue": "'medium'"
             }
         };
     }
@@ -320,218 +277,6 @@ export class Switch {
     }
     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": {}
-                }
-            }, {
                 "method": "brDidCheckedChange",
                 "name": "brDidCheckedChange",
                 "bubbles": true,

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

@@ -1 +1 @@
-{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../../src/components/switch/switch.tsx"],"names":[],"mappings":"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","sourcesContent":["import { AttachInternals, Component, Element, Event, EventEmitter, Host, Method, Prop, State, h } from '@stencil/core'\nimport { v4 as uuidv4 } from 'uuid'\nimport { Attributes, inheritAriaAttributes } from '../../utils/inherited-attributes'\nimport { CssClassMap } from '../../utils/interfaces'\n/**\n *  Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/switch?tab=designer).\n *\n * @slot default - Descreve o que o switch faz quando a alternância estiver ativada. A label passada por slot tem precedência sobre a propriedade 'label'.\n */\n@Component({\n  tag: 'br-switch',\n  styleUrl: 'switch.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class Switch {\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: HTMLBrSwitchElement\n\n  @AttachInternals() elementInternals: ElementInternals\n\n  /**\n   * Identificador único do campo de entrada.\n   * Caso não seja fornecido, um ID gerado automaticamente será usado.\n   */\n  private readonly _idDefault = `br-switch-${uuidv4()}`\n\n  /**\n   * Desativa o switch, tornando-o não interativo.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false\n\n  /**\n   * Define o estado de seleção do checkbox.\n   * Se definido como verdadeiro, o checkbox estará marcado. Caso contrário, estará desmarcado.\n   */\n  @Prop({ reflect: true }) checked: boolean = false\n\n  /**\n   * Especifica o ID do componente, que é usado para conectar o label correspondente ao checkbox.\n   * Se não for fornecido, o ID será o mesmo valor atribuído à propriedade `name`.\n   */\n  @Prop({ reflect: true, attribute: 'id' }) customId: string\n\n  /**\n   * Texto descritivo.\n   * Caso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado.\n   */\n  @Prop() label: string\n\n  /**\n   * Posição do rótulo em relação ao switch.\n   */\n  @Prop({ reflect: true }) labelPosition: 'right' | 'left' | 'top' = 'left'\n\n  /**\n   * Texto exibido quando o switch está ativado.\n   */\n  @Prop({ reflect: true }) labelOn: string = null\n\n  /**\n   * Texto exibido quando o switch está desativado.\n   */\n  @Prop({ reflect: true }) labelOff: string = null\n\n  /**\n   * Adiciona um ícone ao switch para indicar a mudança de estado.\n   */\n  @Prop({ reflect: true }) hasIcon: boolean = false\n\n  /**\n   * Define o nome do switch, que é utilizado para agrupar switches em formulários e identificar o campo.\n   * O valor é obrigatório e deve ser fornecido para garantir o correto funcionamento em formulários.\n   */\n  @Prop({ reflect: true }) name: string\n\n  /**\n   * Define o valor associado ao switch quando ele faz parte de um formulário nativo (`<form>`).\n   * Esse valor é enviado com o formulário quando o switch está selecionado.\n   * **Nota:** Esta propriedade não deve ser utilizada para determinar se o switch está selecionado; para verificar o estado de seleção, use a propriedade `checked`.\n   */\n  @Prop({ reflect: true }) value: string\n\n  /** O ajuste da densidade consiste em aumentar ou reduzir a área de interação do switch. Quanto menor for a densidade, maior a área de interação. */\n  @Prop({ reflect: true }) density: 'large' | 'medium' | 'small' = null\n\n  // Propriedade interna para verificar a presença de conteúdo no slot default\n  @State() _slotDefault: boolean = false\n\n  @State() _checkedValue: boolean\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._hasSlotContentDefault()\n    this._checkedValue = this.checked\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    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  /**\n   * Disparado depois que o valor do `checked` foi alterado\n   */\n  @Event() brDidCheckedChange: EventEmitter<boolean>\n\n  private _hasSlotContentDefault(): any {\n    this._slotDefault = this.el.innerHTML !== ''\n  }\n\n  private readonly handleCheckedChange = (event: Event) => {\n    this._checkedValue = (event.target as HTMLInputElement).checked\n    this.brDidCheckedChange.emit(this._checkedValue)\n  }\n\n  /**\n   * Inverte o valor da prop `checked`\n   */\n  @Method()\n  async toggleChecked() {\n    this._checkedValue = !this._checkedValue\n    this.brDidCheckedChange.emit(this._checkedValue)\n  }\n\n  private _getComputedId(): string {\n    return this.customId?.length > 0 ? this.customId : this._idDefault\n  }\n\n  private getCssClassMap(): CssClassMap {\n    return {\n      'br-switch': true,\n      icon: this.hasIcon,\n      top: this.labelPosition === 'top',\n      right: this.labelPosition === 'right',\n      large: this.density === 'large',\n      small: this.density === 'small',\n    }\n  }\n\n  private inheritedAttributes: Attributes = {}\n\n  render() {\n    return (\n      <Host>\n        <div class={this.getCssClassMap()} {...this.inheritedAttributes}>\n          <input\n            id={this._getComputedId()}\n            type=\"checkbox\"\n            name={this.name}\n            checked={this._checkedValue}\n            disabled={this.disabled}\n            role=\"switch\"\n            aria-checked={this._checkedValue.toString()}\n            aria-disabled={this.disabled ? 'true' : null}\n            onChange={this.handleCheckedChange}\n          />\n          <label htmlFor={this._getComputedId()}>{this._slotDefault ? <slot></slot> : this.label}</label>\n          {this.labelOn && this.labelOff && (\n            <div class=\"switch-data\" data-enabled={this.labelOn} data-disabled={this.labelOff}></div>\n          )}\n        </div>\n      </Host>\n    )\n  }\n}\n"]}
+{"version":3,"file":"switch.js","sourceRoot":"","sources":["../../../../src/components/switch/switch.tsx"],"names":[],"mappings":"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","sourcesContent":["import { AttachInternals, Component, Element, Event, EventEmitter, Host, Method, Prop, State, h } from '@stencil/core'\nimport { v4 as uuidv4 } from 'uuid'\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/switch?tab=designer).\n *\n * @slot default - Descreve o que o switch faz quando a alternância estiver ativada. A label passada por slot tem precedência sobre a propriedade 'label'.\n */\n@Component({\n  tag: 'br-switch',\n  styleUrl: 'switch.scss',\n  shadow: true,\n  formAssociated: true,\n})\nexport class Switch {\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: HTMLBrSwitchElement\n\n  @AttachInternals() elementInternals: ElementInternals\n\n  /**\n   * Desativa o switch, tornando-o não interativo.\n   */\n  @Prop({ reflect: true }) disabled: boolean = false\n\n  /**\n   * Define o estado de seleção do checkbox.\n   * Se definido como verdadeiro, o checkbox estará marcado. Caso contrário, estará desmarcado.\n   */\n  @Prop({ reflect: true }) checked: boolean = false\n\n  /**\n   * Identificador único do switch.\n   * Caso não seja fornecido, um ID gerado automaticamente será usado.\n   */\n  @Prop({ reflect: true, attribute: 'id' }) customId: string = `br-input-${uuidv4()}`\n\n  /**\n   * Texto descritivo.\n   * Caso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado.\n   */\n  @Prop() label: string\n\n  /**\n   * Posição do rótulo em relação ao switch.\n   */\n  @Prop({ reflect: true }) labelPosition: 'right' | 'left' | 'top' = 'left'\n\n  /**\n   * Texto exibido quando o switch está ativado.\n   */\n  @Prop({ reflect: true }) labelOn: string\n\n  /**\n   * Texto exibido quando o switch está desativado.\n   */\n  @Prop({ reflect: true }) labelOff: string\n\n  /**\n   * Adiciona um ícone ao switch para indicar a mudança de estado.\n   */\n  @Prop({ reflect: true }) hasIcon: boolean = false\n\n  /**\n   * Define o nome do switch, que é utilizado para agrupar switches em formulários e identificar o campo.\n   * O valor é obrigatório e deve ser fornecido para garantir o correto funcionamento em formulários.\n   */\n  @Prop({ reflect: true }) name: string\n\n  /**\n   * Define o valor associado ao switch quando ele faz parte de um formulário nativo (`<form>`).\n   * Esse valor é enviado com o formulário quando o switch está selecionado.\n   * **Nota:** Esta propriedade não deve ser utilizada para determinar se o switch está selecionado; para verificar o estado de seleção, use a propriedade `checked`.\n   */\n  @Prop({ reflect: true }) value: string\n\n  /** O ajuste da densidade consiste em aumentar ou reduzir a área de interação do switch. Quanto menor for a densidade, maior a área de interação. */\n  @Prop({ reflect: true }) density: 'large' | 'medium' | 'small' = 'medium'\n\n  // Propriedade interna para verificar a presença de conteúdo no slot default\n  @State() _slotDefault: boolean = false\n\n  @State() _checkedValue: boolean\n\n  componentWillLoad() {\n    this._hasSlotContentDefault()\n    this._checkedValue = this.checked\n    this.inheritedAttributes = inheritAriaAttributes(this.el)\n  }\n\n  /**\n   * Disparado depois que o valor do `checked` foi alterado\n   */\n  @Event() brDidCheckedChange: EventEmitter<boolean>\n  private _hasSlotContentDefault(): any {\n    this._slotDefault = this.el.innerHTML !== ''\n  }\n\n  private readonly handleCheckedChange = (event: Event) => {\n    this._checkedValue = (event.target as HTMLInputElement).checked\n    this.brDidCheckedChange.emit(this._checkedValue)\n  }\n\n  /**\n   * Inverte o valor da prop `checked`\n   */\n  @Method()\n  async toggleChecked() {\n    this._checkedValue = !this._checkedValue\n    this.brDidCheckedChange.emit(this._checkedValue)\n  }\n\n  private getCssClassMap(): CssClassMap {\n    return {\n      'br-switch': true,\n      icon: this.hasIcon,\n      top: this.labelPosition === 'top',\n      right: this.labelPosition === 'right',\n      large: this.density === 'large',\n      small: this.density === 'small',\n    }\n  }\n\n  private inheritedAttributes: Attributes = {}\n\n  render() {\n    return (\n      <Host>\n        <div class={this.getCssClassMap()} {...this.inheritedAttributes}>\n          <input\n            id={this.customId}\n            type=\"checkbox\"\n            name={this.name}\n            checked={this._checkedValue}\n            disabled={this.disabled}\n            role=\"switch\"\n            aria-checked={this._checkedValue.toString()}\n            aria-disabled={this.disabled ? 'true' : null}\n            onChange={this.handleCheckedChange}\n          />\n          <label htmlFor={this.customId}>{this._slotDefault ? <slot></slot> : this.label}</label>\n          {this.labelOn && this.labelOff && (\n            <div class=\"switch-data\" data-enabled={this.labelOn} data-disabled={this.labelOff}></div>\n          )}\n        </div>\n      </Host>\n    )\n  }\n}\n"]}

package/dist/collection/components/textarea/textarea.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);