@beeq/core 1.8.0-beta.4 → 1.8.0-beta.5
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 +12 -12
- package/dist/beeq/{p-7ea146b8.entry.js → p-01fe8efb.entry.js} +1 -3
- package/dist/beeq/{p-7ea146b8.entry.js.map → p-01fe8efb.entry.js.map} +1 -1
- package/dist/beeq/{p-d9bcaeed.entry.js → p-03373320.entry.js} +1 -3
- package/dist/beeq/{p-d9bcaeed.entry.js.map → p-03373320.entry.js.map} +1 -1
- package/dist/beeq/{p-e06c8398.entry.js → p-03c586df.entry.js} +19 -21
- package/dist/beeq/p-03c586df.entry.js.map +1 -0
- package/dist/beeq/{p-a94d15f9.entry.js → p-0a981080.entry.js} +1 -3
- package/dist/beeq/{p-a94d15f9.entry.js.map → p-0a981080.entry.js.map} +1 -1
- package/dist/beeq/{p-03e23dca.entry.js → p-0ce76c54.entry.js} +1 -3
- package/dist/beeq/{p-03e23dca.entry.js.map → p-0ce76c54.entry.js.map} +1 -1
- package/dist/beeq/{p-f5eb8fff.entry.js → p-2bb049ae.entry.js} +2 -4
- package/dist/beeq/{p-f5eb8fff.entry.js.map → p-2bb049ae.entry.js.map} +1 -1
- package/dist/beeq/{p-8b6fc3ef.entry.js → p-3043c826.entry.js} +5 -7
- package/dist/beeq/{p-8b6fc3ef.entry.js.map → p-3043c826.entry.js.map} +1 -1
- package/dist/beeq/{p-fe57aa48.entry.js → p-38e70f78.entry.js} +1 -3
- package/dist/beeq/{p-fe57aa48.entry.js.map → p-38e70f78.entry.js.map} +1 -1
- package/dist/beeq/{p-818cd6d7.entry.js → p-398bfb48.entry.js} +1 -3
- package/dist/beeq/{p-818cd6d7.entry.js.map → p-398bfb48.entry.js.map} +1 -1
- package/dist/beeq/{p-cdd5b425.entry.js → p-3f9a348a.entry.js} +2 -4
- package/dist/beeq/{p-cdd5b425.entry.js.map → p-3f9a348a.entry.js.map} +1 -1
- package/dist/beeq/{p-27974392.entry.js → p-41ac1d84.entry.js} +2 -4
- package/dist/beeq/{p-27974392.entry.js.map → p-41ac1d84.entry.js.map} +1 -1
- package/dist/beeq/{p-908c57e9.entry.js → p-4eabcd51.entry.js} +1 -3
- package/dist/beeq/{p-908c57e9.entry.js.map → p-4eabcd51.entry.js.map} +1 -1
- package/dist/beeq/{p-d2f682a9.entry.js → p-544deac1.entry.js} +3 -5
- package/dist/beeq/{p-d2f682a9.entry.js.map → p-544deac1.entry.js.map} +1 -1
- package/dist/beeq/{p-f5d59aba.entry.js → p-5ff6621d.entry.js} +2 -4
- package/dist/beeq/{p-f5d59aba.entry.js.map → p-5ff6621d.entry.js.map} +1 -1
- package/dist/beeq/{p-3e3fd7b5.entry.js → p-60cbc966.entry.js} +1 -3
- package/dist/beeq/{p-3e3fd7b5.entry.js.map → p-60cbc966.entry.js.map} +1 -1
- package/dist/beeq/{p-98de0101.entry.js → p-68ff188d.entry.js} +1 -3
- package/dist/beeq/{p-98de0101.entry.js.map → p-68ff188d.entry.js.map} +1 -1
- package/dist/beeq/{p-7aa47927.entry.js → p-69c766a3.entry.js} +9 -11
- package/dist/beeq/p-69c766a3.entry.js.map +1 -0
- package/dist/beeq/{p-89665044.entry.js → p-76486949.entry.js} +2 -4
- package/dist/beeq/{p-89665044.entry.js.map → p-76486949.entry.js.map} +1 -1
- package/dist/beeq/{p-0fce4de9.js → p-83d6d9ad.js} +2 -4
- package/dist/beeq/{p-0fce4de9.js.map → p-83d6d9ad.js.map} +1 -1
- package/dist/beeq/{p-03749fbf.entry.js → p-8b16f130.entry.js} +1 -3
- package/dist/beeq/{p-03749fbf.entry.js.map → p-8b16f130.entry.js.map} +1 -1
- package/dist/beeq/{p-b877d662.entry.js → p-8e1c6978.entry.js} +80 -49
- package/dist/beeq/p-8e1c6978.entry.js.map +1 -0
- package/dist/beeq/p-8f1c68c0.js +71 -0
- package/dist/beeq/p-8f1c68c0.js.map +1 -0
- package/dist/beeq/{p-5d51cadd.entry.js → p-9cab14ee.entry.js} +1 -3
- package/dist/beeq/{p-5d51cadd.entry.js.map → p-9cab14ee.entry.js.map} +1 -1
- package/dist/beeq/{p-7695fc8d.entry.js → p-a23b23c4.entry.js} +1 -3
- package/dist/beeq/{p-7695fc8d.entry.js.map → p-a23b23c4.entry.js.map} +1 -1
- package/dist/beeq/{p-2b2d8b0c.entry.js → p-a608a4fb.entry.js} +2 -4
- package/dist/beeq/{p-2b2d8b0c.entry.js.map → p-a608a4fb.entry.js.map} +1 -1
- package/dist/beeq/{p-bc60faa1.entry.js → p-aacaaa35.entry.js} +1 -3
- package/dist/beeq/{p-bc60faa1.entry.js.map → p-aacaaa35.entry.js.map} +1 -1
- package/dist/beeq/{p-d8f7bf11.entry.js → p-b2df1479.entry.js} +1 -3
- package/dist/beeq/{p-d8f7bf11.entry.js.map → p-b2df1479.entry.js.map} +1 -1
- package/dist/beeq/{p-5d8d6717.entry.js → p-b77b52f2.entry.js} +2 -4
- package/dist/beeq/{p-5d8d6717.entry.js.map → p-b77b52f2.entry.js.map} +1 -1
- package/dist/beeq/{p-5fcbf15f.entry.js → p-c83bc7fd.entry.js} +10 -11
- package/dist/beeq/p-c83bc7fd.entry.js.map +1 -0
- package/dist/beeq/{p-e6911710.entry.js → p-cb2b0014.entry.js} +1 -3
- package/dist/beeq/{p-e6911710.entry.js.map → p-cb2b0014.entry.js.map} +1 -1
- package/dist/beeq/{p-60ab652b.entry.js → p-cfb8829b.entry.js} +1 -3
- package/dist/beeq/{p-60ab652b.entry.js.map → p-cfb8829b.entry.js.map} +1 -1
- package/dist/beeq/{p-3ed73068.entry.js → p-d7067dae.entry.js} +1 -3
- package/dist/beeq/{p-3ed73068.entry.js.map → p-d7067dae.entry.js.map} +1 -1
- package/dist/beeq/{p-f69d2900.entry.js → p-d7dc7086.entry.js} +1 -3
- package/dist/beeq/{p-f69d2900.entry.js.map → p-d7dc7086.entry.js.map} +1 -1
- package/dist/beeq/{p-5a9a73a0.js → p-edfd9767.js} +2 -2
- package/dist/beeq/p-edfd9767.js.map +1 -0
- package/dist/beeq/{p-ac0d84a6.entry.js → p-f979d79a.entry.js} +1 -3
- package/dist/beeq/{p-ac0d84a6.entry.js.map → p-f979d79a.entry.js.map} +1 -1
- package/dist/beeq/{p-5a12011a.entry.js → p-faa3be41.entry.js} +1 -3
- package/dist/beeq/{p-5a12011a.entry.js.map → p-faa3be41.entry.js.map} +1 -1
- package/dist/beeq/{p-bb14b231.entry.js → p-fb20c6eb.entry.js} +2 -4
- package/dist/beeq/{p-bb14b231.entry.js.map → p-fb20c6eb.entry.js.map} +1 -1
- package/dist/beeq/{p-be746e37.entry.js → p-fe278ecc.entry.js} +2 -4
- package/dist/beeq/{p-be746e37.entry.js.map → p-fe278ecc.entry.js.map} +1 -1
- package/dist/cjs/assetsPath-8bd8d221.js +77 -0
- package/dist/cjs/assetsPath-8bd8d221.js.map +1 -0
- package/dist/cjs/beeq.cjs.js +1 -1
- package/dist/cjs/bq-accordion-group.cjs.entry.js +0 -1
- package/dist/cjs/bq-accordion-group.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-accordion.cjs.entry.js +0 -1
- package/dist/cjs/bq-accordion.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-alert.cjs.entry.js +0 -1
- package/dist/cjs/bq-alert.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-avatar.cjs.entry.js +0 -1
- package/dist/cjs/bq-avatar.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-badge.cjs.entry.js +1 -2
- package/dist/cjs/bq-badge.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-breadcrumb-item.cjs.entry.js +1 -2
- package/dist/cjs/bq-breadcrumb-item.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-breadcrumb.cjs.entry.js +0 -1
- package/dist/cjs/bq-breadcrumb.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-button_2.cjs.entry.js +52 -21
- package/dist/cjs/bq-button_2.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-card.cjs.entry.js +0 -1
- package/dist/cjs/bq-card.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-checkbox.cjs.entry.js +0 -1
- package/dist/cjs/bq-checkbox.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-date-picker.cjs.entry.js +1 -2
- package/dist/cjs/bq-date-picker.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-dialog.cjs.entry.js +1 -2
- package/dist/cjs/bq-dialog.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-divider.cjs.entry.js +1 -2
- package/dist/cjs/bq-divider.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-drawer.cjs.entry.js +1 -2
- package/dist/cjs/bq-drawer.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-empty-state.cjs.entry.js +0 -1
- package/dist/cjs/bq-empty-state.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-input.cjs.entry.js +1 -2
- package/dist/cjs/bq-input.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-notification.cjs.entry.js +4 -5
- package/dist/cjs/bq-notification.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-option-list_2.cjs.entry.js +1 -2
- package/dist/cjs/bq-option-list_2.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-option.cjs.entry.js +0 -1
- package/dist/cjs/bq-option.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-page-title.cjs.entry.js +0 -1
- package/dist/cjs/bq-page-title.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-progress.cjs.entry.js +0 -1
- package/dist/cjs/bq-progress.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-radio-group.cjs.entry.js +0 -1
- package/dist/cjs/bq-radio-group.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-select.cjs.entry.js +2 -3
- package/dist/cjs/bq-select.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-side-menu-item.cjs.entry.js +0 -1
- package/dist/cjs/bq-side-menu-item.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-side-menu.cjs.entry.js +4 -4
- package/dist/cjs/bq-side-menu.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-slider.cjs.entry.js +0 -1
- package/dist/cjs/bq-slider.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-spinner.cjs.entry.js +1 -2
- package/dist/cjs/bq-spinner.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-status.cjs.entry.js +0 -1
- package/dist/cjs/bq-status.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-step-item.cjs.entry.js +0 -1
- package/dist/cjs/bq-step-item.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-steps.cjs.entry.js +0 -1
- package/dist/cjs/bq-steps.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-switch.cjs.entry.js +0 -1
- package/dist/cjs/bq-switch.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-tab-group.cjs.entry.js +0 -1
- package/dist/cjs/bq-tab-group.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-tab.cjs.entry.js +0 -1
- package/dist/cjs/bq-tab.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-textarea.cjs.entry.js +0 -1
- package/dist/cjs/bq-textarea.cjs.entry.js.map +1 -1
- package/dist/cjs/bq-toast.cjs.entry.js +3 -4
- package/dist/cjs/bq-toast.cjs.entry.js.map +1 -1
- package/dist/cjs/{cssVariables-a0e1e906.js → cssVariables-dd190bc2.js} +2 -2
- package/dist/cjs/cssVariables-dd190bc2.js.map +1 -0
- package/dist/cjs/index.cjs.js +3 -3
- package/dist/cjs/{isDefined-ee0026ed.js → isDefined-f3968296.js} +1 -2
- package/dist/cjs/isDefined-f3968296.js.map +1 -0
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/collection/components/button/bq-button.js +41 -16
- package/dist/collection/components/button/bq-button.js.map +1 -1
- package/dist/collection/components/dialog/scss/bq-dialog.css +1 -1
- package/dist/collection/components/drawer/scss/bq-drawer.css +1 -1
- package/dist/collection/components/icon/helper/request.js +2 -2
- package/dist/collection/components/icon/helper/request.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/select/scss/bq-select.css +1 -1
- package/dist/collection/components/side-menu/bq-side-menu.js +9 -3
- package/dist/collection/components/side-menu/bq-side-menu.js.map +1 -1
- package/dist/collection/components/toast/bq-toast.js +3 -3
- package/dist/collection/components/toast/bq-toast.js.map +1 -1
- package/dist/collection/shared/utils/assetsPath.js +47 -35
- package/dist/collection/shared/utils/assetsPath.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/components/bq-accordion-group.js +0 -1
- package/dist/components/bq-accordion-group.js.map +1 -1
- package/dist/components/bq-accordion.js +0 -1
- package/dist/components/bq-accordion.js.map +1 -1
- package/dist/components/bq-alert.js +0 -1
- package/dist/components/bq-alert.js.map +1 -1
- package/dist/components/bq-avatar.js +0 -1
- package/dist/components/bq-avatar.js.map +1 -1
- package/dist/components/bq-badge2.js +0 -1
- package/dist/components/bq-badge2.js.map +1 -1
- package/dist/components/bq-breadcrumb-item.js +0 -1
- package/dist/components/bq-breadcrumb-item.js.map +1 -1
- package/dist/components/bq-breadcrumb.js +0 -1
- package/dist/components/bq-breadcrumb.js.map +1 -1
- package/dist/components/bq-button2.js +42 -18
- package/dist/components/bq-button2.js.map +1 -1
- package/dist/components/bq-card.js +0 -1
- package/dist/components/bq-card.js.map +1 -1
- package/dist/components/bq-checkbox.js +0 -1
- package/dist/components/bq-checkbox.js.map +1 -1
- package/dist/components/bq-date-picker.js +0 -1
- package/dist/components/bq-date-picker.js.map +1 -1
- package/dist/components/bq-dialog.js +1 -2
- package/dist/components/bq-dialog.js.map +1 -1
- package/dist/components/bq-divider2.js +0 -1
- package/dist/components/bq-divider2.js.map +1 -1
- package/dist/components/bq-drawer.js +1 -2
- package/dist/components/bq-drawer.js.map +1 -1
- package/dist/components/bq-empty-state.js +0 -1
- package/dist/components/bq-empty-state.js.map +1 -1
- package/dist/components/bq-icon2.js +70 -4
- package/dist/components/bq-icon2.js.map +1 -1
- package/dist/components/bq-input.js +0 -1
- package/dist/components/bq-input.js.map +1 -1
- package/dist/components/bq-notification.js +4 -5
- package/dist/components/bq-notification.js.map +1 -1
- package/dist/components/bq-option-list2.js +0 -1
- package/dist/components/bq-option-list2.js.map +1 -1
- package/dist/components/bq-option.js +0 -1
- package/dist/components/bq-option.js.map +1 -1
- package/dist/components/bq-page-title.js +0 -1
- package/dist/components/bq-page-title.js.map +1 -1
- package/dist/components/bq-progress.js +0 -1
- package/dist/components/bq-progress.js.map +1 -1
- package/dist/components/bq-radio-group.js +0 -1
- package/dist/components/bq-radio-group.js.map +1 -1
- package/dist/components/bq-select.js +1 -2
- package/dist/components/bq-select.js.map +1 -1
- package/dist/components/bq-side-menu-item.js +0 -1
- package/dist/components/bq-side-menu-item.js.map +1 -1
- package/dist/components/bq-side-menu.js +5 -4
- package/dist/components/bq-side-menu.js.map +1 -1
- package/dist/components/bq-slider.js +0 -1
- package/dist/components/bq-slider.js.map +1 -1
- package/dist/components/bq-spinner.js +0 -1
- package/dist/components/bq-spinner.js.map +1 -1
- package/dist/components/bq-status.js +0 -1
- package/dist/components/bq-status.js.map +1 -1
- package/dist/components/bq-step-item.js +0 -1
- package/dist/components/bq-step-item.js.map +1 -1
- package/dist/components/bq-steps.js +0 -1
- package/dist/components/bq-steps.js.map +1 -1
- package/dist/components/bq-switch.js +0 -1
- package/dist/components/bq-switch.js.map +1 -1
- package/dist/components/bq-tab-group.js +0 -1
- package/dist/components/bq-tab-group.js.map +1 -1
- package/dist/components/bq-tab.js +0 -1
- package/dist/components/bq-tab.js.map +1 -1
- package/dist/components/bq-tag2.js +0 -1
- package/dist/components/bq-tag2.js.map +1 -1
- package/dist/components/bq-textarea.js +0 -1
- package/dist/components/bq-textarea.js.map +1 -1
- package/dist/components/bq-toast.js +3 -4
- package/dist/components/bq-toast.js.map +1 -1
- package/dist/components/cssVariables.js +1 -1
- package/dist/components/cssVariables.js.map +1 -1
- package/dist/components/index.js +1 -1
- package/dist/components/isDefined.js +0 -1
- package/dist/components/isDefined.js.map +1 -1
- package/dist/esm/assetsPath-beeee241.js +74 -0
- package/dist/esm/assetsPath-beeee241.js.map +1 -0
- package/dist/esm/beeq.js +1 -1
- package/dist/esm/bq-accordion-group.entry.js +0 -1
- package/dist/esm/bq-accordion-group.entry.js.map +1 -1
- package/dist/esm/bq-accordion.entry.js +0 -1
- package/dist/esm/bq-accordion.entry.js.map +1 -1
- package/dist/esm/bq-alert.entry.js +0 -1
- package/dist/esm/bq-alert.entry.js.map +1 -1
- package/dist/esm/bq-avatar.entry.js +0 -1
- package/dist/esm/bq-avatar.entry.js.map +1 -1
- package/dist/esm/bq-badge.entry.js +1 -2
- package/dist/esm/bq-badge.entry.js.map +1 -1
- package/dist/esm/bq-breadcrumb-item.entry.js +1 -2
- package/dist/esm/bq-breadcrumb-item.entry.js.map +1 -1
- package/dist/esm/bq-breadcrumb.entry.js +0 -1
- package/dist/esm/bq-breadcrumb.entry.js.map +1 -1
- package/dist/esm/bq-button_2.entry.js +52 -21
- package/dist/esm/bq-button_2.entry.js.map +1 -1
- package/dist/esm/bq-card.entry.js +0 -1
- package/dist/esm/bq-card.entry.js.map +1 -1
- package/dist/esm/bq-checkbox.entry.js +0 -1
- package/dist/esm/bq-checkbox.entry.js.map +1 -1
- package/dist/esm/bq-date-picker.entry.js +1 -2
- package/dist/esm/bq-date-picker.entry.js.map +1 -1
- package/dist/esm/bq-dialog.entry.js +1 -2
- package/dist/esm/bq-dialog.entry.js.map +1 -1
- package/dist/esm/bq-divider.entry.js +1 -2
- package/dist/esm/bq-divider.entry.js.map +1 -1
- package/dist/esm/bq-drawer.entry.js +1 -2
- package/dist/esm/bq-drawer.entry.js.map +1 -1
- package/dist/esm/bq-empty-state.entry.js +0 -1
- package/dist/esm/bq-empty-state.entry.js.map +1 -1
- package/dist/esm/bq-input.entry.js +1 -2
- package/dist/esm/bq-input.entry.js.map +1 -1
- package/dist/esm/bq-notification.entry.js +4 -5
- package/dist/esm/bq-notification.entry.js.map +1 -1
- package/dist/esm/bq-option-list_2.entry.js +1 -2
- package/dist/esm/bq-option-list_2.entry.js.map +1 -1
- package/dist/esm/bq-option.entry.js +0 -1
- package/dist/esm/bq-option.entry.js.map +1 -1
- package/dist/esm/bq-page-title.entry.js +0 -1
- package/dist/esm/bq-page-title.entry.js.map +1 -1
- package/dist/esm/bq-progress.entry.js +0 -1
- package/dist/esm/bq-progress.entry.js.map +1 -1
- package/dist/esm/bq-radio-group.entry.js +0 -1
- package/dist/esm/bq-radio-group.entry.js.map +1 -1
- package/dist/esm/bq-select.entry.js +2 -3
- package/dist/esm/bq-select.entry.js.map +1 -1
- package/dist/esm/bq-side-menu-item.entry.js +0 -1
- package/dist/esm/bq-side-menu-item.entry.js.map +1 -1
- package/dist/esm/bq-side-menu.entry.js +4 -4
- package/dist/esm/bq-side-menu.entry.js.map +1 -1
- package/dist/esm/bq-slider.entry.js +0 -1
- package/dist/esm/bq-slider.entry.js.map +1 -1
- package/dist/esm/bq-spinner.entry.js +1 -2
- package/dist/esm/bq-spinner.entry.js.map +1 -1
- package/dist/esm/bq-status.entry.js +0 -1
- package/dist/esm/bq-status.entry.js.map +1 -1
- package/dist/esm/bq-step-item.entry.js +0 -1
- package/dist/esm/bq-step-item.entry.js.map +1 -1
- package/dist/esm/bq-steps.entry.js +0 -1
- package/dist/esm/bq-steps.entry.js.map +1 -1
- package/dist/esm/bq-switch.entry.js +0 -1
- package/dist/esm/bq-switch.entry.js.map +1 -1
- package/dist/esm/bq-tab-group.entry.js +0 -1
- package/dist/esm/bq-tab-group.entry.js.map +1 -1
- package/dist/esm/bq-tab.entry.js +0 -1
- package/dist/esm/bq-tab.entry.js.map +1 -1
- package/dist/esm/bq-textarea.entry.js +0 -1
- package/dist/esm/bq-textarea.entry.js.map +1 -1
- package/dist/esm/bq-toast.entry.js +3 -4
- package/dist/esm/bq-toast.entry.js.map +1 -1
- package/dist/esm/{cssVariables-23e3ca0d.js → cssVariables-000c23ad.js} +2 -2
- package/dist/esm/cssVariables-000c23ad.js.map +1 -0
- package/dist/esm/index.js +4 -4
- package/dist/esm/{isDefined-650befc3.js → isDefined-0cb07ee6.js} +1 -2
- package/dist/esm/isDefined-0cb07ee6.js.map +1 -0
- package/dist/esm/loader.js +1 -1
- package/dist/hydrate/index.js +113 -68
- package/dist/hydrate/index.mjs +113 -68
- package/dist/types/components/button/bq-button.d.ts +5 -0
- package/dist/types/shared/utils/assetsPath.d.ts +5 -9
- package/package.json +1 -1
- package/dist/beeq/p-5a9a73a0.js.map +0 -1
- package/dist/beeq/p-5fcbf15f.entry.js.map +0 -1
- package/dist/beeq/p-7aa47927.entry.js.map +0 -1
- package/dist/beeq/p-a84d4562.js +0 -64
- package/dist/beeq/p-a84d4562.js.map +0 -1
- package/dist/beeq/p-b877d662.entry.js.map +0 -1
- package/dist/beeq/p-e06c8398.entry.js.map +0 -1
- package/dist/cjs/assetsPath-6ac8935a.js +0 -65
- package/dist/cjs/assetsPath-6ac8935a.js.map +0 -1
- package/dist/cjs/cssVariables-a0e1e906.js.map +0 -1
- package/dist/cjs/isDefined-ee0026ed.js.map +0 -1
- package/dist/components/assetsPath.js +0 -62
- package/dist/components/assetsPath.js.map +0 -1
- package/dist/esm/assetsPath-e2f1ceb9.js +0 -62
- package/dist/esm/assetsPath-e2f1ceb9.js.map +0 -1
- package/dist/esm/cssVariables-23e3ca0d.js.map +0 -1
- package/dist/esm/isDefined-650befc3.js.map +0 -1
|
@@ -4,11 +4,9 @@
|
|
|
4
4
|
*/
|
|
5
5
|
import { r as e, c as r, g as a, h as t } from "./p-01df4baa.js";
|
|
6
6
|
|
|
7
|
-
import "./p-a84d4562.js";
|
|
8
|
-
|
|
9
7
|
import { d as b } from "./p-1defeea3.js";
|
|
10
8
|
|
|
11
|
-
import { i as n } from "./p-
|
|
9
|
+
import { i as n } from "./p-83d6d9ad.js";
|
|
12
10
|
|
|
13
11
|
import { i } from "./p-57621be1.js";
|
|
14
12
|
|
|
@@ -18,7 +16,7 @@ import { i as o } from "./p-ecd27cf2.js";
|
|
|
18
16
|
|
|
19
17
|
import { b as l } from "./p-d7ce7165.js";
|
|
20
18
|
|
|
21
|
-
const q = '.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{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);font-family:var(--bq-font-family);line-height:var(--bq-font-line-height--regular);min-height:100vh;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}}: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.light,.light,:root,[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-200);--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}.beeq.dark,.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-800);--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}.endava,[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,[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-200);--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-800);--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}.pointer-events-none{pointer-events:none}.m-0{margin:0}.me-\\[--bq-select--gap\\]{margin-inline-end:var(--bq-select--gap)}.me-xs2{margin-inline-end:var(--bq-spacing-xs2)}.ms-\\[--bq-select--gap\\]{margin-inline-start:var(--bq-select--gap)}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.w-full{width:100%}.flex-1{flex:1 1 0%}.flex-auto{flex:1 1 auto}.cursor-\\[inherit\\]{cursor:inherit}.cursor-not-allowed{cursor:not-allowed}.select-none{user-select:none}.appearance-none{appearance:none}.items-center{align-items:center}.gap-xs2{gap:var(--bq-spacing-xs2)}.text-nowrap{text-wrap:nowrap}.rounded-\\[--bq-select--border-radius\\]{border-radius:var(--bq-select--border-radius)}.rounded-xs{border-radius:var(--bq-radius--xs)}.border-\\[length\\:--bq-select--border-width\\]{border-width:var(--bq-select--border-width)}.border-none{border-style:none}.border-\\[color\\:--bq-select--border-color-focus\\]{border-color:var(--bq-select--border-color-focus)}.border-\\[color\\:--bq-select--border-color\\]{border-color:var(--bq-select--border-color)}.border-stroke-danger{border-color:var(--bq-stroke--danger)}.border-stroke-success{border-color:var(--bq-stroke--success)}.border-stroke-warning{border-color:var(--bq-stroke--warning)}.bg-\\[inherit\\]{background-color:inherit}.p-0{padding:0}.pe-\\[--bq-select--padding-end\\]{padding-inline-end:var(--bq-select--padding-end)}.ps-\\[--bq-select--padding-start\\]{padding-inline-start:var(--bq-select--padding-start)}.font-\\[inherit\\]{font-family:inherit}.text-\\[length\\:--bq-select--helper-text-size\\]{font-size:var(--bq-select--helper-text-size)}.text-\\[length\\:--bq-select--label-text-size\\]{font-size:var(--bq-select--label-text-size)}.text-\\[length\\:--bq-select--text-size\\]{font-size:var(--bq-select--text-size)}.text-\\[length\\:inherit\\]{font-size:inherit}.leading-small{line-height:var(--bq-font-line-height--small)}.text-\\[color\\:--bq-select--helper-text-color\\]{color:var(--bq-select--helper-text-color)}.text-\\[color\\:--bq-select--label-text-color\\]{color:var(--bq-select--label-text-color)}.text-\\[color\\:--bq-select--text-color\\]{color:var(--bq-select--text-color)}.text-\\[color\\:inherit\\]{color:inherit}.text-\\[color\\:var\\(--bq-select--text-color\\)\\]{color:var(--bq-select--text-color)}.text-text-danger{color:var(--bq-text--danger)}.text-text-success{color:var(--bq-text--success)}.text-text-warning{color:var(--bq-text--warning)}.opacity-60{opacity:.6}.transition-\\[border-color\\2c box-shadow\\]{transition-duration:.15s;transition-property:border-color,box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-transform{transition-duration:.15s;transition-property:transform;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)}.border-active-stroke-danger{border-color:color-mix(in srgb,var(--bq-stroke--danger),var(--bq-active) 20%)}.border-active-stroke-success{border-color:color-mix(in srgb,var(--bq-stroke--success),var(--bq-active) 20%)}.border-active-stroke-warning{border-color:color-mix(in srgb,var(--bq-stroke--warning),var(--bq-active) 20%)}.bs-auto{block-size:auto}.min-bs-\\[var\\(--bq-select--icon-size\\)\\]{min-block-size:var(--bq-select--icon-size)}.min-is-0{min-inline-size:0}.p-b-\\[var\\(--bq-select--paddingY\\)\\]{padding-block:var(--bq-select--paddingY)}.m-be-\\[--bq-select--label-margin-bottom\\]{margin-block-end:var(--bq-select--label-margin-bottom)}.m-bs-\\[--bq-select--helper-margin-top\\]{margin-block-start:var(--bq-select--helper-margin-top)}.focus{outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}@-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-select--background-color:var(--bq-ui--primary);--bq-select--border-color:var(--bq-stroke--tertiary);--bq-select--border-color-focus:var(--bq-stroke--brand);--bq-select--border-radius:var(--bq-radius--s);--bq-select--border-width:var(--bq-stroke-s);--bq-select--border-style:solid;--bq-select--gap:var(--bq-spacing-xs);--bq-select--helper-margin-top:var(--bq-spacing-xs);--bq-select--helper-text-size:var(--bq-font-size--s);--bq-select--helper-text-color:var(--bq-text--primary);--bq-select--icon-size:24px;--bq-select--label-margin-bottom:var(--bq-spacing-xs);--bq-select--label-text-size:var(--bq-font-size--s);--bq-select--label-text-color:var(--bq-text--primary);--bq-select--padding-start:calc(var(--bq-spacing-m) - var(--bq-select--border-width));--bq-select--padding-end:calc(var(--bq-spacing-m) - var(--bq-select--border-width));--bq-select--paddingY:calc(var(--bq-spacing-s) - var(--bq-select--border-width));--bq-select--text-color:var(--bq-text--primary);--bq-select--text-size:var(--bq-font-size--m);--bq-select--text-placeholder-color:var(--bq-text--secondary);display:block;width:100%}.bq-select__label{align-items:center;color:var(--bq-select--label-text-color);display:flex;font-size:var(--bq-select--label-text-size);margin-block-end:var(--bq-select--label-margin-bottom)}.bq-select__helper-text{color:var(--bq-select--helper-text-color);font-size:var(--bq-select--helper-text-size);margin-block-start:var(--bq-select--helper-margin-top)}.bq-select__helper-text.validation-error{color:var(--bq-text--danger)}.bq-select__helper-text.validation-success{color:var(--bq-text--success)}.bq-select__helper-text.validation-warning{color:var(--bq-text--warning)}.bq-select__dropdown:has(:focus-within,:focus-visible) .bq-select__control{--bq-ring-width:1px;--bq-ring-offset-width:0;--bq-ring-color-focus:var(--bq-select--border-color-focus);border-color:var(--bq-select--border-color-focus);outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}.bq-select__control{align-items:center;border-color:var(--bq-select--border-color);border-radius:var(--bq-select--border-radius);border-style:var(--bq-select--border-style);border-width:var(--bq-select--border-width);color:var(--bq-select--text-color);display:flex;font-size:var(--bq-select--text-size);inline-size:100%;padding-block:var(--bq-select--paddingY);padding-inline-end:var(--bq-select--padding-end);padding-inline-start:var(--bq-select--padding-start);transition-duration:.15s;transition-property:border-color,box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);user-select:none}.bq-select__control::placeholder{color:var(--bq-select--text-placeholder-color)}.bq-select__control:hover:not(.disabled):not(:focus-within){border-color:color-mix(in srgb,var(--bq-stroke--brand),var(--bq-hover) 20%)}.bq-select__control:not(.disabled):focus-within .bq-select__control--clear,.bq-select__control:not(.disabled):hover .bq-select__control--clear{display:inline-block}.bq-select__control.disabled{cursor:not-allowed;opacity:.6}.bq-select__control.validation-error{border-color:var(--bq-stroke--danger)}.bq-select__control.validation-error:hover:not(.disabled):not(:focus-within){border-color:color-mix(in srgb,var(--bq-stroke--danger),var(--bq-hover) 20%)}.bq-select__control.validation-error:not(.disabled):focus-within{--bq-ring-color-focus:var(--bq-stroke--danger);border-color:color-mix(in srgb,var(--bq-stroke--danger),var(--bq-active) 20%)}.bq-select__control.validation-success{border-color:var(--bq-stroke--success)}.bq-select__control.validation-success:hover:not(.disabled):not(:focus-within){border-color:color-mix(in srgb,var(--bq-stroke--success),var(--bq-hover) 20%)}.bq-select__control.validation-success:not(.disabled):focus-within{--bq-ring-color-focus:var(--bq-stroke--success);border-color:color-mix(in srgb,var(--bq-stroke--success),var(--bq-active) 20%)}.bq-select__control.validation-warning{border-color:var(--bq-stroke--warning)}.bq-select__control.validation-warning:hover:not(.disabled):not(:focus-within){border-color:color-mix(in srgb,var(--bq-stroke--warning),var(--bq-hover) 20%)}.bq-select__control.validation-warning:not(.disabled):focus-within{--bq-ring-color-focus:var(--bq-stroke--warning);border-color:color-mix(in srgb,var(--bq-stroke--warning),var(--bq-active) 20%)}.bq-select__control--input{appearance:none;background-color:inherit;border-style:none;-webkit-box-shadow:none;box-shadow:none;color:inherit;cursor:inherit;flex:1 1 auto;font-family:inherit;font-size:inherit;font-weight:inherit;margin:0;min-block-size:var(--bq-select--icon-size);min-inline-size:0;padding:0;user-select:none}.bq-select__control--input:focus{outline:2px solid transparent;outline-offset:2px}.bq-select__control--input:focus-visible{outline:2px solid transparent;outline-offset:2px}.bq-select__control--clear::part(button){--bq-ring-width:initial;--bq-ring-offset-width:initial;--bq-ring-color-focus:initial;block-size:auto;border-radius:var(--bq-radius--xs);border-style:none;padding:0}.bq-select__control--prefix,.bq-select__control--suffix{align-items:center;color:var(--bq-select--text-color);display:flex;pointer-events:none}.bq-select__control--prefix{margin-inline-end:var(--bq-select--gap)}.bq-select__control--suffix{margin-inline-start:var(--bq-select--gap);transition-duration:.3s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}.bq-select__tags{display:flex;flex:1 1 0%;gap:var(--bq-spacing-xs2);margin-inline-end:var(--bq-spacing-xs2)}.bq-select__tags ::slotted(bq-tag),.bq-select__tags bq-tag{display:inline-flex}.bq-select__tags bq-tag::part(text){text-wrap:nowrap;line-height:var(--bq-font-line-height--small)}::slotted(bq-icon),bq-icon{--bq-icon--size:var(--bq-select--icon-size)!important}.placeholder\\:text-\\[color\\:--bq-select--text-placeholder-color\\]::placeholder{color:var(--bq-select--text-placeholder-color)}.focus\\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.rotate-0,.rotate-180{--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))}.blur,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.visible{visibility:visible}.static{position:static}.fixed{position:fixed}.\\!hidden{display:none!important}.hidden{display:none}.flex-grow{flex-grow:1}.rotate-0{--tw-rotate:0deg}.rotate-180{--tw-rotate:180deg}.overflow-x-auto{overflow-x:auto}.outline{outline-style:solid}.blur{--tw-blur:blur(8px)}.is-full{inline-size:100%}.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}}.text-\\[color\\:--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)}.text-m{font-size:var(--bq-font-size--m)}.text-s{font-size:var(--bq-font-size--s)}.text-xs{font-size:var(--bq-font-size--xs)}.flex-col{flex-direction:column}.gap-y-\\[--bq-option-group--gapY-list\\]{row-gap:var(--bq-option-group--gapY-list)}.relative{position:relative}';
|
|
19
|
+
const q = '.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{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);font-family:var(--bq-font-family);line-height:var(--bq-font-line-height--regular);min-height:100vh;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}}: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.light,.light,:root,[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-200);--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}.beeq.dark,.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-800);--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}.endava,[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,[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-200);--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-800);--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}.pointer-events-none{pointer-events:none}.m-0{margin:0}.me-\\[--bq-select--gap\\]{margin-inline-end:var(--bq-select--gap)}.me-xs2{margin-inline-end:var(--bq-spacing-xs2)}.ms-\\[--bq-select--gap\\]{margin-inline-start:var(--bq-select--gap)}.block{display:block}.inline-block{display:inline-block}.flex{display:flex}.inline-flex{display:inline-flex}.w-full{width:100%}.flex-1{flex:1 1 0%}.flex-auto{flex:1 1 auto}.cursor-\\[inherit\\]{cursor:inherit}.cursor-not-allowed{cursor:not-allowed}.select-none{user-select:none}.appearance-none{appearance:none}.items-center{align-items:center}.gap-xs2{gap:var(--bq-spacing-xs2)}.text-nowrap{text-wrap:nowrap}.rounded-\\[--bq-select--border-radius\\]{border-radius:var(--bq-select--border-radius)}.rounded-xs{border-radius:var(--bq-radius--xs)}.border-\\[length\\:--bq-select--border-width\\]{border-width:var(--bq-select--border-width)}.border-none{border-style:none}.border-\\[color\\:--bq-select--border-color-focus\\]{border-color:var(--bq-select--border-color-focus)}.border-\\[color\\:--bq-select--border-color\\]{border-color:var(--bq-select--border-color)}.border-stroke-danger{border-color:var(--bq-stroke--danger)}.border-stroke-success{border-color:var(--bq-stroke--success)}.border-stroke-warning{border-color:var(--bq-stroke--warning)}.bg-\\[inherit\\]{background-color:inherit}.p-0{padding:0}.pe-\\[--bq-select--padding-end\\]{padding-inline-end:var(--bq-select--padding-end)}.ps-\\[--bq-select--padding-start\\]{padding-inline-start:var(--bq-select--padding-start)}.font-\\[inherit\\]{font-family:inherit}.text-\\[length\\:--bq-select--helper-text-size\\]{font-size:var(--bq-select--helper-text-size)}.text-\\[length\\:--bq-select--label-text-size\\]{font-size:var(--bq-select--label-text-size)}.text-\\[length\\:--bq-select--text-size\\]{font-size:var(--bq-select--text-size)}.text-\\[length\\:inherit\\]{font-size:inherit}.leading-small{line-height:var(--bq-font-line-height--small)}.text-\\[color\\:--bq-select--helper-text-color\\]{color:var(--bq-select--helper-text-color)}.text-\\[color\\:--bq-select--label-text-color\\]{color:var(--bq-select--label-text-color)}.text-\\[color\\:--bq-select--text-color\\]{color:var(--bq-select--text-color)}.text-\\[color\\:inherit\\]{color:inherit}.text-\\[color\\:var\\(--bq-select--text-color\\)\\]{color:var(--bq-select--text-color)}.text-text-danger{color:var(--bq-text--danger)}.text-text-success{color:var(--bq-text--success)}.text-text-warning{color:var(--bq-text--warning)}.opacity-60{opacity:.6}.transition-\\[border-color\\2c box-shadow\\]{transition-duration:.15s;transition-property:border-color,box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1)}.transition-transform{transition-duration:.15s;transition-property:transform;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)}.border-active-stroke-danger{border-color:color-mix(in srgb,var(--bq-stroke--danger),var(--bq-active) 20%)}.border-active-stroke-success{border-color:color-mix(in srgb,var(--bq-stroke--success),var(--bq-active) 20%)}.border-active-stroke-warning{border-color:color-mix(in srgb,var(--bq-stroke--warning),var(--bq-active) 20%)}.bs-auto{block-size:auto}.min-bs-\\[var\\(--bq-select--icon-size\\)\\]{min-block-size:var(--bq-select--icon-size)}.min-is-0{min-inline-size:0}.p-b-\\[var\\(--bq-select--paddingY\\)\\]{padding-block:var(--bq-select--paddingY)}.m-be-\\[--bq-select--label-margin-bottom\\]{margin-block-end:var(--bq-select--label-margin-bottom)}.m-bs-\\[--bq-select--helper-margin-top\\]{margin-block-start:var(--bq-select--helper-margin-top)}.focus{outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}@-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-select--background-color:var(--bq-ui--primary);--bq-select--border-color:var(--bq-stroke--tertiary);--bq-select--border-color-focus:var(--bq-stroke--brand);--bq-select--border-radius:var(--bq-radius--s);--bq-select--border-width:var(--bq-stroke-s);--bq-select--border-style:solid;--bq-select--gap:var(--bq-spacing-xs);--bq-select--helper-margin-top:var(--bq-spacing-xs);--bq-select--helper-text-size:var(--bq-font-size--s);--bq-select--helper-text-color:var(--bq-text--primary);--bq-select--icon-size:24px;--bq-select--label-margin-bottom:var(--bq-spacing-xs);--bq-select--label-text-size:var(--bq-font-size--s);--bq-select--label-text-color:var(--bq-text--primary);--bq-select--padding-start:calc(var(--bq-spacing-m) - var(--bq-select--border-width));--bq-select--padding-end:calc(var(--bq-spacing-m) - var(--bq-select--border-width));--bq-select--paddingY:calc(var(--bq-spacing-s) - var(--bq-select--border-width));--bq-select--text-color:var(--bq-text--primary);--bq-select--text-size:var(--bq-font-size--m);--bq-select--text-placeholder-color:var(--bq-text--secondary);display:block;width:100%}.bq-select__label{align-items:center;color:var(--bq-select--label-text-color);display:flex;font-size:var(--bq-select--label-text-size);margin-block-end:var(--bq-select--label-margin-bottom)}.bq-select__helper-text{color:var(--bq-select--helper-text-color);font-size:var(--bq-select--helper-text-size);margin-block-start:var(--bq-select--helper-margin-top)}.bq-select__helper-text.validation-error{color:var(--bq-text--danger)}.bq-select__helper-text.validation-success{color:var(--bq-text--success)}.bq-select__helper-text.validation-warning{color:var(--bq-text--warning)}.bq-select__dropdown:has(:focus-within,:focus-visible) .bq-select__control{--bq-ring-width:1px;--bq-ring-offset-width:0;--bq-ring-color-focus:var(--bq-select--border-color-focus);border-color:var(--bq-select--border-color-focus);outline:var(--bq-ring-width,2px) solid var(--bq-ring-color-focus,var(--bq-focus));outline-offset:var(--bq-ring-offset-width,1px)}.bq-select__control{align-items:center;border-color:var(--bq-select--border-color);border-radius:var(--bq-select--border-radius);border-style:var(--bq-select--border-style);border-width:var(--bq-select--border-width);color:var(--bq-select--text-color);display:flex;font-size:var(--bq-select--text-size);inline-size:100%;padding-block:var(--bq-select--paddingY);padding-inline-end:var(--bq-select--padding-end);padding-inline-start:var(--bq-select--padding-start);transition-duration:.15s;transition-property:border-color,box-shadow;transition-timing-function:cubic-bezier(.4,0,.2,1);user-select:none}.bq-select__control::placeholder{color:var(--bq-select--text-placeholder-color)}.bq-select__control:hover:not(.disabled):not(:focus-within){border-color:color-mix(in srgb,var(--bq-stroke--brand),var(--bq-hover) 20%)}.bq-select__control:not(.disabled):focus-within .bq-select__control--clear,.bq-select__control:not(.disabled):hover .bq-select__control--clear{display:inline-block}.bq-select__control.disabled{cursor:not-allowed;opacity:.6}.bq-select__control.validation-error{border-color:var(--bq-stroke--danger)}.bq-select__control.validation-error:hover:not(.disabled):not(:focus-within){border-color:color-mix(in srgb,var(--bq-stroke--danger),var(--bq-hover) 20%)}.bq-select__control.validation-error:not(.disabled):focus-within{--bq-ring-color-focus:var(--bq-stroke--danger);border-color:color-mix(in srgb,var(--bq-stroke--danger),var(--bq-active) 20%)}.bq-select__control.validation-success{border-color:var(--bq-stroke--success)}.bq-select__control.validation-success:hover:not(.disabled):not(:focus-within){border-color:color-mix(in srgb,var(--bq-stroke--success),var(--bq-hover) 20%)}.bq-select__control.validation-success:not(.disabled):focus-within{--bq-ring-color-focus:var(--bq-stroke--success);border-color:color-mix(in srgb,var(--bq-stroke--success),var(--bq-active) 20%)}.bq-select__control.validation-warning{border-color:var(--bq-stroke--warning)}.bq-select__control.validation-warning:hover:not(.disabled):not(:focus-within){border-color:color-mix(in srgb,var(--bq-stroke--warning),var(--bq-hover) 20%)}.bq-select__control.validation-warning:not(.disabled):focus-within{--bq-ring-color-focus:var(--bq-stroke--warning);border-color:color-mix(in srgb,var(--bq-stroke--warning),var(--bq-active) 20%)}.bq-select__control--input{appearance:none;background-color:inherit;border-style:none;-webkit-box-shadow:none;box-shadow:none;color:inherit;cursor:inherit;flex:1 1 auto;font-family:inherit;font-size:inherit;font-weight:inherit;margin:0;min-block-size:var(--bq-select--icon-size);min-inline-size:0;padding:0;user-select:none}.bq-select__control--input:focus{outline:2px solid transparent;outline-offset:2px}.bq-select__control--input:focus-visible{outline:2px solid transparent;outline-offset:2px}.bq-select__control--clear::part(button){--bq-ring-width:initial;--bq-ring-offset-width:initial;--bq-ring-color-focus:initial;block-size:auto;border-radius:var(--bq-radius--xs);border-style:none;padding:0}.bq-select__control--prefix,.bq-select__control--suffix{align-items:center;color:var(--bq-select--text-color);display:flex;pointer-events:none}.bq-select__control--prefix{margin-inline-end:var(--bq-select--gap)}.bq-select__control--suffix{margin-inline-start:var(--bq-select--gap);transition-duration:.3s;transition-property:transform;transition-timing-function:cubic-bezier(.4,0,.2,1)}.bq-select__tags{display:flex;flex:1 1 0%;gap:var(--bq-spacing-xs2);margin-inline-end:var(--bq-spacing-xs2)}.bq-select__tags ::slotted(bq-tag),.bq-select__tags bq-tag{display:inline-flex}.bq-select__tags bq-tag::part(text){text-wrap:nowrap;line-height:var(--bq-font-line-height--small)}::slotted(bq-icon),bq-icon{--bq-icon--size:var(--bq-select--icon-size)!important}.placeholder\\:text-\\[color\\:--bq-select--text-placeholder-color\\]::placeholder{color:var(--bq-select--text-placeholder-color)}.focus\\:outline-none:focus{outline:2px solid transparent;outline-offset:2px}.rotate-0,.rotate-180{--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))}.blur,.filter{filter:var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow)}.visible{visibility:visible}.static{position:static}.fixed{position:fixed}.\\!hidden{display:none!important}.hidden{display:none}.flex-grow{flex-grow:1}.rotate-0{--tw-rotate:0deg}.rotate-180{--tw-rotate:180deg}.overflow-x-auto{overflow-x:auto}.outline{outline-style:solid}.blur{--tw-blur:blur(8px)}.is-full{inline-size:100%}.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}}.flex-col{flex-direction:column}.gap-y-\\[--bq-option-group--gapY-list\\]{row-gap:var(--bq-option-group--gapY-list)}.text-m{font-size:var(--bq-font-size--m)}.text-s{font-size:var(--bq-font-size--s)}.text-xs{font-size:var(--bq-font-size--xs)}.relative{position:relative}.text-\\[color\\:--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)}';
|
|
22
20
|
|
|
23
21
|
const c = q;
|
|
24
22
|
|
|
@@ -527,4 +525,4 @@ const d = class {
|
|
|
527
525
|
d.style = c;
|
|
528
526
|
|
|
529
527
|
export { d as bq_select };
|
|
530
|
-
//# sourceMappingURL=p-
|
|
528
|
+
//# sourceMappingURL=p-544deac1.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["bqSelectCss","BqSelectStyle0","BqSelect","helperTextElem","inputElem","labelElem","prefixElem","suffixElem","debounceQuery","fallbackInputId","internals","handleValueChange","this","multiple","isString","value","Array","from","JSON","parse","String","setFormValue","join","syncItemsFromValue","bqBlur","bqClear","bqFocus","bqSelect","connectedCallback","initMultipleValue","componentWillLoad","componentDidLoad","isArray","selectedOptions","options","filter","item","includes","formAssociatedCallback","role","ariaExpanded","open","formResetCallback","isNil","setValidity","clear","handleOpenChange","ev","composedPath","el","detail","stopOptionFocusBlurPropagation","isHTMLElement","target","stopPropagation","disabled","undefined","displayValue","resetOptionsVisibility","emit","handleBlur","handleFocus","handleSelect","handleMultipleSelection","focus","selectedOptionsSet","Set","has","delete","add","map","handleSearchFilter","cancel","query","toLowerCase","trim","isDefined","debounce","forEach","itemLabel","getOptionLabel","hidden","debounceTime","handleClearClick","handleTagRemove","handleLabelSlotChange","hasLabel","hasSlotContent","handlePrefixSlotChange","hasPrefix","handleSuffixSlotChange","hasSuffix","handleHelperTextSlotChange","hasHelperText","length","syncSelectedOptionsState","option","updateDisplayLabel","lowerCaseValue","selected","checkedItem","find","innerText","querySelectorAll","displayPlaceholder","placeholder","displayTags","index","maxTagsVisible","h","key","removable","size","variant","onBqClose","event","onClick","exportparts","part","hasClearIcon","disableClear","render","labelId","name","class","id","htmlFor","ref","onSlotchange","distance","keepOpenOnSelect","panelHeight","placement","sameWidth","skidding","strategy","validationStatus","slot","spanElem","autoComplete","autoCapitalize","form","readOnly","readonly","required","spellcheck","type","onBlur","onFocus","onInput","appearance","clearButtonLabel","onBqClick","tabIndex","onBqSelect","divElem"],"sources":["../../packages/beeq/src/components/select/scss/bq-select.scss?tag=bq-select&encapsulation=shadow","../../packages/beeq/src/components/select/bq-select.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/* Select styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-select.variables';\n\n:host {\n @apply block w-full;\n}\n\n/* -------------------------------------------------------------------------- */\n/* Label and Helper text */\n/* -------------------------------------------------------------------------- */\n\n.bq-select__label {\n @apply flex items-center m-be-[--bq-select--label-margin-bottom];\n @apply text-[length:--bq-select--label-text-size] text-[color:--bq-select--label-text-color];\n}\n\n.bq-select__helper-text {\n @apply text-[length:--bq-select--helper-text-size] text-[color:--bq-select--helper-text-color] m-bs-[--bq-select--helper-margin-top];\n}\n\n.bq-select__helper-text.validation-error {\n @apply text-text-danger;\n}\n\n.bq-select__helper-text.validation-success {\n @apply text-text-success;\n}\n\n.bq-select__helper-text.validation-warning {\n @apply text-text-warning;\n}\n\n/* -------------------------------------------------------------------------- */\n/* Select input group control */\n/* -------------------------------------------------------------------------- */\n\n.bq-select__dropdown:has(:focus-within, :focus-visible) {\n // The focus state will be controlled by the dropdown element\n // if any of its children has focus, the dropdown will set the focus state to the .bq-select__control\n .bq-select__control {\n --bq-ring-width: 1px;\n --bq-ring-offset-width: 0;\n --bq-ring-color-focus: var(--bq-select--border-color-focus);\n\n @apply focus border-[color:--bq-select--border-color-focus];\n }\n}\n\n.bq-select__control {\n @apply flex items-center transition-[border-color,box-shadow] is-full;\n // Border\n @apply rounded-[--bq-select--border-radius] border-[length:--bq-select--border-width] border-[color:--bq-select--border-color];\n // Padding\n @apply pe-[--bq-select--padding-end] ps-[--bq-select--padding-start] p-b-[var(--bq-select--paddingY)];\n // Text\n @apply select-none text-[length:--bq-select--text-size] text-[color:--bq-select--text-color] placeholder:text-[color:--bq-select--text-placeholder-color];\n // Hover\n @apply [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-brand;\n\n border-style: var(--bq-select--border-style);\n\n // Enable clear button whenever the input group control is hovered or has focus\n &:not(.disabled):hover,\n &:not(.disabled):focus-within {\n .bq-select__control--clear {\n @apply inline-block;\n }\n }\n}\n\n.bq-select__control.disabled {\n @apply cursor-not-allowed opacity-60;\n}\n\n/* ------------------------------- Validation ------------------------------- */\n\n.bq-select__control.validation-error {\n @apply border-stroke-danger [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-danger;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(colors.stroke.danger);\n\n @apply border-active-stroke-danger;\n }\n}\n\n.bq-select__control.validation-success {\n @apply border-stroke-success [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-success;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(colors.stroke.success);\n\n @apply border-active-stroke-success;\n }\n}\n\n.bq-select__control.validation-warning {\n @apply border-stroke-warning [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-warning;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(colors.stroke.warning);\n\n @apply border-active-stroke-warning;\n }\n}\n\n/* -------------------------------------------------------------------------- */\n/* Native HTML Input */\n/* -------------------------------------------------------------------------- */\n\n.bq-select__control--input {\n @apply flex-auto cursor-[inherit] select-none appearance-none bg-[inherit] font-[inherit] text-[length:inherit] text-[color:inherit];\n @apply m-0 border-none p-0 min-bs-[var(--bq-select--icon-size)] min-is-0 focus:outline-none focus-visible:outline-none;\n\n box-shadow: none;\n font-weight: inherit;\n}\n\n/* -------------------------------------------------------------------------- */\n/* Clear button */\n/* -------------------------------------------------------------------------- */\n\n.bq-select__control--clear::part(button) {\n // Since the clear button is inside the input group control,\n // we need to reset the focus ring styles\n --bq-ring-width: initial;\n --bq-ring-offset-width: initial;\n --bq-ring-color-focus: initial;\n\n @apply rounded-xs border-none p-0 bs-auto;\n}\n\n/* -------------------------------------------------------------------------- */\n/* Prefix and suffix */\n/* -------------------------------------------------------------------------- */\n\n.bq-select__control--prefix,\n.bq-select__control--suffix {\n @apply pointer-events-none flex items-center text-[color:var(--bq-select--text-color)];\n}\n\n.bq-select__control--prefix {\n @apply me-[--bq-select--gap];\n}\n\n.bq-select__control--suffix {\n @apply ms-[--bq-select--gap] transition-transform duration-300 ease-in-out;\n}\n\n.bq-select__tags {\n @apply me-xs2 flex flex-1 gap-xs2;\n\n bq-tag,\n ::slotted(bq-tag) {\n @apply inline-flex;\n }\n\n bq-tag::part(text) {\n @apply text-nowrap leading-small;\n }\n}\n\n/* -------------------------------------------------------------------------- */\n/* Slotted and internal icons */\n/* -------------------------------------------------------------------------- */\n\nbq-icon,\n::slotted(bq-icon) {\n --bq-icon--size: var(--bq-select--icon-size) !important;\n}\n","import {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Listen,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\n\nimport { Placement } from '../../services/interfaces';\nimport { debounce, hasSlotContent, isDefined, isHTMLElement, isNil, isString, TDebounce } from '../../shared/utils';\nimport { TInputValidation } from '../input/bq-input.types';\n\nexport type TSelectValue = string | string[];\n\n/**\n * @part base - The component's base wrapper.\n * @part button - The native HTML button used under the hood in the clear button.\n * @part clear-btn - The clear button.\n * @part control - The input control wrapper.\n * @part input-outline - The input outline wrapper that holds the tags container and the native HTML input used under the hood.\n * @part helper-text - The helper text slot container.\n * @part input - The native HTML input element used under the hood.\n * @part label - The label slot container.\n * @part panel - The select panel container\n * @part prefix - The prefix slot container.\n * @part suffix - The suffix slot container.\n * @part tags - The tags container of the BqTags for multiple selection.\n * @part tag - The tag container of the BqTag for multiple selection.\n * @part tag__base - The base wrapper of the BqTag for multiple selection.\n * @part tag__prefix - The prefix slot container of the BqTag for multiple selection.\n * @part tag__text - The text slot container of the BqTag for multiple selection.\n * @part tag__btn-close - The close button of the BqTag for multiple selection.\n * @part option-list - The option list container.\n */\n@Component({\n tag: 'bq-select',\n styleUrl: './scss/bq-select.scss',\n formAssociated: true,\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class BqSelect {\n // Own Properties\n // ====================\n\n private helperTextElem?: HTMLElement;\n private inputElem?: HTMLInputElement;\n private labelElem?: HTMLElement;\n private prefixElem?: HTMLElement;\n private suffixElem?: HTMLElement;\n\n private debounceQuery: TDebounce<void>;\n\n private fallbackInputId = 'select';\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqSelectElement;\n @AttachInternals() internals!: ElementInternals;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() displayValue?: string;\n @State() hasHelperText = false;\n @State() selectedOptions: HTMLBqOptionElement[] = [];\n\n @State() hasLabel = false;\n @State() hasPrefix = false;\n @State() hasSuffix = false;\n @State() hasValue = false;\n\n // Public Property API\n // ========================\n\n /** If true, the Select input will be focused on component render */\n @Prop({ reflect: true }) autofocus: boolean;\n\n /** The clear button aria label */\n @Prop({ reflect: true }) clearButtonLabel? = 'Clear value';\n\n /**\n * The amount of time, in milliseconds, to wait before emitting the `bqInput` event after the input value changes.\n * A value of 0 means no debouncing will occur.\n */\n @Prop({ reflect: true, mutable: true }) debounceTime? = 0;\n\n /**\n * Indicates whether the Select input is disabled or not.\n * If `true`, the Select is disabled and cannot be interacted with.\n */\n @Prop({ mutable: true }) disabled?: boolean = false;\n\n /** If true, the clear button won't be displayed */\n @Prop({ reflect: true }) disableClear? = false;\n\n /** Represents the distance (gutter or margin) between the Select panel and the input element. */\n @Prop({ reflect: true }) distance?: number = 8;\n\n /** The ID of the form that the Select input belongs to. */\n @Prop({ reflect: true }) form?: string;\n\n /** If true, the Select panel will remain open after a selection is made. */\n @Prop({ reflect: true }) keepOpenOnSelect?: boolean = false;\n\n /** The Select input name. */\n @Prop({ reflect: true }) name!: string;\n\n /** The maximum number of tags to display when multiple selection is enabled */\n @Prop({ mutable: true }) maxTagsVisible: number = 2;\n\n /** If true, the Select input will allow multiple selections. */\n @Prop({ reflect: true }) multiple?: boolean = false;\n\n /** If true, the Select panel will be visible. */\n @Prop({ reflect: true, mutable: true }) open?: boolean = false;\n\n /** When set, it will override the height of the Select panel. */\n @Prop({ reflect: true }) panelHeight?: string;\n\n /** The Select input placeholder text value */\n @Prop({ reflect: true }) placeholder?: string;\n\n /** Position of the Select panel */\n @Prop({ reflect: true }) placement?: Placement = 'bottom';\n\n /** If true, the list of options cannot be filtered (searching won't be available) */\n @Prop({ reflect: true }) readonly?: boolean;\n\n /** Indicates whether or not the Select input is required to be filled out before submitting the form. */\n @Prop({ reflect: true }) required?: boolean;\n\n /** Whether the panel should have the Select same width as the input element */\n @Prop({ reflect: true }) sameWidth?: boolean = true;\n\n /** Represents the skidding between the Select panel and the input element. */\n @Prop({ reflect: true }) skidding?: number = 0;\n\n /** Defines the strategy to position the Select panel */\n @Prop({ reflect: true }) strategy?: 'fixed' | 'absolute' = 'fixed';\n\n /**\n * The validation status of the Select input.\n *\n * @remarks\n * This property is used to indicate the validation status of the select input. It can be set to one of the following values:\n * - `'none'`: No validation status is set.\n * - `'error'`: The input has a validation error.\n * - `'warning'`: The input has a validation warning.\n * - `'success'`: The input has passed validation.\n */\n @Prop({ reflect: true }) validationStatus: TInputValidation = 'none';\n\n /** The select input value, it can be used to reset the field to a previous value */\n @Prop({ reflect: true, mutable: true }) value: TSelectValue;\n\n // Prop lifecycle events\n // =======================\n\n @Watch('value')\n handleValueChange() {\n if (this.multiple && isString(this.value)) {\n // NOTE: we ensure that value is an array, changing the value will trigger Watch to execute thus the return\n this.value = Array.from(JSON.parse(String(this.value)));\n this.internals.setFormValue(this.value.join(','));\n return;\n }\n\n this.syncItemsFromValue();\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n /** Callback handler emitted when the Select input loses focus */\n @Event() bqBlur!: EventEmitter<HTMLBqSelectElement>;\n\n /** Callback handler emitted when the selected value has been cleared */\n @Event() bqClear!: EventEmitter<HTMLBqSelectElement>;\n\n /** Callback handler emitted when the Select input has received focus */\n @Event() bqFocus!: EventEmitter<HTMLBqSelectElement>;\n\n /** Callback handler emitted when the selected value has changed */\n @Event() bqSelect!: EventEmitter<{ value: string | number | string[]; item: HTMLBqOptionElement }>;\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n connectedCallback() {\n this.initMultipleValue();\n }\n\n componentWillLoad() {\n this.initMultipleValue();\n }\n\n componentDidLoad() {\n if (this.multiple && Array.isArray(this.value)) {\n this.selectedOptions = this.options.filter((item) => this.value.includes(item.value));\n }\n\n this.handleValueChange();\n }\n\n formAssociatedCallback() {\n this.internals.role = 'combobox';\n this.internals.ariaExpanded = this.open ? 'true' : 'false';\n }\n\n async formResetCallback() {\n if (isNil(this.value)) return;\n\n this.internals.setValidity({});\n this.clear();\n }\n\n // Listeners\n // ==============\n\n @Listen('bqOpen', { capture: true })\n handleOpenChange(ev: CustomEvent<{ open: boolean }>) {\n if (!ev.composedPath().includes(this.el)) return;\n\n this.open = ev.detail.open;\n }\n\n @Listen('bqFocus', { capture: true })\n @Listen('bqBlur', { capture: true })\n stopOptionFocusBlurPropagation(ev: CustomEvent) {\n // Stop propagation of focus and blur events coming from the `bq-option` elements\n if (isHTMLElement(ev.target, 'bq-select')) return;\n\n ev.stopPropagation();\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 /**\n * Clears the selected value.\n *\n * @return {Promise<void>}\n * @memberof BqSelect\n */\n @Method()\n async clear(): Promise<void> {\n if (this.disabled) return;\n\n const { multiple, inputElem, bqClear, el } = this;\n\n // Clear value and selected options\n this.value = undefined;\n this.selectedOptions = [];\n\n // Clear display value and input element if not multiple\n if (!multiple) {\n this.displayValue = undefined;\n inputElem.value = undefined;\n }\n\n // Update form value and reset options visibility\n this.resetOptionsVisibility();\n\n // Emit clear event\n bqClear.emit(el);\n }\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private initMultipleValue = () => {\n if (!this.multiple) return;\n\n this.value = Array.isArray(this.value) ? this.value : Array.from(JSON.parse(String(this.value)));\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 handleSelect = (ev: CustomEvent<{ value: TSelectValue; item: HTMLBqOptionElement }>) => {\n if (this.disabled) return;\n\n if (this.multiple) {\n ev.stopPropagation();\n }\n\n const { value, item } = ev.detail;\n\n if (this.multiple) {\n this.handleMultipleSelection(item);\n // Clear the input value after selecting an item\n this.inputElem.value = '';\n // If multiple selection is enabled, emit the selected items array instead of relying on\n // the option list to emit the value of the selected item\n this.bqSelect.emit({ value: this.value, item });\n } else {\n this.value = value;\n }\n\n this.resetOptionsVisibility();\n this.inputElem.focus();\n };\n\n private handleMultipleSelection = (item: HTMLBqOptionElement) => {\n // Set has O(1) complexity for insertion, deletion, and search operations, compared to an Array's O(n)\n const selectedOptionsSet = new Set(this.selectedOptions);\n\n if (selectedOptionsSet.has(item)) {\n selectedOptionsSet.delete(item);\n } else {\n selectedOptionsSet.add(item);\n }\n\n this.selectedOptions = Array.from(selectedOptionsSet);\n this.value = this.selectedOptions.map((item) => item.value);\n };\n\n private handleSearchFilter = (ev: Event) => {\n if (this.disabled) return;\n\n this.debounceQuery?.cancel();\n\n const query = (ev.target as HTMLInputElement).value?.toLowerCase().trim();\n\n if (!isDefined(query)) {\n this.clear();\n } else {\n this.debounceQuery = debounce(() => {\n this.options.forEach((item: HTMLBqOptionElement) => {\n const itemLabel = this.getOptionLabel(item).toLowerCase();\n item.hidden = !itemLabel.includes(query);\n });\n }, this.debounceTime);\n\n this.debounceQuery();\n }\n\n // The panel will close once a selection is made\n // so we need to make sure it's open when the user is typing and the query is not empty\n this.open = true;\n };\n\n private handleClearClick = (ev: CustomEvent) => {\n (async () => {\n await this.clear();\n })();\n this.inputElem.focus();\n\n ev.stopPropagation();\n };\n\n private handleTagRemove = (item: HTMLBqOptionElement) => {\n if (this.disabled) return;\n\n this.handleMultipleSelection(item);\n this.bqSelect.emit({ value: this.value, item });\n };\n\n private handleLabelSlotChange = () => {\n this.hasLabel = hasSlotContent(this.labelElem);\n };\n\n private handlePrefixSlotChange = () => {\n this.hasPrefix = hasSlotContent(this.prefixElem);\n };\n\n private handleSuffixSlotChange = () => {\n this.hasSuffix = hasSlotContent(this.suffixElem);\n };\n\n private handleHelperTextSlotChange = () => {\n this.hasHelperText = hasSlotContent(this.helperTextElem);\n };\n\n private resetOptionsVisibility = () => {\n this.options.forEach((item: HTMLBqOptionElement) => (item.hidden = false));\n };\n\n private syncItemsFromValue = () => {\n const { internals, options, value } = this;\n if (!options.length) return;\n\n // Sync selected state of the BqOption elements\n this.syncSelectedOptionsState();\n\n if (this.multiple) {\n // Sync selected options for multiple selection mode\n this.selectedOptions = options.filter((option) => this.value?.includes(option.value));\n } else {\n // Sync display label for single selection mode\n this.updateDisplayLabel();\n }\n\n internals.setFormValue(!isNil(value) ? `${value}` : undefined);\n };\n\n /**\n * Syncs the selected state of the BqOption elements which value is included in the `value` property.\n * Notice that value can be a string or an array of strings.\n *\n * @private\n * @memberof BqSelect\n */\n private syncSelectedOptionsState = () => {\n const { options, multiple, value } = this;\n const lowerCaseValue = String(value).toLowerCase();\n\n options.forEach((option: HTMLBqOptionElement) => {\n if (multiple && Array.isArray(value)) {\n option.selected = value.includes(option.value);\n } else {\n option.selected = option.value.toLowerCase() === lowerCaseValue;\n }\n });\n };\n\n /**\n * Updates the display value of the input element based on the selected option.\n *\n * @private\n * @memberof BqSelect\n */\n private updateDisplayLabel = () => {\n const { value, options, inputElem } = this;\n\n const checkedItem = options.find((item) => item.value === value);\n const displayValue = checkedItem ? this.getOptionLabel(checkedItem) : '';\n\n inputElem.value = displayValue;\n this.displayValue = displayValue;\n };\n\n private getOptionLabel = (item: HTMLBqOptionElement) => {\n if (!item) return;\n return item.innerText.trim() ?? '';\n };\n\n private get options() {\n return Array.from(this.el.querySelectorAll('bq-option'));\n }\n\n private get displayPlaceholder() {\n // Hide the placeholder when multiple selection is enabled and there are selected items\n return this.multiple && this.selectedOptions.length !== 0 ? undefined : this.placeholder;\n }\n\n private get displayTags() {\n return this.selectedOptions.map((item, index) => {\n if (index < this.maxTagsVisible || this.maxTagsVisible < 0) {\n return (\n <bq-tag\n key={item.value}\n removable\n size=\"xsmall\"\n variant=\"filled\"\n onBqClose={(event) => {\n // NOTE: prevents triggering bqClose on parent\n event.stopPropagation();\n this.handleTagRemove(item);\n }}\n // Prevent the tag from closing the panel when clicked\n onClick={(ev: MouseEvent) => ev.stopPropagation()}\n exportparts=\"wrapper:tag__base,prefix:tag__prefix,text:tag__text,btn-close:tag__btn-close\"\n part=\"tag\"\n >\n {this.getOptionLabel(item)}\n </bq-tag>\n );\n } else if (index === this.maxTagsVisible) {\n return (\n <bq-tag\n key=\"more\"\n size=\"xsmall\"\n variant=\"filled\"\n exportparts=\"wrapper:tag__base,prefix:tag__prefix,text:tag__text,btn-close:tag__btn-close\"\n part=\"tag\"\n >\n +{this.selectedOptions.length - index}\n </bq-tag>\n );\n }\n\n return null;\n });\n }\n\n private get hasClearIcon() {\n if (this.disableClear || this.disabled) {\n return false;\n }\n\n if (this.multiple) {\n return this.selectedOptions.length > 0;\n }\n\n return isDefined(this.displayValue);\n }\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n const labelId = `bq-select__label-${this.name || this.fallbackInputId}`;\n\n return (\n <div class=\"bq-select\" part=\"base\">\n {/* Label */}\n <label\n id={labelId}\n class={{ 'bq-select__label': true, '!hidden': !this.hasLabel }}\n aria-label={this.name || this.fallbackInputId}\n htmlFor={this.name || this.fallbackInputId}\n ref={(labelElem: HTMLSpanElement) => (this.labelElem = labelElem)}\n part=\"label\"\n >\n <slot name=\"label\" onSlotchange={this.handleLabelSlotChange} />\n </label>\n {/* Select dropdown */}\n <bq-dropdown\n class=\"bq-select__dropdown w-full\"\n disabled={this.disabled}\n distance={this.distance}\n keepOpenOnSelect={this.keepOpenOnSelect}\n open={this.open}\n panelHeight={this.panelHeight}\n placement={this.placement}\n sameWidth={this.sameWidth}\n skidding={this.skidding}\n strategy={this.strategy}\n exportparts=\"panel\"\n >\n {/* Input control group */}\n <div\n class={{\n 'bq-select__control': true,\n [`validation-${this.validationStatus}`]: true,\n disabled: this.disabled,\n }}\n part=\"control\"\n slot=\"trigger\"\n >\n {/* Prefix */}\n <span\n class={{ 'bq-select__control--prefix': true, '!hidden': !this.hasPrefix }}\n ref={(spanElem: HTMLSpanElement) => (this.prefixElem = spanElem)}\n part=\"prefix\"\n >\n <slot name=\"prefix\" onSlotchange={this.handlePrefixSlotChange} />\n </span>\n <div class=\"flex flex-1 overflow-x-auto\" part=\"input-outline\">\n {/* Display selected values using BqTags for multiple selection */}\n {this.multiple && (\n <span class=\"bq-select__tags\" part=\"tags\">\n <slot name=\"tags\">{this.displayTags}</slot>\n </span>\n )}\n {/* HTML Input */}\n <input\n id={this.name || this.fallbackInputId}\n class=\"bq-select__control--input flex-grow is-full\"\n autoComplete=\"off\"\n autoCapitalize=\"off\"\n aria-disabled={this.disabled ? 'true' : 'false'}\n aria-controls={`bq-options-${this.name}`}\n aria-expanded={this.open ? 'true' : 'false'}\n aria-haspopup=\"listbox\"\n disabled={this.disabled}\n form={this.form}\n name={this.name}\n placeholder={this.displayPlaceholder}\n ref={(inputElem: HTMLInputElement) => (this.inputElem = inputElem)}\n readOnly={this.readonly}\n required={this.required}\n role=\"combobox\"\n spellcheck={false}\n type=\"text\"\n value={this.displayValue}\n part=\"input\"\n // Events\n onBlur={this.handleBlur}\n onFocus={this.handleFocus}\n onInput={this.handleSearchFilter}\n />\n </div>\n {/* Clear Button */}\n {this.hasClearIcon && (\n // The clear button will be visible as long as the input has a value\n // and the parent group is hovered or has focus-within\n <bq-button\n class=\"bq-select__control--clear ms-[--bq-select--gap]\"\n appearance=\"text\"\n aria-label={this.clearButtonLabel}\n size=\"small\"\n onBqClick={this.handleClearClick}\n part=\"clear-btn\"\n exportparts=\"button\"\n tabIndex={-1}\n >\n <slot name=\"clear-icon\">\n <bq-icon name=\"x-circle\" class=\"flex\" />\n </slot>\n </bq-button>\n )}\n {/* Suffix */}\n <span\n class={{ 'bq-select__control--suffix': true, 'rotate-180': this.open, 'rotate-0': !this.open }}\n ref={(spanElem: HTMLSpanElement) => (this.suffixElem = spanElem)}\n part=\"suffix\"\n >\n <slot name=\"suffix\" onSlotchange={this.handleSuffixSlotChange}>\n <bq-icon name=\"caret-down\" class=\"flex\" />\n </slot>\n </span>\n </div>\n <bq-option-list\n id={`bq-options-${this.name}`}\n onBqSelect={this.handleSelect}\n aria-expanded={this.open ? 'true' : 'false'}\n exportparts=\"base:option-list\"\n role=\"listbox\"\n >\n <slot />\n </bq-option-list>\n </bq-dropdown>\n {/* Helper text */}\n <div\n class={{\n [`bq-select__helper-text validation-${this.validationStatus}`]: true,\n '!hidden': !this.hasHelperText,\n }}\n ref={(divElem: HTMLDivElement) => (this.helperTextElem = divElem)}\n part=\"helper-text\"\n >\n <slot name=\"helper-text\" onSlotchange={this.handleHelperTextSlotChange} />\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["bqSelectCss","BqSelectStyle0","BqSelect","helperTextElem","inputElem","labelElem","prefixElem","suffixElem","debounceQuery","fallbackInputId","internals","handleValueChange","this","multiple","isString","value","Array","from","JSON","parse","String","setFormValue","join","syncItemsFromValue","bqBlur","bqClear","bqFocus","bqSelect","connectedCallback","initMultipleValue","componentWillLoad","componentDidLoad","isArray","selectedOptions","options","filter","item","includes","formAssociatedCallback","role","ariaExpanded","open","formResetCallback","isNil","setValidity","clear","handleOpenChange","ev","composedPath","el","detail","stopOptionFocusBlurPropagation","isHTMLElement","target","stopPropagation","disabled","undefined","displayValue","resetOptionsVisibility","emit","handleBlur","handleFocus","handleSelect","handleMultipleSelection","focus","selectedOptionsSet","Set","has","delete","add","map","handleSearchFilter","cancel","query","toLowerCase","trim","isDefined","debounce","forEach","itemLabel","getOptionLabel","hidden","debounceTime","handleClearClick","handleTagRemove","handleLabelSlotChange","hasLabel","hasSlotContent","handlePrefixSlotChange","hasPrefix","handleSuffixSlotChange","hasSuffix","handleHelperTextSlotChange","hasHelperText","length","syncSelectedOptionsState","option","updateDisplayLabel","lowerCaseValue","selected","checkedItem","find","innerText","querySelectorAll","displayPlaceholder","placeholder","displayTags","index","maxTagsVisible","h","key","removable","size","variant","onBqClose","event","onClick","exportparts","part","hasClearIcon","disableClear","render","labelId","name","class","id","htmlFor","ref","onSlotchange","distance","keepOpenOnSelect","panelHeight","placement","sameWidth","skidding","strategy","validationStatus","slot","spanElem","autoComplete","autoCapitalize","form","readOnly","readonly","required","spellcheck","type","onBlur","onFocus","onInput","appearance","clearButtonLabel","onBqClick","tabIndex","onBqSelect","divElem"],"sources":["../../packages/beeq/src/components/select/scss/bq-select.scss?tag=bq-select&encapsulation=shadow","../../packages/beeq/src/components/select/bq-select.tsx"],"sourcesContent":["/* -------------------------------------------------------------------------- */\n/* Select styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-select.variables';\n\n:host {\n @apply block w-full;\n}\n\n/* -------------------------------------------------------------------------- */\n/* Label and Helper text */\n/* -------------------------------------------------------------------------- */\n\n.bq-select__label {\n @apply flex items-center m-be-[--bq-select--label-margin-bottom];\n @apply text-[length:--bq-select--label-text-size] text-[color:--bq-select--label-text-color];\n}\n\n.bq-select__helper-text {\n @apply text-[length:--bq-select--helper-text-size] text-[color:--bq-select--helper-text-color] m-bs-[--bq-select--helper-margin-top];\n}\n\n.bq-select__helper-text.validation-error {\n @apply text-text-danger;\n}\n\n.bq-select__helper-text.validation-success {\n @apply text-text-success;\n}\n\n.bq-select__helper-text.validation-warning {\n @apply text-text-warning;\n}\n\n/* -------------------------------------------------------------------------- */\n/* Select input group control */\n/* -------------------------------------------------------------------------- */\n\n.bq-select__dropdown:has(:focus-within, :focus-visible) {\n // The focus state will be controlled by the dropdown element\n // if any of its children has focus, the dropdown will set the focus state to the .bq-select__control\n .bq-select__control {\n --bq-ring-width: 1px;\n --bq-ring-offset-width: 0;\n --bq-ring-color-focus: var(--bq-select--border-color-focus);\n\n @apply focus border-[color:--bq-select--border-color-focus];\n }\n}\n\n.bq-select__control {\n @apply flex items-center transition-[border-color,box-shadow] is-full;\n // Border\n @apply rounded-[--bq-select--border-radius] border-[length:--bq-select--border-width] border-[color:--bq-select--border-color];\n // Padding\n @apply pe-[--bq-select--padding-end] ps-[--bq-select--padding-start] p-b-[var(--bq-select--paddingY)];\n // Text\n @apply select-none text-[length:--bq-select--text-size] text-[color:--bq-select--text-color] placeholder:text-[color:--bq-select--text-placeholder-color];\n // Hover\n @apply [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-brand;\n\n border-style: var(--bq-select--border-style);\n\n // Enable clear button whenever the input group control is hovered or has focus\n &:not(.disabled):hover,\n &:not(.disabled):focus-within {\n .bq-select__control--clear {\n @apply inline-block;\n }\n }\n}\n\n.bq-select__control.disabled {\n @apply cursor-not-allowed opacity-60;\n}\n\n/* ------------------------------- Validation ------------------------------- */\n\n.bq-select__control.validation-error {\n @apply border-stroke-danger [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-danger;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(colors.stroke.danger);\n\n @apply border-active-stroke-danger;\n }\n}\n\n.bq-select__control.validation-success {\n @apply border-stroke-success [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-success;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(colors.stroke.success);\n\n @apply border-active-stroke-success;\n }\n}\n\n.bq-select__control.validation-warning {\n @apply border-stroke-warning [&:not(.disabled):not(:focus-within)]:hover:border-hover-stroke-warning;\n\n &:not(.disabled):focus-within {\n --bq-ring-color-focus: theme(colors.stroke.warning);\n\n @apply border-active-stroke-warning;\n }\n}\n\n/* -------------------------------------------------------------------------- */\n/* Native HTML Input */\n/* -------------------------------------------------------------------------- */\n\n.bq-select__control--input {\n @apply flex-auto cursor-[inherit] select-none appearance-none bg-[inherit] font-[inherit] text-[length:inherit] text-[color:inherit];\n @apply m-0 border-none p-0 min-bs-[var(--bq-select--icon-size)] min-is-0 focus:outline-none focus-visible:outline-none;\n\n box-shadow: none;\n font-weight: inherit;\n}\n\n/* -------------------------------------------------------------------------- */\n/* Clear button */\n/* -------------------------------------------------------------------------- */\n\n.bq-select__control--clear::part(button) {\n // Since the clear button is inside the input group control,\n // we need to reset the focus ring styles\n --bq-ring-width: initial;\n --bq-ring-offset-width: initial;\n --bq-ring-color-focus: initial;\n\n @apply rounded-xs border-none p-0 bs-auto;\n}\n\n/* -------------------------------------------------------------------------- */\n/* Prefix and suffix */\n/* -------------------------------------------------------------------------- */\n\n.bq-select__control--prefix,\n.bq-select__control--suffix {\n @apply pointer-events-none flex items-center text-[color:var(--bq-select--text-color)];\n}\n\n.bq-select__control--prefix {\n @apply me-[--bq-select--gap];\n}\n\n.bq-select__control--suffix {\n @apply ms-[--bq-select--gap] transition-transform duration-300 ease-in-out;\n}\n\n.bq-select__tags {\n @apply me-xs2 flex flex-1 gap-xs2;\n\n bq-tag,\n ::slotted(bq-tag) {\n @apply inline-flex;\n }\n\n bq-tag::part(text) {\n @apply text-nowrap leading-small;\n }\n}\n\n/* -------------------------------------------------------------------------- */\n/* Slotted and internal icons */\n/* -------------------------------------------------------------------------- */\n\nbq-icon,\n::slotted(bq-icon) {\n --bq-icon--size: var(--bq-select--icon-size) !important;\n}\n","import {\n AttachInternals,\n Component,\n Element,\n Event,\n EventEmitter,\n h,\n Listen,\n Method,\n Prop,\n State,\n Watch,\n} from '@stencil/core';\n\nimport { Placement } from '../../services/interfaces';\nimport { debounce, hasSlotContent, isDefined, isHTMLElement, isNil, isString, TDebounce } from '../../shared/utils';\nimport { TInputValidation } from '../input/bq-input.types';\n\nexport type TSelectValue = string | string[];\n\n/**\n * @part base - The component's base wrapper.\n * @part button - The native HTML button used under the hood in the clear button.\n * @part clear-btn - The clear button.\n * @part control - The input control wrapper.\n * @part input-outline - The input outline wrapper that holds the tags container and the native HTML input used under the hood.\n * @part helper-text - The helper text slot container.\n * @part input - The native HTML input element used under the hood.\n * @part label - The label slot container.\n * @part panel - The select panel container\n * @part prefix - The prefix slot container.\n * @part suffix - The suffix slot container.\n * @part tags - The tags container of the BqTags for multiple selection.\n * @part tag - The tag container of the BqTag for multiple selection.\n * @part tag__base - The base wrapper of the BqTag for multiple selection.\n * @part tag__prefix - The prefix slot container of the BqTag for multiple selection.\n * @part tag__text - The text slot container of the BqTag for multiple selection.\n * @part tag__btn-close - The close button of the BqTag for multiple selection.\n * @part option-list - The option list container.\n */\n@Component({\n tag: 'bq-select',\n styleUrl: './scss/bq-select.scss',\n formAssociated: true,\n shadow: {\n delegatesFocus: true,\n },\n})\nexport class BqSelect {\n // Own Properties\n // ====================\n\n private helperTextElem?: HTMLElement;\n private inputElem?: HTMLInputElement;\n private labelElem?: HTMLElement;\n private prefixElem?: HTMLElement;\n private suffixElem?: HTMLElement;\n\n private debounceQuery: TDebounce<void>;\n\n private fallbackInputId = 'select';\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqSelectElement;\n @AttachInternals() internals!: ElementInternals;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() displayValue?: string;\n @State() hasHelperText = false;\n @State() selectedOptions: HTMLBqOptionElement[] = [];\n\n @State() hasLabel = false;\n @State() hasPrefix = false;\n @State() hasSuffix = false;\n @State() hasValue = false;\n\n // Public Property API\n // ========================\n\n /** If true, the Select input will be focused on component render */\n @Prop({ reflect: true }) autofocus: boolean;\n\n /** The clear button aria label */\n @Prop({ reflect: true }) clearButtonLabel? = 'Clear value';\n\n /**\n * The amount of time, in milliseconds, to wait before emitting the `bqInput` event after the input value changes.\n * A value of 0 means no debouncing will occur.\n */\n @Prop({ reflect: true, mutable: true }) debounceTime? = 0;\n\n /**\n * Indicates whether the Select input is disabled or not.\n * If `true`, the Select is disabled and cannot be interacted with.\n */\n @Prop({ mutable: true }) disabled?: boolean = false;\n\n /** If true, the clear button won't be displayed */\n @Prop({ reflect: true }) disableClear? = false;\n\n /** Represents the distance (gutter or margin) between the Select panel and the input element. */\n @Prop({ reflect: true }) distance?: number = 8;\n\n /** The ID of the form that the Select input belongs to. */\n @Prop({ reflect: true }) form?: string;\n\n /** If true, the Select panel will remain open after a selection is made. */\n @Prop({ reflect: true }) keepOpenOnSelect?: boolean = false;\n\n /** The Select input name. */\n @Prop({ reflect: true }) name!: string;\n\n /** The maximum number of tags to display when multiple selection is enabled */\n @Prop({ mutable: true }) maxTagsVisible: number = 2;\n\n /** If true, the Select input will allow multiple selections. */\n @Prop({ reflect: true }) multiple?: boolean = false;\n\n /** If true, the Select panel will be visible. */\n @Prop({ reflect: true, mutable: true }) open?: boolean = false;\n\n /** When set, it will override the height of the Select panel. */\n @Prop({ reflect: true }) panelHeight?: string;\n\n /** The Select input placeholder text value */\n @Prop({ reflect: true }) placeholder?: string;\n\n /** Position of the Select panel */\n @Prop({ reflect: true }) placement?: Placement = 'bottom';\n\n /** If true, the list of options cannot be filtered (searching won't be available) */\n @Prop({ reflect: true }) readonly?: boolean;\n\n /** Indicates whether or not the Select input is required to be filled out before submitting the form. */\n @Prop({ reflect: true }) required?: boolean;\n\n /** Whether the panel should have the Select same width as the input element */\n @Prop({ reflect: true }) sameWidth?: boolean = true;\n\n /** Represents the skidding between the Select panel and the input element. */\n @Prop({ reflect: true }) skidding?: number = 0;\n\n /** Defines the strategy to position the Select panel */\n @Prop({ reflect: true }) strategy?: 'fixed' | 'absolute' = 'fixed';\n\n /**\n * The validation status of the Select input.\n *\n * @remarks\n * This property is used to indicate the validation status of the select input. It can be set to one of the following values:\n * - `'none'`: No validation status is set.\n * - `'error'`: The input has a validation error.\n * - `'warning'`: The input has a validation warning.\n * - `'success'`: The input has passed validation.\n */\n @Prop({ reflect: true }) validationStatus: TInputValidation = 'none';\n\n /** The select input value, it can be used to reset the field to a previous value */\n @Prop({ reflect: true, mutable: true }) value: TSelectValue;\n\n // Prop lifecycle events\n // =======================\n\n @Watch('value')\n handleValueChange() {\n if (this.multiple && isString(this.value)) {\n // NOTE: we ensure that value is an array, changing the value will trigger Watch to execute thus the return\n this.value = Array.from(JSON.parse(String(this.value)));\n this.internals.setFormValue(this.value.join(','));\n return;\n }\n\n this.syncItemsFromValue();\n }\n\n // Events section\n // Requires JSDocs for public API documentation\n // ==============================================\n\n /** Callback handler emitted when the Select input loses focus */\n @Event() bqBlur!: EventEmitter<HTMLBqSelectElement>;\n\n /** Callback handler emitted when the selected value has been cleared */\n @Event() bqClear!: EventEmitter<HTMLBqSelectElement>;\n\n /** Callback handler emitted when the Select input has received focus */\n @Event() bqFocus!: EventEmitter<HTMLBqSelectElement>;\n\n /** Callback handler emitted when the selected value has changed */\n @Event() bqSelect!: EventEmitter<{ value: string | number | string[]; item: HTMLBqOptionElement }>;\n\n // Component lifecycle events\n // Ordered by their natural call order\n // =====================================\n\n connectedCallback() {\n this.initMultipleValue();\n }\n\n componentWillLoad() {\n this.initMultipleValue();\n }\n\n componentDidLoad() {\n if (this.multiple && Array.isArray(this.value)) {\n this.selectedOptions = this.options.filter((item) => this.value.includes(item.value));\n }\n\n this.handleValueChange();\n }\n\n formAssociatedCallback() {\n this.internals.role = 'combobox';\n this.internals.ariaExpanded = this.open ? 'true' : 'false';\n }\n\n async formResetCallback() {\n if (isNil(this.value)) return;\n\n this.internals.setValidity({});\n this.clear();\n }\n\n // Listeners\n // ==============\n\n @Listen('bqOpen', { capture: true })\n handleOpenChange(ev: CustomEvent<{ open: boolean }>) {\n if (!ev.composedPath().includes(this.el)) return;\n\n this.open = ev.detail.open;\n }\n\n @Listen('bqFocus', { capture: true })\n @Listen('bqBlur', { capture: true })\n stopOptionFocusBlurPropagation(ev: CustomEvent) {\n // Stop propagation of focus and blur events coming from the `bq-option` elements\n if (isHTMLElement(ev.target, 'bq-select')) return;\n\n ev.stopPropagation();\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 /**\n * Clears the selected value.\n *\n * @return {Promise<void>}\n * @memberof BqSelect\n */\n @Method()\n async clear(): Promise<void> {\n if (this.disabled) return;\n\n const { multiple, inputElem, bqClear, el } = this;\n\n // Clear value and selected options\n this.value = undefined;\n this.selectedOptions = [];\n\n // Clear display value and input element if not multiple\n if (!multiple) {\n this.displayValue = undefined;\n inputElem.value = undefined;\n }\n\n // Update form value and reset options visibility\n this.resetOptionsVisibility();\n\n // Emit clear event\n bqClear.emit(el);\n }\n\n // Local methods\n // Internal business logic.\n // These methods cannot be called from the host element.\n // =======================================================\n\n private initMultipleValue = () => {\n if (!this.multiple) return;\n\n this.value = Array.isArray(this.value) ? this.value : Array.from(JSON.parse(String(this.value)));\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 handleSelect = (ev: CustomEvent<{ value: TSelectValue; item: HTMLBqOptionElement }>) => {\n if (this.disabled) return;\n\n if (this.multiple) {\n ev.stopPropagation();\n }\n\n const { value, item } = ev.detail;\n\n if (this.multiple) {\n this.handleMultipleSelection(item);\n // Clear the input value after selecting an item\n this.inputElem.value = '';\n // If multiple selection is enabled, emit the selected items array instead of relying on\n // the option list to emit the value of the selected item\n this.bqSelect.emit({ value: this.value, item });\n } else {\n this.value = value;\n }\n\n this.resetOptionsVisibility();\n this.inputElem.focus();\n };\n\n private handleMultipleSelection = (item: HTMLBqOptionElement) => {\n // Set has O(1) complexity for insertion, deletion, and search operations, compared to an Array's O(n)\n const selectedOptionsSet = new Set(this.selectedOptions);\n\n if (selectedOptionsSet.has(item)) {\n selectedOptionsSet.delete(item);\n } else {\n selectedOptionsSet.add(item);\n }\n\n this.selectedOptions = Array.from(selectedOptionsSet);\n this.value = this.selectedOptions.map((item) => item.value);\n };\n\n private handleSearchFilter = (ev: Event) => {\n if (this.disabled) return;\n\n this.debounceQuery?.cancel();\n\n const query = (ev.target as HTMLInputElement).value?.toLowerCase().trim();\n\n if (!isDefined(query)) {\n this.clear();\n } else {\n this.debounceQuery = debounce(() => {\n this.options.forEach((item: HTMLBqOptionElement) => {\n const itemLabel = this.getOptionLabel(item).toLowerCase();\n item.hidden = !itemLabel.includes(query);\n });\n }, this.debounceTime);\n\n this.debounceQuery();\n }\n\n // The panel will close once a selection is made\n // so we need to make sure it's open when the user is typing and the query is not empty\n this.open = true;\n };\n\n private handleClearClick = (ev: CustomEvent) => {\n (async () => {\n await this.clear();\n })();\n this.inputElem.focus();\n\n ev.stopPropagation();\n };\n\n private handleTagRemove = (item: HTMLBqOptionElement) => {\n if (this.disabled) return;\n\n this.handleMultipleSelection(item);\n this.bqSelect.emit({ value: this.value, item });\n };\n\n private handleLabelSlotChange = () => {\n this.hasLabel = hasSlotContent(this.labelElem);\n };\n\n private handlePrefixSlotChange = () => {\n this.hasPrefix = hasSlotContent(this.prefixElem);\n };\n\n private handleSuffixSlotChange = () => {\n this.hasSuffix = hasSlotContent(this.suffixElem);\n };\n\n private handleHelperTextSlotChange = () => {\n this.hasHelperText = hasSlotContent(this.helperTextElem);\n };\n\n private resetOptionsVisibility = () => {\n this.options.forEach((item: HTMLBqOptionElement) => (item.hidden = false));\n };\n\n private syncItemsFromValue = () => {\n const { internals, options, value } = this;\n if (!options.length) return;\n\n // Sync selected state of the BqOption elements\n this.syncSelectedOptionsState();\n\n if (this.multiple) {\n // Sync selected options for multiple selection mode\n this.selectedOptions = options.filter((option) => this.value?.includes(option.value));\n } else {\n // Sync display label for single selection mode\n this.updateDisplayLabel();\n }\n\n internals.setFormValue(!isNil(value) ? `${value}` : undefined);\n };\n\n /**\n * Syncs the selected state of the BqOption elements which value is included in the `value` property.\n * Notice that value can be a string or an array of strings.\n *\n * @private\n * @memberof BqSelect\n */\n private syncSelectedOptionsState = () => {\n const { options, multiple, value } = this;\n const lowerCaseValue = String(value).toLowerCase();\n\n options.forEach((option: HTMLBqOptionElement) => {\n if (multiple && Array.isArray(value)) {\n option.selected = value.includes(option.value);\n } else {\n option.selected = option.value.toLowerCase() === lowerCaseValue;\n }\n });\n };\n\n /**\n * Updates the display value of the input element based on the selected option.\n *\n * @private\n * @memberof BqSelect\n */\n private updateDisplayLabel = () => {\n const { value, options, inputElem } = this;\n\n const checkedItem = options.find((item) => item.value === value);\n const displayValue = checkedItem ? this.getOptionLabel(checkedItem) : '';\n\n inputElem.value = displayValue;\n this.displayValue = displayValue;\n };\n\n private getOptionLabel = (item: HTMLBqOptionElement) => {\n if (!item) return;\n return item.innerText.trim() ?? '';\n };\n\n private get options() {\n return Array.from(this.el.querySelectorAll('bq-option'));\n }\n\n private get displayPlaceholder() {\n // Hide the placeholder when multiple selection is enabled and there are selected items\n return this.multiple && this.selectedOptions.length !== 0 ? undefined : this.placeholder;\n }\n\n private get displayTags() {\n return this.selectedOptions.map((item, index) => {\n if (index < this.maxTagsVisible || this.maxTagsVisible < 0) {\n return (\n <bq-tag\n key={item.value}\n removable\n size=\"xsmall\"\n variant=\"filled\"\n onBqClose={(event) => {\n // NOTE: prevents triggering bqClose on parent\n event.stopPropagation();\n this.handleTagRemove(item);\n }}\n // Prevent the tag from closing the panel when clicked\n onClick={(ev: MouseEvent) => ev.stopPropagation()}\n exportparts=\"wrapper:tag__base,prefix:tag__prefix,text:tag__text,btn-close:tag__btn-close\"\n part=\"tag\"\n >\n {this.getOptionLabel(item)}\n </bq-tag>\n );\n } else if (index === this.maxTagsVisible) {\n return (\n <bq-tag\n key=\"more\"\n size=\"xsmall\"\n variant=\"filled\"\n exportparts=\"wrapper:tag__base,prefix:tag__prefix,text:tag__text,btn-close:tag__btn-close\"\n part=\"tag\"\n >\n +{this.selectedOptions.length - index}\n </bq-tag>\n );\n }\n\n return null;\n });\n }\n\n private get hasClearIcon() {\n if (this.disableClear || this.disabled) {\n return false;\n }\n\n if (this.multiple) {\n return this.selectedOptions.length > 0;\n }\n\n return isDefined(this.displayValue);\n }\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n const labelId = `bq-select__label-${this.name || this.fallbackInputId}`;\n\n return (\n <div class=\"bq-select\" part=\"base\">\n {/* Label */}\n <label\n id={labelId}\n class={{ 'bq-select__label': true, '!hidden': !this.hasLabel }}\n aria-label={this.name || this.fallbackInputId}\n htmlFor={this.name || this.fallbackInputId}\n ref={(labelElem: HTMLSpanElement) => (this.labelElem = labelElem)}\n part=\"label\"\n >\n <slot name=\"label\" onSlotchange={this.handleLabelSlotChange} />\n </label>\n {/* Select dropdown */}\n <bq-dropdown\n class=\"bq-select__dropdown w-full\"\n disabled={this.disabled}\n distance={this.distance}\n keepOpenOnSelect={this.keepOpenOnSelect}\n open={this.open}\n panelHeight={this.panelHeight}\n placement={this.placement}\n sameWidth={this.sameWidth}\n skidding={this.skidding}\n strategy={this.strategy}\n exportparts=\"panel\"\n >\n {/* Input control group */}\n <div\n class={{\n 'bq-select__control': true,\n [`validation-${this.validationStatus}`]: true,\n disabled: this.disabled,\n }}\n part=\"control\"\n slot=\"trigger\"\n >\n {/* Prefix */}\n <span\n class={{ 'bq-select__control--prefix': true, '!hidden': !this.hasPrefix }}\n ref={(spanElem: HTMLSpanElement) => (this.prefixElem = spanElem)}\n part=\"prefix\"\n >\n <slot name=\"prefix\" onSlotchange={this.handlePrefixSlotChange} />\n </span>\n <div class=\"flex flex-1 overflow-x-auto\" part=\"input-outline\">\n {/* Display selected values using BqTags for multiple selection */}\n {this.multiple && (\n <span class=\"bq-select__tags\" part=\"tags\">\n <slot name=\"tags\">{this.displayTags}</slot>\n </span>\n )}\n {/* HTML Input */}\n <input\n id={this.name || this.fallbackInputId}\n class=\"bq-select__control--input flex-grow is-full\"\n autoComplete=\"off\"\n autoCapitalize=\"off\"\n aria-disabled={this.disabled ? 'true' : 'false'}\n aria-controls={`bq-options-${this.name}`}\n aria-expanded={this.open ? 'true' : 'false'}\n aria-haspopup=\"listbox\"\n disabled={this.disabled}\n form={this.form}\n name={this.name}\n placeholder={this.displayPlaceholder}\n ref={(inputElem: HTMLInputElement) => (this.inputElem = inputElem)}\n readOnly={this.readonly}\n required={this.required}\n role=\"combobox\"\n spellcheck={false}\n type=\"text\"\n value={this.displayValue}\n part=\"input\"\n // Events\n onBlur={this.handleBlur}\n onFocus={this.handleFocus}\n onInput={this.handleSearchFilter}\n />\n </div>\n {/* Clear Button */}\n {this.hasClearIcon && (\n // The clear button will be visible as long as the input has a value\n // and the parent group is hovered or has focus-within\n <bq-button\n class=\"bq-select__control--clear ms-[--bq-select--gap]\"\n appearance=\"text\"\n aria-label={this.clearButtonLabel}\n size=\"small\"\n onBqClick={this.handleClearClick}\n part=\"clear-btn\"\n exportparts=\"button\"\n tabIndex={-1}\n >\n <slot name=\"clear-icon\">\n <bq-icon name=\"x-circle\" class=\"flex\" />\n </slot>\n </bq-button>\n )}\n {/* Suffix */}\n <span\n class={{ 'bq-select__control--suffix': true, 'rotate-180': this.open, 'rotate-0': !this.open }}\n ref={(spanElem: HTMLSpanElement) => (this.suffixElem = spanElem)}\n part=\"suffix\"\n >\n <slot name=\"suffix\" onSlotchange={this.handleSuffixSlotChange}>\n <bq-icon name=\"caret-down\" class=\"flex\" />\n </slot>\n </span>\n </div>\n <bq-option-list\n id={`bq-options-${this.name}`}\n onBqSelect={this.handleSelect}\n aria-expanded={this.open ? 'true' : 'false'}\n exportparts=\"base:option-list\"\n role=\"listbox\"\n >\n <slot />\n </bq-option-list>\n </bq-dropdown>\n {/* Helper text */}\n <div\n class={{\n [`bq-select__helper-text validation-${this.validationStatus}`]: true,\n '!hidden': !this.hasHelperText,\n }}\n ref={(divElem: HTMLDivElement) => (this.helperTextElem = divElem)}\n part=\"helper-text\"\n >\n <slot name=\"helper-text\" onSlotchange={this.handleHelperTextSlotChange} />\n </div>\n </div>\n );\n }\n}\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -4,9 +4,7 @@
|
|
|
4
4
|
*/
|
|
5
5
|
import { r as a, g as r, h as b, a as e } from "./p-01df4baa.js";
|
|
6
6
|
|
|
7
|
-
import "./p-
|
|
8
|
-
|
|
9
|
-
import { g as q } from "./p-5a9a73a0.js";
|
|
7
|
+
import { g as q } from "./p-edfd9767.js";
|
|
10
8
|
|
|
11
9
|
import { i as n } from "./p-99829fc7.js";
|
|
12
10
|
|
|
@@ -133,4 +131,4 @@ const l = class {
|
|
|
133
131
|
l.style = s;
|
|
134
132
|
|
|
135
133
|
export { l as bq_badge };
|
|
136
|
-
//# sourceMappingURL=p-
|
|
134
|
+
//# sourceMappingURL=p-5ff6621d.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["BADGE_SIZE","bqBadgeCss","BqBadgeStyle0","BqBadge","spanElement","observer","MutationObserver","mutations","mutation","this","contentLength","target","textContent","length","handleSizePropChange","validatePropValue","el","componentWillLoad","disconnectedCallback","disconnect","onSlotChange","slot","isNil","getTextContent","recurse","node","assignedNodes","flatten","takeRecords","observe","characterData","childList","subtree","querySelector","render","styles","backgroundColor","getColorCSSVariable","textColor","h","Host","key","style","class","size","digit","part","ref","element","onSlotchange"],"sources":["../../packages/beeq/src/components/badge/bq-badge.types.ts","../../packages/beeq/src/components/badge/scss/bq-badge.scss?tag=bq-badge&encapsulation=shadow","../../packages/beeq/src/components/badge/bq-badge.tsx"],"sourcesContent":["export const BADGE_SIZE = ['small', 'medium'] as const;\nexport type TBadgeSize = (typeof BADGE_SIZE)[number];\n","/* -------------------------------------------------------------------------- */\n/* Badge styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-badge.variables';\n\n:host {\n @apply inline-block;\n}\n\n.bq-badge {\n @apply flex items-center justify-center bg-[color:--bq-badge--background-color] text-[color:--bq-badge--text-color];\n @apply rounded-[--bq-badge--border-radius] border-[length:--bq-badge--border-width] border-[color:--bq-badge--border-color];\n\n border-style: var(--bq-badge--border-style);\n box-shadow: var(--bq-badge--box-shadow);\n}\n\n.size {\n &--small {\n @apply bs-[--bq-badge--size-small] is-[--bq-badge--size-small];\n }\n\n &--medium {\n @apply bs-[--bq-badge--size-medium] is-[--bq-badge--size-medium];\n }\n}\n\n.digit {\n @apply min-bs-[--bq-badge--size-large] min-is-[--bq-badge--size-large];\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport { BADGE_SIZE, TBadgeSize } from './bq-badge.types';\nimport { getColorCSSVariable, getTextContent, isNil, validatePropValue } from '../../shared/utils';\n\n/**\n * @part base - The component's internal wrapper that holds the count.\n * @part number - The component's internal wrapper that holds the slot.\n */\n@Component({\n tag: 'bq-badge',\n styleUrl: './scss/bq-badge.scss',\n shadow: true,\n})\nexport class BqBadge {\n // Own Properties\n // ====================\n\n private spanElement?: HTMLSpanElement;\n\n private observer: MutationObserver = new MutationObserver((mutations) => {\n const [mutation] = mutations;\n this.contentLength = mutation.target.textContent.length;\n });\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el: HTMLBqBadgeElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private contentLength = 0;\n\n // Public Property API\n // ========================\n\n /** Badge background color. The value should be a valid value of the palette color */\n @Prop({ mutable: true, reflect: true }) backgroundColor? = 'ui--danger';\n\n /** Badge number color. The value should be a valid value of the palette color */\n @Prop({ mutable: true, reflect: true }) textColor? = 'text--inverse';\n\n /** The size of the badge. Relevant if badge has no content. */\n @Prop({ reflect: true, mutable: true }) size?: TBadgeSize = 'small';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('size')\n handleSizePropChange() {\n validatePropValue(BADGE_SIZE, 'small', this.el, 'size');\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 componentWillLoad() {\n this.handleSizePropChange();\n }\n\n disconnectedCallback() {\n this.observer?.disconnect();\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 onSlotChange = () => {\n const slot = this.slot;\n\n if (isNil(slot)) return;\n\n this.contentLength = getTextContent(slot, { recurse: true }).length;\n const [node] = slot.assignedNodes({ flatten: true });\n\n if (isNil(node)) {\n this.observer.takeRecords();\n return;\n }\n\n this.observer.observe(node, {\n characterData: true,\n childList: true,\n subtree: true,\n });\n };\n\n private get slot(): HTMLSlotElement | null {\n return this.spanElement?.querySelector('slot') ?? null;\n }\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n const styles = {\n ...(this.backgroundColor && { '--bq-badge--background-color': getColorCSSVariable(this.backgroundColor) }),\n ...(this.textColor && { '--bq-badge--text-color': getColorCSSVariable(this.textColor) }),\n };\n\n return (\n <Host style={styles}>\n <div\n class={{\n 'bq-badge': true,\n [`size--${this.size}`]: this.contentLength === 0,\n digit: this.contentLength > 0,\n 'p-i-xs2': this.contentLength > 1,\n }}\n part=\"base\"\n >\n <span ref={(element) => (this.spanElement = element)} class=\"text-xs font-bold leading-small\" part=\"number\">\n <slot onSlotchange={this.onSlotChange}></slot>\n </span>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["BADGE_SIZE","bqBadgeCss","BqBadgeStyle0","BqBadge","spanElement","observer","MutationObserver","mutations","mutation","this","contentLength","target","textContent","length","handleSizePropChange","validatePropValue","el","componentWillLoad","disconnectedCallback","disconnect","onSlotChange","slot","isNil","getTextContent","recurse","node","assignedNodes","flatten","takeRecords","observe","characterData","childList","subtree","querySelector","render","styles","backgroundColor","getColorCSSVariable","textColor","h","Host","key","style","class","size","digit","part","ref","element","onSlotchange"],"sources":["../../packages/beeq/src/components/badge/bq-badge.types.ts","../../packages/beeq/src/components/badge/scss/bq-badge.scss?tag=bq-badge&encapsulation=shadow","../../packages/beeq/src/components/badge/bq-badge.tsx"],"sourcesContent":["export const BADGE_SIZE = ['small', 'medium'] as const;\nexport type TBadgeSize = (typeof BADGE_SIZE)[number];\n","/* -------------------------------------------------------------------------- */\n/* Badge styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-badge.variables';\n\n:host {\n @apply inline-block;\n}\n\n.bq-badge {\n @apply flex items-center justify-center bg-[color:--bq-badge--background-color] text-[color:--bq-badge--text-color];\n @apply rounded-[--bq-badge--border-radius] border-[length:--bq-badge--border-width] border-[color:--bq-badge--border-color];\n\n border-style: var(--bq-badge--border-style);\n box-shadow: var(--bq-badge--box-shadow);\n}\n\n.size {\n &--small {\n @apply bs-[--bq-badge--size-small] is-[--bq-badge--size-small];\n }\n\n &--medium {\n @apply bs-[--bq-badge--size-medium] is-[--bq-badge--size-medium];\n }\n}\n\n.digit {\n @apply min-bs-[--bq-badge--size-large] min-is-[--bq-badge--size-large];\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport { BADGE_SIZE, TBadgeSize } from './bq-badge.types';\nimport { getColorCSSVariable, getTextContent, isNil, validatePropValue } from '../../shared/utils';\n\n/**\n * @part base - The component's internal wrapper that holds the count.\n * @part number - The component's internal wrapper that holds the slot.\n */\n@Component({\n tag: 'bq-badge',\n styleUrl: './scss/bq-badge.scss',\n shadow: true,\n})\nexport class BqBadge {\n // Own Properties\n // ====================\n\n private spanElement?: HTMLSpanElement;\n\n private observer: MutationObserver = new MutationObserver((mutations) => {\n const [mutation] = mutations;\n this.contentLength = mutation.target.textContent.length;\n });\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el: HTMLBqBadgeElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() private contentLength = 0;\n\n // Public Property API\n // ========================\n\n /** Badge background color. The value should be a valid value of the palette color */\n @Prop({ mutable: true, reflect: true }) backgroundColor? = 'ui--danger';\n\n /** Badge number color. The value should be a valid value of the palette color */\n @Prop({ mutable: true, reflect: true }) textColor? = 'text--inverse';\n\n /** The size of the badge. Relevant if badge has no content. */\n @Prop({ reflect: true, mutable: true }) size?: TBadgeSize = 'small';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('size')\n handleSizePropChange() {\n validatePropValue(BADGE_SIZE, 'small', this.el, 'size');\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 componentWillLoad() {\n this.handleSizePropChange();\n }\n\n disconnectedCallback() {\n this.observer?.disconnect();\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 onSlotChange = () => {\n const slot = this.slot;\n\n if (isNil(slot)) return;\n\n this.contentLength = getTextContent(slot, { recurse: true }).length;\n const [node] = slot.assignedNodes({ flatten: true });\n\n if (isNil(node)) {\n this.observer.takeRecords();\n return;\n }\n\n this.observer.observe(node, {\n characterData: true,\n childList: true,\n subtree: true,\n });\n };\n\n private get slot(): HTMLSlotElement | null {\n return this.spanElement?.querySelector('slot') ?? null;\n }\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n const styles = {\n ...(this.backgroundColor && { '--bq-badge--background-color': getColorCSSVariable(this.backgroundColor) }),\n ...(this.textColor && { '--bq-badge--text-color': getColorCSSVariable(this.textColor) }),\n };\n\n return (\n <Host style={styles}>\n <div\n class={{\n 'bq-badge': true,\n [`size--${this.size}`]: this.contentLength === 0,\n digit: this.contentLength > 0,\n 'p-i-xs2': this.contentLength > 1,\n }}\n part=\"base\"\n >\n <span ref={(element) => (this.spanElement = element)} class=\"text-xs font-bold leading-small\" part=\"number\">\n <slot onSlotchange={this.onSlotChange}></slot>\n </span>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":";;;;;;;;;;;;;;AAAO,MAAMA,IAAa,EAAC,SAAS;;ACApC,MAAMC,IAAa;;AACnB,MAAAC,IAAeD;;MCaFE,IAAO;;;yBAoBe;2BAM0B;qBAGN;gBAGO;;;;EA5BpDC;EAEAC,SAA6B,IAAIC,kBAAkBC;IACzD,OAAOC,KAAYD;IACnBE,KAAKC,gBAAgBF,EAASG,OAAOC,YAAYC;AAAM;;;;;;EA8BzD,oBAAAC;IACEC,EAAkBf,GAAY,SAASS,KAAKO,IAAI;;;;;;;;EAWlD,iBAAAC;IACER,KAAKK;;EAGP,oBAAAI;IACET,KAAKJ,UAAUc;;;;;;;;;;;;;;EAkBTC,aAAe;IACrB,MAAMC,IAAOZ,KAAKY;IAElB,IAAIC,EAAMD,IAAO;IAEjBZ,KAAKC,gBAAgBa,EAAeF,GAAM;MAAEG,SAAS;OAAQX;IAC7D,OAAOY,KAAQJ,EAAKK,cAAc;MAAEC,SAAS;;IAE7C,IAAIL,EAAMG,IAAO;MACfhB,KAAKJ,SAASuB;MACd;;IAGFnB,KAAKJ,SAASwB,QAAQJ,GAAM;MAC1BK,eAAe;MACfC,WAAW;MACXC,SAAS;;AACT;EAGJ,QAAYX;IACV,OAAOZ,KAAKL,aAAa6B,cAAc,WAAW;;;;;EAOpD,MAAAC;IACE,MAAMC,IAAS;SACT1B,KAAK2B,mBAAmB;QAAE,gCAAgCC,EAAoB5B,KAAK2B;;SACnF3B,KAAK6B,aAAa;QAAE,0BAA0BD,EAAoB5B,KAAK6B;;;IAG7E,OACEC,EAACC,GAAI;MAAAC,KAAA;MAACC,OAAOP;OACXI,EAAA;MAAAE,KAAA;MACEE,OAAO;QACL,YAAY;QACZ,CAAC,SAASlC,KAAKmC,SAASnC,KAAKC,kBAAkB;QAC/CmC,OAAOpC,KAAKC,gBAAgB;QAC5B,WAAWD,KAAKC,gBAAgB;;MAElCoC,MAAK;OAELP,EAAA;MAAAE,KAAA;MAAMM,KAAMC,KAAavC,KAAKL,cAAc4C;MAAUL,OAAM;MAAkCG,MAAK;OACjGP,EAAA;MAAAE,KAAA;MAAMQ,cAAcxC,KAAKW","ignoreList":[]}
|
|
@@ -4,8 +4,6 @@
|
|
|
4
4
|
*/
|
|
5
5
|
import { r as a, g as r, h as b, a as e } from "./p-01df4baa.js";
|
|
6
6
|
|
|
7
|
-
import "./p-a84d4562.js";
|
|
8
|
-
|
|
9
7
|
import { v as q } from "./p-687da041.js";
|
|
10
8
|
|
|
11
9
|
const n = [ "default", "minimal" ];
|
|
@@ -84,4 +82,4 @@ const d = class {
|
|
|
84
82
|
d.style = i;
|
|
85
83
|
|
|
86
84
|
export { d as bq_card };
|
|
87
|
-
//# sourceMappingURL=p-
|
|
85
|
+
//# sourceMappingURL=p-60cbc966.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["CARD_TYPE","bqCardCss","BqCardStyle0","BqCard","checkPropValue","validatePropValue","this","el","componentWillLoad","render","style","border","h","Host","key","class","type","part"],"sources":["../../packages/beeq/src/components/card/bq-card.types.ts","../../packages/beeq/src/components/card/scss/bq-card.scss?tag=bq-card&encapsulation=shadow","../../packages/beeq/src/components/card/bq-card.tsx"],"sourcesContent":["export const CARD_TYPE = ['default', 'minimal'] as const;\nexport type TCardType = (typeof CARD_TYPE)[number];\n\nexport const CARD_BORDER_RADIUS = ['none', 'xs2', 'xs', 's', 'm', 'l', 'full'] as const;\nexport type TCardBorderRadius = (typeof CARD_BORDER_RADIUS)[number];\n","/* -------------------------------------------------------------------------- */\n/* Card styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-card.variables';\n\n:host {\n @apply block;\n}\n\n.bq-card {\n border-style: var(--bq-card--borderStyle);\n}\n","import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\n\nimport { CARD_TYPE, TCardBorderRadius, TCardType } from './bq-card.types';\nimport { validatePropValue } from '../../shared/utils';\n\n/**\n * @part wrapper - The wrapper container `<div>` of the element inside the shadow DOM\n */\n@Component({\n tag: 'bq-card',\n styleUrl: './scss/bq-card.scss',\n shadow: true,\n})\nexport class BqCard {\n // Own Properties\n // ====================\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqCardElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n // Public Property API\n // ========================\n\n /** Type of card component */\n @Prop({ reflect: true }) type: TCardType = 'default';\n\n /** The corner radius of the card component */\n @Prop({ reflect: true }) border: TCardBorderRadius = 'm';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('type')\n checkPropValue() {\n validatePropValue(CARD_TYPE, 'default', this.el, 'type');\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 componentWillLoad() {\n this.checkPropValue();\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 const style = {\n ...(this.border && { '--bq-card--borderRadius': `var(--bq-radius--${this.border})` }),\n };\n return (\n <Host style={style}>\n <div\n class={{\n 'bq-card rounded-[--bq-card--borderRadius] border-[length:--bq-card--borderWidth] border-[color:--bq-card--borderColor] bg-[--bq-card--background]':\n true,\n 'p-b-[--bq-card--padding] p-i-[--bq-card--padding]': this.type === 'default',\n // Remove padding for minimal card type\n 'p-b-0 p-i-0': this.type === 'minimal',\n }}\n part=\"wrapper\"\n >\n <slot />\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["CARD_TYPE","bqCardCss","BqCardStyle0","BqCard","checkPropValue","validatePropValue","this","el","componentWillLoad","render","style","border","h","Host","key","class","type","part"],"sources":["../../packages/beeq/src/components/card/bq-card.types.ts","../../packages/beeq/src/components/card/scss/bq-card.scss?tag=bq-card&encapsulation=shadow","../../packages/beeq/src/components/card/bq-card.tsx"],"sourcesContent":["export const CARD_TYPE = ['default', 'minimal'] as const;\nexport type TCardType = (typeof CARD_TYPE)[number];\n\nexport const CARD_BORDER_RADIUS = ['none', 'xs2', 'xs', 's', 'm', 'l', 'full'] as const;\nexport type TCardBorderRadius = (typeof CARD_BORDER_RADIUS)[number];\n","/* -------------------------------------------------------------------------- */\n/* Card styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-card.variables';\n\n:host {\n @apply block;\n}\n\n.bq-card {\n border-style: var(--bq-card--borderStyle);\n}\n","import { Component, Element, h, Host, Prop, Watch } from '@stencil/core';\n\nimport { CARD_TYPE, TCardBorderRadius, TCardType } from './bq-card.types';\nimport { validatePropValue } from '../../shared/utils';\n\n/**\n * @part wrapper - The wrapper container `<div>` of the element inside the shadow DOM\n */\n@Component({\n tag: 'bq-card',\n styleUrl: './scss/bq-card.scss',\n shadow: true,\n})\nexport class BqCard {\n // Own Properties\n // ====================\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqCardElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n // Public Property API\n // ========================\n\n /** Type of card component */\n @Prop({ reflect: true }) type: TCardType = 'default';\n\n /** The corner radius of the card component */\n @Prop({ reflect: true }) border: TCardBorderRadius = 'm';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('type')\n checkPropValue() {\n validatePropValue(CARD_TYPE, 'default', this.el, 'type');\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 componentWillLoad() {\n this.checkPropValue();\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 const style = {\n ...(this.border && { '--bq-card--borderRadius': `var(--bq-radius--${this.border})` }),\n };\n return (\n <Host style={style}>\n <div\n class={{\n 'bq-card rounded-[--bq-card--borderRadius] border-[length:--bq-card--borderWidth] border-[color:--bq-card--borderColor] bg-[--bq-card--background]':\n true,\n 'p-b-[--bq-card--padding] p-i-[--bq-card--padding]': this.type === 'default',\n // Remove padding for minimal card type\n 'p-b-0 p-i-0': this.type === 'minimal',\n }}\n part=\"wrapper\"\n >\n <slot />\n </div>\n </Host>\n );\n }\n}\n"],"mappings":";;;;;;;;AAAO,MAAMA,IAAY,EAAC,WAAW;;ACArC,MAAMC,IAAY;;AAClB,MAAAC,IAAeD;;MCYFE,IAAM;;;gBAiB0B;kBAGU;;;;;;;EAMrD,cAAAC;IACEC,EAAkBL,GAAW,WAAWM,KAAKC,IAAI;;;;;;;;EAWnD,iBAAAC;IACEF,KAAKF;;;;;;;;;;;;;;;;;EAsBP,MAAAK;IACE,MAAMC,IAAQ;SACRJ,KAAKK,UAAU;QAAE,2BAA2B,oBAAoBL,KAAKK;;;IAE3E,OACEC,EAACC,GAAI;MAAAC,KAAA;MAACJ,OAAOA;OACXE,EAAA;MAAAE,KAAA;MACEC,OAAO;QACL,qJACE;QACF,qDAAqDT,KAAKU,SAAS;;QAEnE,eAAeV,KAAKU,SAAS;;MAE/BC,MAAK;OAELL,EAAA;MAAAE,KAAA","ignoreList":[]}
|
|
@@ -4,8 +4,6 @@
|
|
|
4
4
|
*/
|
|
5
5
|
import { r as a, g as r, h as e, a as b } from "./p-01df4baa.js";
|
|
6
6
|
|
|
7
|
-
import "./p-a84d4562.js";
|
|
8
|
-
|
|
9
7
|
import { v as q } from "./p-687da041.js";
|
|
10
8
|
|
|
11
9
|
const t = [ "xsmall", "small", "medium", "large" ];
|
|
@@ -143,4 +141,4 @@ const o = class {
|
|
|
143
141
|
o.style = s;
|
|
144
142
|
|
|
145
143
|
export { o as bq_avatar };
|
|
146
|
-
//# sourceMappingURL=p-
|
|
144
|
+
//# sourceMappingURL=p-68ff188d.entry.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["AVATAR_SIZE","AVATAR_SHAPE","bqAvatarCss","BqAvatarStyle0","BqAvatar","trimmedInitials","handleImagePropChange","this","hasError","checkPropValues","validatePropValue","el","onInitialsChange","trimInitialsBasedOnSize","componentWillLoad","onImageError","initials","forEach","size","substring","getIndex","sizeIndexMap","xsmall","small","medium","large","render","h","Host","key","class","shape","label","role","part","image","alt","altText","undefined","src","onError","name"],"sources":["../../packages/beeq/src/components/avatar/bq-avatar.types.ts","../../packages/beeq/src/components/avatar/scss/bq-avatar.scss?tag=bq-avatar&encapsulation=shadow","../../packages/beeq/src/components/avatar/bq-avatar.tsx"],"sourcesContent":["export const AVATAR_SIZE = ['xsmall', 'small', 'medium', 'large'] as const;\nexport type TAvatarSize = (typeof AVATAR_SIZE)[number];\n\nexport const AVATAR_SHAPE = ['circle', 'square'] as const;\nexport type TAvatarShape = (typeof AVATAR_SHAPE)[number];\n","/* -------------------------------------------------------------------------- */\n/* Avatar styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-avatar.variables';\n\n:host {\n @apply relative inline-block;\n}\n\n.bq-avatar {\n @apply relative overflow-hidden bg-[var(--bq-avatar-background)];\n @apply border-[length:var(--bq-avatar--border-width)] border-[color:var(--bq-avatar--border-color)];\n\n border-style: var(--bq-avatar--border-style);\n}\n\n.size {\n &--xsmall {\n @apply text-[length:var(--bq-avatar--font-size-xsmall)] bs-[--bq-avatar--size-xsmall] is-[--bq-avatar--size-xsmall];\n }\n\n &--small {\n @apply text-[length:var(--bq-avatar--font-size-small)] bs-[--bq-avatar--size-small] is-[--bq-avatar--size-small];\n }\n\n &--medium {\n @apply text-[length:var(--bq-avatar--font-size-medium)] bs-[--bq-avatar--size-medium] is-[--bq-avatar--size-medium];\n }\n\n &--large {\n @apply text-[length:var(--bq-avatar--font-size-large)] bs-[--bq-avatar--size-large] is-[--bq-avatar--size-large];\n }\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport { AVATAR_SHAPE, AVATAR_SIZE, TAvatarShape, TAvatarSize } from './bq-avatar.types';\nimport { validatePropValue } from '../../shared/utils';\n\n/**\n * @part base - The component's internal wrapper.\n * @part img - The `<image>` tag element that load the image source.\n * @part text - The `<span>` tag element that renderd the `Initials` text string.\n */\n@Component({\n tag: 'bq-avatar',\n styleUrl: './scss/bq-avatar.scss',\n shadow: true,\n})\nexport class BqAvatar {\n // Own Properties\n // ====================\n\n trimmedInitials: string;\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqAvatarElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() hasError: boolean;\n\n // Public Property API\n // ========================\n\n /** Alternate text for the avatar image if the image cannot be displayed */\n @Prop({ reflect: true }) altText: string;\n\n /** The image source to load on the avatar (this can be also a base64 encoded image) */\n @Prop({ reflect: true }) image: string;\n\n /** A text to use for describing the avatar on assistive devices */\n @Prop({ reflect: true }) label: string;\n\n /** The text to display on avatar */\n @Prop({ reflect: true }) initials: string;\n\n /** The shape of the avatar */\n @Prop({ reflect: true }) shape: TAvatarShape = 'circle';\n\n /** The size of the avatar */\n @Prop({ reflect: true, mutable: true }) size: TAvatarSize = 'medium';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('image')\n handleImagePropChange() {\n // Reset the error when a new image source is provided\n this.hasError = false;\n }\n\n @Watch('shape')\n @Watch('size')\n checkPropValues() {\n validatePropValue(AVATAR_SHAPE, 'circle', this.el, 'shape');\n validatePropValue(AVATAR_SIZE, 'medium', this.el, 'size');\n }\n\n @Watch('initials')\n @Watch('size')\n onInitialsChange() {\n this.trimInitialsBasedOnSize();\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 componentWillLoad() {\n this.trimInitialsBasedOnSize();\n this.checkPropValues();\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 onImageError = () => {\n this.hasError = true;\n };\n\n private trimInitialsBasedOnSize = (): void => {\n if (!this.initials) return;\n\n AVATAR_SIZE.forEach((size: TAvatarSize) => {\n if (this.size === size) {\n this.trimmedInitials = this.initials.substring(0, this.getIndex(size));\n }\n });\n };\n\n private getIndex = (size: TAvatarSize): number => {\n const sizeIndexMap = {\n xsmall: 1,\n small: 2,\n medium: 3,\n large: 4,\n };\n return sizeIndexMap[size] ?? sizeIndexMap.xsmall;\n };\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <Host>\n <div\n class={{\n 'bq-avatar': true,\n [`size--${this.size}`]: true,\n 'rounded-[--bq-avatar--border-radius-circle]': this.shape === 'circle',\n 'rounded-[--bq-avatar--border-radius-squareXs]': this.shape === 'square' && this.size === 'xsmall',\n 'rounded-[--bq-avatar--border-radius-squareS]': this.shape === 'square' && this.size === 'small',\n 'rounded-[--bq-avatar--border-radius-squareM]':\n this.shape === 'square' && (this.size === 'medium' || this.size === 'large'),\n }}\n aria-label={this.label}\n role=\"img\"\n part=\"base\"\n >\n {this.initials && (\n <span\n class=\"absolute start-0 inline-flex items-center justify-center font-bold bs-full is-full inset-bs-0\"\n part=\"text\"\n >\n {this.trimmedInitials}\n </span>\n )}\n {this.image && !this.hasError && (\n <img\n class=\"absolute start-0 object-cover bs-full is-full inset-bs-0\"\n alt={this.altText ?? undefined}\n src={this.image}\n onError={this.onImageError}\n part=\"img\"\n />\n )}\n </div>\n <div\n class={{\n 'absolute flex items-center justify-center': true,\n 'start-[--bq-avatar--badge-left-square] inset-bs-[--bq-avatar--badge-top-square]': this.shape === 'square',\n 'start-[--bq-avatar--badge-left-circle] inset-bs-[--bq-avatar--badge-top-circle]': this.shape === 'circle',\n }}\n >\n <slot name=\"badge\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":"
|
|
1
|
+
{"version":3,"names":["AVATAR_SIZE","AVATAR_SHAPE","bqAvatarCss","BqAvatarStyle0","BqAvatar","trimmedInitials","handleImagePropChange","this","hasError","checkPropValues","validatePropValue","el","onInitialsChange","trimInitialsBasedOnSize","componentWillLoad","onImageError","initials","forEach","size","substring","getIndex","sizeIndexMap","xsmall","small","medium","large","render","h","Host","key","class","shape","label","role","part","image","alt","altText","undefined","src","onError","name"],"sources":["../../packages/beeq/src/components/avatar/bq-avatar.types.ts","../../packages/beeq/src/components/avatar/scss/bq-avatar.scss?tag=bq-avatar&encapsulation=shadow","../../packages/beeq/src/components/avatar/bq-avatar.tsx"],"sourcesContent":["export const AVATAR_SIZE = ['xsmall', 'small', 'medium', 'large'] as const;\nexport type TAvatarSize = (typeof AVATAR_SIZE)[number];\n\nexport const AVATAR_SHAPE = ['circle', 'square'] as const;\nexport type TAvatarShape = (typeof AVATAR_SHAPE)[number];\n","/* -------------------------------------------------------------------------- */\n/* Avatar styles */\n/* -------------------------------------------------------------------------- */\n\n@import './bq-avatar.variables';\n\n:host {\n @apply relative inline-block;\n}\n\n.bq-avatar {\n @apply relative overflow-hidden bg-[var(--bq-avatar-background)];\n @apply border-[length:var(--bq-avatar--border-width)] border-[color:var(--bq-avatar--border-color)];\n\n border-style: var(--bq-avatar--border-style);\n}\n\n.size {\n &--xsmall {\n @apply text-[length:var(--bq-avatar--font-size-xsmall)] bs-[--bq-avatar--size-xsmall] is-[--bq-avatar--size-xsmall];\n }\n\n &--small {\n @apply text-[length:var(--bq-avatar--font-size-small)] bs-[--bq-avatar--size-small] is-[--bq-avatar--size-small];\n }\n\n &--medium {\n @apply text-[length:var(--bq-avatar--font-size-medium)] bs-[--bq-avatar--size-medium] is-[--bq-avatar--size-medium];\n }\n\n &--large {\n @apply text-[length:var(--bq-avatar--font-size-large)] bs-[--bq-avatar--size-large] is-[--bq-avatar--size-large];\n }\n}\n","import { Component, Element, h, Host, Prop, State, Watch } from '@stencil/core';\n\nimport { AVATAR_SHAPE, AVATAR_SIZE, TAvatarShape, TAvatarSize } from './bq-avatar.types';\nimport { validatePropValue } from '../../shared/utils';\n\n/**\n * @part base - The component's internal wrapper.\n * @part img - The `<image>` tag element that load the image source.\n * @part text - The `<span>` tag element that renderd the `Initials` text string.\n */\n@Component({\n tag: 'bq-avatar',\n styleUrl: './scss/bq-avatar.scss',\n shadow: true,\n})\nexport class BqAvatar {\n // Own Properties\n // ====================\n\n trimmedInitials: string;\n\n // Reference to host HTML element\n // ===================================\n\n @Element() el!: HTMLBqAvatarElement;\n\n // State() variables\n // Inlined decorator, alphabetical order\n // =======================================\n\n @State() hasError: boolean;\n\n // Public Property API\n // ========================\n\n /** Alternate text for the avatar image if the image cannot be displayed */\n @Prop({ reflect: true }) altText: string;\n\n /** The image source to load on the avatar (this can be also a base64 encoded image) */\n @Prop({ reflect: true }) image: string;\n\n /** A text to use for describing the avatar on assistive devices */\n @Prop({ reflect: true }) label: string;\n\n /** The text to display on avatar */\n @Prop({ reflect: true }) initials: string;\n\n /** The shape of the avatar */\n @Prop({ reflect: true }) shape: TAvatarShape = 'circle';\n\n /** The size of the avatar */\n @Prop({ reflect: true, mutable: true }) size: TAvatarSize = 'medium';\n\n // Prop lifecycle events\n // =======================\n\n @Watch('image')\n handleImagePropChange() {\n // Reset the error when a new image source is provided\n this.hasError = false;\n }\n\n @Watch('shape')\n @Watch('size')\n checkPropValues() {\n validatePropValue(AVATAR_SHAPE, 'circle', this.el, 'shape');\n validatePropValue(AVATAR_SIZE, 'medium', this.el, 'size');\n }\n\n @Watch('initials')\n @Watch('size')\n onInitialsChange() {\n this.trimInitialsBasedOnSize();\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 componentWillLoad() {\n this.trimInitialsBasedOnSize();\n this.checkPropValues();\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 onImageError = () => {\n this.hasError = true;\n };\n\n private trimInitialsBasedOnSize = (): void => {\n if (!this.initials) return;\n\n AVATAR_SIZE.forEach((size: TAvatarSize) => {\n if (this.size === size) {\n this.trimmedInitials = this.initials.substring(0, this.getIndex(size));\n }\n });\n };\n\n private getIndex = (size: TAvatarSize): number => {\n const sizeIndexMap = {\n xsmall: 1,\n small: 2,\n medium: 3,\n large: 4,\n };\n return sizeIndexMap[size] ?? sizeIndexMap.xsmall;\n };\n\n // render() function\n // Always the last one in the class.\n // ===================================\n\n render() {\n return (\n <Host>\n <div\n class={{\n 'bq-avatar': true,\n [`size--${this.size}`]: true,\n 'rounded-[--bq-avatar--border-radius-circle]': this.shape === 'circle',\n 'rounded-[--bq-avatar--border-radius-squareXs]': this.shape === 'square' && this.size === 'xsmall',\n 'rounded-[--bq-avatar--border-radius-squareS]': this.shape === 'square' && this.size === 'small',\n 'rounded-[--bq-avatar--border-radius-squareM]':\n this.shape === 'square' && (this.size === 'medium' || this.size === 'large'),\n }}\n aria-label={this.label}\n role=\"img\"\n part=\"base\"\n >\n {this.initials && (\n <span\n class=\"absolute start-0 inline-flex items-center justify-center font-bold bs-full is-full inset-bs-0\"\n part=\"text\"\n >\n {this.trimmedInitials}\n </span>\n )}\n {this.image && !this.hasError && (\n <img\n class=\"absolute start-0 object-cover bs-full is-full inset-bs-0\"\n alt={this.altText ?? undefined}\n src={this.image}\n onError={this.onImageError}\n part=\"img\"\n />\n )}\n </div>\n <div\n class={{\n 'absolute flex items-center justify-center': true,\n 'start-[--bq-avatar--badge-left-square] inset-bs-[--bq-avatar--badge-top-square]': this.shape === 'square',\n 'start-[--bq-avatar--badge-left-circle] inset-bs-[--bq-avatar--badge-top-circle]': this.shape === 'circle',\n }}\n >\n <slot name=\"badge\"></slot>\n </div>\n </Host>\n );\n }\n}\n"],"mappings":";;;;;;;;AAAO,MAAMA,IAAc,EAAC,UAAU,SAAS,UAAU;;AAGlD,MAAMC,IAAe,EAAC,UAAU;;ACHvC,MAAMC,IAAc;;AACpB,MAAAC,IAAeD;;MCcFE,IAAQ;;;;;;;;iBAiC4B;gBAGa;;;;EAhC5DC;;;;;;EAsCA,qBAAAC;;IAEEC,KAAKC,WAAW;;EAKlB,eAAAC;IACEC,EAAkBT,GAAc,UAAUM,KAAKI,IAAI;IACnDD,EAAkBV,GAAa,UAAUO,KAAKI,IAAI;;EAKpD,gBAAAC;IACEL,KAAKM;;;;;;;;EAWP,iBAAAC;IACEP,KAAKM;IACLN,KAAKE;;;;;;;;;;;;;;EAkBCM,aAAe;IACrBR,KAAKC,WAAW;AAAI;EAGdK,wBAA0B;IAChC,KAAKN,KAAKS,UAAU;IAEpBhB,EAAYiB,SAASC;MACnB,IAAIX,KAAKW,SAASA,GAAM;QACtBX,KAAKF,kBAAkBE,KAAKS,SAASG,UAAU,GAAGZ,KAAKa,SAASF;;;AAElE;EAGIE,SAAYF;IAClB,MAAMG,IAAe;MACnBC,QAAQ;MACRC,OAAO;MACPC,QAAQ;MACRC,OAAO;;IAET,OAAOJ,EAAaH,MAASG,EAAaC;AAAM;;;;EAOlD,MAAAI;IACE,OACEC,EAACC,GAAI;MAAAC,KAAA;OACHF,EAAA;MAAAE,KAAA;MACEC,OAAO;QACL,aAAa;QACb,CAAC,SAASvB,KAAKW,SAAS;QACxB,+CAA+CX,KAAKwB,UAAU;QAC9D,iDAAiDxB,KAAKwB,UAAU,YAAYxB,KAAKW,SAAS;QAC1F,gDAAgDX,KAAKwB,UAAU,YAAYxB,KAAKW,SAAS;QACzF,gDACEX,KAAKwB,UAAU,aAAaxB,KAAKW,SAAS,YAAYX,KAAKW,SAAS;;MACvE,cACWX,KAAKyB;MACjBC,MAAK;MACLC,MAAK;OAEJ3B,KAAKS,YACJW,EAAA;MAAAE,KAAA;MACEC,OAAM;MACNI,MAAK;OAEJ3B,KAAKF,kBAGTE,KAAK4B,UAAU5B,KAAKC,YACnBmB,EAAA;MAAAE,KAAA;MACEC,OAAM;MACNM,KAAK7B,KAAK8B,WAAWC;MACrBC,KAAKhC,KAAK4B;MACVK,SAASjC,KAAKQ;MACdmB,MAAK;SAIXP,EAAA;MAAAE,KAAA;MACEC,OAAO;QACL,6CAA6C;QAC7C,mFAAmFvB,KAAKwB,UAAU;QAClG,mFAAmFxB,KAAKwB,UAAU;;OAGpGJ,EAAA;MAAAE,KAAA;MAAMY,MAAK","ignoreList":[]}
|
|
@@ -4,8 +4,6 @@
|
|
|
4
4
|
*/
|
|
5
5
|
import { r as a, c as r, g as b, h as e, a as t } from "./p-01df4baa.js";
|
|
6
6
|
|
|
7
|
-
import "./p-a84d4562.js";
|
|
8
|
-
|
|
9
7
|
import { d as n } from "./p-1defeea3.js";
|
|
10
8
|
|
|
11
9
|
import { v as q } from "./p-687da041.js";
|
|
@@ -27,7 +25,7 @@ const l = class {
|
|
|
27
25
|
a(this, b);
|
|
28
26
|
this.bqHide = r(this, "bqHide", 7);
|
|
29
27
|
this.bqShow = r(this, "bqShow", 7);
|
|
30
|
-
this.toastPortal = document.querySelector(`.${c}`);
|
|
28
|
+
this.toastPortal = typeof window !== "undefined" ? document.querySelector(`.${c}`) : null;
|
|
31
29
|
this.border = "s";
|
|
32
30
|
this.type = "info";
|
|
33
31
|
this.placement = "bottom-center";
|
|
@@ -75,7 +73,7 @@ const l = class {
|
|
|
75
73
|
// =====================================
|
|
76
74
|
connectedCallback() {
|
|
77
75
|
const {toastPortal: a} = this;
|
|
78
|
-
if (!a && typeof
|
|
76
|
+
if (!a && typeof window !== "undefined") {
|
|
79
77
|
this.toastPortal = Object.assign(document.createElement("div"), {
|
|
80
78
|
className: c
|
|
81
79
|
});
|
|
@@ -167,7 +165,7 @@ const l = class {
|
|
|
167
165
|
}
|
|
168
166
|
};
|
|
169
167
|
return e(t, {
|
|
170
|
-
key: "
|
|
168
|
+
key: "0c720b655e1ccfb620eb3a317bf77e31f328308b",
|
|
171
169
|
style: a,
|
|
172
170
|
class: {
|
|
173
171
|
"is-hidden": !this.open
|
|
@@ -176,27 +174,27 @@ const l = class {
|
|
|
176
174
|
hidden: !this.open ? "true" : "false",
|
|
177
175
|
role: "status"
|
|
178
176
|
}, e("output", {
|
|
179
|
-
key: "
|
|
177
|
+
key: "a7f39180143c475d6554799eccb52fb52b61b978",
|
|
180
178
|
class: "bq-toast",
|
|
181
179
|
part: "wrapper"
|
|
182
180
|
}, e("div", {
|
|
183
|
-
key: "
|
|
181
|
+
key: "10a989822386e2abd536a58fd84fb8cc431b387e",
|
|
184
182
|
class: {
|
|
185
183
|
[`bq-toast--icon ${this.type}`]: true,
|
|
186
184
|
"!hidden": this.hideIcon
|
|
187
185
|
},
|
|
188
186
|
part: "icon"
|
|
189
187
|
}, e("slot", {
|
|
190
|
-
key: "
|
|
188
|
+
key: "6ac3e6c871ce1fd6b5a1f3202cc68c55bb8384fd",
|
|
191
189
|
name: "icon"
|
|
192
190
|
}, e("bq-icon", {
|
|
193
|
-
key: "
|
|
191
|
+
key: "2de92ed1b7051b57f8979cbbef6fe03e6eec6880",
|
|
194
192
|
name: this.iconName,
|
|
195
193
|
size: "24",
|
|
196
194
|
slot: "icon",
|
|
197
195
|
exportparts: "base,svg"
|
|
198
196
|
}))), e("slot", {
|
|
199
|
-
key: "
|
|
197
|
+
key: "2794332bcd8fc1e2d314bcbb950d517f775d457e"
|
|
200
198
|
})));
|
|
201
199
|
}
|
|
202
200
|
static get watchers() {
|
|
@@ -212,4 +210,4 @@ const l = class {
|
|
|
212
210
|
l.style = d;
|
|
213
211
|
|
|
214
212
|
export { l as bq_toast };
|
|
215
|
-
//# sourceMappingURL=p-
|
|
213
|
+
//# sourceMappingURL=p-69c766a3.entry.js.map
|