@govbr-ds/webcomponents 2.0.0-next.18 → 2.0.0-next.19
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/README.md +43 -11
- package/dist/cjs/app-globals-77a217c6.js +11 -0
- package/dist/cjs/app-globals-77a217c6.js.map +1 -0
- package/dist/cjs/br-avatar.cjs.entry.js +18 -68
- package/dist/cjs/br-avatar.cjs.entry.js.map +1 -1
- package/dist/cjs/br-button_2.cjs.entry.js +13 -93
- package/dist/cjs/br-button_2.cjs.entry.js.map +1 -1
- package/dist/cjs/br-checkbox.cjs.entry.js +11 -61
- package/dist/cjs/br-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/br-dropdown.cjs.entry.js +8 -50
- package/dist/cjs/br-dropdown.cjs.entry.js.map +1 -1
- package/dist/cjs/br-input.cjs.entry.js +18 -67
- package/dist/cjs/br-input.cjs.entry.js.map +1 -1
- package/dist/cjs/br-item.cjs.entry.js +9 -53
- package/dist/cjs/br-item.cjs.entry.js.map +1 -1
- package/dist/cjs/br-list.cjs.entry.js +12 -56
- package/dist/cjs/br-list.cjs.entry.js.map +1 -1
- package/dist/cjs/br-loading.cjs.entry.js +10 -40
- package/dist/cjs/br-loading.cjs.entry.js.map +1 -1
- package/dist/cjs/br-message.cjs.entry.js +10 -40
- package/dist/cjs/br-message.cjs.entry.js.map +1 -1
- package/dist/cjs/br-radio.cjs.entry.js +13 -88
- package/dist/cjs/br-radio.cjs.entry.js.map +1 -1
- package/dist/cjs/br-switch.cjs.entry.js +13 -68
- package/dist/cjs/br-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/br-textarea.cjs.entry.js +41 -97
- package/dist/cjs/br-textarea.cjs.entry.js.map +1 -1
- package/dist/cjs/br-upload.cjs.entry.js +7 -3
- package/dist/cjs/br-upload.cjs.entry.js.map +1 -1
- package/dist/cjs/{index-a1cc4aa4.js → index-81c11ce2.js} +145 -5
- package/dist/cjs/index-81c11ce2.js.map +1 -0
- package/dist/cjs/index.cjs.js +4 -0
- package/dist/cjs/index.cjs.js.map +1 -1
- package/dist/cjs/{inherited-attributes-61a2aff9.js → inherited-attributes-16f7d388.js} +5 -1
- package/dist/cjs/inherited-attributes-16f7d388.js.map +1 -0
- package/dist/cjs/loader.cjs.js +7 -3
- package/dist/cjs/loader.cjs.js.map +1 -1
- package/dist/cjs/{v4-c23234d2.js → v4-2a0fe526.js} +5 -1
- package/dist/cjs/v4-2a0fe526.js.map +1 -0
- package/dist/cjs/webcomponents.cjs.js +29 -4
- package/dist/cjs/webcomponents.cjs.js.map +1 -1
- package/dist/collection/collection-manifest.json +2 -2
- package/dist/collection/components/avatar/avatar.js +53 -187
- package/dist/collection/components/avatar/avatar.js.map +1 -1
- package/dist/collection/components/button/button.css +0 -35
- package/dist/collection/components/button/button.js +10 -257
- package/dist/collection/components/button/button.js.map +1 -1
- package/dist/collection/components/checkbox/checkbox.js +13 -262
- package/dist/collection/components/checkbox/checkbox.js.map +1 -1
- package/dist/collection/components/dropdown/dropdown.js +5 -246
- package/dist/collection/components/dropdown/dropdown.js.map +1 -1
- package/dist/collection/components/icon/icon.js +9 -168
- package/dist/collection/components/icon/icon.js.map +1 -1
- package/dist/collection/components/input/input.js +24 -327
- package/dist/collection/components/input/input.js.map +1 -1
- package/dist/collection/components/item/item.js +11 -253
- package/dist/collection/components/item/item.js.map +1 -1
- package/dist/collection/components/list/list.js +12 -258
- package/dist/collection/components/list/list.js.map +1 -1
- package/dist/collection/components/loading/loading.css +0 -35
- package/dist/collection/components/loading/loading.js +9 -170
- package/dist/collection/components/loading/loading.js.map +1 -1
- package/dist/collection/components/message/message.js +12 -170
- package/dist/collection/components/message/message.js.map +1 -1
- package/dist/collection/components/radio/radio.js +15 -289
- package/dist/collection/components/radio/radio.js.map +1 -1
- package/dist/collection/components/switch/switch.js +15 -270
- package/dist/collection/components/switch/switch.js.map +1 -1
- package/dist/collection/components/textarea/textarea.js +55 -323
- package/dist/collection/components/textarea/textarea.js.map +1 -1
- package/dist/collection/components/upload/upload.js +4 -0
- package/dist/collection/index.js +1 -1
- package/dist/collection/index.js.map +1 -1
- package/dist/collection/pages/{upload/upload.js → components/upload/index.js} +7 -7
- package/dist/collection/pages/scripts/menu.js +221 -0
- package/dist/collection/pages/scripts/pageLoader.js +180 -0
- package/dist/collection/utils/inherited-attributes.js +4 -0
- package/dist/collection/utils/unique-id-generator.js +4 -0
- package/dist/components/br-avatar.js +5 -154
- package/dist/components/br-avatar.js.map +1 -1
- package/dist/components/br-button.js +5 -7
- package/dist/components/br-button.js.map +1 -1
- package/dist/components/br-checkbox.js +5 -145
- package/dist/components/br-checkbox.js.map +1 -1
- package/dist/components/br-dropdown.js +5 -155
- package/dist/components/br-dropdown.js.map +1 -1
- package/dist/components/br-icon.js +5 -7
- package/dist/components/br-icon.js.map +1 -1
- package/dist/components/br-input.js +5 -236
- package/dist/components/br-input.js.map +1 -1
- package/dist/components/br-item.js +5 -212
- package/dist/components/br-item.js.map +1 -1
- package/dist/components/br-list.js +5 -137
- package/dist/components/br-list.js.map +1 -1
- package/dist/components/br-loading.js +5 -91
- package/dist/components/br-loading.js.map +1 -1
- package/dist/components/br-message.js +5 -125
- package/dist/components/br-message.js.map +1 -1
- package/dist/components/br-radio.js +5 -173
- package/dist/components/br-radio.js.map +1 -1
- package/dist/components/br-switch.js +5 -158
- package/dist/components/br-switch.js.map +1 -1
- package/dist/components/br-textarea.js +5 -180
- package/dist/components/br-textarea.js.map +1 -1
- package/dist/components/br-upload.js +5 -191
- package/dist/components/br-upload.js.map +1 -1
- package/dist/components/index.d.ts +0 -31
- package/dist/components/index.js +5 -16
- package/dist/components/index.js.map +1 -1
- package/dist/components/p-2d8e59f6.js +7 -0
- package/dist/components/p-2d8e59f6.js.map +1 -0
- package/dist/{webcomponents/p-ee6f4f3f.js → components/p-74a4eb38.js} +5 -1
- package/dist/{webcomponents/p-ee6f4f3f.js.map → components/p-74a4eb38.js.map} +1 -1
- package/dist/components/p-a23c3f6b.js +17 -0
- package/dist/components/p-a23c3f6b.js.map +1 -0
- package/dist/{webcomponents/p-14616bce.js → components/p-d5a8d30c.js} +5 -1
- package/dist/{webcomponents/p-14616bce.js.map → components/p-d5a8d30c.js.map} +1 -1
- package/dist/components/p-e4af8eac.js +6 -0
- package/dist/components/p-e4af8eac.js.map +1 -0
- package/dist/esm/app-globals-72548b13.js +9 -0
- package/dist/esm/app-globals-72548b13.js.map +1 -0
- package/dist/esm/br-avatar.entry.js +18 -68
- package/dist/esm/br-avatar.entry.js.map +1 -1
- package/dist/esm/br-button_2.entry.js +13 -93
- package/dist/esm/br-button_2.entry.js.map +1 -1
- package/dist/esm/br-checkbox.entry.js +11 -61
- package/dist/esm/br-checkbox.entry.js.map +1 -1
- package/dist/esm/br-dropdown.entry.js +8 -50
- package/dist/esm/br-dropdown.entry.js.map +1 -1
- package/dist/esm/br-input.entry.js +18 -67
- package/dist/esm/br-input.entry.js.map +1 -1
- package/dist/esm/br-item.entry.js +9 -53
- package/dist/esm/br-item.entry.js.map +1 -1
- package/dist/esm/br-list.entry.js +12 -56
- package/dist/esm/br-list.entry.js.map +1 -1
- package/dist/esm/br-loading.entry.js +10 -40
- package/dist/esm/br-loading.entry.js.map +1 -1
- package/dist/esm/br-message.entry.js +10 -40
- package/dist/esm/br-message.entry.js.map +1 -1
- package/dist/esm/br-radio.entry.js +13 -88
- package/dist/esm/br-radio.entry.js.map +1 -1
- package/dist/esm/br-switch.entry.js +13 -68
- package/dist/esm/br-switch.entry.js.map +1 -1
- package/dist/esm/br-textarea.entry.js +41 -97
- package/dist/esm/br-textarea.entry.js.map +1 -1
- package/dist/esm/br-upload.entry.js +7 -3
- package/dist/esm/br-upload.entry.js.map +1 -1
- package/dist/esm/{index-cad6e6c3.js → index-aab4a630.js} +145 -6
- package/dist/esm/index-aab4a630.js.map +1 -0
- package/dist/esm/index.js +4 -1
- package/dist/esm/index.js.map +1 -1
- package/dist/esm/{inherited-attributes-c856c729.js → inherited-attributes-553a7c36.js} +5 -1
- package/dist/esm/inherited-attributes-553a7c36.js.map +1 -0
- package/dist/esm/loader.js +8 -4
- package/dist/esm/loader.js.map +1 -1
- package/dist/esm/polyfills/core-js.js +11 -0
- package/dist/esm/polyfills/dom.js +79 -0
- package/dist/esm/polyfills/es5-html-element.js +1 -0
- package/dist/esm/polyfills/index.js +34 -0
- package/dist/esm/polyfills/system.js +6 -0
- package/dist/esm/{v4-23648a96.js → v4-c99c1585.js} +5 -1
- package/dist/esm/v4-c99c1585.js.map +1 -0
- package/dist/esm/webcomponents.js +30 -5
- package/dist/esm/webcomponents.js.map +1 -1
- package/dist/esm-es5/app-globals-72548b13.js +6 -0
- package/dist/esm-es5/app-globals-72548b13.js.map +1 -0
- package/dist/esm-es5/br-avatar.entry.js +6 -0
- package/dist/esm-es5/br-avatar.entry.js.map +1 -0
- package/dist/esm-es5/br-button_2.entry.js +17 -0
- package/dist/esm-es5/br-button_2.entry.js.map +1 -0
- package/dist/esm-es5/br-checkbox.entry.js +6 -0
- package/dist/esm-es5/br-checkbox.entry.js.map +1 -0
- package/dist/esm-es5/br-dropdown.entry.js +6 -0
- package/dist/esm-es5/br-dropdown.entry.js.map +1 -0
- package/dist/esm-es5/br-input.entry.js +6 -0
- package/dist/esm-es5/br-input.entry.js.map +1 -0
- package/dist/esm-es5/br-item.entry.js +6 -0
- package/dist/esm-es5/br-item.entry.js.map +1 -0
- package/dist/esm-es5/br-list.entry.js +6 -0
- package/dist/esm-es5/br-list.entry.js.map +1 -0
- package/dist/esm-es5/br-loading.entry.js +6 -0
- package/dist/esm-es5/br-loading.entry.js.map +1 -0
- package/dist/esm-es5/br-message.entry.js +6 -0
- package/dist/esm-es5/br-message.entry.js.map +1 -0
- package/dist/esm-es5/br-radio.entry.js +6 -0
- package/dist/esm-es5/br-radio.entry.js.map +1 -0
- package/dist/esm-es5/br-switch.entry.js +6 -0
- package/dist/esm-es5/br-switch.entry.js.map +1 -0
- package/dist/esm-es5/br-textarea.entry.js +6 -0
- package/dist/esm-es5/br-textarea.entry.js.map +1 -0
- package/dist/esm-es5/br-upload.entry.js +6 -0
- package/dist/esm-es5/br-upload.entry.js.map +1 -0
- package/dist/esm-es5/index-aab4a630.js +6 -0
- package/dist/esm-es5/index-aab4a630.js.map +1 -0
- package/dist/esm-es5/index.js +5 -0
- package/dist/esm-es5/index.js.map +1 -0
- package/dist/esm-es5/inherited-attributes-553a7c36.js +6 -0
- package/dist/esm-es5/inherited-attributes-553a7c36.js.map +1 -0
- package/dist/esm-es5/loader.js +6 -0
- package/dist/esm-es5/loader.js.map +1 -0
- package/dist/esm-es5/v4-c99c1585.js +6 -0
- package/dist/esm-es5/v4-c99c1585.js.map +1 -0
- package/dist/esm-es5/webcomponents.js +6 -0
- package/dist/esm-es5/webcomponents.js.map +1 -0
- package/dist/index.js +1 -1
- package/dist/playwright.config.js +4 -0
- package/dist/types/components/avatar/avatar.d.ts +8 -65
- package/dist/types/components/button/button.d.ts +1 -94
- package/dist/types/components/checkbox/checkbox.d.ts +4 -97
- package/dist/types/components/dropdown/dropdown.d.ts +0 -90
- package/dist/types/components/icon/icon.d.ts +2 -64
- package/dist/types/components/input/input.d.ts +10 -108
- package/dist/types/components/item/item.d.ts +1 -92
- package/dist/types/components/list/list.d.ts +2 -94
- package/dist/types/components/loading/loading.d.ts +0 -62
- package/dist/types/components/message/message.d.ts +2 -63
- package/dist/types/components/radio/radio.d.ts +4 -105
- package/dist/types/components/switch/switch.d.ts +2 -100
- package/dist/types/components/textarea/textarea.d.ts +9 -100
- package/dist/types/components.d.ts +79 -968
- package/dist/types/index.d.ts +10 -1
- package/dist/types/stencil-public-runtime.d.ts +6 -0
- package/dist/webcomponents/index.esm.js +4 -0
- package/dist/webcomponents/p-05343155.system.entry.js +6 -0
- package/dist/webcomponents/p-05343155.system.entry.js.map +1 -0
- package/dist/webcomponents/p-155191ea.entry.js +6 -0
- package/dist/webcomponents/{p-db9737b1.entry.js.map → p-155191ea.entry.js.map} +1 -1
- package/dist/webcomponents/p-183614c8.system.entry.js +6 -0
- package/dist/webcomponents/p-183614c8.system.entry.js.map +1 -0
- package/dist/webcomponents/p-2083ff7b.entry.js +6 -0
- package/dist/webcomponents/p-2083ff7b.entry.js.map +1 -0
- package/dist/webcomponents/p-24da392a.entry.js +6 -0
- package/dist/webcomponents/p-24da392a.entry.js.map +1 -0
- package/dist/webcomponents/p-254a2b7c.js +6 -0
- package/dist/webcomponents/{p-e1255160.js.map → p-254a2b7c.js.map} +1 -1
- package/dist/webcomponents/p-28aa7e4d.system.entry.js +6 -0
- package/dist/webcomponents/p-28aa7e4d.system.entry.js.map +1 -0
- package/dist/webcomponents/p-2c2c8629.js +7 -0
- package/dist/webcomponents/p-2c2c8629.js.map +1 -0
- package/dist/webcomponents/p-2cc63872.system.entry.js +6 -0
- package/dist/webcomponents/p-2cc63872.system.entry.js.map +1 -0
- package/dist/webcomponents/p-2cef0b07.system.entry.js +17 -0
- package/dist/webcomponents/p-2cef0b07.system.entry.js.map +1 -0
- package/dist/webcomponents/p-34cec0b3.system.entry.js +6 -0
- package/dist/webcomponents/p-34cec0b3.system.entry.js.map +1 -0
- package/dist/webcomponents/p-3c4dea67.entry.js +6 -0
- package/dist/webcomponents/p-3c4dea67.entry.js.map +1 -0
- package/dist/webcomponents/p-3f00a196.entry.js +6 -0
- package/dist/webcomponents/p-3f00a196.entry.js.map +1 -0
- package/dist/webcomponents/p-430afeb5.system.js +7 -0
- package/dist/webcomponents/p-430afeb5.system.js.map +1 -0
- package/dist/webcomponents/p-5539ffa8.entry.js +6 -0
- package/dist/webcomponents/p-5539ffa8.entry.js.map +1 -0
- package/dist/webcomponents/p-626fe2cb.entry.js +6 -0
- package/dist/webcomponents/p-626fe2cb.entry.js.map +1 -0
- package/dist/webcomponents/p-66b81760.entry.js +17 -0
- package/dist/webcomponents/p-66b81760.entry.js.map +1 -0
- package/dist/webcomponents/p-6a8226b3.system.entry.js +6 -0
- package/dist/webcomponents/p-6a8226b3.system.entry.js.map +1 -0
- package/dist/webcomponents/p-6e286eba.system.js +6 -0
- package/dist/webcomponents/p-6e286eba.system.js.map +1 -0
- package/dist/webcomponents/p-71be2e3f.system.entry.js +6 -0
- package/dist/webcomponents/p-71be2e3f.system.entry.js.map +1 -0
- package/dist/webcomponents/p-74a4eb38.js +6 -0
- package/dist/webcomponents/p-74a4eb38.js.map +1 -0
- package/dist/webcomponents/p-7a4e1265.system.entry.js +6 -0
- package/dist/webcomponents/p-7a4e1265.system.entry.js.map +1 -0
- package/dist/webcomponents/p-8039a644.system.entry.js +6 -0
- package/dist/webcomponents/p-8039a644.system.entry.js.map +1 -0
- package/dist/webcomponents/p-842b2513.entry.js +6 -0
- package/dist/webcomponents/p-842b2513.entry.js.map +1 -0
- package/dist/webcomponents/p-90e2e623.system.js +6 -0
- package/dist/webcomponents/p-90e2e623.system.js.map +1 -0
- package/dist/webcomponents/p-a71689a5.system.js +6 -0
- package/dist/webcomponents/p-a71689a5.system.js.map +1 -0
- package/dist/webcomponents/p-ae629243.system.entry.js +6 -0
- package/dist/webcomponents/p-ae629243.system.entry.js.map +1 -0
- package/dist/webcomponents/p-b88a5d9a.system.js +6 -0
- package/dist/webcomponents/p-b88a5d9a.system.js.map +1 -0
- package/dist/webcomponents/p-b9fd2bc0.system.entry.js +6 -0
- package/dist/webcomponents/p-b9fd2bc0.system.entry.js.map +1 -0
- package/dist/webcomponents/p-d5a8d30c.js +6 -0
- package/dist/webcomponents/p-d5a8d30c.js.map +1 -0
- package/dist/webcomponents/p-dcf41d91.entry.js +6 -0
- package/dist/webcomponents/p-dcf41d91.entry.js.map +1 -0
- package/dist/webcomponents/p-e027fca2.entry.js +6 -0
- package/dist/webcomponents/p-e027fca2.entry.js.map +1 -0
- package/dist/webcomponents/p-e751c991.system.js +6 -0
- package/dist/webcomponents/p-e751c991.system.js.map +1 -0
- package/dist/webcomponents/p-e8b5b14f.entry.js +6 -0
- package/dist/webcomponents/p-e8b5b14f.entry.js.map +1 -0
- package/dist/webcomponents/p-f5e674ba.system.entry.js +6 -0
- package/dist/webcomponents/p-f5e674ba.system.entry.js.map +1 -0
- package/dist/webcomponents/p-fd6c166e.entry.js +6 -0
- package/dist/webcomponents/p-fd6c166e.entry.js.map +1 -0
- package/dist/webcomponents/webcomponents.esm.js +5 -1
- package/dist/webcomponents/webcomponents.esm.js.map +1 -1
- package/dist/webcomponents/webcomponents.js +127 -0
- package/hydrate/index.d.ts +6 -0
- package/hydrate/index.js +677 -1100
- package/hydrate/index.mjs +677 -1100
- package/loader/cdn.js +6 -1
- package/loader/index.cjs.js +6 -1
- package/loader/index.es2017.js +5 -0
- package/loader/index.js +6 -1
- package/package.json +21 -24
- package/vscode-data.json +87 -44
- package/dist/cjs/app-globals-3a1e7e63.js +0 -7
- package/dist/cjs/app-globals-3a1e7e63.js.map +0 -1
- package/dist/cjs/index-a1cc4aa4.js.map +0 -1
- package/dist/cjs/inherited-attributes-61a2aff9.js.map +0 -1
- package/dist/cjs/v4-c23234d2.js.map +0 -1
- package/dist/collection/scripts/menu.js +0 -137
- package/dist/collection/scripts/pageLoader.js +0 -64
- package/dist/collection/scripts/utils.js +0 -16
- package/dist/components/p-14616bce.js +0 -68
- package/dist/components/p-14616bce.js.map +0 -1
- package/dist/components/p-62a01df5.js +0 -1518
- package/dist/components/p-62a01df5.js.map +0 -1
- package/dist/components/p-a56c657d.js +0 -2476
- package/dist/components/p-a56c657d.js.map +0 -1
- package/dist/components/p-beaf8009.js +0 -138
- package/dist/components/p-beaf8009.js.map +0 -1
- package/dist/components/p-ee6f4f3f.js +0 -101
- package/dist/components/p-ee6f4f3f.js.map +0 -1
- package/dist/esm/app-globals-0f993ce5.js +0 -5
- package/dist/esm/app-globals-0f993ce5.js.map +0 -1
- package/dist/esm/index-cad6e6c3.js.map +0 -1
- package/dist/esm/inherited-attributes-c856c729.js.map +0 -1
- package/dist/esm/v4-23648a96.js.map +0 -1
- package/dist/webcomponents/p-25712f0a.entry.js +0 -2
- package/dist/webcomponents/p-25712f0a.entry.js.map +0 -1
- package/dist/webcomponents/p-2a3b2fe1.entry.js +0 -2
- package/dist/webcomponents/p-2a3b2fe1.entry.js.map +0 -1
- package/dist/webcomponents/p-3448c201.entry.js +0 -2
- package/dist/webcomponents/p-3448c201.entry.js.map +0 -1
- package/dist/webcomponents/p-3cfb219d.entry.js +0 -2
- package/dist/webcomponents/p-3cfb219d.entry.js.map +0 -1
- package/dist/webcomponents/p-3e61ae83.entry.js +0 -2
- package/dist/webcomponents/p-3e61ae83.entry.js.map +0 -1
- package/dist/webcomponents/p-458544c2.entry.js +0 -2
- package/dist/webcomponents/p-458544c2.entry.js.map +0 -1
- package/dist/webcomponents/p-4b1451e2.entry.js +0 -2
- package/dist/webcomponents/p-4b1451e2.entry.js.map +0 -1
- package/dist/webcomponents/p-50a0b445.entry.js +0 -2
- package/dist/webcomponents/p-50a0b445.entry.js.map +0 -1
- package/dist/webcomponents/p-5a1212cc.entry.js +0 -2
- package/dist/webcomponents/p-5a1212cc.entry.js.map +0 -1
- package/dist/webcomponents/p-8dfeb926.js +0 -3
- package/dist/webcomponents/p-8dfeb926.js.map +0 -1
- package/dist/webcomponents/p-9c47096a.entry.js +0 -2
- package/dist/webcomponents/p-9c47096a.entry.js.map +0 -1
- package/dist/webcomponents/p-ae190c60.entry.js +0 -2
- package/dist/webcomponents/p-ae190c60.entry.js.map +0 -1
- package/dist/webcomponents/p-db9737b1.entry.js +0 -2
- package/dist/webcomponents/p-e1255160.js +0 -2
- package/dist/webcomponents/p-fa595e69.entry.js +0 -13
- package/dist/webcomponents/p-fa595e69.entry.js.map +0 -1
- /package/dist/collection/pages/{button/button.js → components/button/index.js} +0 -0
- /package/dist/collection/pages/{checkbox/checkbox.js → components/checkbox/index.js} +0 -0
- /package/dist/collection/pages/{dropdown/dropdown.js → components/dropdown/index.js} +0 -0
- /package/dist/collection/pages/{icon/icon.js → components/icon/index.js} +0 -0
- /package/dist/collection/pages/{input/input.js → components/input/index.js} +0 -0
- /package/dist/collection/pages/{item/item.js → components/item/index.js} +0 -0
- /package/dist/collection/pages/{list/list.js → components/list/index.js} +0 -0
- /package/dist/collection/pages/{message/message.js → components/message/index.js} +0 -0
- /package/dist/collection/pages/{radio/radio.js → components/radio/index.js} +0 -0
- /package/dist/collection/pages/{switch/switch.js → components/switch/index.js} +0 -0
- /package/dist/collection/pages/{textarea/textarea.js → components/textarea/index.js} +0 -0
|
@@ -1,174 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
// Cria uma parte aleatória do comprimento desejado
|
|
6
|
-
const randomPart = Array.from(crypto.getRandomValues(new Uint8Array(randomPartLength)))
|
|
7
|
-
.map((num) => (num % 16).toString(16)) // Converte os números para hexadecimal
|
|
8
|
-
.join(''); // Junta os caracteres para criar uma string
|
|
9
|
-
// Concatena o prefixo e a parte aleatória
|
|
10
|
-
return `${prefix}-${randomPart}`;
|
|
11
|
-
}
|
|
12
|
-
|
|
13
|
-
const radioCss = "*,*::before,*::after{box-sizing:border-box}html{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{margin:0}a{background-color:transparent}strong{font-weight:bolder}small{font-size:80%}img{border-style:none}button,input,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;-moz-appearance:button;appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;appearance:button;font:inherit}[hidden]{display:none}.d-flex{display:flex !important}.align-items-center{align-items:center !important}.col,[class*=col-]{padding-left:calc(var(--grid-gutter) * 0.5);padding-right:calc(var(--grid-gutter) * 0.5);width:100%}.col{flex:1 0 0%;min-width:8.3333333333%}.col-auto{flex:0 0 auto;width:auto}.container{--grid-margin:var(--grid-portrait-margin);--grid-maxwidth:var(--grid-portrait-maxwidth);margin-left:auto;margin-right:auto;max-width:var(--grid-maxwidth);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%}.row{--grid-gutter:var(--grid-portrait-gutter);display:flex;flex-wrap:wrap;margin-left:calc(var(--grid-gutter) * -0.5);margin-right:calc(var(--grid-gutter) * -0.5)}@media (min-width: 576px){.container{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin))}}@media (min-width: 992px){.container{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin))}}@media (min-width: 1280px){.container{--grid-margin:var(--grid-desktop-margin)}.row{--grid-gutter:var(--grid-desktop-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin))}}@media (min-width: 1600px){.container{--grid-margin:var(--grid-tv-margin)}.row{--grid-gutter:var(--grid-tv-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin))}}.mt-1{margin-top:var(--spacing-scale-half) !important}.mr-1{margin-right:var(--spacing-scale-half) !important}.mr-2{margin-right:var(--spacing-scale-base) !important}.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:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--pressed)), rgba(var(--interactive-rgb), var(--pressed)))}button{cursor:pointer}img{max-width:100%;vertical-align:middle}ul{margin-bottom:var(--spacing-scale-2x);margin-top:0;padding:0 0 0 var(--spacing-scale-5x)}label,.label{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half)}::-moz-placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}::placeholder,.placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}input,textarea,.input{color:var(--color-light);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-half)}.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) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));color:var(--status-highlight-text);padding:0 var(--spacing-scale-half)}[disabled],.disabled{cursor:not-allowed;opacity:var(--disabled)}[disabled] *,.disabled *{pointer-events:none}[data-toggle=dropdown]+*{position:absolute}.dropdown{position:relative}.dropdown [data-toggle=dropdown]+*{box-shadow:var(--surface-shadow-sm);left:0;position:absolute;top:100%}.dropdown .br-item{--color:var(--color-light);--color-rgb:var(--color-light-rgb);--text-color:var(--color-light);--interactive:var(--interactive-light);--interactive-rgb:var(--color-rgb);--visited:var(--visited-light);--hover:var(--hover-light);--pressed:var(--pressed-light);--focus-color:var(--focus-color-light);--focus:var(--focus-color-light);--item-padding-y:var(--spacing-scale-2x);background-color:var(--background-light);color:var(--color)}.dropdown .br-item:not(:last-child){border-bottom:1px solid var(--border-color)}.dropdown .br-item.selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}.br-radio{--radio-size:24px;--radio-bullet-size:16px;--radio-bullet-position:calc((var(--radio-size) - var(--radio-bullet-size)) * 0.5);display:block}.br-radio+.br-radio{margin-top:var(--spacing-scale-base)}.br-radio input{opacity:0;position:absolute}.br-radio input+label{cursor:pointer;display:inline-block;margin-bottom:0;min-height:var(--radio-size);min-width:var(--radio-size);padding-left:calc(var(--spacing-scale-base) + var(--radio-size));position:relative}.br-radio input+label::before{background:var(--background);border:1px solid var(--border-color);border-radius:50%;content:\"\";height:var(--radio-size);left:0;position:absolute;top:-1px;width:var(--radio-size)}.br-radio input+label:empty{padding:0}.br-radio input+label:empty::before{top:0}.br-radio label{font-weight:var(--font-weight-medium)}.br-radio input:checked+label::after{background:var(--selected);border:7px solid var(--selected);border-radius:50%;content:\"\";height:var(--radio-bullet-size);left:var(--radio-bullet-position);position:absolute;right:0;top:calc(var(--radio-bullet-position) - 1px);width:var(--radio-bullet-size)}.br-radio input:checked+label:empty::after{top:var(--radio-bullet-position)}.br-radio.valid input+label::before,.br-radio[valid] input+label::before{border-color:var(--success)}.br-radio.invalid input+label::before,.br-radio[invalid] input+label::before{border-color:var(--danger)}.br-radio.small input+label,.br-radio[small] input+label{line-height:var(--spacing-scale-2xh);min-height:var(--spacing-scale-2xh)}.br-radio.small input+label::before,.br-radio[small] input+label::before{height:var(--spacing-scale-2xh);width:var(--spacing-scale-2xh)}.br-radio.small input:checked+label::after,.br-radio[small] input:checked+label::after{border-width:4px;height:10px;width:10px}.br-radio input:invalid+label::before{border-color:var(--danger)}.br-radio input:focus-visible:checked+label::before,.br-radio input:focus-visible+label::before{border-color:var(--focus) !important;box-shadow:0 0 0 var(--surface-width-md) var(--focus);outline:none}.br-radio input:hover:not(:disabled)+label::before{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}.br-radio.dark-mode,.br-radio.dark-mode label{color:var(--color-dark)}:host{display:block}.br-radio.hidden-label label{padding-left:calc(var(--checkbox-size) + var(--surface-width-md) * 2);text-indent:-10000px;white-space:nowrap;width:0}";
|
|
14
|
-
const BrRadioStyle0 = radioCss;
|
|
15
|
-
|
|
16
|
-
const Radio = /*@__PURE__*/ proxyCustomElement(class Radio extends H {
|
|
17
|
-
constructor() {
|
|
18
|
-
super();
|
|
19
|
-
this.__registerHost();
|
|
20
|
-
this.__attachShadow();
|
|
21
|
-
this.brDidConnect = createEvent(this, "brDidConnect", 7);
|
|
22
|
-
this.brWillLoad = createEvent(this, "brWillLoad", 7);
|
|
23
|
-
this.brDidLoad = createEvent(this, "brDidLoad", 7);
|
|
24
|
-
this.brWillRender = createEvent(this, "brWillRender", 7);
|
|
25
|
-
this.brDidRender = createEvent(this, "brDidRender", 7);
|
|
26
|
-
this.brShouldUpdate = createEvent(this, "brShouldUpdate", 7);
|
|
27
|
-
this.brWillUpdate = createEvent(this, "brWillUpdate", 7);
|
|
28
|
-
this.brDidUpdate = createEvent(this, "brDidUpdate", 7);
|
|
29
|
-
this.brDidDisconnect = createEvent(this, "brDidDisconnect", 7);
|
|
30
|
-
this.brFormAssociatedCallback = createEvent(this, "brFormAssociatedCallback", 7);
|
|
31
|
-
this.brFormDisabledCallback = createEvent(this, "brFormDisabledCallback", 7);
|
|
32
|
-
this.brFormResetCallback = createEvent(this, "brFormResetCallback", 7);
|
|
33
|
-
this.brFormStateRestoreCallback = createEvent(this, "brFormStateRestoreCallback", 7);
|
|
34
|
-
this.brDidChange = createEvent(this, "brDidChange", 7);
|
|
35
|
-
this.elementInternals = this.attachInternals();
|
|
36
|
-
this.inheritedAttributes = {};
|
|
37
|
-
/**
|
|
38
|
-
* Handler para o event "click"
|
|
39
|
-
* @param event Objeto Event
|
|
40
|
-
*/
|
|
41
|
-
this.onClick = (event) => {
|
|
42
|
-
event.stopPropagation();
|
|
43
|
-
this.checked = event.target.checked;
|
|
44
|
-
};
|
|
45
|
-
/**
|
|
46
|
-
* Handler para o evento "change"
|
|
47
|
-
*/
|
|
48
|
-
this.onChange = () => {
|
|
49
|
-
this.brDidChange.emit({ id: this.computedId, name: this.name, value: this.value, checked: this.checked });
|
|
50
|
-
};
|
|
51
|
-
this.computedId = undefined;
|
|
52
|
-
this.checked = false;
|
|
53
|
-
this.disabled = false;
|
|
54
|
-
this.state = null;
|
|
55
|
-
this.hasHiddenLabel = false;
|
|
56
|
-
this.name = undefined;
|
|
57
|
-
this.label = undefined;
|
|
58
|
-
this.value = undefined;
|
|
59
|
-
this.customId = undefined;
|
|
60
|
-
}
|
|
61
|
-
onCustomIdChange(newValue) {
|
|
62
|
-
if (newValue) {
|
|
63
|
-
this.computedId = newValue;
|
|
64
|
-
}
|
|
65
|
-
else {
|
|
66
|
-
this.computedId = generateUniqueId('radio', 8);
|
|
67
|
-
}
|
|
68
|
-
}
|
|
69
|
-
connectedCallback() {
|
|
70
|
-
this.getComputedId();
|
|
71
|
-
this.brDidConnect.emit();
|
|
72
|
-
}
|
|
73
|
-
componentWillLoad() {
|
|
74
|
-
this.brWillLoad.emit();
|
|
75
|
-
this.inheritedAttributes = inheritAriaAttributes(this.el);
|
|
76
|
-
}
|
|
77
|
-
componentDidLoad() {
|
|
78
|
-
this.brDidLoad.emit();
|
|
79
|
-
}
|
|
80
|
-
componentWillRender() {
|
|
81
|
-
this.brWillRender.emit();
|
|
82
|
-
}
|
|
83
|
-
componentDidRender() {
|
|
84
|
-
this.brDidRender.emit();
|
|
85
|
-
}
|
|
86
|
-
componentShouldUpdate() {
|
|
87
|
-
this.brShouldUpdate.emit();
|
|
88
|
-
}
|
|
89
|
-
componentWillUpdate() {
|
|
90
|
-
this.brWillUpdate.emit();
|
|
91
|
-
}
|
|
92
|
-
componentDidUpdate() {
|
|
93
|
-
this.brDidUpdate.emit();
|
|
94
|
-
}
|
|
95
|
-
disconnectedCallback() {
|
|
96
|
-
this.brDidDisconnect.emit();
|
|
97
|
-
}
|
|
98
|
-
formAssociatedCallback(form) {
|
|
99
|
-
this.brFormAssociatedCallback.emit(form);
|
|
100
|
-
}
|
|
101
|
-
formDisabledCallback(disabled) {
|
|
102
|
-
this.brFormDisabledCallback.emit(disabled);
|
|
103
|
-
}
|
|
104
|
-
formResetCallback() {
|
|
105
|
-
this.brFormResetCallback.emit();
|
|
106
|
-
}
|
|
107
|
-
formStateRestoreCallback(state, _mode) {
|
|
108
|
-
this.brFormStateRestoreCallback.emit([state, _mode]);
|
|
109
|
-
}
|
|
110
|
-
// Ouvinte para o evento "brDidChange"
|
|
111
|
-
onBrDidChange(event) {
|
|
112
|
-
// If the event is from another radio with the same name, deselect this one
|
|
113
|
-
if (event.detail.id !== this.computedId && event.detail.name === this.name) {
|
|
114
|
-
this.checked = false;
|
|
115
|
-
}
|
|
116
|
-
}
|
|
117
|
-
getCssClassMap() {
|
|
118
|
-
return {
|
|
119
|
-
'br-radio': true,
|
|
120
|
-
valid: this.state === 'valid',
|
|
121
|
-
invalid: this.state === 'invalid',
|
|
122
|
-
disabled: this.disabled,
|
|
123
|
-
'hidden-label': this.hasHiddenLabel,
|
|
124
|
-
};
|
|
125
|
-
}
|
|
126
|
-
/**
|
|
127
|
-
* Determina um id para o radio.
|
|
128
|
-
*/
|
|
129
|
-
getComputedId() {
|
|
130
|
-
var _a;
|
|
131
|
-
this.computedId = (_a = this.customId) !== null && _a !== void 0 ? _a : generateUniqueId('radio', 8);
|
|
132
|
-
}
|
|
133
|
-
render() {
|
|
134
|
-
return (h(Host, { key: '157fbced7af9781ebec0d96ce5046d623e2d585d', "aria-disabled": this.disabled ? 'true' : null }, h("div", { key: 'f34f4954e2369d118ef3af1f41ca96883717830e', class: this.getCssClassMap() }, h("input", Object.assign({ key: 'b04146beacb034b9d86a5140d0a88019f5d21ba9', "aria-label": this.label, type: "radio", id: this.computedId, name: this.name, checked: this.checked, disabled: this.disabled, value: this.value, onClick: this.onClick, onChange: this.onChange }, this.inheritedAttributes)), h("label", { key: 'ef29ce8a1ac83addc13723bfe97f0a65198c6133', htmlFor: this.computedId }, h("slot", { key: '1ad0ef5ad91ca8e7adeb7146fa3e270cb2f36a0f' }, this.label)))));
|
|
135
|
-
}
|
|
136
|
-
static get formAssociated() { return true; }
|
|
137
|
-
get el() { return this; }
|
|
138
|
-
static get watchers() { return {
|
|
139
|
-
"customId": ["onCustomIdChange"]
|
|
140
|
-
}; }
|
|
141
|
-
static get style() { return BrRadioStyle0; }
|
|
142
|
-
}, [65, "br-radio", {
|
|
143
|
-
"checked": [1540],
|
|
144
|
-
"disabled": [516],
|
|
145
|
-
"state": [513],
|
|
146
|
-
"hasHiddenLabel": [516, "has-hidden-label"],
|
|
147
|
-
"name": [513],
|
|
148
|
-
"label": [513],
|
|
149
|
-
"value": [520],
|
|
150
|
-
"customId": [513, "id"],
|
|
151
|
-
"computedId": [32]
|
|
152
|
-
}, [[8, "brDidChange", "onBrDidChange"]], {
|
|
153
|
-
"customId": ["onCustomIdChange"]
|
|
154
|
-
}]);
|
|
155
|
-
function defineCustomElement$1() {
|
|
156
|
-
if (typeof customElements === "undefined") {
|
|
157
|
-
return;
|
|
158
|
-
}
|
|
159
|
-
const components = ["br-radio"];
|
|
160
|
-
components.forEach(tagName => { switch (tagName) {
|
|
161
|
-
case "br-radio":
|
|
162
|
-
if (!customElements.get(tagName)) {
|
|
163
|
-
customElements.define(tagName, Radio);
|
|
164
|
-
}
|
|
165
|
-
break;
|
|
166
|
-
} });
|
|
167
|
-
}
|
|
168
|
-
|
|
169
|
-
const BrRadio = Radio;
|
|
170
|
-
const defineCustomElement = defineCustomElement$1;
|
|
171
|
-
|
|
172
|
-
export { BrRadio, defineCustomElement };
|
|
173
|
-
|
|
1
|
+
/*!
|
|
2
|
+
* Construído com @govbr-ds/webcomponents
|
|
3
|
+
* Padrão Digital de Governo.
|
|
4
|
+
*/
|
|
5
|
+
import{p as r,H as a,d as t,h as e,c as i}from"./p-2d8e59f6.js";import{i as o}from"./p-74a4eb38.js";import{v as n}from"./p-d5a8d30c.js";const l='*,*::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,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;-moz-appearance:button;appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{-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-radio{--radio-size:24px;--radio-bullet-size:16px;--radio-bullet-position:calc((var(--radio-size) - var(--radio-bullet-size)) * 0.5);display:block}.br-radio+.br-radio{margin-top:var(--spacing-scale-base)}.br-radio input{opacity:0;position:absolute}.br-radio input+label{cursor:pointer;display:inline-block;margin-bottom:0;min-height:var(--radio-size);min-width:var(--radio-size);padding-left:calc(var(--spacing-scale-base) + var(--radio-size));position:relative}.br-radio input+label::before{background:var(--background);border:1px solid var(--border-color);border-radius:50%;content:"";height:var(--radio-size);left:0;position:absolute;top:-1px;width:var(--radio-size)}.br-radio input+label:empty{padding:0}.br-radio input+label:empty::before{top:0}.br-radio label{font-weight:var(--font-weight-medium)}.br-radio input:checked+label::after{background:var(--selected);border:7px solid var(--selected);border-radius:50%;content:"";height:var(--radio-bullet-size);left:var(--radio-bullet-position);position:absolute;right:0;top:calc(var(--radio-bullet-position) - 1px);width:var(--radio-bullet-size)}.br-radio input:checked+label:empty::after{top:var(--radio-bullet-position)}.br-radio.valid input+label::before,.br-radio[valid] input+label::before{border-color:var(--success)}.br-radio.invalid input+label::before,.br-radio[invalid] input+label::before{border-color:var(--danger)}.br-radio.small input+label,.br-radio[small] input+label{line-height:var(--spacing-scale-2xh);min-height:var(--spacing-scale-2xh)}.br-radio.small input+label::before,.br-radio[small] input+label::before{height:var(--spacing-scale-2xh);width:var(--spacing-scale-2xh)}.br-radio.small input:checked+label::after,.br-radio[small] input:checked+label::after{border-width:4px;height:10px;width:10px}.br-radio input:invalid+label::before{border-color:var(--danger)}.br-radio input:focus-visible:checked+label::before,.br-radio input:focus-visible+label::before{border-color:var(--focus) !important;-webkit-box-shadow:0 0 0 var(--surface-width-md) var(--focus);box-shadow:0 0 0 var(--surface-width-md) var(--focus);outline:none}.br-radio input:hover:not(:disabled)+label::before{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)))}.br-radio.dark-mode,.br-radio.dark-mode label{color:var(--color-dark)}:host{display:block}.br-radio.hidden-label label{padding-left:calc(var(--checkbox-size) + var(--surface-width-md) * 2);text-indent:-10000px;white-space:nowrap;width:0}';const s=l;const d=r(class r extends a{constructor(){super();this.__registerHost();this.__attachShadow();this.brDidChange=t(this,"brDidChange",7);this.elementInternals=this.attachInternals();this.inheritedAttributes={};this.onClick=r=>{r.stopPropagation();this.checked=r.target.checked};this.onChange=()=>{this.brDidChange.emit({id:this.customId,name:this.name,value:this.value,checked:this.checked})};this.checked=false;this.disabled=false;this.state=undefined;this.hasHiddenLabel=false;this.name=undefined;this.label=undefined;this.value=undefined;this.customId=`br-input-${n()}`}componentWillLoad(){this.inheritedAttributes=o(this.el)}onBrDidChange(r){if(r.detail.id!==this.customId&&r.detail.name===this.name){this.checked=false}}getCssClassMap(){return{"br-radio":true,valid:this.state==="valid",invalid:this.state==="invalid",disabled:this.disabled,"hidden-label":this.hasHiddenLabel}}render(){return e(i,{key:"3ed11ae0e5323aff8b2704f777edf22bad5def84","aria-disabled":this.disabled?"true":null},e("div",{key:"dc8eae8863c64195594ad5222128901af5abb71f",class:this.getCssClassMap()},e("input",Object.assign({key:"f9148cb6c621e8000b8a10024d7de2220987e62f","aria-label":this.label,type:"radio",id:this.customId,name:this.name,checked:this.checked,disabled:this.disabled,value:this.value,onClick:this.onClick,onChange:this.onChange},this.inheritedAttributes)),e("label",{key:"2d36c5582422b87fb61b8264a00ddd8433e763f9",htmlFor:this.customId},e("slot",{key:"cb02bba18e2eb0b33dca491a4021e39c3758951f"},this.label))))}static get formAssociated(){return true}get el(){return this}static get style(){return s}},[65,"br-radio",{checked:[1540],disabled:[516],state:[513],hasHiddenLabel:[516,"has-hidden-label"],name:[513],label:[513],value:[520],customId:[513,"id"]},[[8,"brDidChange","onBrDidChange"]]]);function c(){if(typeof customElements==="undefined"){return}const r=["br-radio"];r.forEach((r=>{switch(r){case"br-radio":if(!customElements.get(r)){customElements.define(r,d)}break}}))}c();const g=d;const b=c;export{g as BrRadio,b as defineCustomElement};
|
|
174
6
|
//# sourceMappingURL=br-radio.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"br-radio.js","mappings":"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","names":[],"sources":["src/utils/unique-id-generator.ts","src/components/radio/radio.scss?tag=br-radio&encapsulation=shadow","src/components/radio/radio.tsx"],"sourcesContent":["export default function generateUniqueId(prefix: string = 'id', randomPartLength: number = 30): string {\n // Cria uma parte aleatória do comprimento desejado\n const randomPart = Array.from(crypto.getRandomValues(new Uint8Array(randomPartLength)))\n .map((num) => (num % 16).toString(16)) // Converte os números para hexadecimal\n .join('') // Junta os caracteres para criar uma string\n\n // Concatena o prefixo e a parte aleatória\n return `${prefix}-${randomPart}`\n}\n","@import \"../../../../../node_modules/@govbr-ds/core/src/components/radio/radio.scss\";\n\n:host {\n display: block;\n}\n\n.br-radio.hidden-label {\n label {\n padding-left: calc(var(--checkbox-size) + var(--surface-width-md)* 2);\n text-indent: -10000px;\n white-space: nowrap;\n width: 0;\n }\n}\n ","import {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Host,\n Listen,\n Prop,\n State,\n Watch,\n} from '@stencil/core'\nimport { Attributes, inheritAriaAttributes } from '../../utils/inherited-attributes'\nimport { CssClassMap } from '../../utils/interfaces'\nimport generateUniqueId from '../../utils/unique-id-generator'\n\n/**\n * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/radio?tab=designer).\n *\n * @slot default - O texto descritivo pode ser passado por propriedade (label) ou por slot.\n */\n\n@Component({\n tag: 'br-radio',\n styleUrl: 'radio.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Radio {\n /**\n * Referência ao elemento host do componente.\n * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.\n */\n @Element() el: HTMLBrRadioElement\n\n @AttachInternals() elementInternals: ElementInternals\n\n /**\n * Contém o id usado internamente no componente\n */\n @State() computedId: string\n\n /**\n * Define o estado de seleção do radio.\n * Se definido como verdadeiro, o radio estará marcado. Caso contrário, estará desmarcado.\n */\n @Prop({ reflect: true, mutable: true }) checked: boolean = false\n\n /**\n * Desativa o radio, tornando-o não interativo.\n */\n @Prop({ reflect: true }) disabled: boolean = false\n\n /**\n * Indica a validade do radio.\n * Valores possíveis:\n * - 'valid': O radio é considerado válido.\n * - 'invalid': O radio é considerado inválido.\n * Se não for especificado, o valor padrão é `null`, indicando que a validade não foi definida.\n */\n @Prop({ reflect: true }) state: 'valid' | 'invalid' = null\n\n /**\n * Define se o label associado ao radio deve ser oculto.\n * Se definido como verdadeiro, o texto do label será oculto, mas o radio ainda estará visível e funcional.\n */\n @Prop({ reflect: true, attribute: 'has-hidden-label' }) hasHiddenLabel: boolean = false\n\n /**\n * Define o nome do radio, que é utilizado para agrupar radios em formulários e identificar o campo.\n * O valor é obrigatório e deve ser fornecido para garantir o correto funcionamento em formulários.\n */\n\n @Prop({ reflect: true }) name!: string\n\n /**\n * Texto descritivo exibido à direita do radio.\n * Caso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado.\n */\n @Prop({ reflect: true }) label: string\n\n /**\n * Define o valor associado ao radio quando ele faz parte de um formulário nativo (`<form>`).\n * Esse valor é enviado com o formulário quando o radio está selecionado.\n * **Nota:** Esta propriedade não deve ser utilizada para determinar se o radio está selecionado; para verificar o estado de seleção, use a propriedade `checked`.\n */\n @Prop({ reflect: true }) value: any\n\n /**\n * Especifica o ID do componente, que é usado para conectar o label correspondente ao radio.\n * Se não for fornecido, o ID será gerado automaticamente e de forma aleatória\n */\n @Prop({ reflect: true, attribute: 'id' }) customId: string\n\n @Watch('customId')\n onCustomIdChange(newValue) {\n if (newValue) {\n this.computedId = newValue\n } else {\n this.computedId = generateUniqueId('radio', 8)\n }\n }\n\n /**\n * Emite um evento quando o componente é conectado ao DOM.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#connectedcallback) para mais detalhes.\n */\n @Event() brDidConnect: EventEmitter<void>\n connectedCallback() {\n this.getComputedId()\n this.brDidConnect.emit()\n }\n\n /**\n * Emite um evento antes que o componente seja carregado pela primeira vez.\n * Utilize este evento para realizar tarefas de inicialização antes do componente ser exibido.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillload) para mais detalhes.\n */\n @Event() brWillLoad: EventEmitter<void>\n componentWillLoad() {\n this.brWillLoad.emit()\n this.inheritedAttributes = inheritAriaAttributes(this.el)\n }\n\n /**\n * Emite um evento após o componente ter sido carregado pela primeira vez.\n * Utilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.\n */\n @Event() brDidLoad: EventEmitter<void>\n componentDidLoad() {\n this.brDidLoad.emit()\n }\n\n /**\n * Emite um evento antes do componente ser renderizado.\n * Utilize este evento para preparar o componente antes de sua renderização.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillrender) para mais detalhes.\n */\n @Event() brWillRender: EventEmitter<void>\n componentWillRender() {\n this.brWillRender.emit()\n }\n\n /**\n * Emite um evento após o componente ter sido renderizado.\n * Utilize este evento para executar ações que devem ocorrer após a renderização do componente.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidrender) para mais detalhes.\n */\n @Event() brDidRender: EventEmitter<void>\n componentDidRender() {\n this.brDidRender.emit()\n }\n\n /**\n * Emite um evento para indicar se o componente deve ser atualizado ou não.\n * Este evento é chamado antes de qualquer atualização do componente para decidir se a atualização deve prosseguir.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentshouldupdate) para mais detalhes.\n */\n @Event() brShouldUpdate: EventEmitter<void>\n componentShouldUpdate() {\n this.brShouldUpdate.emit()\n }\n\n /**\n * Emite um evento antes de o componente ser atualizado.\n * Utilize este evento para realizar ações preparatórias antes da atualização do componente.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillupdate) para mais detalhes.\n */\n @Event() brWillUpdate: EventEmitter<void>\n componentWillUpdate() {\n this.brWillUpdate.emit()\n }\n\n /**\n * Emite um evento após o componente ter sido atualizado.\n * Utilize este evento para realizar ações após a atualização do componente.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidupdate) para mais detalhes.\n */\n @Event() brDidUpdate: EventEmitter<void>\n componentDidUpdate() {\n this.brDidUpdate.emit()\n }\n\n /**\n * Emite um evento quando o componente é desconectado do DOM.\n * Utilize este evento para realizar a limpeza ou outras ações necessárias quando o componente é removido.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#disconnectedcallback) para mais detalhes.\n */\n @Event() brDidDisconnect: EventEmitter<void>\n disconnectedCallback() {\n this.brDidDisconnect.emit()\n }\n\n /**\n * Emite um evento quando o componente é associado ou removido de um `<form>`.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formassociatedcallback) para mais detalhes.\n *\n * @param form - Dados do formulário associado.\n */\n @Event() brFormAssociatedCallback: EventEmitter<FormData>\n formAssociatedCallback(form: FormData) {\n this.brFormAssociatedCallback.emit(form)\n }\n\n /**\n * Emite um evento quando o estado `disabled` do componente muda dentro de um `<form>`.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formdisabledcallback) para mais informações.\n *\n * @param disabled - Novo estado `disabled` do componente dentro do formulário.\n */\n @Event() brFormDisabledCallback: EventEmitter<boolean>\n formDisabledCallback(disabled: boolean) {\n this.brFormDisabledCallback.emit(disabled)\n }\n\n /**\n * Emite um evento quando um `<form>` é resetado.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formresetcallback) para mais detalhes.\n */\n @Event() brFormResetCallback: EventEmitter<void>\n formResetCallback() {\n this.brFormResetCallback.emit()\n }\n\n /**\n * Emite um evento quando o navegador preenche automaticamente os campos de um `<form>`.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formstaterestorecallback) para mais informações.\n *\n * @param state - Estado restaurado do formulário.\n * @param _mode - Modo de preenchimento automático do navegador.\n */\n @Event() brFormStateRestoreCallback: EventEmitter<[state: string, _mode: string]>\n formStateRestoreCallback(state: string, _mode: string) {\n this.brFormStateRestoreCallback.emit([state, _mode])\n }\n\n /**\n * Componente teve seu estado \"checked\" alterado\n */\n @Event({ bubbles: true, composed: true }) brDidChange: EventEmitter\n\n // Ouvinte para o evento \"brDidChange\"\n @Listen('brDidChange', { target: 'window' })\n onBrDidChange(event: CustomEvent) {\n // If the event is from another radio with the same name, deselect this one\n if (event.detail.id !== this.computedId && event.detail.name === this.name) {\n this.checked = false\n }\n }\n\n private getCssClassMap(): CssClassMap {\n return {\n 'br-radio': true,\n valid: this.state === 'valid',\n invalid: this.state === 'invalid',\n disabled: this.disabled,\n 'hidden-label': this.hasHiddenLabel,\n }\n }\n\n private inheritedAttributes: Attributes = {}\n\n /**\n * Determina um id para o radio.\n */\n private getComputedId() {\n this.computedId = this.customId ?? generateUniqueId('radio', 8)\n }\n\n /**\n * Handler para o event \"click\"\n * @param event Objeto Event\n */\n private onClick = (event: MouseEvent) => {\n event.stopPropagation()\n this.checked = (event.target as HTMLInputElement).checked\n }\n\n /**\n * Handler para o evento \"change\"\n */\n private onChange = () => {\n this.brDidChange.emit({ id: this.computedId, name: this.name, value: this.value, checked: this.checked })\n }\n\n render() {\n return (\n <Host aria-disabled={this.disabled ? 'true' : null}>\n <div class={this.getCssClassMap()}>\n <input\n aria-label={this.label}\n type=\"radio\"\n id={this.computedId}\n name={this.name}\n checked={this.checked}\n disabled={this.disabled}\n value={this.value}\n onClick={this.onClick}\n onChange={this.onChange}\n {...this.inheritedAttributes}\n />\n <label htmlFor={this.computedId}>\n <slot>{this.label}</slot>\n </label>\n </div>\n </Host>\n )\n }\n}\n"],"version":3}
|
|
1
|
+
{"version":3,"names":["radioCss","BrRadioStyle0","Radio","proxyCustomElement","H","this","inheritedAttributes","onClick","event","stopPropagation","checked","target","onChange","brDidChange","emit","id","customId","name","value","uuidv4","componentWillLoad","inheritAriaAttributes","el","onBrDidChange","detail","getCssClassMap","valid","state","invalid","disabled","hasHiddenLabel","render","h","Host","key","class","Object","assign","label","type","htmlFor"],"sources":["src/components/radio/radio.scss?tag=br-radio&encapsulation=shadow","src/components/radio/radio.tsx"],"sourcesContent":["@import \"../../../../../node_modules/@govbr-ds/core/src/components/radio/radio.scss\";\n\n:host {\n display: block;\n}\n\n.br-radio.hidden-label {\n label {\n padding-left: calc(var(--checkbox-size) + var(--surface-width-md)* 2);\n text-indent: -10000px;\n white-space: nowrap;\n width: 0;\n }\n}\n ","import { AttachInternals, Component, Element, Event, EventEmitter, h, Host, Listen, Prop } from '@stencil/core'\nimport { v4 as uuidv4 } from 'uuid'\nimport { Attributes, inheritAriaAttributes } from '../../utils/inherited-attributes'\nimport { CssClassMap } from '../../utils/interfaces'\n\n/**\n * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/radio?tab=designer).\n *\n * @slot default - O texto descritivo pode ser passado por propriedade (label) ou por slot.\n */\n\n@Component({\n tag: 'br-radio',\n styleUrl: 'radio.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Radio {\n /**\n * Referência ao elemento host do componente.\n * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.\n */\n @Element() el: HTMLBrRadioElement\n\n @AttachInternals() elementInternals: ElementInternals\n\n /**\n * Define o estado de seleção do radio.\n * Se definido como verdadeiro, o radio estará marcado. Caso contrário, estará desmarcado.\n */\n @Prop({ reflect: true, mutable: true }) checked: boolean = false\n\n /**\n * Desativa o radio, tornando-o não interativo.\n */\n @Prop({ reflect: true }) disabled: boolean = false\n\n /**\n * Indica a validade do radio.\n * Valores possíveis:\n * - 'valid': O radio é considerado válido.\n * - 'invalid': O radio é considerado inválido.\n * Se não for especificado, o valor padrão é `null`, indicando que a validade não foi definida.\n */\n @Prop({ reflect: true }) state: 'valid' | 'invalid'\n\n /**\n * Define se o label associado ao radio deve ser oculto.\n * Se definido como verdadeiro, o texto do label será oculto, mas o radio ainda estará visível e funcional.\n */\n @Prop({ reflect: true, attribute: 'has-hidden-label' }) hasHiddenLabel: boolean = false\n\n /**\n * Define o nome do radio, que é utilizado para agrupar radios em formulários e identificar o campo.\n * O valor é obrigatório e deve ser fornecido para garantir o correto funcionamento em formulários.\n */\n\n @Prop({ reflect: true }) name!: string\n\n /**\n * Texto descritivo exibido à direita do radio.\n * Caso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado.\n */\n @Prop({ reflect: true }) label: string\n\n /**\n * Define o valor associado ao radio quando ele faz parte de um formulário nativo (`<form>`).\n * Esse valor é enviado com o formulário quando o radio está selecionado.\n * **Nota:** Esta propriedade não deve ser utilizada para determinar se o radio está selecionado; para verificar o estado de seleção, use a propriedade `checked`.\n */\n @Prop({ reflect: true }) value: any\n\n /**\n * Identificador único do input.\n * Caso não seja fornecido, um ID gerado automaticamente será usado.\n */\n @Prop({ reflect: true, attribute: 'id' }) customId: string = `br-input-${uuidv4()}`\n\n componentWillLoad() {\n this.inheritedAttributes = inheritAriaAttributes(this.el)\n }\n\n /**\n * Componente teve seu estado \"checked\" alterado\n */\n @Event({ bubbles: true, composed: true }) brDidChange: EventEmitter\n\n // Ouvinte para o evento \"brDidChange\"\n @Listen('brDidChange', { target: 'window' })\n onBrDidChange(event: CustomEvent) {\n if (event.detail.id !== this.customId && event.detail.name === this.name) {\n this.checked = false\n }\n }\n\n private getCssClassMap(): CssClassMap {\n return {\n 'br-radio': true,\n valid: this.state === 'valid',\n invalid: this.state === 'invalid',\n disabled: this.disabled,\n 'hidden-label': this.hasHiddenLabel,\n }\n }\n\n private inheritedAttributes: Attributes = {}\n\n /**\n * Handler para o event \"click\"\n * @param event Objeto Event\n */\n private readonly onClick = (event: MouseEvent) => {\n event.stopPropagation()\n this.checked = (event.target as HTMLInputElement).checked\n }\n\n /**\n * Handler para o evento \"change\"\n */\n private readonly onChange = () => {\n this.brDidChange.emit({ id: this.customId, name: this.name, value: this.value, checked: this.checked })\n }\n\n render() {\n return (\n <Host aria-disabled={this.disabled ? 'true' : null}>\n <div class={this.getCssClassMap()}>\n <input\n aria-label={this.label}\n type=\"radio\"\n id={this.customId}\n name={this.name}\n checked={this.checked}\n disabled={this.disabled}\n value={this.value}\n onClick={this.onClick}\n onChange={this.onChange}\n {...this.inheritedAttributes}\n />\n <label htmlFor={this.customId}>\n <slot>{this.label}</slot>\n </label>\n </div>\n </Host>\n )\n }\n}\n"],"mappings":";;;;wIAAA,MAAMA,EAAW,q/XACjB,MAAAC,EAAeD,E,MCgBFE,EAAKC,EAAA,MAAAD,UAAAE,E,wJAwFRC,KAAAC,oBAAkC,GAMzBD,KAAAE,QAAWC,IAC1BA,EAAMC,kBACNJ,KAAKK,QAAWF,EAAMG,OAA4BD,OAAO,EAM1CL,KAAAO,SAAW,KAC1BP,KAAKQ,YAAYC,KAAK,CAAEC,GAAIV,KAAKW,SAAUC,KAAMZ,KAAKY,KAAMC,MAAOb,KAAKa,MAAOR,QAASL,KAAKK,SAAU,E,aA1F9C,M,cAKd,M,yCAeqC,M,4EA0BrB,YAAYS,K,CAEzE,iBAAAC,GACEf,KAAKC,oBAAsBe,EAAsBhB,KAAKiB,G,CAUxD,aAAAC,CAAcf,GACZ,GAAIA,EAAMgB,OAAOT,KAAOV,KAAKW,UAAYR,EAAMgB,OAAOP,OAASZ,KAAKY,KAAM,CACxEZ,KAAKK,QAAU,K,EAIX,cAAAe,GACN,MAAO,CACL,WAAY,KACZC,MAAOrB,KAAKsB,QAAU,QACtBC,QAASvB,KAAKsB,QAAU,UACxBE,SAAUxB,KAAKwB,SACf,eAAgBxB,KAAKyB,e,CAsBzB,MAAAC,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,2DAAgB7B,KAAKwB,SAAW,OAAS,MAC5CG,EAAA,OAAAE,IAAA,2CAAKC,MAAO9B,KAAKoB,kBACfO,EAAA,QAAAI,OAAAC,OAAA,CAAAH,IAAA,wDACc7B,KAAKiC,MACjBC,KAAK,QACLxB,GAAIV,KAAKW,SACTC,KAAMZ,KAAKY,KACXP,QAASL,KAAKK,QACdmB,SAAUxB,KAAKwB,SACfX,MAAOb,KAAKa,MACZX,QAASF,KAAKE,QACdK,SAAUP,KAAKO,UACXP,KAAKC,sBAEX0B,EAAA,SAAAE,IAAA,2CAAOM,QAASnC,KAAKW,UACnBgB,EAAA,QAAAE,IAAA,4CAAO7B,KAAKiC,S","ignoreList":[]}
|
|
@@ -1,159 +1,6 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
const switchCss = "*,*::before,*::after{box-sizing:border-box}html{line-height:var(--font-line-height-medium);-webkit-text-size-adjust:100%;-moz-text-size-adjust:100%;text-size-adjust:100%}body{margin:0}a{background-color:transparent}strong{font-weight:bolder}small{font-size:80%}img{border-style:none}button,input,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;-moz-appearance:button;appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{box-sizing:border-box;padding:0}[type=number]::-webkit-inner-spin-button,[type=number]::-webkit-outer-spin-button{height:auto}[type=search]{-webkit-appearance:textfield;-moz-appearance:textfield;appearance:textfield;outline-offset:-2px}[type=search]::-webkit-search-decoration{-webkit-appearance:none;appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;appearance:button;font:inherit}[hidden]{display:none}.d-flex{display:flex !important}.align-items-center{align-items:center !important}.col,[class*=col-]{padding-left:calc(var(--grid-gutter) * 0.5);padding-right:calc(var(--grid-gutter) * 0.5);width:100%}.col{flex:1 0 0%;min-width:8.3333333333%}.col-auto{flex:0 0 auto;width:auto}.container{--grid-margin:var(--grid-portrait-margin);--grid-maxwidth:var(--grid-portrait-maxwidth);margin-left:auto;margin-right:auto;max-width:var(--grid-maxwidth);padding-left:var(--grid-margin);padding-right:var(--grid-margin);width:100%}.row{--grid-gutter:var(--grid-portrait-gutter);display:flex;flex-wrap:wrap;margin-left:calc(var(--grid-gutter) * -0.5);margin-right:calc(var(--grid-gutter) * -0.5)}@media (min-width: 576px){.container{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-sm) - var(--grid-tablet-margin))}}@media (min-width: 992px){.container{--grid-margin:var(--grid-tablet-margin)}.row{--grid-gutter:var(--grid-tablet-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-md) - var(--grid-tablet-margin))}}@media (min-width: 1280px){.container{--grid-margin:var(--grid-desktop-margin)}.row{--grid-gutter:var(--grid-desktop-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-lg) - var(--grid-desktop-margin))}}@media (min-width: 1600px){.container{--grid-margin:var(--grid-tv-margin)}.row{--grid-gutter:var(--grid-tv-gutter)}.container{--grid-maxwidth:calc(var(--grid-breakpoint-xl) - var(--grid-tv-margin))}}.mt-1{margin-top:var(--spacing-scale-half) !important}.mr-1{margin-right:var(--spacing-scale-half) !important}.mr-2{margin-right:var(--spacing-scale-base) !important}.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:linear-gradient(rgba(var(--interactive-rgb), var(--hover)), rgba(var(--interactive-rgb), var(--hover)))}a:not(:disabled):active{background-image:linear-gradient(rgba(var(--interactive-rgb), var(--pressed)), rgba(var(--interactive-rgb), var(--pressed)))}button{cursor:pointer}img{max-width:100%;vertical-align:middle}ul{margin-bottom:var(--spacing-scale-2x);margin-top:0;padding:0 0 0 var(--spacing-scale-5x)}label,.label{color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-semi-bold);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half)}::-moz-placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}::placeholder,.placeholder{color:var(--color-light);font-size:var(--font-size-scale-base);font-style:italic;font-weight:var(--font-weight-regular);line-height:var(--font-line-height-medium);margin-bottom:var(--spacing-scale-half);margin-top:var(--spacing-scale-half);opacity:1}input,textarea,.input{color:var(--color-light);font-size:var(--font-size-scale-up-01);font-weight:var(--font-weight-medium);line-height:var(--font-line-height-low);margin-bottom:var(--spacing-scale-half)}.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) linear-gradient(var(--status-highlight-overlay), var(--status-highlight-overlay));color:var(--status-highlight-text);padding:0 var(--spacing-scale-half)}[disabled],.disabled{cursor:not-allowed;opacity:var(--disabled)}[disabled] *,.disabled *{pointer-events:none}[data-toggle=dropdown]+*{position:absolute}.dropdown{position:relative}.dropdown [data-toggle=dropdown]+*{box-shadow:var(--surface-shadow-sm);left:0;position:absolute;top:100%}.dropdown .br-item{--color:var(--color-light);--color-rgb:var(--color-light-rgb);--text-color:var(--color-light);--interactive:var(--interactive-light);--interactive-rgb:var(--color-rgb);--visited:var(--visited-light);--hover:var(--hover-light);--pressed:var(--pressed-light);--focus-color:var(--focus-color-light);--focus:var(--focus-color-light);--item-padding-y:var(--spacing-scale-2x);background-color:var(--background-light);color:var(--color)}.dropdown .br-item:not(:last-child){border-bottom:1px solid var(--border-color)}.dropdown .br-item.selected{--color:var(--color-dark);--color-rgb:var(--color-dark-rgb);--text-color:var(--color-dark);--interactive:var(--interactive-dark);--interactive-rgb:var(--interactive-dark-rgb);--visited:var(--visited-dark);--hover:var(--hover-dark);--pressed:var(--pressed-dark);--focus-color:var(--focus-color-dark);--focus:var(--focus-color-dark)}.br-switch{--switch-height:var(--switch-height-medium);--switch-width:var(--switch-width-medium);--switch-toggle-size:var(--switch-toggle-medium);--switch-icon-size:var(--switch-icon-medium);--switch-height-small:24px;--switch-height-medium:30px;--switch-height-large:36px;--switch-width-small:40px;--switch-width-medium:52px;--switch-width-large:64px;--switch-toggle-small:16px;--switch-toggle-medium:22px;--switch-toggle-large:28px;--switch-icon-small:var(--icon-size-xs);--switch-icon-medium:var(--icon-size-sm);--switch-icon-large:var(--icon-size-base);display:inline-flex;min-height:var(--switch-height);}.br-switch input{opacity:0;position:absolute}.br-switch input+label{align-items:center;color:var(--color);cursor:pointer;display:inline-flex;font-size:var(--font-size-scale-base);margin-bottom:0;position:relative}.br-switch input+label::before{background:var(--background-light);border:1px solid var(--border-color);border-radius:100em;content:\"\";height:var(--switch-height);position:absolute;width:var(--switch-width)}.br-switch input+label::after{background-color:var(--off);border-radius:50%;content:\"\";height:var(--switch-toggle-size);position:absolute;transition:all 0.3s ease-in-out;width:var(--switch-toggle-size)}.br-switch input:checked+label::after{background-color:var(--on)}.br-switch input+label{padding-right:calc(var(--spacing-scale-2x) + var(--switch-width))}.br-switch input+label:empty{padding-right:var(--switch-width)}.br-switch input+label::before{right:0}.br-switch input+label::after{right:calc(4px + var(--switch-toggle-size))}.br-switch input:checked+label::after{right:4px}.br-switch.right input+label{padding-left:calc(var(--spacing-scale-2x) + var(--switch-width));padding-right:0}.br-switch.right input+label::before{left:0}.br-switch.right input+label::after{left:4px}.br-switch.right input:checked+label::after{left:calc(var(--switch-width) - var(--switch-toggle-size) - 4px)}.br-switch.top{min-height:calc(var(--switch-height) * 2)}.br-switch.top input+label{align-items:flex-start;padding-right:0}.br-switch.top input+label::before{bottom:0;left:0}.br-switch.top input+label::after{bottom:4px;left:4px}.br-switch.top input:checked+label::after{left:calc(var(--switch-width) - var(--switch-toggle-size) - 4px)}.br-switch.small{--switch-height:var(--switch-height-small);--switch-width:var(--switch-width-small);--switch-toggle-size:var(--switch-toggle-small);--switch-icon-size:var(--switch-icon-small)}.br-switch.medium{--switch-height:var(--switch-height-medium);--switch-width:var(--switch-width-medium);--switch-toggle-size:var(--switch-toggle-medium);--switch-icon-size:var(--switch-icon-medium)}.br-switch.large{--switch-height:var(--switch-height-large);--switch-width:var(--switch-width-large);--switch-toggle-size:var(--switch-toggle-large);--switch-icon-size:var(--switch-icon-large)}.br-switch input~.switch-data{align-self:center;color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular);margin-left:8px}.br-switch input~.switch-data::before{content:attr(data-disabled)}.br-switch input:checked~.switch-data{color:var(--color)}.br-switch input:checked~.switch-data::before{content:attr(data-enabled)}.br-switch.icon input+label::after{align-items:center;color:var(--color-dark);content:\"\\f00d\";display:inline-flex;font-family:\"Font Awesome 5 Free\", sans-serif;font-size:var(--switch-icon-size);font-weight:var(--font-weight-black);justify-content:center}.br-switch.icon input:checked+label::after{content:\"\\f00c\"}.br-switch input:focus-visible+label::before{border-color:var(--focus) !important;box-shadow:0 0 0 var(--surface-width-md) var(--focus);outline:none}.br-switch input:hover:not([disabled]):checked+label::before{background-image:linear-gradient(rgba(var(--on-rgb), var(--hover)), rgba(var(--on-rgb), var(--hover)))}.br-switch input:hover:not([disabled]):not(:checked)+label::before{background-image:linear-gradient(rgba(var(--off-rgb), var(--hover)), rgba(var(--off-rgb), var(--hover)))}.br-switch input:active:not([disabled]):checked+label::before{background-image:linear-gradient(rgba(var(--on-rgb), var(--pressed)), rgba(var(--on-rgb), var(--pressed)))}.br-switch input:active:not([disabled]):not(:checked)+label::before{background-image:linear-gradient(rgba(var(--off-rgb), var(--pressed)), rgba(var(--off-rgb), var(--pressed)))}.br-switch.dark-mode,.br-switch.dark-mode label{color:var(--color-dark)}:host{display:block}";
|
|
6
|
-
const BrSwitchStyle0 = switchCss;
|
|
7
|
-
|
|
8
|
-
const Switch = /*@__PURE__*/ proxyCustomElement(class Switch extends H {
|
|
9
|
-
constructor() {
|
|
10
|
-
super();
|
|
11
|
-
this.__registerHost();
|
|
12
|
-
this.__attachShadow();
|
|
13
|
-
this.brDidConnect = createEvent(this, "brDidConnect", 7);
|
|
14
|
-
this.brWillLoad = createEvent(this, "brWillLoad", 7);
|
|
15
|
-
this.brDidLoad = createEvent(this, "brDidLoad", 7);
|
|
16
|
-
this.brWillRender = createEvent(this, "brWillRender", 7);
|
|
17
|
-
this.brDidRender = createEvent(this, "brDidRender", 7);
|
|
18
|
-
this.brShouldUpdate = createEvent(this, "brShouldUpdate", 7);
|
|
19
|
-
this.brWillUpdate = createEvent(this, "brWillUpdate", 7);
|
|
20
|
-
this.brDidUpdate = createEvent(this, "brDidUpdate", 7);
|
|
21
|
-
this.brDidDisconnect = createEvent(this, "brDidDisconnect", 7);
|
|
22
|
-
this.brFormAssociatedCallback = createEvent(this, "brFormAssociatedCallback", 7);
|
|
23
|
-
this.brFormDisabledCallback = createEvent(this, "brFormDisabledCallback", 7);
|
|
24
|
-
this.brFormResetCallback = createEvent(this, "brFormResetCallback", 7);
|
|
25
|
-
this.brFormStateRestoreCallback = createEvent(this, "brFormStateRestoreCallback", 7);
|
|
26
|
-
this.brDidCheckedChange = createEvent(this, "brDidCheckedChange", 7);
|
|
27
|
-
this.elementInternals = this.attachInternals();
|
|
28
|
-
/**
|
|
29
|
-
* Identificador único do campo de entrada.
|
|
30
|
-
* Caso não seja fornecido, um ID gerado automaticamente será usado.
|
|
31
|
-
*/
|
|
32
|
-
this._idDefault = `br-switch-${v4()}`;
|
|
33
|
-
this.handleCheckedChange = (event) => {
|
|
34
|
-
this._checkedValue = event.target.checked;
|
|
35
|
-
this.brDidCheckedChange.emit(this._checkedValue);
|
|
36
|
-
};
|
|
37
|
-
this.inheritedAttributes = {};
|
|
38
|
-
this.disabled = false;
|
|
39
|
-
this.checked = false;
|
|
40
|
-
this.customId = undefined;
|
|
41
|
-
this.label = undefined;
|
|
42
|
-
this.labelPosition = 'left';
|
|
43
|
-
this.labelOn = null;
|
|
44
|
-
this.labelOff = null;
|
|
45
|
-
this.hasIcon = false;
|
|
46
|
-
this.name = undefined;
|
|
47
|
-
this.value = undefined;
|
|
48
|
-
this.density = null;
|
|
49
|
-
this._slotDefault = false;
|
|
50
|
-
this._checkedValue = undefined;
|
|
51
|
-
}
|
|
52
|
-
connectedCallback() {
|
|
53
|
-
this.brDidConnect.emit();
|
|
54
|
-
}
|
|
55
|
-
componentWillLoad() {
|
|
56
|
-
this._hasSlotContentDefault();
|
|
57
|
-
this._checkedValue = this.checked;
|
|
58
|
-
this.brWillLoad.emit();
|
|
59
|
-
this.inheritedAttributes = inheritAriaAttributes(this.el);
|
|
60
|
-
}
|
|
61
|
-
componentDidLoad() {
|
|
62
|
-
this.brDidLoad.emit();
|
|
63
|
-
}
|
|
64
|
-
componentWillRender() {
|
|
65
|
-
this.brWillRender.emit();
|
|
66
|
-
}
|
|
67
|
-
componentDidRender() {
|
|
68
|
-
this.brDidRender.emit();
|
|
69
|
-
}
|
|
70
|
-
componentShouldUpdate() {
|
|
71
|
-
this.brShouldUpdate.emit();
|
|
72
|
-
}
|
|
73
|
-
componentWillUpdate() {
|
|
74
|
-
this.brWillUpdate.emit();
|
|
75
|
-
}
|
|
76
|
-
componentDidUpdate() {
|
|
77
|
-
this.brDidUpdate.emit();
|
|
78
|
-
}
|
|
79
|
-
disconnectedCallback() {
|
|
80
|
-
this.brDidDisconnect.emit();
|
|
81
|
-
}
|
|
82
|
-
formAssociatedCallback(form) {
|
|
83
|
-
this.brFormAssociatedCallback.emit(form);
|
|
84
|
-
}
|
|
85
|
-
formDisabledCallback(disabled) {
|
|
86
|
-
this.brFormDisabledCallback.emit(disabled);
|
|
87
|
-
}
|
|
88
|
-
formResetCallback() {
|
|
89
|
-
this.brFormResetCallback.emit();
|
|
90
|
-
}
|
|
91
|
-
formStateRestoreCallback(state, _mode) {
|
|
92
|
-
this.brFormStateRestoreCallback.emit([state, _mode]);
|
|
93
|
-
}
|
|
94
|
-
_hasSlotContentDefault() {
|
|
95
|
-
this._slotDefault = this.el.innerHTML !== '';
|
|
96
|
-
}
|
|
97
|
-
/**
|
|
98
|
-
* Inverte o valor da prop `checked`
|
|
99
|
-
*/
|
|
100
|
-
async toggleChecked() {
|
|
101
|
-
this._checkedValue = !this._checkedValue;
|
|
102
|
-
this.brDidCheckedChange.emit(this._checkedValue);
|
|
103
|
-
}
|
|
104
|
-
_getComputedId() {
|
|
105
|
-
var _a;
|
|
106
|
-
return ((_a = this.customId) === null || _a === void 0 ? void 0 : _a.length) > 0 ? this.customId : this._idDefault;
|
|
107
|
-
}
|
|
108
|
-
getCssClassMap() {
|
|
109
|
-
return {
|
|
110
|
-
'br-switch': true,
|
|
111
|
-
icon: this.hasIcon,
|
|
112
|
-
top: this.labelPosition === 'top',
|
|
113
|
-
right: this.labelPosition === 'right',
|
|
114
|
-
large: this.density === 'large',
|
|
115
|
-
small: this.density === 'small',
|
|
116
|
-
};
|
|
117
|
-
}
|
|
118
|
-
render() {
|
|
119
|
-
return (h(Host, { key: 'd2cc950b9044ce062e96f3b1dd9eda0829d02b9e' }, h("div", Object.assign({ key: '8783b57e8133cb0f53354cf48eee863123c4197b', class: this.getCssClassMap() }, this.inheritedAttributes), h("input", { key: '396d817ecc1dca472abb3e95fe5869f266047dcc', id: this._getComputedId(), type: "checkbox", name: this.name, checked: this._checkedValue, disabled: this.disabled, role: "switch", "aria-checked": this._checkedValue.toString(), "aria-disabled": this.disabled ? 'true' : null, onChange: this.handleCheckedChange }), h("label", { key: 'b0c4dff57a94c2661859b18a9e55ee8a77d541a6', htmlFor: this._getComputedId() }, this._slotDefault ? h("slot", null) : this.label), this.labelOn && this.labelOff && (h("div", { key: '18f77feda3016dcd4c645cedd943312dcaa0db1a', class: "switch-data", "data-enabled": this.labelOn, "data-disabled": this.labelOff })))));
|
|
120
|
-
}
|
|
121
|
-
static get formAssociated() { return true; }
|
|
122
|
-
get el() { return this; }
|
|
123
|
-
static get style() { return BrSwitchStyle0; }
|
|
124
|
-
}, [65, "br-switch", {
|
|
125
|
-
"disabled": [516],
|
|
126
|
-
"checked": [516],
|
|
127
|
-
"customId": [513, "id"],
|
|
128
|
-
"label": [1],
|
|
129
|
-
"labelPosition": [513, "label-position"],
|
|
130
|
-
"labelOn": [513, "label-on"],
|
|
131
|
-
"labelOff": [513, "label-off"],
|
|
132
|
-
"hasIcon": [516, "has-icon"],
|
|
133
|
-
"name": [513],
|
|
134
|
-
"value": [513],
|
|
135
|
-
"density": [513],
|
|
136
|
-
"_slotDefault": [32],
|
|
137
|
-
"_checkedValue": [32],
|
|
138
|
-
"toggleChecked": [64]
|
|
139
|
-
}]);
|
|
140
|
-
function defineCustomElement$1() {
|
|
141
|
-
if (typeof customElements === "undefined") {
|
|
142
|
-
return;
|
|
143
|
-
}
|
|
144
|
-
const components = ["br-switch"];
|
|
145
|
-
components.forEach(tagName => { switch (tagName) {
|
|
146
|
-
case "br-switch":
|
|
147
|
-
if (!customElements.get(tagName)) {
|
|
148
|
-
customElements.define(tagName, Switch);
|
|
149
|
-
}
|
|
150
|
-
break;
|
|
151
|
-
} });
|
|
152
|
-
}
|
|
153
|
-
|
|
154
|
-
const BrSwitch = Switch;
|
|
155
|
-
const defineCustomElement = defineCustomElement$1;
|
|
156
|
-
|
|
157
|
-
export { BrSwitch, defineCustomElement };
|
|
158
|
-
|
|
1
|
+
/*!
|
|
2
|
+
* Construído com @govbr-ds/webcomponents
|
|
3
|
+
* Padrão Digital de Governo.
|
|
4
|
+
*/
|
|
5
|
+
import{p as t,H as e,d as r,h as i,c as a}from"./p-2d8e59f6.js";import{i as o}from"./p-74a4eb38.js";import{v as n}from"./p-d5a8d30c.js";const s='*,*::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,textarea{font-family:inherit;font-size:100%;line-height:var(--font-line-height-medium);margin:0}button,input{overflow:visible}button{text-transform:none}button,[type=button],[type=reset],[type=submit]{-webkit-appearance:button;-moz-appearance:button;appearance:button}button::-moz-focus-inner,[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner{border-style:none;padding:0}button:-moz-focusring,[type=button]:-moz-focusring,[type=reset]:-moz-focusring,[type=submit]:-moz-focusring{outline:1px dotted ButtonText}progress{vertical-align:baseline}textarea{overflow:auto}[type=checkbox],[type=radio]{-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-switch{--switch-height:var(--switch-height-medium);--switch-width:var(--switch-width-medium);--switch-toggle-size:var(--switch-toggle-medium);--switch-icon-size:var(--switch-icon-medium);--switch-height-small:24px;--switch-height-medium:30px;--switch-height-large:36px;--switch-width-small:40px;--switch-width-medium:52px;--switch-width-large:64px;--switch-toggle-small:16px;--switch-toggle-medium:22px;--switch-toggle-large:28px;--switch-icon-small:var(--icon-size-xs);--switch-icon-medium:var(--icon-size-sm);--switch-icon-large:var(--icon-size-base);display:-ms-inline-flexbox;display:inline-flex;min-height:var(--switch-height);}.br-switch input{opacity:0;position:absolute}.br-switch input+label{-ms-flex-align:center;align-items:center;color:var(--color);cursor:pointer;display:-ms-inline-flexbox;display:inline-flex;font-size:var(--font-size-scale-base);margin-bottom:0;position:relative}.br-switch input+label::before{background:var(--background-light);border:1px solid var(--border-color);border-radius:100em;content:"";height:var(--switch-height);position:absolute;width:var(--switch-width)}.br-switch input+label::after{background-color:var(--off);border-radius:50%;content:"";height:var(--switch-toggle-size);position:absolute;-webkit-transition:all 0.3s ease-in-out;transition:all 0.3s ease-in-out;width:var(--switch-toggle-size)}.br-switch input:checked+label::after{background-color:var(--on)}.br-switch input+label{padding-right:calc(var(--spacing-scale-2x) + var(--switch-width))}.br-switch input+label:empty{padding-right:var(--switch-width)}.br-switch input+label::before{right:0}.br-switch input+label::after{right:calc(4px + var(--switch-toggle-size))}.br-switch input:checked+label::after{right:4px}.br-switch.right input+label{padding-left:calc(var(--spacing-scale-2x) + var(--switch-width));padding-right:0}.br-switch.right input+label::before{left:0}.br-switch.right input+label::after{left:4px}.br-switch.right input:checked+label::after{left:calc(var(--switch-width) - var(--switch-toggle-size) - 4px)}.br-switch.top{min-height:calc(var(--switch-height) * 2)}.br-switch.top input+label{-ms-flex-align:start;align-items:flex-start;padding-right:0}.br-switch.top input+label::before{bottom:0;left:0}.br-switch.top input+label::after{bottom:4px;left:4px}.br-switch.top input:checked+label::after{left:calc(var(--switch-width) - var(--switch-toggle-size) - 4px)}.br-switch.small{--switch-height:var(--switch-height-small);--switch-width:var(--switch-width-small);--switch-toggle-size:var(--switch-toggle-small);--switch-icon-size:var(--switch-icon-small)}.br-switch.medium{--switch-height:var(--switch-height-medium);--switch-width:var(--switch-width-medium);--switch-toggle-size:var(--switch-toggle-medium);--switch-icon-size:var(--switch-icon-medium)}.br-switch.large{--switch-height:var(--switch-height-large);--switch-width:var(--switch-width-large);--switch-toggle-size:var(--switch-toggle-large);--switch-icon-size:var(--switch-icon-large)}.br-switch input~.switch-data{-ms-flex-item-align:center;align-self:center;color:var(--color);font-size:var(--font-size-scale-base);font-weight:var(--font-weight-regular);margin-left:8px}.br-switch input~.switch-data::before{content:attr(data-disabled)}.br-switch input:checked~.switch-data{color:var(--color)}.br-switch input:checked~.switch-data::before{content:attr(data-enabled)}.br-switch.icon input+label::after{-ms-flex-align:center;align-items:center;color:var(--color-dark);content:"\\f00d";display:-ms-inline-flexbox;display:inline-flex;font-family:"Font Awesome 5 Free", sans-serif;font-size:var(--switch-icon-size);font-weight:var(--font-weight-black);-ms-flex-pack:center;justify-content:center}.br-switch.icon input:checked+label::after{content:"\\f00c"}.br-switch input:focus-visible+label::before{border-color:var(--focus) !important;-webkit-box-shadow:0 0 0 var(--surface-width-md) var(--focus);box-shadow:0 0 0 var(--surface-width-md) var(--focus);outline:none}.br-switch input:hover:not([disabled]):checked+label::before{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--on-rgb), var(--hover))), to(rgba(var(--on-rgb), var(--hover))));background-image:linear-gradient(rgba(var(--on-rgb), var(--hover)), rgba(var(--on-rgb), var(--hover)))}.br-switch input:hover:not([disabled]):not(:checked)+label::before{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--off-rgb), var(--hover))), to(rgba(var(--off-rgb), var(--hover))));background-image:linear-gradient(rgba(var(--off-rgb), var(--hover)), rgba(var(--off-rgb), var(--hover)))}.br-switch input:active:not([disabled]):checked+label::before{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--on-rgb), var(--pressed))), to(rgba(var(--on-rgb), var(--pressed))));background-image:linear-gradient(rgba(var(--on-rgb), var(--pressed)), rgba(var(--on-rgb), var(--pressed)))}.br-switch input:active:not([disabled]):not(:checked)+label::before{background-image:-webkit-gradient(linear, left top, left bottom, from(rgba(var(--off-rgb), var(--pressed))), to(rgba(var(--off-rgb), var(--pressed))));background-image:linear-gradient(rgba(var(--off-rgb), var(--pressed)), rgba(var(--off-rgb), var(--pressed)))}.br-switch.dark-mode,.br-switch.dark-mode label{color:var(--color-dark)}:host{display:block}';const l=s;const c=t(class t extends e{constructor(){super();this.__registerHost();this.__attachShadow();this.brDidCheckedChange=r(this,"brDidCheckedChange",7);this.elementInternals=this.attachInternals();this.handleCheckedChange=t=>{this._checkedValue=t.target.checked;this.brDidCheckedChange.emit(this._checkedValue)};this.inheritedAttributes={};this.disabled=false;this.checked=false;this.customId=`br-input-${n()}`;this.label=undefined;this.labelPosition="left";this.labelOn=undefined;this.labelOff=undefined;this.hasIcon=false;this.name=undefined;this.value=undefined;this.density="medium";this._slotDefault=false;this._checkedValue=undefined}componentWillLoad(){this._hasSlotContentDefault();this._checkedValue=this.checked;this.inheritedAttributes=o(this.el)}_hasSlotContentDefault(){this._slotDefault=this.el.innerHTML!==""}async toggleChecked(){this._checkedValue=!this._checkedValue;this.brDidCheckedChange.emit(this._checkedValue)}getCssClassMap(){return{"br-switch":true,icon:this.hasIcon,top:this.labelPosition==="top",right:this.labelPosition==="right",large:this.density==="large",small:this.density==="small"}}render(){return i(a,{key:"52838e1fe630318fe34af78b47a42781646f291c"},i("div",Object.assign({key:"bc2c656294f72bee0d9778791ab9a6b00cea7c9e",class:this.getCssClassMap()},this.inheritedAttributes),i("input",{key:"8ac78e3880ce376faa5e224d0fdab9602104e9ef",id:this.customId,type:"checkbox",name:this.name,checked:this._checkedValue,disabled:this.disabled,role:"switch","aria-checked":this._checkedValue.toString(),"aria-disabled":this.disabled?"true":null,onChange:this.handleCheckedChange}),i("label",{key:"4e85a4b6d51059a4a899dc24bb7a3f181e99db25",htmlFor:this.customId},this._slotDefault?i("slot",null):this.label),this.labelOn&&this.labelOff&&i("div",{key:"30b401aed4ede6e5159240b8337d429d6a7f8aff",class:"switch-data","data-enabled":this.labelOn,"data-disabled":this.labelOff})))}static get formAssociated(){return true}get el(){return this}static get style(){return l}},[65,"br-switch",{disabled:[516],checked:[516],customId:[513,"id"],label:[1],labelPosition:[513,"label-position"],labelOn:[513,"label-on"],labelOff:[513,"label-off"],hasIcon:[516,"has-icon"],name:[513],value:[513],density:[513],_slotDefault:[32],_checkedValue:[32],toggleChecked:[64]}]);function g(){if(typeof customElements==="undefined"){return}const t=["br-switch"];t.forEach((t=>{switch(t){case"br-switch":if(!customElements.get(t)){customElements.define(t,c)}break}}))}g();const h=c;const d=g;export{h as BrSwitch,d as defineCustomElement};
|
|
159
6
|
//# sourceMappingURL=br-switch.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"file":"br-switch.js","mappings":";;;;AAAA,MAAM,SAAS,GAAG,kqYAAkqY,CAAC;AACrrY,uBAAe,SAAS;;MCcX,MAAM;;;;;;;;;;;;;;;;;;;;;;;;QAaA,eAAU,GAAG,aAAaA,EAAM,EAAE,EAAE,CAAA;QAkNpC,wBAAmB,GAAG,CAAC,KAAY;YAClD,IAAI,CAAC,aAAa,GAAI,KAAK,CAAC,MAA2B,CAAC,OAAO,CAAA;YAC/D,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;SACjD,CAAA;QA0BO,wBAAmB,GAAe,EAAE,CAAA;wBA1OC,KAAK;uBAMN,KAAK;;;6BAiBkB,MAAM;uBAK9B,IAAI;wBAKH,IAAI;uBAKJ,KAAK;;;uBAgBgB,IAAI;4BAGpC,KAAK;;;IAStC,iBAAiB;QACf,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAA;KACzB;IAQD,iBAAiB;QACf,IAAI,CAAC,sBAAsB,EAAE,CAAA;QAC7B,IAAI,CAAC,aAAa,GAAG,IAAI,CAAC,OAAO,CAAA;QACjC,IAAI,CAAC,UAAU,CAAC,IAAI,EAAE,CAAA;QACtB,IAAI,CAAC,mBAAmB,GAAG,qBAAqB,CAAC,IAAI,CAAC,EAAE,CAAC,CAAA;KAC1D;IAQD,gBAAgB;QACd,IAAI,CAAC,SAAS,CAAC,IAAI,EAAE,CAAA;KACtB;IAQD,mBAAmB;QACjB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAA;KACzB;IAQD,kBAAkB;QAChB,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAA;KACxB;IAQD,qBAAqB;QACnB,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAA;KAC3B;IAQD,mBAAmB;QACjB,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAA;KACzB;IAQD,kBAAkB;QAChB,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAA;KACxB;IAQD,oBAAoB;QAClB,IAAI,CAAC,eAAe,CAAC,IAAI,EAAE,CAAA;KAC5B;IASD,sBAAsB,CAAC,IAAc;QACnC,IAAI,CAAC,wBAAwB,CAAC,IAAI,CAAC,IAAI,CAAC,CAAA;KACzC;IASD,oBAAoB,CAAC,QAAiB;QACpC,IAAI,CAAC,sBAAsB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;KAC3C;IAOD,iBAAiB;QACf,IAAI,CAAC,mBAAmB,CAAC,IAAI,EAAE,CAAA;KAChC;IAUD,wBAAwB,CAAC,KAAa,EAAE,KAAa;QACnD,IAAI,CAAC,0BAA0B,CAAC,IAAI,CAAC,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAA;KACrD;IAOO,sBAAsB;QAC5B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,EAAE,CAAC,SAAS,KAAK,EAAE,CAAA;KAC7C;;;;IAWD,MAAM,aAAa;QACjB,IAAI,CAAC,aAAa,GAAG,CAAC,IAAI,CAAC,aAAa,CAAA;QACxC,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,IAAI,CAAC,aAAa,CAAC,CAAA;KACjD;IAEO,cAAc;;QACpB,OAAO,CAAA,MAAA,IAAI,CAAC,QAAQ,0CAAE,MAAM,IAAG,CAAC,GAAG,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,UAAU,CAAA;KACnE;IAEO,cAAc;QACpB,OAAO;YACL,WAAW,EAAE,IAAI;YACjB,IAAI,EAAE,IAAI,CAAC,OAAO;YAClB,GAAG,EAAE,IAAI,CAAC,aAAa,KAAK,KAAK;YACjC,KAAK,EAAE,IAAI,CAAC,aAAa,KAAK,OAAO;YACrC,KAAK,EAAE,IAAI,CAAC,OAAO,KAAK,OAAO;YAC/B,KAAK,EAAE,IAAI,CAAC,OAAO,KAAK,OAAO;SAChC,CAAA;KACF;IAID,MAAM;QACJ,QACE,EAAC,IAAI,uDACH,0EAAK,KAAK,EAAE,IAAI,CAAC,cAAc,EAAE,IAAM,IAAI,CAAC,mBAAmB,GAC7D,8DACE,EAAE,EAAE,IAAI,CAAC,cAAc,EAAE,EACzB,IAAI,EAAC,UAAU,EACf,IAAI,EAAE,IAAI,CAAC,IAAI,EACf,OAAO,EAAE,IAAI,CAAC,aAAa,EAC3B,QAAQ,EAAE,IAAI,CAAC,QAAQ,EACvB,IAAI,EAAC,QAAQ,kBACC,IAAI,CAAC,aAAa,CAAC,QAAQ,EAAE,mBAC5B,IAAI,CAAC,QAAQ,GAAG,MAAM,GAAG,IAAI,EAC5C,QAAQ,EAAE,IAAI,CAAC,mBAAmB,GAClC,EACF,8DAAO,OAAO,EAAE,IAAI,CAAC,cAAc,EAAE,IAAG,IAAI,CAAC,YAAY,GAAG,eAAa,GAAG,IAAI,CAAC,KAAK,CAAS,EAC9F,IAAI,CAAC,OAAO,IAAI,IAAI,CAAC,QAAQ,KAC5B,4DAAK,KAAK,EAAC,aAAa,kBAAe,IAAI,CAAC,OAAO,mBAAiB,IAAI,CAAC,QAAQ,GAAQ,CAC1F,CACG,CACD,EACR;KACF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","names":["uuidv4"],"sources":["src/components/switch/switch.scss?tag=br-switch&encapsulation=shadow","src/components/switch/switch.tsx"],"sourcesContent":["@import \"../../../../../node_modules/@govbr-ds/core/src/components/switch/switch.scss\";\n\n:host {\n display: block;\n}\n","import { AttachInternals, Component, Element, Event, EventEmitter, Host, Method, Prop, State, h } from '@stencil/core'\nimport { v4 as uuidv4 } from 'uuid'\nimport { Attributes, inheritAriaAttributes } from '../../utils/inherited-attributes'\nimport { CssClassMap } from '../../utils/interfaces'\n/**\n * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/switch?tab=designer).\n *\n * @slot default - Descreve o que o switch faz quando a alternância estiver ativada. A label passada por slot tem precedência sobre a propriedade 'label'.\n */\n@Component({\n tag: 'br-switch',\n styleUrl: 'switch.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Switch {\n /**\n * Referência ao elemento host do componente.\n * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.\n */\n @Element() el: HTMLBrSwitchElement\n\n @AttachInternals() elementInternals: ElementInternals\n\n /**\n * Identificador único do campo de entrada.\n * Caso não seja fornecido, um ID gerado automaticamente será usado.\n */\n private readonly _idDefault = `br-switch-${uuidv4()}`\n\n /**\n * Desativa o switch, tornando-o não interativo.\n */\n @Prop({ reflect: true }) disabled: boolean = false\n\n /**\n * Define o estado de seleção do checkbox.\n * Se definido como verdadeiro, o checkbox estará marcado. Caso contrário, estará desmarcado.\n */\n @Prop({ reflect: true }) checked: boolean = false\n\n /**\n * Especifica o ID do componente, que é usado para conectar o label correspondente ao checkbox.\n * Se não for fornecido, o ID será o mesmo valor atribuído à propriedade `name`.\n */\n @Prop({ reflect: true, attribute: 'id' }) customId: string\n\n /**\n * Texto descritivo.\n * Caso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado.\n */\n @Prop() label: string\n\n /**\n * Posição do rótulo em relação ao switch.\n */\n @Prop({ reflect: true }) labelPosition: 'right' | 'left' | 'top' = 'left'\n\n /**\n * Texto exibido quando o switch está ativado.\n */\n @Prop({ reflect: true }) labelOn: string = null\n\n /**\n * Texto exibido quando o switch está desativado.\n */\n @Prop({ reflect: true }) labelOff: string = null\n\n /**\n * Adiciona um ícone ao switch para indicar a mudança de estado.\n */\n @Prop({ reflect: true }) hasIcon: boolean = false\n\n /**\n * Define o nome do switch, que é utilizado para agrupar switches em formulários e identificar o campo.\n * O valor é obrigatório e deve ser fornecido para garantir o correto funcionamento em formulários.\n */\n @Prop({ reflect: true }) name: string\n\n /**\n * Define o valor associado ao switch quando ele faz parte de um formulário nativo (`<form>`).\n * Esse valor é enviado com o formulário quando o switch está selecionado.\n * **Nota:** Esta propriedade não deve ser utilizada para determinar se o switch está selecionado; para verificar o estado de seleção, use a propriedade `checked`.\n */\n @Prop({ reflect: true }) value: string\n\n /** O ajuste da densidade consiste em aumentar ou reduzir a área de interação do switch. Quanto menor for a densidade, maior a área de interação. */\n @Prop({ reflect: true }) density: 'large' | 'medium' | 'small' = null\n\n // Propriedade interna para verificar a presença de conteúdo no slot default\n @State() _slotDefault: boolean = false\n\n @State() _checkedValue: boolean\n\n /**\n * Emite um evento quando o componente é conectado ao DOM.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#connectedcallback) para mais detalhes.\n */\n @Event() brDidConnect: EventEmitter<void>\n connectedCallback() {\n this.brDidConnect.emit()\n }\n\n /**\n * Emite um evento antes que o componente seja carregado pela primeira vez.\n * Utilize este evento para realizar tarefas de inicialização antes do componente ser exibido.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillload) para mais detalhes.\n */\n @Event() brWillLoad: EventEmitter<void>\n componentWillLoad() {\n this._hasSlotContentDefault()\n this._checkedValue = this.checked\n this.brWillLoad.emit()\n this.inheritedAttributes = inheritAriaAttributes(this.el)\n }\n\n /**\n * Emite um evento após o componente ter sido carregado pela primeira vez.\n * Utilize este evento para realizar ações que devem ocorrer depois que o componente foi totalmente carregado.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidload) para mais detalhes.\n */\n @Event() brDidLoad: EventEmitter<void>\n componentDidLoad() {\n this.brDidLoad.emit()\n }\n\n /**\n * Emite um evento antes do componente ser renderizado.\n * Utilize este evento para preparar o componente antes de sua renderização.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillrender) para mais detalhes.\n */\n @Event() brWillRender: EventEmitter<void>\n componentWillRender() {\n this.brWillRender.emit()\n }\n\n /**\n * Emite um evento após o componente ter sido renderizado.\n * Utilize este evento para executar ações que devem ocorrer após a renderização do componente.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidrender) para mais detalhes.\n */\n @Event() brDidRender: EventEmitter<void>\n componentDidRender() {\n this.brDidRender.emit()\n }\n\n /**\n * Emite um evento para indicar se o componente deve ser atualizado ou não.\n * Este evento é chamado antes de qualquer atualização do componente para decidir se a atualização deve prosseguir.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentshouldupdate) para mais detalhes.\n */\n @Event() brShouldUpdate: EventEmitter<void>\n componentShouldUpdate() {\n this.brShouldUpdate.emit()\n }\n\n /**\n * Emite um evento antes de o componente ser atualizado.\n * Utilize este evento para realizar ações preparatórias antes da atualização do componente.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentwillupdate) para mais detalhes.\n */\n @Event() brWillUpdate: EventEmitter<void>\n componentWillUpdate() {\n this.brWillUpdate.emit()\n }\n\n /**\n * Emite um evento após o componente ter sido atualizado.\n * Utilize este evento para realizar ações após a atualização do componente.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#componentdidupdate) para mais detalhes.\n */\n @Event() brDidUpdate: EventEmitter<void>\n componentDidUpdate() {\n this.brDidUpdate.emit()\n }\n\n /**\n * Emite um evento quando o componente é desconectado do DOM.\n * Utilize este evento para realizar a limpeza ou outras ações necessárias quando o componente é removido.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/component-lifecycle#disconnectedcallback) para mais detalhes.\n */\n @Event() brDidDisconnect: EventEmitter<void>\n disconnectedCallback() {\n this.brDidDisconnect.emit()\n }\n\n /**\n * Emite um evento quando o componente é associado ou removido de um `<form>`.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formassociatedcallback) para mais detalhes.\n *\n * @param form - Dados do formulário associado.\n */\n @Event() brFormAssociatedCallback: EventEmitter<FormData>\n formAssociatedCallback(form: FormData) {\n this.brFormAssociatedCallback.emit(form)\n }\n\n /**\n * Emite um evento quando o estado `disabled` do componente muda dentro de um `<form>`.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formdisabledcallback) para mais informações.\n *\n * @param disabled - Novo estado `disabled` do componente dentro do formulário.\n */\n @Event() brFormDisabledCallback: EventEmitter<boolean>\n formDisabledCallback(disabled: boolean) {\n this.brFormDisabledCallback.emit(disabled)\n }\n\n /**\n * Emite um evento quando um `<form>` é resetado.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formresetcallback) para mais detalhes.\n */\n @Event() brFormResetCallback: EventEmitter<void>\n formResetCallback() {\n this.brFormResetCallback.emit()\n }\n\n /**\n * Emite um evento quando o navegador preenche automaticamente os campos de um `<form>`.\n * Consulte a documentação do [Stencil](https://stenciljs.com/docs/form-associated#formstaterestorecallback) para mais informações.\n *\n * @param state - Estado restaurado do formulário.\n * @param _mode - Modo de preenchimento automático do navegador.\n */\n @Event() brFormStateRestoreCallback: EventEmitter<[state: string, _mode: string]>\n formStateRestoreCallback(state: string, _mode: string) {\n this.brFormStateRestoreCallback.emit([state, _mode])\n }\n\n /**\n * Disparado depois que o valor do `checked` foi alterado\n */\n @Event() brDidCheckedChange: EventEmitter<boolean>\n\n private _hasSlotContentDefault(): any {\n this._slotDefault = this.el.innerHTML !== ''\n }\n\n private readonly handleCheckedChange = (event: Event) => {\n this._checkedValue = (event.target as HTMLInputElement).checked\n this.brDidCheckedChange.emit(this._checkedValue)\n }\n\n /**\n * Inverte o valor da prop `checked`\n */\n @Method()\n async toggleChecked() {\n this._checkedValue = !this._checkedValue\n this.brDidCheckedChange.emit(this._checkedValue)\n }\n\n private _getComputedId(): string {\n return this.customId?.length > 0 ? this.customId : this._idDefault\n }\n\n private getCssClassMap(): CssClassMap {\n return {\n 'br-switch': true,\n icon: this.hasIcon,\n top: this.labelPosition === 'top',\n right: this.labelPosition === 'right',\n large: this.density === 'large',\n small: this.density === 'small',\n }\n }\n\n private inheritedAttributes: Attributes = {}\n\n render() {\n return (\n <Host>\n <div class={this.getCssClassMap()} {...this.inheritedAttributes}>\n <input\n id={this._getComputedId()}\n type=\"checkbox\"\n name={this.name}\n checked={this._checkedValue}\n disabled={this.disabled}\n role=\"switch\"\n aria-checked={this._checkedValue.toString()}\n aria-disabled={this.disabled ? 'true' : null}\n onChange={this.handleCheckedChange}\n />\n <label htmlFor={this._getComputedId()}>{this._slotDefault ? <slot></slot> : this.label}</label>\n {this.labelOn && this.labelOff && (\n <div class=\"switch-data\" data-enabled={this.labelOn} data-disabled={this.labelOff}></div>\n )}\n </div>\n </Host>\n )\n }\n}\n"],"version":3}
|
|
1
|
+
{"version":3,"names":["switchCss","BrSwitchStyle0","Switch","proxyCustomElement","H","this","handleCheckedChange","event","_checkedValue","target","checked","brDidCheckedChange","emit","inheritedAttributes","uuidv4","componentWillLoad","_hasSlotContentDefault","inheritAriaAttributes","el","_slotDefault","innerHTML","toggleChecked","getCssClassMap","icon","hasIcon","top","labelPosition","right","large","density","small","render","h","Host","key","Object","assign","class","id","customId","type","name","disabled","role","toString","onChange","htmlFor","label","labelOn","labelOff"],"sources":["src/components/switch/switch.scss?tag=br-switch&encapsulation=shadow","src/components/switch/switch.tsx"],"sourcesContent":["@import \"../../../../../node_modules/@govbr-ds/core/src/components/switch/switch.scss\";\n\n:host {\n display: block;\n}\n","import { AttachInternals, Component, Element, Event, EventEmitter, Host, Method, Prop, State, h } from '@stencil/core'\nimport { v4 as uuidv4 } from 'uuid'\nimport { Attributes, inheritAriaAttributes } from '../../utils/inherited-attributes'\nimport { CssClassMap } from '../../utils/interfaces'\n\n/**\n * Para uma descrição detalhada, consulte a [documentação do GovBR-DS](https://www.gov.br/ds/components/switch?tab=designer).\n *\n * @slot default - Descreve o que o switch faz quando a alternância estiver ativada. A label passada por slot tem precedência sobre a propriedade 'label'.\n */\n@Component({\n tag: 'br-switch',\n styleUrl: 'switch.scss',\n shadow: true,\n formAssociated: true,\n})\nexport class Switch {\n /**\n * Referência ao elemento host do componente.\n * Utilize esta propriedade para acessar e manipular o elemento do DOM associado ao componente.\n */\n @Element() el: HTMLBrSwitchElement\n\n @AttachInternals() elementInternals: ElementInternals\n\n /**\n * Desativa o switch, tornando-o não interativo.\n */\n @Prop({ reflect: true }) disabled: boolean = false\n\n /**\n * Define o estado de seleção do checkbox.\n * Se definido como verdadeiro, o checkbox estará marcado. Caso contrário, estará desmarcado.\n */\n @Prop({ reflect: true }) checked: boolean = false\n\n /**\n * Identificador único do switch.\n * Caso não seja fornecido, um ID gerado automaticamente será usado.\n */\n @Prop({ reflect: true, attribute: 'id' }) customId: string = `br-input-${uuidv4()}`\n\n /**\n * Texto descritivo.\n * Caso um slot seja utilizado para fornecer um texto alternativo, o valor desta propriedade será ignorado.\n */\n @Prop() label: string\n\n /**\n * Posição do rótulo em relação ao switch.\n */\n @Prop({ reflect: true }) labelPosition: 'right' | 'left' | 'top' = 'left'\n\n /**\n * Texto exibido quando o switch está ativado.\n */\n @Prop({ reflect: true }) labelOn: string\n\n /**\n * Texto exibido quando o switch está desativado.\n */\n @Prop({ reflect: true }) labelOff: string\n\n /**\n * Adiciona um ícone ao switch para indicar a mudança de estado.\n */\n @Prop({ reflect: true }) hasIcon: boolean = false\n\n /**\n * Define o nome do switch, que é utilizado para agrupar switches em formulários e identificar o campo.\n * O valor é obrigatório e deve ser fornecido para garantir o correto funcionamento em formulários.\n */\n @Prop({ reflect: true }) name: string\n\n /**\n * Define o valor associado ao switch quando ele faz parte de um formulário nativo (`<form>`).\n * Esse valor é enviado com o formulário quando o switch está selecionado.\n * **Nota:** Esta propriedade não deve ser utilizada para determinar se o switch está selecionado; para verificar o estado de seleção, use a propriedade `checked`.\n */\n @Prop({ reflect: true }) value: string\n\n /** O ajuste da densidade consiste em aumentar ou reduzir a área de interação do switch. Quanto menor for a densidade, maior a área de interação. */\n @Prop({ reflect: true }) density: 'large' | 'medium' | 'small' = 'medium'\n\n // Propriedade interna para verificar a presença de conteúdo no slot default\n @State() _slotDefault: boolean = false\n\n @State() _checkedValue: boolean\n\n componentWillLoad() {\n this._hasSlotContentDefault()\n this._checkedValue = this.checked\n this.inheritedAttributes = inheritAriaAttributes(this.el)\n }\n\n /**\n * Disparado depois que o valor do `checked` foi alterado\n */\n @Event() brDidCheckedChange: EventEmitter<boolean>\n private _hasSlotContentDefault(): any {\n this._slotDefault = this.el.innerHTML !== ''\n }\n\n private readonly handleCheckedChange = (event: Event) => {\n this._checkedValue = (event.target as HTMLInputElement).checked\n this.brDidCheckedChange.emit(this._checkedValue)\n }\n\n /**\n * Inverte o valor da prop `checked`\n */\n @Method()\n async toggleChecked() {\n this._checkedValue = !this._checkedValue\n this.brDidCheckedChange.emit(this._checkedValue)\n }\n\n private getCssClassMap(): CssClassMap {\n return {\n 'br-switch': true,\n icon: this.hasIcon,\n top: this.labelPosition === 'top',\n right: this.labelPosition === 'right',\n large: this.density === 'large',\n small: this.density === 'small',\n }\n }\n\n private inheritedAttributes: Attributes = {}\n\n render() {\n return (\n <Host>\n <div class={this.getCssClassMap()} {...this.inheritedAttributes}>\n <input\n id={this.customId}\n type=\"checkbox\"\n name={this.name}\n checked={this._checkedValue}\n disabled={this.disabled}\n role=\"switch\"\n aria-checked={this._checkedValue.toString()}\n aria-disabled={this.disabled ? 'true' : null}\n onChange={this.handleCheckedChange}\n />\n <label htmlFor={this.customId}>{this._slotDefault ? <slot></slot> : this.label}</label>\n {this.labelOn && this.labelOff && (\n <div class=\"switch-data\" data-enabled={this.labelOn} data-disabled={this.labelOff}></div>\n )}\n </div>\n </Host>\n )\n }\n}\n"],"mappings":";;;;wIAAA,MAAMA,EAAY,ykdAClB,MAAAC,EAAeD,E,MCeFE,EAAMC,EAAA,MAAAD,UAAAE,E,sKAuFAC,KAAAC,oBAAuBC,IACtCF,KAAKG,cAAiBD,EAAME,OAA4BC,QACxDL,KAAKM,mBAAmBC,KAAKP,KAAKG,cAAc,EAuB1CH,KAAAQ,oBAAkC,G,cApGG,M,aAMD,M,cAMiB,YAAYC,M,wCAWN,O,4DAevB,M,sDAgBqB,S,kBAGhC,M,6BAIjC,iBAAAC,GACEV,KAAKW,yBACLX,KAAKG,cAAgBH,KAAKK,QAC1BL,KAAKQ,oBAAsBI,EAAsBZ,KAAKa,G,CAOhD,sBAAAF,GACNX,KAAKc,aAAed,KAAKa,GAAGE,YAAc,E,CAY5C,mBAAMC,GACJhB,KAAKG,eAAiBH,KAAKG,cAC3BH,KAAKM,mBAAmBC,KAAKP,KAAKG,c,CAG5B,cAAAc,GACN,MAAO,CACL,YAAa,KACbC,KAAMlB,KAAKmB,QACXC,IAAKpB,KAAKqB,gBAAkB,MAC5BC,MAAOtB,KAAKqB,gBAAkB,QAC9BE,MAAOvB,KAAKwB,UAAY,QACxBC,MAAOzB,KAAKwB,UAAY,Q,CAM5B,MAAAE,GACE,OACEC,EAACC,EAAI,CAAAC,IAAA,4CACHF,EAAA,MAAAG,OAAAC,OAAA,CAAAF,IAAA,2CAAKG,MAAOhC,KAAKiB,kBAAsBjB,KAAKQ,qBAC1CmB,EAAA,SAAAE,IAAA,2CACEI,GAAIjC,KAAKkC,SACTC,KAAK,WACLC,KAAMpC,KAAKoC,KACX/B,QAASL,KAAKG,cACdkC,SAAUrC,KAAKqC,SACfC,KAAK,SAAQ,eACCtC,KAAKG,cAAcoC,WAAU,gBAC5BvC,KAAKqC,SAAW,OAAS,KACxCG,SAAUxC,KAAKC,sBAEjB0B,EAAA,SAAAE,IAAA,2CAAOY,QAASzC,KAAKkC,UAAWlC,KAAKc,aAAea,EAAA,aAAgB3B,KAAK0C,OACxE1C,KAAK2C,SAAW3C,KAAK4C,UACpBjB,EAAA,OAAAE,IAAA,2CAAKG,MAAM,cAAa,eAAehC,KAAK2C,QAAO,gBAAiB3C,KAAK4C,Y","ignoreList":[]}
|