@govbr-ds/webcomponents 2.0.0-next.14 → 2.0.0-next.15
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/br-avatar.cjs.entry.js +1 -1
- package/dist/cjs/br-avatar.cjs.entry.js.map +1 -1
- package/dist/cjs/br-button_2.cjs.entry.js +2 -2
- package/dist/cjs/br-button_2.cjs.entry.js.map +1 -1
- package/dist/cjs/br-checkbox.cjs.entry.js +1 -1
- package/dist/cjs/br-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/br-dropdown.cjs.entry.js +1 -1
- package/dist/cjs/br-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/br-input.cjs.entry.js +1 -1
- package/dist/cjs/br-input.cjs.entry.js.map +1 -1
- package/dist/cjs/br-item.cjs.entry.js +2 -2
- package/dist/cjs/br-item.cjs.entry.js.map +1 -1
- package/dist/cjs/br-list.cjs.entry.js +1 -1
- package/dist/cjs/br-list.cjs.entry.js.map +1 -1
- package/dist/cjs/br-loading.cjs.entry.js +2 -2
- package/dist/cjs/br-loading.cjs.entry.js.map +1 -1
- package/dist/cjs/br-message.cjs.entry.js +2 -2
- package/dist/cjs/br-message.cjs.entry.js.map +1 -1
- package/dist/cjs/br-radio.cjs.entry.js +1 -1
- package/dist/cjs/br-radio.cjs.entry.js.map +1 -1
- package/dist/cjs/br-switch.cjs.entry.js +2 -2
- package/dist/cjs/br-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/br-textarea.cjs.entry.js +158 -0
- package/dist/cjs/br-textarea.cjs.entry.js.map +1 -0
- package/dist/cjs/index-fb4e9eaf.js +4 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/webcomponents.cjs.js +1 -1
- package/dist/collection/collection-manifest.json +2 -1
- package/dist/collection/components/avatar/avatar.css +54 -1
- package/dist/collection/components/button/button.css +61 -1
- package/dist/collection/components/checkbox/checkbox.css +54 -1
- package/dist/collection/components/dropdown/dropdown.css +54 -1
- package/dist/collection/components/icon/icon.css +54 -1
- package/dist/collection/components/input/input.css +54 -1
- package/dist/collection/components/item/item.css +54 -1
- package/dist/collection/components/item/item.js +1 -1
- package/dist/collection/components/item/item.js.map +1 -1
- package/dist/collection/components/list/list.css +54 -1
- package/dist/collection/components/loading/loading.css +61 -1
- package/dist/collection/components/loading/loading.js +1 -1
- package/dist/collection/components/loading/loading.js.map +1 -1
- package/dist/collection/components/message/message.css +54 -1
- package/dist/collection/components/message/message.js +1 -1
- package/dist/collection/components/message/message.js.map +1 -1
- package/dist/collection/components/radio/radio.css +54 -1
- package/dist/collection/components/switch/switch.css +54 -1
- package/dist/collection/components/switch/switch.js +1 -1
- package/dist/collection/components/switch/switch.js.map +1 -1
- package/dist/collection/components/textarea/textarea.css +522 -0
- package/dist/collection/components/textarea/textarea.js +566 -0
- package/dist/collection/components/textarea/textarea.js.map +1 -0
- package/dist/collection/pages/textarea/textarea.js +19 -0
- package/dist/collection/scripts/menu.js +21 -17
- package/dist/components/br-avatar.js +2 -2
- package/dist/components/br-avatar.js.map +1 -1
- package/dist/components/br-button.js +1 -1
- package/dist/components/br-checkbox.js +1 -1
- package/dist/components/br-checkbox.js.map +1 -1
- package/dist/components/br-dropdown.js +1 -1
- package/dist/components/br-dropdown.js.map +1 -1
- package/dist/components/br-icon.js +1 -1
- package/dist/components/br-input.js +3 -3
- package/dist/components/br-input.js.map +1 -1
- package/dist/components/br-item.js +2 -2
- package/dist/components/br-item.js.map +1 -1
- package/dist/components/br-list.js +1 -1
- package/dist/components/br-list.js.map +1 -1
- package/dist/components/br-loading.js +2 -2
- package/dist/components/br-loading.js.map +1 -1
- package/dist/components/br-message.js +4 -4
- package/dist/components/br-message.js.map +1 -1
- package/dist/components/br-radio.js +1 -1
- package/dist/components/br-radio.js.map +1 -1
- package/dist/components/br-switch.js +2 -2
- package/dist/components/br-switch.js.map +1 -1
- package/dist/components/br-textarea.d.ts +11 -0
- package/dist/components/br-textarea.js +181 -0
- package/dist/components/br-textarea.js.map +1 -0
- package/dist/components/index.d.ts +2 -0
- package/dist/components/index.js +1 -0
- package/dist/components/index.js.map +1 -1
- package/dist/components/{p-87afe26f.js → p-af0dfebc.js} +2 -2
- package/dist/components/{p-87afe26f.js.map → p-af0dfebc.js.map} +1 -1
- package/dist/components/p-baa2948a.js +138 -0
- package/dist/components/{p-5769e796.js.map → p-baa2948a.js.map} +1 -1
- package/dist/esm/br-avatar.entry.js +1 -1
- package/dist/esm/br-avatar.entry.js.map +1 -1
- package/dist/esm/br-button_2.entry.js +2 -2
- package/dist/esm/br-button_2.entry.js.map +1 -1
- package/dist/esm/br-checkbox.entry.js +1 -1
- package/dist/esm/br-checkbox.entry.js.map +1 -1
- package/dist/esm/br-dropdown.entry.js +1 -1
- package/dist/esm/br-dropdown.entry.js.map +1 -1
- package/dist/esm/br-input.entry.js +1 -1
- package/dist/esm/br-input.entry.js.map +1 -1
- package/dist/esm/br-item.entry.js +2 -2
- package/dist/esm/br-item.entry.js.map +1 -1
- package/dist/esm/br-list.entry.js +1 -1
- package/dist/esm/br-list.entry.js.map +1 -1
- package/dist/esm/br-loading.entry.js +2 -2
- package/dist/esm/br-loading.entry.js.map +1 -1
- package/dist/esm/br-message.entry.js +2 -2
- package/dist/esm/br-message.entry.js.map +1 -1
- package/dist/esm/br-radio.entry.js +1 -1
- package/dist/esm/br-radio.entry.js.map +1 -1
- package/dist/esm/br-switch.entry.js +2 -2
- package/dist/esm/br-switch.entry.js.map +1 -1
- package/dist/esm/br-textarea.entry.js +154 -0
- package/dist/esm/br-textarea.entry.js.map +1 -0
- package/dist/esm/index-c7037515.js +4 -0
- package/dist/esm/loader.js +1 -1
- package/dist/esm/webcomponents.js +1 -1
- package/dist/types/components/textarea/textarea.d.ts +157 -0
- package/dist/types/components.d.ts +189 -0
- package/dist/webcomponents/p-0f8df882.entry.js +2 -0
- package/dist/webcomponents/{p-14f1c8e6.entry.js.map → p-0f8df882.entry.js.map} +1 -1
- package/dist/webcomponents/p-128b4b58.entry.js +2 -0
- package/dist/webcomponents/{p-9dbe247e.entry.js.map → p-128b4b58.entry.js.map} +1 -1
- package/dist/webcomponents/p-2bc17aba.entry.js +2 -0
- package/dist/webcomponents/p-2bc17aba.entry.js.map +1 -0
- package/dist/webcomponents/p-2ff6ee7a.entry.js +13 -0
- package/dist/webcomponents/{p-dde91d20.entry.js.map → p-2ff6ee7a.entry.js.map} +1 -1
- package/dist/webcomponents/p-4645bc22.entry.js +2 -0
- package/dist/webcomponents/p-4645bc22.entry.js.map +1 -0
- package/dist/webcomponents/p-4e1a6b1e.entry.js +2 -0
- package/dist/webcomponents/{p-8efc22a3.entry.js.map → p-4e1a6b1e.entry.js.map} +1 -1
- package/dist/webcomponents/p-53a18892.entry.js +2 -0
- package/dist/webcomponents/{p-c36696c6.entry.js.map → p-53a18892.entry.js.map} +1 -1
- package/dist/webcomponents/p-6783eb4f.entry.js +2 -0
- package/dist/webcomponents/{p-ac16ee58.entry.js.map → p-6783eb4f.entry.js.map} +1 -1
- package/dist/webcomponents/p-e1d4a515.entry.js +2 -0
- package/dist/webcomponents/p-e1d4a515.entry.js.map +1 -0
- package/dist/webcomponents/p-e74737f9.entry.js +2 -0
- package/dist/webcomponents/p-e74737f9.entry.js.map +1 -0
- package/dist/webcomponents/p-f66d6a1e.entry.js +2 -0
- package/dist/webcomponents/p-f66d6a1e.entry.js.map +1 -0
- package/dist/webcomponents/p-ffbd85fd.entry.js +2 -0
- package/dist/webcomponents/p-ffbd85fd.entry.js.map +1 -0
- package/dist/webcomponents/webcomponents.esm.js +1 -1
- package/dist/webcomponents/webcomponents.esm.js.map +1 -1
- package/hydrate/index.js +196 -22
- package/hydrate/index.mjs +196 -22
- package/package.json +1 -1
- package/vscode-data.json +49 -0
- package/dist/components/p-5769e796.js +0 -138
- package/dist/webcomponents/p-0f6e2ddc.entry.js +0 -2
- package/dist/webcomponents/p-0f6e2ddc.entry.js.map +0 -1
- package/dist/webcomponents/p-14f1c8e6.entry.js +0 -2
- package/dist/webcomponents/p-198082b6.entry.js +0 -2
- package/dist/webcomponents/p-198082b6.entry.js.map +0 -1
- package/dist/webcomponents/p-867bba23.entry.js +0 -2
- package/dist/webcomponents/p-867bba23.entry.js.map +0 -1
- package/dist/webcomponents/p-8efc22a3.entry.js +0 -2
- package/dist/webcomponents/p-9dbe247e.entry.js +0 -2
- package/dist/webcomponents/p-a5a079d8.entry.js +0 -2
- package/dist/webcomponents/p-a5a079d8.entry.js.map +0 -1
- package/dist/webcomponents/p-ac16ee58.entry.js +0 -2
- package/dist/webcomponents/p-c36696c6.entry.js +0 -2
- package/dist/webcomponents/p-dde91d20.entry.js +0 -13
- package/dist/webcomponents/p-f01f1e6b.entry.js +0 -2
- package/dist/webcomponents/p-f01f1e6b.entry.js.map +0 -1
|
@@ -0,0 +1,157 @@
|
|
|
1
|
+
import { EventEmitter } from '../../stencil-public-runtime';
|
|
2
|
+
/**
|
|
3
|
+
* Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/textarea?tab=designer).
|
|
4
|
+
*
|
|
5
|
+
* @slot default - Espaço de conteúdo do textarea. Geralmente usado para incluir texto adicional ou instruções para o usuário.
|
|
6
|
+
*/
|
|
7
|
+
export declare class Textarea {
|
|
8
|
+
el: HTMLElement;
|
|
9
|
+
/**
|
|
10
|
+
* Valor atual do textarea. Este valor pode ser alterado programaticamente.
|
|
11
|
+
*/
|
|
12
|
+
value: string;
|
|
13
|
+
/**
|
|
14
|
+
* Texto do rótulo associado ao textarea. Este rótulo é exibido acima do campo de entrada.
|
|
15
|
+
*/
|
|
16
|
+
label: string;
|
|
17
|
+
/**
|
|
18
|
+
* Texto exibido quando o textarea está vazio. Ajuda a guiar o usuário sobre o que deve ser inserido.
|
|
19
|
+
*/
|
|
20
|
+
placeholder: string;
|
|
21
|
+
/**
|
|
22
|
+
* Indica se o textarea está desabilitado. Quando verdadeiro, o usuário não pode interagir com o campo.
|
|
23
|
+
*/
|
|
24
|
+
disabled: boolean;
|
|
25
|
+
/**
|
|
26
|
+
* Número máximo de caracteres permitidos no textarea. Se definido como 0, não há limite.
|
|
27
|
+
*/
|
|
28
|
+
maxlength: number;
|
|
29
|
+
/**
|
|
30
|
+
* Define o estado visual do componente, podendo ser 'danger', 'success' ou 'warning'.
|
|
31
|
+
*/
|
|
32
|
+
states: string;
|
|
33
|
+
/**
|
|
34
|
+
* Ajusta a densidade do componente, podendo ser 'small', 'medium' ou 'large'.
|
|
35
|
+
*/
|
|
36
|
+
density: string;
|
|
37
|
+
/**
|
|
38
|
+
* Ativa o modo escuro para o componente. Quando verdadeiro, o componente será exibido em um tema escuro.
|
|
39
|
+
*/
|
|
40
|
+
isDarkMode: boolean;
|
|
41
|
+
/**
|
|
42
|
+
* Define se o rótulo deve ser exibido à esquerda do textarea. Quando verdadeiro, o rótulo é posicionado à esquerda.
|
|
43
|
+
*/
|
|
44
|
+
isLabelLeft: boolean;
|
|
45
|
+
/**
|
|
46
|
+
* Comprimento atual do texto no textarea. É atualizado sempre que o valor do textarea muda.
|
|
47
|
+
*/
|
|
48
|
+
currentLength: number;
|
|
49
|
+
elementInternals: ElementInternals;
|
|
50
|
+
/**
|
|
51
|
+
* Identificador único do textarea, gerado automaticamente.
|
|
52
|
+
* Este ID é utilizado para associar o textarea a outros elementos, como rótulos,
|
|
53
|
+
* e garantir que cada instância do componente tenha um identificador distinto.
|
|
54
|
+
*/
|
|
55
|
+
defaultId: string;
|
|
56
|
+
/**
|
|
57
|
+
* Emite um evento quando o componente é conectado ao DOM.
|
|
58
|
+
* Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#connectedcallback) para mais detalhes.
|
|
59
|
+
*/
|
|
60
|
+
brDidConnect: EventEmitter<void>;
|
|
61
|
+
connectedCallback(): void;
|
|
62
|
+
/**
|
|
63
|
+
* Emite um evento antes que o componente seja carregado pela primeira vez.
|
|
64
|
+
* Utilize este evento para realizar tarefas de inicialização antes do componente ser exibido.
|
|
65
|
+
* Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillload) para mais detalhes.
|
|
66
|
+
*/
|
|
67
|
+
brWillLoad: EventEmitter<void>;
|
|
68
|
+
componentWillLoad(): void;
|
|
69
|
+
/**
|
|
70
|
+
* Emite um evento após o componente ter sido carregado pela primeira vez.
|
|
71
|
+
* Utilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado.
|
|
72
|
+
* Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.
|
|
73
|
+
*/
|
|
74
|
+
brDidLoad: EventEmitter<void>;
|
|
75
|
+
componentDidLoad(): void;
|
|
76
|
+
/**
|
|
77
|
+
* Emite um evento antes do componente ser renderizado.
|
|
78
|
+
* Utilize este evento para preparar o componente antes de sua renderização.
|
|
79
|
+
* Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillrender) para mais detalhes.
|
|
80
|
+
*/
|
|
81
|
+
brWillRender: EventEmitter<void>;
|
|
82
|
+
componentWillRender(): void;
|
|
83
|
+
/**
|
|
84
|
+
* Emite um evento após o componente ter sido renderizado.
|
|
85
|
+
* Utilize este evento para executar ações que devem ocorrer após a renderização do componente.
|
|
86
|
+
* Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidrender) para mais detalhes.
|
|
87
|
+
*/
|
|
88
|
+
brDidRender: EventEmitter<void>;
|
|
89
|
+
componentDidRender(): void;
|
|
90
|
+
/**
|
|
91
|
+
* Emite um evento para indicar se o componente deve ser atualizado ou não.
|
|
92
|
+
* Este evento é chamado antes de qualquer atualização do componente para decidir se a atualização deve prosseguir.
|
|
93
|
+
* Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentshouldupdate) para mais detalhes.
|
|
94
|
+
*/
|
|
95
|
+
brShouldUpdate: EventEmitter<void>;
|
|
96
|
+
componentShouldUpdate(): void;
|
|
97
|
+
/**
|
|
98
|
+
* Emite um evento antes de o componente ser atualizado.
|
|
99
|
+
* Utilize este evento para realizar ações preparatórias antes da atualização do componente.
|
|
100
|
+
* Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillupdate) para mais detalhes.
|
|
101
|
+
*/
|
|
102
|
+
brWillUpdate: EventEmitter<void>;
|
|
103
|
+
componentWillUpdate(): void;
|
|
104
|
+
/**
|
|
105
|
+
* Emite um evento após o componente ter sido atualizado.
|
|
106
|
+
* Utilize este evento para realizar ações após a atualização do componente.
|
|
107
|
+
* Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidupdate) para mais detalhes.
|
|
108
|
+
*/
|
|
109
|
+
brDidUpdate: EventEmitter<void>;
|
|
110
|
+
componentDidUpdate(): void;
|
|
111
|
+
/**
|
|
112
|
+
* Emite um evento quando o componente é desconectado do DOM.
|
|
113
|
+
* Utilize este evento para realizar a limpeza ou outras ações necessárias quando o componente é removido.
|
|
114
|
+
* Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#disconnectedcallback) para mais detalhes.
|
|
115
|
+
*/
|
|
116
|
+
brDidDisconnect: EventEmitter<void>;
|
|
117
|
+
disconnectedCallback(): void;
|
|
118
|
+
/**
|
|
119
|
+
* Emite um evento quando o formulário associado é enviado.
|
|
120
|
+
* Utilize este evento para realizar ações quando o formulário é enviado.
|
|
121
|
+
*/
|
|
122
|
+
brFormAssociatedCallback: EventEmitter<FormData>;
|
|
123
|
+
formAssociatedCallback(form: FormData): void;
|
|
124
|
+
/**
|
|
125
|
+
* Emite um evento quando o estado do formulário é alterado para desabilitado.
|
|
126
|
+
* Utilize este evento para realizar ações quando o formulário é desabilitado.
|
|
127
|
+
*/
|
|
128
|
+
brFormDisabledCallback: EventEmitter<boolean>;
|
|
129
|
+
formDisabledCallback(disabled: boolean): void;
|
|
130
|
+
/**
|
|
131
|
+
* Emite um evento quando o formulário é redefinido.
|
|
132
|
+
* Utilize este evento para realizar ações quando o formulário é redefinido.
|
|
133
|
+
*/
|
|
134
|
+
brFormResetCallback: EventEmitter<void>;
|
|
135
|
+
formResetCallback(): void;
|
|
136
|
+
/**
|
|
137
|
+
* Emite um evento para restaurar o estado do formulário.
|
|
138
|
+
* Utilize este evento para realizar ações quando o estado do formulário é restaurado.
|
|
139
|
+
*/
|
|
140
|
+
brFormStateRestoreCallback: EventEmitter<[state: string, _mode: string]>;
|
|
141
|
+
formStateRestoreCallback(state: string, _mode: string): void;
|
|
142
|
+
valueChanged(): void;
|
|
143
|
+
/**
|
|
144
|
+
* Manipula a mudança de valor do textarea. Atualiza o valor e emite um evento de mudança.
|
|
145
|
+
* @param event - O evento de entrada do textarea.
|
|
146
|
+
*/
|
|
147
|
+
handleChange(event: Event): void;
|
|
148
|
+
/**
|
|
149
|
+
* Define um novo valor para o textarea.
|
|
150
|
+
* @param newValue - O novo valor a ser definido.
|
|
151
|
+
*/
|
|
152
|
+
setValue(newValue: string): Promise<void>;
|
|
153
|
+
private emitValueChange;
|
|
154
|
+
private getCssClassMap;
|
|
155
|
+
private inheritedAttributes;
|
|
156
|
+
render(): any;
|
|
157
|
+
}
|
|
@@ -471,6 +471,56 @@ export namespace Components {
|
|
|
471
471
|
*/
|
|
472
472
|
"value": string;
|
|
473
473
|
}
|
|
474
|
+
/**
|
|
475
|
+
* Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/textarea?tab=designer).
|
|
476
|
+
*/
|
|
477
|
+
interface BrTextarea {
|
|
478
|
+
/**
|
|
479
|
+
* Identificador único do textarea, gerado automaticamente. Este ID é utilizado para associar o textarea a outros elementos, como rótulos, e garantir que cada instância do componente tenha um identificador distinto.
|
|
480
|
+
*/
|
|
481
|
+
"defaultId": string;
|
|
482
|
+
/**
|
|
483
|
+
* Ajusta a densidade do componente, podendo ser 'small', 'medium' ou 'large'.
|
|
484
|
+
*/
|
|
485
|
+
"density": string;
|
|
486
|
+
/**
|
|
487
|
+
* Indica se o textarea está desabilitado. Quando verdadeiro, o usuário não pode interagir com o campo.
|
|
488
|
+
*/
|
|
489
|
+
"disabled": boolean;
|
|
490
|
+
/**
|
|
491
|
+
* Ativa o modo escuro para o componente. Quando verdadeiro, o componente será exibido em um tema escuro.
|
|
492
|
+
*/
|
|
493
|
+
"isDarkMode": boolean;
|
|
494
|
+
/**
|
|
495
|
+
* Define se o rótulo deve ser exibido à esquerda do textarea. Quando verdadeiro, o rótulo é posicionado à esquerda.
|
|
496
|
+
*/
|
|
497
|
+
"isLabelLeft": boolean;
|
|
498
|
+
/**
|
|
499
|
+
* Texto do rótulo associado ao textarea. Este rótulo é exibido acima do campo de entrada.
|
|
500
|
+
*/
|
|
501
|
+
"label": string;
|
|
502
|
+
/**
|
|
503
|
+
* Número máximo de caracteres permitidos no textarea. Se definido como 0, não há limite.
|
|
504
|
+
*/
|
|
505
|
+
"maxlength": number;
|
|
506
|
+
/**
|
|
507
|
+
* Texto exibido quando o textarea está vazio. Ajuda a guiar o usuário sobre o que deve ser inserido.
|
|
508
|
+
*/
|
|
509
|
+
"placeholder": string;
|
|
510
|
+
/**
|
|
511
|
+
* Define um novo valor para o textarea.
|
|
512
|
+
* @param newValue - O novo valor a ser definido.
|
|
513
|
+
*/
|
|
514
|
+
"setValue": (newValue: string) => Promise<void>;
|
|
515
|
+
/**
|
|
516
|
+
* Define o estado visual do componente, podendo ser 'danger', 'success' ou 'warning'.
|
|
517
|
+
*/
|
|
518
|
+
"states": string;
|
|
519
|
+
/**
|
|
520
|
+
* Valor atual do textarea. Este valor pode ser alterado programaticamente.
|
|
521
|
+
*/
|
|
522
|
+
"value": string;
|
|
523
|
+
}
|
|
474
524
|
}
|
|
475
525
|
export interface BrAvatarCustomEvent<T> extends CustomEvent<T> {
|
|
476
526
|
detail: T;
|
|
@@ -520,6 +570,10 @@ export interface BrSwitchCustomEvent<T> extends CustomEvent<T> {
|
|
|
520
570
|
detail: T;
|
|
521
571
|
target: HTMLBrSwitchElement;
|
|
522
572
|
}
|
|
573
|
+
export interface BrTextareaCustomEvent<T> extends CustomEvent<T> {
|
|
574
|
+
detail: T;
|
|
575
|
+
target: HTMLBrTextareaElement;
|
|
576
|
+
}
|
|
523
577
|
declare global {
|
|
524
578
|
interface HTMLBrAvatarElementEventMap {
|
|
525
579
|
"brDidConnect": void;
|
|
@@ -903,6 +957,38 @@ declare global {
|
|
|
903
957
|
prototype: HTMLBrSwitchElement;
|
|
904
958
|
new (): HTMLBrSwitchElement;
|
|
905
959
|
};
|
|
960
|
+
interface HTMLBrTextareaElementEventMap {
|
|
961
|
+
"brDidConnect": void;
|
|
962
|
+
"brWillLoad": void;
|
|
963
|
+
"brDidLoad": void;
|
|
964
|
+
"brWillRender": void;
|
|
965
|
+
"brDidRender": void;
|
|
966
|
+
"brShouldUpdate": void;
|
|
967
|
+
"brWillUpdate": void;
|
|
968
|
+
"brDidUpdate": void;
|
|
969
|
+
"brDidDisconnect": void;
|
|
970
|
+
"brFormAssociatedCallback": FormData;
|
|
971
|
+
"brFormDisabledCallback": boolean;
|
|
972
|
+
"brFormResetCallback": void;
|
|
973
|
+
"brFormStateRestoreCallback": [state: string, _mode: string];
|
|
974
|
+
}
|
|
975
|
+
/**
|
|
976
|
+
* Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/textarea?tab=designer).
|
|
977
|
+
*/
|
|
978
|
+
interface HTMLBrTextareaElement extends Components.BrTextarea, HTMLStencilElement {
|
|
979
|
+
addEventListener<K extends keyof HTMLBrTextareaElementEventMap>(type: K, listener: (this: HTMLBrTextareaElement, ev: BrTextareaCustomEvent<HTMLBrTextareaElementEventMap[K]>) => any, options?: boolean | AddEventListenerOptions): void;
|
|
980
|
+
addEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
981
|
+
addEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
|
|
982
|
+
addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
|
|
983
|
+
removeEventListener<K extends keyof HTMLBrTextareaElementEventMap>(type: K, listener: (this: HTMLBrTextareaElement, ev: BrTextareaCustomEvent<HTMLBrTextareaElementEventMap[K]>) => any, options?: boolean | EventListenerOptions): void;
|
|
984
|
+
removeEventListener<K extends keyof DocumentEventMap>(type: K, listener: (this: Document, ev: DocumentEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
985
|
+
removeEventListener<K extends keyof HTMLElementEventMap>(type: K, listener: (this: HTMLElement, ev: HTMLElementEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
|
|
986
|
+
removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
|
|
987
|
+
}
|
|
988
|
+
var HTMLBrTextareaElement: {
|
|
989
|
+
prototype: HTMLBrTextareaElement;
|
|
990
|
+
new (): HTMLBrTextareaElement;
|
|
991
|
+
};
|
|
906
992
|
interface HTMLElementTagNameMap {
|
|
907
993
|
"br-avatar": HTMLBrAvatarElement;
|
|
908
994
|
"br-button": HTMLBrButtonElement;
|
|
@@ -916,6 +1002,7 @@ declare global {
|
|
|
916
1002
|
"br-message": HTMLBrMessageElement;
|
|
917
1003
|
"br-radio": HTMLBrRadioElement;
|
|
918
1004
|
"br-switch": HTMLBrSwitchElement;
|
|
1005
|
+
"br-textarea": HTMLBrTextareaElement;
|
|
919
1006
|
}
|
|
920
1007
|
}
|
|
921
1008
|
declare namespace LocalJSX {
|
|
@@ -1990,6 +2077,103 @@ declare namespace LocalJSX {
|
|
|
1990
2077
|
*/
|
|
1991
2078
|
"value"?: string;
|
|
1992
2079
|
}
|
|
2080
|
+
/**
|
|
2081
|
+
* Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/textarea?tab=designer).
|
|
2082
|
+
*/
|
|
2083
|
+
interface BrTextarea {
|
|
2084
|
+
/**
|
|
2085
|
+
* Identificador único do textarea, gerado automaticamente. Este ID é utilizado para associar o textarea a outros elementos, como rótulos, e garantir que cada instância do componente tenha um identificador distinto.
|
|
2086
|
+
*/
|
|
2087
|
+
"defaultId"?: string;
|
|
2088
|
+
/**
|
|
2089
|
+
* Ajusta a densidade do componente, podendo ser 'small', 'medium' ou 'large'.
|
|
2090
|
+
*/
|
|
2091
|
+
"density"?: string;
|
|
2092
|
+
/**
|
|
2093
|
+
* Indica se o textarea está desabilitado. Quando verdadeiro, o usuário não pode interagir com o campo.
|
|
2094
|
+
*/
|
|
2095
|
+
"disabled"?: boolean;
|
|
2096
|
+
/**
|
|
2097
|
+
* Ativa o modo escuro para o componente. Quando verdadeiro, o componente será exibido em um tema escuro.
|
|
2098
|
+
*/
|
|
2099
|
+
"isDarkMode"?: boolean;
|
|
2100
|
+
/**
|
|
2101
|
+
* Define se o rótulo deve ser exibido à esquerda do textarea. Quando verdadeiro, o rótulo é posicionado à esquerda.
|
|
2102
|
+
*/
|
|
2103
|
+
"isLabelLeft"?: boolean;
|
|
2104
|
+
/**
|
|
2105
|
+
* Texto do rótulo associado ao textarea. Este rótulo é exibido acima do campo de entrada.
|
|
2106
|
+
*/
|
|
2107
|
+
"label"?: string;
|
|
2108
|
+
/**
|
|
2109
|
+
* Número máximo de caracteres permitidos no textarea. Se definido como 0, não há limite.
|
|
2110
|
+
*/
|
|
2111
|
+
"maxlength"?: number;
|
|
2112
|
+
/**
|
|
2113
|
+
* Emite um evento quando o componente é conectado ao DOM. Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#connectedcallback) para mais detalhes.
|
|
2114
|
+
*/
|
|
2115
|
+
"onBrDidConnect"?: (event: BrTextareaCustomEvent<void>) => void;
|
|
2116
|
+
/**
|
|
2117
|
+
* Emite um evento quando o componente é desconectado do DOM. Utilize este evento para realizar a limpeza ou outras ações necessárias quando o componente é removido. Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#disconnectedcallback) para mais detalhes.
|
|
2118
|
+
*/
|
|
2119
|
+
"onBrDidDisconnect"?: (event: BrTextareaCustomEvent<void>) => void;
|
|
2120
|
+
/**
|
|
2121
|
+
* Emite um evento após o componente ter sido carregado pela primeira vez. Utilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado. Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.
|
|
2122
|
+
*/
|
|
2123
|
+
"onBrDidLoad"?: (event: BrTextareaCustomEvent<void>) => void;
|
|
2124
|
+
/**
|
|
2125
|
+
* Emite um evento após o componente ter sido renderizado. Utilize este evento para executar ações que devem ocorrer após a renderização do componente. Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidrender) para mais detalhes.
|
|
2126
|
+
*/
|
|
2127
|
+
"onBrDidRender"?: (event: BrTextareaCustomEvent<void>) => void;
|
|
2128
|
+
/**
|
|
2129
|
+
* Emite um evento após o componente ter sido atualizado. Utilize este evento para realizar ações após a atualização do componente. Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidupdate) para mais detalhes.
|
|
2130
|
+
*/
|
|
2131
|
+
"onBrDidUpdate"?: (event: BrTextareaCustomEvent<void>) => void;
|
|
2132
|
+
/**
|
|
2133
|
+
* Emite um evento quando o formulário associado é enviado. Utilize este evento para realizar ações quando o formulário é enviado.
|
|
2134
|
+
*/
|
|
2135
|
+
"onBrFormAssociatedCallback"?: (event: BrTextareaCustomEvent<FormData>) => void;
|
|
2136
|
+
/**
|
|
2137
|
+
* Emite um evento quando o estado do formulário é alterado para desabilitado. Utilize este evento para realizar ações quando o formulário é desabilitado.
|
|
2138
|
+
*/
|
|
2139
|
+
"onBrFormDisabledCallback"?: (event: BrTextareaCustomEvent<boolean>) => void;
|
|
2140
|
+
/**
|
|
2141
|
+
* Emite um evento quando o formulário é redefinido. Utilize este evento para realizar ações quando o formulário é redefinido.
|
|
2142
|
+
*/
|
|
2143
|
+
"onBrFormResetCallback"?: (event: BrTextareaCustomEvent<void>) => void;
|
|
2144
|
+
/**
|
|
2145
|
+
* Emite um evento para restaurar o estado do formulário. Utilize este evento para realizar ações quando o estado do formulário é restaurado.
|
|
2146
|
+
*/
|
|
2147
|
+
"onBrFormStateRestoreCallback"?: (event: BrTextareaCustomEvent<[state: string, _mode: string]>) => void;
|
|
2148
|
+
/**
|
|
2149
|
+
* Emite um evento para indicar se o componente deve ser atualizado ou não. Este evento é chamado antes de qualquer atualização do componente para decidir se a atualização deve prosseguir. Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentshouldupdate) para mais detalhes.
|
|
2150
|
+
*/
|
|
2151
|
+
"onBrShouldUpdate"?: (event: BrTextareaCustomEvent<void>) => void;
|
|
2152
|
+
/**
|
|
2153
|
+
* Emite um evento antes que o componente seja carregado pela primeira vez. Utilize este evento para realizar tarefas de inicialização antes do componente ser exibido. Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillload) para mais detalhes.
|
|
2154
|
+
*/
|
|
2155
|
+
"onBrWillLoad"?: (event: BrTextareaCustomEvent<void>) => void;
|
|
2156
|
+
/**
|
|
2157
|
+
* Emite um evento antes do componente ser renderizado. Utilize este evento para preparar o componente antes de sua renderização. Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillrender) para mais detalhes.
|
|
2158
|
+
*/
|
|
2159
|
+
"onBrWillRender"?: (event: BrTextareaCustomEvent<void>) => void;
|
|
2160
|
+
/**
|
|
2161
|
+
* Emite um evento antes de o componente ser atualizado. Utilize este evento para realizar ações preparatórias antes da atualização do componente. Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillupdate) para mais detalhes.
|
|
2162
|
+
*/
|
|
2163
|
+
"onBrWillUpdate"?: (event: BrTextareaCustomEvent<void>) => void;
|
|
2164
|
+
/**
|
|
2165
|
+
* Texto exibido quando o textarea está vazio. Ajuda a guiar o usuário sobre o que deve ser inserido.
|
|
2166
|
+
*/
|
|
2167
|
+
"placeholder"?: string;
|
|
2168
|
+
/**
|
|
2169
|
+
* Define o estado visual do componente, podendo ser 'danger', 'success' ou 'warning'.
|
|
2170
|
+
*/
|
|
2171
|
+
"states"?: string;
|
|
2172
|
+
/**
|
|
2173
|
+
* Valor atual do textarea. Este valor pode ser alterado programaticamente.
|
|
2174
|
+
*/
|
|
2175
|
+
"value"?: string;
|
|
2176
|
+
}
|
|
1993
2177
|
interface IntrinsicElements {
|
|
1994
2178
|
"br-avatar": BrAvatar;
|
|
1995
2179
|
"br-button": BrButton;
|
|
@@ -2003,6 +2187,7 @@ declare namespace LocalJSX {
|
|
|
2003
2187
|
"br-message": BrMessage;
|
|
2004
2188
|
"br-radio": BrRadio;
|
|
2005
2189
|
"br-switch": BrSwitch;
|
|
2190
|
+
"br-textarea": BrTextarea;
|
|
2006
2191
|
}
|
|
2007
2192
|
}
|
|
2008
2193
|
export { LocalJSX as JSX };
|
|
@@ -2063,6 +2248,10 @@ declare module "@stencil/core" {
|
|
|
2063
2248
|
* Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/switch?tab=designer).
|
|
2064
2249
|
*/
|
|
2065
2250
|
"br-switch": LocalJSX.BrSwitch & JSXBase.HTMLAttributes<HTMLBrSwitchElement>;
|
|
2251
|
+
/**
|
|
2252
|
+
* Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/textarea?tab=designer).
|
|
2253
|
+
*/
|
|
2254
|
+
"br-textarea": LocalJSX.BrTextarea & JSXBase.HTMLAttributes<HTMLBrTextareaElement>;
|
|
2066
2255
|
}
|
|
2067
2256
|
}
|
|
2068
2257
|
}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r,c as a,h as i,H as t,g as e}from"./p-6849daee.js";import{i as o}from"./p-ee6f4f3f.js";const n='*,*::before,*::after{box-sizing:border-box}html{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{margin:0}a{background-color:transparent}strong{font-weight:bolder}code{font-family:monospace;font-size:1em}small{font-size:80%}img{border-style:none}button,input,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;-moz-appearance:button;appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;appearance:button;font:inherit}[hidden]{display:none}.d-flex{display:flex !important}.align-items-center{align-items:center !important}.col,[class*=col-]{padding-left:calc(var(--grid-gutter) * 0.5);padding-right:calc(var(--grid-gutter) * 0.5);width:100%}.col{flex:1 0 0%;min-width:8.3333333333%}.col-auto{flex:0 0 auto;width:auto}.container{--grid-margin:var(--grid-portrait-margin);--grid-maxwidth:var(--grid-portrait-maxwidth);margin-left:auto;margin-right:auto;max-width:var(--grid-maxwidth);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%}.row{--grid-gutter:var(--grid-portrait-gutter);display:flex;flex-wrap:wrap;margin-left:calc(var(--grid-gutter) * -0.5);margin-right:calc(var(--grid-gutter) * -0.5)}@media (min-width: 576px){.container{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin))}}@media (min-width: 992px){.container{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin))}}@media (min-width: 1280px){.container{--grid-margin:var(--grid-desktop-margin)}.row{--grid-gutter:var(--grid-desktop-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin))}}@media (min-width: 1600px){.container{--grid-margin:var(--grid-tv-margin)}.row{--grid-gutter:var(--grid-tv-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin))}}.mt-1{margin-top:var(--spacing-scale-half) !important}.mr-1{margin-right:var(--spacing-scale-half) !important}.mr-2{margin-right:var(--spacing-scale-base) !important}.mb-3{margin-bottom:var(--spacing-scale-2x) !important}.pt-half{padding-top:var(--spacing-scale-half) !important}.py-3{padding-bottom:var(--spacing-scale-2x) !important;padding-top:var(--spacing-scale-2x) !important}.py-4{padding-bottom:var(--spacing-scale-3x) !important;padding-top:var(--spacing-scale-3x) !important}body{--bg-color:var(--background);--bg-color-rgb:var(--background-rgb);--bg-color-hsl:var(--background-hsl);--font-size:var(--font-size-scale-base);--font-weight:var(--font-weight-regular);--link-color:var(--interactive);--link-color-rgb:var(--interactive-rgb);--link-color-hsl:var(--interactive-hsl);--line-height:var(--font-line-height-medium);--text-color:var(--color);--text-color-rgb:var(--color-rgb);--text-color-hsl:var(--color-hsl);background:var(--bg-color);color:var(--text-color);font-family:var(--font-family-base);font-size:var(--font-size);font-weight:var(--font-weight);line-height:var(--line-height)}p{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-2x);margin-top:0}p a{text-decoration:underline}@media (min-width: 576px){p{font-size:var(--font-size-scale-up-01)}}a{--focus-offset:var(--spacing-scale-half);color:var(--interactive);text-decoration:none}a:focus{outline:none}a:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}a:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--pressed)), rgba(var(--interactive-rgb), var(--pressed)))}button{cursor:pointer}img{max-width:100%;vertical-align:middle}ul{margin-bottom:var(--spacing-scale-2x);margin-top:0;padding:0 0 0 var(--spacing-scale-5x)}label,.label{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half)}::-moz-placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}::placeholder,.placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}input,textarea,.input{color:var(--color-light);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-half)}code,.code{background:var(--gray-5);border-radius:4px;color:var(--gray-80);display:inline-block;font-family:monospace;font-size:var(--font-size-scale-base);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);padding:var(--spacing-scale-half)}.text-pure-0{color:var(--pure-0) !important}.bg-support-01{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark);background:var(--color-support-01) !important}.text-nowrap{white-space:nowrap !important}.text-base{font-size:var(--font-size-scale-base) !important}.highlight{background:var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));color:var(--status-highlight-text);padding:0 var(--spacing-scale-half)}[disabled],.disabled{cursor:not-allowed;opacity:var(--disabled)}[disabled] *,.disabled *{pointer-events:none}[data-toggle=dropdown]+*{position:absolute}.dropdown{position:relative}.dropdown [data-toggle=dropdown]+*{box-shadow:var(--surface-shadow-sm);left:0;position:absolute;top:100%}.dropdown .br-item{--color:var(--color-light);--color-rgb:var(--color-light-rgb);--text-color:var(--color-light);--interactive:var(--interactive-light);--interactive-rgb:var(--color-rgb);--visited:var(--visited-light);--hover:var(--hover-light);--pressed:var(--pressed-light);--focus-color:var(--focus-color-light);--focus:var(--focus-color-light);--item-padding-y:var(--spacing-scale-2x);background-color:var(--background-light);color:var(--color)}.dropdown .br-item:not(:last-child){border-bottom:1px solid var(--border-color)}.dropdown .br-item.selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}.br-radio{--radio-size:24px;--radio-bullet-size:16px;--radio-bullet-position:calc((var(--radio-size) - var(--radio-bullet-size)) * 0.5);display:block}.br-radio+.br-radio{margin-top:var(--spacing-scale-base)}.br-radio input{opacity:0;position:absolute}.br-radio input+label{cursor:pointer;display:inline-block;margin-bottom:0;min-height:var(--radio-size);min-width:var(--radio-size);padding-left:calc(var(--spacing-scale-base) + var(--radio-size));position:relative}.br-radio input+label::before{background:var(--background);border:1px solid var(--border-color);border-radius:50%;content:"";height:var(--radio-size);left:0;position:absolute;top:-1px;width:var(--radio-size)}.br-radio input+label:empty{padding:0}.br-radio input+label:empty::before{top:0}.br-radio label{font-weight:var(--font-weight-medium)}.br-radio input:checked+label::after{background:var(--selected);border:7px solid var(--selected);border-radius:50%;content:"";height:var(--radio-bullet-size);left:var(--radio-bullet-position);position:absolute;right:0;top:calc(var(--radio-bullet-position) - 1px);width:var(--radio-bullet-size)}.br-radio input:checked+label:empty::after{top:var(--radio-bullet-position)}.br-radio.valid input+label::before,.br-radio[valid] input+label::before{border-color:var(--success)}.br-radio.invalid input+label::before,.br-radio[invalid] input+label::before{border-color:var(--danger)}.br-radio.small input+label,.br-radio[small] input+label{line-height:var(--spacing-scale-2xh);min-height:var(--spacing-scale-2xh)}.br-radio.small input+label::before,.br-radio[small] input+label::before{height:var(--spacing-scale-2xh);width:var(--spacing-scale-2xh)}.br-radio.small input:checked+label::after,.br-radio[small] input:checked+label::after{border-width:4px;height:10px;width:10px}.br-radio input:invalid+label::before{border-color:var(--danger)}.br-radio input:focus-visible:checked+label::before,.br-radio input:focus-visible+label::before{border-color:var(--focus) !important;box-shadow:0 0 0 var(--surface-width-md) var(--focus);outline:none}.br-radio input:hover:not(:disabled)+label::before{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}.br-radio.dark-mode,.br-radio.dark-mode label{color:var(--color-dark)}:host{display:block}.br-radio.hidden-label label{padding-left:calc(var(--checkbox-size) + var(--surface-width-md) * 2);text-indent:-10000px;white-space:nowrap;width:0}';const l=n;const s=class{constructor(i){r(this,i);this.brDidConnect=a(this,"brDidConnect",7);this.brWillLoad=a(this,"brWillLoad",7);this.brDidLoad=a(this,"brDidLoad",7);this.brWillRender=a(this,"brWillRender",7);this.brDidRender=a(this,"brDidRender",7);this.brShouldUpdate=a(this,"brShouldUpdate",7);this.brWillUpdate=a(this,"brWillUpdate",7);this.brDidUpdate=a(this,"brDidUpdate",7);this.brDidDisconnect=a(this,"brDidDisconnect",7);this.brFormAssociatedCallback=a(this,"brFormAssociatedCallback",7);this.brFormDisabledCallback=a(this,"brFormDisabledCallback",7);this.brFormResetCallback=a(this,"brFormResetCallback",7);this.brFormStateRestoreCallback=a(this,"brFormStateRestoreCallback",7);this.brDidCheckedChange=a(this,"brDidCheckedChange",7);if(i.$hostElement$["s-ei"]){this.elementInternals=i.$hostElement$["s-ei"]}else{this.elementInternals=i.$hostElement$.attachInternals();i.$hostElement$["s-ei"]=this.elementInternals}this.inheritedAttributes={};this.handleClick=()=>{this.toggleChecked()};this.handleKeyDown=r=>{if(r.code==="Space"){r.preventDefault();this.toggleChecked()}};this.toggleChecked=()=>{if(this.toggle){this.checked=!this.checked;this.brDidCheckedChange.emit({value:this.value,checked:this.checked})}};this.stopPropagation=r=>{r.stopPropagation()};this.checked=false;this.disabled=false;this.state=null;this.hasHiddenLabel=false;this.name=undefined;this.label=undefined;this.value=undefined;this.customId=undefined;this.toggle=false;this._slotDefault=false}handleItemInteractiveSelect(r){var a;const i=r.target;const t=i.closest("br-item");if(t&&((a=this.el.parentElement)===null||a===void 0?void 0:a.contains(t))){this.checked=r.detail.selected}r.stopPropagation()}connectedCallback(){this.brDidConnect.emit()}componentWillLoad(){this.hasSlotContentDefault();this.brWillLoad.emit();this.inheritedAttributes=o(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(r){this.brFormAssociatedCallback.emit(r)}formDisabledCallback(r){this.brFormDisabledCallback.emit(r)}formResetCallback(){this.brFormResetCallback.emit()}formStateRestoreCallback(r,a){this.brFormStateRestoreCallback.emit([r,a])}hasSlotContentDefault(){this._slotDefault=this.el.innerHTML!==""}getCssClassMap(){return{"br-radio":true,valid:this.state==="valid",invalid:this.state==="invalid",disabled:this.disabled,"hidden-label":this.hasHiddenLabel}}getComputedId(){var r;return((r=this.customId)===null||r===void 0?void 0:r.length)>0?this.customId:this.name}render(){return i(t,{key:"5da5a61be5135f9d6938a3f71d5423947c62f786","aria-disabled":this.disabled?"true":null},i("div",{key:"84fb3469e320751f3f9d10f727f3bd113bea0c7d",class:this.getCssClassMap(),onClick:this.handleClick,onKeyDown:this.handleKeyDown},i("input",Object.assign({key:"e2dfa7551a548ed986d2d1be7343cd67645150b9","aria-label":this.label,type:"radio",id:this.getComputedId(),name:this.name,checked:this.checked,disabled:this.disabled,value:this.value,onClick:this.stopPropagation},this.inheritedAttributes)),i("label",{key:"fa025229ad31f88416a552fb6dc9cd00f0da6876",htmlFor:this.getComputedId()},this._slotDefault?i("slot",null):this.label)))}static get formAssociated(){return true}get el(){return e(this)}};s.style=l;export{s as br_radio};
|
|
2
|
+
//# sourceMappingURL=p-0f8df882.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["radioCss","BrRadioStyle0","Radio","this","inheritedAttributes","handleClick","toggleChecked","handleKeyDown","event","code","preventDefault","toggle","checked","brDidCheckedChange","emit","value","stopPropagation","handleItemInteractiveSelect","target","brItem","closest","_a","el","parentElement","contains","detail","selected","connectedCallback","brDidConnect","componentWillLoad","hasSlotContentDefault","brWillLoad","inheritAriaAttributes","componentDidLoad","brDidLoad","componentWillRender","brWillRender","componentDidRender","brDidRender","componentShouldUpdate","brShouldUpdate","componentWillUpdate","brWillUpdate","componentDidUpdate","brDidUpdate","disconnectedCallback","brDidDisconnect","formAssociatedCallback","form","brFormAssociatedCallback","formDisabledCallback","disabled","brFormDisabledCallback","formResetCallback","brFormResetCallback","formStateRestoreCallback","state","_mode","brFormStateRestoreCallback","_slotDefault","innerHTML","getCssClassMap","valid","invalid","hasHiddenLabel","getComputedId","customId","length","name","render","h","Host","key","class","onClick","onKeyDown","Object","assign","label","type","id","htmlFor"],"sources":["src/components/radio/radio.scss?tag=br-radio&encapsulation=shadow","src/components/radio/radio.tsx"],"sourcesContent":["@import \"../../../../../node_modules/@govbr-ds/core/src/components/radio/radio.scss\";\n\n:host {\n display: block;\n}\n\n.br-radio.hidden-label {\n label {\n padding-left: calc(var(--checkbox-size) + var(--surface-width-md)* 2);\n text-indent: -10000px;\n white-space: nowrap;\n width: 0;\n }\n}\n ","import { AttachInternals, Component, Element, Event, EventEmitter, h, Host, Listen, Prop, State } 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/radio?tab=designer).\n *\n * @slot default - O texto descritivo pode ser passado por propriedade (label) ou por slot.\n */\n\n@Component({\n tag: 'br-radio',\n styleUrl: 'radio.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Radio {\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: HTMLBrRadioElement\n\n @AttachInternals() elementInternals: ElementInternals\n\n /**\n * Define o estado de seleção do radio.\n * Se definido como verdadeiro, o radio estará marcado. Caso contrário, estará desmarcado.\n */\n @Prop({ reflect: true, mutable: true }) checked: boolean = false\n\n /**\n * Desativa o radio, tornando-o não interativo.\n */\n @Prop({ reflect: true }) disabled: boolean = false\n\n /**\n * Indica a validade do radio.\n * Valores possíveis:\n * - 'valid': O radio é considerado válido.\n * - 'invalid': O radio é considerado inválido.\n * Se não for especificado, o valor padrão é `null`, indicando que a validade não foi definida.\n */\n @Prop({ reflect: true }) state: 'valid' | 'invalid' = null\n\n /**\n * Define se o label associado ao radio deve ser oculto.\n * Se definido como verdadeiro, o texto do label será oculto, mas o radio ainda estará visível e funcional.\n */\n @Prop({ reflect: true, attribute: 'has-hidden-label' }) hasHiddenLabel: boolean = false\n\n /**\n * Define o nome do radio, que é utilizado para agrupar radios 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\n @Prop({ reflect: true }) name!: string\n\n /**\n * Texto descritivo exibido à direita do radio.\n * Caso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado.\n */\n @Prop({ reflect: true }) label: string\n\n /**\n * Define o valor associado ao radio quando ele faz parte de um formulário nativo (`<form>`).\n * Esse valor é enviado com o formulário quando o radio está selecionado.\n * **Nota:** Esta propriedade não deve ser utilizada para determinar se o radio está selecionado; para verificar o estado de seleção, use a propriedade `checked`.\n */\n @Prop({ reflect: true }) value: any\n\n /**\n * Especifica o ID do componente, que é usado para conectar o label correspondente ao radio.\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 * Indica se o radio pode alternar seu estado checked\n */\n @Prop({ reflect: true }) toggle: boolean = false\n\n /**\n * Propriedade que vai guardar o valor da validação do slot\n */\n @State() _slotDefault: boolean = false\n\n // Faz a marcação do checkbox de acordo com a seleção do componente item do tipo is-interactive\n @Listen('brDidSelect', { target: 'document' })\n handleItemInteractiveSelect(event: CustomEvent) {\n // Verifica se o evento é de um pai correto\n const target = event.target as HTMLElement\n const brItem = target.closest('br-item') as HTMLElement\n\n if (brItem && this.el.parentElement?.contains(brItem)) {\n this.checked = event.detail.selected\n }\n\n event.stopPropagation()\n }\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.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 private hasSlotContentDefault(): any {\n this._slotDefault = this.el.innerHTML !== ''\n }\n\n private getCssClassMap(): CssClassMap {\n return {\n 'br-radio': true,\n valid: this.state === 'valid',\n invalid: this.state === 'invalid',\n disabled: this.disabled,\n 'hidden-label': this.hasHiddenLabel,\n }\n }\n\n private inheritedAttributes: Attributes = {}\n\n /**\n * Componente teve seu estado \"checked\" alterado\n */\n @Event() brDidCheckedChange: EventEmitter<{ value: boolean; checked: boolean }>\n\n private readonly handleClick = () => {\n this.toggleChecked()\n }\n\n private readonly handleKeyDown = (event: KeyboardEvent) => {\n // Permite alternar o estado apenas quando a tecla pressionada é 'Space'\n if (event.code === 'Space') {\n event.preventDefault() // Impede o comportamento padrão da tecla 'Space'\n this.toggleChecked()\n }\n }\n\n /**\n * Controla o comportamento de alternar o estado checked.\n */\n private readonly toggleChecked = () => {\n if (this.toggle) {\n this.checked = !this.checked\n this.brDidCheckedChange.emit({ value: this.value, checked: this.checked })\n }\n }\n\n /**\n * Determina um id para o radio.\n */\n private getComputedId(): string {\n return this.customId?.length > 0 ? this.customId : this.name\n }\n\n private readonly stopPropagation = (event: Event) => {\n event.stopPropagation()\n }\n\n render() {\n return (\n <Host aria-disabled={this.disabled ? 'true' : null}>\n <div class={this.getCssClassMap()} onClick={this.handleClick} onKeyDown={this.handleKeyDown}>\n <input\n aria-label={this.label}\n type=\"radio\"\n id={this.getComputedId()}\n name={this.name}\n checked={this.checked}\n disabled={this.disabled}\n value={this.value}\n onClick={this.stopPropagation}\n {...this.inheritedAttributes}\n />\n <label htmlFor={this.getComputedId()}>{this._slotDefault ? <slot></slot> : this.label}</label>\n </div>\n </Host>\n )\n }\n}\n"],"mappings":"oGAAA,MAAMA,EAAW,23SACjB,MAAAC,EAAeD,E,MCeFE,EAAK,M,s4BAyORC,KAAAC,oBAAkC,GAOzBD,KAAAE,YAAc,KAC7BF,KAAKG,eAAe,EAGLH,KAAAI,cAAiBC,IAEhC,GAAIA,EAAMC,OAAS,QAAS,CAC1BD,EAAME,iBACNP,KAAKG,e,GAOQH,KAAAG,cAAgB,KAC/B,GAAIH,KAAKQ,OAAQ,CACfR,KAAKS,SAAWT,KAAKS,QACrBT,KAAKU,mBAAmBC,KAAK,CAAEC,MAAOZ,KAAKY,MAAOH,QAAST,KAAKS,S,GAWnDT,KAAAa,gBAAmBR,IAClCA,EAAMQ,iBAAiB,E,aAjQkC,M,cAKd,M,WASS,K,oBAM4B,M,kGA+BvC,M,kBAKV,K,CAIjC,2BAAAC,CAA4BT,G,MAE1B,MAAMU,EAASV,EAAMU,OACrB,MAAMC,EAASD,EAAOE,QAAQ,WAE9B,GAAID,KAAUE,EAAAlB,KAAKmB,GAAGC,iBAAa,MAAAF,SAAA,SAAAA,EAAEG,SAASL,IAAS,CACrDhB,KAAKS,QAAUJ,EAAMiB,OAAOC,Q,CAG9BlB,EAAMQ,iB,CAQR,iBAAAW,GACExB,KAAKyB,aAAad,M,CASpB,iBAAAe,GACE1B,KAAK2B,wBACL3B,KAAK4B,WAAWjB,OAChBX,KAAKC,oBAAsB4B,EAAsB7B,KAAKmB,G,CASxD,gBAAAW,GACE9B,KAAK+B,UAAUpB,M,CASjB,mBAAAqB,GACEhC,KAAKiC,aAAatB,M,CASpB,kBAAAuB,GACElC,KAAKmC,YAAYxB,M,CASnB,qBAAAyB,GACEpC,KAAKqC,eAAe1B,M,CAStB,mBAAA2B,GACEtC,KAAKuC,aAAa5B,M,CASpB,kBAAA6B,GACExC,KAAKyC,YAAY9B,M,CASnB,oBAAA+B,GACE1C,KAAK2C,gBAAgBhC,M,CAUvB,sBAAAiC,CAAuBC,GACrB7C,KAAK8C,yBAAyBnC,KAAKkC,E,CAUrC,oBAAAE,CAAqBC,GACnBhD,KAAKiD,uBAAuBtC,KAAKqC,E,CAQnC,iBAAAE,GACElD,KAAKmD,oBAAoBxC,M,CAW3B,wBAAAyC,CAAyBC,EAAeC,GACtCtD,KAAKuD,2BAA2B5C,KAAK,CAAC0C,EAAOC,G,CAGvC,qBAAA3B,GACN3B,KAAKwD,aAAexD,KAAKmB,GAAGsC,YAAc,E,CAGpC,cAAAC,GACN,MAAO,CACL,WAAY,KACZC,MAAO3D,KAAKqD,QAAU,QACtBO,QAAS5D,KAAKqD,QAAU,UACxBL,SAAUhD,KAAKgD,SACf,eAAgBhD,KAAK6D,e,CAoCjB,aAAAC,G,MACN,QAAO5C,EAAAlB,KAAK+D,YAAQ,MAAA7C,SAAA,SAAAA,EAAE8C,QAAS,EAAIhE,KAAK+D,SAAW/D,KAAKiE,I,CAO1D,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2DAAgBrE,KAAKgD,SAAW,OAAS,MAC5CmB,EAAA,OAAAE,IAAA,2CAAKC,MAAOtE,KAAK0D,iBAAkBa,QAASvE,KAAKE,YAAasE,UAAWxE,KAAKI,eAC5E+D,EAAA,QAAAM,OAAAC,OAAA,CAAAL,IAAA,wDACcrE,KAAK2E,MACjBC,KAAK,QACLC,GAAI7E,KAAK8D,gBACTG,KAAMjE,KAAKiE,KACXxD,QAAST,KAAKS,QACduC,SAAUhD,KAAKgD,SACfpC,MAAOZ,KAAKY,MACZ2D,QAASvE,KAAKa,iBACVb,KAAKC,sBAEXkE,EAAA,SAAAE,IAAA,2CAAOS,QAAS9E,KAAK8D,iBAAkB9D,KAAKwD,aAAeW,EAAA,aAAgBnE,KAAK2E,Q","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["radioCss","BrRadioStyle0","Radio","this","inheritedAttributes","handleClick","toggleChecked","handleKeyDown","event","code","preventDefault","toggle","checked","brDidCheckedChange","emit","value","stopPropagation","handleItemInteractiveSelect","target","brItem","closest","_a","el","parentElement","contains","detail","selected","connectedCallback","brDidConnect","componentWillLoad","hasSlotContentDefault","brWillLoad","inheritAriaAttributes","componentDidLoad","brDidLoad","componentWillRender","brWillRender","componentDidRender","brDidRender","componentShouldUpdate","brShouldUpdate","componentWillUpdate","brWillUpdate","componentDidUpdate","brDidUpdate","disconnectedCallback","brDidDisconnect","formAssociatedCallback","form","brFormAssociatedCallback","formDisabledCallback","disabled","brFormDisabledCallback","formResetCallback","brFormResetCallback","formStateRestoreCallback","state","_mode","brFormStateRestoreCallback","_slotDefault","innerHTML","getCssClassMap","valid","invalid","hasHiddenLabel","getComputedId","customId","length","name","render","h","Host","key","class","onClick","onKeyDown","Object","assign","label","type","id","htmlFor"],"sources":["src/components/radio/radio.scss?tag=br-radio&encapsulation=shadow","src/components/radio/radio.tsx"],"sourcesContent":["@import \"../../../../../node_modules/@govbr-ds/core/src/components/radio/radio.scss\";\n\n:host {\n display: block;\n}\n\n.br-radio.hidden-label {\n label {\n padding-left: calc(var(--checkbox-size) + var(--surface-width-md)* 2);\n text-indent: -10000px;\n white-space: nowrap;\n width: 0;\n }\n}\n ","import { AttachInternals, Component, Element, Event, EventEmitter, h, Host, Listen, Prop, State } 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/radio?tab=designer).\n *\n * @slot default - O texto descritivo pode ser passado por propriedade (label) ou por slot.\n */\n\n@Component({\n tag: 'br-radio',\n styleUrl: 'radio.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Radio {\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: HTMLBrRadioElement\n\n @AttachInternals() elementInternals: ElementInternals\n\n /**\n * Define o estado de seleção do radio.\n * Se definido como verdadeiro, o radio estará marcado. Caso contrário, estará desmarcado.\n */\n @Prop({ reflect: true, mutable: true }) checked: boolean = false\n\n /**\n * Desativa o radio, tornando-o não interativo.\n */\n @Prop({ reflect: true }) disabled: boolean = false\n\n /**\n * Indica a validade do radio.\n * Valores possíveis:\n * - 'valid': O radio é considerado válido.\n * - 'invalid': O radio é considerado inválido.\n * Se não for especificado, o valor padrão é `null`, indicando que a validade não foi definida.\n */\n @Prop({ reflect: true }) state: 'valid' | 'invalid' = null\n\n /**\n * Define se o label associado ao radio deve ser oculto.\n * Se definido como verdadeiro, o texto do label será oculto, mas o radio ainda estará visível e funcional.\n */\n @Prop({ reflect: true, attribute: 'has-hidden-label' }) hasHiddenLabel: boolean = false\n\n /**\n * Define o nome do radio, que é utilizado para agrupar radios 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\n @Prop({ reflect: true }) name!: string\n\n /**\n * Texto descritivo exibido à direita do radio.\n * Caso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado.\n */\n @Prop({ reflect: true }) label: string\n\n /**\n * Define o valor associado ao radio quando ele faz parte de um formulário nativo (`<form>`).\n * Esse valor é enviado com o formulário quando o radio está selecionado.\n * **Nota:** Esta propriedade não deve ser utilizada para determinar se o radio está selecionado; para verificar o estado de seleção, use a propriedade `checked`.\n */\n @Prop({ reflect: true }) value: any\n\n /**\n * Especifica o ID do componente, que é usado para conectar o label correspondente ao radio.\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 * Indica se o radio pode alternar seu estado checked\n */\n @Prop({ reflect: true }) toggle: boolean = false\n\n /**\n * Propriedade que vai guardar o valor da validação do slot\n */\n @State() _slotDefault: boolean = false\n\n // Faz a marcação do checkbox de acordo com a seleção do componente item do tipo is-interactive\n @Listen('brDidSelect', { target: 'document' })\n handleItemInteractiveSelect(event: CustomEvent) {\n // Verifica se o evento é de um pai correto\n const target = event.target as HTMLElement\n const brItem = target.closest('br-item') as HTMLElement\n\n if (brItem && this.el.parentElement?.contains(brItem)) {\n this.checked = event.detail.selected\n }\n\n event.stopPropagation()\n }\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.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 private hasSlotContentDefault(): any {\n this._slotDefault = this.el.innerHTML !== ''\n }\n\n private getCssClassMap(): CssClassMap {\n return {\n 'br-radio': true,\n valid: this.state === 'valid',\n invalid: this.state === 'invalid',\n disabled: this.disabled,\n 'hidden-label': this.hasHiddenLabel,\n }\n }\n\n private inheritedAttributes: Attributes = {}\n\n /**\n * Componente teve seu estado \"checked\" alterado\n */\n @Event() brDidCheckedChange: EventEmitter<{ value: boolean; checked: boolean }>\n\n private readonly handleClick = () => {\n this.toggleChecked()\n }\n\n private readonly handleKeyDown = (event: KeyboardEvent) => {\n // Permite alternar o estado apenas quando a tecla pressionada é 'Space'\n if (event.code === 'Space') {\n event.preventDefault() // Impede o comportamento padrão da tecla 'Space'\n this.toggleChecked()\n }\n }\n\n /**\n * Controla o comportamento de alternar o estado checked.\n */\n private readonly toggleChecked = () => {\n if (this.toggle) {\n this.checked = !this.checked\n this.brDidCheckedChange.emit({ value: this.value, checked: this.checked })\n }\n }\n\n /**\n * Determina um id para o radio.\n */\n private getComputedId(): string {\n return this.customId?.length > 0 ? this.customId : this.name\n }\n\n private readonly stopPropagation = (event: Event) => {\n event.stopPropagation()\n }\n\n render() {\n return (\n <Host aria-disabled={this.disabled ? 'true' : null}>\n <div class={this.getCssClassMap()} onClick={this.handleClick} onKeyDown={this.handleKeyDown}>\n <input\n aria-label={this.label}\n type=\"radio\"\n id={this.getComputedId()}\n name={this.name}\n checked={this.checked}\n disabled={this.disabled}\n value={this.value}\n onClick={this.stopPropagation}\n {...this.inheritedAttributes}\n />\n <label htmlFor={this.getComputedId()}>{this._slotDefault ? <slot></slot> : this.label}</label>\n </div>\n </Host>\n )\n }\n}\n"],"mappings":"+FAAA,MAAMA,EAAW,m2UACjB,MAAAC,EAAeD,E,MCeFE,EAAK,M,s4BAyORC,KAAAC,oBAAkC,GAOzBD,KAAAE,YAAc,KAC7BF,KAAKG,eAAe,EAGLH,KAAAI,cAAiBC,IAEhC,GAAIA,EAAMC,OAAS,QAAS,CAC1BD,EAAME,iBACNP,KAAKG,e,GAOQH,KAAAG,cAAgB,KAC/B,GAAIH,KAAKQ,OAAQ,CACfR,KAAKS,SAAWT,KAAKS,QACrBT,KAAKU,mBAAmBC,KAAK,CAAEC,MAAOZ,KAAKY,MAAOH,QAAST,KAAKS,S,GAWnDT,KAAAa,gBAAmBR,IAClCA,EAAMQ,iBAAiB,E,aAjQkC,M,cAKd,M,WASS,K,oBAM4B,M,kGA+BvC,M,kBAKV,K,CAIjC,2BAAAC,CAA4BT,G,MAE1B,MAAMU,EAASV,EAAMU,OACrB,MAAMC,EAASD,EAAOE,QAAQ,WAE9B,GAAID,KAAUE,EAAAlB,KAAKmB,GAAGC,iBAAa,MAAAF,SAAA,SAAAA,EAAEG,SAASL,IAAS,CACrDhB,KAAKS,QAAUJ,EAAMiB,OAAOC,Q,CAG9BlB,EAAMQ,iB,CAQR,iBAAAW,GACExB,KAAKyB,aAAad,M,CASpB,iBAAAe,GACE1B,KAAK2B,wBACL3B,KAAK4B,WAAWjB,OAChBX,KAAKC,oBAAsB4B,EAAsB7B,KAAKmB,G,CASxD,gBAAAW,GACE9B,KAAK+B,UAAUpB,M,CASjB,mBAAAqB,GACEhC,KAAKiC,aAAatB,M,CASpB,kBAAAuB,GACElC,KAAKmC,YAAYxB,M,CASnB,qBAAAyB,GACEpC,KAAKqC,eAAe1B,M,CAStB,mBAAA2B,GACEtC,KAAKuC,aAAa5B,M,CASpB,kBAAA6B,GACExC,KAAKyC,YAAY9B,M,CASnB,oBAAA+B,GACE1C,KAAK2C,gBAAgBhC,M,CAUvB,sBAAAiC,CAAuBC,GACrB7C,KAAK8C,yBAAyBnC,KAAKkC,E,CAUrC,oBAAAE,CAAqBC,GACnBhD,KAAKiD,uBAAuBtC,KAAKqC,E,CAQnC,iBAAAE,GACElD,KAAKmD,oBAAoBxC,M,CAW3B,wBAAAyC,CAAyBC,EAAeC,GACtCtD,KAAKuD,2BAA2B5C,KAAK,CAAC0C,EAAOC,G,CAGvC,qBAAA3B,GACN3B,KAAKwD,aAAexD,KAAKmB,GAAGsC,YAAc,E,CAGpC,cAAAC,GACN,MAAO,CACL,WAAY,KACZC,MAAO3D,KAAKqD,QAAU,QACtBO,QAAS5D,KAAKqD,QAAU,UACxBL,SAAUhD,KAAKgD,SACf,eAAgBhD,KAAK6D,e,CAoCjB,aAAAC,G,MACN,QAAO5C,EAAAlB,KAAK+D,YAAQ,MAAA7C,SAAA,SAAAA,EAAE8C,QAAS,EAAIhE,KAAK+D,SAAW/D,KAAKiE,I,CAO1D,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2DAAgBrE,KAAKgD,SAAW,OAAS,MAC5CmB,EAAA,OAAAE,IAAA,2CAAKC,MAAOtE,KAAK0D,iBAAkBa,QAASvE,KAAKE,YAAasE,UAAWxE,KAAKI,eAC5E+D,EAAA,QAAAM,OAAAC,OAAA,CAAAL,IAAA,wDACcrE,KAAK2E,MACjBC,KAAK,QACLC,GAAI7E,KAAK8D,gBACTG,KAAMjE,KAAKiE,KACXxD,QAAST,KAAKS,QACduC,SAAUhD,KAAKgD,SACfpC,MAAOZ,KAAKY,MACZ2D,QAASvE,KAAKa,iBACVb,KAAKC,sBAEXkE,EAAA,SAAAE,IAAA,2CAAOS,QAAS9E,KAAK8D,iBAAkB9D,KAAKwD,aAAeW,EAAA,aAAgBnE,KAAK2E,Q","ignoreList":[]}
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
import{r,c as t,h as i,H as e,g as a}from"./p-6849daee.js";import{i as o}from"./p-ee6f4f3f.js";const n='*,*::before,*::after{box-sizing:border-box}html{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{margin:0}a{background-color:transparent}strong{font-weight:bolder}code{font-family:monospace;font-size:1em}small{font-size:80%}img{border-style:none}button,input,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;-moz-appearance:button;appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;appearance:button;font:inherit}[hidden]{display:none}.d-flex{display:flex !important}.align-items-center{align-items:center !important}.col,[class*=col-]{padding-left:calc(var(--grid-gutter) * 0.5);padding-right:calc(var(--grid-gutter) * 0.5);width:100%}.col{flex:1 0 0%;min-width:8.3333333333%}.col-auto{flex:0 0 auto;width:auto}.container{--grid-margin:var(--grid-portrait-margin);--grid-maxwidth:var(--grid-portrait-maxwidth);margin-left:auto;margin-right:auto;max-width:var(--grid-maxwidth);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%}.row{--grid-gutter:var(--grid-portrait-gutter);display:flex;flex-wrap:wrap;margin-left:calc(var(--grid-gutter) * -0.5);margin-right:calc(var(--grid-gutter) * -0.5)}@media (min-width: 576px){.container{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin))}}@media (min-width: 992px){.container{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin))}}@media (min-width: 1280px){.container{--grid-margin:var(--grid-desktop-margin)}.row{--grid-gutter:var(--grid-desktop-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin))}}@media (min-width: 1600px){.container{--grid-margin:var(--grid-tv-margin)}.row{--grid-gutter:var(--grid-tv-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin))}}.mt-1{margin-top:var(--spacing-scale-half) !important}.mr-1{margin-right:var(--spacing-scale-half) !important}.mr-2{margin-right:var(--spacing-scale-base) !important}.mb-3{margin-bottom:var(--spacing-scale-2x) !important}.pt-half{padding-top:var(--spacing-scale-half) !important}.py-3{padding-bottom:var(--spacing-scale-2x) !important;padding-top:var(--spacing-scale-2x) !important}.py-4{padding-bottom:var(--spacing-scale-3x) !important;padding-top:var(--spacing-scale-3x) !important}body{--bg-color:var(--background);--bg-color-rgb:var(--background-rgb);--bg-color-hsl:var(--background-hsl);--font-size:var(--font-size-scale-base);--font-weight:var(--font-weight-regular);--link-color:var(--interactive);--link-color-rgb:var(--interactive-rgb);--link-color-hsl:var(--interactive-hsl);--line-height:var(--font-line-height-medium);--text-color:var(--color);--text-color-rgb:var(--color-rgb);--text-color-hsl:var(--color-hsl);background:var(--bg-color);color:var(--text-color);font-family:var(--font-family-base);font-size:var(--font-size);font-weight:var(--font-weight);line-height:var(--line-height)}p{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-2x);margin-top:0}p a{text-decoration:underline}@media (min-width: 576px){p{font-size:var(--font-size-scale-up-01)}}a{--focus-offset:var(--spacing-scale-half);color:var(--interactive);text-decoration:none}a:focus{outline:none}a:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}a:not(:disabled):hover{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--pressed)), rgba(var(--interactive-rgb), var(--pressed)))}button{cursor:pointer}img{max-width:100%;vertical-align:middle}ul{margin-bottom:var(--spacing-scale-2x);margin-top:0;padding:0 0 0 var(--spacing-scale-5x)}label,.label{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half)}::-moz-placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}::placeholder,.placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}input,textarea,.input{color:var(--color-light);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-half)}code,.code{background:var(--gray-5);border-radius:4px;color:var(--gray-80);display:inline-block;font-family:monospace;font-size:var(--font-size-scale-base);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);padding:var(--spacing-scale-half)}.text-pure-0{color:var(--pure-0) !important}.bg-support-01{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark);background:var(--color-support-01) !important}.text-nowrap{white-space:nowrap !important}.text-base{font-size:var(--font-size-scale-base) !important}.highlight{background:var(--status-highlight-background) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));color:var(--status-highlight-text);padding:0 var(--spacing-scale-half)}[disabled],.disabled{cursor:not-allowed;opacity:var(--disabled)}[disabled] *,.disabled *{pointer-events:none}[data-toggle=dropdown]+*{position:absolute}.dropdown{position:relative}.dropdown [data-toggle=dropdown]+*{box-shadow:var(--surface-shadow-sm);left:0;position:absolute;top:100%}.dropdown .br-item{--color:var(--color-light);--color-rgb:var(--color-light-rgb);--text-color:var(--color-light);--interactive:var(--interactive-light);--interactive-rgb:var(--color-rgb);--visited:var(--visited-light);--hover:var(--hover-light);--pressed:var(--pressed-light);--focus-color:var(--focus-color-light);--focus:var(--focus-color-light);--item-padding-y:var(--spacing-scale-2x);background-color:var(--background-light);color:var(--color)}.dropdown .br-item:not(:last-child){border-bottom:1px solid var(--border-color)}.dropdown .br-item.selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}.br-list{background-color:var(--background)}.br-list.horizontal{display:flex;flex-wrap:wrap}.br-list.horizontal>.header{flex-grow:1;width:100%}.br-list.horizontal>.header+.br-divider{border-top:1px solid var(--border-color);width:100%}.br-list.horizontal>.br-item{flex:1;height:auto;min-height:56px;width:auto}.br-list.horizontal>.br-item+.br-divider{border-width:0 1px 0 0;width:1px}.br-list.horizontal[data-toggle]>.br-item,.br-list.horizontal.toggle>.br-item{display:block}.br-list .br-item{text-align:left;width:100%}.br-list .br-item>.content{align-items:var(--spacing-vertical-top);display:flex}.br-list .br-item>.content>.content{flex:1}.br-list .br-item .content:hover button.br-button{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}.br-list .br-item[data-toggle]{cursor:pointer}.br-list .br-item[data-toggle]~.br-list .br-item{padding:var(--spacing-scale-base) var(--spacing-scale-3x)}.br-list .br-list{overflow:hidden;transition:all 400ms ease-in-out}.br-list .header{align-items:var(--spacing-vertical-center);display:flex;font-size:var(--font-size-scale-base);font-weight:var(--font-weight-bold);justify-content:space-between;padding:var(--spacing-scale-base) var(--spacing-scale-2x)}.br-divider{--divider-size:var(--surface-width-sm);border-color:var(--border-color);border-style:solid;border-width:0;border-top-width:var(--divider-size);display:block}.br-divider.content{align-items:center;border:0;display:flex;justify-content:center}.br-divider.content::after,.br-divider.content::before{border-color:var(--border-color);border-style:solid;border-width:0;border-top-width:var(--divider-size);content:"";flex:1}.br-divider.content::after{margin-left:var(--spacing-scale-base)}.br-divider.content::before{margin-right:var(--spacing-scale-base)}.br-divider.vertical{align-self:stretch;border-right-width:var(--divider-size);border-top-width:0}.br-divider.vertical.content{flex-direction:column}.br-divider.vertical.content::after,.br-divider.vertical.content::before{border-right-width:var(--divider-size);border-top-width:0;margin:0}.br-divider.dark-mode{--border-color:var(--pure-0)}:host{display:block}:host .br-list.horizontal ::slotted(br-item){flex:1;height:auto;min-height:56px;width:auto}';const l=n;const s=class{constructor(e){r(this,e);this.brDidConnect=t(this,"brDidConnect",7);this.brWillLoad=t(this,"brWillLoad",7);this.brDidLoad=t(this,"brDidLoad",7);this.brWillRender=t(this,"brWillRender",7);this.brDidRender=t(this,"brDidRender",7);this.brShouldUpdate=t(this,"brShouldUpdate",7);this.brWillUpdate=t(this,"brWillUpdate",7);this.brDidUpdate=t(this,"brDidUpdate",7);this.brDidDisconnect=t(this,"brDidDisconnect",7);this.brFormAssociatedCallback=t(this,"brFormAssociatedCallback",7);this.brFormDisabledCallback=t(this,"brFormDisabledCallback",7);this.brFormResetCallback=t(this,"brFormResetCallback",7);this.brFormStateRestoreCallback=t(this,"brFormStateRestoreCallback",7);if(e.$hostElement$["s-ei"]){this.elementInternals=e.$hostElement$["s-ei"]}else{this.elementInternals=e.$hostElement$.attachInternals();e.$hostElement$["s-ei"]=this.elementInternals}this.inheritedAttributes={};this.renderHeader=()=>{var r;if(((r=this.listTitle)===null||r===void 0?void 0:r.length)>0||this.hasSlotContent("header")){return i("div",{class:"header"},this.listTitle&&i("div",{class:"title"},this.listTitle),this.hasSlotContent("header")&&i("div",{class:"d-flex"},i("slot",{name:"header"})))}return null};this.listTitle=undefined;this.isHorizontal=false;this.hideHeaderDivider=false}connectedCallback(){this.brDidConnect.emit()}componentWillLoad(){this.brWillLoad.emit();this.inheritedAttributes=o(this.el)}componentDidLoad(){if(this.isHorizontal){const r=Array.from(this.el.querySelectorAll("br-item"));r.forEach((r=>{const t=r.nextElementSibling;if(t===null||t===void 0?void 0:t.classList.contains("br-divider")){const r=t;r.style.borderWidth="0 1px 0 0";r.style.width="1px"}}))}const r=Array.from(this.el.querySelectorAll("br-item"));r.forEach((r=>{r.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(r){this.brFormAssociatedCallback.emit(r)}formDisabledCallback(r){this.brFormDisabledCallback.emit(r)}formResetCallback(){this.brFormResetCallback.emit()}formStateRestoreCallback(r,t){this.brFormStateRestoreCallback.emit([r,t])}getCssClassMap(){return{"br-list":true,horizontal:this.isHorizontal}}hasSlotContent(r){return this.el.querySelector(`[slot="${r}"]`)!==null}renderDivider(){if((this.listTitle||this.hasSlotContent("header"))&&!this.hideHeaderDivider){return i("div",{class:"br-divider"})}return null}render(){return i(e,{key:"bf56fd2ff3f57265a05521c8447630106f261fd9"},i("div",Object.assign({key:"710c166b13c9e02eb167bcfb4bfddc044469b85b",class:this.getCssClassMap()},this.inheritedAttributes,{role:"list"}),this.renderHeader(),this.renderDivider(),i("slot",{key:"b41329f3ecd8cd06df7c186d52ea08e42679e31f"})))}static get formAssociated(){return true}get el(){return a(this)}};s.style=l;export{s as br_list};
|
|
2
|
+
//# sourceMappingURL=p-128b4b58.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["listCss","BrListStyle0","List","this","inheritedAttributes","renderHeader","_a","listTitle","length","hasSlotContent","h","class","name","connectedCallback","brDidConnect","emit","componentWillLoad","brWillLoad","inheritAriaAttributes","el","componentDidLoad","isHorizontal","slotItems","Array","from","querySelectorAll","forEach","item","nextElement","nextElementSibling","classList","contains","divider","style","borderWidth","width","items","setAttribute","brDidLoad","componentWillRender","brWillRender","componentDidRender","brDidRender","componentShouldUpdate","brShouldUpdate","componentWillUpdate","brWillUpdate","componentDidUpdate","brDidUpdate","disconnectedCallback","brDidDisconnect","formAssociatedCallback","form","brFormAssociatedCallback","formDisabledCallback","disabled","brFormDisabledCallback","formResetCallback","brFormResetCallback","formStateRestoreCallback","state","_mode","brFormStateRestoreCallback","getCssClassMap","horizontal","slotName","querySelector","renderDivider","hideHeaderDivider","render","Host","key","Object","assign","role"],"sources":["src/components/list/list.scss?tag=br-list&encapsulation=shadow","src/components/list/list.tsx"],"sourcesContent":["@import \"../../../../../node_modules/@govbr-ds/core/src/components/list/list.scss\";\n@import \"../../../../../node_modules/@govbr-ds/core/src/components/divider/divider.scss\";\n\n:host {\n display: block;\n\n .br-list.horizontal ::slotted(br-item) {\n flex: 1;\n height: auto;\n min-height: 56px;\n width: auto;\n }\n\n}\n","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"],"mappings":"oGAAA,MAAMA,EAAU,qtSAChB,MAAAC,EAAeD,E,MCeFE,EAAI,M,+0BAsLPC,KAAAC,oBAAkC,GAKzBD,KAAAE,aAAe,K,MAC9B,KAAIC,EAAAH,KAAKI,aAAS,MAAAD,SAAA,SAAAA,EAAEE,QAAS,GAAKL,KAAKM,eAAe,UAAW,CAC/D,OACEC,EAAA,OAAKC,MAAM,UACRR,KAAKI,WAAaG,EAAA,OAAKC,MAAM,SAASR,KAAKI,WAC3CJ,KAAKM,eAAe,WACnBC,EAAA,OAAKC,MAAM,UACTD,EAAA,QAAME,KAAK,Y,CAMrB,OAAO,IAAI,E,2CAvLoC,M,uBAKK,K,CAOtD,iBAAAC,GACEV,KAAKW,aAAaC,M,CASpB,iBAAAC,GACEb,KAAKc,WAAWF,OAChBZ,KAAKC,oBAAsBc,EAAsBf,KAAKgB,G,CASxD,gBAAAC,GACE,GAAIjB,KAAKkB,aAAc,CACrB,MAAMC,EAAYC,MAAMC,KAAKrB,KAAKgB,GAAGM,iBAAiB,YAEtDH,EAAUI,SAASC,IACjB,MAAMC,EAAcD,EAAKE,mBACzB,GAAID,IAAW,MAAXA,SAAW,SAAXA,EAAaE,UAAUC,SAAS,cAAe,CACjD,MAAMC,EAAUJ,EAChBI,EAAQC,MAAMC,YAAc,YAC5BF,EAAQC,MAAME,MAAQ,K,KAK5B,MAAMC,EAAQb,MAAMC,KAAKrB,KAAKgB,GAAGM,iBAAiB,YAClDW,EAAMV,SAASC,IACbA,EAAKU,aAAa,OAAQ,WAAW,IAGvClC,KAAKmC,UAAUvB,M,CASjB,mBAAAwB,GACEpC,KAAKqC,aAAazB,M,CASpB,kBAAA0B,GACEtC,KAAKuC,YAAY3B,M,CASnB,qBAAA4B,GACExC,KAAKyC,eAAe7B,M,CAStB,mBAAA8B,GACE1C,KAAK2C,aAAa/B,M,CASpB,kBAAAgC,GACE5C,KAAK6C,YAAYjC,M,CASnB,oBAAAkC,GACE9C,KAAK+C,gBAAgBnC,M,CAUvB,sBAAAoC,CAAuBC,GACrBjD,KAAKkD,yBAAyBtC,KAAKqC,E,CAUrC,oBAAAE,CAAqBC,GACnBpD,KAAKqD,uBAAuBzC,KAAKwC,E,CAQnC,iBAAAE,GACEtD,KAAKuD,oBAAoB3C,M,CAW3B,wBAAA4C,CAAyBC,EAAeC,GACtC1D,KAAK2D,2BAA2B/C,KAAK,CAAC6C,EAAOC,G,CAGvC,cAAAE,GACN,MAAO,CACL,UAAW,KACXC,WAAY7D,KAAKkB,a,CAMb,cAAAZ,CAAewD,GACrB,OAAO9D,KAAKgB,GAAG+C,cAAc,UAAUD,SAAkB,I,CAkBnD,aAAAE,GACN,IAAKhE,KAAKI,WAAaJ,KAAKM,eAAe,aAAeN,KAAKiE,kBAAmB,CAChF,OAAO1D,EAAA,OAAKC,MAAM,c,CAEpB,OAAO,I,CAGT,MAAA0D,GACE,OACE3D,EAAC4D,EAAI,CAAAC,IAAA,4CACH7D,EAAA,MAAA8D,OAAAC,OAAA,CAAAF,IAAA,2CAAK5D,MAAOR,KAAK4D,kBAAsB5D,KAAKC,oBAAmB,CAAEsE,KAAK,SACnEvE,KAAKE,eACLF,KAAKgE,gBACNzD,EAAA,QAAA6D,IAAA,8C","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["listCss","BrListStyle0","List","this","inheritedAttributes","renderHeader","_a","listTitle","length","hasSlotContent","h","class","name","connectedCallback","brDidConnect","emit","componentWillLoad","brWillLoad","inheritAriaAttributes","el","componentDidLoad","isHorizontal","slotItems","Array","from","querySelectorAll","forEach","item","nextElement","nextElementSibling","classList","contains","divider","style","borderWidth","width","items","setAttribute","brDidLoad","componentWillRender","brWillRender","componentDidRender","brDidRender","componentShouldUpdate","brShouldUpdate","componentWillUpdate","brWillUpdate","componentDidUpdate","brDidUpdate","disconnectedCallback","brDidDisconnect","formAssociatedCallback","form","brFormAssociatedCallback","formDisabledCallback","disabled","brFormDisabledCallback","formResetCallback","brFormResetCallback","formStateRestoreCallback","state","_mode","brFormStateRestoreCallback","getCssClassMap","horizontal","slotName","querySelector","renderDivider","hideHeaderDivider","render","Host","key","Object","assign","role"],"sources":["src/components/list/list.scss?tag=br-list&encapsulation=shadow","src/components/list/list.tsx"],"sourcesContent":["@import \"../../../../../node_modules/@govbr-ds/core/src/components/list/list.scss\";\n@import \"../../../../../node_modules/@govbr-ds/core/src/components/divider/divider.scss\";\n\n:host {\n display: block;\n\n .br-list.horizontal ::slotted(br-item) {\n flex: 1;\n height: auto;\n min-height: 56px;\n width: auto;\n }\n\n}\n","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"],"mappings":"+FAAA,MAAMA,EAAU,6rUAChB,MAAAC,EAAeD,E,MCeFE,EAAI,M,+0BAsLPC,KAAAC,oBAAkC,GAKzBD,KAAAE,aAAe,K,MAC9B,KAAIC,EAAAH,KAAKI,aAAS,MAAAD,SAAA,SAAAA,EAAEE,QAAS,GAAKL,KAAKM,eAAe,UAAW,CAC/D,OACEC,EAAA,OAAKC,MAAM,UACRR,KAAKI,WAAaG,EAAA,OAAKC,MAAM,SAASR,KAAKI,WAC3CJ,KAAKM,eAAe,WACnBC,EAAA,OAAKC,MAAM,UACTD,EAAA,QAAME,KAAK,Y,CAMrB,OAAO,IAAI,E,2CAvLoC,M,uBAKK,K,CAOtD,iBAAAC,GACEV,KAAKW,aAAaC,M,CASpB,iBAAAC,GACEb,KAAKc,WAAWF,OAChBZ,KAAKC,oBAAsBc,EAAsBf,KAAKgB,G,CASxD,gBAAAC,GACE,GAAIjB,KAAKkB,aAAc,CACrB,MAAMC,EAAYC,MAAMC,KAAKrB,KAAKgB,GAAGM,iBAAiB,YAEtDH,EAAUI,SAASC,IACjB,MAAMC,EAAcD,EAAKE,mBACzB,GAAID,IAAW,MAAXA,SAAW,SAAXA,EAAaE,UAAUC,SAAS,cAAe,CACjD,MAAMC,EAAUJ,EAChBI,EAAQC,MAAMC,YAAc,YAC5BF,EAAQC,MAAME,MAAQ,K,KAK5B,MAAMC,EAAQb,MAAMC,KAAKrB,KAAKgB,GAAGM,iBAAiB,YAClDW,EAAMV,SAASC,IACbA,EAAKU,aAAa,OAAQ,WAAW,IAGvClC,KAAKmC,UAAUvB,M,CASjB,mBAAAwB,GACEpC,KAAKqC,aAAazB,M,CASpB,kBAAA0B,GACEtC,KAAKuC,YAAY3B,M,CASnB,qBAAA4B,GACExC,KAAKyC,eAAe7B,M,CAStB,mBAAA8B,GACE1C,KAAK2C,aAAa/B,M,CASpB,kBAAAgC,GACE5C,KAAK6C,YAAYjC,M,CASnB,oBAAAkC,GACE9C,KAAK+C,gBAAgBnC,M,CAUvB,sBAAAoC,CAAuBC,GACrBjD,KAAKkD,yBAAyBtC,KAAKqC,E,CAUrC,oBAAAE,CAAqBC,GACnBpD,KAAKqD,uBAAuBzC,KAAKwC,E,CAQnC,iBAAAE,GACEtD,KAAKuD,oBAAoB3C,M,CAW3B,wBAAA4C,CAAyBC,EAAeC,GACtC1D,KAAK2D,2BAA2B/C,KAAK,CAAC6C,EAAOC,G,CAGvC,cAAAE,GACN,MAAO,CACL,UAAW,KACXC,WAAY7D,KAAKkB,a,CAMb,cAAAZ,CAAewD,GACrB,OAAO9D,KAAKgB,GAAG+C,cAAc,UAAUD,SAAkB,I,CAkBnD,aAAAE,GACN,IAAKhE,KAAKI,WAAaJ,KAAKM,eAAe,aAAeN,KAAKiE,kBAAmB,CAChF,OAAO1D,EAAA,OAAKC,MAAM,c,CAEpB,OAAO,I,CAGT,MAAA0D,GACE,OACE3D,EAAC4D,EAAI,CAAAC,IAAA,4CACH7D,EAAA,MAAA8D,OAAAC,OAAA,CAAAF,IAAA,2CAAK5D,MAAOR,KAAK4D,kBAAsB5D,KAAKC,oBAAmB,CAAEsE,KAAK,SACnEvE,KAAKE,eACLF,KAAKgE,gBACNzD,EAAA,QAAA6D,IAAA,8C","ignoreList":[]}
|