@beeq/core 1.12.4-beta.1 → 1.12.4
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/beeq/beeq.esm.js +1 -1
- package/dist/beeq/beeq.esm.js.map +1 -1
- package/dist/beeq/index.esm.js +1 -1
- package/dist/beeq/{p-050c757b.entry.js → p-0a3c5b97.entry.js} +2 -2
- package/dist/beeq/{p-050c757b.entry.js.map → p-0a3c5b97.entry.js.map} +1 -1
- package/dist/beeq/{p-a83ce5aa.entry.js → p-0cfa8d0b.entry.js} +2 -2
- package/dist/beeq/{p-a83ce5aa.entry.js.map → p-0cfa8d0b.entry.js.map} +1 -1
- package/dist/beeq/{p-a71efa95.entry.js → p-1764899f.entry.js} +2 -2
- package/dist/beeq/p-1764899f.entry.js.map +1 -0
- package/dist/beeq/{p-f47905ae.entry.js → p-21db2c4e.entry.js} +2 -2
- package/dist/beeq/{p-e9535627.entry.js → p-25772ebd.entry.js} +2 -2
- package/dist/beeq/{p-6cd90918.entry.js → p-2a7c5b1e.entry.js} +2 -2
- package/dist/beeq/{p-6cd90918.entry.js.map → p-2a7c5b1e.entry.js.map} +1 -1
- package/dist/beeq/{p-41910dc5.entry.js → p-327cb74b.entry.js} +2 -2
- package/dist/beeq/{p-41910dc5.entry.js.map → p-327cb74b.entry.js.map} +1 -1
- package/dist/beeq/{p-7adb6e2e.entry.js → p-365f0372.entry.js} +2 -2
- package/dist/beeq/p-365f0372.entry.js.map +1 -0
- package/dist/beeq/{p-04e3950c.entry.js → p-49a999b4.entry.js} +2 -2
- package/dist/beeq/{p-04e3950c.entry.js.map → p-49a999b4.entry.js.map} +1 -1
- package/dist/beeq/{p-7a6a89f1.entry.js → p-53ea5999.entry.js} +2 -2
- package/dist/beeq/p-53ea5999.entry.js.map +1 -0
- package/dist/beeq/{p-1fb43de2.entry.js → p-5645238d.entry.js} +2 -2
- package/dist/beeq/p-56810dba.entry.js +6 -0
- package/dist/beeq/{p-a77b58aa.entry.js.map → p-56810dba.entry.js.map} +1 -1
- package/dist/beeq/{p-0d8618d2.entry.js → p-644013aa.entry.js} +2 -2
- package/dist/beeq/{p-0d8618d2.entry.js.map → p-644013aa.entry.js.map} +1 -1
- package/dist/beeq/{p-348d42aa.entry.js → p-69cf0536.entry.js} +2 -2
- package/dist/beeq/{p-348d42aa.entry.js.map → p-69cf0536.entry.js.map} +1 -1
- package/dist/beeq/{p-8dfd0329.entry.js → p-6b0f896f.entry.js} +2 -2
- package/dist/beeq/{p-30a79437.entry.js → p-7972ba08.entry.js} +2 -2
- package/dist/beeq/{p-30a79437.entry.js.map → p-7972ba08.entry.js.map} +1 -1
- package/dist/beeq/{p-1e675bdc.entry.js → p-79aab4dd.entry.js} +2 -2
- package/dist/beeq/{p-1e675bdc.entry.js.map → p-79aab4dd.entry.js.map} +1 -1
- package/dist/beeq/{p-e198464e.entry.js → p-79fd999a.entry.js} +2 -2
- package/dist/beeq/{p-e198464e.entry.js.map → p-79fd999a.entry.js.map} +1 -1
- package/dist/beeq/p-84e96891.entry.js +6 -0
- package/dist/beeq/{p-45b7464b.entry.js.map → p-84e96891.entry.js.map} +1 -1
- package/dist/beeq/{p-5855a8d0.entry.js → p-8974f66f.entry.js} +2 -2
- package/dist/beeq/{p-5855a8d0.entry.js.map → p-8974f66f.entry.js.map} +1 -1
- package/dist/beeq/{p-e63d6c4f.entry.js → p-8d9bef7a.entry.js} +2 -2
- package/dist/beeq/{p-e63d6c4f.entry.js.map → p-8d9bef7a.entry.js.map} +1 -1
- package/dist/beeq/{p-CO2T68hs.js → p-BSSRzVAz.js} +2 -2
- package/dist/beeq/p-BSSRzVAz.js.map +1 -0
- package/dist/beeq/p-DbxZ8FhA.js +6 -0
- package/dist/beeq/p-DbxZ8FhA.js.map +1 -0
- package/dist/beeq/p-DdvbF5yL.js.map +1 -1
- package/dist/beeq/{p-40163197.entry.js → p-b26ee039.entry.js} +2 -2
- package/dist/beeq/{p-e366fc1b.entry.js → p-b31d249b.entry.js} +2 -2
- package/dist/beeq/{p-9d1503bd.entry.js → p-b4b02b99.entry.js} +2 -2
- package/dist/beeq/{p-9d1503bd.entry.js.map → p-b4b02b99.entry.js.map} +1 -1
- package/dist/beeq/{p-3c77308c.entry.js → p-b6f5430a.entry.js} +2 -2
- package/dist/beeq/{p-c25c20bf.entry.js → p-b7c6fdbd.entry.js} +2 -2
- package/dist/beeq/p-b7c6fdbd.entry.js.map +1 -0
- package/dist/beeq/p-b8bac7c7.entry.js +6 -0
- package/dist/beeq/p-b8bac7c7.entry.js.map +1 -0
- package/dist/beeq/{p-40bb4e2c.entry.js → p-bb99b400.entry.js} +2 -2
- package/dist/beeq/{p-40bb4e2c.entry.js.map → p-bb99b400.entry.js.map} +1 -1
- package/dist/beeq/{p-cfe07fad.entry.js → p-cf2e4d57.entry.js} +2 -2
- package/dist/beeq/{p-cfe07fad.entry.js.map → p-cf2e4d57.entry.js.map} +1 -1
- package/dist/beeq/p-d4df64ae.entry.js +6 -0
- package/dist/beeq/{p-2283258e.entry.js.map → p-d4df64ae.entry.js.map} +1 -1
- package/dist/beeq/{p-a0ef4135.entry.js → p-d7c20c6f.entry.js} +2 -2
- package/dist/beeq/{p-a0ef4135.entry.js.map → p-d7c20c6f.entry.js.map} +1 -1
- package/dist/beeq/{p-bae91da4.entry.js → p-e91ee0da.entry.js} +2 -2
- package/dist/beeq/{p-bae91da4.entry.js.map → p-e91ee0da.entry.js.map} +1 -1
- package/dist/beeq/{p-d155bf0e.entry.js → p-ef783b95.entry.js} +2 -2
- package/dist/beeq/{p-d155bf0e.entry.js.map → p-ef783b95.entry.js.map} +1 -1
- package/dist/beeq/{p-42e388d0.entry.js → p-f07f4d99.entry.js} +2 -2
- package/dist/beeq/{p-42e388d0.entry.js.map → p-f07f4d99.entry.js.map} +1 -1
- package/dist/beeq/{p-54bfb042.entry.js → p-f0a2c87e.entry.js} +2 -2
- package/dist/beeq/{p-54bfb042.entry.js.map → p-f0a2c87e.entry.js.map} +1 -1
- package/dist/beeq/{p-580f0a77.entry.js → p-f3184477.entry.js} +2 -2
- package/dist/beeq/{p-580f0a77.entry.js.map → p-f3184477.entry.js.map} +1 -1
- package/dist/beeq/{p-000d575f.entry.js → p-f4c66e83.entry.js} +2 -2
- package/dist/beeq/{p-ad419446.entry.js → p-fb763ec5.entry.js} +2 -2
- package/dist/beeq/{p-290a95ef.entry.js → p-fe22de00.entry.js} +2 -2
- package/dist/beeq/{p-290a95ef.entry.js.map → p-fe22de00.entry.js.map} +1 -1
- package/dist/beeq/p-kY6d9Evy.js +6 -0
- package/dist/beeq/p-kY6d9Evy.js.map +1 -0
- package/dist/beeq.html-custom-data.json +206 -201
- package/dist/cjs/beeq.cjs.js +3 -3
- package/dist/cjs/beeq.cjs.js.map +1 -1
- package/dist/cjs/bq-accordion-group.cjs.entry.js +2 -2
- package/dist/cjs/bq-accordion-group.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-accordion.cjs.entry.js +2 -2
- package/dist/cjs/bq-alert.cjs.entry.js +3 -3
- package/dist/cjs/bq-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-avatar.cjs.entry.js +3 -3
- package/dist/cjs/bq-avatar.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-badge.cjs.entry.js +3 -3
- package/dist/cjs/bq-breadcrumb-item.cjs.entry.js +3 -3
- package/dist/cjs/bq-breadcrumb-item.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-breadcrumb.cjs.entry.js +2 -2
- package/dist/cjs/bq-breadcrumb.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-button_2.cjs.entry.js +5 -5
- package/dist/cjs/bq-button_2.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-card.cjs.entry.js +3 -3
- package/dist/cjs/bq-card.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-checkbox.cjs.entry.js +35 -22
- package/dist/cjs/bq-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-date-picker.cjs.entry.js +3 -3
- package/dist/cjs/bq-date-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-dialog.cjs.entry.js +3 -3
- package/dist/cjs/bq-dialog.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-divider.cjs.entry.js +3 -3
- package/dist/cjs/bq-drawer.cjs.entry.js +3 -3
- package/dist/cjs/bq-drawer.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-dropdown_2.cjs.entry.js +3 -3
- package/dist/cjs/bq-dropdown_2.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-empty-state.cjs.entry.js +3 -3
- package/dist/cjs/bq-empty-state.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-input.cjs.entry.js +17 -10
- package/dist/cjs/bq-input.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-notification.cjs.entry.js +7 -7
- package/dist/cjs/bq-notification.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-option-group.cjs.entry.js +2 -2
- package/dist/cjs/bq-option-group.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-option-list_2.cjs.entry.js +5 -5
- package/dist/cjs/bq-option-list_2.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-option.cjs.entry.js +2 -2
- package/dist/cjs/bq-option.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-page-title.cjs.entry.js +2 -2
- package/dist/cjs/bq-page-title.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-progress.cjs.entry.js +3 -3
- package/dist/cjs/bq-progress.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-radio-group.cjs.entry.js +8 -12
- package/dist/cjs/bq-radio-group.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-radio.cjs.entry.js +1 -1
- package/dist/cjs/bq-select.cjs.entry.js +39 -10
- package/dist/cjs/bq-select.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-side-menu-item.cjs.entry.js +2 -2
- package/dist/cjs/bq-side-menu-item.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-side-menu.cjs.entry.js +1 -1
- package/dist/cjs/bq-slider.cjs.entry.js +1 -1
- package/dist/cjs/bq-spinner.cjs.entry.js +4 -4
- package/dist/cjs/bq-spinner.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-status.cjs.entry.js +3 -3
- package/dist/cjs/bq-status.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-step-item.cjs.entry.js +3 -3
- package/dist/cjs/bq-step-item.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-steps.cjs.entry.js +2 -2
- package/dist/cjs/bq-switch.cjs.entry.js +1 -1
- package/dist/cjs/bq-tab-group.cjs.entry.js +2 -2
- package/dist/cjs/bq-tab.cjs.entry.js +3 -3
- package/dist/cjs/bq-tab.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-textarea.cjs.entry.js +17 -15
- package/dist/cjs/bq-textarea.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-toast.cjs.entry.js +5 -7
- package/dist/cjs/bq-toast.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-tooltip.cjs.entry.js +2 -2
- package/dist/cjs/bq-tooltip.cjs.entry.js.map +1 -1
- package/dist/cjs/{cssVariables-exM7Oz37.js → cssVariables-DuVz7KcV.js} +3 -3
- package/dist/cjs/cssVariables-DuVz7KcV.js.map +1 -0
- package/dist/cjs/{index-BSrsKFVG.js → index-J9jJ-fFQ.js} +47 -12
- package/dist/cjs/index-J9jJ-fFQ.js.map +1 -0
- package/dist/cjs/index.cjs.js +2 -2
- package/dist/cjs/loader.cjs.js +2 -2
- package/dist/cjs/{props-DzFXZXSF.js → props-BXpv3G-e.js} +6 -5
- package/dist/cjs/props-BXpv3G-e.js.map +1 -0
- package/dist/cjs/transition-C0S-pYqN.js.map +1 -1
- package/dist/collection/collection-manifest.json +1 -1
- package/dist/collection/components/breadcrumb-item/bq-breadcrumb-item.js +1 -1
- package/dist/collection/components/breadcrumb-item/bq-breadcrumb-item.js.map +1 -1
- package/dist/collection/components/button/scss/bq-button.css +1 -1
- package/dist/collection/components/checkbox/bq-checkbox.js +33 -20
- package/dist/collection/components/checkbox/bq-checkbox.js.map +1 -1
- package/dist/collection/components/checkbox/scss/bq-checkbox.css +1 -1
- package/dist/collection/components/icon/helper/request.js +1 -1
- package/dist/collection/components/icon/helper/request.js.map +1 -1
- package/dist/collection/components/input/bq-input.js +15 -8
- package/dist/collection/components/input/bq-input.js.map +1 -1
- package/dist/collection/components/notification/bq-notification.js +4 -4
- package/dist/collection/components/notification/bq-notification.js.map +1 -1
- package/dist/collection/components/radio-group/bq-radio-group.js +6 -10
- package/dist/collection/components/radio-group/bq-radio-group.js.map +1 -1
- package/dist/collection/components/select/bq-select.js +59 -10
- package/dist/collection/components/select/bq-select.js.map +1 -1
- package/dist/collection/components/step-item/scss/bq-step-item.css +1 -1
- package/dist/collection/components/tag/scss/bq-tag.css +1 -1
- package/dist/collection/components/textarea/bq-textarea.js +15 -13
- package/dist/collection/components/textarea/bq-textarea.js.map +1 -1
- package/dist/collection/components/toast/bq-toast.js +2 -4
- package/dist/collection/components/toast/bq-toast.js.map +1 -1
- package/dist/collection/shared/test-utils/computedStyle.js +24 -24
- package/dist/collection/shared/test-utils/computedStyle.js.map +1 -1
- package/dist/collection/shared/test-utils/sleep.js +5 -1
- package/dist/collection/shared/test-utils/sleep.js.map +1 -1
- package/dist/collection/shared/utils/cssVariables.js +1 -1
- package/dist/collection/shared/utils/cssVariables.js.map +1 -1
- package/dist/collection/shared/utils/props.js +4 -3
- package/dist/collection/shared/utils/props.js.map +1 -1
- package/dist/collection/shared/utils/transition.js.map +1 -1
- package/dist/components/bq-accordion-group.js +1 -1
- package/dist/components/bq-accordion-group.js.map +1 -1
- package/dist/components/bq-accordion.js +1 -1
- package/dist/components/bq-alert.js +1 -1
- package/dist/components/bq-alert.js.map +1 -1
- package/dist/components/bq-avatar.js +1 -1
- package/dist/components/bq-avatar.js.map +1 -1
- package/dist/components/bq-badge.js +1 -1
- package/dist/components/bq-breadcrumb-item.js +1 -1
- package/dist/components/bq-breadcrumb-item.js.map +1 -1
- package/dist/components/bq-breadcrumb.js +1 -1
- package/dist/components/bq-breadcrumb.js.map +1 -1
- package/dist/components/bq-button.js +1 -1
- package/dist/components/bq-card.js +1 -1
- package/dist/components/bq-card.js.map +1 -1
- package/dist/components/bq-checkbox.js +1 -1
- package/dist/components/bq-checkbox.js.map +1 -1
- package/dist/components/bq-date-picker.js +1 -1
- package/dist/components/bq-date-picker.js.map +1 -1
- package/dist/components/bq-dialog.js +1 -1
- package/dist/components/bq-dialog.js.map +1 -1
- package/dist/components/bq-divider.js +1 -1
- package/dist/components/bq-drawer.js +1 -1
- package/dist/components/bq-drawer.js.map +1 -1
- package/dist/components/bq-dropdown.js +1 -1
- package/dist/components/bq-empty-state.js +1 -1
- package/dist/components/bq-empty-state.js.map +1 -1
- package/dist/components/bq-icon.js +1 -1
- package/dist/components/bq-input.js +1 -1
- package/dist/components/bq-input.js.map +1 -1
- package/dist/components/bq-notification.js +1 -1
- package/dist/components/bq-notification.js.map +1 -1
- package/dist/components/bq-option-group.js +1 -1
- package/dist/components/bq-option-group.js.map +1 -1
- package/dist/components/bq-option-list.js +1 -1
- package/dist/components/bq-option.js +1 -1
- package/dist/components/bq-option.js.map +1 -1
- package/dist/components/bq-page-title.js +1 -1
- package/dist/components/bq-page-title.js.map +1 -1
- package/dist/components/bq-panel.js +1 -1
- package/dist/components/bq-progress.js +1 -1
- package/dist/components/bq-progress.js.map +1 -1
- package/dist/components/bq-radio-group.js +1 -1
- package/dist/components/bq-radio-group.js.map +1 -1
- package/dist/components/bq-radio.js +1 -1
- package/dist/components/bq-select.js +1 -1
- package/dist/components/bq-select.js.map +1 -1
- package/dist/components/bq-side-menu-item.js +1 -1
- package/dist/components/bq-side-menu-item.js.map +1 -1
- package/dist/components/bq-side-menu.js +1 -1
- package/dist/components/bq-slider.js +1 -1
- package/dist/components/bq-spinner.js +1 -1
- package/dist/components/bq-spinner.js.map +1 -1
- package/dist/components/bq-status.js +1 -1
- package/dist/components/bq-status.js.map +1 -1
- package/dist/components/bq-step-item.js +1 -1
- package/dist/components/bq-step-item.js.map +1 -1
- package/dist/components/bq-steps.js +1 -1
- package/dist/components/bq-switch.js +1 -1
- package/dist/components/bq-tab-group.js +1 -1
- package/dist/components/bq-tab.js +1 -1
- package/dist/components/bq-tab.js.map +1 -1
- package/dist/components/bq-tag.js +1 -1
- package/dist/components/bq-textarea.js +1 -1
- package/dist/components/bq-textarea.js.map +1 -1
- package/dist/components/bq-toast.js +1 -1
- package/dist/components/bq-toast.js.map +1 -1
- package/dist/components/bq-tooltip.js +1 -1
- package/dist/components/index.js +1 -1
- package/dist/{beeq/p-45b7464b.entry.js → components/p-2bpX-u8x.js} +2 -2
- package/dist/components/p-2bpX-u8x.js.map +1 -0
- package/dist/components/{p-YjPwN7vu.js → p-2eUC8A3N.js} +2 -2
- package/dist/components/p-2eUC8A3N.js.map +1 -0
- package/dist/components/{p-BY4GkNoQ.js → p-BMHXMsVR.js} +2 -2
- package/dist/components/{p-Dj-mQvqv.js → p-BOuMP_Rm.js} +2 -2
- package/dist/components/{p-Dj-mQvqv.js.map → p-BOuMP_Rm.js.map} +1 -1
- package/dist/components/{p-D3RCJ1ti.js → p-CK3SnGa2.js} +2 -2
- package/dist/components/{p-D4ZErYyQ.js → p-CNITfoR_.js} +2 -2
- package/dist/components/p-CNITfoR_.js.map +1 -0
- package/dist/components/p-CfP6le1E.js +6 -0
- package/dist/components/{p-Ci3ldciT.js.map → p-CfP6le1E.js.map} +1 -1
- package/dist/components/p-DbxZ8FhA.js +6 -0
- package/dist/components/p-DbxZ8FhA.js.map +1 -0
- package/dist/components/p-DdvbF5yL.js.map +1 -1
- package/dist/components/{p-4ksDMBf6.js → p-MSqM1CAF.js} +2 -2
- package/dist/components/{p-4ksDMBf6.js.map → p-MSqM1CAF.js.map} +1 -1
- package/dist/components/{p-B99eLANt.js → p-jrBUnEFW.js} +2 -2
- package/dist/components/{p-B99eLANt.js.map → p-jrBUnEFW.js.map} +1 -1
- package/dist/components/p-kY6d9Evy.js +6 -0
- package/dist/components/p-kY6d9Evy.js.map +1 -0
- package/dist/components/{p-D3JbL1Mm.js → p-wi7vUIoV.js} +2 -2
- package/dist/components/{p-D3JbL1Mm.js.map → p-wi7vUIoV.js.map} +1 -1
- package/dist/custom-elements.json +3520 -3221
- package/dist/esm/beeq.js +4 -4
- package/dist/esm/beeq.js.map +1 -1
- package/dist/esm/bq-accordion-group.entry.js +2 -2
- package/dist/esm/bq-accordion-group.entry.js.map +1 -1
- package/dist/esm/bq-accordion.entry.js +2 -2
- package/dist/esm/bq-alert.entry.js +3 -3
- package/dist/esm/bq-alert.entry.js.map +1 -1
- package/dist/esm/bq-avatar.entry.js +3 -3
- package/dist/esm/bq-avatar.entry.js.map +1 -1
- package/dist/esm/bq-badge.entry.js +3 -3
- package/dist/esm/bq-breadcrumb-item.entry.js +3 -3
- package/dist/esm/bq-breadcrumb-item.entry.js.map +1 -1
- package/dist/esm/bq-breadcrumb.entry.js +2 -2
- package/dist/esm/bq-breadcrumb.entry.js.map +1 -1
- package/dist/esm/bq-button_2.entry.js +5 -5
- package/dist/esm/bq-button_2.entry.js.map +1 -1
- package/dist/esm/bq-card.entry.js +3 -3
- package/dist/esm/bq-card.entry.js.map +1 -1
- package/dist/esm/bq-checkbox.entry.js +35 -22
- package/dist/esm/bq-checkbox.entry.js.map +1 -1
- package/dist/esm/bq-date-picker.entry.js +3 -3
- package/dist/esm/bq-date-picker.entry.js.map +1 -1
- package/dist/esm/bq-dialog.entry.js +3 -3
- package/dist/esm/bq-dialog.entry.js.map +1 -1
- package/dist/esm/bq-divider.entry.js +3 -3
- package/dist/esm/bq-drawer.entry.js +3 -3
- package/dist/esm/bq-drawer.entry.js.map +1 -1
- package/dist/esm/bq-dropdown_2.entry.js +3 -3
- package/dist/esm/bq-dropdown_2.entry.js.map +1 -1
- package/dist/esm/bq-empty-state.entry.js +3 -3
- package/dist/esm/bq-empty-state.entry.js.map +1 -1
- package/dist/esm/bq-input.entry.js +17 -10
- package/dist/esm/bq-input.entry.js.map +1 -1
- package/dist/esm/bq-notification.entry.js +7 -7
- package/dist/esm/bq-notification.entry.js.map +1 -1
- package/dist/esm/bq-option-group.entry.js +2 -2
- package/dist/esm/bq-option-group.entry.js.map +1 -1
- package/dist/esm/bq-option-list_2.entry.js +5 -5
- package/dist/esm/bq-option-list_2.entry.js.map +1 -1
- package/dist/esm/bq-option.entry.js +2 -2
- package/dist/esm/bq-option.entry.js.map +1 -1
- package/dist/esm/bq-page-title.entry.js +2 -2
- package/dist/esm/bq-page-title.entry.js.map +1 -1
- package/dist/esm/bq-progress.entry.js +3 -3
- package/dist/esm/bq-progress.entry.js.map +1 -1
- package/dist/esm/bq-radio-group.entry.js +8 -12
- package/dist/esm/bq-radio-group.entry.js.map +1 -1
- package/dist/esm/bq-radio.entry.js +1 -1
- package/dist/esm/bq-select.entry.js +39 -10
- package/dist/esm/bq-select.entry.js.map +1 -1
- package/dist/esm/bq-side-menu-item.entry.js +2 -2
- package/dist/esm/bq-side-menu-item.entry.js.map +1 -1
- package/dist/esm/bq-side-menu.entry.js +1 -1
- package/dist/esm/bq-slider.entry.js +1 -1
- package/dist/esm/bq-spinner.entry.js +4 -4
- package/dist/esm/bq-spinner.entry.js.map +1 -1
- package/dist/esm/bq-status.entry.js +3 -3
- package/dist/esm/bq-status.entry.js.map +1 -1
- package/dist/esm/bq-step-item.entry.js +3 -3
- package/dist/esm/bq-step-item.entry.js.map +1 -1
- package/dist/esm/bq-steps.entry.js +2 -2
- package/dist/esm/bq-switch.entry.js +1 -1
- package/dist/esm/bq-tab-group.entry.js +2 -2
- package/dist/esm/bq-tab.entry.js +3 -3
- package/dist/esm/bq-tab.entry.js.map +1 -1
- package/dist/esm/bq-textarea.entry.js +17 -15
- package/dist/esm/bq-textarea.entry.js.map +1 -1
- package/dist/esm/bq-toast.entry.js +5 -7
- package/dist/esm/bq-toast.entry.js.map +1 -1
- package/dist/esm/bq-tooltip.entry.js +2 -2
- package/dist/esm/bq-tooltip.entry.js.map +1 -1
- package/dist/esm/{cssVariables-CyiWA5Ok.js → cssVariables-DhGXeOL_.js} +3 -3
- package/dist/esm/cssVariables-DhGXeOL_.js.map +1 -0
- package/dist/esm/{index-CO2T68hs.js → index-BSSRzVAz.js} +47 -12
- package/dist/esm/index-BSSRzVAz.js.map +1 -0
- package/dist/esm/index.js +2 -2
- package/dist/esm/loader.js +3 -3
- package/dist/esm/{props-zh4P02Kn.js → props-DbxZ8FhA.js} +6 -5
- package/dist/esm/props-DbxZ8FhA.js.map +1 -0
- package/dist/esm/transition-DdvbF5yL.js.map +1 -1
- package/dist/hydrate/index.js +181 -84
- package/dist/hydrate/index.mjs +181 -84
- package/dist/stencil.config.js +1 -0
- package/dist/stencil.config.js.map +1 -1
- package/dist/types/components/checkbox/bq-checkbox.d.ts +2 -2
- package/dist/types/components/input/bq-input.d.ts +1 -0
- package/dist/types/components/select/bq-select.d.ts +5 -0
- package/dist/types/components.d.ts +13 -0
- package/dist/types/home/runner/work/BEEQ/BEEQ/.stencil/packages/beeq/vitest.config.d.ts +2 -0
- package/dist/types/shared/test-utils/computedStyle.d.ts +7 -6
- package/dist/types/shared/test-utils/setProperties.d.ts +1 -1
- package/dist/types/shared/test-utils/sleep.d.ts +5 -1
- package/dist/types/stencil-public-runtime.d.ts +1 -0
- package/dist/vitest.config.js +81 -0
- package/dist/vitest.config.js.map +1 -0
- package/package.json +1 -1
- package/dist/beeq/p-2283258e.entry.js +0 -6
- package/dist/beeq/p-30ba61a1.entry.js +0 -6
- package/dist/beeq/p-30ba61a1.entry.js.map +0 -1
- package/dist/beeq/p-7a6a89f1.entry.js.map +0 -1
- package/dist/beeq/p-7adb6e2e.entry.js.map +0 -1
- package/dist/beeq/p-CO2T68hs.js.map +0 -1
- package/dist/beeq/p-_RvVpeh2.js +0 -6
- package/dist/beeq/p-_RvVpeh2.js.map +0 -1
- package/dist/beeq/p-a71efa95.entry.js.map +0 -1
- package/dist/beeq/p-a77b58aa.entry.js +0 -6
- package/dist/beeq/p-c25c20bf.entry.js.map +0 -1
- package/dist/beeq/p-zh4P02Kn.js +0 -6
- package/dist/beeq/p-zh4P02Kn.js.map +0 -1
- package/dist/cjs/cssVariables-exM7Oz37.js.map +0 -1
- package/dist/cjs/index-BSrsKFVG.js.map +0 -1
- package/dist/cjs/props-DzFXZXSF.js.map +0 -1
- package/dist/components/p-Ci3ldciT.js +0 -6
- package/dist/components/p-D4ZErYyQ.js.map +0 -1
- package/dist/components/p-DnqmdkvK.js +0 -6
- package/dist/components/p-DnqmdkvK.js.map +0 -1
- package/dist/components/p-YjPwN7vu.js.map +0 -1
- package/dist/components/p-_RvVpeh2.js +0 -6
- package/dist/components/p-_RvVpeh2.js.map +0 -1
- package/dist/components/p-zh4P02Kn.js +0 -6
- package/dist/components/p-zh4P02Kn.js.map +0 -1
- package/dist/esm/cssVariables-CyiWA5Ok.js.map +0 -1
- package/dist/esm/index-CO2T68hs.js.map +0 -1
- package/dist/esm/props-zh4P02Kn.js.map +0 -1
- package/dist/jest.config.js +0 -23
- package/dist/jest.config.js.map +0 -1
- package/dist/types/Users/dramos/PROJECTs/ENDAVA/BEEQ-Design-System/.stencil/packages/beeq/jest.config.d.ts +0 -19
- /package/dist/beeq/{p-f47905ae.entry.js.map → p-21db2c4e.entry.js.map} +0 -0
- /package/dist/beeq/{p-e9535627.entry.js.map → p-25772ebd.entry.js.map} +0 -0
- /package/dist/beeq/{p-1fb43de2.entry.js.map → p-5645238d.entry.js.map} +0 -0
- /package/dist/beeq/{p-8dfd0329.entry.js.map → p-6b0f896f.entry.js.map} +0 -0
- /package/dist/beeq/{p-40163197.entry.js.map → p-b26ee039.entry.js.map} +0 -0
- /package/dist/beeq/{p-e366fc1b.entry.js.map → p-b31d249b.entry.js.map} +0 -0
- /package/dist/beeq/{p-3c77308c.entry.js.map → p-b6f5430a.entry.js.map} +0 -0
- /package/dist/beeq/{p-000d575f.entry.js.map → p-f4c66e83.entry.js.map} +0 -0
- /package/dist/beeq/{p-ad419446.entry.js.map → p-fb763ec5.entry.js.map} +0 -0
- /package/dist/components/{p-BY4GkNoQ.js.map → p-BMHXMsVR.js.map} +0 -0
- /package/dist/components/{p-D3RCJ1ti.js.map → p-CK3SnGa2.js.map} +0 -0
- /package/dist/types/{Users/dramos/PROJECTs/ENDAVA/BEEQ-Design-System → home/runner/work/BEEQ/BEEQ}/.stencil/packages/beeq/stencil.config.d.ts +0 -0
- /package/dist/types/{Users/dramos/PROJECTs/ENDAVA/BEEQ-Design-System → home/runner/work/BEEQ/BEEQ}/.stencil/tailwind.config.d.ts +0 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["bqTextareaCss","BqTextarea","debounceBqInput","fallbackId","helperTextElem","labelElem","textarea","internals","hasHelperText","hasLabel","autocapitalize","autocomplete","autofocus","autoGrow","debounceTime","disabled","disableResize","form","formValidationMessage","maxlength","name","placeholder","readonly","required","rows","spellcheck","validationStatus","value","wrap","handleValueChange","this","length","substring","handleRequiredPropChange","updateFormValidity","bqBlur","bqChange","bqClear","bqFocus","bqInput","componentDidLoad","handleSlotChange","formAssociatedCallback","setFormValue","formResetCallback","clearSelection","numberOfCharacters","handleBlur","emit","el","handleFocus","handleChange","ev","isHTMLElement","target","handleInput","cancel","debounce","autoResize","inputElem","style","height","scrollHeight","hasSlotContent","isNil","undefined","states","clear","trim","add","setValidity","valueMissing","render","h","key","class","part","htmlFor","ref","label","onSlotchange","id","maxLength","onBlur","onChange","onFocus","onInput","readOnly","elem","span"],"sources":["../../packages/beeq/src/components/textarea/scss/bq-textarea.scss?tag=bq-textarea&encapsulation=shadow","../../packages/beeq/src/components/textarea/bq-textarea.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/* Textarea styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-textarea.variables';\n\n:host {\n @apply block is-full;\n}\n\n/* -------------------------------------------------------------------------- */\n/* Label */\n/* -------------------------------------------------------------------------- */\n\n.bq-textarea__label {\n @apply text-[length:--bq-textarea--label-text-size] text-[color:--bq-textarea--label-text-color] m-be-[--bq-textarea--label-margin-bottom];\n}\n\n/* -------------------------------------------------------------------------- */\n/* Native HTML Textarea control */\n/* -------------------------------------------------------------------------- */\n\n.bq-textarea__input {\n @apply flex-auto resize-y bg-[--bq-textarea--background-color] bs-[inherit];\n // Border\n @apply rounded-[--bq-textarea--border-radius] border-[length:--bq-textarea--border-width] border-[color:--bq-textarea--border-color];\n // Padding\n @apply pe-[--bq-textarea--padding-end] ps-[--bq-textarea--padding-start] p-b-[--bq-textarea--paddingY];\n // Text\n @apply text-[length:--bq-textarea--text-size] text-[color:--bq-textarea--text-color] placeholder:text-[color:--bq-textarea--text-placeholder-color];\n // Transition\n @apply transition-colors ease-in-out;\n // Hover\n @apply [&:not([disabled]):not(:focus-within)]:hover:border-hover-brand;\n // Disabled\n @apply disabled:cursor-not-allowed disabled:opacity-60;\n // Focus\n &:not([disabled]):focus-within {\n --bq-ring-width: 1px;\n --bq-ring-offset-width: 0;\n --bq-ring-color-focus: var(--bq-textarea--border-color-focus);\n\n @apply focus border-[color:--bq-ring-color-focus];\n }\n}\n\n/* ------------------------------- Validations ------------------------------- */\n\n.bq-textarea__input.validation-error {\n @apply border-danger [&:not(.disabled):not(:focus-within)]:hover:border-hover-danger;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(stroke.danger);\n\n @apply border-active-danger;\n }\n}\n\n.bq-textarea__input.validation-success {\n @apply border-success [&:not(.disabled):not(:focus-within)]:hover:border-hover-success;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(stroke.success);\n\n @apply border-active-success;\n }\n}\n\n.bq-textarea__input.validation-warning {\n @apply border-warning [&:not(.disabled):not(:focus-within)]:hover:border-hover-warning;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(stroke.warning);\n\n @apply border-active-warning;\n }\n}\n\n/* -------------------------------------------------------------------------- */\n/* Helper text */\n/* -------------------------------------------------------------------------- */\n\n.bq-textarea__helper {\n @apply text-[length:--bq-textarea--helper-text-size] text-[color:--bq-textarea--helper-text-color] m-bs-[--bq-textarea--helper-margin-top];\n}\n\n/* ------------------------------- Validations ------------------------------ */\n\n.bq-textarea__helper.validation-error {\n @apply text-danger;\n}\n\n.bq-textarea__helper.validation-success {\n @apply text-success;\n}\n\n.bq-textarea__helper.validation-warning {\n @apply text-warning;\n}\n\n/* ----------------------------- Helper counter ----------------------------- */\n\n/** Apply a disabled text color style to the textarea counter when the validation is none. */\n.bq-textarea__helper[class~='validation-none'] {\n .bq-textarea__helper--counter {\n @apply opacity-60;\n }\n}\n","import type { EventEmitter } from '@stencil/core';\nimport { AttachInternals, Component, Element, Event, h, Prop, State, Watch } from '@stencil/core';\n\nimport { debounce, hasSlotContent, isHTMLElement, isNil, type TDebounce } from '../../shared/utils';\nimport type { TInputValidation } from '../input/bq-input.types';\nimport type { TTextareaAutoCapitalize, TTextareaWrap } from './bq-textarea.types';\n\n/**\n * The Textarea component is a multi-line text input control that is often used in a form to collect user inputs like comments or reviews.\n *\n * @example How to use it\n * ```html\n * <bq-textarea maxlength=\"0\" name=\"textarea\" placeholder=\"Placeholder...\" rows=\"5\">\n * <label slot=\"label\">Label</label>\n * <span class=\"flex items-center gap-xs\" slot=\"helper-text\">\n * <bq-icon name=\"star\"></bq-icon>\n * Helper text\n * </span>\n * </bq-textarea>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/16792c-textarea\n * @status stable\n *\n * @attr {string} autocapitalize - Controls whether or not the textarea field should be capitalized and how.\n * @attr {string} autocomplete - Specifies whether or not the textarea field should have autocomplete enabled.\n * @attr {boolean} autofocus - If `true`, the textarea will be focused on component render.\n * @attr {boolean} auto-grow - If `true`, the textarea will automatically grow and shrink to fit its contents.\n * @attr {number} debounce-time - The amount of time, in milliseconds, to wait before emitting the `bqInput` event after the textarea value changes.\n * @attr {boolean} disabled - If `true`, the user cannot interact with the textarea.\n * @attr {boolean} disable-resize - If `true`, it will block the user's ability to resize the textarea.\n * @attr {string} form - The ID of the form that the textarea field belongs to.\n * @attr {string} form-validation-message - The native form validation message.\n * @attr {number} maxlength - The maximum number of characters that can be entered into the textarea (`0`: no limit).\n * @attr {string} name - The name of the textarea element.\n * @attr {string} placeholder - The placeholder text to show when there is no value.\n * @attr {boolean} readonly - If `true`, the textarea field cannot be modified.\n * @attr {boolean} required - Indicates whether or not the textarea field is required to be filled out before submitting the form.\n * @attr {number} rows - The number of visible text lines for the control. It must be a positive integer.\n * @attr {boolean} spellcheck - If `true`, the textarea content may be checked for spelling errors.\n * @attr {\"error\" | \"none\" | \"success\" | \"warning\"} validation-status - The validation status of the textarea.\n * @attr {string} value - The value of the textarea. It can be used to reset the textarea to a previous value.\n * @attr {\"soft\" | \"hard\"} wrap - Specifies how the text in a text area is to be wrapped when submitted in a form.\n *\n * @event bqBlur - Handler to be called when the textarea loses focus.\n * @event bqChange - Handler to be called when the textarea value has changed and the textarea loses focus.\n * @event bqClear - Handler to be called when the textarea value has been cleared.\n * @event bqFocus - Handler to be called when the textarea has received focus.\n * @event bqInput - Handler to be called when the textarea value changes.\n *\n * @slot label - The textarea label.\n * @slot helper-text - The helper text.\n *\n * @part base - The component's base wrapper.\n * @part input - The textarea element.\n * @part label - The textarea label.\n * @part helper-info - The helper info container.\n * @part helper-text - The helper text.\n * @part helper-counter - The helper counter.\n *\n * @cssprop --bq-textarea--background-color - Textarea background color\n * @cssprop --bq-textarea--border-color - Textarea border color\n * @cssprop --bq-textarea--border-color-focus - Textarea border color on focus\n * @cssprop --bq-textarea--border-radius - Textarea border radius\n * @cssprop --bq-textarea--border-width - Textarea border width\n * @cssprop --bq-textarea--border-style - Textarea border style\n * @cssprop --bq-textarea--helper-margin-top - Textarea helper text margin top\n * @cssprop --bq-textarea--helper-text-color - Textarea helper text color\n * @cssprop --bq-textarea--helper-text-size - Textarea helper text size\n * @cssprop --bq-textarea--label-margin-bottom - Textarea label margin bottom\n * @cssprop --bq-textarea--label-text-color - Textarea label text color\n * @cssprop --bq-textarea--label-text-size - Textarea label text size\n * @cssprop --bq-textarea--paddingY - Textarea padding top and bottom\n * @cssprop --bq-textarea--padding-start - Textarea padding start\n * @cssprop --bq-textarea--padding-end - Textarea padding end\n * @cssprop --bq-textarea--text-color - Textarea text color\n * @cssprop --bq-textarea--text-size - Textarea text size\n * @cssprop --bq-textarea--text-placeholder-color - Textarea placeholder text color\n */\n@Component({\n tag: 'bq-textarea',\n styleUrl: './scss/bq-textarea.scss',\n formAssociated: true,\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class BqTextarea {\n // Own Properties\n // ====================\n\n private debounceBqInput: TDebounce<void>;\n private fallbackId = 'textarea';\n\n private helperTextElem?: HTMLElement;\n private labelElem?: HTMLLabelElement;\n private textarea: HTMLTextAreaElement;\n\n // Reference to host HTML element\n // ===================================\n\n @AttachInternals() internals!: ElementInternals;\n @Element() el!: HTMLBqTextareaElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private hasHelperText = false;\n @State() private hasLabel = false;\n\n // Public Property API\n // ========================\n\n /**\n * Controls whether or not the textarea field should be capitalized and how.\n * Possible values are 'off', 'none', 'on', 'sentences', 'words', and 'characters'.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autocapitalize\n */\n @Prop({ reflect: true }) autocapitalize: TTextareaAutoCapitalize = 'off';\n\n /**\n * Specifies whether or not the textarea field should have autocomplete enabled.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values\n */\n @Prop({ reflect: true }) autocomplete: string = 'off';\n\n /** If true, the textarea will be focused on component render */\n @Prop({ reflect: true }) autofocus: boolean = false;\n\n /**\n * If `true`, the textarea will automatically grow and shrink to fit its contents.\n * If `false`, the textarea will have a fixed height specified by the `rows` property.\n */\n @Prop({ reflect: true }) autoGrow: boolean = false;\n\n /**\n * The amount of time, in milliseconds, to wait before emitting the `bqInput` event after the textarea value changes.\n * A value of 0 means no debouncing will occur.\n */\n @Prop({ reflect: true, mutable: true }) debounceTime? = 0;\n\n /** If `true`, the user cannot interact with the textarea. */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** If `true`, it will block the user's ability to resize the textarea. */\n @Prop({ reflect: true }) disableResize?: boolean = false;\n\n /** The ID of the form that the textarea field belongs to. */\n @Prop({ reflect: true }) form?: string;\n\n /** The native form validation message */\n @Prop({ mutable: true }) formValidationMessage?: string;\n\n /**\n * The maximum number of characters that can be entered into the textarea (`0`: no limit).\n * When enabled, a character counter will be shown underneath the textarea.\n */\n @Prop({ reflect: true }) maxlength: number;\n\n /** The name of the textarea element. */\n @Prop({ reflect: true }) name!: string;\n\n /** The placeholder text to show when there is no value. */\n @Prop({ reflect: true }) placeholder!: string;\n\n /** If true, the textarea field cannot be modified. */\n @Prop({ reflect: true }) readonly?: boolean = false;\n\n /** Indicates whether or not the textarea field is required to be filled out before submitting the form. */\n @Prop({ reflect: true }) required?: boolean = false;\n\n /** The number of visible text lines for the control. It must be a positive integer. */\n @Prop({ reflect: true }) rows: number = 5;\n\n /** If true, the textarea content may be checked for spelling errors. */\n @Prop({ reflect: true }) spellcheck: boolean = false;\n\n /**\n * The validation status of the textarea.\n *\n * @remarks\n * This property is used to indicate the validation status of the textarea. It can be set to one of the following values:\n * - `'none'`: No validation status is set.\n * - `'error'`: The textarea has a validation error.\n * - `'warning'`: The textarea has a validation warning.\n * - `'success'`: The textarea has passed validation.\n */\n @Prop({ reflect: true, mutable: true }) validationStatus: TInputValidation = 'none';\n\n /** The value of the textarea. It can be used to reset the textarea to a previous value. */\n @Prop({ mutable: true }) value: string;\n\n /** Specifies how the text in a text area is to be wrapped when submitted in a form */\n @Prop({ reflect: true }) wrap: TTextareaWrap = 'soft';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('value')\n handleValueChange() {\n if (!this.textarea) return;\n if (!this.maxlength || this.value?.length < this.maxlength) return;\n // If the value is longer than the maxlength, we need to truncate it\n this.value = this.value?.substring(0, this.maxlength);\n this.textarea.value = this.value ?? '';\n }\n\n @Watch('required')\n handleRequiredPropChange() {\n this.updateFormValidity();\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n /** Callback handler emitted when the textarea loses focus */\n @Event() bqBlur!: EventEmitter<HTMLBqTextareaElement>;\n\n /**\n * Callback handler emitted when the textarea value has changed and the textarea loses focus.\n * This handler is called whenever the user finishes typing or pasting text into the textarea field and then clicks outside of the textarea field.\n */\n @Event() bqChange!: EventEmitter<{ value: string; el: HTMLBqTextareaElement }>;\n\n /** Callback handler emitted when the textarea value has been cleared */\n @Event() bqClear!: EventEmitter<HTMLBqTextareaElement>;\n\n /** Callback handler emitted when the textarea has received focus */\n @Event() bqFocus!: EventEmitter<HTMLBqTextareaElement>;\n\n /**\n * Callback handler emitted when the textarea value changes.\n * This handler is called whenever the user types or pastes text into the textarea field.\n */\n @Event() bqInput!: EventEmitter<{ value: string; el: HTMLBqTextareaElement }>;\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n componentDidLoad() {\n this.handleSlotChange();\n this.handleValueChange();\n }\n\n formAssociatedCallback() {\n this.setFormValue(this.value);\n this.updateFormValidity();\n }\n\n formResetCallback() {\n this.clearSelection();\n // Reset the form validity state\n this.setFormValue();\n this.updateFormValidity();\n }\n\n // Listeners\n // ==============\n\n // Public methods API\n // These methods are exposed on the host element.\n // Always use two lines.\n // Public Methods must be async.\n // Requires JSDocs for public API documentation.\n // ===============================================\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private get numberOfCharacters() {\n if (!this.maxlength || !this.textarea) return 0;\n\n return this.value?.length;\n }\n\n private handleBlur = () => {\n if (this.disabled) return;\n\n this.bqBlur.emit(this.el);\n };\n\n private handleFocus = () => {\n if (this.disabled) return;\n\n this.bqFocus.emit(this.el);\n };\n\n private handleChange = (ev: Event) => {\n if (this.disabled) return;\n\n if (!isHTMLElement(ev.target, 'textarea')) return;\n this.value = ev.target.value;\n this.setFormValue(this.value);\n this.updateFormValidity();\n\n this.bqChange.emit({ value: this.value, el: this.el });\n };\n\n private handleInput = (ev: Event) => {\n if (this.disabled) return;\n\n this.debounceBqInput?.cancel();\n\n if (!isHTMLElement(ev.target, 'textarea')) return;\n this.value = ev.target.value;\n\n this.debounceBqInput = debounce(() => {\n this.bqInput.emit({ value: this.value, el: this.el });\n }, this.debounceTime);\n this.debounceBqInput();\n\n this.autoResize();\n };\n\n private autoResize = () => {\n if (!this.autoGrow) return;\n\n const inputElem = this.textarea;\n if (!inputElem) return;\n\n inputElem.style.height = 'auto';\n inputElem.style.height = `${inputElem.scrollHeight}px`;\n };\n\n private handleSlotChange = () => {\n this.hasLabel = hasSlotContent(this.labelElem);\n this.hasHelperText = hasSlotContent(this.helperTextElem);\n };\n\n private setFormValue = (value?: string) => {\n this.internals.setFormValue(!isNil(value) ? `${value}` : undefined);\n };\n\n private updateFormValidity = () => {\n const { formValidationMessage, internals, required, value, textarea } = this;\n\n // Clear the validity state\n internals?.states.clear();\n\n if (required && (!value || value.trim() === '')) {\n // Set validity state to invalid\n internals?.states.add('invalid');\n internals?.setValidity({ valueMissing: true }, formValidationMessage, textarea);\n return;\n }\n\n // Set validity state to valid if textarea has value or is not required\n internals?.states.add('valid');\n internals?.setValidity({});\n };\n\n private clearSelection = () => {\n this.value = '';\n this.textarea.value = this.value;\n };\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <div class=\"bq-textarea flex flex-auto flex-col\" part=\"base\">\n <label\n aria-label={this.name ?? this.fallbackId}\n class={{ 'bq-textarea__label': true, '!hidden': !this.hasLabel }}\n htmlFor={this.name ?? this.fallbackId}\n part=\"label\"\n ref={(label: HTMLLabelElement) => {\n this.labelElem = label;\n }}\n >\n <slot name=\"label\" onSlotchange={this.handleSlotChange} />\n </label>\n <textarea\n autocapitalize={this.autocapitalize}\n autocomplete={this.autocomplete}\n autofocus={this.autofocus}\n class={{\n 'bq-textarea__input': true,\n 'resize-none': this.disableResize,\n [`validation-${this.validationStatus}`]: true,\n }}\n disabled={this.disabled}\n form={this.form}\n id={this.name ?? this.fallbackId}\n maxLength={this.maxlength > 0 ? this.maxlength : undefined}\n name={this.name}\n onBlur={this.handleBlur}\n onChange={this.handleChange}\n onFocus={this.handleFocus}\n onInput={this.handleInput}\n part=\"input\"\n placeholder={this.placeholder}\n readOnly={this.readonly}\n ref={(elem: HTMLTextAreaElement) => {\n this.textarea = elem;\n }}\n required={this.required}\n rows={this.rows}\n spellcheck={this.spellcheck}\n wrap={this.wrap}\n >\n {this.value}\n </textarea>\n <div\n class={{\n 'bq-textarea__helper flex items-center justify-between': true,\n [`validation-${this.validationStatus}`]: true,\n '!hidden': !this.hasHelperText && !this.maxlength,\n }}\n part=\"helper-info\"\n >\n <span\n class=\"bq-textarea__helper--text\"\n part=\"helper-text\"\n ref={(span: HTMLElement) => {\n this.helperTextElem = span;\n }}\n >\n <slot name=\"helper-text\" onSlotchange={this.handleSlotChange} />\n </span>\n <span\n class={{ 'bq-textarea__helper--counter [fontVariant:tabular-nums]': true, '!hidden': !this.maxlength }}\n part=\"helper-counter\"\n >\n {this.numberOfCharacters ?? 0}/{this.maxlength}\n </span>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["bqTextareaCss","BqTextarea","debounceBqInput","fallbackId","helperTextElem","labelElem","textarea","internals","hasHelperText","hasLabel","autocapitalize","autocomplete","autofocus","autoGrow","debounceTime","disabled","disableResize","form","formValidationMessage","maxlength","name","placeholder","readonly","required","rows","spellcheck","validationStatus","value","wrap","handleValueChange","this","length","substring","setFormValue","updateFormValidity","handleRequiredPropChange","bqBlur","bqChange","bqClear","bqFocus","bqInput","componentDidLoad","handleSlotChange","formAssociatedCallback","formResetCallback","clearSelection","numberOfCharacters","handleBlur","emit","el","handleFocus","handleChange","ev","isHTMLElement","target","handleInput","cancel","debounce","autoResize","inputElem","style","height","scrollHeight","hasSlotContent","isNil","undefined","states","clear","trim","add","setValidity","valueMissing","render","h","key","class","part","htmlFor","ref","label","onSlotchange","id","maxLength","onBlur","onChange","onFocus","onInput","readOnly","elem","span"],"sources":["../../packages/beeq/src/components/textarea/scss/bq-textarea.scss?tag=bq-textarea&encapsulation=shadow","../../packages/beeq/src/components/textarea/bq-textarea.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/* Textarea styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-textarea.variables';\n\n:host {\n @apply block is-full;\n}\n\n/* -------------------------------------------------------------------------- */\n/* Label */\n/* -------------------------------------------------------------------------- */\n\n.bq-textarea__label {\n @apply text-[length:--bq-textarea--label-text-size] text-[color:--bq-textarea--label-text-color] m-be-[--bq-textarea--label-margin-bottom];\n}\n\n/* -------------------------------------------------------------------------- */\n/* Native HTML Textarea control */\n/* -------------------------------------------------------------------------- */\n\n.bq-textarea__input {\n @apply flex-auto resize-y bg-[--bq-textarea--background-color] bs-[inherit];\n // Border\n @apply rounded-[--bq-textarea--border-radius] border-[length:--bq-textarea--border-width] border-[color:--bq-textarea--border-color];\n // Padding\n @apply pe-[--bq-textarea--padding-end] ps-[--bq-textarea--padding-start] p-b-[--bq-textarea--paddingY];\n // Text\n @apply text-[length:--bq-textarea--text-size] text-[color:--bq-textarea--text-color] placeholder:text-[color:--bq-textarea--text-placeholder-color];\n // Transition\n @apply transition-colors ease-in-out;\n // Hover\n @apply [&:not([disabled]):not(:focus-within)]:hover:border-hover-brand;\n // Disabled\n @apply disabled:cursor-not-allowed disabled:opacity-60;\n // Focus\n &:not([disabled]):focus-within {\n --bq-ring-width: 1px;\n --bq-ring-offset-width: 0;\n --bq-ring-color-focus: var(--bq-textarea--border-color-focus);\n\n @apply focus border-[color:--bq-ring-color-focus];\n }\n}\n\n/* ------------------------------- Validations ------------------------------- */\n\n.bq-textarea__input.validation-error {\n @apply border-danger [&:not(.disabled):not(:focus-within)]:hover:border-hover-danger;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(stroke.danger);\n\n @apply border-active-danger;\n }\n}\n\n.bq-textarea__input.validation-success {\n @apply border-success [&:not(.disabled):not(:focus-within)]:hover:border-hover-success;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(stroke.success);\n\n @apply border-active-success;\n }\n}\n\n.bq-textarea__input.validation-warning {\n @apply border-warning [&:not(.disabled):not(:focus-within)]:hover:border-hover-warning;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(stroke.warning);\n\n @apply border-active-warning;\n }\n}\n\n/* -------------------------------------------------------------------------- */\n/* Helper text */\n/* -------------------------------------------------------------------------- */\n\n.bq-textarea__helper {\n @apply text-[length:--bq-textarea--helper-text-size] text-[color:--bq-textarea--helper-text-color] m-bs-[--bq-textarea--helper-margin-top];\n}\n\n/* ------------------------------- Validations ------------------------------ */\n\n.bq-textarea__helper.validation-error {\n @apply text-danger;\n}\n\n.bq-textarea__helper.validation-success {\n @apply text-success;\n}\n\n.bq-textarea__helper.validation-warning {\n @apply text-warning;\n}\n\n/* ----------------------------- Helper counter ----------------------------- */\n\n/** Apply a disabled text color style to the textarea counter when the validation is none. */\n.bq-textarea__helper[class~='validation-none'] {\n .bq-textarea__helper--counter {\n @apply opacity-60;\n }\n}\n","import type { EventEmitter } from '@stencil/core';\nimport { AttachInternals, Component, Element, Event, h, Prop, State, Watch } from '@stencil/core';\n\nimport { debounce, hasSlotContent, isHTMLElement, isNil, type TDebounce } from '../../shared/utils';\nimport type { TInputValidation } from '../input/bq-input.types';\nimport type { TTextareaAutoCapitalize, TTextareaWrap } from './bq-textarea.types';\n\n/**\n * The Textarea component is a multi-line text input control that is often used in a form to collect user inputs like comments or reviews.\n *\n * @example How to use it\n * ```html\n * <bq-textarea maxlength=\"0\" name=\"textarea\" placeholder=\"Placeholder...\" rows=\"5\">\n * <label slot=\"label\">Label</label>\n * <span class=\"flex items-center gap-xs\" slot=\"helper-text\">\n * <bq-icon name=\"star\"></bq-icon>\n * Helper text\n * </span>\n * </bq-textarea>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/16792c-textarea\n * @status stable\n *\n * @attr {string} autocapitalize - Controls whether or not the textarea field should be capitalized and how.\n * @attr {string} autocomplete - Specifies whether or not the textarea field should have autocomplete enabled.\n * @attr {boolean} autofocus - If `true`, the textarea will be focused on component render.\n * @attr {boolean} auto-grow - If `true`, the textarea will automatically grow and shrink to fit its contents.\n * @attr {number} debounce-time - The amount of time, in milliseconds, to wait before emitting the `bqInput` event after the textarea value changes.\n * @attr {boolean} disabled - If `true`, the user cannot interact with the textarea.\n * @attr {boolean} disable-resize - If `true`, it will block the user's ability to resize the textarea.\n * @attr {string} form - The ID of the form that the textarea field belongs to.\n * @attr {string} form-validation-message - The native form validation message.\n * @attr {number} maxlength - The maximum number of characters that can be entered into the textarea (`0`: no limit).\n * @attr {string} name - The name of the textarea element.\n * @attr {string} placeholder - The placeholder text to show when there is no value.\n * @attr {boolean} readonly - If `true`, the textarea field cannot be modified.\n * @attr {boolean} required - Indicates whether or not the textarea field is required to be filled out before submitting the form.\n * @attr {number} rows - The number of visible text lines for the control. It must be a positive integer.\n * @attr {boolean} spellcheck - If `true`, the textarea content may be checked for spelling errors.\n * @attr {\"error\" | \"none\" | \"success\" | \"warning\"} validation-status - The validation status of the textarea.\n * @attr {string} value - The value of the textarea. It can be used to reset the textarea to a previous value.\n * @attr {\"soft\" | \"hard\"} wrap - Specifies how the text in a text area is to be wrapped when submitted in a form.\n *\n * @event bqBlur - Handler to be called when the textarea loses focus.\n * @event bqChange - Handler to be called when the textarea value has changed and the textarea loses focus.\n * @event bqClear - Handler to be called when the textarea value has been cleared.\n * @event bqFocus - Handler to be called when the textarea has received focus.\n * @event bqInput - Handler to be called when the textarea value changes.\n *\n * @slot label - The textarea label.\n * @slot helper-text - The helper text.\n *\n * @part base - The component's base wrapper.\n * @part input - The textarea element.\n * @part label - The textarea label.\n * @part helper-info - The helper info container.\n * @part helper-text - The helper text.\n * @part helper-counter - The helper counter.\n *\n * @cssprop --bq-textarea--background-color - Textarea background color\n * @cssprop --bq-textarea--border-color - Textarea border color\n * @cssprop --bq-textarea--border-color-focus - Textarea border color on focus\n * @cssprop --bq-textarea--border-radius - Textarea border radius\n * @cssprop --bq-textarea--border-width - Textarea border width\n * @cssprop --bq-textarea--border-style - Textarea border style\n * @cssprop --bq-textarea--helper-margin-top - Textarea helper text margin top\n * @cssprop --bq-textarea--helper-text-color - Textarea helper text color\n * @cssprop --bq-textarea--helper-text-size - Textarea helper text size\n * @cssprop --bq-textarea--label-margin-bottom - Textarea label margin bottom\n * @cssprop --bq-textarea--label-text-color - Textarea label text color\n * @cssprop --bq-textarea--label-text-size - Textarea label text size\n * @cssprop --bq-textarea--paddingY - Textarea padding top and bottom\n * @cssprop --bq-textarea--padding-start - Textarea padding start\n * @cssprop --bq-textarea--padding-end - Textarea padding end\n * @cssprop --bq-textarea--text-color - Textarea text color\n * @cssprop --bq-textarea--text-size - Textarea text size\n * @cssprop --bq-textarea--text-placeholder-color - Textarea placeholder text color\n */\n@Component({\n tag: 'bq-textarea',\n styleUrl: './scss/bq-textarea.scss',\n formAssociated: true,\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class BqTextarea {\n // Own Properties\n // ====================\n\n private debounceBqInput: TDebounce<void>;\n private fallbackId = 'textarea';\n\n private helperTextElem?: HTMLElement;\n private labelElem?: HTMLLabelElement;\n private textarea: HTMLTextAreaElement;\n\n // Reference to host HTML element\n // ===================================\n\n @AttachInternals() internals!: ElementInternals;\n @Element() el!: HTMLBqTextareaElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private hasHelperText = false;\n @State() private hasLabel = false;\n\n // Public Property API\n // ========================\n\n /**\n * Controls whether or not the textarea field should be capitalized and how.\n * Possible values are 'off', 'none', 'on', 'sentences', 'words', and 'characters'.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/autocapitalize\n */\n @Prop({ reflect: true }) autocapitalize: TTextareaAutoCapitalize = 'off';\n\n /**\n * Specifies whether or not the textarea field should have autocomplete enabled.\n *\n * @see https://developer.mozilla.org/en-US/docs/Web/HTML/Attributes/autocomplete#values\n */\n @Prop({ reflect: true }) autocomplete: string = 'off';\n\n /** If true, the textarea will be focused on component render */\n @Prop({ reflect: true }) autofocus: boolean = false;\n\n /**\n * If `true`, the textarea will automatically grow and shrink to fit its contents.\n * If `false`, the textarea will have a fixed height specified by the `rows` property.\n */\n @Prop({ reflect: true }) autoGrow: boolean = false;\n\n /**\n * The amount of time, in milliseconds, to wait before emitting the `bqInput` event after the textarea value changes.\n * A value of 0 means no debouncing will occur.\n */\n @Prop({ reflect: true, mutable: true }) debounceTime? = 0;\n\n /** If `true`, the user cannot interact with the textarea. */\n @Prop({ reflect: true }) disabled: boolean = false;\n\n /** If `true`, it will block the user's ability to resize the textarea. */\n @Prop({ reflect: true }) disableResize?: boolean = false;\n\n /** The ID of the form that the textarea field belongs to. */\n @Prop({ reflect: true }) form?: string;\n\n /** The native form validation message */\n @Prop({ mutable: true }) formValidationMessage?: string;\n\n /**\n * The maximum number of characters that can be entered into the textarea (`0`: no limit).\n * When enabled, a character counter will be shown underneath the textarea.\n */\n @Prop({ reflect: true }) maxlength: number;\n\n /** The name of the textarea element. */\n @Prop({ reflect: true }) name!: string;\n\n /** The placeholder text to show when there is no value. */\n @Prop({ reflect: true }) placeholder!: string;\n\n /** If true, the textarea field cannot be modified. */\n @Prop({ reflect: true }) readonly?: boolean = false;\n\n /** Indicates whether or not the textarea field is required to be filled out before submitting the form. */\n @Prop({ reflect: true }) required?: boolean = false;\n\n /** The number of visible text lines for the control. It must be a positive integer. */\n @Prop({ reflect: true }) rows: number = 5;\n\n /** If true, the textarea content may be checked for spelling errors. */\n @Prop({ reflect: true }) spellcheck: boolean = false;\n\n /**\n * The validation status of the textarea.\n *\n * @remarks\n * This property is used to indicate the validation status of the textarea. It can be set to one of the following values:\n * - `'none'`: No validation status is set.\n * - `'error'`: The textarea has a validation error.\n * - `'warning'`: The textarea has a validation warning.\n * - `'success'`: The textarea has passed validation.\n */\n @Prop({ reflect: true, mutable: true }) validationStatus: TInputValidation = 'none';\n\n /** The value of the textarea. It can be used to reset the textarea to a previous value. */\n @Prop({ mutable: true }) value: string;\n\n /** Specifies how the text in a text area is to be wrapped when submitted in a form */\n @Prop({ reflect: true }) wrap: TTextareaWrap = 'soft';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('value')\n handleValueChange() {\n if (!this.textarea) return;\n\n if (this.maxlength && this.value?.length >= this.maxlength) {\n // If the value is longer than the maxlength, we need to truncate it\n this.value = this.value?.substring(0, this.maxlength);\n this.textarea.value = this.value ?? '';\n }\n\n this.setFormValue(this.value);\n this.updateFormValidity();\n }\n\n @Watch('required')\n handleRequiredPropChange() {\n this.updateFormValidity();\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n /** Callback handler emitted when the textarea loses focus */\n @Event() bqBlur!: EventEmitter<HTMLBqTextareaElement>;\n\n /**\n * Callback handler emitted when the textarea value has changed and the textarea loses focus.\n * This handler is called whenever the user finishes typing or pasting text into the textarea field and then clicks outside of the textarea field.\n */\n @Event() bqChange!: EventEmitter<{ value: string; el: HTMLBqTextareaElement }>;\n\n /** Callback handler emitted when the textarea value has been cleared */\n @Event() bqClear!: EventEmitter<HTMLBqTextareaElement>;\n\n /** Callback handler emitted when the textarea has received focus */\n @Event() bqFocus!: EventEmitter<HTMLBqTextareaElement>;\n\n /**\n * Callback handler emitted when the textarea value changes.\n * This handler is called whenever the user types or pastes text into the textarea field.\n */\n @Event() bqInput!: EventEmitter<{ value: string; el: HTMLBqTextareaElement }>;\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n componentDidLoad() {\n this.handleSlotChange();\n this.handleValueChange();\n }\n\n formAssociatedCallback() {\n this.setFormValue(this.value);\n this.updateFormValidity();\n }\n\n formResetCallback() {\n this.clearSelection();\n // Reset the form validity state\n this.setFormValue();\n this.updateFormValidity();\n }\n\n // Listeners\n // ==============\n\n // Public methods API\n // These methods are exposed on the host element.\n // Always use two lines.\n // Public Methods must be async.\n // Requires JSDocs for public API documentation.\n // ===============================================\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private get numberOfCharacters() {\n if (!this.maxlength || !this.textarea) return 0;\n\n return this.value?.length;\n }\n\n private handleBlur = () => {\n if (this.disabled) return;\n\n this.bqBlur.emit(this.el);\n };\n\n private handleFocus = () => {\n if (this.disabled) return;\n\n this.bqFocus.emit(this.el);\n };\n\n private handleChange = (ev: Event) => {\n if (this.disabled || this.readonly) return;\n\n if (!isHTMLElement(ev.target, 'textarea')) return;\n this.value = ev.target.value;\n this.setFormValue(this.value);\n this.updateFormValidity();\n\n this.bqChange.emit({ value: this.value, el: this.el });\n };\n\n private handleInput = (ev: Event) => {\n if (this.disabled || this.readonly) return;\n\n this.debounceBqInput?.cancel();\n\n if (!isHTMLElement(ev.target, 'textarea')) return;\n this.value = ev.target.value;\n\n this.debounceBqInput = debounce(() => {\n this.bqInput.emit({ value: this.value, el: this.el });\n }, this.debounceTime);\n this.debounceBqInput();\n\n this.autoResize();\n };\n\n private autoResize = () => {\n if (!this.autoGrow) return;\n\n const inputElem = this.textarea;\n if (!inputElem) return;\n\n inputElem.style.height = 'auto';\n inputElem.style.height = `${inputElem.scrollHeight}px`;\n };\n\n private handleSlotChange = () => {\n this.hasLabel = hasSlotContent(this.labelElem);\n this.hasHelperText = hasSlotContent(this.helperTextElem);\n };\n\n private setFormValue = (value?: string) => {\n this.internals.setFormValue(!isNil(value) ? `${value}` : undefined);\n };\n\n private updateFormValidity = () => {\n const { formValidationMessage, internals, required, value, textarea } = this;\n\n // Clear the validity state\n internals?.states.clear();\n\n if (required && (!value || value.trim() === '')) {\n // Set validity state to invalid\n internals?.states.add('invalid');\n internals?.setValidity({ valueMissing: true }, formValidationMessage || 'This field is required', textarea);\n return;\n }\n\n // Set validity state to valid if textarea has value or is not required\n internals?.states.add('valid');\n internals?.setValidity({});\n };\n\n private clearSelection = () => {\n this.value = '';\n this.textarea.value = this.value;\n };\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <div class=\"bq-textarea flex flex-auto flex-col\" part=\"base\">\n <label\n aria-label={this.name ?? this.fallbackId}\n class={{ 'bq-textarea__label': true, '!hidden': !this.hasLabel }}\n htmlFor={this.name ?? this.fallbackId}\n part=\"label\"\n ref={(label: HTMLLabelElement) => {\n this.labelElem = label;\n }}\n >\n <slot name=\"label\" onSlotchange={this.handleSlotChange} />\n </label>\n <textarea\n autocapitalize={this.autocapitalize}\n autocomplete={this.autocomplete}\n autofocus={this.autofocus}\n class={{\n 'bq-textarea__input': true,\n 'resize-none': this.disableResize,\n [`validation-${this.validationStatus}`]: true,\n }}\n disabled={this.disabled}\n form={this.form}\n id={this.name ?? this.fallbackId}\n maxLength={this.maxlength > 0 ? this.maxlength : undefined}\n name={this.name}\n onBlur={this.handleBlur}\n onChange={this.handleChange}\n onFocus={this.handleFocus}\n onInput={this.handleInput}\n part=\"input\"\n placeholder={this.placeholder}\n readOnly={this.readonly}\n ref={(elem: HTMLTextAreaElement) => {\n this.textarea = elem;\n }}\n required={this.required}\n rows={this.rows}\n spellcheck={this.spellcheck}\n wrap={this.wrap}\n >\n {this.value}\n </textarea>\n <div\n class={{\n 'bq-textarea__helper flex items-center justify-between': true,\n [`validation-${this.validationStatus}`]: true,\n '!hidden': !this.hasHelperText && !this.maxlength,\n }}\n part=\"helper-info\"\n >\n <span\n class=\"bq-textarea__helper--text\"\n part=\"helper-text\"\n ref={(span: HTMLElement) => {\n this.helperTextElem = span;\n }}\n >\n <slot name=\"helper-text\" onSlotchange={this.handleSlotChange} />\n </span>\n <span\n class={{ 'bq-textarea__helper--counter [fontVariant:tabular-nums]': true, '!hidden': !this.maxlength }}\n part=\"helper-counter\"\n >\n {this.numberOfCharacters ?? 0}/{this.maxlength}\n </span>\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -2,5 +2,5 @@
|
|
|
2
2
|
* Built by Endavans
|
|
3
3
|
* © https://beeq.design - Apache 2 License.
|
|
4
4
|
*/
|
|
5
|
-
import{r as a,a as r,h as b}from"./p-CO2T68hs.js";const e=()=>`.transform{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}::backdrop,:root{--bq-blue-100:#e7f0fd;--bq-blue-200:#d0e2fb;--bq-blue-300:#a1c5f7;--bq-blue-400:#73a8f3;--bq-blue-500:#448bef;--bq-blue-600:#156eeb;--bq-blue-700:#1158bc;--bq-blue-800:#0d428d;--bq-blue-900:#082c5e;--bq-blue-1000:#04162f;--bq-corai-100:#fff2f2;--bq-corai-200:#ffe6e6;--bq-corai-300:#ffccce;--bq-corai-400:#ffb3b5;--bq-corai-500:#ff999d;--bq-corai-600:#ff8084;--bq-corai-700:#cc666a;--bq-corai-800:#994d4f;--bq-corai-900:#663335;--bq-corai-1000:#331a1a;--bq-cyan-100:#e8f7fb;--bq-cyan-200:#d2f0f8;--bq-cyan-300:#a5e1f1;--bq-cyan-400:#78d1e9;--bq-cyan-500:#4bc2e2;--bq-cyan-600:#1eb3db;--bq-cyan-700:#188faf;--bq-cyan-800:#126b83;--bq-cyan-900:#0c4858;--bq-cyan-1000:#06242c;--bq-gold-100:#fbf4ec;--bq-gold-200:#f7e9da;--bq-gold-300:#f0d3b6;--bq-gold-400:#e8bc91;--bq-gold-500:#e1a66d;--bq-gold-600:#d99048;--bq-gold-700:#ae733a;--bq-gold-800:#82562b;--bq-gold-900:#573a1d;--bq-gold-1000:#2b1d0e;--bq-green-100:#e8f8ef;--bq-green-200:#d2f1e0;--bq-green-300:#a5e3c1;--bq-green-400:#78d5a1;--bq-green-500:#4bc782;--bq-green-600:#1eb963;--bq-green-700:#18944f;--bq-green-800:#126f3b;--bq-green-900:#0c4a28;--bq-green-1000:#062514;--bq-grey-100:#f1f2f4;--bq-grey-200:#e7e8eb;--bq-grey-300:#caccd2;--bq-grey-400:#a6aab3;--bq-grey-50:#f6f6f8;--bq-grey-500:#898e99;--bq-grey-600:#646a77;--bq-grey-700:#3f4350;--bq-grey-800:#2a2c35;--bq-grey-900:#1c1d23;--bq-grey-950:#15161a;--bq-grey-1000:#0d0e11;--bq-indigo-100:#edecfc;--bq-indigo-200:#dcdafa;--bq-indigo-300:#b9b5f5;--bq-indigo-400:#9590ef;--bq-indigo-500:#726bea;--bq-indigo-600:#4f46e5;--bq-indigo-700:#3f38b7;--bq-indigo-800:#2f2a89;--bq-indigo-900:#201c5c;--bq-indigo-1000:#100e2e;--bq-iris-100:#e9f0ff;--bq-iris-200:#d6e0ff;--bq-iris-300:#b2c0fe;--bq-iris-400:#8691f8;--bq-iris-500:#6061ee;--bq-iris-600:#4f46e5;--bq-iris-700:#413abd;--bq-iris-800:#332e95;--bq-iris-900:#26216d;--bq-iris-1000:#181545;--bq-lime-100:#f5fae8;--bq-lime-200:#ecf6d2;--bq-lime-300:#d9eda5;--bq-lime-400:#c5e379;--bq-lime-500:#b2da4c;--bq-lime-600:#9fd11f;--bq-lime-700:#7fa719;--bq-lime-800:#5f7d13;--bq-lime-900:#40540c;--bq-lime-1000:#202a06;--bq-magenta-100:#fce7f4;--bq-magenta-200:#f9cfea;--bq-magenta-300:#f39fd6;--bq-magenta-400:#ee6fbf;--bq-magenta-500:#e83fab;--bq-magenta-600:#de1395;--bq-magenta-700:#b20f77;--bq-magenta-800:#850c59;--bq-magenta-900:#58083c;--bq-magenta-1000:#2c041e;--bq-neutral-white:#fbfbfc;--bq-neutral-black:#060708;--bq-orange-100:#fbf0e9;--bq-orange-200:#f8e1d4;--bq-orange-300:#f1c2a8;--bq-orange-400:#eaa47d;--bq-orange-500:#e38551;--bq-orange-600:#dc6726;--bq-orange-700:#b0521e;--bq-orange-800:#843e17;--bq-orange-900:#58290f;--bq-orange-1000:#2c1508;--bq-purple-100:#efebf8;--bq-purple-200:#e0d7f2;--bq-purple-300:#c1afe5;--bq-purple-400:#a388d8;--bq-purple-500:#8460cb;--bq-purple-600:#6538be;--bq-purple-700:#512d98;--bq-purple-800:#3d2272;--bq-purple-900:#28164c;--bq-purple-1000:#140b26;--bq-red-100:#fce7ea;--bq-red-200:#f9d1d5;--bq-red-300:#f3a2ac;--bq-red-400:#ed7482;--bq-red-500:#e74559;--bq-red-600:#e1172f;--bq-red-700:#b41226;--bq-red-800:#870e1c;--bq-red-900:#5a0913;--bq-red-1000:#2d0509;--bq-sky-100:#eff4fb;--bq-sky-200:#dfeaf8;--bq-sky-300:#bfd5f1;--bq-sky-400:#9ec1e9;--bq-sky-500:#7eace2;--bq-sky-600:#5e97db;--bq-sky-700:#4b79af;--bq-sky-800:#385b83;--bq-sky-900:#263c58;--bq-sky-1000:#131e2c;--bq-teal-100:#e5f7f5;--bq-teal-200:#ccf0eb;--bq-teal-300:#99e1d8;--bq-teal-400:#66d2c4;--bq-teal-500:#33c3b1;--bq-teal-600:#00b49d;--bq-teal-700:#00907e;--bq-teal-800:#006c5e;--bq-teal-900:#00483f;--bq-teal-1000:#00241f;--bq-volcano-100:#feede7;--bq-volcano-200:#fddbd1;--bq-volcano-300:#fbb8a3;--bq-volcano-400:#fa9474;--bq-volcano-500:#f87146;--bq-volcano-600:#f64d18;--bq-volcano-700:#c53e13;--bq-volcano-800:#942e0e;--bq-volcano-900:#621f0a;--bq-volcano-1000:#310f05;--bq-yellow-100:#fefbe7;--bq-yellow-200:#fcf6d0;--bq-yellow-300:#faeea0;--bq-yellow-400:#f7e571;--bq-yellow-500:#f5dd41;--bq-yellow-600:#f2d412;--bq-yellow-700:#c2aa0e;--bq-yellow-800:#917f0b;--bq-yellow-900:#615507;--bq-yellow-1000:#302a04;--bq-endava-grey-50:#f7f7f8;--bq-endava-grey-100:#e4e6e7;--bq-endava-grey-200:#b5babe;--bq-endava-grey-300:#949ca1;--bq-endava-grey-400:#737d84;--bq-endava-grey-500:#525f67;--bq-endava-grey-600:#30404b;--bq-endava-grey-700:#2b3942;--bq-endava-grey-800:#263139;--bq-endava-grey-900:#192b37;--bq-endava-grey-950:#151b1e;--bq-endava-grey-1000:#0f1316;--bq-endava-neutral-white:#fafbfb;--bq-endava-neutral-black:#060708;--bq-endava-orange-100:#fef3f1;--bq-endava-orange-200:#fbd6d1;--bq-endava-orange-300:#fab7af;--bq-endava-orange-400:#fa988b;--bq-endava-orange-500:#fc7866;--bq-endava-orange-600:#ff5640;--bq-endava-orange-700:#ce4a39;--bq-endava-orange-800:#a03d30;--bq-endava-orange-900:#722e25;--bq-endava-orange-1000:#471e19}*,:after,:before{box-sizing:border-box}*{font:inherit;margin:0}ol[role=list],ul[role=list]{list-style-type:none}html{text-size-adjust:none;font-family:var(--bq-font-family);font-size:var(--bq-font-size--m)}html:focus-within{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bq-background--primary);color:var(--bq-text--primary);line-height:var(--bq-font-line-height--regular);min-height:100vb;text-rendering:optimizeSpeed}a:not([class]){text-decoration-skip-ink:auto}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto;transition-duration:.01ms!important}}:where(:root){--bq-white:#fff;--bq-black:#060708;--bq-neutral-50:var(--bq-grey-50);--bq-neutral-100:var(--bq-grey-100);--bq-neutral-200:var(--bq-grey-200);--bq-neutral-300:var(--bq-grey-300);--bq-neutral-400:var(--bq-grey-400);--bq-neutral-500:var(--bq-grey-500);--bq-neutral-600:var(--bq-grey-600);--bq-neutral-700:var(--bq-grey-700);--bq-neutral-800:var(--bq-grey-800);--bq-neutral-900:var(--bq-grey-900);--bq-neutral-950:var(--bq-grey-950);--bq-neutral-1000:var(--bq-grey-1000);--bq-brand-light:var(--bq-iris-100);--bq-brand:var(--bq-iris-600);--bq-brand-dark:var(--bq-iris-1000);--bq-accent-light:var(--bq-purple-100);--bq-accent:var(--bq-purple-600);--bq-accent-dark:var(--bq-purple-1000);--bq-success-light:var(--bq-teal-100);--bq-success:var(--bq-teal-600);--bq-success-dark:var(--bq-teal-1000);--bq-danger-light:var(--bq-red-100);--bq-danger:var(--bq-red-600);--bq-danger-dark:var(--bq-red-1000);--bq-warning-light:var(--bq-gold-100);--bq-warning:var(--bq-gold-600);--bq-warning-dark:var(--bq-gold-1000);--bq-info-light:var(--bq-iris-100);--bq-info:var(--bq-iris-600);--bq-info-dark:var(--bq-iris-1000);--bq-focus:var(--bq-iris-600);--bq-data-01:var(--bq-brand);--bq-data-02:var(--bq-purple-600);--bq-data-03:var(--bq-magenta-600);--bq-data-04:var(--bq-cyan-600);--bq-data-05:var(--bq-teal-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-yellow-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-blue-600);--bq-data-10:var(--bq-grey-600);--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white);--bq-radius--none:0;--bq-radius--xs2:0.125rem;--bq-radius--xs:0.25rem;--bq-radius--s:0.5rem;--bq-radius--m:0.75rem;--bq-radius--l:1.5rem;--bq-radius--full:9999px;--bq-box-shadow--xs:0 2px 0 rgba(0,0,0,.016);--bq-box-shadow--s:0 8px 24px rgba(0,0,0,.04);--bq-box-shadow--m:0 10px 48px -16px rgba(0,0,0,.12);--bq-box-shadow--l:0 20px 58px -16px rgba(0,0,0,.16);--bq-font-family:"Outfit",sans-serif;--bq-font-size--xs:0.75rem;--bq-font-size--s:0.875rem;--bq-font-size--m:1rem;--bq-font-size--l:1.125rem;--bq-font-size--xl:1.5rem;--bq-font-size--xxl:2rem;--bq-font-size--xxl2:2.5rem;--bq-font-size--xxl3:3rem;--bq-font-size--xxl4:3.5rem;--bq-font-size--xxl5:4rem;--bq-font-weight--thin:100;--bq-font-weight--light:300;--bq-font-weight--regular:400;--bq-font-weight--medium:500;--bq-font-weight--semibold:600;--bq-font-weight--bold:700;--bq-font-line-height--small:1.2;--bq-font-line-height--regular:1.5;--bq-font-line-height--large:1.5;--bq-spacing-xs3:0.125rem;--bq-spacing-xs2:0.25rem;--bq-spacing-xs:0.5rem;--bq-spacing-s:0.75rem;--bq-spacing-m:1rem;--bq-spacing-l:1.5rem;--bq-spacing-xl:2rem;--bq-spacing-xxl:2.5rem;--bq-spacing-xxl2:3.5rem;--bq-spacing-xxl3:4rem;--bq-spacing-xxl4:4.5rem;--bq-stroke-s:1px;--bq-stroke-m:2px;--bq-stroke-l:3px}.beeq:not([bq-mode]),.light,:root:not([bq-theme]):not([bq-mode]),:root[bq-theme=beeq]:not([bq-mode]),[bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--alt:var(--bq-white);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-light);--bq-hover:#bcbfc5;--bq-active:#444546}.dark,[bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-950);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-dark);--bq-hover:#444546;--bq-active:#1f2026}:where(.endava),:where([bq-theme=endava]){--bq-font-family:"Poppins",sans-serif;--bq-white:#fafbfb;--bq-black:#030406;--bq-neutral-50:var(--bq-endava-grey-50);--bq-neutral-100:var(--bq-endava-grey-100);--bq-neutral-200:var(--bq-endava-grey-200);--bq-neutral-300:var(--bq-endava-grey-300);--bq-neutral-400:var(--bq-endava-grey-400);--bq-neutral-500:var(--bq-endava-grey-500);--bq-neutral-600:var(--bq-endava-grey-600);--bq-neutral-700:var(--bq-endava-grey-700);--bq-neutral-800:var(--bq-endava-grey-800);--bq-neutral-900:var(--bq-endava-grey-900);--bq-neutral-950:var(--bq-endava-grey-950);--bq-neutral-1000:var(--bq-endava-grey-1000);--bq-brand-light:var(--bq-endava-orange-100);--bq-brand:var(--bq-endava-orange-600);--bq-brand-dark:var(--bq-endava-orange-1000);--bq-accent-light:var(--bq-endava-orange-100);--bq-accent:var(--bq-endava-orange-600);--bq-accent-dark:var(--bq-endava-orange-1000);--bq-success-light:var(--bq-green-100);--bq-success:var(--bq-green-600);--bq-success-dark:var(--bq-green-1000);--bq-danger-light:var(--bq-corai-100);--bq-danger:var(--bq-corai-600);--bq-danger-dark:var(--bq-corai-1000);--bq-warning-light:var(--bq-yellow-100);--bq-warning:var(--bq-yellow-600);--bq-warning-dark:var(--bq-yellow-1000);--bq-info-light:var(--bq-blue-100);--bq-info:var(--bq-blue-600);--bq-info-dark:var(--bq-blue-1000);--bq-focus:var(--bq-endava-orange-600);--bq-data-01:var(--bq-brand);--bq-data-02:#af0cd8;--bq-data-03:#0ca8d8;--bq-data-04:var(--bq-teal-600);--bq-data-05:var(--bq-yellow-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-blue-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-purple-600);--bq-data-10:#394b56;--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white)}.endava.light,.endava:not([bq-mode]),[bq-theme=endava]:not([bq-mode]),[bq-theme=endava][bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--brand-alt:var(--bq-brand-light);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--brand:var(--bq-brand);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-light);--bq-hover:#444546;--bq-active:#1f2026}.endava.dark,[bq-theme=endava][bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-900);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--brand-alt:var(--bq-brand-dark);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-neutral-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-dark);--bq-hover:#444546;--bq-active:#1f2026}.block{display:block}.flex{display:flex}.items-center{align-items:center}.overflow-hidden{overflow:hidden}.bg-\\[--bq-option-group--background\\]{background-color:var(--bq-option-group--background)}.pe-\\[--bq-option-group--label-padding-end\\]{padding-inline-end:var(--bq-option-group--label-padding-end)}.pe-\\[--bq-option-group--label-text-padding-end\\]{padding-inline-end:var(--bq-option-group--label-text-padding-end)}.ps-\\[--bq-option-group--container-padding-start\\]{padding-inline-start:var(--bq-option-group--container-padding-start)}.ps-\\[--bq-option-group--label-padding-start\\]{padding-inline-start:var(--bq-option-group--label-padding-start)}.ps-\\[--bq-option-group--label-text-padding-start\\]{padding-inline-start:var(--bq-option-group--label-text-padding-start)}.text-\\[length\\:--bq-option-group--font-size\\]{font-size:var(--bq-option-group--font-size)}.leading-\\[--bq-option-group--line-height\\]{line-height:var(--bq-option-group--line-height)}.p-b-\\[--bq-option-group--label-paddingY\\]{padding-block:var(--bq-option-group--label-paddingY)}.p-i-\\[--bq-option-group--label-paddingY\\]{padding-inline:var(--bq-option-group--label-paddingY)}@-webkit-keyframes fade-in{0%{opacity:0}}@keyframes fade-in{0%{opacity:0}}@-webkit-keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}:host{--bq-option-group--background:var(--bq-ui--primary);--bq-option-group--font-size:var(--bq-font-size--s);--bq-option-group--line-height:var(--bq-font-line-height--regular);--bq-option-group--label-padding-start:var(--bq-spacing-s);--bq-option-group--label-padding-end:var(--bq-spacing-s);--bq-option-group--label-paddingY:var(--bq-spacing-xs);--bq-option-group--label-text-padding-start:var(--bq-spacing-s);--bq-option-group--label-text-padding-end:var(--bq-spacing-s);--bq-option-group--container-padding-start:var(--bq-spacing-xxl);display:block}.bq-option-group{background-color:var(--bq-option-group--background);display:flex;font-size:var(--bq-option-group--font-size);line-height:var(--bq-option-group--line-height);overflow:hidden;padding-block:var(--bq-option-group--label-paddingY);padding-inline-end:var(--bq-option-group--label-padding-end);padding-inline-start:var(--bq-option-group--label-padding-start);padding-inline:var(--bq-option-group--label-paddingY);text-overflow:ellipsis}.bq-option-group__child{align-items:center;display:flex}.bq-option-group__label{padding-inline-end:var(--bq-option-group--label-text-padding-end);padding-inline-start:var(--bq-option-group--label-text-padding-start)}.bq-option-group__container ::slotted(bq-option){padding-inline-start:var(--bq-option-group--container-padding-start)}.static{position:static}.inline-block{display:inline-block}.flex-col{flex-direction:column}.gap-\\[--bq-option-group--gapY-list\\]{gap:var(--bq-option-group--gapY-list)}.text-ellipsis{text-overflow:ellipsis}.whitespace-nowrap{white-space:nowrap}.bg-ui-primary{background-color:var(--bq-ui--primary)}.is-auto{inline-size:auto}.m-be-\\[--bq-option-group--gapY-list\\]{margin-block-end:var(--bq-option-group--gapY-list)}`;const n=class{constructor(r){a(this,r)}get el(){return r(this)}render(){return b("div",{key:"9d22c7277e0241abffbf980c45bc1ce799b91229",class:"bg-ui-primary"},b("legend",{key:"ee461058a73f38ec92aab04dedbd08fb8c8d2ff0",class:"bq-option-group m-be-[--bq-option-group--gapY-list]",part:"label"},b("span",{key:"9a12125b0655be47a3463d103aa2920bd534ad6e",class:"option-group__prefix flex items-center",part:"prefix"},b("slot",{key:"405da21722c959a185f962ce2a747655336f0e5a",name:"header-prefix"})),b("span",{key:"c4d1cefe05b2af976f4a6fced9a96b42246f8c53",class:"bq-option-group__label is-auto inline-block overflow-hidden text-ellipsis whitespace-nowrap",part:"label"},b("slot",{key:"eebacd38b7a492ce156f40f405335b533204c62f",name:"header-label"})),b("span",{key:"1fc6f0c822993f57966d4cff6f246db267a1627a",class:"bq-option-group__suffix",part:"suffix"},b("slot",{key:"1e2b96a4b83ce30f8408546b34c2e186e4e01e74",name:"header-suffix"}))),b("div",{key:"f6d2887b59eb7ec4e91424345733819a960a581c","aria-label":"Options",class:"bq-option-group__container flex flex-col gap-[--bq-option-group--gapY-list]",part:"group",role:"group"},b("slot",{key:"054159cf1cad2e52afb24719643bfa4b1b078d28"})))}};n.style=e();export{n as bq_option_group};
|
|
6
|
-
//# sourceMappingURL=p-
|
|
5
|
+
import{r as a,a as r,h as b}from"./p-BSSRzVAz.js";const e=()=>`.transform{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}::backdrop,:root{--bq-blue-100:#e7f0fd;--bq-blue-200:#d0e2fb;--bq-blue-300:#a1c5f7;--bq-blue-400:#73a8f3;--bq-blue-500:#448bef;--bq-blue-600:#156eeb;--bq-blue-700:#1158bc;--bq-blue-800:#0d428d;--bq-blue-900:#082c5e;--bq-blue-1000:#04162f;--bq-corai-100:#fff2f2;--bq-corai-200:#ffe6e6;--bq-corai-300:#ffccce;--bq-corai-400:#ffb3b5;--bq-corai-500:#ff999d;--bq-corai-600:#ff8084;--bq-corai-700:#cc666a;--bq-corai-800:#994d4f;--bq-corai-900:#663335;--bq-corai-1000:#331a1a;--bq-cyan-100:#e8f7fb;--bq-cyan-200:#d2f0f8;--bq-cyan-300:#a5e1f1;--bq-cyan-400:#78d1e9;--bq-cyan-500:#4bc2e2;--bq-cyan-600:#1eb3db;--bq-cyan-700:#188faf;--bq-cyan-800:#126b83;--bq-cyan-900:#0c4858;--bq-cyan-1000:#06242c;--bq-gold-100:#fbf4ec;--bq-gold-200:#f7e9da;--bq-gold-300:#f0d3b6;--bq-gold-400:#e8bc91;--bq-gold-500:#e1a66d;--bq-gold-600:#d99048;--bq-gold-700:#ae733a;--bq-gold-800:#82562b;--bq-gold-900:#573a1d;--bq-gold-1000:#2b1d0e;--bq-green-100:#e8f8ef;--bq-green-200:#d2f1e0;--bq-green-300:#a5e3c1;--bq-green-400:#78d5a1;--bq-green-500:#4bc782;--bq-green-600:#1eb963;--bq-green-700:#18944f;--bq-green-800:#126f3b;--bq-green-900:#0c4a28;--bq-green-1000:#062514;--bq-grey-100:#f1f2f4;--bq-grey-200:#e7e8eb;--bq-grey-300:#caccd2;--bq-grey-400:#a6aab3;--bq-grey-50:#f6f6f8;--bq-grey-500:#898e99;--bq-grey-600:#646a77;--bq-grey-700:#3f4350;--bq-grey-800:#2a2c35;--bq-grey-900:#1c1d23;--bq-grey-950:#15161a;--bq-grey-1000:#0d0e11;--bq-indigo-100:#edecfc;--bq-indigo-200:#dcdafa;--bq-indigo-300:#b9b5f5;--bq-indigo-400:#9590ef;--bq-indigo-500:#726bea;--bq-indigo-600:#4f46e5;--bq-indigo-700:#3f38b7;--bq-indigo-800:#2f2a89;--bq-indigo-900:#201c5c;--bq-indigo-1000:#100e2e;--bq-iris-100:#e9f0ff;--bq-iris-200:#d6e0ff;--bq-iris-300:#b2c0fe;--bq-iris-400:#8691f8;--bq-iris-500:#6061ee;--bq-iris-600:#4f46e5;--bq-iris-700:#413abd;--bq-iris-800:#332e95;--bq-iris-900:#26216d;--bq-iris-1000:#181545;--bq-lime-100:#f5fae8;--bq-lime-200:#ecf6d2;--bq-lime-300:#d9eda5;--bq-lime-400:#c5e379;--bq-lime-500:#b2da4c;--bq-lime-600:#9fd11f;--bq-lime-700:#7fa719;--bq-lime-800:#5f7d13;--bq-lime-900:#40540c;--bq-lime-1000:#202a06;--bq-magenta-100:#fce7f4;--bq-magenta-200:#f9cfea;--bq-magenta-300:#f39fd6;--bq-magenta-400:#ee6fbf;--bq-magenta-500:#e83fab;--bq-magenta-600:#de1395;--bq-magenta-700:#b20f77;--bq-magenta-800:#850c59;--bq-magenta-900:#58083c;--bq-magenta-1000:#2c041e;--bq-neutral-white:#fbfbfc;--bq-neutral-black:#060708;--bq-orange-100:#fbf0e9;--bq-orange-200:#f8e1d4;--bq-orange-300:#f1c2a8;--bq-orange-400:#eaa47d;--bq-orange-500:#e38551;--bq-orange-600:#dc6726;--bq-orange-700:#b0521e;--bq-orange-800:#843e17;--bq-orange-900:#58290f;--bq-orange-1000:#2c1508;--bq-purple-100:#efebf8;--bq-purple-200:#e0d7f2;--bq-purple-300:#c1afe5;--bq-purple-400:#a388d8;--bq-purple-500:#8460cb;--bq-purple-600:#6538be;--bq-purple-700:#512d98;--bq-purple-800:#3d2272;--bq-purple-900:#28164c;--bq-purple-1000:#140b26;--bq-red-100:#fce7ea;--bq-red-200:#f9d1d5;--bq-red-300:#f3a2ac;--bq-red-400:#ed7482;--bq-red-500:#e74559;--bq-red-600:#e1172f;--bq-red-700:#b41226;--bq-red-800:#870e1c;--bq-red-900:#5a0913;--bq-red-1000:#2d0509;--bq-sky-100:#eff4fb;--bq-sky-200:#dfeaf8;--bq-sky-300:#bfd5f1;--bq-sky-400:#9ec1e9;--bq-sky-500:#7eace2;--bq-sky-600:#5e97db;--bq-sky-700:#4b79af;--bq-sky-800:#385b83;--bq-sky-900:#263c58;--bq-sky-1000:#131e2c;--bq-teal-100:#e5f7f5;--bq-teal-200:#ccf0eb;--bq-teal-300:#99e1d8;--bq-teal-400:#66d2c4;--bq-teal-500:#33c3b1;--bq-teal-600:#00b49d;--bq-teal-700:#00907e;--bq-teal-800:#006c5e;--bq-teal-900:#00483f;--bq-teal-1000:#00241f;--bq-volcano-100:#feede7;--bq-volcano-200:#fddbd1;--bq-volcano-300:#fbb8a3;--bq-volcano-400:#fa9474;--bq-volcano-500:#f87146;--bq-volcano-600:#f64d18;--bq-volcano-700:#c53e13;--bq-volcano-800:#942e0e;--bq-volcano-900:#621f0a;--bq-volcano-1000:#310f05;--bq-yellow-100:#fefbe7;--bq-yellow-200:#fcf6d0;--bq-yellow-300:#faeea0;--bq-yellow-400:#f7e571;--bq-yellow-500:#f5dd41;--bq-yellow-600:#f2d412;--bq-yellow-700:#c2aa0e;--bq-yellow-800:#917f0b;--bq-yellow-900:#615507;--bq-yellow-1000:#302a04;--bq-endava-grey-50:#f7f7f8;--bq-endava-grey-100:#e4e6e7;--bq-endava-grey-200:#b5babe;--bq-endava-grey-300:#949ca1;--bq-endava-grey-400:#737d84;--bq-endava-grey-500:#525f67;--bq-endava-grey-600:#30404b;--bq-endava-grey-700:#2b3942;--bq-endava-grey-800:#263139;--bq-endava-grey-900:#192b37;--bq-endava-grey-950:#151b1e;--bq-endava-grey-1000:#0f1316;--bq-endava-neutral-white:#fafbfb;--bq-endava-neutral-black:#060708;--bq-endava-orange-100:#fef3f1;--bq-endava-orange-200:#fbd6d1;--bq-endava-orange-300:#fab7af;--bq-endava-orange-400:#fa988b;--bq-endava-orange-500:#fc7866;--bq-endava-orange-600:#ff5640;--bq-endava-orange-700:#ce4a39;--bq-endava-orange-800:#a03d30;--bq-endava-orange-900:#722e25;--bq-endava-orange-1000:#471e19}*,:after,:before{box-sizing:border-box}*{font:inherit;margin:0}ol[role=list],ul[role=list]{list-style-type:none}html{text-size-adjust:none;font-family:var(--bq-font-family);font-size:var(--bq-font-size--m)}html:focus-within{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bq-background--primary);color:var(--bq-text--primary);line-height:var(--bq-font-line-height--regular);min-height:100vb;text-rendering:optimizeSpeed}a:not([class]){text-decoration-skip-ink:auto}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto;transition-duration:.01ms!important}}:where(:root){--bq-white:#fff;--bq-black:#060708;--bq-neutral-50:var(--bq-grey-50);--bq-neutral-100:var(--bq-grey-100);--bq-neutral-200:var(--bq-grey-200);--bq-neutral-300:var(--bq-grey-300);--bq-neutral-400:var(--bq-grey-400);--bq-neutral-500:var(--bq-grey-500);--bq-neutral-600:var(--bq-grey-600);--bq-neutral-700:var(--bq-grey-700);--bq-neutral-800:var(--bq-grey-800);--bq-neutral-900:var(--bq-grey-900);--bq-neutral-950:var(--bq-grey-950);--bq-neutral-1000:var(--bq-grey-1000);--bq-brand-light:var(--bq-iris-100);--bq-brand:var(--bq-iris-600);--bq-brand-dark:var(--bq-iris-1000);--bq-accent-light:var(--bq-purple-100);--bq-accent:var(--bq-purple-600);--bq-accent-dark:var(--bq-purple-1000);--bq-success-light:var(--bq-teal-100);--bq-success:var(--bq-teal-600);--bq-success-dark:var(--bq-teal-1000);--bq-danger-light:var(--bq-red-100);--bq-danger:var(--bq-red-600);--bq-danger-dark:var(--bq-red-1000);--bq-warning-light:var(--bq-gold-100);--bq-warning:var(--bq-gold-600);--bq-warning-dark:var(--bq-gold-1000);--bq-info-light:var(--bq-iris-100);--bq-info:var(--bq-iris-600);--bq-info-dark:var(--bq-iris-1000);--bq-focus:var(--bq-iris-600);--bq-data-01:var(--bq-brand);--bq-data-02:var(--bq-purple-600);--bq-data-03:var(--bq-magenta-600);--bq-data-04:var(--bq-cyan-600);--bq-data-05:var(--bq-teal-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-yellow-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-blue-600);--bq-data-10:var(--bq-grey-600);--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white);--bq-radius--none:0;--bq-radius--xs2:0.125rem;--bq-radius--xs:0.25rem;--bq-radius--s:0.5rem;--bq-radius--m:0.75rem;--bq-radius--l:1.5rem;--bq-radius--full:9999px;--bq-box-shadow--xs:0 2px 0 rgba(0,0,0,.016);--bq-box-shadow--s:0 8px 24px rgba(0,0,0,.04);--bq-box-shadow--m:0 10px 48px -16px rgba(0,0,0,.12);--bq-box-shadow--l:0 20px 58px -16px rgba(0,0,0,.16);--bq-font-family:"Outfit",sans-serif;--bq-font-size--xs:0.75rem;--bq-font-size--s:0.875rem;--bq-font-size--m:1rem;--bq-font-size--l:1.125rem;--bq-font-size--xl:1.5rem;--bq-font-size--xxl:2rem;--bq-font-size--xxl2:2.5rem;--bq-font-size--xxl3:3rem;--bq-font-size--xxl4:3.5rem;--bq-font-size--xxl5:4rem;--bq-font-weight--thin:100;--bq-font-weight--light:300;--bq-font-weight--regular:400;--bq-font-weight--medium:500;--bq-font-weight--semibold:600;--bq-font-weight--bold:700;--bq-font-line-height--small:1.2;--bq-font-line-height--regular:1.5;--bq-font-line-height--large:1.5;--bq-spacing-xs3:0.125rem;--bq-spacing-xs2:0.25rem;--bq-spacing-xs:0.5rem;--bq-spacing-s:0.75rem;--bq-spacing-m:1rem;--bq-spacing-l:1.5rem;--bq-spacing-xl:2rem;--bq-spacing-xxl:2.5rem;--bq-spacing-xxl2:3.5rem;--bq-spacing-xxl3:4rem;--bq-spacing-xxl4:4.5rem;--bq-stroke-s:1px;--bq-stroke-m:2px;--bq-stroke-l:3px}.beeq:not([bq-mode]),.light,:root:not([bq-theme]):not([bq-mode]),:root[bq-theme=beeq]:not([bq-mode]),[bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--alt:var(--bq-white);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-light);--bq-hover:#bcbfc5;--bq-active:#444546}.dark,[bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-950);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-dark);--bq-hover:#444546;--bq-active:#1f2026}:where(.endava),:where([bq-theme=endava]){--bq-font-family:"Poppins",sans-serif;--bq-white:#fafbfb;--bq-black:#030406;--bq-neutral-50:var(--bq-endava-grey-50);--bq-neutral-100:var(--bq-endava-grey-100);--bq-neutral-200:var(--bq-endava-grey-200);--bq-neutral-300:var(--bq-endava-grey-300);--bq-neutral-400:var(--bq-endava-grey-400);--bq-neutral-500:var(--bq-endava-grey-500);--bq-neutral-600:var(--bq-endava-grey-600);--bq-neutral-700:var(--bq-endava-grey-700);--bq-neutral-800:var(--bq-endava-grey-800);--bq-neutral-900:var(--bq-endava-grey-900);--bq-neutral-950:var(--bq-endava-grey-950);--bq-neutral-1000:var(--bq-endava-grey-1000);--bq-brand-light:var(--bq-endava-orange-100);--bq-brand:var(--bq-endava-orange-600);--bq-brand-dark:var(--bq-endava-orange-1000);--bq-accent-light:var(--bq-endava-orange-100);--bq-accent:var(--bq-endava-orange-600);--bq-accent-dark:var(--bq-endava-orange-1000);--bq-success-light:var(--bq-green-100);--bq-success:var(--bq-green-600);--bq-success-dark:var(--bq-green-1000);--bq-danger-light:var(--bq-corai-100);--bq-danger:var(--bq-corai-600);--bq-danger-dark:var(--bq-corai-1000);--bq-warning-light:var(--bq-yellow-100);--bq-warning:var(--bq-yellow-600);--bq-warning-dark:var(--bq-yellow-1000);--bq-info-light:var(--bq-blue-100);--bq-info:var(--bq-blue-600);--bq-info-dark:var(--bq-blue-1000);--bq-focus:var(--bq-endava-orange-600);--bq-data-01:var(--bq-brand);--bq-data-02:#af0cd8;--bq-data-03:#0ca8d8;--bq-data-04:var(--bq-teal-600);--bq-data-05:var(--bq-yellow-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-blue-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-purple-600);--bq-data-10:#394b56;--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white)}.endava.light,.endava:not([bq-mode]),[bq-theme=endava]:not([bq-mode]),[bq-theme=endava][bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--brand-alt:var(--bq-brand-light);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--brand:var(--bq-brand);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-light);--bq-hover:#444546;--bq-active:#1f2026}.endava.dark,[bq-theme=endava][bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-900);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--brand-alt:var(--bq-brand-dark);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-neutral-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-dark);--bq-hover:#444546;--bq-active:#1f2026}.block{display:block}.flex{display:flex}.items-center{align-items:center}.overflow-hidden{overflow:hidden}.bg-\\[--bq-option-group--background\\]{background-color:var(--bq-option-group--background)}.pe-\\[--bq-option-group--label-padding-end\\]{padding-inline-end:var(--bq-option-group--label-padding-end)}.pe-\\[--bq-option-group--label-text-padding-end\\]{padding-inline-end:var(--bq-option-group--label-text-padding-end)}.ps-\\[--bq-option-group--container-padding-start\\]{padding-inline-start:var(--bq-option-group--container-padding-start)}.ps-\\[--bq-option-group--label-padding-start\\]{padding-inline-start:var(--bq-option-group--label-padding-start)}.ps-\\[--bq-option-group--label-text-padding-start\\]{padding-inline-start:var(--bq-option-group--label-text-padding-start)}.text-\\[length\\:--bq-option-group--font-size\\]{font-size:var(--bq-option-group--font-size)}.leading-\\[--bq-option-group--line-height\\]{line-height:var(--bq-option-group--line-height)}.p-b-\\[--bq-option-group--label-paddingY\\]{padding-block:var(--bq-option-group--label-paddingY)}.p-i-\\[--bq-option-group--label-paddingY\\]{padding-inline:var(--bq-option-group--label-paddingY)}@-webkit-keyframes fade-in{0%{opacity:0}}@keyframes fade-in{0%{opacity:0}}@-webkit-keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}:host{--bq-option-group--background:var(--bq-ui--primary);--bq-option-group--font-size:var(--bq-font-size--s);--bq-option-group--line-height:var(--bq-font-line-height--regular);--bq-option-group--label-padding-start:var(--bq-spacing-s);--bq-option-group--label-padding-end:var(--bq-spacing-s);--bq-option-group--label-paddingY:var(--bq-spacing-xs);--bq-option-group--label-text-padding-start:var(--bq-spacing-s);--bq-option-group--label-text-padding-end:var(--bq-spacing-s);--bq-option-group--container-padding-start:var(--bq-spacing-xxl);display:block}.bq-option-group{background-color:var(--bq-option-group--background);display:flex;font-size:var(--bq-option-group--font-size);line-height:var(--bq-option-group--line-height);overflow:hidden;padding-block:var(--bq-option-group--label-paddingY);padding-inline-end:var(--bq-option-group--label-padding-end);padding-inline-start:var(--bq-option-group--label-padding-start);padding-inline:var(--bq-option-group--label-paddingY);text-overflow:ellipsis}.bq-option-group__child{align-items:center;display:flex}.bq-option-group__label{padding-inline-end:var(--bq-option-group--label-text-padding-end);padding-inline-start:var(--bq-option-group--label-text-padding-start)}.bq-option-group__container ::slotted(bq-option){padding-inline-start:var(--bq-option-group--container-padding-start)}.static{position:static}.inline-block{display:inline-block}.flex-col{flex-direction:column}.gap-\\[--bq-option-group--gapY-list\\]{gap:var(--bq-option-group--gapY-list)}.text-ellipsis{text-overflow:ellipsis}.whitespace-nowrap{white-space:nowrap}.bg-ui-primary{background-color:var(--bq-ui--primary)}.is-auto{inline-size:auto}.m-be-\\[--bq-option-group--gapY-list\\]{margin-block-end:var(--bq-option-group--gapY-list)}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}`;const n=class{constructor(r){a(this,r)}get el(){return r(this)}render(){return b("div",{key:"9d22c7277e0241abffbf980c45bc1ce799b91229",class:"bg-ui-primary"},b("legend",{key:"ee461058a73f38ec92aab04dedbd08fb8c8d2ff0",class:"bq-option-group m-be-[--bq-option-group--gapY-list]",part:"label"},b("span",{key:"9a12125b0655be47a3463d103aa2920bd534ad6e",class:"option-group__prefix flex items-center",part:"prefix"},b("slot",{key:"405da21722c959a185f962ce2a747655336f0e5a",name:"header-prefix"})),b("span",{key:"c4d1cefe05b2af976f4a6fced9a96b42246f8c53",class:"bq-option-group__label is-auto inline-block overflow-hidden text-ellipsis whitespace-nowrap",part:"label"},b("slot",{key:"eebacd38b7a492ce156f40f405335b533204c62f",name:"header-label"})),b("span",{key:"1fc6f0c822993f57966d4cff6f246db267a1627a",class:"bq-option-group__suffix",part:"suffix"},b("slot",{key:"1e2b96a4b83ce30f8408546b34c2e186e4e01e74",name:"header-suffix"}))),b("div",{key:"f6d2887b59eb7ec4e91424345733819a960a581c","aria-label":"Options",class:"bq-option-group__container flex flex-col gap-[--bq-option-group--gapY-list]",part:"group",role:"group"},b("slot",{key:"054159cf1cad2e52afb24719643bfa4b1b078d28"})))}};n.style=e();export{n as bq_option_group};
|
|
6
|
+
//# sourceMappingURL=p-8974f66f.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["bqOptionGroupCss","BqOptionGroup","render","h","key","class","part","name","role"],"sources":["../../packages/beeq/src/components/option-group/scss/bq-option-group.scss?tag=bq-option-group&encapsulation=shadow","../../packages/beeq/src/components/option-group/bq-option-group.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/* Option group styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-option-group.variables';\n\n:host {\n @apply block;\n}\n\n.bq-option-group {\n @apply flex overflow-hidden overflow-ellipsis;\n @apply bg-[--bq-option-group--background] text-[length:--bq-option-group--font-size] leading-[--bq-option-group--line-height];\n @apply pe-[--bq-option-group--label-padding-end] ps-[--bq-option-group--label-padding-start] p-b-[--bq-option-group--label-paddingY] p-i-[--bq-option-group--label-paddingY];\n\n &__child {\n @apply flex items-center;\n }\n}\n\n.bq-option-group__label {\n @apply pe-[--bq-option-group--label-text-padding-end] ps-[--bq-option-group--label-text-padding-start];\n}\n\n.bq-option-group__container ::slotted(bq-option) {\n @apply ps-[--bq-option-group--container-padding-start];\n}\n","import { Component, Element, h } from '@stencil/core';\n\n/**\n * The option group component is a container for multiple option elements.\n * It allows to manage the appearance and size of all options at once.\n *\n * @example How to use it\n * ```html\n * <bq-option-group class=\"hydrated\">\n * <span slot=\"header-label\">Sport</span>\n * <bq-option value=\"football\">Football</bq-option>\n * <bq-option value=\"basketball\">Basketball</bq-option>\n * <bq-option value=\"tennis\">Tennis</bq-option>\n * </bq-option-group>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/3b1b7b-option-group\n * @status stable\n *\n * @slot header-label - The label of the option group\n * @slot header-prefix - The prefix of the label\n * @slot header-suffix - The suffix of the label\n * @slot - The option items\n *\n * @part label - The `legend` tag element which acts as a container for the label\n * @part prefix - The prefix of the label\n * @part label - The text of the label\n * @part suffix - The suffix of the label\n * @part group - The `div` element which holds the option items\n *\n * @cssprop --bq-option-group--background - option group background color\n * @cssprop --bq-option-group--font-size - option group font size\n * @cssprop --bq-option-group--line-height - option group line height\n * @cssprop --bq-option-group--label-padding-start - option group header padding start\n * @cssprop --bq-option-group--label-padding-end - option group header padding start\n * @cssprop --bq-option-group--label-paddingY - option group header padding Y axis\n * @cssprop --bq-option-group--label-text-padding-start - option group text within label padding start\n * @cssprop --bq-option-group--label-text-padding-end - option group text within label padding start\n * @cssprop --bq-option-group--container-padding-start - option group container padding start\n */\n@Component({\n tag: 'bq-option-group',\n styleUrl: './scss/bq-option-group.scss',\n shadow: true,\n})\nexport class BqOptionGroup {\n // Own Properties\n // ====================\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n // Public Property API\n // ========================\n\n // Prop lifecycle events\n // =======================\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n // Listeners\n // ==============\n\n // Public methods API\n // These methods are exposed on the host element.\n // Always use two lines.\n // Public Methods must be async.\n // Requires JSDocs for public API documentation.\n // ===============================================\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <div class=\"bg-ui-primary\">\n <legend class=\"bq-option-group m-be-[--bq-option-group--gapY-list]\" part=\"label\">\n <span class=\"option-group__prefix flex items-center\" part=\"prefix\">\n <slot name=\"header-prefix\" />\n </span>\n <span\n class=\"bq-option-group__label is-auto inline-block overflow-hidden text-ellipsis whitespace-nowrap\"\n part=\"label\"\n >\n <slot name=\"header-label\" />\n </span>\n <span class=\"bq-option-group__suffix\" part=\"suffix\">\n <slot name=\"header-suffix\" />\n </span>\n </legend>\n <div\n aria-label=\"Options\"\n class=\"bq-option-group__container flex flex-col gap-[--bq-option-group--gapY-list]\"\n part=\"group\"\n role=\"group\"\n >\n <slot />\n </div>\n </div>\n );\n }\n}\n"],"mappings":";;;;kDAAA,MAAMA,EAAmB,IAAM,
|
|
1
|
+
{"version":3,"names":["bqOptionGroupCss","BqOptionGroup","render","h","key","class","part","name","role"],"sources":["../../packages/beeq/src/components/option-group/scss/bq-option-group.scss?tag=bq-option-group&encapsulation=shadow","../../packages/beeq/src/components/option-group/bq-option-group.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/* Option group styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-option-group.variables';\n\n:host {\n @apply block;\n}\n\n.bq-option-group {\n @apply flex overflow-hidden overflow-ellipsis;\n @apply bg-[--bq-option-group--background] text-[length:--bq-option-group--font-size] leading-[--bq-option-group--line-height];\n @apply pe-[--bq-option-group--label-padding-end] ps-[--bq-option-group--label-padding-start] p-b-[--bq-option-group--label-paddingY] p-i-[--bq-option-group--label-paddingY];\n\n &__child {\n @apply flex items-center;\n }\n}\n\n.bq-option-group__label {\n @apply pe-[--bq-option-group--label-text-padding-end] ps-[--bq-option-group--label-text-padding-start];\n}\n\n.bq-option-group__container ::slotted(bq-option) {\n @apply ps-[--bq-option-group--container-padding-start];\n}\n","import { Component, Element, h } from '@stencil/core';\n\n/**\n * The option group component is a container for multiple option elements.\n * It allows to manage the appearance and size of all options at once.\n *\n * @example How to use it\n * ```html\n * <bq-option-group class=\"hydrated\">\n * <span slot=\"header-label\">Sport</span>\n * <bq-option value=\"football\">Football</bq-option>\n * <bq-option value=\"basketball\">Basketball</bq-option>\n * <bq-option value=\"tennis\">Tennis</bq-option>\n * </bq-option-group>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/3b1b7b-option-group\n * @status stable\n *\n * @slot header-label - The label of the option group\n * @slot header-prefix - The prefix of the label\n * @slot header-suffix - The suffix of the label\n * @slot - The option items\n *\n * @part label - The `legend` tag element which acts as a container for the label\n * @part prefix - The prefix of the label\n * @part label - The text of the label\n * @part suffix - The suffix of the label\n * @part group - The `div` element which holds the option items\n *\n * @cssprop --bq-option-group--background - option group background color\n * @cssprop --bq-option-group--font-size - option group font size\n * @cssprop --bq-option-group--line-height - option group line height\n * @cssprop --bq-option-group--label-padding-start - option group header padding start\n * @cssprop --bq-option-group--label-padding-end - option group header padding start\n * @cssprop --bq-option-group--label-paddingY - option group header padding Y axis\n * @cssprop --bq-option-group--label-text-padding-start - option group text within label padding start\n * @cssprop --bq-option-group--label-text-padding-end - option group text within label padding start\n * @cssprop --bq-option-group--container-padding-start - option group container padding start\n */\n@Component({\n tag: 'bq-option-group',\n styleUrl: './scss/bq-option-group.scss',\n shadow: true,\n})\nexport class BqOptionGroup {\n // Own Properties\n // ====================\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n // Public Property API\n // ========================\n\n // Prop lifecycle events\n // =======================\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n // Listeners\n // ==============\n\n // Public methods API\n // These methods are exposed on the host element.\n // Always use two lines.\n // Public Methods must be async.\n // Requires JSDocs for public API documentation.\n // ===============================================\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <div class=\"bg-ui-primary\">\n <legend class=\"bq-option-group m-be-[--bq-option-group--gapY-list]\" part=\"label\">\n <span class=\"option-group__prefix flex items-center\" part=\"prefix\">\n <slot name=\"header-prefix\" />\n </span>\n <span\n class=\"bq-option-group__label is-auto inline-block overflow-hidden text-ellipsis whitespace-nowrap\"\n part=\"label\"\n >\n <slot name=\"header-label\" />\n </span>\n <span class=\"bq-option-group__suffix\" part=\"suffix\">\n <slot name=\"header-suffix\" />\n </span>\n </legend>\n <div\n aria-label=\"Options\"\n class=\"bq-option-group__container flex flex-col gap-[--bq-option-group--gapY-list]\"\n part=\"group\"\n role=\"group\"\n >\n <slot />\n </div>\n </div>\n );\n }\n}\n"],"mappings":";;;;kDAAA,MAAMA,EAAmB,IAAM,27rB,MC6ClBC,EAAa,M,iDA8CxB,MAAAC,GACE,OACEC,EAAA,OAAAC,IAAA,2CAAKC,MAAM,iBACTF,EAAA,UAAAC,IAAA,2CAAQC,MAAM,sDAAsDC,KAAK,SACvEH,EAAA,QAAAC,IAAA,2CAAMC,MAAM,yCAAyCC,KAAK,UACxDH,EAAA,QAAAC,IAAA,2CAAMG,KAAK,mBAEbJ,EAAA,QAAAC,IAAA,2CACEC,MAAM,8FACNC,KAAK,SAELH,EAAA,QAAAC,IAAA,2CAAMG,KAAK,kBAEbJ,EAAA,QAAAC,IAAA,2CAAMC,MAAM,0BAA0BC,KAAK,UACzCH,EAAA,QAAAC,IAAA,2CAAMG,KAAK,oBAGfJ,EAAA,OAAAC,IAAA,wDACa,UACXC,MAAM,8EACNC,KAAK,QACLE,KAAK,SAELL,EAAA,QAAAC,IAAA,8C","ignoreList":[]}
|
|
@@ -2,5 +2,5 @@
|
|
|
2
2
|
* Built by Endavans
|
|
3
3
|
* © https://beeq.design - Apache 2 License.
|
|
4
4
|
*/
|
|
5
|
-
import{r as a,c as r,a as e,h as b,d as n}from"./p-CO2T68hs.js";import{i as t}from"./p-BcPwGxIn.js";import{v as q}from"./p-zh4P02Kn.js";import{b as i}from"./p-uqkxeAeG.js";import{l as o,e as s}from"./p-DdvbF5yL.js";const d=["start","end"];const l=["left","right"];const c=()=>`.transform{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.bq-drawer,.shadow-m{--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}::backdrop,:root{--bq-blue-100:#e7f0fd;--bq-blue-200:#d0e2fb;--bq-blue-300:#a1c5f7;--bq-blue-400:#73a8f3;--bq-blue-500:#448bef;--bq-blue-600:#156eeb;--bq-blue-700:#1158bc;--bq-blue-800:#0d428d;--bq-blue-900:#082c5e;--bq-blue-1000:#04162f;--bq-corai-100:#fff2f2;--bq-corai-200:#ffe6e6;--bq-corai-300:#ffccce;--bq-corai-400:#ffb3b5;--bq-corai-500:#ff999d;--bq-corai-600:#ff8084;--bq-corai-700:#cc666a;--bq-corai-800:#994d4f;--bq-corai-900:#663335;--bq-corai-1000:#331a1a;--bq-cyan-100:#e8f7fb;--bq-cyan-200:#d2f0f8;--bq-cyan-300:#a5e1f1;--bq-cyan-400:#78d1e9;--bq-cyan-500:#4bc2e2;--bq-cyan-600:#1eb3db;--bq-cyan-700:#188faf;--bq-cyan-800:#126b83;--bq-cyan-900:#0c4858;--bq-cyan-1000:#06242c;--bq-gold-100:#fbf4ec;--bq-gold-200:#f7e9da;--bq-gold-300:#f0d3b6;--bq-gold-400:#e8bc91;--bq-gold-500:#e1a66d;--bq-gold-600:#d99048;--bq-gold-700:#ae733a;--bq-gold-800:#82562b;--bq-gold-900:#573a1d;--bq-gold-1000:#2b1d0e;--bq-green-100:#e8f8ef;--bq-green-200:#d2f1e0;--bq-green-300:#a5e3c1;--bq-green-400:#78d5a1;--bq-green-500:#4bc782;--bq-green-600:#1eb963;--bq-green-700:#18944f;--bq-green-800:#126f3b;--bq-green-900:#0c4a28;--bq-green-1000:#062514;--bq-grey-100:#f1f2f4;--bq-grey-200:#e7e8eb;--bq-grey-300:#caccd2;--bq-grey-400:#a6aab3;--bq-grey-50:#f6f6f8;--bq-grey-500:#898e99;--bq-grey-600:#646a77;--bq-grey-700:#3f4350;--bq-grey-800:#2a2c35;--bq-grey-900:#1c1d23;--bq-grey-950:#15161a;--bq-grey-1000:#0d0e11;--bq-indigo-100:#edecfc;--bq-indigo-200:#dcdafa;--bq-indigo-300:#b9b5f5;--bq-indigo-400:#9590ef;--bq-indigo-500:#726bea;--bq-indigo-600:#4f46e5;--bq-indigo-700:#3f38b7;--bq-indigo-800:#2f2a89;--bq-indigo-900:#201c5c;--bq-indigo-1000:#100e2e;--bq-iris-100:#e9f0ff;--bq-iris-200:#d6e0ff;--bq-iris-300:#b2c0fe;--bq-iris-400:#8691f8;--bq-iris-500:#6061ee;--bq-iris-600:#4f46e5;--bq-iris-700:#413abd;--bq-iris-800:#332e95;--bq-iris-900:#26216d;--bq-iris-1000:#181545;--bq-lime-100:#f5fae8;--bq-lime-200:#ecf6d2;--bq-lime-300:#d9eda5;--bq-lime-400:#c5e379;--bq-lime-500:#b2da4c;--bq-lime-600:#9fd11f;--bq-lime-700:#7fa719;--bq-lime-800:#5f7d13;--bq-lime-900:#40540c;--bq-lime-1000:#202a06;--bq-magenta-100:#fce7f4;--bq-magenta-200:#f9cfea;--bq-magenta-300:#f39fd6;--bq-magenta-400:#ee6fbf;--bq-magenta-500:#e83fab;--bq-magenta-600:#de1395;--bq-magenta-700:#b20f77;--bq-magenta-800:#850c59;--bq-magenta-900:#58083c;--bq-magenta-1000:#2c041e;--bq-neutral-white:#fbfbfc;--bq-neutral-black:#060708;--bq-orange-100:#fbf0e9;--bq-orange-200:#f8e1d4;--bq-orange-300:#f1c2a8;--bq-orange-400:#eaa47d;--bq-orange-500:#e38551;--bq-orange-600:#dc6726;--bq-orange-700:#b0521e;--bq-orange-800:#843e17;--bq-orange-900:#58290f;--bq-orange-1000:#2c1508;--bq-purple-100:#efebf8;--bq-purple-200:#e0d7f2;--bq-purple-300:#c1afe5;--bq-purple-400:#a388d8;--bq-purple-500:#8460cb;--bq-purple-600:#6538be;--bq-purple-700:#512d98;--bq-purple-800:#3d2272;--bq-purple-900:#28164c;--bq-purple-1000:#140b26;--bq-red-100:#fce7ea;--bq-red-200:#f9d1d5;--bq-red-300:#f3a2ac;--bq-red-400:#ed7482;--bq-red-500:#e74559;--bq-red-600:#e1172f;--bq-red-700:#b41226;--bq-red-800:#870e1c;--bq-red-900:#5a0913;--bq-red-1000:#2d0509;--bq-sky-100:#eff4fb;--bq-sky-200:#dfeaf8;--bq-sky-300:#bfd5f1;--bq-sky-400:#9ec1e9;--bq-sky-500:#7eace2;--bq-sky-600:#5e97db;--bq-sky-700:#4b79af;--bq-sky-800:#385b83;--bq-sky-900:#263c58;--bq-sky-1000:#131e2c;--bq-teal-100:#e5f7f5;--bq-teal-200:#ccf0eb;--bq-teal-300:#99e1d8;--bq-teal-400:#66d2c4;--bq-teal-500:#33c3b1;--bq-teal-600:#00b49d;--bq-teal-700:#00907e;--bq-teal-800:#006c5e;--bq-teal-900:#00483f;--bq-teal-1000:#00241f;--bq-volcano-100:#feede7;--bq-volcano-200:#fddbd1;--bq-volcano-300:#fbb8a3;--bq-volcano-400:#fa9474;--bq-volcano-500:#f87146;--bq-volcano-600:#f64d18;--bq-volcano-700:#c53e13;--bq-volcano-800:#942e0e;--bq-volcano-900:#621f0a;--bq-volcano-1000:#310f05;--bq-yellow-100:#fefbe7;--bq-yellow-200:#fcf6d0;--bq-yellow-300:#faeea0;--bq-yellow-400:#f7e571;--bq-yellow-500:#f5dd41;--bq-yellow-600:#f2d412;--bq-yellow-700:#c2aa0e;--bq-yellow-800:#917f0b;--bq-yellow-900:#615507;--bq-yellow-1000:#302a04;--bq-endava-grey-50:#f7f7f8;--bq-endava-grey-100:#e4e6e7;--bq-endava-grey-200:#b5babe;--bq-endava-grey-300:#949ca1;--bq-endava-grey-400:#737d84;--bq-endava-grey-500:#525f67;--bq-endava-grey-600:#30404b;--bq-endava-grey-700:#2b3942;--bq-endava-grey-800:#263139;--bq-endava-grey-900:#192b37;--bq-endava-grey-950:#151b1e;--bq-endava-grey-1000:#0f1316;--bq-endava-neutral-white:#fafbfb;--bq-endava-neutral-black:#060708;--bq-endava-orange-100:#fef3f1;--bq-endava-orange-200:#fbd6d1;--bq-endava-orange-300:#fab7af;--bq-endava-orange-400:#fa988b;--bq-endava-orange-500:#fc7866;--bq-endava-orange-600:#ff5640;--bq-endava-orange-700:#ce4a39;--bq-endava-orange-800:#a03d30;--bq-endava-orange-900:#722e25;--bq-endava-orange-1000:#471e19}*,:after,:before{box-sizing:border-box}*{font:inherit;margin:0}ol[role=list],ul[role=list]{list-style-type:none}html{text-size-adjust:none;font-family:var(--bq-font-family);font-size:var(--bq-font-size--m)}html:focus-within{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bq-background--primary);color:var(--bq-text--primary);line-height:var(--bq-font-line-height--regular);min-height:100vb;text-rendering:optimizeSpeed}a:not([class]){text-decoration-skip-ink:auto}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto;transition-duration:.01ms!important}}:where(:root){--bq-white:#fff;--bq-black:#060708;--bq-neutral-50:var(--bq-grey-50);--bq-neutral-100:var(--bq-grey-100);--bq-neutral-200:var(--bq-grey-200);--bq-neutral-300:var(--bq-grey-300);--bq-neutral-400:var(--bq-grey-400);--bq-neutral-500:var(--bq-grey-500);--bq-neutral-600:var(--bq-grey-600);--bq-neutral-700:var(--bq-grey-700);--bq-neutral-800:var(--bq-grey-800);--bq-neutral-900:var(--bq-grey-900);--bq-neutral-950:var(--bq-grey-950);--bq-neutral-1000:var(--bq-grey-1000);--bq-brand-light:var(--bq-iris-100);--bq-brand:var(--bq-iris-600);--bq-brand-dark:var(--bq-iris-1000);--bq-accent-light:var(--bq-purple-100);--bq-accent:var(--bq-purple-600);--bq-accent-dark:var(--bq-purple-1000);--bq-success-light:var(--bq-teal-100);--bq-success:var(--bq-teal-600);--bq-success-dark:var(--bq-teal-1000);--bq-danger-light:var(--bq-red-100);--bq-danger:var(--bq-red-600);--bq-danger-dark:var(--bq-red-1000);--bq-warning-light:var(--bq-gold-100);--bq-warning:var(--bq-gold-600);--bq-warning-dark:var(--bq-gold-1000);--bq-info-light:var(--bq-iris-100);--bq-info:var(--bq-iris-600);--bq-info-dark:var(--bq-iris-1000);--bq-focus:var(--bq-iris-600);--bq-data-01:var(--bq-brand);--bq-data-02:var(--bq-purple-600);--bq-data-03:var(--bq-magenta-600);--bq-data-04:var(--bq-cyan-600);--bq-data-05:var(--bq-teal-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-yellow-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-blue-600);--bq-data-10:var(--bq-grey-600);--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white);--bq-radius--none:0;--bq-radius--xs2:0.125rem;--bq-radius--xs:0.25rem;--bq-radius--s:0.5rem;--bq-radius--m:0.75rem;--bq-radius--l:1.5rem;--bq-radius--full:9999px;--bq-box-shadow--xs:0 2px 0 rgba(0,0,0,.016);--bq-box-shadow--s:0 8px 24px rgba(0,0,0,.04);--bq-box-shadow--m:0 10px 48px -16px rgba(0,0,0,.12);--bq-box-shadow--l:0 20px 58px -16px rgba(0,0,0,.16);--bq-font-family:"Outfit",sans-serif;--bq-font-size--xs:0.75rem;--bq-font-size--s:0.875rem;--bq-font-size--m:1rem;--bq-font-size--l:1.125rem;--bq-font-size--xl:1.5rem;--bq-font-size--xxl:2rem;--bq-font-size--xxl2:2.5rem;--bq-font-size--xxl3:3rem;--bq-font-size--xxl4:3.5rem;--bq-font-size--xxl5:4rem;--bq-font-weight--thin:100;--bq-font-weight--light:300;--bq-font-weight--regular:400;--bq-font-weight--medium:500;--bq-font-weight--semibold:600;--bq-font-weight--bold:700;--bq-font-line-height--small:1.2;--bq-font-line-height--regular:1.5;--bq-font-line-height--large:1.5;--bq-spacing-xs3:0.125rem;--bq-spacing-xs2:0.25rem;--bq-spacing-xs:0.5rem;--bq-spacing-s:0.75rem;--bq-spacing-m:1rem;--bq-spacing-l:1.5rem;--bq-spacing-xl:2rem;--bq-spacing-xxl:2.5rem;--bq-spacing-xxl2:3.5rem;--bq-spacing-xxl3:4rem;--bq-spacing-xxl4:4.5rem;--bq-stroke-s:1px;--bq-stroke-m:2px;--bq-stroke-l:3px}.beeq:not([bq-mode]),.light,:root:not([bq-theme]):not([bq-mode]),:root[bq-theme=beeq]:not([bq-mode]),[bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--alt:var(--bq-white);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-light);--bq-hover:#bcbfc5;--bq-active:#444546}.dark,[bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-950);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-dark);--bq-hover:#444546;--bq-active:#1f2026}:where(.endava),:where([bq-theme=endava]){--bq-font-family:"Poppins",sans-serif;--bq-white:#fafbfb;--bq-black:#030406;--bq-neutral-50:var(--bq-endava-grey-50);--bq-neutral-100:var(--bq-endava-grey-100);--bq-neutral-200:var(--bq-endava-grey-200);--bq-neutral-300:var(--bq-endava-grey-300);--bq-neutral-400:var(--bq-endava-grey-400);--bq-neutral-500:var(--bq-endava-grey-500);--bq-neutral-600:var(--bq-endava-grey-600);--bq-neutral-700:var(--bq-endava-grey-700);--bq-neutral-800:var(--bq-endava-grey-800);--bq-neutral-900:var(--bq-endava-grey-900);--bq-neutral-950:var(--bq-endava-grey-950);--bq-neutral-1000:var(--bq-endava-grey-1000);--bq-brand-light:var(--bq-endava-orange-100);--bq-brand:var(--bq-endava-orange-600);--bq-brand-dark:var(--bq-endava-orange-1000);--bq-accent-light:var(--bq-endava-orange-100);--bq-accent:var(--bq-endava-orange-600);--bq-accent-dark:var(--bq-endava-orange-1000);--bq-success-light:var(--bq-green-100);--bq-success:var(--bq-green-600);--bq-success-dark:var(--bq-green-1000);--bq-danger-light:var(--bq-corai-100);--bq-danger:var(--bq-corai-600);--bq-danger-dark:var(--bq-corai-1000);--bq-warning-light:var(--bq-yellow-100);--bq-warning:var(--bq-yellow-600);--bq-warning-dark:var(--bq-yellow-1000);--bq-info-light:var(--bq-blue-100);--bq-info:var(--bq-blue-600);--bq-info-dark:var(--bq-blue-1000);--bq-focus:var(--bq-endava-orange-600);--bq-data-01:var(--bq-brand);--bq-data-02:#af0cd8;--bq-data-03:#0ca8d8;--bq-data-04:var(--bq-teal-600);--bq-data-05:var(--bq-yellow-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-blue-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-purple-600);--bq-data-10:#394b56;--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white)}.endava.light,.endava:not([bq-mode]),[bq-theme=endava]:not([bq-mode]),[bq-theme=endava][bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--brand-alt:var(--bq-brand-light);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--brand:var(--bq-brand);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-light);--bq-hover:#444546;--bq-active:#1f2026}.endava.dark,[bq-theme=endava][bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-900);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--brand-alt:var(--bq-brand-dark);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-neutral-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-dark);--bq-hover:#444546;--bq-active:#1f2026}.visible{visibility:visible}.invisible{visibility:hidden}.fixed{position:fixed}.z-\\[--bq-drawer--zIndex\\]{z-index:var(--bq-drawer--zIndex)}.flex{display:flex}.flex-col{flex-direction:column}.gap-\\[--bq-drawer--gap\\]{gap:var(--bq-drawer--gap)}.bg-ui-primary{background-color:var(--bq-ui--primary)}.shadow-m{--tw-shadow:var(--bq-box-shadow--m);--tw-shadow-colored:var(--bq-box-shadow--m);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.is-\\[--bq-drawer--width\\]{inline-size:var(--bq-drawer--width)}.max-is-full{max-inline-size:100%}.p-b-\\[--bq-drawer--paddingY\\]{padding-block:var(--bq-drawer--paddingY)}.p-i-\\[--bq-drawer--paddingX\\]{padding-inline:var(--bq-drawer--paddingX)}.inset-b-0{inset-block:0}@-webkit-keyframes fade-in{0%{opacity:0}}@keyframes fade-in{0%{opacity:0}}@-webkit-keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}:host{--bq-drawer--backgroundBackdrop:var(--bq-background--overlay);--bq-drawer--gap:var(--bq-spacing-l);--bq-drawer--width:320px;--bq-drawer--paddingX:var(--bq-spacing-l);--bq-drawer--paddingY:var(--bq-spacing-m);--bq-drawer--zIndex:10;visibility:hidden!important}:host(.bq-drawer--open){visibility:visible!important}.bq-drawer{--tw-shadow:var(--bq-box-shadow--m);--tw-shadow-colored:var(--bq-box-shadow--m);background-color:var(--bq-ui--primary);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);display:flex;flex-direction:column;gap:var(--bq-drawer--gap);inline-size:var(--bq-drawer--width);inset-block:0;max-inline-size:100%;padding-block:var(--bq-drawer--paddingY);padding-inline:var(--bq-drawer--paddingX);position:fixed;z-index:var(--bq-drawer--zIndex)}.pointer-events-none{pointer-events:none}.static{position:static}.inset-0{inset:0}.-end-\\[--bq-drawer--width\\]{inset-inline-end:calc(var(--bq-drawer--width)*-1)}.-start-\\[--bq-drawer--width\\]{inset-inline-start:calc(var(--bq-drawer--width)*-1)}.end-0{inset-inline-end:0}.start-0{inset-inline-start:0}.mb-m{margin-bottom:var(--bq-spacing-m)}.block{display:block}.\\!hidden{display:none!important}.hidden{display:none}.flex-1{flex:1 1 0%}.flex-auto{flex:1 1 auto}.items-center{align-items:center}.justify-between{justify-content:space-between}.overflow-auto{overflow:auto}.bg-\\[--bq-drawer--backgroundBackdrop\\]{background-color:var(--bq-drawer--backgroundBackdrop)}.text-xl{font-size:var(--bq-font-size--xl)}.font-bold{font-weight:var(--bq-font-weight--bold)}.leading-regular{line-height:var(--bq-font-line-height--regular)}.text-primary{color:var(--bq-text--primary)}.opacity-0{opacity:0}.opacity-60{opacity:.6}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-opacity{transition-duration:.15s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.\\[\\&\\:\\:part\\(label\\)\\]\\:inline-flex::part(label){display:inline-flex}.gap-0{gap:0}.focus{outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}.text-\\[--bq-icon--color\\]{color:var(--bq-icon--color)}.bs-\\[--bq-icon--size\\]{block-size:var(--bq-icon--size)}.is-\\[--bq-icon--size\\]{inline-size:var(--bq-icon--size)}`;const v=class{constructor(e){a(this,e);this.bqClose=r(this,"bqClose");this.bqOpen=r(this,"bqOpen");this.bqAfterOpen=r(this,"bqAfterOpen");this.bqAfterClose=r(this,"bqAfterClose")}footerElem;drawerElem;OPEN_CSS_CLASS="bq-drawer--open";get el(){return e(this)}hasFooter=false;hasIcon=false;enableBackdrop=false;closeOnClickOutside=false;closeOnEsc=false;open;placement="right";position="end";async handleOpenChange(){if(!this.open){await this.handleAfterHide();return}await this.handleAfterShow()}handlePlacementChange(){if(!t(this.placement)){console.warn(`❗️ [bq-drawer]: the 'placement' prop is deprecated and it will be removed in the future. Please use 'position' instead.`)}q(l,"right",this.el,"placement");const a={right:"end",left:"start"};this.position=a[this.placement]||this.position}handlePositionChange(){q(d,"start",this.el,"position");const a={end:"right",start:"left"};this.placement=a[this.position]||this.placement}bqClose;bqOpen;bqAfterOpen;bqAfterClose;componentWillLoad(){this.handlePositionChange();this.handlePlacementChange()}componentDidLoad(){this.handleFooterSlotChange()}async handleMouseClick(a){if(!this.open)return;if(!this.drawerElem||this.closeOnClickOutside)return;if(a.button!==0)return;const r=this.drawerElem.getBoundingClientRect();if(a.clientX<r.left||a.clientX>r.right){await this.hide()}}async handleKeyDown(a){if(!this.open)return;if(!this.drawerElem||this.closeOnEsc||!(a.key==="Escape"||a.key==="Esc"))return;await this.hide()}async hide(){const a=this.bqClose.emit();if(a.defaultPrevented)return;this.open=false}async show(){const a=this.bqOpen.emit();if(a.defaultPrevented)return;this.open=true}handleFooterSlotChange=()=>{this.hasFooter=i(this.footerElem,"footer")};handleAfterHide=async()=>{if(!this.drawerElem)return;await o(this.drawerElem);this.handleTransitionEnd()};handleAfterShow=async()=>{if(!this.drawerElem)return;this.el.classList.add(this.OPEN_CSS_CLASS);await s(this.drawerElem);this.handleTransitionEnd()};handleTransitionEnd=()=>{if(this.open){this.bqAfterOpen.emit();return}this.bqAfterClose.emit();this.el.classList.remove(this.OPEN_CSS_CLASS)};get isPositionStart(){return this.position==="start"||this.placement==="left"}get isPositionEnd(){return this.position==="end"||this.placement==="right"}render(){return b(n,{key:"efb946ee8385eb53479a2775b0374a0545d19e2d"},this.enableBackdrop&&b("div",{key:"b3afc7c855f826110f59af39118ec0677f1d878b",class:{"fixed inset-0 block bg-[--bq-drawer--backgroundBackdrop] opacity-0 transition-opacity duration-300":true,"pointer-events-none":!this.open,"opacity-60":this.open},part:"backdrop",tabIndex:-1}),b("div",{key:"c86c49c074fd1e7d59de8d8df33fe43504fcb169","aria-hidden":!this.open?"true":"false","aria-labelledby":"bq-drawer__title","aria-modal":"true",class:{[`bq-drawer transition-all duration-300 ease-in-out ${this.position||this.placement}`]:true,"-start-[--bq-drawer--width]":this.isPositionStart,"-end-[--bq-drawer--width]":this.isPositionEnd,"start-0":this.open&&this.isPositionStart,"end-0":this.open&&this.isPositionEnd},hidden:!this.open,part:"panel",ref:a=>{this.drawerElem=a},role:"dialog"},b("header",{key:"6cd1d9ce70d4cb30d6524af6dd366e989e676c62",class:"flex items-center",part:"header"},b("h2",{key:"3212557ad0649414eb332e187acd52c96efbd835",class:"flex-1 items-center justify-between font-bold text-primary text-xl leading-regular",id:"bq-drawer__title",part:"title"},b("slot",{key:"6aebb931e8cea3ede8dde98c66ebf9a275d1cb66",name:"title"})),b("div",{key:"d68cac1a5bc9d7e7d4b4c885003630baae96c46e",class:"flex",part:"button-close"},b("bq-button",{key:"2d9ece0738afc94ac2b93e315fd814e9c5112930",appearance:"text",border:"s",class:"[&::part(label)]:inline-flex",exportparts:"button:button-close__btn,label:button-close__label",label:"Close",onBqClick:()=>this.hide(),onlyIcon:true,size:"small",slot:"button-close"},b("slot",{key:"9f8cef6896ce38cacf0b2035dda22bfa92d61f10",name:"button-close"},b("bq-icon",{key:"173869695225aae3e1b17c3ad5bdf96902f85d8e","aria-hidden":"true",name:"x-bold",title:"Close"}))))),b("main",{key:"671bf595a03619ab1ace8262cf636d1b20728897",class:"block flex-auto overflow-auto",part:"body"},b("slot",{key:"e3f41064ea0b690df0da286cf22e6ce6c8c0fae5"})),b("footer",{key:"efad25f94af91333beacf50450f74e25a4719505",class:{block:true,"!hidden":!this.hasFooter},part:"footer",ref:a=>{this.footerElem=a}},b("slot",{key:"fc2440d2e8bb7ef396ec8757ef4a9a53c2f2059e",name:"footer-divider"},b("bq-divider",{key:"5f8e1a591997cb7fa07a34ce7cc3bfd087d9c2cf",class:"mb-m block",dashed:true})),b("slot",{key:"98ed77fe6ad40a1c6e9082e3f661a7d9aaa24e54",name:"footer",onSlotchange:this.handleFooterSlotChange}))))}static get watchers(){return{open:[{handleOpenChange:0}],placement:[{handlePlacementChange:0}],position:[{handlePositionChange:0}]}}};v.style=c();export{v as bq_drawer};
|
|
6
|
-
//# sourceMappingURL=p-
|
|
5
|
+
import{r as a,c as r,a as e,h as b,d as n}from"./p-BSSRzVAz.js";import{i as t}from"./p-BcPwGxIn.js";import{v as i}from"./p-DbxZ8FhA.js";import{b as q}from"./p-uqkxeAeG.js";import{l as o,e as d}from"./p-DdvbF5yL.js";const s=["start","end"];const l=["left","right"];const c=()=>`.transform{--tw-translate-x:0;--tw-translate-y:0;--tw-rotate:0;--tw-skew-x:0;--tw-skew-y:0;--tw-scale-x:1;--tw-scale-y:1;transform:translate(var(--tw-translate-x),var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y))}.bq-drawer,.shadow-m{--tw-ring-offset-shadow:0 0 #0000;--tw-ring-shadow:0 0 #0000;--tw-shadow:0 0 #0000;--tw-shadow-colored:0 0 #0000}::backdrop,:root{--bq-blue-100:#e7f0fd;--bq-blue-200:#d0e2fb;--bq-blue-300:#a1c5f7;--bq-blue-400:#73a8f3;--bq-blue-500:#448bef;--bq-blue-600:#156eeb;--bq-blue-700:#1158bc;--bq-blue-800:#0d428d;--bq-blue-900:#082c5e;--bq-blue-1000:#04162f;--bq-corai-100:#fff2f2;--bq-corai-200:#ffe6e6;--bq-corai-300:#ffccce;--bq-corai-400:#ffb3b5;--bq-corai-500:#ff999d;--bq-corai-600:#ff8084;--bq-corai-700:#cc666a;--bq-corai-800:#994d4f;--bq-corai-900:#663335;--bq-corai-1000:#331a1a;--bq-cyan-100:#e8f7fb;--bq-cyan-200:#d2f0f8;--bq-cyan-300:#a5e1f1;--bq-cyan-400:#78d1e9;--bq-cyan-500:#4bc2e2;--bq-cyan-600:#1eb3db;--bq-cyan-700:#188faf;--bq-cyan-800:#126b83;--bq-cyan-900:#0c4858;--bq-cyan-1000:#06242c;--bq-gold-100:#fbf4ec;--bq-gold-200:#f7e9da;--bq-gold-300:#f0d3b6;--bq-gold-400:#e8bc91;--bq-gold-500:#e1a66d;--bq-gold-600:#d99048;--bq-gold-700:#ae733a;--bq-gold-800:#82562b;--bq-gold-900:#573a1d;--bq-gold-1000:#2b1d0e;--bq-green-100:#e8f8ef;--bq-green-200:#d2f1e0;--bq-green-300:#a5e3c1;--bq-green-400:#78d5a1;--bq-green-500:#4bc782;--bq-green-600:#1eb963;--bq-green-700:#18944f;--bq-green-800:#126f3b;--bq-green-900:#0c4a28;--bq-green-1000:#062514;--bq-grey-100:#f1f2f4;--bq-grey-200:#e7e8eb;--bq-grey-300:#caccd2;--bq-grey-400:#a6aab3;--bq-grey-50:#f6f6f8;--bq-grey-500:#898e99;--bq-grey-600:#646a77;--bq-grey-700:#3f4350;--bq-grey-800:#2a2c35;--bq-grey-900:#1c1d23;--bq-grey-950:#15161a;--bq-grey-1000:#0d0e11;--bq-indigo-100:#edecfc;--bq-indigo-200:#dcdafa;--bq-indigo-300:#b9b5f5;--bq-indigo-400:#9590ef;--bq-indigo-500:#726bea;--bq-indigo-600:#4f46e5;--bq-indigo-700:#3f38b7;--bq-indigo-800:#2f2a89;--bq-indigo-900:#201c5c;--bq-indigo-1000:#100e2e;--bq-iris-100:#e9f0ff;--bq-iris-200:#d6e0ff;--bq-iris-300:#b2c0fe;--bq-iris-400:#8691f8;--bq-iris-500:#6061ee;--bq-iris-600:#4f46e5;--bq-iris-700:#413abd;--bq-iris-800:#332e95;--bq-iris-900:#26216d;--bq-iris-1000:#181545;--bq-lime-100:#f5fae8;--bq-lime-200:#ecf6d2;--bq-lime-300:#d9eda5;--bq-lime-400:#c5e379;--bq-lime-500:#b2da4c;--bq-lime-600:#9fd11f;--bq-lime-700:#7fa719;--bq-lime-800:#5f7d13;--bq-lime-900:#40540c;--bq-lime-1000:#202a06;--bq-magenta-100:#fce7f4;--bq-magenta-200:#f9cfea;--bq-magenta-300:#f39fd6;--bq-magenta-400:#ee6fbf;--bq-magenta-500:#e83fab;--bq-magenta-600:#de1395;--bq-magenta-700:#b20f77;--bq-magenta-800:#850c59;--bq-magenta-900:#58083c;--bq-magenta-1000:#2c041e;--bq-neutral-white:#fbfbfc;--bq-neutral-black:#060708;--bq-orange-100:#fbf0e9;--bq-orange-200:#f8e1d4;--bq-orange-300:#f1c2a8;--bq-orange-400:#eaa47d;--bq-orange-500:#e38551;--bq-orange-600:#dc6726;--bq-orange-700:#b0521e;--bq-orange-800:#843e17;--bq-orange-900:#58290f;--bq-orange-1000:#2c1508;--bq-purple-100:#efebf8;--bq-purple-200:#e0d7f2;--bq-purple-300:#c1afe5;--bq-purple-400:#a388d8;--bq-purple-500:#8460cb;--bq-purple-600:#6538be;--bq-purple-700:#512d98;--bq-purple-800:#3d2272;--bq-purple-900:#28164c;--bq-purple-1000:#140b26;--bq-red-100:#fce7ea;--bq-red-200:#f9d1d5;--bq-red-300:#f3a2ac;--bq-red-400:#ed7482;--bq-red-500:#e74559;--bq-red-600:#e1172f;--bq-red-700:#b41226;--bq-red-800:#870e1c;--bq-red-900:#5a0913;--bq-red-1000:#2d0509;--bq-sky-100:#eff4fb;--bq-sky-200:#dfeaf8;--bq-sky-300:#bfd5f1;--bq-sky-400:#9ec1e9;--bq-sky-500:#7eace2;--bq-sky-600:#5e97db;--bq-sky-700:#4b79af;--bq-sky-800:#385b83;--bq-sky-900:#263c58;--bq-sky-1000:#131e2c;--bq-teal-100:#e5f7f5;--bq-teal-200:#ccf0eb;--bq-teal-300:#99e1d8;--bq-teal-400:#66d2c4;--bq-teal-500:#33c3b1;--bq-teal-600:#00b49d;--bq-teal-700:#00907e;--bq-teal-800:#006c5e;--bq-teal-900:#00483f;--bq-teal-1000:#00241f;--bq-volcano-100:#feede7;--bq-volcano-200:#fddbd1;--bq-volcano-300:#fbb8a3;--bq-volcano-400:#fa9474;--bq-volcano-500:#f87146;--bq-volcano-600:#f64d18;--bq-volcano-700:#c53e13;--bq-volcano-800:#942e0e;--bq-volcano-900:#621f0a;--bq-volcano-1000:#310f05;--bq-yellow-100:#fefbe7;--bq-yellow-200:#fcf6d0;--bq-yellow-300:#faeea0;--bq-yellow-400:#f7e571;--bq-yellow-500:#f5dd41;--bq-yellow-600:#f2d412;--bq-yellow-700:#c2aa0e;--bq-yellow-800:#917f0b;--bq-yellow-900:#615507;--bq-yellow-1000:#302a04;--bq-endava-grey-50:#f7f7f8;--bq-endava-grey-100:#e4e6e7;--bq-endava-grey-200:#b5babe;--bq-endava-grey-300:#949ca1;--bq-endava-grey-400:#737d84;--bq-endava-grey-500:#525f67;--bq-endava-grey-600:#30404b;--bq-endava-grey-700:#2b3942;--bq-endava-grey-800:#263139;--bq-endava-grey-900:#192b37;--bq-endava-grey-950:#151b1e;--bq-endava-grey-1000:#0f1316;--bq-endava-neutral-white:#fafbfb;--bq-endava-neutral-black:#060708;--bq-endava-orange-100:#fef3f1;--bq-endava-orange-200:#fbd6d1;--bq-endava-orange-300:#fab7af;--bq-endava-orange-400:#fa988b;--bq-endava-orange-500:#fc7866;--bq-endava-orange-600:#ff5640;--bq-endava-orange-700:#ce4a39;--bq-endava-orange-800:#a03d30;--bq-endava-orange-900:#722e25;--bq-endava-orange-1000:#471e19}*,:after,:before{box-sizing:border-box}*{font:inherit;margin:0}ol[role=list],ul[role=list]{list-style-type:none}html{text-size-adjust:none;font-family:var(--bq-font-family);font-size:var(--bq-font-size--m)}html:focus-within{scroll-behavior:smooth}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:var(--bq-background--primary);color:var(--bq-text--primary);line-height:var(--bq-font-line-height--regular);min-height:100vb;text-rendering:optimizeSpeed}a:not([class]){text-decoration-skip-ink:auto}canvas,img,picture,svg,video{display:block;max-width:100%}button,input,select,textarea{font:inherit}h1,h2,h3,h4,h5,h6,p{overflow-wrap:break-word}@media (prefers-reduced-motion:reduce){html:focus-within{scroll-behavior:auto}*,:after,:before{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto;transition-duration:.01ms!important}}:where(:root){--bq-white:#fff;--bq-black:#060708;--bq-neutral-50:var(--bq-grey-50);--bq-neutral-100:var(--bq-grey-100);--bq-neutral-200:var(--bq-grey-200);--bq-neutral-300:var(--bq-grey-300);--bq-neutral-400:var(--bq-grey-400);--bq-neutral-500:var(--bq-grey-500);--bq-neutral-600:var(--bq-grey-600);--bq-neutral-700:var(--bq-grey-700);--bq-neutral-800:var(--bq-grey-800);--bq-neutral-900:var(--bq-grey-900);--bq-neutral-950:var(--bq-grey-950);--bq-neutral-1000:var(--bq-grey-1000);--bq-brand-light:var(--bq-iris-100);--bq-brand:var(--bq-iris-600);--bq-brand-dark:var(--bq-iris-1000);--bq-accent-light:var(--bq-purple-100);--bq-accent:var(--bq-purple-600);--bq-accent-dark:var(--bq-purple-1000);--bq-success-light:var(--bq-teal-100);--bq-success:var(--bq-teal-600);--bq-success-dark:var(--bq-teal-1000);--bq-danger-light:var(--bq-red-100);--bq-danger:var(--bq-red-600);--bq-danger-dark:var(--bq-red-1000);--bq-warning-light:var(--bq-gold-100);--bq-warning:var(--bq-gold-600);--bq-warning-dark:var(--bq-gold-1000);--bq-info-light:var(--bq-iris-100);--bq-info:var(--bq-iris-600);--bq-info-dark:var(--bq-iris-1000);--bq-focus:var(--bq-iris-600);--bq-data-01:var(--bq-brand);--bq-data-02:var(--bq-purple-600);--bq-data-03:var(--bq-magenta-600);--bq-data-04:var(--bq-cyan-600);--bq-data-05:var(--bq-teal-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-yellow-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-blue-600);--bq-data-10:var(--bq-grey-600);--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white);--bq-radius--none:0;--bq-radius--xs2:0.125rem;--bq-radius--xs:0.25rem;--bq-radius--s:0.5rem;--bq-radius--m:0.75rem;--bq-radius--l:1.5rem;--bq-radius--full:9999px;--bq-box-shadow--xs:0 2px 0 rgba(0,0,0,.016);--bq-box-shadow--s:0 8px 24px rgba(0,0,0,.04);--bq-box-shadow--m:0 10px 48px -16px rgba(0,0,0,.12);--bq-box-shadow--l:0 20px 58px -16px rgba(0,0,0,.16);--bq-font-family:"Outfit",sans-serif;--bq-font-size--xs:0.75rem;--bq-font-size--s:0.875rem;--bq-font-size--m:1rem;--bq-font-size--l:1.125rem;--bq-font-size--xl:1.5rem;--bq-font-size--xxl:2rem;--bq-font-size--xxl2:2.5rem;--bq-font-size--xxl3:3rem;--bq-font-size--xxl4:3.5rem;--bq-font-size--xxl5:4rem;--bq-font-weight--thin:100;--bq-font-weight--light:300;--bq-font-weight--regular:400;--bq-font-weight--medium:500;--bq-font-weight--semibold:600;--bq-font-weight--bold:700;--bq-font-line-height--small:1.2;--bq-font-line-height--regular:1.5;--bq-font-line-height--large:1.5;--bq-spacing-xs3:0.125rem;--bq-spacing-xs2:0.25rem;--bq-spacing-xs:0.5rem;--bq-spacing-s:0.75rem;--bq-spacing-m:1rem;--bq-spacing-l:1.5rem;--bq-spacing-xl:2rem;--bq-spacing-xxl:2.5rem;--bq-spacing-xxl2:3.5rem;--bq-spacing-xxl3:4rem;--bq-spacing-xxl4:4.5rem;--bq-stroke-s:1px;--bq-stroke-m:2px;--bq-stroke-l:3px}.beeq:not([bq-mode]),.light,:root:not([bq-theme]):not([bq-mode]),:root[bq-theme=beeq]:not([bq-mode]),[bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--alt:var(--bq-white);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-light);--bq-hover:#bcbfc5;--bq-active:#444546}.dark,[bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-950);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-brand);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-brand);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-brand);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-brand);--bq-ui--info-alt:var(--bq-brand-dark);--bq-hover:#444546;--bq-active:#1f2026}:where(.endava),:where([bq-theme=endava]){--bq-font-family:"Poppins",sans-serif;--bq-white:#fafbfb;--bq-black:#030406;--bq-neutral-50:var(--bq-endava-grey-50);--bq-neutral-100:var(--bq-endava-grey-100);--bq-neutral-200:var(--bq-endava-grey-200);--bq-neutral-300:var(--bq-endava-grey-300);--bq-neutral-400:var(--bq-endava-grey-400);--bq-neutral-500:var(--bq-endava-grey-500);--bq-neutral-600:var(--bq-endava-grey-600);--bq-neutral-700:var(--bq-endava-grey-700);--bq-neutral-800:var(--bq-endava-grey-800);--bq-neutral-900:var(--bq-endava-grey-900);--bq-neutral-950:var(--bq-endava-grey-950);--bq-neutral-1000:var(--bq-endava-grey-1000);--bq-brand-light:var(--bq-endava-orange-100);--bq-brand:var(--bq-endava-orange-600);--bq-brand-dark:var(--bq-endava-orange-1000);--bq-accent-light:var(--bq-endava-orange-100);--bq-accent:var(--bq-endava-orange-600);--bq-accent-dark:var(--bq-endava-orange-1000);--bq-success-light:var(--bq-green-100);--bq-success:var(--bq-green-600);--bq-success-dark:var(--bq-green-1000);--bq-danger-light:var(--bq-corai-100);--bq-danger:var(--bq-corai-600);--bq-danger-dark:var(--bq-corai-1000);--bq-warning-light:var(--bq-yellow-100);--bq-warning:var(--bq-yellow-600);--bq-warning-dark:var(--bq-yellow-1000);--bq-info-light:var(--bq-blue-100);--bq-info:var(--bq-blue-600);--bq-info-dark:var(--bq-blue-1000);--bq-focus:var(--bq-endava-orange-600);--bq-data-01:var(--bq-brand);--bq-data-02:#af0cd8;--bq-data-03:#0ca8d8;--bq-data-04:var(--bq-teal-600);--bq-data-05:var(--bq-yellow-600);--bq-data-06:var(--bq-orange-600);--bq-data-07:var(--bq-blue-600);--bq-data-08:var(--bq-red-600);--bq-data-09:var(--bq-purple-600);--bq-data-10:#394b56;--bq-data-11:var(--bq-black);--bq-data-12:var(--bq-white)}.endava.light,.endava:not([bq-mode]),[bq-theme=endava]:not([bq-mode]),[bq-theme=endava][bq-mode=light]{--bq-background--primary:var(--bq-white);--bq-background--secondary:var(--bq-neutral-100);--bq-background--tertiary:var(--bq-neutral-200);--bq-background--alt:var(--bq-neutral-300);--bq-background--inverse:var(--bq-neutral-900);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-800);--bq-icon--secondary:var(--bq-neutral-600);--bq-icon--inverse:var(--bq-neutral-50);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-200);--bq-stroke--secondary:var(--bq-neutral-600);--bq-stroke--tertiary:var(--bq-neutral-900);--bq-stroke--inverse:var(--bq-white);--bq-stroke--brand:var(--bq-brand);--bq-stroke--alt:var(--bq-neutral-50);--bq-stroke--brand-alt:var(--bq-brand-light);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-800);--bq-text--secondary:var(--bq-neutral-600);--bq-text--inverse:var(--bq-neutral-50);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-white);--bq-ui--secondary:var(--bq-neutral-100);--bq-ui--tertiary:var(--bq-neutral-500);--bq-ui--inverse:var(--bq-neutral-900);--bq-ui--alt:var(--bq-neutral-50);--bq-ui--brand-alt:var(--bq-brand-light);--bq-ui--brand:var(--bq-brand);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-light);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-light);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-light);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-light);--bq-hover:#444546;--bq-active:#1f2026}.endava.dark,[bq-theme=endava][bq-mode=dark]{--bq-background--primary:var(--bq-neutral-1000);--bq-background--secondary:var(--bq-neutral-900);--bq-background--tertiary:var(--bq-neutral-800);--bq-background--alt:var(--bq-neutral-700);--bq-background--inverse:var(--bq-neutral-600);--bq-background--brand:var(--bq-brand);--bq-background--overlay:var(--bq-neutral-900);--bq-icon--primary:var(--bq-neutral-100);--bq-icon--secondary:var(--bq-neutral-400);--bq-icon--inverse:var(--bq-neutral-800);--bq-icon--brand:var(--bq-brand);--bq-icon--alt:var(--bq-white);--bq-icon--info:var(--bq-info);--bq-icon--success:var(--bq-success);--bq-icon--warning:var(--bq-warning);--bq-icon--danger:var(--bq-danger);--bq-stroke--primary:var(--bq-neutral-900);--bq-stroke--secondary:var(--bq-neutral-700);--bq-stroke--tertiary:var(--bq-neutral-400);--bq-stroke--inverse:var(--bq-neutral-950);--bq-stroke--brand:var(--bq-brand);--bq-stroke--brand-alt:var(--bq-brand-dark);--bq-stroke--alt:var(--bq-neutral-1000);--bq-stroke--success:var(--bq-success);--bq-stroke--warning:var(--bq-warning);--bq-stroke--danger:var(--bq-danger);--bq-stroke--info:var(--bq-info);--bq-text--primary:var(--bq-neutral-100);--bq-text--secondary:var(--bq-neutral-400);--bq-text--inverse:var(--bq-neutral-800);--bq-text--brand:var(--bq-brand);--bq-text--alt:var(--bq-neutral-white);--bq-text--info:var(--bq-info);--bq-text--success:var(--bq-success);--bq-text--warning:var(--bq-warning);--bq-text--danger:var(--bq-danger);--bq-ui--primary:var(--bq-neutral-900);--bq-ui--secondary:var(--bq-neutral-950);--bq-ui--tertiary:var(--bq-neutral-700);--bq-ui--inverse:var(--bq-neutral-100);--bq-ui--brand:var(--bq-brand);--bq-ui--brand-alt:var(--bq-brand-dark);--bq-ui--alt:var(--bq-neutral-950);--bq-ui--success:var(--bq-success);--bq-ui--success-alt:var(--bq-success-dark);--bq-ui--warning:var(--bq-warning);--bq-ui--warning-alt:var(--bq-warning-dark);--bq-ui--danger:var(--bq-danger);--bq-ui--danger-alt:var(--bq-danger-dark);--bq-ui--info:var(--bq-info);--bq-ui--info-alt:var(--bq-info-dark);--bq-hover:#444546;--bq-active:#1f2026}.visible{visibility:visible}.invisible{visibility:hidden}.fixed{position:fixed}.z-\\[--bq-drawer--zIndex\\]{z-index:var(--bq-drawer--zIndex)}.flex{display:flex}.flex-col{flex-direction:column}.gap-\\[--bq-drawer--gap\\]{gap:var(--bq-drawer--gap)}.bg-ui-primary{background-color:var(--bq-ui--primary)}.shadow-m{--tw-shadow:var(--bq-box-shadow--m);--tw-shadow-colored:var(--bq-box-shadow--m);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow)}.is-\\[--bq-drawer--width\\]{inline-size:var(--bq-drawer--width)}.max-is-full{max-inline-size:100%}.p-b-\\[--bq-drawer--paddingY\\]{padding-block:var(--bq-drawer--paddingY)}.p-i-\\[--bq-drawer--paddingX\\]{padding-inline:var(--bq-drawer--paddingX)}.inset-b-0{inset-block:0}@-webkit-keyframes fade-in{0%{opacity:0}}@keyframes fade-in{0%{opacity:0}}@-webkit-keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@keyframes slide-in{0%{-webkit-transform:translateY(10px);transform:translateY(10px)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}:host{--bq-drawer--backgroundBackdrop:var(--bq-background--overlay);--bq-drawer--gap:var(--bq-spacing-l);--bq-drawer--width:320px;--bq-drawer--paddingX:var(--bq-spacing-l);--bq-drawer--paddingY:var(--bq-spacing-m);--bq-drawer--zIndex:10;visibility:hidden!important}:host(.bq-drawer--open){visibility:visible!important}.bq-drawer{--tw-shadow:var(--bq-box-shadow--m);--tw-shadow-colored:var(--bq-box-shadow--m);background-color:var(--bq-ui--primary);box-shadow:var(--tw-ring-offset-shadow,0 0 #0000),var(--tw-ring-shadow,0 0 #0000),var(--tw-shadow);display:flex;flex-direction:column;gap:var(--bq-drawer--gap);inline-size:var(--bq-drawer--width);inset-block:0;max-inline-size:100%;padding-block:var(--bq-drawer--paddingY);padding-inline:var(--bq-drawer--paddingX);position:fixed;z-index:var(--bq-drawer--zIndex)}.pointer-events-none{pointer-events:none}.static{position:static}.inset-0{inset:0}.-end-\\[--bq-drawer--width\\]{inset-inline-end:calc(var(--bq-drawer--width)*-1)}.-start-\\[--bq-drawer--width\\]{inset-inline-start:calc(var(--bq-drawer--width)*-1)}.end-0{inset-inline-end:0}.start-0{inset-inline-start:0}.mb-m{margin-bottom:var(--bq-spacing-m)}.block{display:block}.\\!hidden{display:none!important}.hidden{display:none}.flex-1{flex:1 1 0%}.flex-auto{flex:1 1 auto}.items-center{align-items:center}.justify-center{justify-content:center}.justify-between{justify-content:space-between}.gap-xs{gap:var(--bq-spacing-xs)}.overflow-auto{overflow:auto}.bg-\\[--bq-drawer--backgroundBackdrop\\]{background-color:var(--bq-drawer--backgroundBackdrop)}.text-xl{font-size:var(--bq-font-size--xl)}.font-bold{font-weight:var(--bq-font-weight--bold)}.leading-regular{line-height:var(--bq-font-line-height--regular)}.text-primary{color:var(--bq-text--primary)}.opacity-0{opacity:0}.opacity-60{opacity:.6}.transition-all{transition-duration:.15s;transition-property:all;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-opacity{transition-duration:.15s;transition-property:opacity;transition-timing-function:cubic-bezier(.4,0,.2,1)}.duration-300{transition-duration:.3s}.ease-in-out{transition-timing-function:cubic-bezier(.4,0,.2,1)}.\\[\\&\\:\\:part\\(label\\)\\]\\:inline-flex::part(label){display:inline-flex}.gap-0{gap:0}.inline{display:inline}.container{width:100%}@media (min-width:640px){.container{max-width:640px}}@media (min-width:768px){.container{max-width:768px}}@media (min-width:1024px){.container{max-width:1024px}}@media (min-width:1280px){.container{max-width:1280px}}@media (min-width:1536px){.container{max-width:1536px}}.focus{outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}.text-\\[--bq-icon--color\\]{color:var(--bq-icon--color)}.bs-\\[--bq-icon--size\\]{block-size:var(--bq-icon--size)}.is-\\[--bq-icon--size\\]{inline-size:var(--bq-icon--size)}`;const v=class{constructor(e){a(this,e);this.bqClose=r(this,"bqClose");this.bqOpen=r(this,"bqOpen");this.bqAfterOpen=r(this,"bqAfterOpen");this.bqAfterClose=r(this,"bqAfterClose")}footerElem;drawerElem;OPEN_CSS_CLASS="bq-drawer--open";get el(){return e(this)}hasFooter=false;hasIcon=false;enableBackdrop=false;closeOnClickOutside=false;closeOnEsc=false;open;placement="right";position="end";async handleOpenChange(){if(!this.open){await this.handleAfterHide();return}await this.handleAfterShow()}handlePlacementChange(){if(!t(this.placement)){console.warn(`❗️ [bq-drawer]: the 'placement' prop is deprecated and it will be removed in the future. Please use 'position' instead.`)}i(l,"right",this.el,"placement");const a={right:"end",left:"start"};this.position=a[this.placement]||this.position}handlePositionChange(){i(s,"start",this.el,"position");const a={end:"right",start:"left"};this.placement=a[this.position]||this.placement}bqClose;bqOpen;bqAfterOpen;bqAfterClose;componentWillLoad(){this.handlePositionChange();this.handlePlacementChange()}componentDidLoad(){this.handleFooterSlotChange()}async handleMouseClick(a){if(!this.open)return;if(!this.drawerElem||this.closeOnClickOutside)return;if(a.button!==0)return;const r=this.drawerElem.getBoundingClientRect();if(a.clientX<r.left||a.clientX>r.right){await this.hide()}}async handleKeyDown(a){if(!this.open)return;if(!this.drawerElem||this.closeOnEsc||!(a.key==="Escape"||a.key==="Esc"))return;await this.hide()}async hide(){const a=this.bqClose.emit();if(a.defaultPrevented)return;this.open=false}async show(){const a=this.bqOpen.emit();if(a.defaultPrevented)return;this.open=true}handleFooterSlotChange=()=>{this.hasFooter=q(this.footerElem,"footer")};handleAfterHide=async()=>{if(!this.drawerElem)return;await o(this.drawerElem);this.handleTransitionEnd()};handleAfterShow=async()=>{if(!this.drawerElem)return;this.el.classList.add(this.OPEN_CSS_CLASS);await d(this.drawerElem);this.handleTransitionEnd()};handleTransitionEnd=()=>{if(this.open){this.bqAfterOpen.emit();return}this.bqAfterClose.emit();this.el.classList.remove(this.OPEN_CSS_CLASS)};get isPositionStart(){return this.position==="start"||this.placement==="left"}get isPositionEnd(){return this.position==="end"||this.placement==="right"}render(){return b(n,{key:"efb946ee8385eb53479a2775b0374a0545d19e2d"},this.enableBackdrop&&b("div",{key:"b3afc7c855f826110f59af39118ec0677f1d878b",class:{"fixed inset-0 block bg-[--bq-drawer--backgroundBackdrop] opacity-0 transition-opacity duration-300":true,"pointer-events-none":!this.open,"opacity-60":this.open},part:"backdrop",tabIndex:-1}),b("div",{key:"c86c49c074fd1e7d59de8d8df33fe43504fcb169","aria-hidden":!this.open?"true":"false","aria-labelledby":"bq-drawer__title","aria-modal":"true",class:{[`bq-drawer transition-all duration-300 ease-in-out ${this.position||this.placement}`]:true,"-start-[--bq-drawer--width]":this.isPositionStart,"-end-[--bq-drawer--width]":this.isPositionEnd,"start-0":this.open&&this.isPositionStart,"end-0":this.open&&this.isPositionEnd},hidden:!this.open,part:"panel",ref:a=>{this.drawerElem=a},role:"dialog"},b("header",{key:"6cd1d9ce70d4cb30d6524af6dd366e989e676c62",class:"flex items-center",part:"header"},b("h2",{key:"3212557ad0649414eb332e187acd52c96efbd835",class:"flex-1 items-center justify-between font-bold text-primary text-xl leading-regular",id:"bq-drawer__title",part:"title"},b("slot",{key:"6aebb931e8cea3ede8dde98c66ebf9a275d1cb66",name:"title"})),b("div",{key:"d68cac1a5bc9d7e7d4b4c885003630baae96c46e",class:"flex",part:"button-close"},b("bq-button",{key:"2d9ece0738afc94ac2b93e315fd814e9c5112930",appearance:"text",border:"s",class:"[&::part(label)]:inline-flex",exportparts:"button:button-close__btn,label:button-close__label",label:"Close",onBqClick:()=>this.hide(),onlyIcon:true,size:"small",slot:"button-close"},b("slot",{key:"9f8cef6896ce38cacf0b2035dda22bfa92d61f10",name:"button-close"},b("bq-icon",{key:"173869695225aae3e1b17c3ad5bdf96902f85d8e","aria-hidden":"true",name:"x-bold",title:"Close"}))))),b("main",{key:"671bf595a03619ab1ace8262cf636d1b20728897",class:"block flex-auto overflow-auto",part:"body"},b("slot",{key:"e3f41064ea0b690df0da286cf22e6ce6c8c0fae5"})),b("footer",{key:"efad25f94af91333beacf50450f74e25a4719505",class:{block:true,"!hidden":!this.hasFooter},part:"footer",ref:a=>{this.footerElem=a}},b("slot",{key:"fc2440d2e8bb7ef396ec8757ef4a9a53c2f2059e",name:"footer-divider"},b("bq-divider",{key:"5f8e1a591997cb7fa07a34ce7cc3bfd087d9c2cf",class:"mb-m block",dashed:true})),b("slot",{key:"98ed77fe6ad40a1c6e9082e3f661a7d9aaa24e54",name:"footer",onSlotchange:this.handleFooterSlotChange}))))}static get watchers(){return{open:[{handleOpenChange:0}],placement:[{handlePlacementChange:0}],position:[{handlePositionChange:0}]}}};v.style=c();export{v as bq_drawer};
|
|
6
|
+
//# sourceMappingURL=p-8d9bef7a.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["DRAWER_POSITIONS","DRAWER_PLACEMENT","bqDrawerCss","BqDrawer","footerElem","drawerElem","OPEN_CSS_CLASS","hasFooter","hasIcon","enableBackdrop","closeOnClickOutside","closeOnEsc","open","placement","position","handleOpenChange","this","handleAfterHide","handleAfterShow","handlePlacementChange","isNil","console","warn","validatePropValue","el","synPositionMap","right","left","handlePositionChange","syncPlacementMap","end","start","bqClose","bqOpen","bqAfterOpen","bqAfterClose","componentWillLoad","componentDidLoad","handleFooterSlotChange","handleMouseClick","event","button","rect","getBoundingClientRect","clientX","hide","handleKeyDown","key","ev","emit","defaultPrevented","show","hasSlotContent","async","leave","handleTransitionEnd","classList","add","enter","remove","isPositionStart","isPositionEnd","render","h","Host","class","part","tabIndex","hidden","ref","div","role","id","name","appearance","border","exportparts","label","onBqClick","onlyIcon","size","slot","title","block","dashed","onSlotchange"],"sources":["../../packages/beeq/src/components/drawer/bq-drawer.types.ts","../../packages/beeq/src/components/drawer/scss/bq-drawer.scss?tag=bq-drawer&encapsulation=shadow","../../packages/beeq/src/components/drawer/bq-drawer.tsx"],"sourcesContent":["export const DRAWER_POSITIONS = ['start', 'end'] as const;\nexport type TDrawerPosition = (typeof DRAWER_POSITIONS)[number];\n// !TO BE REMOVED: `placement` is deprecated and it will be removed in the future\nexport const DRAWER_PLACEMENT = ['left', 'right'] as const;\nexport type TDrawerPlacement = (typeof DRAWER_PLACEMENT)[number];\n","/* -------------------------------------------------------------------------- */\n/* Drawer styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-drawer.variables';\n\n:host {\n @apply invisible #{!important};\n}\n\n:host(.bq-drawer--open) {\n @apply visible #{!important};\n}\n\n.bq-drawer {\n @apply fixed z-[--bq-drawer--zIndex] flex flex-col gap-[--bq-drawer--gap] bg-ui-primary shadow-m is-[--bq-drawer--width] max-is-full p-b-[--bq-drawer--paddingY] p-i-[--bq-drawer--paddingX] inset-b-0;\n}\n","import type { EventEmitter } from '@stencil/core';\nimport { Component, Element, Event, Host, h, Listen, Method, Prop, State, Watch } from '@stencil/core';\n\nimport { enter, hasSlotContent, isNil, leave, validatePropValue } from '../../shared/utils';\nimport type { TDrawerPlacement, TDrawerPosition } from './bq-drawer.types';\nimport { DRAWER_PLACEMENT, DRAWER_POSITIONS } from './bq-drawer.types';\n\n/**\n * The Drawer component provides a sliding panel interface commonly used for navigation or presenting additional content without taking up significant screen space.\n *\n * @example How to use it\n * ```html\n * <bq-drawer position=\"end\">\n * <div class=\"flex gap-xs\" slot=\"title\">Title</div>\n * <div class=\"...\">\n * Content\n * </div>\n * <div class=\"flex flex-1 justify-center gap-xs\" slot=\"footer\">\n * <bq-button appearance=\"primary\" block=\"\" size=\"small\">Button</bq-button>\n * <bq-button appearance=\"link\" block=\"\" size=\"small\">Button</bq-button>\n * </div>\n * </bq-drawer>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/871139-drawer\n * @status stable\n *\n * @dependency bq-button\n * @dependency bq-icon\n * @dependency bq-divider\n *\n * @attr {boolean} enable-backdrop - If true, the backdrop overlay will be shown when the drawer opens.\n * @attr {boolean} close-on-click-outside - If true, the drawer will not close when clicking outside the panel.\n * @attr {boolean} close-on-esc - If true, the drawer will not close when the [Esc] key is pressed.\n * @attr {boolean} open - If true, the drawer component will be shown.\n * @attr {\"start\" | \"end\"} position - Defines the position of the drawer.\n *\n * @method show - Method to be called to show the drawer component.\n * @method hide - Method to be called to hide the drawer component.\n *\n * @event bqClose - Callback handler to be called when the drawer is closed.\n * @event bqOpen - Callback handler to be called when the drawer is opened.\n * @event bqAfterOpen - Callback handler to be called after the drawer has been opened.\n * @event bqAfterClose - Callback handler to be called after the drawer has been closed.\n *\n * @slot title - The title content of the drawer.\n * @slot - The body content of the drawer.\n * @slot footer - The footer content of the drawer.\n * @slot button-close - The close button content of the drawer.\n * @slot footer-divider - The footer divider content of the drawer.\n *\n * @part backdrop - The `<div>` that holds the backdrop overlay.\n * @part button-close - The BqButton that closes the drawer.\n * @part button-close__btn - The native button used under the hood that closes the drawer.\n * @part button-close__label - The text inside the native button that closes the drawer.\n * @part panel - The `<div>` that holds the drawer entire content.\n * @part header - The `<header>` that holds the icon, title, and close button.\n * @part title - The `<div>` that holds the title content.\n * @part body - The `<main>` that holds the drawer body content.\n * @part footer - The `<footer>` that holds footer content.\n *\n * @cssprop --bq-drawer--backgroundBackdrop - Background color of the backdrop\n * @cssprop --bq-drawer--gap - Gap between the drawer and the viewport\n * @cssprop --bq-drawer--width - Width of the drawer\n * @cssprop --bq-drawer--paddingX - Padding left and right of the drawer\n * @cssprop --bq-drawer--paddingY - Padding top and bottom of the drawer\n * @cssprop --bq-drawer--zIndex - Z-index of the drawer component\n */\n@Component({\n tag: 'bq-drawer',\n styleUrl: './scss/bq-drawer.scss',\n shadow: true,\n})\nexport class BqDrawer {\n // Own Properties\n // ====================\n\n private footerElem: HTMLElement;\n private drawerElem: HTMLDivElement;\n private OPEN_CSS_CLASS = 'bq-drawer--open';\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqDrawerElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private hasFooter = false;\n @State() hasIcon: boolean = false;\n\n // Public Property API\n // ========================\n\n /** If true, the backdrop overlay will be shown when the drawer opens */\n @Prop({ reflect: true }) enableBackdrop = false;\n\n /** If true, the drawer will not close when clicking outside the panel */\n @Prop({ reflect: true }) closeOnClickOutside = false;\n\n /** If true, the dialog will not close when the [Esc] key is pressed */\n @Prop({ reflect: true }) closeOnEsc = false;\n\n /** If true, the drawer component will be shown */\n @Prop({ reflect: true, mutable: true }) open: boolean;\n\n /** @deprecated Defines the position of the drawer */\n @Prop({ reflect: true, mutable: true }) placement: TDrawerPlacement = 'right';\n\n /** Defines the position of the drawer */\n @Prop({ reflect: true, mutable: true }) position: TDrawerPosition = 'end';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('open')\n async handleOpenChange() {\n if (!this.open) {\n await this.handleAfterHide();\n return;\n }\n\n await this.handleAfterShow();\n }\n\n /**\n * !TO BE REMOVED: Delete this `@Watch()` once the deprecated `placement` property is removed\n * We need to maintain retro-compatibility with the deprecated `placement` property\n */\n @Watch('placement')\n handlePlacementChange() {\n if (!isNil(this.placement)) {\n console.warn(\n `❗️ [bq-drawer]: the 'placement' prop is deprecated and it will be removed in the future. Please use 'position' instead.`,\n );\n }\n validatePropValue(DRAWER_PLACEMENT, 'right', this.el, 'placement');\n // Sync 'position' property\n const synPositionMap = {\n right: 'end',\n left: 'start',\n };\n this.position = (synPositionMap[this.placement] as TDrawerPosition) || this.position;\n }\n\n @Watch('position')\n handlePositionChange() {\n validatePropValue(DRAWER_POSITIONS, 'start', this.el, 'position');\n /**\n * Sync 'placement' property\n * !TO BE REMOVED: Delete the code below once the deprecated `placement` property is removed\n */\n const syncPlacementMap = {\n end: 'right',\n start: 'left',\n };\n this.placement = (syncPlacementMap[this.position] as TDrawerPlacement) || this.placement;\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n /** Callback handler to be called when the drawer is closed */\n @Event() bqClose!: EventEmitter;\n\n /** Callback handler to be called when the drawer is opened */\n @Event() bqOpen!: EventEmitter;\n\n /** Callback handler to be called after the drawer has been opened */\n @Event() bqAfterOpen!: EventEmitter;\n\n /** Callback handler to be called after the drawer has been closed */\n @Event() bqAfterClose!: EventEmitter;\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n componentWillLoad() {\n this.handlePositionChange();\n // !TO BE REMOVED: Delete this once the deprecated `placement` property is removed\n this.handlePlacementChange();\n }\n\n componentDidLoad() {\n this.handleFooterSlotChange();\n }\n\n // Listeners\n // ==============\n\n @Listen('mousedown', { target: 'window', capture: true })\n async handleMouseClick(event: MouseEvent) {\n if (!this.open) return;\n if (!this.drawerElem || this.closeOnClickOutside) return;\n // Skip if the mouse button is not the main button\n if (event.button !== 0) return;\n\n const rect = this.drawerElem.getBoundingClientRect();\n if (event.clientX < rect.left || event.clientX > rect.right) {\n await this.hide();\n }\n }\n\n @Listen('keydown', { target: 'window', capture: true })\n async handleKeyDown(event: KeyboardEvent) {\n if (!this.open) return;\n if (!this.drawerElem || this.closeOnEsc || !(event.key === 'Escape' || event.key === 'Esc')) return;\n\n await this.hide();\n }\n\n // Public methods API\n // These methods are exposed on the host element.\n // Always use two lines.\n // Public Methods must be async.\n // Requires JSDocs for public API documentation.\n // ===============================================\n\n /** Method to be called to hide the drawer component */\n @Method()\n async hide(): Promise<void> {\n const ev = this.bqClose.emit();\n if (ev.defaultPrevented) return;\n\n this.open = false;\n }\n\n /** Method to be called to show the drawer component */\n @Method()\n async show(): Promise<void> {\n const ev = this.bqOpen.emit();\n if (ev.defaultPrevented) return;\n\n this.open = true;\n }\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private handleFooterSlotChange = () => {\n this.hasFooter = hasSlotContent(this.footerElem, 'footer');\n };\n\n private handleAfterHide = async () => {\n if (!this.drawerElem) return;\n\n await leave(this.drawerElem);\n this.handleTransitionEnd();\n };\n\n private handleAfterShow = async () => {\n if (!this.drawerElem) return;\n\n this.el.classList.add(this.OPEN_CSS_CLASS);\n await enter(this.drawerElem);\n this.handleTransitionEnd();\n };\n\n private handleTransitionEnd = () => {\n if (this.open) {\n this.bqAfterOpen.emit();\n return;\n }\n\n this.bqAfterClose.emit();\n this.el.classList.remove(this.OPEN_CSS_CLASS);\n };\n\n private get isPositionStart() {\n // !TO BE REMOVED: `placement` is deprecated and will be removed in the future\n return this.position === 'start' || this.placement === 'left';\n }\n\n private get isPositionEnd() {\n // !TO BE REMOVED: `placement` is deprecated and will be removed in the future\n return this.position === 'end' || this.placement === 'right';\n }\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <Host>\n {/* BACKDROP */}\n {this.enableBackdrop && (\n <div\n class={{\n 'fixed inset-0 block bg-[--bq-drawer--backgroundBackdrop] opacity-0 transition-opacity duration-300': true,\n 'pointer-events-none': !this.open,\n 'opacity-60': this.open,\n }}\n part=\"backdrop\"\n tabIndex={-1}\n />\n )}\n {/* DRAWER PANEL */}\n <div\n aria-hidden={!this.open ? 'true' : 'false'}\n aria-labelledby=\"bq-drawer__title\"\n aria-modal=\"true\"\n class={{\n [`bq-drawer transition-all duration-300 ease-in-out ${this.position || this.placement}`]: true,\n '-start-[--bq-drawer--width]': this.isPositionStart,\n '-end-[--bq-drawer--width]': this.isPositionEnd,\n 'start-0': this.open && this.isPositionStart,\n 'end-0': this.open && this.isPositionEnd,\n }}\n hidden={!this.open}\n part=\"panel\"\n ref={(div) => {\n this.drawerElem = div;\n }}\n role=\"dialog\"\n >\n <header class=\"flex items-center\" part=\"header\">\n <h2\n class=\"flex-1 items-center justify-between font-bold text-primary text-xl leading-regular\"\n id=\"bq-drawer__title\"\n part=\"title\"\n >\n <slot name=\"title\" />\n </h2>\n <div class=\"flex\" part=\"button-close\">\n <bq-button\n appearance=\"text\"\n border=\"s\"\n class=\"[&::part(label)]:inline-flex\"\n exportparts=\"button:button-close__btn,label:button-close__label\"\n label=\"Close\"\n onBqClick={() => this.hide()}\n onlyIcon\n size=\"small\"\n slot=\"button-close\"\n >\n <slot name=\"button-close\">\n <bq-icon aria-hidden=\"true\" name=\"x-bold\" title=\"Close\" />\n </slot>\n </bq-button>\n </div>\n </header>\n <main class=\"block flex-auto overflow-auto\" part=\"body\">\n <slot />\n </main>\n <footer\n class={{\n block: true,\n '!hidden': !this.hasFooter,\n }}\n part=\"footer\"\n ref={(footerElem) => {\n this.footerElem = footerElem;\n }}\n >\n <slot name=\"footer-divider\">\n <bq-divider class=\"mb-m block\" dashed />\n </slot>\n <slot name=\"footer\" onSlotchange={this.handleFooterSlotChange} />\n </footer>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["DRAWER_POSITIONS","DRAWER_PLACEMENT","bqDrawerCss","BqDrawer","footerElem","drawerElem","OPEN_CSS_CLASS","hasFooter","hasIcon","enableBackdrop","closeOnClickOutside","closeOnEsc","open","placement","position","handleOpenChange","this","handleAfterHide","handleAfterShow","handlePlacementChange","isNil","console","warn","validatePropValue","el","synPositionMap","right","left","handlePositionChange","syncPlacementMap","end","start","bqClose","bqOpen","bqAfterOpen","bqAfterClose","componentWillLoad","componentDidLoad","handleFooterSlotChange","handleMouseClick","event","button","rect","getBoundingClientRect","clientX","hide","handleKeyDown","key","ev","emit","defaultPrevented","show","hasSlotContent","async","leave","handleTransitionEnd","classList","add","enter","remove","isPositionStart","isPositionEnd","render","h","Host","class","part","tabIndex","hidden","ref","div","role","id","name","appearance","border","exportparts","label","onBqClick","onlyIcon","size","slot","title","block","dashed","onSlotchange"],"sources":["../../packages/beeq/src/components/drawer/bq-drawer.types.ts","../../packages/beeq/src/components/drawer/scss/bq-drawer.scss?tag=bq-drawer&encapsulation=shadow","../../packages/beeq/src/components/drawer/bq-drawer.tsx"],"sourcesContent":["export const DRAWER_POSITIONS = ['start', 'end'] as const;\nexport type TDrawerPosition = (typeof DRAWER_POSITIONS)[number];\n// !TO BE REMOVED: `placement` is deprecated and it will be removed in the future\nexport const DRAWER_PLACEMENT = ['left', 'right'] as const;\nexport type TDrawerPlacement = (typeof DRAWER_PLACEMENT)[number];\n","/* -------------------------------------------------------------------------- */\n/* Drawer styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-drawer.variables';\n\n:host {\n @apply invisible #{!important};\n}\n\n:host(.bq-drawer--open) {\n @apply visible #{!important};\n}\n\n.bq-drawer {\n @apply fixed z-[--bq-drawer--zIndex] flex flex-col gap-[--bq-drawer--gap] bg-ui-primary shadow-m is-[--bq-drawer--width] max-is-full p-b-[--bq-drawer--paddingY] p-i-[--bq-drawer--paddingX] inset-b-0;\n}\n","import type { EventEmitter } from '@stencil/core';\nimport { Component, Element, Event, Host, h, Listen, Method, Prop, State, Watch } from '@stencil/core';\n\nimport { enter, hasSlotContent, isNil, leave, validatePropValue } from '../../shared/utils';\nimport type { TDrawerPlacement, TDrawerPosition } from './bq-drawer.types';\nimport { DRAWER_PLACEMENT, DRAWER_POSITIONS } from './bq-drawer.types';\n\n/**\n * The Drawer component provides a sliding panel interface commonly used for navigation or presenting additional content without taking up significant screen space.\n *\n * @example How to use it\n * ```html\n * <bq-drawer position=\"end\">\n * <div class=\"flex gap-xs\" slot=\"title\">Title</div>\n * <div class=\"...\">\n * Content\n * </div>\n * <div class=\"flex flex-1 justify-center gap-xs\" slot=\"footer\">\n * <bq-button appearance=\"primary\" block=\"\" size=\"small\">Button</bq-button>\n * <bq-button appearance=\"link\" block=\"\" size=\"small\">Button</bq-button>\n * </div>\n * </bq-drawer>\n * ```\n *\n * @documentation https://www.beeq.design/3d466e231/p/871139-drawer\n * @status stable\n *\n * @dependency bq-button\n * @dependency bq-icon\n * @dependency bq-divider\n *\n * @attr {boolean} enable-backdrop - If true, the backdrop overlay will be shown when the drawer opens.\n * @attr {boolean} close-on-click-outside - If true, the drawer will not close when clicking outside the panel.\n * @attr {boolean} close-on-esc - If true, the drawer will not close when the [Esc] key is pressed.\n * @attr {boolean} open - If true, the drawer component will be shown.\n * @attr {\"start\" | \"end\"} position - Defines the position of the drawer.\n *\n * @method show - Method to be called to show the drawer component.\n * @method hide - Method to be called to hide the drawer component.\n *\n * @event bqClose - Callback handler to be called when the drawer is closed.\n * @event bqOpen - Callback handler to be called when the drawer is opened.\n * @event bqAfterOpen - Callback handler to be called after the drawer has been opened.\n * @event bqAfterClose - Callback handler to be called after the drawer has been closed.\n *\n * @slot title - The title content of the drawer.\n * @slot - The body content of the drawer.\n * @slot footer - The footer content of the drawer.\n * @slot button-close - The close button content of the drawer.\n * @slot footer-divider - The footer divider content of the drawer.\n *\n * @part backdrop - The `<div>` that holds the backdrop overlay.\n * @part button-close - The BqButton that closes the drawer.\n * @part button-close__btn - The native button used under the hood that closes the drawer.\n * @part button-close__label - The text inside the native button that closes the drawer.\n * @part panel - The `<div>` that holds the drawer entire content.\n * @part header - The `<header>` that holds the icon, title, and close button.\n * @part title - The `<div>` that holds the title content.\n * @part body - The `<main>` that holds the drawer body content.\n * @part footer - The `<footer>` that holds footer content.\n *\n * @cssprop --bq-drawer--backgroundBackdrop - Background color of the backdrop\n * @cssprop --bq-drawer--gap - Gap between the drawer and the viewport\n * @cssprop --bq-drawer--width - Width of the drawer\n * @cssprop --bq-drawer--paddingX - Padding left and right of the drawer\n * @cssprop --bq-drawer--paddingY - Padding top and bottom of the drawer\n * @cssprop --bq-drawer--zIndex - Z-index of the drawer component\n */\n@Component({\n tag: 'bq-drawer',\n styleUrl: './scss/bq-drawer.scss',\n shadow: true,\n})\nexport class BqDrawer {\n // Own Properties\n // ====================\n\n private footerElem: HTMLElement;\n private drawerElem: HTMLDivElement;\n private OPEN_CSS_CLASS = 'bq-drawer--open';\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqDrawerElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private hasFooter = false;\n @State() hasIcon: boolean = false;\n\n // Public Property API\n // ========================\n\n /** If true, the backdrop overlay will be shown when the drawer opens */\n @Prop({ reflect: true }) enableBackdrop = false;\n\n /** If true, the drawer will not close when clicking outside the panel */\n @Prop({ reflect: true }) closeOnClickOutside = false;\n\n /** If true, the dialog will not close when the [Esc] key is pressed */\n @Prop({ reflect: true }) closeOnEsc = false;\n\n /** If true, the drawer component will be shown */\n @Prop({ reflect: true, mutable: true }) open: boolean;\n\n /** @deprecated Defines the position of the drawer */\n @Prop({ reflect: true, mutable: true }) placement: TDrawerPlacement = 'right';\n\n /** Defines the position of the drawer */\n @Prop({ reflect: true, mutable: true }) position: TDrawerPosition = 'end';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('open')\n async handleOpenChange() {\n if (!this.open) {\n await this.handleAfterHide();\n return;\n }\n\n await this.handleAfterShow();\n }\n\n /**\n * !TO BE REMOVED: Delete this `@Watch()` once the deprecated `placement` property is removed\n * We need to maintain retro-compatibility with the deprecated `placement` property\n */\n @Watch('placement')\n handlePlacementChange() {\n if (!isNil(this.placement)) {\n console.warn(\n `❗️ [bq-drawer]: the 'placement' prop is deprecated and it will be removed in the future. Please use 'position' instead.`,\n );\n }\n validatePropValue(DRAWER_PLACEMENT, 'right', this.el, 'placement');\n // Sync 'position' property\n const synPositionMap = {\n right: 'end',\n left: 'start',\n };\n this.position = (synPositionMap[this.placement] as TDrawerPosition) || this.position;\n }\n\n @Watch('position')\n handlePositionChange() {\n validatePropValue(DRAWER_POSITIONS, 'start', this.el, 'position');\n /**\n * Sync 'placement' property\n * !TO BE REMOVED: Delete the code below once the deprecated `placement` property is removed\n */\n const syncPlacementMap = {\n end: 'right',\n start: 'left',\n };\n this.placement = (syncPlacementMap[this.position] as TDrawerPlacement) || this.placement;\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n /** Callback handler to be called when the drawer is closed */\n @Event() bqClose!: EventEmitter;\n\n /** Callback handler to be called when the drawer is opened */\n @Event() bqOpen!: EventEmitter;\n\n /** Callback handler to be called after the drawer has been opened */\n @Event() bqAfterOpen!: EventEmitter;\n\n /** Callback handler to be called after the drawer has been closed */\n @Event() bqAfterClose!: EventEmitter;\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n componentWillLoad() {\n this.handlePositionChange();\n // !TO BE REMOVED: Delete this once the deprecated `placement` property is removed\n this.handlePlacementChange();\n }\n\n componentDidLoad() {\n this.handleFooterSlotChange();\n }\n\n // Listeners\n // ==============\n\n @Listen('mousedown', { target: 'window', capture: true })\n async handleMouseClick(event: MouseEvent) {\n if (!this.open) return;\n if (!this.drawerElem || this.closeOnClickOutside) return;\n // Skip if the mouse button is not the main button\n if (event.button !== 0) return;\n\n const rect = this.drawerElem.getBoundingClientRect();\n if (event.clientX < rect.left || event.clientX > rect.right) {\n await this.hide();\n }\n }\n\n @Listen('keydown', { target: 'window', capture: true })\n async handleKeyDown(event: KeyboardEvent) {\n if (!this.open) return;\n if (!this.drawerElem || this.closeOnEsc || !(event.key === 'Escape' || event.key === 'Esc')) return;\n\n await this.hide();\n }\n\n // Public methods API\n // These methods are exposed on the host element.\n // Always use two lines.\n // Public Methods must be async.\n // Requires JSDocs for public API documentation.\n // ===============================================\n\n /** Method to be called to hide the drawer component */\n @Method()\n async hide(): Promise<void> {\n const ev = this.bqClose.emit();\n if (ev.defaultPrevented) return;\n\n this.open = false;\n }\n\n /** Method to be called to show the drawer component */\n @Method()\n async show(): Promise<void> {\n const ev = this.bqOpen.emit();\n if (ev.defaultPrevented) return;\n\n this.open = true;\n }\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private handleFooterSlotChange = () => {\n this.hasFooter = hasSlotContent(this.footerElem, 'footer');\n };\n\n private handleAfterHide = async () => {\n if (!this.drawerElem) return;\n\n await leave(this.drawerElem);\n this.handleTransitionEnd();\n };\n\n private handleAfterShow = async () => {\n if (!this.drawerElem) return;\n\n this.el.classList.add(this.OPEN_CSS_CLASS);\n await enter(this.drawerElem);\n this.handleTransitionEnd();\n };\n\n private handleTransitionEnd = () => {\n if (this.open) {\n this.bqAfterOpen.emit();\n return;\n }\n\n this.bqAfterClose.emit();\n this.el.classList.remove(this.OPEN_CSS_CLASS);\n };\n\n private get isPositionStart() {\n // !TO BE REMOVED: `placement` is deprecated and will be removed in the future\n return this.position === 'start' || this.placement === 'left';\n }\n\n private get isPositionEnd() {\n // !TO BE REMOVED: `placement` is deprecated and will be removed in the future\n return this.position === 'end' || this.placement === 'right';\n }\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <Host>\n {/* BACKDROP */}\n {this.enableBackdrop && (\n <div\n class={{\n 'fixed inset-0 block bg-[--bq-drawer--backgroundBackdrop] opacity-0 transition-opacity duration-300': true,\n 'pointer-events-none': !this.open,\n 'opacity-60': this.open,\n }}\n part=\"backdrop\"\n tabIndex={-1}\n />\n )}\n {/* DRAWER PANEL */}\n <div\n aria-hidden={!this.open ? 'true' : 'false'}\n aria-labelledby=\"bq-drawer__title\"\n aria-modal=\"true\"\n class={{\n [`bq-drawer transition-all duration-300 ease-in-out ${this.position || this.placement}`]: true,\n '-start-[--bq-drawer--width]': this.isPositionStart,\n '-end-[--bq-drawer--width]': this.isPositionEnd,\n 'start-0': this.open && this.isPositionStart,\n 'end-0': this.open && this.isPositionEnd,\n }}\n hidden={!this.open}\n part=\"panel\"\n ref={(div) => {\n this.drawerElem = div;\n }}\n role=\"dialog\"\n >\n <header class=\"flex items-center\" part=\"header\">\n <h2\n class=\"flex-1 items-center justify-between font-bold text-primary text-xl leading-regular\"\n id=\"bq-drawer__title\"\n part=\"title\"\n >\n <slot name=\"title\" />\n </h2>\n <div class=\"flex\" part=\"button-close\">\n <bq-button\n appearance=\"text\"\n border=\"s\"\n class=\"[&::part(label)]:inline-flex\"\n exportparts=\"button:button-close__btn,label:button-close__label\"\n label=\"Close\"\n onBqClick={() => this.hide()}\n onlyIcon\n size=\"small\"\n slot=\"button-close\"\n >\n <slot name=\"button-close\">\n <bq-icon aria-hidden=\"true\" name=\"x-bold\" title=\"Close\" />\n </slot>\n </bq-button>\n </div>\n </header>\n <main class=\"block flex-auto overflow-auto\" part=\"body\">\n <slot />\n </main>\n <footer\n class={{\n block: true,\n '!hidden': !this.hasFooter,\n }}\n part=\"footer\"\n ref={(footerElem) => {\n this.footerElem = footerElem;\n }}\n >\n <slot name=\"footer-divider\">\n <bq-divider class=\"mb-m block\" dashed />\n </slot>\n <slot name=\"footer\" onSlotchange={this.handleFooterSlotChange} />\n </footer>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":";;;;uNAAO,MAAMA,EAAmB,CAAC,QAAS,OAGnC,MAAMC,EAAmB,CAAC,OAAQ,SCHzC,MAAMC,EAAc,IAAM,09sB,MCyEbC,EAAQ,M,qKAIXC,WACAC,WACAC,eAAiB,kB,wBAWRC,UAAY,MACpBC,QAAmB,MAMHC,eAAiB,MAGjBC,oBAAsB,MAGtBC,WAAa,MAGEC,KAGAC,UAA8B,QAG9BC,SAA4B,MAMpE,sBAAMC,GACJ,IAAKC,KAAKJ,KAAM,OACRI,KAAKC,kBACX,M,OAGID,KAAKE,iB,CAQb,qBAAAC,GACE,IAAKC,EAAMJ,KAAKH,WAAY,CAC1BQ,QAAQC,KACN,0H,CAGJC,EAAkBtB,EAAkB,QAASe,KAAKQ,GAAI,aAEtD,MAAMC,EAAiB,CACrBC,MAAO,MACPC,KAAM,SAERX,KAAKF,SAAYW,EAAeT,KAAKH,YAAkCG,KAAKF,Q,CAI9E,oBAAAc,GACEL,EAAkBvB,EAAkB,QAASgB,KAAKQ,GAAI,YAKtD,MAAMK,EAAmB,CACvBC,IAAK,QACLC,MAAO,QAETf,KAAKH,UAAagB,EAAiBb,KAAKF,WAAkCE,KAAKH,S,CAQxEmB,QAGAC,OAGAC,YAGAC,aAMT,iBAAAC,GACEpB,KAAKY,uBAELZ,KAAKG,uB,CAGP,gBAAAkB,GACErB,KAAKsB,wB,CAOP,sBAAMC,CAAiBC,GACrB,IAAKxB,KAAKJ,KAAM,OAChB,IAAKI,KAAKX,YAAcW,KAAKN,oBAAqB,OAElD,GAAI8B,EAAMC,SAAW,EAAG,OAExB,MAAMC,EAAO1B,KAAKX,WAAWsC,wBAC7B,GAAIH,EAAMI,QAAUF,EAAKf,MAAQa,EAAMI,QAAUF,EAAKhB,MAAO,OACrDV,KAAK6B,M,EAKf,mBAAMC,CAAcN,GAClB,IAAKxB,KAAKJ,KAAM,OAChB,IAAKI,KAAKX,YAAcW,KAAKL,cAAgB6B,EAAMO,MAAQ,UAAYP,EAAMO,MAAQ,OAAQ,aAEvF/B,KAAK6B,M,CAYb,UAAMA,GACJ,MAAMG,EAAKhC,KAAKgB,QAAQiB,OACxB,GAAID,EAAGE,iBAAkB,OAEzBlC,KAAKJ,KAAO,K,CAKd,UAAMuC,GACJ,MAAMH,EAAKhC,KAAKiB,OAAOgB,OACvB,GAAID,EAAGE,iBAAkB,OAEzBlC,KAAKJ,KAAO,I,CAQN0B,uBAAyB,KAC/BtB,KAAKT,UAAY6C,EAAepC,KAAKZ,WAAY,SAAS,EAGpDa,gBAAkBoC,UACxB,IAAKrC,KAAKX,WAAY,aAEhBiD,EAAMtC,KAAKX,YACjBW,KAAKuC,qBAAqB,EAGpBrC,gBAAkBmC,UACxB,IAAKrC,KAAKX,WAAY,OAEtBW,KAAKQ,GAAGgC,UAAUC,IAAIzC,KAAKV,sBACrBoD,EAAM1C,KAAKX,YACjBW,KAAKuC,qBAAqB,EAGpBA,oBAAsB,KAC5B,GAAIvC,KAAKJ,KAAM,CACbI,KAAKkB,YAAYe,OACjB,M,CAGFjC,KAAKmB,aAAac,OAClBjC,KAAKQ,GAAGgC,UAAUG,OAAO3C,KAAKV,eAAe,EAG/C,mBAAYsD,GAEV,OAAO5C,KAAKF,WAAa,SAAWE,KAAKH,YAAc,M,CAGzD,iBAAYgD,GAEV,OAAO7C,KAAKF,WAAa,OAASE,KAAKH,YAAc,O,CAOvD,MAAAiD,GACE,OACEC,EAACC,EAAI,CAAAjB,IAAA,4CAEF/B,KAAKP,gBACJsD,EAAA,OAAAhB,IAAA,2CACEkB,MAAO,CACL,qGAAsG,KACtG,uBAAwBjD,KAAKJ,KAC7B,aAAcI,KAAKJ,MAErBsD,KAAK,WACLC,UAAU,IAIdJ,EAAA,OAAAhB,IAAA,0DACgB/B,KAAKJ,KAAO,OAAS,QAAO,kBAC1B,mBAAkB,aACvB,OACXqD,MAAO,CACL,CAAC,qDAAqDjD,KAAKF,UAAYE,KAAKH,aAAc,KAC1F,8BAA+BG,KAAK4C,gBACpC,4BAA6B5C,KAAK6C,cAClC,UAAW7C,KAAKJ,MAAQI,KAAK4C,gBAC7B,QAAS5C,KAAKJ,MAAQI,KAAK6C,eAE7BO,QAASpD,KAAKJ,KACdsD,KAAK,QACLG,IAAMC,IACJtD,KAAKX,WAAaiE,CAAG,EAEvBC,KAAK,UAELR,EAAA,UAAAhB,IAAA,2CAAQkB,MAAM,oBAAoBC,KAAK,UACrCH,EAAA,MAAAhB,IAAA,2CACEkB,MAAM,qFACNO,GAAG,mBACHN,KAAK,SAELH,EAAA,QAAAhB,IAAA,2CAAM0B,KAAK,WAEbV,EAAA,OAAAhB,IAAA,2CAAKkB,MAAM,OAAOC,KAAK,gBACrBH,EAAA,aAAAhB,IAAA,2CACE2B,WAAW,OACXC,OAAO,IACPV,MAAM,+BACNW,YAAY,qDACZC,MAAM,QACNC,UAAW,IAAM9D,KAAK6B,OACtBkC,SAAQ,KACRC,KAAK,QACLC,KAAK,gBAELlB,EAAA,QAAAhB,IAAA,2CAAM0B,KAAK,gBACTV,EAAA,WAAAhB,IAAA,yDAAqB,OAAO0B,KAAK,SAASS,MAAM,cAKxDnB,EAAA,QAAAhB,IAAA,2CAAMkB,MAAM,gCAAgCC,KAAK,QAC/CH,EAAA,QAAAhB,IAAA,8CAEFgB,EAAA,UAAAhB,IAAA,2CACEkB,MAAO,CACLkB,MAAO,KACP,WAAYnE,KAAKT,WAEnB2D,KAAK,SACLG,IAAMjE,IACJY,KAAKZ,WAAaA,CAAU,GAG9B2D,EAAA,QAAAhB,IAAA,2CAAM0B,KAAK,kBACTV,EAAA,cAAAhB,IAAA,2CAAYkB,MAAM,aAAamB,OAAM,QAEvCrB,EAAA,QAAAhB,IAAA,2CAAM0B,KAAK,SAASY,aAAcrE,KAAKsB,2B","ignoreList":[]}
|