@govbr-ds/webcomponents 2.0.0-next.21 → 2.0.0-next.23
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/LICENSE +1 -1
- package/README.md +99 -90
- package/package.json +16 -52
- package/dist/cjs/app-globals-77a217c6.js +0 -11
- package/dist/cjs/app-globals-77a217c6.js.map +0 -1
- package/dist/cjs/br-avatar.cjs.entry.js +0 -77
- package/dist/cjs/br-avatar.cjs.entry.js.map +0 -1
- package/dist/cjs/br-button_2.cjs.entry.js +0 -2491
- package/dist/cjs/br-button_2.cjs.entry.js.map +0 -1
- package/dist/cjs/br-checkbox_4.cjs.entry.js +0 -346
- package/dist/cjs/br-checkbox_4.cjs.entry.js.map +0 -1
- package/dist/cjs/br-dropdown.cjs.entry.js +0 -100
- package/dist/cjs/br-dropdown.cjs.entry.js.map +0 -1
- package/dist/cjs/br-item.cjs.entry.js +0 -146
- package/dist/cjs/br-item.cjs.entry.js.map +0 -1
- package/dist/cjs/br-loading.cjs.entry.js +0 -43
- package/dist/cjs/br-loading.cjs.entry.js.map +0 -1
- package/dist/cjs/br-message.cjs.entry.js +0 -68
- package/dist/cjs/br-message.cjs.entry.js.map +0 -1
- package/dist/cjs/br-select.cjs.entry.js +0 -281
- package/dist/cjs/br-select.cjs.entry.js.map +0 -1
- package/dist/cjs/br-switch.cjs.entry.js +0 -81
- package/dist/cjs/br-switch.cjs.entry.js.map +0 -1
- package/dist/cjs/br-tag.cjs.entry.js +0 -88
- package/dist/cjs/br-tag.cjs.entry.js.map +0 -1
- package/dist/cjs/br-textarea.cjs.entry.js +0 -102
- package/dist/cjs/br-textarea.cjs.entry.js.map +0 -1
- package/dist/cjs/br-upload.cjs.entry.js +0 -168
- package/dist/cjs/br-upload.cjs.entry.js.map +0 -1
- package/dist/cjs/index-86e7422e.js +0 -1856
- package/dist/cjs/index-86e7422e.js.map +0 -1
- package/dist/cjs/index.cjs.js +0 -8
- package/dist/cjs/index.cjs.js.map +0 -1
- package/dist/cjs/inherited-attributes-16f7d388.js +0 -107
- package/dist/cjs/inherited-attributes-16f7d388.js.map +0 -1
- package/dist/cjs/loader.cjs.js +0 -21
- package/dist/cjs/loader.cjs.js.map +0 -1
- package/dist/cjs/v4-2a0fe526.js +0 -74
- package/dist/cjs/v4-2a0fe526.js.map +0 -1
- package/dist/cjs/webcomponents.cjs.js +0 -52
- package/dist/cjs/webcomponents.cjs.js.map +0 -1
- package/dist/collection/collection-manifest.json +0 -27
- package/dist/collection/components/avatar/avatar.css +0 -540
- package/dist/collection/components/avatar/avatar.js +0 -222
- package/dist/collection/components/avatar/avatar.js.map +0 -1
- package/dist/collection/components/button/button.css +0 -802
- package/dist/collection/components/button/button.js +0 -236
- package/dist/collection/components/button/button.js.map +0 -1
- package/dist/collection/components/checkbox/checkbox.css +0 -597
- package/dist/collection/components/checkbox/checkbox.js +0 -279
- package/dist/collection/components/checkbox/checkbox.js.map +0 -1
- package/dist/collection/components/dropdown/dropdown.css +0 -467
- package/dist/collection/components/dropdown/dropdown.js +0 -185
- package/dist/collection/components/dropdown/dropdown.js.map +0 -1
- package/dist/collection/components/icon/icon.css +0 -452
- package/dist/collection/components/icon/icon.js +0 -176
- package/dist/collection/components/icon/icon.js.map +0 -1
- package/dist/collection/components/input/input.css +0 -673
- package/dist/collection/components/input/input.js +0 -580
- package/dist/collection/components/input/input.js.map +0 -1
- package/dist/collection/components/item/item.css +0 -662
- package/dist/collection/components/item/item.js +0 -376
- package/dist/collection/components/item/item.js.map +0 -1
- package/dist/collection/components/list/list.css +0 -564
- package/dist/collection/components/list/list.js +0 -138
- package/dist/collection/components/list/list.js.map +0 -1
- package/dist/collection/components/loading/loading.css +0 -653
- package/dist/collection/components/loading/loading.js +0 -119
- package/dist/collection/components/loading/loading.js.map +0 -1
- package/dist/collection/components/message/message.css +0 -600
- package/dist/collection/components/message/message.js +0 -211
- package/dist/collection/components/message/message.js.map +0 -1
- package/dist/collection/components/radio/radio.css +0 -552
- package/dist/collection/components/radio/radio.js +0 -247
- package/dist/collection/components/radio/radio.js.map +0 -1
- package/dist/collection/components/select/select.css +0 -857
- package/dist/collection/components/select/select.js +0 -491
- package/dist/collection/components/select/select.js.map +0 -1
- package/dist/collection/components/switch/switch.css +0 -623
- package/dist/collection/components/switch/switch.js +0 -320
- package/dist/collection/components/switch/switch.js.map +0 -1
- package/dist/collection/components/tag/tag.css +0 -645
- package/dist/collection/components/tag/tag.js +0 -256
- package/dist/collection/components/tag/tag.js.map +0 -1
- package/dist/collection/components/textarea/textarea.css +0 -518
- package/dist/collection/components/textarea/textarea.js +0 -298
- package/dist/collection/components/textarea/textarea.js.map +0 -1
- package/dist/collection/components/upload/upload.css +0 -562
- package/dist/collection/components/upload/upload.js +0 -469
- package/dist/collection/components/upload/upload.js.map +0 -1
- package/dist/collection/index.js +0 -2
- package/dist/collection/index.js.map +0 -1
- package/dist/collection/pages/components/button/index.js +0 -18
- package/dist/collection/pages/components/checkbox/index.js +0 -18
- package/dist/collection/pages/components/dropdown/index.js +0 -18
- package/dist/collection/pages/components/icon/index.js +0 -18
- package/dist/collection/pages/components/input/index.js +0 -27
- package/dist/collection/pages/components/item/index.js +0 -18
- package/dist/collection/pages/components/list/index.js +0 -19
- package/dist/collection/pages/components/message/index.js +0 -18
- package/dist/collection/pages/components/radio/index.js +0 -18
- package/dist/collection/pages/components/select/index.js +0 -18
- package/dist/collection/pages/components/switch/index.js +0 -18
- package/dist/collection/pages/components/tag/index.js +0 -18
- package/dist/collection/pages/components/textarea/index.js +0 -19
- package/dist/collection/pages/components/upload/index.js +0 -19
- package/dist/collection/pages/scripts/menu.js +0 -226
- package/dist/collection/pages/scripts/pageLoader.js +0 -180
- package/dist/collection/scripts/menu.js +0 -151
- package/dist/collection/utils/inherited-attributes.js +0 -102
- package/dist/collection/utils/inherited-attributes.js.map +0 -1
- package/dist/collection/utils/interfaces.js +0 -2
- package/dist/collection/utils/interfaces.js.map +0 -1
- package/dist/collection/utils/unique-id-generator.js +0 -13
- package/dist/collection/utils/unique-id-generator.js.map +0 -1
- package/dist/components/br-avatar.d.ts +0 -11
- package/dist/components/br-avatar.js +0 -6
- package/dist/components/br-avatar.js.map +0 -1
- package/dist/components/br-button.d.ts +0 -11
- package/dist/components/br-button.js +0 -6
- package/dist/components/br-button.js.map +0 -1
- package/dist/components/br-checkbox.d.ts +0 -11
- package/dist/components/br-checkbox.js +0 -6
- package/dist/components/br-checkbox.js.map +0 -1
- package/dist/components/br-dropdown.d.ts +0 -11
- package/dist/components/br-dropdown.js +0 -6
- package/dist/components/br-dropdown.js.map +0 -1
- package/dist/components/br-icon.d.ts +0 -11
- package/dist/components/br-icon.js +0 -6
- package/dist/components/br-icon.js.map +0 -1
- package/dist/components/br-input.d.ts +0 -11
- package/dist/components/br-input.js +0 -6
- package/dist/components/br-input.js.map +0 -1
- package/dist/components/br-item.d.ts +0 -11
- package/dist/components/br-item.js +0 -6
- package/dist/components/br-item.js.map +0 -1
- package/dist/components/br-list.d.ts +0 -11
- package/dist/components/br-list.js +0 -6
- package/dist/components/br-list.js.map +0 -1
- package/dist/components/br-loading.d.ts +0 -11
- package/dist/components/br-loading.js +0 -6
- package/dist/components/br-loading.js.map +0 -1
- package/dist/components/br-message.d.ts +0 -11
- package/dist/components/br-message.js +0 -6
- package/dist/components/br-message.js.map +0 -1
- package/dist/components/br-radio.d.ts +0 -11
- package/dist/components/br-radio.js +0 -6
- package/dist/components/br-radio.js.map +0 -1
- package/dist/components/br-select.d.ts +0 -11
- package/dist/components/br-select.js +0 -6
- package/dist/components/br-select.js.map +0 -1
- package/dist/components/br-switch.d.ts +0 -11
- package/dist/components/br-switch.js +0 -6
- package/dist/components/br-switch.js.map +0 -1
- package/dist/components/br-tag.d.ts +0 -11
- package/dist/components/br-tag.js +0 -6
- package/dist/components/br-tag.js.map +0 -1
- package/dist/components/br-textarea.d.ts +0 -11
- package/dist/components/br-textarea.js +0 -6
- package/dist/components/br-textarea.js.map +0 -1
- package/dist/components/br-upload.d.ts +0 -11
- package/dist/components/br-upload.js +0 -6
- package/dist/components/br-upload.js.map +0 -1
- package/dist/components/index.d.ts +0 -33
- package/dist/components/index.js +0 -6
- package/dist/components/index.js.map +0 -1
- package/dist/components/p-22068d3c.js +0 -6
- package/dist/components/p-22068d3c.js.map +0 -1
- package/dist/components/p-62776355.js +0 -6
- package/dist/components/p-62776355.js.map +0 -1
- package/dist/components/p-67617725.js +0 -6
- package/dist/components/p-67617725.js.map +0 -1
- package/dist/components/p-74a4eb38.js +0 -6
- package/dist/components/p-74a4eb38.js.map +0 -1
- package/dist/components/p-7882cb21.js +0 -6
- package/dist/components/p-7882cb21.js.map +0 -1
- package/dist/components/p-7aca304a.js +0 -6
- package/dist/components/p-7aca304a.js.map +0 -1
- package/dist/components/p-b4b55ab7.js +0 -17
- package/dist/components/p-b4b55ab7.js.map +0 -1
- package/dist/components/p-d5a8d30c.js +0 -6
- package/dist/components/p-d5a8d30c.js.map +0 -1
- package/dist/components/p-fabd9bdd.js +0 -7
- package/dist/components/p-fabd9bdd.js.map +0 -1
- package/dist/esm/app-globals-72548b13.js +0 -9
- package/dist/esm/app-globals-72548b13.js.map +0 -1
- package/dist/esm/br-avatar.entry.js +0 -73
- package/dist/esm/br-avatar.entry.js.map +0 -1
- package/dist/esm/br-button_2.entry.js +0 -2486
- package/dist/esm/br-button_2.entry.js.map +0 -1
- package/dist/esm/br-checkbox_4.entry.js +0 -339
- package/dist/esm/br-checkbox_4.entry.js.map +0 -1
- package/dist/esm/br-dropdown.entry.js +0 -96
- package/dist/esm/br-dropdown.entry.js.map +0 -1
- package/dist/esm/br-item.entry.js +0 -142
- package/dist/esm/br-item.entry.js.map +0 -1
- package/dist/esm/br-loading.entry.js +0 -39
- package/dist/esm/br-loading.entry.js.map +0 -1
- package/dist/esm/br-message.entry.js +0 -64
- package/dist/esm/br-message.entry.js.map +0 -1
- package/dist/esm/br-select.entry.js +0 -277
- package/dist/esm/br-select.entry.js.map +0 -1
- package/dist/esm/br-switch.entry.js +0 -77
- package/dist/esm/br-switch.entry.js.map +0 -1
- package/dist/esm/br-tag.entry.js +0 -84
- package/dist/esm/br-tag.entry.js.map +0 -1
- package/dist/esm/br-textarea.entry.js +0 -98
- package/dist/esm/br-textarea.entry.js.map +0 -1
- package/dist/esm/br-upload.entry.js +0 -164
- package/dist/esm/br-upload.entry.js.map +0 -1
- package/dist/esm/index-14721f44.js +0 -1826
- package/dist/esm/index-14721f44.js.map +0 -1
- package/dist/esm/index.js +0 -6
- package/dist/esm/index.js.map +0 -1
- package/dist/esm/inherited-attributes-553a7c36.js +0 -105
- package/dist/esm/inherited-attributes-553a7c36.js.map +0 -1
- package/dist/esm/loader.js +0 -17
- package/dist/esm/loader.js.map +0 -1
- package/dist/esm/polyfills/core-js.js +0 -11
- package/dist/esm/polyfills/dom.js +0 -79
- package/dist/esm/polyfills/es5-html-element.js +0 -1
- package/dist/esm/polyfills/index.js +0 -34
- package/dist/esm/polyfills/system.js +0 -6
- package/dist/esm/v4-c99c1585.js +0 -72
- package/dist/esm/v4-c99c1585.js.map +0 -1
- package/dist/esm/webcomponents.js +0 -47
- package/dist/esm/webcomponents.js.map +0 -1
- package/dist/esm-es5/app-globals-72548b13.js +0 -6
- package/dist/esm-es5/app-globals-72548b13.js.map +0 -1
- package/dist/esm-es5/br-avatar.entry.js +0 -6
- package/dist/esm-es5/br-avatar.entry.js.map +0 -1
- package/dist/esm-es5/br-button_2.entry.js +0 -17
- package/dist/esm-es5/br-button_2.entry.js.map +0 -1
- package/dist/esm-es5/br-checkbox_4.entry.js +0 -6
- package/dist/esm-es5/br-checkbox_4.entry.js.map +0 -1
- package/dist/esm-es5/br-dropdown.entry.js +0 -6
- package/dist/esm-es5/br-dropdown.entry.js.map +0 -1
- package/dist/esm-es5/br-item.entry.js +0 -6
- package/dist/esm-es5/br-item.entry.js.map +0 -1
- package/dist/esm-es5/br-loading.entry.js +0 -6
- package/dist/esm-es5/br-loading.entry.js.map +0 -1
- package/dist/esm-es5/br-message.entry.js +0 -6
- package/dist/esm-es5/br-message.entry.js.map +0 -1
- package/dist/esm-es5/br-select.entry.js +0 -6
- package/dist/esm-es5/br-select.entry.js.map +0 -1
- package/dist/esm-es5/br-switch.entry.js +0 -6
- package/dist/esm-es5/br-switch.entry.js.map +0 -1
- package/dist/esm-es5/br-tag.entry.js +0 -6
- package/dist/esm-es5/br-tag.entry.js.map +0 -1
- package/dist/esm-es5/br-textarea.entry.js +0 -6
- package/dist/esm-es5/br-textarea.entry.js.map +0 -1
- package/dist/esm-es5/br-upload.entry.js +0 -6
- package/dist/esm-es5/br-upload.entry.js.map +0 -1
- package/dist/esm-es5/index-14721f44.js +0 -6
- package/dist/esm-es5/index-14721f44.js.map +0 -1
- package/dist/esm-es5/index.js +0 -5
- package/dist/esm-es5/index.js.map +0 -1
- package/dist/esm-es5/inherited-attributes-553a7c36.js +0 -6
- package/dist/esm-es5/inherited-attributes-553a7c36.js.map +0 -1
- package/dist/esm-es5/loader.js +0 -6
- package/dist/esm-es5/loader.js.map +0 -1
- package/dist/esm-es5/v4-c99c1585.js +0 -6
- package/dist/esm-es5/v4-c99c1585.js.map +0 -1
- package/dist/esm-es5/webcomponents.js +0 -6
- package/dist/esm-es5/webcomponents.js.map +0 -1
- package/dist/index.cjs.js +0 -1
- package/dist/index.js +0 -1
- package/dist/playwright.config.js +0 -39
- package/dist/playwright.config.js.map +0 -1
- package/dist/types/builds/govbr-ds/bibliotecas/wbc/govbr-ds-wbc/packages/webcomponents/.stencil/playwright.config.d.ts +0 -5
- package/dist/types/components/avatar/avatar.d.ts +0 -60
- package/dist/types/components/button/button.d.ts +0 -64
- package/dist/types/components/checkbox/checkbox.d.ts +0 -78
- package/dist/types/components/dropdown/dropdown.d.ts +0 -64
- package/dist/types/components/icon/icon.d.ts +0 -58
- package/dist/types/components/input/input.d.ts +0 -151
- package/dist/types/components/item/item.d.ts +0 -96
- package/dist/types/components/list/list.d.ts +0 -34
- package/dist/types/components/loading/loading.d.ts +0 -34
- package/dist/types/components/message/message.d.ts +0 -62
- package/dist/types/components/radio/radio.d.ts +0 -75
- package/dist/types/components/select/select.d.ts +0 -98
- package/dist/types/components/switch/switch.d.ts +0 -78
- package/dist/types/components/tag/tag.d.ts +0 -73
- package/dist/types/components/textarea/textarea.d.ts +0 -66
- package/dist/types/components/upload/upload.d.ts +0 -160
- package/dist/types/components.d.ts +0 -1790
- package/dist/types/index.d.ts +0 -10
- package/dist/types/stencil-public-runtime.d.ts +0 -1680
- package/dist/types/utils/inherited-attributes.d.ts +0 -20
- package/dist/types/utils/interfaces.d.ts +0 -3
- package/dist/types/utils/unique-id-generator.d.ts +0 -1
- package/dist/webcomponents/index.esm.js +0 -6
- package/dist/webcomponents/index.esm.js.map +0 -1
- package/dist/webcomponents/p-11e8c72f.entry.js +0 -6
- package/dist/webcomponents/p-11e8c72f.entry.js.map +0 -1
- package/dist/webcomponents/p-1accc2ab.system.entry.js +0 -6
- package/dist/webcomponents/p-1accc2ab.system.entry.js.map +0 -1
- package/dist/webcomponents/p-254a2b7c.js +0 -6
- package/dist/webcomponents/p-254a2b7c.js.map +0 -1
- package/dist/webcomponents/p-36e48582.system.entry.js +0 -6
- package/dist/webcomponents/p-36e48582.system.entry.js.map +0 -1
- package/dist/webcomponents/p-37440256.entry.js +0 -6
- package/dist/webcomponents/p-37440256.entry.js.map +0 -1
- package/dist/webcomponents/p-44554246.system.entry.js +0 -6
- package/dist/webcomponents/p-44554246.system.entry.js.map +0 -1
- package/dist/webcomponents/p-55f80a96.system.entry.js +0 -6
- package/dist/webcomponents/p-55f80a96.system.entry.js.map +0 -1
- package/dist/webcomponents/p-563bea26.entry.js +0 -6
- package/dist/webcomponents/p-563bea26.entry.js.map +0 -1
- package/dist/webcomponents/p-58d37ac2.entry.js +0 -6
- package/dist/webcomponents/p-58d37ac2.entry.js.map +0 -1
- package/dist/webcomponents/p-64f4ecea.system.entry.js +0 -6
- package/dist/webcomponents/p-64f4ecea.system.entry.js.map +0 -1
- package/dist/webcomponents/p-6e286eba.system.js +0 -6
- package/dist/webcomponents/p-6e286eba.system.js.map +0 -1
- package/dist/webcomponents/p-703a633a.system.js +0 -6
- package/dist/webcomponents/p-703a633a.system.js.map +0 -1
- package/dist/webcomponents/p-74a4eb38.js +0 -6
- package/dist/webcomponents/p-74a4eb38.js.map +0 -1
- package/dist/webcomponents/p-76326737.system.entry.js +0 -6
- package/dist/webcomponents/p-76326737.system.entry.js.map +0 -1
- package/dist/webcomponents/p-797376a2.system.entry.js +0 -17
- package/dist/webcomponents/p-797376a2.system.entry.js.map +0 -1
- package/dist/webcomponents/p-7f8c5016.entry.js +0 -6
- package/dist/webcomponents/p-7f8c5016.entry.js.map +0 -1
- package/dist/webcomponents/p-90e2e623.system.js +0 -6
- package/dist/webcomponents/p-90e2e623.system.js.map +0 -1
- package/dist/webcomponents/p-a44ad074.entry.js +0 -6
- package/dist/webcomponents/p-a44ad074.entry.js.map +0 -1
- package/dist/webcomponents/p-a71689a5.system.js +0 -6
- package/dist/webcomponents/p-a71689a5.system.js.map +0 -1
- package/dist/webcomponents/p-aaa17439.entry.js +0 -6
- package/dist/webcomponents/p-aaa17439.entry.js.map +0 -1
- package/dist/webcomponents/p-aaca726d.system.js +0 -7
- package/dist/webcomponents/p-aaca726d.system.js.map +0 -1
- package/dist/webcomponents/p-aec894fa.system.entry.js +0 -6
- package/dist/webcomponents/p-aec894fa.system.entry.js.map +0 -1
- package/dist/webcomponents/p-b16b1de5.entry.js +0 -6
- package/dist/webcomponents/p-b16b1de5.entry.js.map +0 -1
- package/dist/webcomponents/p-b6af61ad.entry.js +0 -6
- package/dist/webcomponents/p-b6af61ad.entry.js.map +0 -1
- package/dist/webcomponents/p-c696c385.entry.js +0 -17
- package/dist/webcomponents/p-c696c385.entry.js.map +0 -1
- package/dist/webcomponents/p-d1e0a8ff.entry.js +0 -6
- package/dist/webcomponents/p-d1e0a8ff.entry.js.map +0 -1
- package/dist/webcomponents/p-d31732da.system.entry.js +0 -6
- package/dist/webcomponents/p-d31732da.system.entry.js.map +0 -1
- package/dist/webcomponents/p-d5a8d30c.js +0 -6
- package/dist/webcomponents/p-d5a8d30c.js.map +0 -1
- package/dist/webcomponents/p-db4b272c.system.entry.js +0 -6
- package/dist/webcomponents/p-db4b272c.system.entry.js.map +0 -1
- package/dist/webcomponents/p-dbd35139.js +0 -7
- package/dist/webcomponents/p-dbd35139.js.map +0 -1
- package/dist/webcomponents/p-e751c991.system.js +0 -6
- package/dist/webcomponents/p-e751c991.system.js.map +0 -1
- package/dist/webcomponents/p-e76f7113.system.entry.js +0 -6
- package/dist/webcomponents/p-e76f7113.system.entry.js.map +0 -1
- package/dist/webcomponents/p-f05d11f7.entry.js +0 -6
- package/dist/webcomponents/p-f05d11f7.entry.js.map +0 -1
- package/dist/webcomponents/p-f5412db6.system.entry.js +0 -6
- package/dist/webcomponents/p-f5412db6.system.entry.js.map +0 -1
- package/dist/webcomponents/webcomponents.esm.js +0 -6
- package/dist/webcomponents/webcomponents.esm.js.map +0 -1
- package/dist/webcomponents/webcomponents.js +0 -127
- package/hydrate/index.d.ts +0 -242
- package/hydrate/index.js +0 -22414
- package/hydrate/index.mjs +0 -22406
- package/hydrate/package.json +0 -12
- package/loader/cdn.js +0 -6
- package/loader/index.cjs.js +0 -6
- package/loader/index.d.ts +0 -24
- package/loader/index.es2017.js +0 -6
- package/loader/index.js +0 -7
- package/loader/package.json +0 -11
- package/vscode-data.json +0 -960
|
@@ -1,96 +0,0 @@
|
|
|
1
|
-
/*!
|
|
2
|
-
* Construído com @govbr-ds/webcomponents
|
|
3
|
-
* Padrão Digital de Governo.
|
|
4
|
-
*/
|
|
5
|
-
import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-14721f44.js';
|
|
6
|
-
import { i as inheritAriaAttributes } from './inherited-attributes-553a7c36.js';
|
|
7
|
-
|
|
8
|
-
const dropdownCss = "*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}html{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%}body{margin:0}a{background-color:transparent}strong{font-weight:bolder}small{font-size:80%}img{border-style:none}button,input,select,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button,select{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]{-webkit-box-sizing:border-box;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:-ms-flexbox !important;display:flex !important}.align-items-center{-ms-flex-align:center !important;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{-ms-flex:1 0 0%;flex:1 0 0%;min-width:8.3333333333%}.col-auto{-ms-flex:0 0 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:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;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}.mr-n2{margin-right:calc(var(--spacing-scale-base) * -1) !important}.mb-3{margin-bottom:var(--spacing-scale-2x) !important}.mr-auto{margin-right:auto !important}.pt-half{padding-top:var(--spacing-scale-half) !important}.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:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--interactive-rgb), var(--hover))), to(rgba(var(--interactive-rgb), var(--hover))));background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--interactive-rgb), var(--pressed))), to(rgba(var(--interactive-rgb), var(--pressed))));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}::-webkit-input-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}:-ms-input-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}::-ms-input-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)}.text-pure-0{color:var(--pure-0) !important}.text-primary-default{color:var(--color-primary-default) !important}.bg-support-01{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--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) -webkit-gradient(linear, left top, left bottom, from(var(--status-highlight-overlay)), to(var(--status-highlight-overlay)));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]+*{-webkit-box-shadow:var(--surface-shadow-sm);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)}:host{display:block;position:relative}:host #trigger{display:inline-block;cursor:pointer}:host #target{display:none;position:absolute;top:100%;left:0}:host([is-open]) #target{display:block}";
|
|
9
|
-
const BrDropdownStyle0 = dropdownCss;
|
|
10
|
-
|
|
11
|
-
const Dropdown = class {
|
|
12
|
-
constructor(hostRef) {
|
|
13
|
-
registerInstance(this, hostRef);
|
|
14
|
-
this.brDropdownChange = createEvent(this, "brDropdownChange", 7);
|
|
15
|
-
if (hostRef.$hostElement$["s-ei"]) {
|
|
16
|
-
this.elementInternals = hostRef.$hostElement$["s-ei"];
|
|
17
|
-
}
|
|
18
|
-
else {
|
|
19
|
-
this.elementInternals = hostRef.$hostElement$.attachInternals();
|
|
20
|
-
hostRef.$hostElement$["s-ei"] = this.elementInternals;
|
|
21
|
-
}
|
|
22
|
-
/**
|
|
23
|
-
* Alterna o estado do dropdown entre aberto e fechado.
|
|
24
|
-
*/
|
|
25
|
-
this.toggle = (event) => {
|
|
26
|
-
event.stopPropagation();
|
|
27
|
-
this.isOpen = !this.isOpen;
|
|
28
|
-
};
|
|
29
|
-
this.inheritedAttributes = {};
|
|
30
|
-
this.isOpen = false;
|
|
31
|
-
}
|
|
32
|
-
/**
|
|
33
|
-
* Método chamado sempre que a propriedade `isOpen` muda.
|
|
34
|
-
* Emite um evento com o novo estado do dropdown.
|
|
35
|
-
*/
|
|
36
|
-
isOpenChanged() {
|
|
37
|
-
this.brDropdownChange.emit({ 'is-opened': this.isOpen });
|
|
38
|
-
}
|
|
39
|
-
connectedCallback() {
|
|
40
|
-
document.addEventListener('click', this.onClickOutside.bind(this));
|
|
41
|
-
}
|
|
42
|
-
componentWillLoad() {
|
|
43
|
-
this.inheritedAttributes = inheritAriaAttributes(this.el);
|
|
44
|
-
}
|
|
45
|
-
disconnectedCallback() {
|
|
46
|
-
document.removeEventListener('click', this.onClickOutside.bind(this));
|
|
47
|
-
}
|
|
48
|
-
getCssClassMap() {
|
|
49
|
-
return {
|
|
50
|
-
'br-dropdown': true,
|
|
51
|
-
};
|
|
52
|
-
}
|
|
53
|
-
/**
|
|
54
|
-
* Método que lida com cliques fora do dropdown.
|
|
55
|
-
*
|
|
56
|
-
* @param {MouseEvent} event - O evento de clique que ocorreu.
|
|
57
|
-
*/
|
|
58
|
-
onClickOutside(event) {
|
|
59
|
-
const path = event.composedPath();
|
|
60
|
-
const dropdownElement = this.el.shadowRoot.querySelector('#target');
|
|
61
|
-
if (dropdownElement && !path.includes(dropdownElement)) {
|
|
62
|
-
this.hide();
|
|
63
|
-
}
|
|
64
|
-
}
|
|
65
|
-
/**
|
|
66
|
-
* Abre o dropdown.
|
|
67
|
-
* Define a propriedade `isOpen` como verdadeira e retorna o novo estado.
|
|
68
|
-
* Este método é marcado com @Method() para que possa ser chamado externamente.
|
|
69
|
-
*/
|
|
70
|
-
async open() {
|
|
71
|
-
this.isOpen = true;
|
|
72
|
-
return { isOpen: this.isOpen }; // Retorna o novo estado
|
|
73
|
-
}
|
|
74
|
-
/**
|
|
75
|
-
* Esconde o dropdown.
|
|
76
|
-
* Define a propriedade `isOpen` como falsa e retorna o novo estado.
|
|
77
|
-
* Este método é marcado com @Method() para que possa ser chamado externamente.
|
|
78
|
-
*/
|
|
79
|
-
async hide() {
|
|
80
|
-
this.isOpen = false;
|
|
81
|
-
return { isOpen: this.isOpen }; // Retorna o novo estado
|
|
82
|
-
}
|
|
83
|
-
render() {
|
|
84
|
-
return (h(Host, { key: '5a14d5ee59bb7b245085cac751c6b3ca2964c313', "is-open": this.isOpen }, h("div", Object.assign({ key: '7e1ef66474efe1fc9916cfcd623520d6dd6a4cd6', class: this.getCssClassMap() }, this.inheritedAttributes), h("div", { key: 'e7e75bde235c6ee16eca052733b0183842a6d0fd', id: "trigger", onClick: this.toggle, "aria-controls": "target", "aria-haspopup": "true", "aria-expanded": this.isOpen }, h("slot", { key: 'dfd29202462c590e31c302a1a6c73aa5013e6d4d', name: "trigger" })), h("div", { key: '6481087ab2204e956e526049ecb8702a6f2c6c49', id: "target", "aria-hidden": !this.isOpen }, h("slot", { key: 'fd4b9c9f029b45f0c5b5fafb4803421e959fa6fd', name: "target" })))));
|
|
85
|
-
}
|
|
86
|
-
static get formAssociated() { return true; }
|
|
87
|
-
get el() { return getElement(this); }
|
|
88
|
-
static get watchers() { return {
|
|
89
|
-
"isOpen": ["isOpenChanged"]
|
|
90
|
-
}; }
|
|
91
|
-
};
|
|
92
|
-
Dropdown.style = BrDropdownStyle0;
|
|
93
|
-
|
|
94
|
-
export { Dropdown as br_dropdown };
|
|
95
|
-
|
|
96
|
-
//# sourceMappingURL=br-dropdown.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"br-dropdown.entry.js","mappings":";;;;;;;AAAA,MAAM,WAAW,GAAG,6kTAA6kT,CAAC;AAClmT,yBAAe,WAAW;;MCeb,QAAQ;;;;;;;;;;;;;;QAmDF,WAAM,GAAG,CAAC,KAAY;YACrC,KAAK,CAAC,eAAe,EAAE,CAAA;YACvB,IAAI,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,MAAM,CAAA;SAC3B,CAAA;QAsCO,wBAAmB,GAAe,EAAE,CAAA;sBA9Ec,KAAK;;;;;;IAO/D,aAAa;QACX,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,EAAE,WAAW,EAAE,IAAI,CAAC,MAAM,EAAE,CAAC,CAAA;KACzD;IAED,iBAAiB;QACf,QAAQ,CAAC,gBAAgB,CAAC,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;KACnE;IAED,iBAAiB;QACf,IAAI,CAAC,mBAAmB,GAAG,qBAAqB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;KAC1D;IAED,oBAAoB;QAClB,QAAQ,CAAC,mBAAmB,CAAC,OAAO,EAAE,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAA;KACtE;IAOO,cAAc;QACpB,OAAO;YACL,aAAa,EAAE,IAAI;SACpB,CAAA;KACF;;;;;;IAeO,cAAc,CAAC,KAAiB;QACtC,MAAM,IAAI,GAAG,KAAK,CAAC,YAAY,EAAE,CAAA;QACjC,MAAM,eAAe,GAAG,IAAI,CAAC,EAAE,CAAC,UAAU,CAAC,aAAa,CAAC,SAAS,CAAC,CAAA;QAEnE,IAAI,eAAe,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,eAAe,CAAC,EAAE;YACtD,IAAI,CAAC,IAAI,EAAE,CAAA;SACZ;KACF;;;;;;IAQD,MAAM,IAAI;QACR,IAAI,CAAC,MAAM,GAAG,IAAI,CAAA;QAClB,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAA;KAC/B;;;;;;IAQD,MAAM,IAAI;QACR,IAAI,CAAC,MAAM,GAAG,KAAK,CAAA;QACnB,OAAO,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAA;KAC/B;IAID,MAAM;QACJ,QACE,EAAC,IAAI,gEAAU,IAAI,CAAC,MAAM,IACxB,0EAAK,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,IAAM,IAAI,CAAC,mBAAmB,GAC7D,4DACE,EAAE,EAAC,SAAS,EACZ,OAAO,EAAE,IAAI,CAAC,MAAM,mBACN,QAAQ,mBACR,MAAM,mBACL,IAAI,CAAC,MAAM,IAE1B,6DAAM,IAAI,EAAC,SAAS,GAAQ,CACxB,EACN,4DAAK,EAAE,EAAC,QAAQ,iBAAc,CAAC,IAAI,CAAC,MAAM,IACxC,6DAAM,IAAI,EAAC,QAAQ,GAAQ,CACvB,CACF,CACD,EACR;KACF;;;;;;;;;;;","names":[],"sources":["src/components/dropdown/dropdown.scss?tag=br-dropdown&encapsulation=shadow","src/components/dropdown/dropdown.tsx"],"sourcesContent":[":host {\n display: block;\n position: relative;\n\n #trigger {\n display: inline-block;\n cursor: pointer;\n }\n\n #target {\n display: none;\n position: absolute;\n top: 100%;\n left: 0;\n }\n}\n\n:host([is-open]) {\n #target {\n display: block;\n }\n}\n","import { AttachInternals, Component, Element, Event, EventEmitter, Host, Method, Prop, Watch, 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/dropdown?tab=designer).\n *\n * @slot trigger - Slot que recebe o elemento acionador\n * @slot target - Slot que recebe o elemento alvo\n */\n@Component({\n tag: 'br-dropdown',\n styleUrl: 'dropdown.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Dropdown {\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: HTMLBrDropdownElement\n\n @AttachInternals() elementInternals: ElementInternals\n\n /**\n * Indica se o dropdown está aberto ou fechado.\n * Esta propriedade é refletida no DOM e pode ser alterada externamente.\n * O valor padrão é falso (fechado).\n */\n @Prop({ reflect: true, mutable: true }) isOpen: boolean = false\n\n /**\n * Método chamado sempre que a propriedade `isOpen` muda.\n * Emite um evento com o novo estado do dropdown.\n */\n @Watch('isOpen')\n isOpenChanged() {\n this.brDropdownChange.emit({ 'is-opened': this.isOpen })\n }\n\n connectedCallback() {\n document.addEventListener('click', this.onClickOutside.bind(this))\n }\n\n componentWillLoad() {\n this.inheritedAttributes = inheritAriaAttributes(this.el)\n }\n\n disconnectedCallback() {\n document.removeEventListener('click', this.onClickOutside.bind(this))\n }\n\n /**\n * Evento emitido quando o estado do dropdown muda.\n */\n @Event() brDropdownChange: EventEmitter<{ 'is-opened': boolean }>\n\n private getCssClassMap(): CssClassMap {\n return {\n 'br-dropdown': true,\n }\n }\n\n /**\n * Alterna o estado do dropdown entre aberto e fechado.\n */\n private readonly toggle = (event: Event) => {\n event.stopPropagation()\n this.isOpen = !this.isOpen\n }\n\n /**\n * Método que lida com cliques fora do dropdown.\n *\n * @param {MouseEvent} event - O evento de clique que ocorreu.\n */\n private onClickOutside(event: MouseEvent) {\n const path = event.composedPath()\n const dropdownElement = this.el.shadowRoot.querySelector('#target')\n\n if (dropdownElement && !path.includes(dropdownElement)) {\n this.hide()\n }\n }\n\n /**\n * Abre o dropdown.\n * Define a propriedade `isOpen` como verdadeira e retorna o novo estado.\n * Este método é marcado com @Method() para que possa ser chamado externamente.\n */\n @Method()\n async open(): Promise<{ isOpen: boolean }> {\n this.isOpen = true\n return { isOpen: this.isOpen } // Retorna o novo estado\n }\n\n /**\n * Esconde o dropdown.\n * Define a propriedade `isOpen` como falsa e retorna o novo estado.\n * Este método é marcado com @Method() para que possa ser chamado externamente.\n */\n @Method()\n async hide(): Promise<{ isOpen: boolean }> {\n this.isOpen = false\n return { isOpen: this.isOpen } // Retorna o novo estado\n }\n\n private inheritedAttributes: Attributes = {}\n\n render() {\n return (\n <Host is-open={this.isOpen}>\n <div class={this.getCssClassMap()} {...this.inheritedAttributes}>\n <div\n id=\"trigger\"\n onClick={this.toggle}\n aria-controls=\"target\"\n aria-haspopup=\"true\"\n aria-expanded={this.isOpen}\n >\n <slot name=\"trigger\"></slot>\n </div>\n <div id=\"target\" aria-hidden={!this.isOpen}>\n <slot name=\"target\"></slot>\n </div>\n </div>\n </Host>\n )\n }\n}\n"],"version":3}
|
|
@@ -1,142 +0,0 @@
|
|
|
1
|
-
/*!
|
|
2
|
-
* Construído com @govbr-ds/webcomponents
|
|
3
|
-
* Padrão Digital de Governo.
|
|
4
|
-
*/
|
|
5
|
-
import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-14721f44.js';
|
|
6
|
-
|
|
7
|
-
const itemCss = "*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}html{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%}body{margin:0}a{background-color:transparent}strong{font-weight:bolder}small{font-size:80%}img{border-style:none}button,input,select,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button,select{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]{-webkit-box-sizing:border-box;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:-ms-flexbox !important;display:flex !important}.align-items-center{-ms-flex-align:center !important;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{-ms-flex:1 0 0%;flex:1 0 0%;min-width:8.3333333333%}.col-auto{-ms-flex:0 0 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:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;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}.mr-n2{margin-right:calc(var(--spacing-scale-base) * -1) !important}.mb-3{margin-bottom:var(--spacing-scale-2x) !important}.mr-auto{margin-right:auto !important}.pt-half{padding-top:var(--spacing-scale-half) !important}.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:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--interactive-rgb), var(--hover))), to(rgba(var(--interactive-rgb), var(--hover))));background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--interactive-rgb), var(--pressed))), to(rgba(var(--interactive-rgb), var(--pressed))));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}::-webkit-input-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}:-ms-input-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}::-ms-input-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)}.text-pure-0{color:var(--pure-0) !important}.text-primary-default{color:var(--color-primary-default) !important}.bg-support-01{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--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) -webkit-gradient(linear, left top, left bottom, from(var(--status-highlight-overlay)), to(var(--status-highlight-overlay)));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]+*{-webkit-box-shadow:var(--surface-shadow-sm);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-item{background:var(--background);--item-padding-x:var(--spacing-scale-2x);--item-padding-y:var(--spacing-scale-base);--item-padding:var(--item-padding-y) var(--item-padding-x);--focus-offset:calc(var(--focus-width) * -1);border:0;color:var(--color);display:block;font-weight:var(--font-weight);padding:var(--item-padding);text-align:left;width:100%}.br-item .row{margin-left:calc(-1 * var(--spacing-scale-base));margin-right:calc(-1 * var(--spacing-scale-base))}.br-item .row .col,.br-item .row [class*=col-]{padding-left:var(--spacing-scale-base);padding-right:var(--spacing-scale-base)}.br-item::after{clear:both;content:\"\";display:block}.br-item[data-toggle]{cursor:pointer}.br-item[data-toggle=selection]:not(:disabled):hover{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--color-rgb), var(--hover))), to(rgba(var(--color-rgb), var(--hover))));background-image:linear-gradient(rgba(var(--color-rgb), var(--hover)), rgba(var(--color-rgb), var(--hover)))}.br-item>.br-checkbox:not(.hidden-label),.br-item>.br-radio:not(.hidden-label){margin-bottom:calc(var(--item-padding-y) * -1);margin-left:calc(var(--item-padding-x) * -1);margin-right:calc(var(--item-padding-x) * -1);margin-top:calc(var(--item-padding-y) * -1)}.br-item>.br-checkbox:not(.hidden-label) input+label,.br-item>.br-radio:not(.hidden-label) input+label{padding-bottom:var(--item-padding-y);padding-top:var(--item-padding-y);top:1px;width:100%}.br-item>.br-checkbox:not(.hidden-label) input+label::before,.br-item>.br-radio:not(.hidden-label) input+label::before{left:var(--item-padding-x);top:calc(var(--item-padding-y) - 1px)}.br-item>.br-checkbox:not(.hidden-label) input+label:empty,.br-item>.br-radio:not(.hidden-label) input+label:empty{left:0;top:1px}.br-item>.br-checkbox:not(.hidden-label) input:hover:not(:disabled)+label::before,.br-item>.br-radio:not(.hidden-label) input:hover:not(:disabled)+label::before{background-image:none}.br-item>.br-checkbox input:not(:indeterminate)+label{min-height:calc(var(--checkbox-size) + var(--item-padding-y) * 2)}.br-item>.br-checkbox input:not(:indeterminate)+label:not(:empty){padding-left:calc(var(--checkbox-padding) + var(--checkbox-size) + var(--item-padding-x))}.br-item>.br-checkbox input:not(:indeterminate)+label::after{left:calc(var(--item-padding-x) + 8px);top:calc(var(--item-padding-y) + 4px)}.br-item>.br-checkbox input:not(:indeterminate)+label:empty{min-height:var(--checkbox-size)}.br-item>.br-checkbox input:not(:indeterminate)+label:empty::after{left:8px;top:4px}.br-item .br-radio input+label{min-height:calc(var(--radio-size) + var(--item-padding-y) * 2);padding-left:calc(var(--spacing-scale-base) + var(--radio-size) + var(--item-padding-x))}.br-item .br-radio input+label::after{left:calc(var(--item-padding-x) + var(--radio-bullet-position));top:calc(var(--item-padding-y) + var(--radio-bullet-position) - 1px)}.br-item .br-radio input+label:empty{min-height:var(--radio-size)}.br-item .br-radio input+label:empty::after{left:var(--radio-bullet-position);top:var(--radio-bullet-position)}.br-item.highlight{--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-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);background-color:var(--selected)}.br-item.active{--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-color:var(--active);color:var(--color)}.br-item.dark-mode{--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-item.dark-mode.active{--color:var(--color-light);--color-rgb:var(--color-light-rgb);--text-color:var(--color-light);--interactive:var(--interactive-light);--interactive-rgb:var(--active-rgb);--visited:var(--visited-light);--hover:var(--hover-light);--pressed:var(--pressed-light);--focus-color:var(--focus-color-light);--focus:var(--focus-color-light);background-color:var(--background-light);color:var(--active)}.br-item[data-toggle]:not(:disabled):hover{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--color-rgb), var(--hover))), to(rgba(var(--color-rgb), var(--hover))));background-image:linear-gradient(rgba(var(--color-rgb), var(--hover)), rgba(var(--color-rgb), var(--hover)))}.br-item .content{-ms-flex-align:center;align-items:center;display:-ms-flexbox;display:flex}.br-item [class*=fa-]{height:16px;width:14px !important}a.br-item{color:var(--interactive)}a.br-item:not(:disabled):hover{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--interactive-rgb), var(--hover))), to(rgba(var(--interactive-rgb), var(--hover))));background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a.br-item:not(:disabled):active{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--interactive-rgb), var(--pressed))), to(rgba(var(--interactive-rgb), var(--pressed))));background-image:linear-gradient(rgba(var(--interactive-rgb), var(--pressed)), rgba(var(--interactive-rgb), var(--pressed)))}button.br-item{background-color:transparent;color:var(--color)}button.br-item:focus{outline:none}button.br-item:focus-visible{outline-color:var(--focus);outline-offset:var(--focus-offset);outline-style:var(--focus-style);outline-width:var(--focus-width)}button.br-item:not(:disabled):hover{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--color-rgb), var(--hover))), to(rgba(var(--color-rgb), var(--hover))));background-image:linear-gradient(rgba(var(--color-rgb), var(--hover)), rgba(var(--color-rgb), var(--hover)))}button.br-item:not(:disabled):active{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--color-rgb), var(--pressed))), to(rgba(var(--color-rgb), var(--pressed))));background-image:linear-gradient(rgba(var(--color-rgb), var(--pressed)), rgba(var(--color-rgb), var(--pressed)))}:host{display:block}::slotted(br-checkbox){max-width:-moz-fit-content;max-width:-webkit-fit-content;max-width:fit-content;max-height:-moz-fit-content;max-height:-webkit-fit-content;max-height:fit-content}::slotted(br-radio){max-width:-moz-fit-content;max-width:-webkit-fit-content;max-width:fit-content;max-height:-moz-fit-content;max-height:-webkit-fit-content;max-height:fit-content}";
|
|
8
|
-
const BrItemStyle0 = itemCss;
|
|
9
|
-
|
|
10
|
-
const Item = class {
|
|
11
|
-
constructor(hostRef) {
|
|
12
|
-
registerInstance(this, hostRef);
|
|
13
|
-
this.brDidClick = createEvent(this, "brDidClick", 7);
|
|
14
|
-
this.brDidSelect = createEvent(this, "brDidSelect", 7);
|
|
15
|
-
if (hostRef.$hostElement$["s-ei"]) {
|
|
16
|
-
this.elementInternals = hostRef.$hostElement$["s-ei"];
|
|
17
|
-
}
|
|
18
|
-
else {
|
|
19
|
-
this.elementInternals = hostRef.$hostElement$.attachInternals();
|
|
20
|
-
hostRef.$hostElement$["s-ei"] = this.elementInternals;
|
|
21
|
-
}
|
|
22
|
-
this.inheritedAttributes = {};
|
|
23
|
-
this.handleClick = (event) => {
|
|
24
|
-
const clickedElement = event.target;
|
|
25
|
-
if (this.disabled) {
|
|
26
|
-
event.preventDefault();
|
|
27
|
-
event.stopPropagation();
|
|
28
|
-
}
|
|
29
|
-
if (this.isButton) {
|
|
30
|
-
this.brDidClick.emit();
|
|
31
|
-
}
|
|
32
|
-
else if (this.isInteractive && !this.isClickInsideInteractiveElement(clickedElement)) {
|
|
33
|
-
this.selectedValue = !this.selectedValue;
|
|
34
|
-
this.brDidSelect.emit({ selected: this.selectedValue });
|
|
35
|
-
this.updateCheckboxes();
|
|
36
|
-
}
|
|
37
|
-
event.stopPropagation();
|
|
38
|
-
};
|
|
39
|
-
this.disabled = false;
|
|
40
|
-
this.isActive = false;
|
|
41
|
-
this.isSelected = false;
|
|
42
|
-
this.isInteractive = false;
|
|
43
|
-
this.href = undefined;
|
|
44
|
-
this.target = undefined;
|
|
45
|
-
this.isButton = false;
|
|
46
|
-
this.type = undefined;
|
|
47
|
-
this.value = undefined;
|
|
48
|
-
this.density = 'medium';
|
|
49
|
-
this.hasSlotDefault = false;
|
|
50
|
-
this.hasSlotStart = false;
|
|
51
|
-
this.hasSlotEnd = false;
|
|
52
|
-
this.selectedValue = false;
|
|
53
|
-
}
|
|
54
|
-
handleChange(event) {
|
|
55
|
-
const target = event.target;
|
|
56
|
-
if (this.el.contains(target)) {
|
|
57
|
-
this.updateItemSelectionState();
|
|
58
|
-
}
|
|
59
|
-
}
|
|
60
|
-
componentWillLoad() {
|
|
61
|
-
this.hasSlotContentDefault();
|
|
62
|
-
this.hasSlotStart = this.hasSlotContent('start');
|
|
63
|
-
this.hasSlotEnd = this.hasSlotContent('end');
|
|
64
|
-
this.selectedValue = this.isSelected;
|
|
65
|
-
if (this.isButton) {
|
|
66
|
-
this.type = this.type || 'button';
|
|
67
|
-
}
|
|
68
|
-
this.updateItemSelectionState();
|
|
69
|
-
}
|
|
70
|
-
componentDidLoad() {
|
|
71
|
-
this.updateCheckboxes();
|
|
72
|
-
}
|
|
73
|
-
hasSlotContentDefault() {
|
|
74
|
-
this.hasSlotDefault = this.el.innerHTML !== '';
|
|
75
|
-
}
|
|
76
|
-
hasSlotContent(slotName) {
|
|
77
|
-
return this.el.querySelector(`[slot="${slotName}"]`) !== null;
|
|
78
|
-
}
|
|
79
|
-
getCssClassMap() {
|
|
80
|
-
return {
|
|
81
|
-
'br-item': true,
|
|
82
|
-
disabled: this.disabled,
|
|
83
|
-
active: this.isActive,
|
|
84
|
-
selected: this.selectedValue,
|
|
85
|
-
'py-3': this.density === 'medium',
|
|
86
|
-
'py-4': this.density === 'small',
|
|
87
|
-
};
|
|
88
|
-
}
|
|
89
|
-
getTagType() {
|
|
90
|
-
var _a;
|
|
91
|
-
if (this.isButton) {
|
|
92
|
-
return 'button';
|
|
93
|
-
}
|
|
94
|
-
if (((_a = this.href) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
95
|
-
return 'a';
|
|
96
|
-
}
|
|
97
|
-
return 'div';
|
|
98
|
-
}
|
|
99
|
-
getAttributes() {
|
|
100
|
-
const TagType = this.getTagType();
|
|
101
|
-
const baseAttributes = TagType === 'button' ? { type: this.type, value: this.value } : { href: this.href, target: this.target };
|
|
102
|
-
return Object.assign(Object.assign(Object.assign({}, baseAttributes), { 'aria-disabled': this.disabled ? 'true' : null, 'aria-current': this.isActive ? 'true' : null, 'data-toggle': this.isInteractive ? 'selection' : null }), this.inheritedAttributes);
|
|
103
|
-
}
|
|
104
|
-
updateItemSelectionState() {
|
|
105
|
-
const checkboxes = Array.from(this.el.querySelectorAll('br-checkbox'));
|
|
106
|
-
const radios = Array.from(this.el.querySelectorAll('br-radio'));
|
|
107
|
-
let isAnyCheckboxChecked = false;
|
|
108
|
-
let isAnyRadioSelected = false;
|
|
109
|
-
if (checkboxes.length > 0) {
|
|
110
|
-
isAnyCheckboxChecked = checkboxes.some((cb) => cb.checked);
|
|
111
|
-
}
|
|
112
|
-
if (radios.length > 0) {
|
|
113
|
-
isAnyRadioSelected = radios.some((radio) => radio.checked);
|
|
114
|
-
}
|
|
115
|
-
this.selectedValue = isAnyCheckboxChecked || isAnyRadioSelected;
|
|
116
|
-
}
|
|
117
|
-
// Função para verificar se o clique foi dentro do slot do item.
|
|
118
|
-
isClickInsideInteractiveElement(target) {
|
|
119
|
-
const interactiveSelectors = 'br-checkbox, br-radio, br-input, br-button, br-select, br-textarea';
|
|
120
|
-
const interactiveElements = this.el.querySelectorAll(interactiveSelectors);
|
|
121
|
-
return Array.from(interactiveElements).some((el) => el.contains(target) || target === el);
|
|
122
|
-
}
|
|
123
|
-
updateCheckboxes() {
|
|
124
|
-
const checkboxes = Array.from(this.el.querySelectorAll('br-checkbox'));
|
|
125
|
-
checkboxes.forEach((checkbox) => {
|
|
126
|
-
checkbox.checked = this.selectedValue;
|
|
127
|
-
});
|
|
128
|
-
}
|
|
129
|
-
render() {
|
|
130
|
-
const TagType = this.getTagType();
|
|
131
|
-
const attributes = this.getAttributes();
|
|
132
|
-
const classList = this.getCssClassMap();
|
|
133
|
-
return (h(Host, { key: 'cd5aaacd053d2a3dcce81f2be4948a499b8165a2' }, h(TagType, Object.assign({ key: 'f6987c1b45458255f4008568cbeececc8d2f5548', class: classList }, attributes, { onClick: this.handleClick }), this.hasSlotStart || this.hasSlotEnd ? (h("div", { class: "row align-items-center" }, this.hasSlotStart && (h("div", { class: "col-auto" }, h("slot", { name: "start" }))), h("div", { class: "col" }, h("slot", null)), this.hasSlotEnd && (h("div", { class: "col-auto" }, h("slot", { name: "end" }))))) : (h("slot", null)))));
|
|
134
|
-
}
|
|
135
|
-
static get formAssociated() { return true; }
|
|
136
|
-
get el() { return getElement(this); }
|
|
137
|
-
};
|
|
138
|
-
Item.style = BrItemStyle0;
|
|
139
|
-
|
|
140
|
-
export { Item as br_item };
|
|
141
|
-
|
|
142
|
-
//# sourceMappingURL=br-item.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"br-item.entry.js","mappings":";;;;;;AAAA,MAAM,OAAO,GAAG,kjhBAAkjhB,CAAC;AACnkhB,qBAAe,OAAO;;MCiBT,IAAI;;;;;;;;;;;;QAoIE,wBAAmB,GAAe,EAAE,CAAA;QA0DpC,gBAAW,GAAG,CAAC,KAAiB;YAC/C,MAAM,cAAc,GAAG,KAAK,CAAC,MAAqB,CAAA;YAElD,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACjB,KAAK,CAAC,cAAc,EAAE,CAAA;gBACtB,KAAK,CAAC,eAAe,EAAE,CAAA;aACxB;YAED,IAAI,IAAI,CAAC,QAAQ,EAAE;gBACjB,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAA;aACvB;iBAAM,IAAI,IAAI,CAAC,aAAa,IAAI,CAAC,IAAI,CAAC,+BAA+B,CAAC,cAAc,CAAC,EAAE;gBACtF,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,aAAa,CAAA;gBACxC,IAAI,CAAC,WAAW,CAAC,IAAI,CAAC,EAAE,QAAQ,EAAE,IAAI,CAAC,aAAa,EAAE,CAAC,CAAA;gBACvD,IAAI,CAAC,gBAAgB,EAAE,CAAA;aACxB;YACD,KAAK,CAAC,eAAe,EAAE,CAAA;SACxB,CAAA;wBAlM4C,KAAK;wBAML,KAAK;0BAMH,KAAK;6BAKF,KAAK;;;wBAmBV,KAAK;;;uBAkBe,QAAQ;8BAGtC,KAAK;4BAEP,KAAK;0BAEP,KAAK;6BAGF,KAAK;;IAGvC,YAAY,CAAC,KAAY;QACvB,MAAM,MAAM,GAAG,KAAK,CAAC,MAAqB,CAAA;QAE1C,IAAI,IAAI,CAAC,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,EAAE;YAC5B,IAAI,CAAC,wBAAwB,EAAE,CAAA;SAChC;KACF;IAaD,iBAAiB;QACf,IAAI,CAAC,qBAAqB,EAAE,CAAA;QAC5B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,cAAc,CAAC,OAAO,CAAC,CAAA;QAChD,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC,cAAc,CAAC,KAAK,CAAC,CAAA;QAC5C,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,UAAU,CAAA;QACpC,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,IAAI,CAAC,IAAI,GAAG,IAAI,CAAC,IAAI,IAAI,QAAQ,CAAA;SAClC;QACD,IAAI,CAAC,wBAAwB,EAAE,CAAA;KAChC;IAED,gBAAgB;QACd,IAAI,CAAC,gBAAgB,EAAE,CAAA;KACxB;IAEO,qBAAqB;QAC3B,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,EAAE,CAAC,SAAS,KAAK,EAAE,CAAA;KAC/C;IAEO,cAAc,CAAC,QAAgB;QACrC,OAAO,IAAI,CAAC,EAAE,CAAC,aAAa,CAAC,UAAU,QAAQ,IAAI,CAAC,KAAK,IAAI,CAAA;KAC9D;IAEO,cAAc;QACpB,OAAO;YACL,SAAS,EAAE,IAAI;YACf,QAAQ,EAAE,IAAI,CAAC,QAAQ;YACvB,MAAM,EAAE,IAAI,CAAC,QAAQ;YACrB,QAAQ,EAAE,IAAI,CAAC,aAAa;YAC5B,MAAM,EAAE,IAAI,CAAC,OAAO,KAAK,QAAQ;YACjC,MAAM,EAAE,IAAI,CAAC,OAAO,KAAK,OAAO;SACjC,CAAA;KACF;IAIO,UAAU;;QAChB,IAAI,IAAI,CAAC,QAAQ,EAAE;YACjB,OAAO,QAAQ,CAAA;SAChB;QACD,IAAI,CAAA,MAAA,IAAI,CAAC,IAAI,0CAAE,MAAM,IAAG,CAAC,EAAE;YACzB,OAAO,GAAG,CAAA;SACX;QACD,OAAO,KAAK,CAAA;KACb;IAEO,aAAa;QACnB,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,CAAA;QACjC,MAAM,cAAc,GAClB,OAAO,KAAK,QAAQ,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,KAAK,EAAE,IAAI,CAAC,KAAK,EAAE,GAAG,EAAE,IAAI,EAAE,IAAI,CAAC,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,MAAM,EAAE,CAAA;QAE1G,qDACK,cAAc,KACjB,eAAe,EAAE,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,IAAI,EAC9C,cAAc,EAAE,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,IAAI,EAC7C,aAAa,EAAE,IAAI,CAAC,aAAa,GAAG,WAAW,GAAG,IAAI,KACnD,IAAI,CAAC,mBAAmB,EAC5B;KACF;IAEO,wBAAwB;QAC9B,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC,CAAA;QACtE,MAAM,MAAM,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,UAAU,CAAC,CAAC,CAAA;QAE/D,IAAI,oBAAoB,GAAG,KAAK,CAAA;QAChC,IAAI,kBAAkB,GAAG,KAAK,CAAA;QAE9B,IAAI,UAAU,CAAC,MAAM,GAAG,CAAC,EAAE;YACzB,oBAAoB,GAAG,UAAU,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,OAAO,CAAC,CAAA;SAC3D;QACD,IAAI,MAAM,CAAC,MAAM,GAAG,CAAC,EAAE;YACrB,kBAAkB,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,KAAK,KAAK,KAAK,CAAC,OAAO,CAAC,CAAA;SAC3D;QAED,IAAI,CAAC,aAAa,GAAG,oBAAoB,IAAI,kBAAkB,CAAA;KAChE;;IAGO,+BAA+B,CAAC,MAAmB;QACzD,MAAM,oBAAoB,GAAG,oEAAoE,CAAA;QACjG,MAAM,mBAAmB,GAAG,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,oBAAoB,CAAC,CAAA;QAC1E,OAAO,KAAK,CAAC,IAAI,CAAC,mBAAmB,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,KAAK,EAAE,CAAC,QAAQ,CAAC,MAAM,CAAC,IAAI,MAAM,KAAK,EAAE,CAAC,CAAA;KAC1F;IAEO,gBAAgB;QACtB,MAAM,UAAU,GAAG,KAAK,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,gBAAgB,CAAC,aAAa,CAAC,CAAC,CAAA;QAEtE,UAAU,CAAC,OAAO,CAAC,CAAC,QAAQ;YAC1B,QAAQ,CAAC,OAAO,GAAG,IAAI,CAAC,aAAa,CAAA;SACtC,CAAC,CAAA;KACH;IAoBD,MAAM;QACJ,MAAM,OAAO,GAAG,IAAI,CAAC,UAAU,EAAE,CAAA;QACjC,MAAM,UAAU,GAAG,IAAI,CAAC,aAAa,EAAE,CAAA;QACvC,MAAM,SAAS,GAAG,IAAI,CAAC,cAAc,EAAE,CAAA;QACvC,QACE,EAAC,IAAI,uDACH,EAAC,OAAO,mEAAC,KAAK,EAAE,SAAS,IAAM,UAAU,IAAE,OAAO,EAAE,IAAI,CAAC,WAAW,KACjE,IAAI,CAAC,YAAY,IAAI,IAAI,CAAC,UAAU,IACnC,WAAK,KAAK,EAAC,wBAAwB,IAChC,IAAI,CAAC,YAAY,KAChB,WAAK,KAAK,EAAC,UAAU,IACnB,YAAM,IAAI,EAAC,OAAO,GAAQ,CACtB,CACP,EAED,WAAK,KAAK,EAAC,KAAK,IACd,eAAa,CACT,EAEL,IAAI,CAAC,UAAU,KACd,WAAK,KAAK,EAAC,UAAU,IACnB,YAAM,IAAI,EAAC,KAAK,GAAQ,CACpB,CACP,CACG,KAEN,eAAa,CACd,CACO,CACL,EACR;KACF;;;;;;;;","names":[],"sources":["src/components/item/item.scss?tag=br-item&encapsulation=shadow","src/components/item/item.tsx"],"sourcesContent":["@import \"../../../../../node_modules/@govbr-ds/core/src/components/item/item.scss\";\n\n:host {\n display: block;\n}\n\n::slotted(br-checkbox) {\n max-width: fit-content;\n max-height: fit-content;\n}\n\n::slotted(br-radio) {\n max-width: fit-content;\n max-height: fit-content;\n}\n","import { AttachInternals, Component, Element, Event, EventEmitter, Host, Listen, Prop, State, h } from '@stencil/core'\nimport { Attributes } from '../../utils/inherited-attributes'\nimport { CssClassMap } from '../../utils/interfaces'\n/**\n * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/item?tab=designer).\n *\n * @slot default - Área de conteúdo, podendo conter qualquer componente, exceto botões primários e componentes relacionados à navegação (como carrosséis, paginações, abas, menus, etc.).\n *\n * @slot start - Área de recursos visuais, podendo conter elementos como ícones, avatares e mídias.\n *\n * @slot end - Área de recursos complementares, podendo conter componentes interativos, metadados e informações adicionais.\n */\n@Component({\n tag: 'br-item',\n styleUrl: 'item.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Item {\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: HTMLBrItemElement\n\n @AttachInternals() elementInternals: ElementInternals\n\n /**\n * Desativa o item, tornando-o não interativo.\n */\n @Prop({ reflect: true }) disabled: boolean = false\n\n /**\n * Indica se o item está no estado ativo.\n * Se definido como verdadeiro, o item será exibido como ativo.\n */\n @Prop({ reflect: true }) isActive: boolean = false\n\n /**\n * Indica se o item está no estado selecionado.\n * Se definido como verdadeiro, o item será exibido como selecionado.\n */\n @Prop({ reflect: true }) isSelected: boolean = false\n\n /**\n * Marca o item como interativo, permitindo que toda a superfície do item seja clicável.\n */\n @Prop({ reflect: true }) isInteractive: boolean = false\n\n /**\n * URL ou caminho para o qual o usuário será direcionado ao clicar no item. Quando definido, o item será renderizado como um link.\n */\n @Prop({ reflect: true }) href?: string\n\n /**\n * Define o alvo do link quando `href` está presente. Pode ser:\n * - `_blank` para abrir em uma nova aba,\n * - `_self` para abrir na mesma aba,\n * - `_parent` para abrir na aba pai,\n * - `_top` para abrir na aba superior.\n */\n @Prop({ reflect: true }) target?: '_blank' | '_self' | '_parent' | '_top'\n\n /**\n * Quando definido como `true`, o item será tratado como um botão.\n */\n @Prop({ reflect: true }) isButton: boolean = false\n\n /**\n * Tipo do botão, aplicável apenas se `isButton` for `true`. Pode ser:\n * - `'submit'` para enviar um formulário,\n * - `'reset'` para redefinir um formulário,\n * - `'button'` para um botão padrão.\n */\n @Prop({ reflect: true, mutable: true }) type: 'submit' | 'reset' | 'button'\n\n /**\n * Define um valor associado ao br-item quando renderizado como um botão, utilizado em contextos de formulário.\n */\n @Prop({ reflect: true }) value?: string\n\n /**\n * Ajusta a densidade, alterando o espaçamento interno para um visual mais compacto ou mais expandido.\n */\n @Prop({ reflect: true }) density: 'large' | 'medium' | 'small' = 'medium'\n\n // Propriedade interna para verificar a presença de conteúdo no slot default\n @State() hasSlotDefault: boolean = false\n\n @State() hasSlotStart: boolean = false\n\n @State() hasSlotEnd: boolean = false\n\n // Propriedade interna para armazenar o valor selecionado\n @State() selectedValue: boolean = false\n\n @Listen('brDidCheckedChange', { target: 'document' })\n handleChange(event: Event) {\n const target = event.target as HTMLElement\n\n if (this.el.contains(target)) {\n this.updateItemSelectionState()\n }\n }\n\n /**\n * Evento customizado emitido quando o item é clicado, aplicável apenas se o item for um botão (`<button>`).\n * Pode ser utilizado para ações personalizadas, exceto quando o item está desativado.\n */\n @Event({ composed: true, cancelable: true, bubbles: true }) brDidClick: EventEmitter\n\n /**\n * Evento customizado aplicável para todos os tipos de elementos (`div`, `button`, `a`), emitido quando o item é selecionado e desde que a propriedade `isInteractive` esteja presente.\n */\n @Event({ bubbles: true, composed: true }) brDidSelect: EventEmitter<{ selected: boolean }>\n\n componentWillLoad() {\n this.hasSlotContentDefault()\n this.hasSlotStart = this.hasSlotContent('start')\n this.hasSlotEnd = this.hasSlotContent('end')\n this.selectedValue = this.isSelected\n if (this.isButton) {\n this.type = this.type || 'button'\n }\n this.updateItemSelectionState()\n }\n\n componentDidLoad() {\n this.updateCheckboxes()\n }\n\n private hasSlotContentDefault(): any {\n this.hasSlotDefault = this.el.innerHTML !== ''\n }\n\n private hasSlotContent(slotName: string): boolean {\n return this.el.querySelector(`[slot=\"${slotName}\"]`) !== null\n }\n\n private getCssClassMap(): CssClassMap {\n return {\n 'br-item': true,\n disabled: this.disabled,\n active: this.isActive,\n selected: this.selectedValue,\n 'py-3': this.density === 'medium',\n 'py-4': this.density === 'small',\n }\n }\n\n private readonly inheritedAttributes: Attributes = {}\n\n private getTagType(): string {\n if (this.isButton) {\n return 'button'\n }\n if (this.href?.length > 0) {\n return 'a'\n }\n return 'div'\n }\n\n private getAttributes() {\n const TagType = this.getTagType()\n const baseAttributes =\n TagType === 'button' ? { type: this.type, value: this.value } : { href: this.href, target: this.target }\n\n return {\n ...baseAttributes,\n 'aria-disabled': this.disabled ? 'true' : null,\n 'aria-current': this.isActive ? 'true' : null,\n 'data-toggle': this.isInteractive ? 'selection' : null,\n ...this.inheritedAttributes,\n }\n }\n\n private updateItemSelectionState() {\n const checkboxes = Array.from(this.el.querySelectorAll('br-checkbox'))\n const radios = Array.from(this.el.querySelectorAll('br-radio'))\n\n let isAnyCheckboxChecked = false\n let isAnyRadioSelected = false\n\n if (checkboxes.length > 0) {\n isAnyCheckboxChecked = checkboxes.some((cb) => cb.checked)\n }\n if (radios.length > 0) {\n isAnyRadioSelected = radios.some((radio) => radio.checked)\n }\n\n this.selectedValue = isAnyCheckboxChecked || isAnyRadioSelected\n }\n\n // Função para verificar se o clique foi dentro do slot do item.\n private isClickInsideInteractiveElement(target: HTMLElement): boolean {\n const interactiveSelectors = 'br-checkbox, br-radio, br-input, br-button, br-select, br-textarea'\n const interactiveElements = this.el.querySelectorAll(interactiveSelectors)\n return Array.from(interactiveElements).some((el) => el.contains(target) || target === el)\n }\n\n private updateCheckboxes() {\n const checkboxes = Array.from(this.el.querySelectorAll('br-checkbox'))\n\n checkboxes.forEach((checkbox) => {\n checkbox.checked = this.selectedValue\n })\n }\n\n private readonly handleClick = (event: MouseEvent) => {\n const clickedElement = event.target as HTMLElement\n\n if (this.disabled) {\n event.preventDefault()\n event.stopPropagation()\n }\n\n if (this.isButton) {\n this.brDidClick.emit()\n } else if (this.isInteractive && !this.isClickInsideInteractiveElement(clickedElement)) {\n this.selectedValue = !this.selectedValue\n this.brDidSelect.emit({ selected: this.selectedValue })\n this.updateCheckboxes()\n }\n event.stopPropagation()\n }\n\n render() {\n const TagType = this.getTagType()\n const attributes = this.getAttributes()\n const classList = this.getCssClassMap()\n return (\n <Host>\n <TagType class={classList} {...attributes} onClick={this.handleClick}>\n {this.hasSlotStart || this.hasSlotEnd ? (\n <div class=\"row align-items-center\">\n {this.hasSlotStart && (\n <div class=\"col-auto\">\n <slot name=\"start\"></slot>\n </div>\n )}\n\n <div class=\"col\">\n <slot></slot>\n </div>\n\n {this.hasSlotEnd && (\n <div class=\"col-auto\">\n <slot name=\"end\"></slot>\n </div>\n )}\n </div>\n ) : (\n <slot></slot>\n )}\n </TagType>\n </Host>\n )\n }\n}\n"],"version":3}
|
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
/*!
|
|
2
|
-
* Construído com @govbr-ds/webcomponents
|
|
3
|
-
* Padrão Digital de Governo.
|
|
4
|
-
*/
|
|
5
|
-
import { r as registerInstance, h, a as Host, g as getElement } from './index-14721f44.js';
|
|
6
|
-
import { i as inheritAriaAttributes } from './inherited-attributes-553a7c36.js';
|
|
7
|
-
|
|
8
|
-
const loadingCss = "*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}html{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%}body{margin:0}a{background-color:transparent}strong{font-weight:bolder}small{font-size:80%}img{border-style:none}button,input,select,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button,select{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]{-webkit-box-sizing:border-box;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:-ms-flexbox !important;display:flex !important}.align-items-center{-ms-flex-align:center !important;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{-ms-flex:1 0 0%;flex:1 0 0%;min-width:8.3333333333%}.col-auto{-ms-flex:0 0 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:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;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}.mr-n2{margin-right:calc(var(--spacing-scale-base) * -1) !important}.mb-3{margin-bottom:var(--spacing-scale-2x) !important}.mr-auto{margin-right:auto !important}.pt-half{padding-top:var(--spacing-scale-half) !important}.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:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--interactive-rgb), var(--hover))), to(rgba(var(--interactive-rgb), var(--hover))));background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--interactive-rgb), var(--pressed))), to(rgba(var(--interactive-rgb), var(--pressed))));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}::-webkit-input-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}:-ms-input-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}::-ms-input-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)}.text-pure-0{color:var(--pure-0) !important}.text-primary-default{color:var(--color-primary-default) !important}.bg-support-01{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--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) -webkit-gradient(linear, left top, left bottom, from(var(--status-highlight-overlay)), to(var(--status-highlight-overlay)));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]+*{-webkit-box-shadow:var(--surface-shadow-sm);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)}.loading,.br-loading{--loading-size:var(--loading-indetermined-diameter-sm);--loading-diameter:84px;--loading-stroke:5px;--loading-indetermined-color:var(--interactive);--loading-indetermined-diameter-md:44px;--loading-indetermined-diameter-sm:24px;position:relative;z-index:var(--z-index-layer-4)}.loading[data-progress]:not(:empty),.br-loading[data-progress]:not(:empty){background-color:var(--border-color);border-radius:50%}.loading[data-progress]:not(:empty)::before,.br-loading[data-progress]:not(:empty)::before{content:none}.loading[data-progress]::after,.br-loading[data-progress]::after{--loading-size:calc(var(--loading-diameter) - var(--loading-stroke) * 2);background:var(--background);border-radius:50%;color:var(--interactive);content:attr(data-progress) \"%\";font-size:var(--font-size-scale-up-02);font-weight:var(--font-weight-semi-bold);height:var(--loading-size);line-height:var(--loading-size);margin:var(--loading-stroke);position:absolute;text-align:center;width:var(--loading-size)}.loading[data-progress] .br-loading-mask,.loading[data-progress] .br-loading-fill,.br-loading[data-progress] .br-loading-mask,.br-loading[data-progress] .br-loading-fill{-webkit-backface-visibility:hidden;backface-visibility:hidden;border-radius:50%;clip:rect(0, var(--loading-diameter), var(--loading-diameter), calc(var(--loading-diameter) * 0.5));height:var(--loading-diameter);overflow:hidden;position:absolute;width:var(--loading-diameter)}.loading[data-progress] .br-loading-fill,.br-loading[data-progress] .br-loading-fill{background:var(--interactive);clip:rect(0, calc(var(--loading-diameter) * 0.5), var(--loading-diameter), 0)}.loading::before,.br-loading::before{-webkit-animation:spinAround 1.3s infinite linear;animation:spinAround 1.3s infinite linear;border:2px solid var(--loading-indetermined-color);border-radius:50%;border-right-color:transparent;content:\"\";display:block;height:var(--loading-size);left:calc(50% - var(--loading-size) * 0.5);position:absolute;top:calc(50% - var(--loading-size) * 0.5);width:var(--loading-size)}.loading:not(.br-button),.br-loading:not(.br-button){height:var(--loading-size);width:var(--loading-size)}.loading:not(.br-button).medium,.br-loading:not(.br-button).medium{--loading-size:var(--loading-indetermined-diameter-md)}.loading:not(.br-button).medium::before,.br-loading:not(.br-button).medium::before{border-width:4px}.loading:not(.br-button)[data-progress],.br-loading:not(.br-button)[data-progress]{--loading-size:var(--loading-diameter)}.loading:not(.br-button)[data-progress]::before,.br-loading:not(.br-button)[data-progress]::before{border-width:var(--loading-stroke)}.loading[data-progress=\"1\"] .br-loading-mask.full,.loading[data-progress=\"1\"] .br-loading-fill,.br-loading[data-progress=\"1\"] .br-loading-mask.full,.br-loading[data-progress=\"1\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(1.8deg);transform:rotate(1.8deg)}.loading[data-progress=\"2\"] .br-loading-mask.full,.loading[data-progress=\"2\"] .br-loading-fill,.br-loading[data-progress=\"2\"] .br-loading-mask.full,.br-loading[data-progress=\"2\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(3.6deg);transform:rotate(3.6deg)}.loading[data-progress=\"3\"] .br-loading-mask.full,.loading[data-progress=\"3\"] .br-loading-fill,.br-loading[data-progress=\"3\"] .br-loading-mask.full,.br-loading[data-progress=\"3\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(5.4deg);transform:rotate(5.4deg)}.loading[data-progress=\"5\"] .br-loading-mask.full,.loading[data-progress=\"5\"] .br-loading-fill,.br-loading[data-progress=\"5\"] .br-loading-mask.full,.br-loading[data-progress=\"5\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(9deg);transform:rotate(9deg)}.loading[data-progress=\"10\"] .br-loading-mask.full,.loading[data-progress=\"10\"] .br-loading-fill,.br-loading[data-progress=\"10\"] .br-loading-mask.full,.br-loading[data-progress=\"10\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(18deg);transform:rotate(18deg)}.loading[data-progress=\"16\"] .br-loading-mask.full,.loading[data-progress=\"16\"] .br-loading-fill,.br-loading[data-progress=\"16\"] .br-loading-mask.full,.br-loading[data-progress=\"16\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(28.8deg);transform:rotate(28.8deg)}.loading[data-progress=\"20\"] .br-loading-mask.full,.loading[data-progress=\"20\"] .br-loading-fill,.br-loading[data-progress=\"20\"] .br-loading-mask.full,.br-loading[data-progress=\"20\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(36deg);transform:rotate(36deg)}.loading[data-progress=\"24\"] .br-loading-mask.full,.loading[data-progress=\"24\"] .br-loading-fill,.br-loading[data-progress=\"24\"] .br-loading-mask.full,.br-loading[data-progress=\"24\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(43.2deg);transform:rotate(43.2deg)}.loading[data-progress=\"48\"] .br-loading-mask.full,.loading[data-progress=\"48\"] .br-loading-fill,.br-loading[data-progress=\"48\"] .br-loading-mask.full,.br-loading[data-progress=\"48\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(86.4deg);transform:rotate(86.4deg)}.loading[data-progress=\"50\"] .br-loading-mask.full,.loading[data-progress=\"50\"] .br-loading-fill,.br-loading[data-progress=\"50\"] .br-loading-mask.full,.br-loading[data-progress=\"50\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(90deg);transform:rotate(90deg)}.loading[data-progress=\"70\"] .br-loading-mask.full,.loading[data-progress=\"70\"] .br-loading-fill,.br-loading[data-progress=\"70\"] .br-loading-mask.full,.br-loading[data-progress=\"70\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(126deg);transform:rotate(126deg)}.loading[data-progress=\"72\"] .br-loading-mask.full,.loading[data-progress=\"72\"] .br-loading-fill,.br-loading[data-progress=\"72\"] .br-loading-mask.full,.br-loading[data-progress=\"72\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(129.6deg);transform:rotate(129.6deg)}.loading[data-progress=\"100\"] .br-loading-mask.full,.loading[data-progress=\"100\"] .br-loading-fill,.br-loading[data-progress=\"100\"] .br-loading-mask.full,.br-loading[data-progress=\"100\"] .br-loading-fill{-webkit-animation:fill ease-in-out 2s;animation:fill ease-in-out 2s;-webkit-transform:rotate(180deg);transform:rotate(180deg)}@-webkit-keyframes spinAround{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@keyframes spinAround{from{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(359deg);transform:rotate(359deg)}}@-webkit-keyframes fill{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}@keyframes fill{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}}:host{display:block}:host .loading-progress-alignment{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:center;justify-content:center}";
|
|
9
|
-
const BrLoadingStyle0 = loadingCss;
|
|
10
|
-
|
|
11
|
-
const Loading = class {
|
|
12
|
-
constructor(hostRef) {
|
|
13
|
-
registerInstance(this, hostRef);
|
|
14
|
-
this.inheritedAttributes = {};
|
|
15
|
-
this.isProgress = false;
|
|
16
|
-
this.progressPercent = undefined;
|
|
17
|
-
this.isMedium = false;
|
|
18
|
-
this.label = undefined;
|
|
19
|
-
}
|
|
20
|
-
componentWillLoad() {
|
|
21
|
-
this.inheritedAttributes = inheritAriaAttributes(this.el);
|
|
22
|
-
}
|
|
23
|
-
getCssClassMap() {
|
|
24
|
-
return {
|
|
25
|
-
'br-loading': true,
|
|
26
|
-
medium: this.isMedium,
|
|
27
|
-
};
|
|
28
|
-
}
|
|
29
|
-
render() {
|
|
30
|
-
return (h(Host, { key: 'd9ef2a8a142e986437e2fa16878440c6286379cb' }, this.isProgress ? (h("div", Object.assign({}, this.inheritedAttributes, { class: this.getCssClassMap(), role: "progressbar", "data-progress": this.progressPercent, "aria-label": "Carregando exemplo com porcentagem", "aria-valuemin": "0", "aria-valuenow": this.progressPercent, "aria-valuemax": "100" }), h("div", { class: "br-loading-mask full" }, h("div", { class: "br-loading-fill" })), h("div", { class: "br-loading-mask" }, h("div", { class: "br-loading-fill" })))) : (h("div", { class: "loading-progress-alignment" }, h("div", { class: this.getCssClassMap(), role: "progressbar", "aria-label": "Carregando exemplo indeterminado pequeno" }), h("span", { class: "rotulo" }, this.label)))));
|
|
31
|
-
}
|
|
32
|
-
static get formAssociated() { return true; }
|
|
33
|
-
get el() { return getElement(this); }
|
|
34
|
-
};
|
|
35
|
-
Loading.style = BrLoadingStyle0;
|
|
36
|
-
|
|
37
|
-
export { Loading as br_loading };
|
|
38
|
-
|
|
39
|
-
//# sourceMappingURL=br-loading.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"br-loading.entry.js","mappings":";;;;;;;AAAA,MAAM,UAAU,GAAG,w2hBAAw2hB,CAAC;AAC53hB,wBAAe,UAAU;;MCWZ,OAAO;;;QA0CV,wBAAmB,GAAe,EAAE,CAAA;0BA9BG,KAAK;;wBAWP,KAAK;;;IAQlD,iBAAiB;QACf,IAAI,CAAC,mBAAmB,GAAG,qBAAqB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;KAC1D;IAEO,cAAc;QACpB,OAAO;YACL,YAAY,EAAE,IAAI;YAClB,MAAM,EAAE,IAAI,CAAC,QAAQ;SACtB,CAAA;KACF;IAID,MAAM;QACJ,QACE,EAAC,IAAI,uDACF,IAAI,CAAC,UAAU,IACd,2BACM,IAAI,CAAC,mBAAmB,IAC5B,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,EAC5B,IAAI,EAAC,aAAa,mBACH,IAAI,CAAC,eAAe,gBACxB,oCAAoC,mBACjC,GAAG,mBACF,IAAI,CAAC,eAAe,mBACrB,KAAK,KAEnB,WAAK,KAAK,EAAC,sBAAsB,IAC/B,WAAK,KAAK,EAAC,iBAAiB,GAAO,CAC/B,EACN,WAAK,KAAK,EAAC,iBAAiB,IAC1B,WAAK,KAAK,EAAC,iBAAiB,GAAO,CAC/B,CACF,KAEN,WAAK,KAAK,EAAC,4BAA4B,IACrC,WACE,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,EAC5B,IAAI,EAAC,aAAa,gBACP,0CAA0C,GAChD,EACP,YAAM,KAAK,EAAC,QAAQ,IAAE,IAAI,CAAC,KAAK,CAAQ,CACpC,CACP,CACI,EACR;KACF;;;;;;;;","names":[],"sources":["src/components/loading/loading.scss?tag=br-loading&encapsulation=shadow","src/components/loading/loading.tsx"],"sourcesContent":["@import \"../../../../../node_modules/@govbr-ds/core/src/components/loading/loading.scss\";\n\n:host {\n display: block;\n\n .loading-progress-alignment {\n display: flex;\n align-items: center;\n flex-direction: column;\n justify-content: center;\n }\n}\n\n\n","import { Component, Element, h, Host, Prop } from '@stencil/core'\nimport { Attributes, inheritAriaAttributes } from '../../utils/inherited-attributes'\nimport { CssClassMap } from '../../utils/interfaces'\n/**\n * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/loading?tab=designer).\n */\n@Component({\n tag: 'br-loading',\n styleUrl: 'loading.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Loading {\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: HTMLBrLoadingElement\n\n /**\n * Determina o tipo de indicador a ser exibido:\n * - Se verdadeiro, exibirá uma barra de progresso com a porcentagem de progresso.\n * - Se falso, exibirá um indicador de carregamento indeterminado.\n */\n @Prop({ reflect: true }) isProgress: boolean = false\n\n /**\n * Define a porcentagem de progresso a ser exibida na barra de progresso.\n * Deve ser um valor numérico entre 0 e 100. Ignorado se `isProgress` estiver definido como falso.\n */\n @Prop({ reflect: true }) progressPercent: number\n\n /**\n * Se verdadeiro, ajusta o tamanho do indicador de carregamento para o tamanho médio.\n */\n @Prop({ reflect: true }) isMedium: boolean = false\n\n /**\n * Texto a ser exibido abaixo do indicador de carregamento.\n * Pode ser usado para fornecer informações adicionais ou descritivas sobre o estado do carregamento.\n */\n @Prop({ reflect: true }) label: string\n\n componentWillLoad() {\n this.inheritedAttributes = inheritAriaAttributes(this.el)\n }\n\n private getCssClassMap(): CssClassMap {\n return {\n 'br-loading': true,\n medium: this.isMedium,\n }\n }\n\n private inheritedAttributes: Attributes = {}\n\n render() {\n return (\n <Host>\n {this.isProgress ? (\n <div\n {...this.inheritedAttributes}\n class={this.getCssClassMap()}\n role=\"progressbar\"\n data-progress={this.progressPercent}\n aria-label=\"Carregando exemplo com porcentagem\"\n aria-valuemin=\"0\"\n aria-valuenow={this.progressPercent}\n aria-valuemax=\"100\"\n >\n <div class=\"br-loading-mask full\">\n <div class=\"br-loading-fill\"></div>\n </div>\n <div class=\"br-loading-mask\">\n <div class=\"br-loading-fill\"></div>\n </div>\n </div>\n ) : (\n <div class=\"loading-progress-alignment\">\n <div\n class={this.getCssClassMap()}\n role=\"progressbar\"\n aria-label=\"Carregando exemplo indeterminado pequeno\"\n ></div>\n <span class=\"rotulo\">{this.label}</span>\n </div>\n )}\n </Host>\n )\n }\n}\n"],"version":3}
|
|
@@ -1,64 +0,0 @@
|
|
|
1
|
-
/*!
|
|
2
|
-
* Construído com @govbr-ds/webcomponents
|
|
3
|
-
* Padrão Digital de Governo.
|
|
4
|
-
*/
|
|
5
|
-
import { r as registerInstance, c as createEvent, h, a as Host, g as getElement } from './index-14721f44.js';
|
|
6
|
-
import { i as inheritAriaAttributes } from './inherited-attributes-553a7c36.js';
|
|
7
|
-
|
|
8
|
-
const messageCss = "*,*::before,*::after{-webkit-box-sizing:border-box;box-sizing:border-box}html{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;-ms-text-size-adjust:100%;text-size-adjust:100%}body{margin:0}a{background-color:transparent}strong{font-weight:bolder}small{font-size:80%}img{border-style:none}button,input,select,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button,select{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]{-webkit-box-sizing:border-box;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:-ms-flexbox !important;display:flex !important}.align-items-center{-ms-flex-align:center !important;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{-ms-flex:1 0 0%;flex:1 0 0%;min-width:8.3333333333%}.col-auto{-ms-flex:0 0 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:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;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}.mr-n2{margin-right:calc(var(--spacing-scale-base) * -1) !important}.mb-3{margin-bottom:var(--spacing-scale-2x) !important}.mr-auto{margin-right:auto !important}.pt-half{padding-top:var(--spacing-scale-half) !important}.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:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--interactive-rgb), var(--hover))), to(rgba(var(--interactive-rgb), var(--hover))));background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--interactive-rgb), var(--pressed))), to(rgba(var(--interactive-rgb), var(--pressed))));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}::-webkit-input-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}:-ms-input-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}::-ms-input-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)}.text-pure-0{color:var(--pure-0) !important}.text-primary-default{color:var(--color-primary-default) !important}.bg-support-01{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--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) -webkit-gradient(linear, left top, left bottom, from(var(--status-highlight-overlay)), to(var(--status-highlight-overlay)));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]+*{-webkit-box-shadow:var(--surface-shadow-sm);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-message{--message-background:var(--background);--message-color-icon:var(--color);--feedback-background:var(--background);--message-text:var(--color);background:var(--message-background);display:-ms-flexbox;display:flex;margin-bottom:var(--spacing-scale-2x)}.br-message .content{color:var(--message-text);-ms-flex:1;flex:1;font-size:var(--font-size-scale-up-01);padding:var(--spacing-scale-3x) var(--spacing-scale-base) var(--spacing-scale-3x) var(--spacing-scale-2x)}.br-message .content .message-title{font-weight:var(--font-weight-semi-bold)}.br-message .content .message-body{font-weight:var(--font-weigth-regular)}.br-message .content a{font-weight:var(--font-weight-bold);text-decoration:underline}.br-message .content *:last-child{margin-bottom:0}.br-message .icon{-ms-flex-align:center;align-items:center;color:var(--message-color-icon);display:-ms-flexbox;display:flex;-ms-flex-pack:center;justify-content:center;margin:var(--spacing-vertical-center) var(--spacing-scale-2x);padding-left:var(--spacing-scale-2x);padding-right:var(--spacing-scale-2x)}.br-message .icon+.content{padding-left:0}.br-message .close{margin-right:var(--spacing-scale-base);margin-top:var(--spacing-scale-base)}.br-message.success,.br-message[success]{--message-background:var(--success-alternative);--feedback-background:var(--success);--message-color-icon:var(--success)}.br-message.success .close .br-button,.br-message[success] .close .br-button{--interactive:var(--message-color-icon);--interactive-rgb:var(--success-rgb)}.br-message.danger,.br-message[danger]{--message-background:var(--danger-alternative);--feedback-background:var(--danger);--message-color-icon:var(--danger)}.br-message.danger .close .br-button,.br-message[danger] .close .br-button{--interactive:var(--message-color-icon);--interactive-rgb:var(--danger-rgb)}.br-message.info,.br-message[info]{--message-background:var(--info-alternative);--feedback-background:var(--info);--message-color-icon:var(--info)}.br-message.info .close .br-button,.br-message[info] .close .br-button{--interactive:var(--message-color-icon);--interactive-rgb:var(--info-rgb)}.br-message.warning,.br-message[warning]{--message-background:var(--warning-alternative);--feedback-background:var(--warning)}.br-message.warning .close .br-button,.br-message[warning] .close .br-button{--interactive:var(--color);--interactive-rgb:var(--color-rgb)}.feedback{--message-background:var(--background);--message-color-icon:var(--color);--feedback-background:var(--background);--message-text:var(--color);-ms-flex-align:center;align-items:center;background:var(--feedback-background);color:var(--message-text);display:-ms-inline-flexbox;display:inline-flex;font-style:italic;font-weight:var(--font-weight-medium);margin-bottom:0;padding:var(--spacing-scale-half)}.feedback:not(.is-warning):not(.warning):not([warning]){--message-text:var(--pure-0)}.feedback.warning,.feedback[warning]{--color:var(--color-light);--color-rgb:var(--color-light-rgb);--text-color:var(--color-light);--interactive:var(--interactive-light);--interactive-rgb:var(--interactive-light-rgb);--visited:var(--visited-light);--hover:var(--hover-light);--pressed:var(--pressed-light);--focus-color:var(--focus-color-light);--focus:var(--focus-color-light)}.feedback.success,.feedback[success]{--message-background:var(--success-alternative);--feedback-background:var(--success);--message-color-icon:var(--success)}.feedback.success .close .br-button,.feedback[success] .close .br-button{--interactive:var(--message-color-icon);--interactive-rgb:var(--success-rgb)}.feedback.danger,.feedback[danger]{--message-background:var(--danger-alternative);--feedback-background:var(--danger);--message-color-icon:var(--danger)}.feedback.danger .close .br-button,.feedback[danger] .close .br-button{--interactive:var(--message-color-icon);--interactive-rgb:var(--danger-rgb)}.feedback.info,.feedback[info]{--message-background:var(--info-alternative);--feedback-background:var(--info);--message-color-icon:var(--info)}.feedback.info .close .br-button,.feedback[info] .close .br-button{--interactive:var(--message-color-icon);--interactive-rgb:var(--info-rgb)}.feedback.warning,.feedback[warning]{--message-background:var(--warning-alternative);--feedback-background:var(--warning)}.feedback.warning .close .br-button,.feedback[warning] .close .br-button{--interactive:var(--color);--interactive-rgb:var(--color-rgb)}:host{display:block}:host .icon-space{margin-right:var(--spacing-scale-half)}";
|
|
9
|
-
const BrMessageStyle0 = messageCss;
|
|
10
|
-
|
|
11
|
-
const Message = class {
|
|
12
|
-
constructor(hostRef) {
|
|
13
|
-
registerInstance(this, hostRef);
|
|
14
|
-
this.brDidClose = createEvent(this, "brDidClose", 7);
|
|
15
|
-
if (hostRef.$hostElement$["s-ei"]) {
|
|
16
|
-
this.elementInternals = hostRef.$hostElement$["s-ei"];
|
|
17
|
-
}
|
|
18
|
-
else {
|
|
19
|
-
this.elementInternals = hostRef.$hostElement$.attachInternals();
|
|
20
|
-
hostRef.$hostElement$["s-ei"] = this.elementInternals;
|
|
21
|
-
}
|
|
22
|
-
this.dismissHandler = () => {
|
|
23
|
-
this.brDidClose.emit();
|
|
24
|
-
this.el.remove();
|
|
25
|
-
};
|
|
26
|
-
this.inheritedAttributes = {};
|
|
27
|
-
this.messageTitle = undefined;
|
|
28
|
-
this.message = undefined;
|
|
29
|
-
this.isInline = false;
|
|
30
|
-
this.isClosable = false;
|
|
31
|
-
this.showIcon = false;
|
|
32
|
-
this.isFeedback = false;
|
|
33
|
-
this.state = 'info';
|
|
34
|
-
}
|
|
35
|
-
componentWillLoad() {
|
|
36
|
-
this.inheritedAttributes = inheritAriaAttributes(this.el);
|
|
37
|
-
}
|
|
38
|
-
checkIconState() {
|
|
39
|
-
const iconMap = {
|
|
40
|
-
success: 'fa-solid:check-circle',
|
|
41
|
-
warning: 'fa-solid:exclamation-triangle',
|
|
42
|
-
danger: 'fa-solid:times-circle',
|
|
43
|
-
info: 'fa-solid:info-circle',
|
|
44
|
-
};
|
|
45
|
-
return iconMap[this.state] || 'check-circle'; // Valor padrão se não encontrado
|
|
46
|
-
}
|
|
47
|
-
getCssClassMap() {
|
|
48
|
-
return {
|
|
49
|
-
'br-message': true,
|
|
50
|
-
[this.state]: true,
|
|
51
|
-
};
|
|
52
|
-
}
|
|
53
|
-
render() {
|
|
54
|
-
var _a, _b;
|
|
55
|
-
return (h(Host, { key: 'b96c347896bb97d13195dc194d88019fefdbbf2e' }, this.isFeedback ? (h("div", { class: "mb-3" }, h("span", Object.assign({ class: `feedback ${this.state}`, role: "alert" }, this.inheritedAttributes), this.showIcon ? h("br-icon", { class: "icon-space", "icon-name": this.checkIconState() }) : null, ((_a = this.message) === null || _a === void 0 ? void 0 : _a.length) === 0 ? h("slot", null) : this.message))) : (h("div", Object.assign({ class: this.getCssClassMap(), role: "alert" }, this.inheritedAttributes), this.showIcon && (h("div", { class: "icon" }, h("br-icon", { "icon-name": this.checkIconState(), height: "20", "aria-hidden": "true" }))), h("div", { class: "content", role: "alert" }, ((_b = this.message) === null || _b === void 0 ? void 0 : _b.length) === 0 ? (h("div", null, this.messageTitle && h("strong", null, this.messageTitle), this.messageTitle && !this.isInline && h("br", null), h("slot", null))) : (h("div", null, h("span", { class: "message-title mr-1" }, this.messageTitle), h("span", { class: "message-body" }, this.message)))), this.isClosable && !this.isFeedback && (h("div", { class: "close" }, h("br-button", { shape: "circle", type: "button", "aria-label": "Fechar a mensagem", onClick: this.dismissHandler }, h("br-icon", { "icon-name": "fa-solid:times", "aria-hidden": "true" }))))))));
|
|
56
|
-
}
|
|
57
|
-
static get formAssociated() { return true; }
|
|
58
|
-
get el() { return getElement(this); }
|
|
59
|
-
};
|
|
60
|
-
Message.style = BrMessageStyle0;
|
|
61
|
-
|
|
62
|
-
export { Message as br_message };
|
|
63
|
-
|
|
64
|
-
//# sourceMappingURL=br-message.entry.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"file":"br-message.entry.js","mappings":";;;;;;;AAAA,MAAM,UAAU,GAAG,8wbAA8wb,CAAC;AAClyb,wBAAe,UAAU;;MCaZ,OAAO;;;;;;;;;;;QA8DD,mBAAc,GAAG;YAChC,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAA;YACtB,IAAI,CAAC,EAAE,CAAC,MAAM,EAAE,CAAA;SACjB,CAAA;QAmBO,wBAAmB,GAAe,EAAE,CAAA;;;wBA3DC,KAAK;0BAMH,KAAK;wBAMP,KAAK;0BAMH,KAAK;qBAWwB,MAAM;;IAElF,iBAAiB;QACf,IAAI,CAAC,mBAAmB,GAAG,qBAAqB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;KAC1D;IASO,cAAc;QACpB,MAAM,OAAO,GAAG;YACd,OAAO,EAAE,uBAAuB;YAChC,OAAO,EAAE,+BAA+B;YACxC,MAAM,EAAE,uBAAuB;YAC/B,IAAI,EAAE,sBAAsB;SAC7B,CAAA;QACD,OAAO,OAAO,CAAC,IAAI,CAAC,KAAK,CAAC,IAAI,cAAc,CAAA;KAC7C;IAEO,cAAc;QACpB,OAAO;YACL,YAAY,EAAE,IAAI;YAClB,CAAC,IAAI,CAAC,KAAK,GAAG,IAAI;SACnB,CAAA;KACF;IAID,MAAM;;QACJ,QACE,EAAC,IAAI,uDACF,IAAI,CAAC,UAAU,IACd,WAAK,KAAK,EAAC,MAAM,IACf,0BAAM,KAAK,EAAE,YAAY,IAAI,CAAC,KAAK,EAAE,EAAE,IAAI,EAAC,OAAO,IAAK,IAAI,CAAC,mBAAmB,GAC7E,IAAI,CAAC,QAAQ,GAAG,eAAS,KAAK,EAAC,YAAY,eAAY,IAAI,CAAC,cAAc,EAAE,GAAY,GAAG,IAAI,EAC/F,CAAA,MAAA,IAAI,CAAC,OAAO,0CAAE,MAAM,MAAK,CAAC,GAAG,eAAa,GAAG,IAAI,CAAC,OAAO,CACrD,CACH,KAEN,yBAAK,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,EAAE,IAAI,EAAC,OAAO,IAAK,IAAI,CAAC,mBAAmB,GACzE,IAAI,CAAC,QAAQ,KACZ,WAAK,KAAK,EAAC,MAAM,IACf,4BAAoB,IAAI,CAAC,cAAc,EAAE,EAAE,MAAM,EAAC,IAAI,iBAAa,MAAM,GAAW,CAChF,CACP,EACD,WAAK,KAAK,EAAC,SAAS,EAAC,IAAI,EAAC,OAAO,IAC9B,CAAA,MAAA,IAAI,CAAC,OAAO,0CAAE,MAAM,MAAK,CAAC,IACzB,eACG,IAAI,CAAC,YAAY,IAAI,kBAAS,IAAI,CAAC,YAAY,CAAU,EACzD,IAAI,CAAC,YAAY,IAAI,CAAC,IAAI,CAAC,QAAQ,IAAI,aAAM,EAC9C,eAAa,CACT,KAEN,eACE,YAAM,KAAK,EAAC,oBAAoB,IAAE,IAAI,CAAC,YAAY,CAAQ,EAC3D,YAAM,KAAK,EAAC,cAAc,IAAE,IAAI,CAAC,OAAO,CAAQ,CAC5C,CACP,CACG,EACL,IAAI,CAAC,UAAU,IAAI,CAAC,IAAI,CAAC,UAAU,KAClC,WAAK,KAAK,EAAC,OAAO,IAChB,iBAAW,KAAK,EAAC,QAAQ,EAAC,IAAI,EAAC,QAAQ,gBAAY,mBAAmB,EAAC,OAAO,EAAE,IAAI,CAAC,cAAc,IACjG,4BAAmB,gBAAgB,iBAAa,MAAM,GAAW,CACvD,CACR,CACP,CACG,CACP,CACI,EACR;KACF;;;;;;;;","names":[],"sources":["src/components/message/message.scss?tag=br-message&encapsulation=shadow","src/components/message/message.tsx"],"sourcesContent":["@import \"../../../../../node_modules/@govbr-ds/core/src/components/message/message.scss\";\n\n:host {\n display: block;\n\n .icon-space {\n margin-right: var(--spacing-scale-half);\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 * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/message?tab=designer).\n *\n * @slot default - Utilizado para inserir qualquer conteúdo que será exibido no corpo da mensagem.\n */\n@Component({\n tag: 'br-message',\n styleUrl: 'message.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Message {\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: HTMLBrMessageElement\n\n @AttachInternals() elementInternals: ElementInternals\n\n /**\n * Define o título da mensagem, que é exibido no início, acima da mensagem principal.\n * Este título serve para destacar a mensagem textual. Não é aplicável para mensagens do tipo feedback.\n */\n @Prop({ reflect: true }) messageTitle: string\n\n /**\n * Define o texto da mensagem que será exibido.\n * Este é o conteúdo principal da mensagem. A propriedade `message` é obrigatória e deve ser fornecida para que a mensagem apareça.\n */\n @Prop({ reflect: true }) message!: string\n\n /**\n * Se definido como verdadeiro, o título da mensagem será exibido na mesma linha que a mensagem principal.\n * Isso pode ser útil para criar um layout onde o título e a mensagem estão alinhados horizontalmente.\n */\n @Prop({ reflect: true }) isInline: boolean = false\n\n /**\n * Se definido como verdadeiro, um botão de fechar será exibido para permitir que o usuário feche a mensagem.\n * Este recurso não está disponível para mensagens do tipo feedback.\n */\n @Prop({ reflect: true }) isClosable: boolean = false\n\n /**\n * Se definido como verdadeiro, um ícone associado à mensagem será exibido.\n * Use esta propriedade para mostrar ou ocultar o ícone da mensagem conforme necessário.\n */\n @Prop({ reflect: true }) showIcon: boolean = false\n\n /**\n * Define se a mensagem é do tipo feedback, geralmente usada para fornecer contexto adicional sobre ações do usuário.\n * Exemplos incluem mensagens de validação em campos de formulário. Não disponível para mensagens que não sejam de feedback.\n */\n @Prop({ reflect: true }) isFeedback: boolean = false\n\n /**\n * Define o estado do message.\n * Os possíveis valores são:\n * - 'info': Mensagem informativa.\n * - 'warning': Mensagem de aviso.\n * - 'danger': Mensagem de erro ou alerta.\n * - 'success': Mensagem de sucesso.\n * O valor padrão é 'info'.\n */\n @Prop({ reflect: true }) state: 'info' | 'warning' | 'danger' | 'success' = 'info'\n\n componentWillLoad() {\n this.inheritedAttributes = inheritAriaAttributes(this.el)\n }\n\n /** Evento emitido quando o usuário fecha a mensagem, se closable for true. */\n @Event() brDidClose: EventEmitter\n private readonly dismissHandler = () => {\n this.brDidClose.emit()\n this.el.remove()\n }\n\n private checkIconState() {\n const iconMap = {\n success: 'fa-solid:check-circle',\n warning: 'fa-solid:exclamation-triangle',\n danger: 'fa-solid:times-circle',\n info: 'fa-solid:info-circle',\n }\n return iconMap[this.state] || 'check-circle' // Valor padrão se não encontrado\n }\n\n private getCssClassMap(): CssClassMap {\n return {\n 'br-message': true,\n [this.state]: true,\n }\n }\n\n private inheritedAttributes: Attributes = {}\n\n render() {\n return (\n <Host>\n {this.isFeedback ? (\n <div class=\"mb-3\">\n <span class={`feedback ${this.state}`} role=\"alert\" {...this.inheritedAttributes}>\n {this.showIcon ? <br-icon class=\"icon-space\" icon-name={this.checkIconState()}></br-icon> : null}\n {this.message?.length === 0 ? <slot></slot> : this.message}\n </span>\n </div>\n ) : (\n <div class={this.getCssClassMap()} role=\"alert\" {...this.inheritedAttributes}>\n {this.showIcon && (\n <div class=\"icon\">\n <br-icon icon-name={this.checkIconState()} height=\"20\" aria-hidden=\"true\"></br-icon>\n </div>\n )}\n <div class=\"content\" role=\"alert\">\n {this.message?.length === 0 ? (\n <div>\n {this.messageTitle && <strong>{this.messageTitle}</strong>}\n {this.messageTitle && !this.isInline && <br />}\n <slot></slot>\n </div>\n ) : (\n <div>\n <span class=\"message-title mr-1\">{this.messageTitle}</span>\n <span class=\"message-body\">{this.message}</span>\n </div>\n )}\n </div>\n {this.isClosable && !this.isFeedback && (\n <div class=\"close\">\n <br-button shape=\"circle\" type=\"button\" aria-label=\"Fechar a mensagem\" onClick={this.dismissHandler}>\n <br-icon icon-name=\"fa-solid:times\" aria-hidden=\"true\"></br-icon>\n </br-button>\n </div>\n )}\n </div>\n )}\n </Host>\n )\n }\n}\n"],"version":3}
|