bromcom-ui 2.8.0-rc.2 → 2.8.0-rc.3
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/bromcom-ui/bromcom-ui.css +1 -1
- package/dist/bromcom-ui/bromcom-ui.esm.js +1 -1
- package/dist/bromcom-ui/p-01e2c310.entry.js +5 -0
- package/dist/bromcom-ui/p-025fa461.entry.js +5 -0
- package/dist/bromcom-ui/p-02d89883.entry.js +5 -0
- package/dist/bromcom-ui/p-090ed544.entry.js +5 -0
- package/dist/bromcom-ui/p-09733614.entry.js +5 -0
- package/dist/bromcom-ui/p-0f07e69b.js +5 -0
- package/dist/bromcom-ui/{p-0b77585e.entry.js → p-210a8642.entry.js} +1 -1
- package/dist/bromcom-ui/{p-dc306bd8.entry.js → p-2358bca8.entry.js} +1 -1
- package/dist/bromcom-ui/p-23f4991b.entry.js +5 -0
- package/dist/bromcom-ui/{p-f089027d.entry.js → p-25e8759d.entry.js} +1 -1
- package/dist/bromcom-ui/{p-5d014153.entry.js → p-2623b84a.entry.js} +1 -1
- package/dist/bromcom-ui/{p-2cdc4578.entry.js → p-2c9d1709.entry.js} +1 -1
- package/dist/bromcom-ui/p-323973e5.entry.js +5 -0
- package/dist/bromcom-ui/p-37194223.entry.js +5 -0
- package/dist/bromcom-ui/{p-369d6e4f.entry.js → p-3c690e56.entry.js} +1 -1
- package/dist/bromcom-ui/{p-4bbba8b4.js → p-3f7625ff.js} +1 -1
- package/dist/bromcom-ui/{p-f16ce14a.entry.js → p-416febed.entry.js} +1 -1
- package/dist/bromcom-ui/{p-e2b3cb98.entry.js → p-4260353d.entry.js} +1 -1
- package/dist/bromcom-ui/p-479f0bd5.entry.js +5 -0
- package/dist/bromcom-ui/p-4836d1cd.entry.js +5 -0
- package/dist/bromcom-ui/{p-5de651cc.entry.js → p-5963e647.entry.js} +1 -1
- package/dist/bromcom-ui/p-59e2af89.entry.js +5 -0
- package/dist/bromcom-ui/p-5a68e6e7.entry.js +5 -0
- package/dist/bromcom-ui/p-65ab887f.entry.js +5 -0
- package/dist/bromcom-ui/p-677195de.entry.js +5 -0
- package/dist/bromcom-ui/p-6c78072c.entry.js +5 -0
- package/dist/bromcom-ui/p-6cb33e93.entry.js +5 -0
- package/dist/bromcom-ui/p-6d0e6802.entry.js +5 -0
- package/dist/bromcom-ui/p-6d4f10e3.entry.js +5 -0
- package/dist/bromcom-ui/{p-4a51c718.entry.js → p-70ca213d.entry.js} +1 -1
- package/dist/bromcom-ui/p-71663e53.entry.js +5 -0
- package/dist/bromcom-ui/p-761f7e8c.entry.js +5 -0
- package/dist/bromcom-ui/p-762aeb4a.entry.js +5 -0
- package/dist/bromcom-ui/{p-a173ed35.entry.js → p-77312b64.entry.js} +1 -1
- package/dist/bromcom-ui/p-7b0bfeb2.entry.js +5 -0
- package/dist/bromcom-ui/{p-9a1dc17c.entry.js → p-7f6736c8.entry.js} +1 -1
- package/dist/bromcom-ui/p-84919c9d.entry.js +5 -0
- package/dist/bromcom-ui/{p-e02491ce.entry.js → p-86e5ffe3.entry.js} +1 -1
- package/dist/bromcom-ui/p-8811d071.entry.js +5 -0
- package/dist/bromcom-ui/p-911776d7.entry.js +5 -0
- package/dist/bromcom-ui/{p-dae1cc7b.entry.js → p-9141db41.entry.js} +1 -1
- package/dist/bromcom-ui/{p-8d1cd79f.entry.js → p-920fdcd8.entry.js} +1 -1
- package/dist/bromcom-ui/p-92f6ca0f.entry.js +5 -0
- package/dist/bromcom-ui/{p-19cba40f.js → p-9763ed2d.js} +1 -1
- package/dist/bromcom-ui/{p-c012565a.entry.js → p-9ae9706d.entry.js} +1 -1
- package/dist/bromcom-ui/{p-bdb012c3.entry.js → p-9b723535.entry.js} +1 -1
- package/dist/bromcom-ui/{p-0f685aa9.entry.js → p-9c5c74d6.entry.js} +1 -1
- package/dist/bromcom-ui/p-a051b68c.entry.js +5 -0
- package/dist/bromcom-ui/{p-f4d6590d.js → p-a0807939.js} +1 -1
- package/dist/bromcom-ui/{p-14938158.entry.js → p-a7cedfe6.entry.js} +1 -1
- package/dist/bromcom-ui/p-accf5f6c.entry.js +11 -0
- package/dist/bromcom-ui/{p-22e08221.entry.js → p-adbe308b.entry.js} +1 -1
- package/dist/bromcom-ui/p-afac7571.entry.js +5 -0
- package/dist/bromcom-ui/p-b280f61e.entry.js +5 -0
- package/dist/bromcom-ui/p-b295dc77.entry.js +5 -0
- package/dist/bromcom-ui/p-bf383f52.entry.js +5 -0
- package/dist/bromcom-ui/p-c08cee8b.entry.js +5 -0
- package/dist/bromcom-ui/{p-56bb19ef.js → p-c34638dc.js} +1 -1
- package/dist/bromcom-ui/p-c7dc70b8.entry.js +5 -0
- package/dist/bromcom-ui/p-c865c604.entry.js +5 -0
- package/dist/bromcom-ui/p-cc67f4a8.entry.js +5 -0
- package/dist/bromcom-ui/p-d353ce68.entry.js +5 -0
- package/dist/bromcom-ui/p-d3dd1bcb.entry.js +5 -0
- package/dist/bromcom-ui/p-d3ff6b31.entry.js +5 -0
- package/dist/bromcom-ui/{p-61709094.entry.js → p-d52e3a0a.entry.js} +1 -1
- package/dist/bromcom-ui/p-d9668e00.entry.js +5 -0
- package/dist/bromcom-ui/{p-c9235a71.entry.js → p-e01fb694.entry.js} +1 -1
- package/dist/bromcom-ui/p-e320352d.entry.js +5 -0
- package/dist/bromcom-ui/{p-7b153da4.js → p-eb945ceb.js} +1 -1
- package/dist/bromcom-ui/p-ef0a59b6.js +5 -0
- package/dist/bromcom-ui/{p-a366b934.js → p-ef8b37a2.js} +1 -1
- package/dist/bromcom-ui/p-fa3291a8.entry.js +5 -0
- package/dist/cjs/bcm-accordion.cjs.entry.js +2 -3
- package/dist/cjs/bcm-alert.cjs.entry.js +2 -3
- package/dist/cjs/bcm-attendance.cjs.entry.js +2 -3
- package/dist/cjs/bcm-autocomplete.cjs.entry.js +1 -1
- package/dist/cjs/bcm-avatar_2.cjs.entry.js +5 -6
- package/dist/cjs/bcm-box.cjs.entry.js +1 -1
- package/dist/cjs/bcm-breadcrumb.cjs.entry.js +2 -3
- package/dist/cjs/bcm-button-group.cjs.entry.js +2 -3
- package/dist/cjs/{bcm-button_10.cjs.entry.js → bcm-button_13.cjs.entry.js} +2417 -172
- package/dist/cjs/bcm-card.cjs.entry.js +3 -4
- package/dist/cjs/bcm-checkbox-group.cjs.entry.js +2 -3
- package/dist/cjs/bcm-checkbox-lite_9.cjs.entry.js +2 -3
- package/dist/cjs/bcm-checkbox_2.cjs.entry.js +3 -4
- package/dist/cjs/bcm-chip.cjs.entry.js +3 -4
- package/dist/cjs/bcm-collapse-group.cjs.entry.js +1 -1
- package/dist/cjs/bcm-collapse.cjs.entry.js +2 -3
- package/dist/cjs/bcm-color-input.cjs.entry.js +4 -5
- package/dist/cjs/bcm-colorpicker.cjs.entry.js +1 -1
- package/dist/cjs/bcm-date-picker.cjs.entry.js +2 -3
- package/dist/cjs/bcm-datetime-picker.cjs.entry.js +2 -3
- package/dist/cjs/bcm-default.cjs.entry.js +2 -3
- package/dist/cjs/bcm-drawer.cjs.entry.js +5 -6
- package/dist/cjs/bcm-dropdown.cjs.entry.js +3 -4
- package/dist/cjs/bcm-error-layout.cjs.entry.js +1 -1
- package/dist/cjs/bcm-expansion-panel.cjs.entry.js +3 -4
- package/dist/cjs/bcm-form-2.cjs.entry.js +2 -3
- package/dist/cjs/bcm-form-group.cjs.entry.js +1 -1
- package/dist/cjs/bcm-input-custom.cjs.entry.js +2 -3
- package/dist/cjs/bcm-item.cjs.entry.js +3 -4
- package/dist/cjs/bcm-items.cjs.entry.js +2 -3
- package/dist/cjs/bcm-link.cjs.entry.js +1 -1
- package/dist/cjs/bcm-menu.cjs.entry.js +6 -7
- package/dist/cjs/bcm-message.cjs.entry.js +1 -1
- package/dist/cjs/bcm-modal.cjs.entry.js +2 -3
- package/dist/cjs/bcm-notification.cjs.entry.js +1 -1
- package/dist/cjs/bcm-old-input.cjs.entry.js +1 -1
- package/dist/cjs/bcm-old-tag_2.cjs.entry.js +1 -1
- package/dist/cjs/bcm-popconfirm-box.cjs.entry.js +3 -4
- package/dist/cjs/bcm-popconfirm.cjs.entry.js +2 -3
- package/dist/cjs/bcm-popover.cjs.entry.js +5 -6
- package/dist/cjs/bcm-progress.cjs.entry.js +3 -4
- package/dist/cjs/bcm-radio-group.cjs.entry.js +159 -0
- package/dist/cjs/bcm-radio.cjs.entry.js +63 -0
- package/dist/cjs/bcm-range.cjs.entry.js +2 -3
- package/dist/cjs/bcm-result.cjs.entry.js +1 -1
- package/dist/cjs/bcm-select.cjs.entry.js +1 -1
- package/dist/cjs/bcm-skeleton.cjs.entry.js +2 -3
- package/dist/cjs/bcm-switch.cjs.entry.js +2 -3
- package/dist/cjs/bcm-tab-group.cjs.entry.js +5 -6
- package/dist/cjs/bcm-tab-item-header.cjs.entry.js +5 -6
- package/dist/cjs/bcm-tab-item.cjs.entry.js +5 -6
- package/dist/cjs/bcm-tab-pane.cjs.entry.js +1 -1
- package/dist/cjs/bcm-tab.cjs.entry.js +1 -1
- package/dist/cjs/bcm-table.cjs.entry.js +1 -1
- package/dist/cjs/bcm-tabs-content.cjs.entry.js +1 -1
- package/dist/cjs/bcm-tabs.cjs.entry.js +1 -1
- package/dist/cjs/bcm-tag.cjs.entry.js +3 -4
- package/dist/cjs/bcm-textarea.cjs.entry.js +3 -4
- package/dist/cjs/bcm-time-picker.cjs.entry.js +2 -3
- package/dist/cjs/bcm-timeline-item.cjs.entry.js +1 -1
- package/dist/cjs/bcm-timeline.cjs.entry.js +1 -1
- package/dist/cjs/bcm-toast.cjs.entry.js +2 -3
- package/dist/cjs/bromcom-ui.cjs.js +1 -1
- package/dist/cjs/{color-helper-09aa652d.js → color-helper-ff22257f.js} +8 -8
- package/dist/cjs/{colors-7cc2aee2.js → generate-7b71e00a.js} +297 -0
- package/dist/cjs/{input-template-2bdd0688.js → input-template-98c29bbb.js} +1 -1
- package/dist/cjs/{is-load-decorator-c38598ab.js → is-load-decorator-faac117d.js} +0 -2
- package/dist/cjs/{json-parse-decarator-fe468734.js → json-parse-decarator-79e20ff3.js} +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{number-helper-aac9b592.js → number-helper-9869878b.js} +1 -1
- package/dist/cjs/old-bcm-popover-box.cjs.entry.js +3 -4
- package/dist/cjs/old-bcm-popover.cjs.entry.js +2 -3
- package/dist/cjs/{tooltip-helper-18b3deae.js → tooltip-helper-27421198.js} +4 -4
- package/dist/cjs/{validators-5c4ee18b.js → validators-261e5c81.js} +1 -1
- package/dist/collection/decorators/is-load-decorator.js +0 -2
- package/dist/components/generate.js +1 -1
- package/dist/components/is-load-decorator.js +0 -2
- package/dist/esm/bcm-accordion.entry.js +2 -3
- package/dist/esm/bcm-alert.entry.js +2 -3
- package/dist/esm/bcm-attendance.entry.js +2 -3
- package/dist/esm/bcm-autocomplete.entry.js +1 -1
- package/dist/esm/bcm-avatar_2.entry.js +5 -6
- package/dist/esm/bcm-box.entry.js +1 -1
- package/dist/esm/bcm-breadcrumb.entry.js +2 -3
- package/dist/esm/bcm-button-group.entry.js +2 -3
- package/dist/esm/{bcm-button_10.entry.js → bcm-button_13.entry.js} +2415 -173
- package/dist/esm/bcm-card.entry.js +3 -4
- package/dist/esm/bcm-checkbox-group.entry.js +2 -3
- package/dist/esm/bcm-checkbox-lite_9.entry.js +2 -3
- package/dist/esm/bcm-checkbox_2.entry.js +3 -4
- package/dist/esm/bcm-chip.entry.js +3 -4
- package/dist/esm/bcm-collapse-group.entry.js +1 -1
- package/dist/esm/bcm-collapse.entry.js +2 -3
- package/dist/esm/bcm-color-input.entry.js +4 -5
- package/dist/esm/bcm-colorpicker.entry.js +1 -1
- package/dist/esm/bcm-date-picker.entry.js +2 -3
- package/dist/esm/bcm-datetime-picker.entry.js +2 -3
- package/dist/esm/bcm-default.entry.js +2 -3
- package/dist/esm/bcm-drawer.entry.js +5 -6
- package/dist/esm/bcm-dropdown.entry.js +3 -4
- package/dist/esm/bcm-error-layout.entry.js +1 -1
- package/dist/esm/bcm-expansion-panel.entry.js +3 -4
- package/dist/esm/bcm-form-2.entry.js +2 -3
- package/dist/esm/bcm-form-group.entry.js +1 -1
- package/dist/esm/bcm-input-custom.entry.js +2 -3
- package/dist/esm/bcm-item.entry.js +3 -4
- package/dist/esm/bcm-items.entry.js +2 -3
- package/dist/esm/bcm-link.entry.js +1 -1
- package/dist/esm/bcm-menu.entry.js +6 -7
- package/dist/esm/bcm-message.entry.js +1 -1
- package/dist/esm/bcm-modal.entry.js +2 -3
- package/dist/esm/bcm-notification.entry.js +1 -1
- package/dist/esm/bcm-old-input.entry.js +1 -1
- package/dist/esm/bcm-old-tag_2.entry.js +1 -1
- package/dist/esm/bcm-popconfirm-box.entry.js +3 -4
- package/dist/esm/bcm-popconfirm.entry.js +2 -3
- package/dist/esm/bcm-popover.entry.js +5 -6
- package/dist/esm/bcm-progress.entry.js +3 -4
- package/dist/esm/bcm-radio-group.entry.js +155 -0
- package/dist/esm/bcm-radio.entry.js +59 -0
- package/dist/esm/bcm-range.entry.js +2 -3
- package/dist/esm/bcm-result.entry.js +1 -1
- package/dist/esm/bcm-select.entry.js +1 -1
- package/dist/esm/bcm-skeleton.entry.js +2 -3
- package/dist/esm/bcm-switch.entry.js +2 -3
- package/dist/esm/bcm-tab-group.entry.js +5 -6
- package/dist/esm/bcm-tab-item-header.entry.js +5 -6
- package/dist/esm/bcm-tab-item.entry.js +5 -6
- package/dist/esm/bcm-tab-pane.entry.js +1 -1
- package/dist/esm/bcm-tab.entry.js +1 -1
- package/dist/esm/bcm-table.entry.js +1 -1
- package/dist/esm/bcm-tabs-content.entry.js +1 -1
- package/dist/esm/bcm-tabs.entry.js +1 -1
- package/dist/esm/bcm-tag.entry.js +3 -4
- package/dist/esm/bcm-textarea.entry.js +3 -4
- package/dist/esm/bcm-time-picker.entry.js +2 -3
- package/dist/esm/bcm-timeline-item.entry.js +1 -1
- package/dist/esm/bcm-timeline.entry.js +1 -1
- package/dist/esm/bcm-toast.entry.js +2 -3
- package/dist/esm/bromcom-ui.js +1 -1
- package/dist/esm/{color-helper-2b6697b6.js → color-helper-362cd7b6.js} +1 -1
- package/dist/esm/{colors-39b87f63.js → generate-6c5030c9.js} +296 -1
- package/dist/esm/{input-template-9a5da65a.js → input-template-21cb9810.js} +1 -1
- package/dist/esm/{is-load-decorator-66e19e04.js → is-load-decorator-359a1080.js} +0 -2
- package/dist/esm/{json-parse-decarator-aba7d121.js → json-parse-decarator-b3d10607.js} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{number-helper-d4126c02.js → number-helper-0ab0676b.js} +1 -1
- package/dist/esm/old-bcm-popover-box.entry.js +3 -4
- package/dist/esm/old-bcm-popover.entry.js +2 -3
- package/dist/esm/{tooltip-helper-e7eb577d.js → tooltip-helper-6b6cee19.js} +4 -4
- package/dist/esm/{validators-2a89d009.js → validators-87201c22.js} +1 -1
- package/package.json +1 -1
- package/dist/bromcom-ui/p-00269ca7.entry.js +0 -5
- package/dist/bromcom-ui/p-0041bd28.entry.js +0 -5
- package/dist/bromcom-ui/p-007bec47.entry.js +0 -5
- package/dist/bromcom-ui/p-036f3880.entry.js +0 -5
- package/dist/bromcom-ui/p-0626d065.entry.js +0 -5
- package/dist/bromcom-ui/p-13082089.entry.js +0 -5
- package/dist/bromcom-ui/p-13337304.entry.js +0 -5
- package/dist/bromcom-ui/p-1e328bbb.entry.js +0 -5
- package/dist/bromcom-ui/p-30070e50.entry.js +0 -5
- package/dist/bromcom-ui/p-3407de8c.entry.js +0 -5
- package/dist/bromcom-ui/p-35e357fb.entry.js +0 -5
- package/dist/bromcom-ui/p-400f7245.entry.js +0 -5
- package/dist/bromcom-ui/p-445a227f.entry.js +0 -5
- package/dist/bromcom-ui/p-57185ca0.entry.js +0 -5
- package/dist/bromcom-ui/p-5948de7f.entry.js +0 -5
- package/dist/bromcom-ui/p-5a26b9b8.entry.js +0 -5
- package/dist/bromcom-ui/p-5bad0d7b.entry.js +0 -5
- package/dist/bromcom-ui/p-6530b216.entry.js +0 -5
- package/dist/bromcom-ui/p-67659c20.entry.js +0 -5
- package/dist/bromcom-ui/p-6bd60d81.entry.js +0 -5
- package/dist/bromcom-ui/p-6bfece08.entry.js +0 -5
- package/dist/bromcom-ui/p-6c288e79.entry.js +0 -5
- package/dist/bromcom-ui/p-6c7b218c.entry.js +0 -5
- package/dist/bromcom-ui/p-7124553b.js +0 -5
- package/dist/bromcom-ui/p-71930900.js +0 -5
- package/dist/bromcom-ui/p-82031406.entry.js +0 -5
- package/dist/bromcom-ui/p-843c229b.entry.js +0 -5
- package/dist/bromcom-ui/p-8c9d67ad.entry.js +0 -5
- package/dist/bromcom-ui/p-8ced5b81.entry.js +0 -5
- package/dist/bromcom-ui/p-935fdf64.entry.js +0 -5
- package/dist/bromcom-ui/p-9490e993.entry.js +0 -5
- package/dist/bromcom-ui/p-9bef5a59.js +0 -5
- package/dist/bromcom-ui/p-a3a346fc.entry.js +0 -5
- package/dist/bromcom-ui/p-a82bcbd4.js +0 -5
- package/dist/bromcom-ui/p-aa59b8d1.entry.js +0 -5
- package/dist/bromcom-ui/p-b0d84958.entry.js +0 -5
- package/dist/bromcom-ui/p-b3003060.entry.js +0 -5
- package/dist/bromcom-ui/p-c092fafd.entry.js +0 -11
- package/dist/bromcom-ui/p-cf24655f.entry.js +0 -5
- package/dist/bromcom-ui/p-d9bd56ef.entry.js +0 -5
- package/dist/bromcom-ui/p-dc3d9f76.entry.js +0 -5
- package/dist/bromcom-ui/p-e38344ed.entry.js +0 -5
- package/dist/bromcom-ui/p-e842eb54.entry.js +0 -5
- package/dist/bromcom-ui/p-ed04ae18.entry.js +0 -5
- package/dist/bromcom-ui/p-efd4bae1.entry.js +0 -5
- package/dist/bromcom-ui/p-f0877724.entry.js +0 -5
- package/dist/bromcom-ui/p-f4c08ca4.entry.js +0 -5
- package/dist/bromcom-ui/p-f4d15784.entry.js +0 -5
- package/dist/bromcom-ui/p-ff78d3f1.entry.js +0 -5
- package/dist/cjs/bcm-list.cjs.entry.js +0 -1793
- package/dist/cjs/bcm-search.cjs.entry.js +0 -259
- package/dist/cjs/bcm-step.cjs.entry.js +0 -102
- package/dist/cjs/bcm-stepper.cjs.entry.js +0 -247
- package/dist/cjs/bcm-text.cjs.entry.js +0 -63
- package/dist/cjs/generate-e2397ffa.js +0 -305
- package/dist/cjs/stepper-states-5aa9bb64.js +0 -85
- package/dist/esm/bcm-list.entry.js +0 -1789
- package/dist/esm/bcm-search.entry.js +0 -255
- package/dist/esm/bcm-step.entry.js +0 -98
- package/dist/esm/bcm-stepper.entry.js +0 -243
- package/dist/esm/bcm-text.entry.js +0 -59
- package/dist/esm/generate-82c3ee1f.js +0 -302
- package/dist/esm/stepper-states-3b8d6edd.js +0 -83
|
@@ -2,29 +2,30 @@
|
|
|
2
2
|
* Built with Stencil
|
|
3
3
|
* Copyright (c) Bromcom.
|
|
4
4
|
*/
|
|
5
|
-
import { h as h$1, r as registerInstance, c as createEvent, H as Host, g as getElement } from './index-6e2d80d7.js';
|
|
6
|
-
import { s as snq, G as Generate } from './generate-
|
|
5
|
+
import { h as h$1, r as registerInstance, c as createEvent, H as Host, g as getElement, f as forceUpdate } from './index-6e2d80d7.js';
|
|
6
|
+
import { s as snq, G as Generate } from './generate-6c5030c9.js';
|
|
7
7
|
import { B as Bcm, a as Bcm$1 } from './bcm-9f50af9c.js';
|
|
8
8
|
import { c as classnames } from './index-ba2edd32.js';
|
|
9
9
|
import { c as createStore } from './index-8b349654.js';
|
|
10
10
|
import { S as SlotTemplate } from './slot-template-64b41ee5.js';
|
|
11
|
-
import { C as ColorHelper } from './color-helper-
|
|
12
|
-
import { I as IsLoad } from './is-load-decorator-
|
|
11
|
+
import { C as ColorHelper } from './color-helper-362cd7b6.js';
|
|
12
|
+
import { I as IsLoad } from './is-load-decorator-359a1080.js';
|
|
13
13
|
import { c as createCommonjsModule, a as commonjsGlobal } from './_commonjsHelpers-3016b722.js';
|
|
14
14
|
import { S as StringHelper } from './string-helper-0fb7ff20.js';
|
|
15
|
-
import { d as delay, g as getChildElements } from './utils-57652744.js';
|
|
16
|
-
import { N as NumberHelper } from './number-helper-
|
|
17
|
-
import { V as Validators } from './validators-
|
|
15
|
+
import { d as delay, g as getChildElements, p as pluralize } from './utils-57652744.js';
|
|
16
|
+
import { N as NumberHelper } from './number-helper-0ab0676b.js';
|
|
17
|
+
import { V as Validators } from './validators-87201c22.js';
|
|
18
18
|
import { C as CaptionTemplate } from './caption-template-389f5bd6.js';
|
|
19
|
-
import { I as InputTemplate } from './input-template-
|
|
19
|
+
import { I as InputTemplate } from './input-template-21cb9810.js';
|
|
20
20
|
import { L as LabelTemplate } from './label-template-eed2dd69.js';
|
|
21
21
|
import './element-dragger-89bb52fd.js';
|
|
22
22
|
import { F as FloatingUI } from './floating-ui-4a49ea46.js';
|
|
23
23
|
import './datetime-helper-df25808a.js';
|
|
24
|
+
import { J as JsonParse } from './json-parse-decarator-b3d10607.js';
|
|
25
|
+
import { g as getPlacement, s as setPosition } from './popover-placement-4baf5f2f.js';
|
|
24
26
|
import './types-6f06fa1a.js';
|
|
25
27
|
import './types-bfc3bba1.js';
|
|
26
|
-
import { T as Tooltip } from './tooltip-helper-
|
|
27
|
-
import './colors-39b87f63.js';
|
|
28
|
+
import { T as Tooltip } from './tooltip-helper-6b6cee19.js';
|
|
28
29
|
import './colors-1d7854ea.js';
|
|
29
30
|
|
|
30
31
|
const variantOptions = {
|
|
@@ -194,28 +195,28 @@ var VariantProps;
|
|
|
194
195
|
VariantProps["download"] = "download";
|
|
195
196
|
})(VariantProps || (VariantProps = {}));
|
|
196
197
|
|
|
197
|
-
const { state } = createStore({
|
|
198
|
+
const { state: state$3 } = createStore({
|
|
198
199
|
value: new Map(),
|
|
199
200
|
setData: {},
|
|
200
201
|
removeData: {}
|
|
201
202
|
});
|
|
202
|
-
const setValue = (val) => {
|
|
203
|
+
const setValue$3 = (val) => {
|
|
203
204
|
const data = Object.assign(Object.assign({}, val), (variantOptions[val.variant] && {
|
|
204
205
|
icon: variantOptions[val.variant].icon,
|
|
205
206
|
value: variantOptions[val.variant].text,
|
|
206
207
|
iconPosition: Bcm.IconPosition[variantOptions[val.variant].iconPosition],
|
|
207
208
|
variantColor: variantOptions[val.variant].color
|
|
208
209
|
}));
|
|
209
|
-
state.value.set(data.id, data);
|
|
210
|
+
state$3.value.set(data.id, data);
|
|
210
211
|
};
|
|
211
|
-
const removeValue = (_id) => {
|
|
212
|
-
state.value.delete(_id);
|
|
212
|
+
const removeValue$2 = (_id) => {
|
|
213
|
+
state$3.value.delete(_id);
|
|
213
214
|
};
|
|
214
|
-
const getValue = (id) => snq(() => state.value.get(id), {});
|
|
215
|
+
const getValue$3 = (id) => snq(() => state$3.value.get(id), {});
|
|
215
216
|
const buttonState = {
|
|
216
|
-
setValue,
|
|
217
|
-
removeValue,
|
|
218
|
-
getValue
|
|
217
|
+
setValue: setValue$3,
|
|
218
|
+
removeValue: removeValue$2,
|
|
219
|
+
getValue: getValue$3
|
|
219
220
|
};
|
|
220
221
|
|
|
221
222
|
const ButtonTemplate = ({ value, type, componentClass, disabled, href, target, loading, isIconOnly, icon, iconPosition, id }) => {
|
|
@@ -236,7 +237,7 @@ const ButtonTemplate = ({ value, type, componentClass, disabled, href, target, l
|
|
|
236
237
|
|
|
237
238
|
const buttonCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); .size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-button{display:inline-flex;width:fit-content;height:fit-content;--bcm-button-solid-color-default:var(--bcm-new-ds-color-white);--bcm-button-solid-background-color-default:var(--bcm-new-ds-color-blue-500);--bcm-button-solid-border-default:var(--bcm-new-ds-color-blue-500);--bcm-button-solid-color-hover:var(--bcm-new-ds-color-white);--bcm-button-solid-background-color-hover:var(--bcm-new-ds-color-blue-600);--bcm-button-solid-border-hover:var(--bcm-new-ds-color-blue-600);--bcm-button-solid-color-focus-visible:var(--bcm-new-ds-color-white);--bcm-button-solid-background-color-focus-visible:var(--bcm-new-ds-color-blue-800);--bcm-button-solid-border-focus-visible:var(--bcm-new-ds-color-blue-800);--bcm-button-solid-color-active:var(--bcm-new-ds-color-white);--bcm-button-solid-background-color-active:var(--bcm-new-ds-color-blue-700);--bcm-button-solid-border-active:var(--bcm-new-ds-color-blue-700);--bcm-button-solid-color-disabled:var(--bcm-new-ds-color-white);--bcm-button-solid-background-color-disabled:var(--bcm-new-ds-color-slate-400);--bcm-button-solid-border-disabled:var(--bcm-new-ds-color-slate-400);--bcm-button-ghost-color-default:var(--bcm-new-ds-color-slate-600);--bcm-button-ghost-background-color-default:var(--bcm-new-ds-color-slate-100);--bcm-button-ghost-border-default:var(--bcm-new-ds-color-slate-300);--bcm-button-ghost-color-hover:var(--bcm-new-ds-color-slate-600);--bcm-button-ghost-background-color-hover:var(--bcm-new-ds-color-slate-200);--bcm-button-ghost-border-hover:var(--bcm-new-ds-color-slate-400);--bcm-button-ghost-color-focus-visible:var(--bcm-new-ds-color-slate-600);--bcm-button-ghost-background-color-focus-visible:var(--bcm-new-ds-color-slate-400);--bcm-button-ghost-border-focus-visible:var(--bcm-new-ds-color-slate-600);--bcm-button-ghost-color-active:var(--bcm-new-ds-color-slate-600);--bcm-button-ghost-background-color-active:var(--bcm-new-ds-color-slate-300);--bcm-button-ghost-border-active:var(--bcm-new-ds-color-slate-500);--bcm-button-ghost-color-disabled:var(--bcm-new-ds-color-slate-300);--bcm-button-ghost-background-color-disabled:var(--bcm-new-ds-color-slate-50);--bcm-button-ghost-border-disabled:var(--bcm-new-ds-color-slate-200);--bcm-button-link-color-default:var(--bcm-new-ds-color-blue-500);--bcm-button-link-background-color-default:var(--bcm-new-ds-color-transparent);--bcm-button-link-border-default:var(--bcm-new-ds-color-transparent);--bcm-button-link-color-hover:var(--bcm-new-ds-color-blue-600);--bcm-button-link-background-color-hover:var(--bcm-new-ds-color-transparent);--bcm-button-link-border-hover:var(--bcm-new-ds-color-transparent);--bcm-button-link-color-focus-visible:var(--bcm-new-ds-color-blue-800);--bcm-button-link-background-color-focus-visible:var(--bcm-new-ds-color-slate-50);--bcm-button-link-border-focus-visible:var(--bcm-new-ds-color-slate-50);--bcm-button-link-color-active:var(--bcm-new-ds-color-blue-700);--bcm-button-link-background-color-active:var(--bcm-new-ds-color-slate-50);--bcm-button-link-border-active:var(--bcm-new-ds-color-slate-50);--bcm-button-link-color-disabled:var(--bcm-new-ds-color-slate-400);--bcm-button-link-background-color-disabled:var(--bcm-new-ds-color-transparent);--bcm-button-link-border-disabled:var(--bcm-new-ds-color-transparent)}.bcm-button.full-width{width:100%}.bcm-button.full-width .bcm-button__container{width:100%}.bcm-button:after,.bcm-button:before{content:\"\";clear:both}.bcm-button__container{border:none;color:inherit;background-color:inherit;padding:0;margin:0;font:inherit;cursor:pointer;outline:none;text-decoration:none;font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:4px 12px;outline:none;border-radius:4px;transition:background-color 0.1s ease-in-out;position:relative;min-width:40px;border-width:1px;border-style:solid;border-color:initial}.bcm-button__container:hover,.bcm-button__container:focus,.bcm-button__container:active{outline:none;text-decoration:none}.bcm-button__container-loading{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:4px;display:flex;align-items:center;justify-content:center}.bcm-button__container-kind-solid{color:var(--bcm-button-solid-color-default);background-color:var(--bcm-button-solid-background-color-default);border-color:var(--bcm-button-solid-border-default)}.bcm-button__container-kind-solid:hover{color:var(--bcm-button-solid-color-hover);background-color:var(--bcm-button-solid-background-color-hover);border-color:var(--bcm-button-solid-border-hover)}.bcm-button__container-kind-solid:focus-visible{color:var(--bcm-button-solid-color-focus-visible);background-color:var(--bcm-button-solid-background-color-focus-visible);border-color:var(--bcm-button-solid-border-focus-visible)}.bcm-button__container-kind-solid:active{color:var(--bcm-button-solid-color-active);background-color:var(--bcm-button-solid-background-color-active);border-color:var(--bcm-button-solid-border-active)}.bcm-button__container-kind-solid:disabled{color:var(--bcm-button-solid-color-disabled);background-color:var(--bcm-button-solid-background-color-disabled);border-color:var(--bcm-button-solid-border-disabled)}.bcm-button__container-kind-solid.checked{color:var(--bcm-button-solid-color-active);background-color:var(--bcm-button-solid-background-color-active);border-color:var(--bcm-button-solid-border-active)}.bcm-button__container-kind-solid.disabled{color:var(--bcm-button-solid-color-disabled);background-color:var(--bcm-button-solid-background-color-disabled);border-color:var(--bcm-button-solid-border-disabled)}.bcm-button__container-kind-solid .bcm-button__container-loading{color:var(--bcm-button-solid-color-default);background-color:var(--bcm-button-solid-background-color-default);border-color:var(--bcm-button-solid-border-default)}.bcm-button__container-kind-ghost{color:var(--bcm-button-ghost-color-default);background-color:var(--bcm-button-ghost-background-color-default);border-color:var(--bcm-button-ghost-border-default)}.bcm-button__container-kind-ghost:not([disabled]) .bcm-icon{color:var(--bcm-new-ds-color-slate-500)}.bcm-button__container-kind-ghost:hover{color:var(--bcm-button-ghost-color-hover);background-color:var(--bcm-button-ghost-background-color-hover);border-color:var(--bcm-button-ghost-border-hover)}.bcm-button__container-kind-ghost:focus-visible{color:var(--bcm-button-ghost-color-focus-visible);background-color:var(--bcm-button-ghost-background-color-focus-visible);border-color:var(--bcm-button-ghost-border-focus-visible)}.bcm-button__container-kind-ghost:active{color:var(--bcm-button-ghost-color-active);background-color:var(--bcm-button-ghost-background-color-active);border-color:var(--bcm-button-ghost-border-active)}.bcm-button__container-kind-ghost:disabled{color:var(--bcm-button-ghost-color-disabled);background-color:var(--bcm-button-ghost-background-color-disabled);border-color:var(--bcm-button-ghost-border-disabled)}.bcm-button__container-kind-ghost.checked{color:var(--bcm-button-ghost-color-active);background-color:var(--bcm-button-ghost-background-color-active);border-color:var(--bcm-button-ghost-border-active)}.bcm-button__container-kind-ghost.disabled{color:var(--bcm-button-ghost-color-disabled);background-color:var(--bcm-button-ghost-background-color-disabled);border-color:var(--bcm-button-ghost-border-disabled)}.bcm-button__container-kind-ghost .bcm-button__container-loading{color:var(--bcm-button-ghost-color-default);background-color:var(--bcm-button-ghost-background-color-default);border-color:var(--bcm-button-ghost-border-default)}.bcm-button__container-kind-link{color:var(--bcm-button-link-color-default);background-color:var(--bcm-button-link-background-color-default);border-color:var(--bcm-button-link-border-default)}.bcm-button__container-kind-link:hover{color:var(--bcm-button-link-color-hover);background-color:var(--bcm-button-link-background-color-hover);border-color:var(--bcm-button-link-border-hover)}.bcm-button__container-kind-link:focus-visible{color:var(--bcm-button-link-color-focus-visible);background-color:var(--bcm-button-link-background-color-focus-visible);border-color:var(--bcm-button-link-border-focus-visible)}.bcm-button__container-kind-link:active{color:var(--bcm-button-link-color-active);background-color:var(--bcm-button-link-background-color-active);border-color:var(--bcm-button-link-border-active)}.bcm-button__container-kind-link:disabled{color:var(--bcm-button-link-color-disabled);background-color:var(--bcm-button-link-background-color-disabled);border-color:var(--bcm-button-link-border-disabled)}.bcm-button__container-kind-link.checked{color:var(--bcm-button-link-color-active);background-color:var(--bcm-button-link-background-color-active);border-color:var(--bcm-button-link-border-active)}.bcm-button__container-kind-link.disabled{color:var(--bcm-button-link-color-disabled);background-color:var(--bcm-button-link-background-color-disabled);border-color:var(--bcm-button-link-border-disabled)}.bcm-button__container-kind-link .bcm-button__container-loading{color:var(--bcm-button-link-color-default);background-color:var(--bcm-button-link-background-color-default);border-color:var(--bcm-button-link-border-default)}.bcm-button__container[disabled]{cursor:not-allowed}.bcm-button__container-text{order:3;display:flex;align-items:center;gap:8px;white-space:nowrap}.bcm-button__container-icon{min-height:calc(12px + 8px)}.bcm-button__container-icon.prefix{order:2}.bcm-button__container-icon.suffix{order:4}.bcm-button__container-size-small{font-size:12px;line-height:calc(12px + 8px);padding:calc(4px - 3px) 12px;min-height:calc(calc(12px + 8px) + calc(calc(4px - 2px)) * 2)}.bcm-button__container-size-small .bcm-button__container-icon{min-height:calc(12px + 8px)}.bcm-button__container-size-medium{font-size:calc(12px + 1px);line-height:calc(12px + 8px);padding:calc(4px + 1px) 12px;min-height:calc(calc(12px + 8px) + calc(calc(4px + 2px)) * 2)}.bcm-button__container-size-medium .bcm-button__container-icon{min-height:calc(12px + 8px)}.bcm-button__container-size-large{font-size:16px;line-height:calc(16px + 8px);padding:calc(8px - 1px) 12px;min-height:calc(calc(16px + 8px) + (calc(8px) * 2))}.bcm-button__container-size-large .bcm-button__container-icon{min-height:calc(16px + 8px)}";
|
|
238
239
|
|
|
239
|
-
var __decorate$
|
|
240
|
+
var __decorate$b = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
240
241
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
241
242
|
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
242
243
|
r = Reflect.decorate(decorators, target, key, desc);
|
|
@@ -384,7 +385,7 @@ const BcmButton = class {
|
|
|
384
385
|
}
|
|
385
386
|
get el() { return getElement(this); }
|
|
386
387
|
};
|
|
387
|
-
__decorate$
|
|
388
|
+
__decorate$b([
|
|
388
389
|
IsLoad()
|
|
389
390
|
], BcmButton.prototype, "el", void 0);
|
|
390
391
|
BcmButton.style = buttonCss;
|
|
@@ -18179,7 +18180,7 @@ const validate = new rules;
|
|
|
18179
18180
|
|
|
18180
18181
|
const formCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:host{display:block;margin-bottom:8px}:host(.hidden){display:none}";
|
|
18181
18182
|
|
|
18182
|
-
var __decorate$
|
|
18183
|
+
var __decorate$a = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
18183
18184
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
18184
18185
|
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
18185
18186
|
r = Reflect.decorate(decorators, target, key, desc);
|
|
@@ -18598,14 +18599,14 @@ const BcmForm = class {
|
|
|
18598
18599
|
}
|
|
18599
18600
|
get el() { return getElement(this); }
|
|
18600
18601
|
};
|
|
18601
|
-
__decorate$
|
|
18602
|
+
__decorate$a([
|
|
18602
18603
|
IsLoad()
|
|
18603
18604
|
], BcmForm.prototype, "el", void 0);
|
|
18604
18605
|
BcmForm.style = formCss;
|
|
18605
18606
|
|
|
18606
18607
|
const iconCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");.size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}.bcm-icon.hidden{display:none}";
|
|
18607
18608
|
|
|
18608
|
-
var __decorate$
|
|
18609
|
+
var __decorate$9 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
18609
18610
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
18610
18611
|
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
18611
18612
|
r = Reflect.decorate(decorators, target, key, desc);
|
|
@@ -18627,14 +18628,14 @@ const BcmIcon = class {
|
|
|
18627
18628
|
}
|
|
18628
18629
|
get el() { return getElement(this); }
|
|
18629
18630
|
};
|
|
18630
|
-
__decorate$
|
|
18631
|
+
__decorate$9([
|
|
18631
18632
|
IsLoad()
|
|
18632
18633
|
], BcmIcon.prototype, "el", void 0);
|
|
18633
18634
|
BcmIcon.style = iconCss;
|
|
18634
18635
|
|
|
18635
18636
|
const inputCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); @import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); @import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); .size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-caption-area{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;font-size:12px;line-height:calc(12px + 8px);color:var(--bcm-new-ds-color-slate-400);display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;flex-wrap:nowrap;margin-top:2px}.bcm-caption-area__text{color:var(--bcm-new-ds-color-slate-400)}.bcm-caption-area__text.default{color:var(--bcm-new-ds-color-slate-400)}.bcm-caption-area__text.info{color:var(--bcm-new-ds-color-blue-500)}.bcm-caption-area__text.success{color:var(--bcm-new-ds-color-emerald-500)}.bcm-caption-area__text.warning{color:var(--bcm-new-ds-color-amber-500)}.bcm-caption-area__text.error{color:var(--bcm-new-ds-color-red-500)}.bcm-caption-area__size-small{font-size:10px;line-height:calc(10px + 8px);min-height:calc(10px + 8px)}.bcm-caption-area__size-medium{font-size:12px;line-height:calc(12px + 8px);min-height:calc(12px + 8px)}.bcm-caption-area__size-large{font-size:14px;line-height:calc(14px + 8px);min-height:calc(14px + 8px)}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-label{display:inline-flex;align-items:flex-start;grid-gap:2px}.bcm-label__text{margin-bottom:2px;font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;display:inline-block;color:var(--bcm-new-ds-color-slate-600)}.bcm-label__size-small{font-size:10px;line-height:calc(10px + 8px);min-height:calc(10px + 8px)}.bcm-label__size-medium{font-size:12px;line-height:calc(12px + 8px);min-height:calc(12px + 8px)}.bcm-label__size-large{font-size:14px;line-height:calc(14px + 8px);min-height:calc(14px + 8px)}.bcm-input[no-margin]{margin:0}.bcm-textarea[no-margin]{margin:0}.bcm-switch[no-margin]{margin:0}.bcm-checkbox[no-margin]{margin:0}.bcm-radio-group[no-margin]{margin:0}.bcm-checkbox-group[no-margin]{margin:0}.bcm-range[no-margin]{margin:0}.bcm-form[no-margin]{margin:0}.bcm-form-group[no-margin]{margin:0}.bcm-list[no-margin]{margin:0}.bcm-colorpicker[no-margin]{margin:0}.bcm-date-picker[no-margin]{margin:0}.bcm-time-picker[no-margin]{margin:0}.bcm-datetime-picker[no-margin]{margin:0}.bcm-select[no-margin]{margin:0}.bcm-listbox[no-margin]{margin:0}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-input{display:inline-flex;flex-direction:column;width:100%;max-width:256px;margin-bottom:8px}.bcm-input.full-width{max-width:100%}.bcm-input.hidden{display:none}.bcm-input__container{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;display:flex;align-items:stretch;flex-direction:row;background-color:var(--bcm-new-ds-color-white);border:1px solid var(--bcm-new-ds-color-slate-300);border-radius:4px;box-sizing:border-box;cursor:text;padding:0 0 0 4px;position:relative;width:100%}.bcm-input__container.disabled{background-color:var(--bcm-new-ds-color-slate-50);cursor:not-allowed}.bcm-input__container.disabled .bcm-input-element{color:var(--bcm-new-ds-color-slate-500)}.bcm-input__container.readonly{background-color:var(--bcm-new-ds-color-slate-50);cursor:default}.bcm-input__container.readonly .bcm-input-element{color:var(--bcm-new-ds-color-slate-600)}.bcm-input__container:not(.disabled):hover .caret-container,.bcm-input__container:not(.disabled).focused .caret-container{opacity:1}.bcm-input__container:not(.disabled):hover .input-clear-button,.bcm-input__container:not(.disabled).focused .input-clear-button{opacity:1}.bcm-input__container:not(.disabled).focused{background-color:var(--bcm-new-ds-color-slate-50)}.bcm-input__container:not(.disabled):hover{border-color:var(--bcm-color-prime-blue-6)}.bcm-input__container.empty .input-clear-button{display:none}.bcm-input__container.invalid,.bcm-input__container.error{border-color:var(--bcm-new-ds-color-red-500)}.bcm-input__container .bcm-input-element{width:100%;color:var(--bcm-new-ds-color-slate-600);flex:1;border:none;background:transparent;box-shadow:unset;padding:0 4px;font-family:\"Inter\", sans-serif;cursor:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bcm-input__container .bcm-input-element::placeholder{font-family:\"Inter\", sans-serif;color:var(--bcm-new-ds-color-slate-300);user-select:none}.bcm-input__container .bcm-input-element::-webkit-search-decoration,.bcm-input__container .bcm-input-element::-webkit-search-cancel-button,.bcm-input__container .bcm-input-element::-webkit-search-results-button,.bcm-input__container .bcm-input-element::-webkit-search-results-decoration,.bcm-input__container .bcm-input-element::-webkit-calendar-picker-indicator,.bcm-input__container .bcm-input-element::-webkit-inner-spin-button,.bcm-input__container .bcm-input-element::-webkit-outer-spin-button{-webkit-appearance:none}.bcm-input__container .caret-container{width:30px;display:flex;flex-direction:column;justify-content:center;align-items:stretch;border-left:1px solid #D9D9D9;transition:0.2s opacity;user-select:none;box-sizing:border-box}.bcm-input__container .caret-container .bcm-input-caret{display:flex;align-items:center;justify-content:center;color:var(--bcm-color-grey-7);cursor:pointer;flex:1}.bcm-input__container .caret-container .bcm-input-caret bcm-icon{line-height:1}.bcm-input__container .caret-container .bcm-input-caret:hover{color:var(--bcm-color-prime-blue-6)}.bcm-input__container .caret-container .bcm-input-caret:active{background-color:var(--bcm-color-grey-3)}.bcm-input__container .caret-container .bcm-input-caret:last-child{border-top:1px solid #D9D9D9}.bcm-input__container .caret-container.disabled{background-color:var(--bcm-color-grey-3)}.bcm-input__container .caret-container.disabled .bcm-input-caret{cursor:not-allowed}.bcm-input__container .input-suffix-content{display:flex;align-items:center;justify-content:center}.bcm-input__container .input-prefix:not(:empty){padding-left:4px}.bcm-input__container .input-suffix:not(:empty){min-width:24px;padding-right:4px}.bcm-input__container .input-prefix:not(:empty),.bcm-input__container .input-suffix:not(:empty){display:flex;align-items:center;justify-content:center;cursor:default;color:#64748a}.bcm-input__container .input-prefix:not(:empty) .unit-prefix,.bcm-input__container .input-suffix:not(:empty) .unit-prefix{color:#64748a}.bcm-input__container .input-prefix-button:not(:empty),.bcm-input__container .input-suffix-button:not(:empty){cursor:pointer}.bcm-input__container .caret-container,.bcm-input__container .input-clear-button{opacity:0}.bcm-input__container--small{font-size:12px}.bcm-input__container--medium{font-size:14px}.bcm-input__container--large{font-size:16px}.bcm-input__textarea .bcm-input-element{white-space:normal}.bcm-input__textarea.clearable .bcm-input-element{padding-right:24px}.bcm-input__textarea .input-clear-button{position:absolute;top:4px;right:0}";
|
|
18636
18637
|
|
|
18637
|
-
var __decorate$
|
|
18638
|
+
var __decorate$8 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
18638
18639
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
18639
18640
|
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
18640
18641
|
r = Reflect.decorate(decorators, target, key, desc);
|
|
@@ -18972,14 +18973,14 @@ const BcmInput = class {
|
|
|
18972
18973
|
"value": ["watchValue"]
|
|
18973
18974
|
}; }
|
|
18974
18975
|
};
|
|
18975
|
-
__decorate$
|
|
18976
|
+
__decorate$8([
|
|
18976
18977
|
IsLoad()
|
|
18977
18978
|
], BcmInput.prototype, "inputElement", void 0);
|
|
18978
18979
|
BcmInput.style = inputCss;
|
|
18979
18980
|
|
|
18980
18981
|
const labelCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); .size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-label{display:inline-flex;align-items:flex-start;grid-gap:2px}.bcm-label__text{margin-bottom:2px;font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;display:inline-block;color:var(--bcm-new-ds-color-slate-600)}.bcm-label__size-small{font-size:10px;line-height:calc(10px + 8px);min-height:calc(10px + 8px)}.bcm-label__size-medium{font-size:12px;line-height:calc(12px + 8px);min-height:calc(12px + 8px)}.bcm-label__size-large{font-size:14px;line-height:calc(14px + 8px);min-height:calc(14px + 8px)}";
|
|
18981
18982
|
|
|
18982
|
-
var __decorate$
|
|
18983
|
+
var __decorate$7 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
18983
18984
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
18984
18985
|
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
18985
18986
|
r = Reflect.decorate(decorators, target, key, desc);
|
|
@@ -19010,12 +19011,12 @@ const BcmLabel = class {
|
|
|
19010
19011
|
}
|
|
19011
19012
|
get el() { return getElement(this); }
|
|
19012
19013
|
};
|
|
19013
|
-
__decorate$
|
|
19014
|
+
__decorate$7([
|
|
19014
19015
|
IsLoad()
|
|
19015
19016
|
], BcmLabel.prototype, "el", void 0);
|
|
19016
19017
|
BcmLabel.style = labelCss;
|
|
19017
19018
|
|
|
19018
|
-
var __decorate$
|
|
19019
|
+
var __decorate$6 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
19019
19020
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
19020
19021
|
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
19021
19022
|
r = Reflect.decorate(decorators, target, key, desc);
|
|
@@ -19181,181 +19182,2422 @@ const BcmLinked = class {
|
|
|
19181
19182
|
"isOpen": ["watchIsOpen"]
|
|
19182
19183
|
}; }
|
|
19183
19184
|
};
|
|
19184
|
-
__decorate$
|
|
19185
|
+
__decorate$6([
|
|
19185
19186
|
IsLoad()
|
|
19186
19187
|
], BcmLinked.prototype, "el", void 0);
|
|
19187
19188
|
|
|
19188
|
-
const
|
|
19189
|
-
|
|
19190
|
-
|
|
19191
|
-
|
|
19192
|
-
|
|
19193
|
-
|
|
19194
|
-
|
|
19195
|
-
|
|
19196
|
-
|
|
19197
|
-
|
|
19198
|
-
|
|
19199
|
-
|
|
19189
|
+
const CheckboxTemplate = ({ disabled, checked, readonly, required, indeterminate, hidden, captionType, _id }) => {
|
|
19190
|
+
// if ( indeterminate ) {
|
|
19191
|
+
// checked = indeterminate == 'determinate' ? true : false
|
|
19192
|
+
// }
|
|
19193
|
+
const hostClasses = classnames('bcm-checkbox', 'bcm-checkbox__type-default', `bcm-checkbox-size-medium`, {
|
|
19194
|
+
// 'size-2': size === Bcm.Size.small || size === Bcm.Size.medium,
|
|
19195
|
+
// 'size-3': optionType === 'button' && size === Bcm.Size.large,
|
|
19196
|
+
'error': captionType == Bcm.Status.error,
|
|
19197
|
+
hidden,
|
|
19198
|
+
checked,
|
|
19199
|
+
disabled,
|
|
19200
|
+
required,
|
|
19201
|
+
readonly,
|
|
19202
|
+
});
|
|
19203
|
+
const bcmCheckboxIconClass = classnames('bcm-checkbox__label-icon', 'bcm-checkbox__label-icon-lite', 'bcm-checkbox__label-icon-' + indeterminate, {
|
|
19204
|
+
'bcm-checkbox__label-icon-checked': checked,
|
|
19205
|
+
});
|
|
19206
|
+
const bcmCheckboxLabelClass = classnames('bcm-checkbox__label');
|
|
19207
|
+
return (h$1("div", { class: hostClasses },
|
|
19208
|
+
h$1("input", { tabindex: "-1", id: _id, type: "checkbox", checked: checked, disabled: disabled, required: required, readonly: readonly }),
|
|
19209
|
+
h$1("label", { class: bcmCheckboxLabelClass, htmlFor: _id },
|
|
19210
|
+
h$1("span", { class: bcmCheckboxIconClass },
|
|
19211
|
+
h$1("bcm-icon", { icon: "far fa-check" })))));
|
|
19212
|
+
};
|
|
19213
|
+
|
|
19214
|
+
const InfoFooterTemplate = ({ selected, total, found, multiple, variableText }) => {
|
|
19215
|
+
total = total || 0;
|
|
19216
|
+
variableText = variableText ? pluralize(variableText, total) : 'items';
|
|
19217
|
+
return (h$1("footer", { class: "bcm-info-footer" },
|
|
19218
|
+
h$1("bcm-text", { scale: "size-1", color: "grey-8" },
|
|
19219
|
+
(multiple && selected > 0) && ` ( ${selected} selected ) `,
|
|
19220
|
+
` Total ${total} `,
|
|
19221
|
+
found != null && ` / ${found} `,
|
|
19222
|
+
` ${variableText} found. `)));
|
|
19223
|
+
};
|
|
19224
|
+
|
|
19225
|
+
const ListItemTemplate = ({ item, treeview, highlight, checkboxes, size, selectedItem, openGroup, checkedItem, focusItem, searchIsOnlyChilds }) => {
|
|
19226
|
+
const isHaveChildren = item.items && item.items.length > 0;
|
|
19227
|
+
var text = StringHelper.htmlEntities(item.text);
|
|
19228
|
+
let intersection = [];
|
|
19229
|
+
if (highlight && StringHelper.slugify(text).includes(StringHelper.slugify(highlight))) {
|
|
19230
|
+
if (!searchIsOnlyChilds || (searchIsOnlyChilds && (!isHaveChildren || (!treeview && item.type != "group")))) {
|
|
19231
|
+
text = StringHelper.highlight(text, highlight);
|
|
19232
|
+
}
|
|
19200
19233
|
}
|
|
19201
|
-
|
|
19202
|
-
const
|
|
19203
|
-
|
|
19204
|
-
|
|
19205
|
-
|
|
19206
|
-
|
|
19207
|
-
|
|
19208
|
-
"tw-text-4": size === Bcm$1.Size.large,
|
|
19209
|
-
}), style: (Generate.getTwColor(color)) }, h$1("label", { class: classnames("tw-inline-flex tw-flex-row tw-gap-2 tw-mr-2 tw-items-center", disabled ? "tw-cursor-not-allowed" : "tw-cursor-pointer"), htmlFor: _id + '-input' }, h$1("input", { id: _id + '-input', type: "radio", value: value, checked: checked, disabled: disabled, class: classnames("tw-flex tw-items-center tw-justify-center", "tw-relative tw-appearance-none tw-border tw-rounded-full tw-cursor-pointer tw-transition tw-ease-in-out ", "tw-m-0", "before:tw-content-[''] before:tw-absolute before:tw-rounded-full", {
|
|
19210
|
-
"tw-w-4 tw-h-4 before:tw-w-2.5 before:tw-h-2.5": size === Bcm$1.Size.medium,
|
|
19211
|
-
"tw-w-3.5 tw-h-3.5 before:tw-w-2 before:tw-h-2": size === Bcm$1.Size.small,
|
|
19212
|
-
"tw-w-4.5 tw-h-4.5 before:tw-w-3 before:tw-h-3": size === Bcm$1.Size.large,
|
|
19213
|
-
}, "focus:tw-outline-none focus:tw-shadow-outline",
|
|
19214
|
-
// default
|
|
19215
|
-
`tw-border-slate-400 tw-bg-slate-50`, `checked:tw-border-default-500`, `checked:before:tw-bg-default-500`,
|
|
19216
|
-
// disabled
|
|
19217
|
-
`disabled:tw-border-slate-400 disabled:tw-bg-slate-200 disabled:tw-cursor-not-allowed`, `disabled:checked:tw-border-slate-400`, `disabled:checked:before:tw-bg-slate-400`, !disabled && classnames(
|
|
19218
|
-
// hover
|
|
19219
|
-
`hover:tw-border-default-600`, `hover:checked:tw-border-default-600`, `hover:checked:before:tw-bg-default-600`,
|
|
19220
|
-
// focus-visible
|
|
19221
|
-
`focus-visible:tw-border-default-800 focus-visible:tw-shadow-sm`, `focus-visible:checked:tw-border-default-800`, `focus-visible:checked:before:tw-bg-default-800`,
|
|
19222
|
-
// active
|
|
19223
|
-
`active:tw-border-default-700`, `active:checked:tw-border-default-700`, `active:checked:before:tw-bg-default-700`)), onChange: () => this.radioChange.emit(), onFocus: () => this.focus.emit(), onBlur: () => this.blur.emit() }), h$1("slot", null))));
|
|
19234
|
+
if (item.type != 'group' && item.template) {
|
|
19235
|
+
const match = item.template
|
|
19236
|
+
.replace(/\s/g, '')
|
|
19237
|
+
.match(/\{{[^}}]+\}/g)
|
|
19238
|
+
.map(x => x.replace(/[{}]/g, ''));
|
|
19239
|
+
const keys = Object.keys(item.itemObject);
|
|
19240
|
+
intersection = match.filter(x => keys.includes(x));
|
|
19224
19241
|
}
|
|
19225
|
-
|
|
19242
|
+
text = item.isHtmlContent ? item.isHtmlContent : item.template && intersection.length > 0 ? StringHelper.templateParser(item.template, Object.assign(Object.assign({}, item.itemObject), { text })) : text;
|
|
19243
|
+
const unClickable = !treeview && item.type == "group" && !item.clickable;
|
|
19244
|
+
const disabled = item.disabled;
|
|
19245
|
+
const readonly = item.readonly;
|
|
19246
|
+
const itemClick = (event) => {
|
|
19247
|
+
let path = event.path || event.composedPath();
|
|
19248
|
+
if (path.filter(x => x.attributes && x.attributes.getNamedItem("unlinked"))[0]) {
|
|
19249
|
+
return;
|
|
19250
|
+
}
|
|
19251
|
+
if (readonly) {
|
|
19252
|
+
collapseClick();
|
|
19253
|
+
}
|
|
19254
|
+
!unClickable && !disabled && !readonly && (checkboxes ? checkedItem(item.id) : selectedItem(item.id));
|
|
19255
|
+
};
|
|
19256
|
+
const collapseClick = () => {
|
|
19257
|
+
item.open = item.isSearching;
|
|
19258
|
+
openGroup(item.id);
|
|
19259
|
+
};
|
|
19260
|
+
return (h$1("div", { id: item.id, hidden: item.hidden, "on-focus": e => !unClickable && !disabled && focusItem(e), class: classnames('bcm-list__item',
|
|
19261
|
+
// size === 'large' ? 'size-3' : 'size-2',
|
|
19262
|
+
'bcm-list__item-' + size, {
|
|
19263
|
+
'bcm-list__item--group': !treeview && item.type == 'group',
|
|
19264
|
+
'bcm-list__item--readonly': readonly,
|
|
19265
|
+
}) },
|
|
19266
|
+
h$1("div", { class: classnames('bcm-list__item-content', !checkboxes && item.selected && 'selected', { disabled: disabled }) },
|
|
19267
|
+
treeview && (h$1("div", { class: "bcm-list__item-content-collapse-icon", onClick: () => collapseClick() }, isHaveChildren && h$1("bcm-icon", { icon: classnames('fas fa-caret-' + (item.isSearching || item.open ? 'down' : 'right')) }))),
|
|
19268
|
+
h$1("div", { class: classnames('bcm-list__item-content-text', { treeview }), onClick: (e) => itemClick(e) },
|
|
19269
|
+
checkboxes && (treeview || (!treeview && item.type != 'group')) && (h$1("div", { class: "bcm-list__item-content-text-checkbox" },
|
|
19270
|
+
h$1(CheckboxTemplate, { indeterminate: item.indeterminate, checked: item.checked, disabled: item.disabled }))),
|
|
19271
|
+
h$1("span", Object.assign({ class: "bcm-list__item-content-text-inner" }, (item.title && { "title": item.title }), { innerHTML: text })))),
|
|
19272
|
+
(treeview || !treeview && item.type == "group") && isHaveChildren && (h$1("div", { class: "bcm-list__item-childs" }, (item.isSearching || item.open || (!treeview && item.type == "group")) &&
|
|
19273
|
+
item.items.map((item) => (h$1(ListItemTemplate, { highlight: highlight, item: item, searchIsOnlyChilds: searchIsOnlyChilds, treeview: treeview, checkboxes: checkboxes, size: size, selectedItem: selectedItem, checkedItem: checkedItem, openGroup: parentId => openGroup(parentId), focusItem: itemId => focusItem(itemId) })))))));
|
|
19226
19274
|
};
|
|
19227
19275
|
|
|
19228
|
-
|
|
19229
|
-
|
|
19230
|
-
|
|
19231
|
-
|
|
19232
|
-
|
|
19233
|
-
|
|
19234
|
-
|
|
19235
|
-
|
|
19236
|
-
|
|
19276
|
+
const ListTemplate = ({ highlight, selectAllItem, bcmListContainer, treeview, checkboxes, checkAll, infoFooter, value, totalData, searchFound, variableText, _id, data, width, height, size, searchPlaceholder, minSearchLength, selectedItem, openGroup, checkedItem, onScrollEvent, focusItem, items, searchable, searchIsOnlyChilds, emptyText, emptyIcon, }) => {
|
|
19277
|
+
const showSelectAll = !(treeview && searchFound > 0) && !(searchFound > 0);
|
|
19278
|
+
const setScrollHeight = () => {
|
|
19279
|
+
const itemHeight = size === 'small' ? 28 : size === 'medium' ? 36 : 48;
|
|
19280
|
+
const itemCount = searchFound >= 0 || (treeview ? items.length : totalData);
|
|
19281
|
+
let scrollHeight = itemCount * itemHeight || 0;
|
|
19282
|
+
return {
|
|
19283
|
+
'min-height': `${scrollHeight}px`,
|
|
19284
|
+
'overscroll-behavior': 'none',
|
|
19285
|
+
'height': '100%',
|
|
19286
|
+
'display': 'flex',
|
|
19287
|
+
'flex-direction': 'column',
|
|
19288
|
+
};
|
|
19289
|
+
};
|
|
19290
|
+
return (h$1("div", { id: `bcm-list-${_id}`, class: bcmListContainer, style: { '--height': height, '--width': width } },
|
|
19291
|
+
data && searchable && (h$1("section", { class: "bcm-list__container-search" },
|
|
19292
|
+
h$1("bcm-search", { size: size, id: `bcm-list-${_id}-search`, data: data, clearable: true, placeholder: searchPlaceholder, "min-search-length": minSearchLength, searchIsOnlyChilds: searchIsOnlyChilds }))),
|
|
19293
|
+
h$1("main", { onScroll: e => onScrollEvent(e), class: "scrolling", style: { 'overscroll-behavior': 'none' } },
|
|
19294
|
+
h$1("div", { style: setScrollHeight() },
|
|
19295
|
+
checkAll && searchFound != 0 && items && items.length > 0 && checkboxes && showSelectAll && (h$1("section", { class: "bcm-list__container-select-all" },
|
|
19296
|
+
h$1(ListItemTemplate, { size: size, item: selectAllItem, treeview: false, checkboxes: true, selectedItem: itemId => selectedItem(itemId), checkedItem: itemId => checkedItem(itemId), openGroup: parentId => openGroup(parentId), focusItem: itemId => focusItem(itemId) }))),
|
|
19297
|
+
items.map((item) => (h$1(ListItemTemplate, { highlight: highlight, size: size, item: item, searchIsOnlyChilds: searchIsOnlyChilds, treeview: treeview, checkboxes: checkboxes, selectedItem: itemId => selectedItem(itemId), checkedItem: itemId => checkedItem(itemId), openGroup: parentId => openGroup(parentId), focusItem: itemId => focusItem(itemId) }))),
|
|
19298
|
+
(!items || items.length === 0) && searchFound != 0 && (h$1("section", { class: "bcm-list__container-no-data" },
|
|
19299
|
+
h$1("bcm-empty", { style: { height: 'auto' }, icon: emptyIcon },
|
|
19300
|
+
h$1("span", { innerHTML: emptyText || 'No data' })))),
|
|
19301
|
+
searchFound == 0 && (h$1("section", { class: "bcm-list__container-no-data" },
|
|
19302
|
+
h$1("bcm-empty", { style: { height: 'auto' }, icon: emptyIcon },
|
|
19303
|
+
h$1("span", { innerHTML: emptyText || 'No Data Found' })))))),
|
|
19304
|
+
infoFooter && data && data.length > 0 && (h$1(InfoFooterTemplate, { selected: value === null || value === void 0 ? void 0 : value.length, total: totalData, found: searchFound, multiple: checkboxes, variableText: variableText }))));
|
|
19237
19305
|
};
|
|
19238
|
-
|
|
19239
|
-
|
|
19240
|
-
|
|
19241
|
-
|
|
19242
|
-
|
|
19243
|
-
|
|
19244
|
-
|
|
19245
|
-
|
|
19246
|
-
|
|
19247
|
-
|
|
19248
|
-
|
|
19249
|
-
|
|
19250
|
-
|
|
19251
|
-
|
|
19252
|
-
|
|
19253
|
-
|
|
19254
|
-
|
|
19255
|
-
|
|
19256
|
-
|
|
19257
|
-
|
|
19258
|
-
|
|
19259
|
-
|
|
19260
|
-
|
|
19306
|
+
|
|
19307
|
+
const StepperHeaderTemplate = ({ _title, description, status, valid, index, loading, active, stepChange, statusIcon, icon, disabled, headerHidden, }) => {
|
|
19308
|
+
const classes = classnames('bcm-stepper__header-item', `bcm-stepper__header-item--${status}`, {
|
|
19309
|
+
'bcm-stepper__header-item--active': active,
|
|
19310
|
+
'bcm-stepper__header-item--valid': valid,
|
|
19311
|
+
'bcm-stepper__header-item--invalid': !valid,
|
|
19312
|
+
'bcm-stepper__header-item--disabled': disabled,
|
|
19313
|
+
'hidden': headerHidden,
|
|
19314
|
+
});
|
|
19315
|
+
const defaultIcons = {
|
|
19316
|
+
success: 'fal fa-check',
|
|
19317
|
+
warning: 'fal fa-exclamation-triangle',
|
|
19318
|
+
error: 'fal fa-times',
|
|
19319
|
+
};
|
|
19320
|
+
const customIcon = (icon || (statusIcon && defaultIcons[status])) && h$1("bcm-icon", { icon: icon ? icon : defaultIcons[status] });
|
|
19321
|
+
return (h$1("div", { class: classes },
|
|
19322
|
+
h$1("div", { class: "bcm-stepper__header-item--container", onClick: () => !disabled && stepChange(index) },
|
|
19323
|
+
h$1("div", { class: "bcm-stepper__header-item-icon size-3" }, loading ? h$1("bcm-icon", { icon: "far fa-spinner-third fa-spin" }) : customIcon || index),
|
|
19324
|
+
h$1("div", { class: "bcm-stepper__header-item-title size-2" }, _title),
|
|
19325
|
+
h$1("div", { class: "bcm-stepper__header-item-description size-1" }, description))));
|
|
19326
|
+
};
|
|
19327
|
+
|
|
19328
|
+
const { state: state$2 } = createStore({
|
|
19329
|
+
value: new Map(),
|
|
19330
|
+
});
|
|
19331
|
+
const setValue$2 = val => {
|
|
19332
|
+
const { id, dataSource, options } = val;
|
|
19333
|
+
const { type, treeview, checkboxes, searchable, value, name, label, size, disabled, readonly, highlight, required, hidden, fullWidth, height, maxHeight, minHeight, width, infoFooter, variableText, template, allOpen, keyControl, checkAll, linkedComponent, placeholder, searchPlaceholder, searchIsOnlyChilds, clearable, caption, noCaption, captionType, captionError, placement, } = options;
|
|
19334
|
+
const itemOptions = { size, checkboxes, template, allOpen, highlight, treeview };
|
|
19335
|
+
const data = {
|
|
19336
|
+
id: snq(() => id, Generate.UID),
|
|
19337
|
+
dataSource: dataSource && dataSource.length > 0 && recursive$1(dataSource, itemOptions),
|
|
19338
|
+
options: {
|
|
19339
|
+
type,
|
|
19340
|
+
treeview,
|
|
19341
|
+
checkboxes,
|
|
19342
|
+
searchable,
|
|
19343
|
+
value,
|
|
19344
|
+
name,
|
|
19345
|
+
label,
|
|
19346
|
+
size,
|
|
19347
|
+
disabled,
|
|
19348
|
+
readonly,
|
|
19349
|
+
highlight,
|
|
19350
|
+
required,
|
|
19351
|
+
hidden,
|
|
19352
|
+
fullWidth,
|
|
19353
|
+
height,
|
|
19354
|
+
maxHeight,
|
|
19355
|
+
minHeight,
|
|
19356
|
+
width,
|
|
19357
|
+
infoFooter,
|
|
19358
|
+
variableText,
|
|
19359
|
+
template,
|
|
19360
|
+
allOpen,
|
|
19361
|
+
keyControl,
|
|
19362
|
+
checkAll,
|
|
19363
|
+
linkedComponent,
|
|
19364
|
+
placeholder,
|
|
19365
|
+
searchPlaceholder,
|
|
19366
|
+
searchIsOnlyChilds,
|
|
19367
|
+
clearable,
|
|
19368
|
+
caption,
|
|
19369
|
+
noCaption,
|
|
19370
|
+
captionType,
|
|
19371
|
+
captionError,
|
|
19372
|
+
placement,
|
|
19373
|
+
},
|
|
19374
|
+
totalItems: (dataSource === null || dataSource === void 0 ? void 0 : dataSource.length) > 0 && calculateTotalItems(dataSource, options.treeview),
|
|
19375
|
+
totalRoots: dataSource === null || dataSource === void 0 ? void 0 : dataSource.length,
|
|
19376
|
+
};
|
|
19377
|
+
state$2.value.set(data.id, data);
|
|
19378
|
+
};
|
|
19379
|
+
const recursive$1 = (data, options, parentId) => {
|
|
19380
|
+
let recData = [];
|
|
19381
|
+
if (data && data.length > 0) {
|
|
19382
|
+
recData = data.map(item => (Object.assign(Object.assign(Object.assign(Object.assign({ itemObject: item }, item), options), { parentId: snq(() => parentId, null), open: options.allOpen || item.open || false }), ((options.treeview || (!options.treeview && item.type == 'group')) && item.items && item.items.length > 0
|
|
19383
|
+
? { items: snq(() => recursive$1(item.items, options, item.id), []) }
|
|
19384
|
+
: { items: [] }))));
|
|
19261
19385
|
}
|
|
19262
|
-
|
|
19263
|
-
|
|
19386
|
+
return recData;
|
|
19387
|
+
};
|
|
19388
|
+
const removeValue$1 = _id => {
|
|
19389
|
+
state$2.value.delete(_id);
|
|
19390
|
+
};
|
|
19391
|
+
const getValue$2 = id => snq(() => state$2.value.get(id), {});
|
|
19392
|
+
const calculateTotalItems = (dataSource, treeview) => {
|
|
19393
|
+
let total = 0;
|
|
19394
|
+
dataSource.forEach(item => {
|
|
19395
|
+
if (treeview || (!treeview && item.type != 'group')) {
|
|
19396
|
+
total += 1;
|
|
19397
|
+
}
|
|
19398
|
+
if ((treeview || (!treeview && item.type == 'group')) && item.items) {
|
|
19399
|
+
total += calculateTotalItems(item.items, treeview);
|
|
19400
|
+
}
|
|
19401
|
+
});
|
|
19402
|
+
return total;
|
|
19403
|
+
};
|
|
19404
|
+
const getData = id => {
|
|
19405
|
+
let data = [];
|
|
19406
|
+
const value = getValue$2(id);
|
|
19407
|
+
if (value) {
|
|
19408
|
+
const { dataSource } = value;
|
|
19409
|
+
data = dataSource;
|
|
19264
19410
|
}
|
|
19265
|
-
|
|
19266
|
-
|
|
19411
|
+
return data;
|
|
19412
|
+
};
|
|
19413
|
+
const getDataPagination$1 = (id, limit = 3, ids) => {
|
|
19414
|
+
let data = [];
|
|
19415
|
+
const value = getValue$2(id);
|
|
19416
|
+
if (value) {
|
|
19417
|
+
const { dataSource } = value;
|
|
19418
|
+
data = !ids ? dataSource.slice(0, limit) : dataSource.filter(item => ids.indexOf(item.id) > -1).slice(0, limit);
|
|
19267
19419
|
}
|
|
19268
|
-
|
|
19269
|
-
|
|
19270
|
-
|
|
19420
|
+
return data;
|
|
19421
|
+
};
|
|
19422
|
+
const openGroup = (id, groupId, items, status) => {
|
|
19423
|
+
let dataSource;
|
|
19424
|
+
if (items) {
|
|
19425
|
+
dataSource = items;
|
|
19271
19426
|
}
|
|
19272
|
-
|
|
19273
|
-
|
|
19274
|
-
|
|
19427
|
+
else {
|
|
19428
|
+
const value = getValue$2(id);
|
|
19429
|
+
dataSource = value.dataSource;
|
|
19275
19430
|
}
|
|
19276
|
-
|
|
19277
|
-
|
|
19278
|
-
|
|
19279
|
-
|
|
19280
|
-
|
|
19281
|
-
if (
|
|
19282
|
-
|
|
19431
|
+
if (dataSource) {
|
|
19432
|
+
dataSource.forEach(item => {
|
|
19433
|
+
if (status != undefined) {
|
|
19434
|
+
item.open = status;
|
|
19435
|
+
}
|
|
19436
|
+
else if (item.id == groupId) {
|
|
19437
|
+
item.open = !item.open;
|
|
19438
|
+
item.isSearching = item.open;
|
|
19439
|
+
if (!item.open && item.items) {
|
|
19440
|
+
openGroup(id, groupId, item.items, false);
|
|
19441
|
+
}
|
|
19442
|
+
}
|
|
19443
|
+
else if (item.items) {
|
|
19444
|
+
openGroup(id, groupId, item.items);
|
|
19283
19445
|
}
|
|
19284
19446
|
});
|
|
19285
19447
|
}
|
|
19286
|
-
|
|
19287
|
-
|
|
19288
|
-
|
|
19448
|
+
};
|
|
19449
|
+
const removeOtherTags = (id, ids, items) => {
|
|
19450
|
+
ids = Array.isArray(ids) ? ids : [ids];
|
|
19451
|
+
let dataSource;
|
|
19452
|
+
if (items) {
|
|
19453
|
+
dataSource = items;
|
|
19289
19454
|
}
|
|
19290
|
-
|
|
19291
|
-
|
|
19292
|
-
|
|
19293
|
-
this.updateValue();
|
|
19294
|
-
this.change.emit(this.value);
|
|
19455
|
+
else {
|
|
19456
|
+
const value = getValue$2(id);
|
|
19457
|
+
dataSource = value.dataSource;
|
|
19295
19458
|
}
|
|
19296
|
-
|
|
19297
|
-
|
|
19298
|
-
|
|
19459
|
+
if (dataSource) {
|
|
19460
|
+
ids.forEach(otherTagIds => {
|
|
19461
|
+
dataSource.forEach(child => {
|
|
19462
|
+
if (child.id == otherTagIds) {
|
|
19463
|
+
child.checked = false;
|
|
19464
|
+
child.itemObject.checked = false;
|
|
19465
|
+
}
|
|
19466
|
+
else if (child.items) {
|
|
19467
|
+
onRemoveItems(id, otherTagIds, child.items);
|
|
19468
|
+
}
|
|
19469
|
+
});
|
|
19470
|
+
});
|
|
19299
19471
|
}
|
|
19300
|
-
|
|
19301
|
-
|
|
19302
|
-
|
|
19303
|
-
|
|
19304
|
-
|
|
19305
|
-
|
|
19306
|
-
|
|
19472
|
+
};
|
|
19473
|
+
const onRemoveItems = (id, itemId, items) => {
|
|
19474
|
+
if (items) {
|
|
19475
|
+
items.forEach(item => {
|
|
19476
|
+
if (item.id == itemId) {
|
|
19477
|
+
item.checked = false;
|
|
19478
|
+
item.itemObject.checked = false;
|
|
19479
|
+
indeterminateStatus(id, item.parentId);
|
|
19480
|
+
}
|
|
19481
|
+
else if (item.items) {
|
|
19482
|
+
onRemoveItems(id, itemId, item.items);
|
|
19483
|
+
}
|
|
19307
19484
|
});
|
|
19308
|
-
this.updateValue();
|
|
19309
|
-
this.change.emit(this.value);
|
|
19310
19485
|
}
|
|
19311
|
-
|
|
19312
|
-
|
|
19313
|
-
|
|
19314
|
-
|
|
19315
|
-
|
|
19316
|
-
|
|
19486
|
+
};
|
|
19487
|
+
const addChecked = (id, ids) => {
|
|
19488
|
+
const value = getValue$2(id);
|
|
19489
|
+
if (value) {
|
|
19490
|
+
ids.forEach(item => {
|
|
19491
|
+
checkedItem(id, item);
|
|
19317
19492
|
});
|
|
19318
19493
|
}
|
|
19319
|
-
|
|
19320
|
-
|
|
19321
|
-
|
|
19322
|
-
|
|
19323
|
-
|
|
19324
|
-
|
|
19325
|
-
|
|
19494
|
+
};
|
|
19495
|
+
const checkedItem = (id, itemId) => {
|
|
19496
|
+
findItem(id, itemId);
|
|
19497
|
+
};
|
|
19498
|
+
const findItem = (id, itemId, items) => {
|
|
19499
|
+
itemId = Array.isArray(itemId) ? itemId : [itemId];
|
|
19500
|
+
let dataSource;
|
|
19501
|
+
if (items) {
|
|
19502
|
+
dataSource = items;
|
|
19326
19503
|
}
|
|
19327
|
-
|
|
19328
|
-
|
|
19329
|
-
|
|
19330
|
-
|
|
19504
|
+
else {
|
|
19505
|
+
const value = getValue$2(id);
|
|
19506
|
+
dataSource = value.dataSource;
|
|
19507
|
+
}
|
|
19508
|
+
if (dataSource) {
|
|
19509
|
+
dataSource.forEach(item => {
|
|
19510
|
+
if (itemId.includes(item.id)) {
|
|
19511
|
+
checkedProcess(id, item);
|
|
19512
|
+
if (item.parentId) {
|
|
19513
|
+
indeterminateStatus(id, item.parentId);
|
|
19514
|
+
}
|
|
19515
|
+
}
|
|
19516
|
+
else if (item.items) {
|
|
19517
|
+
findItem(id, itemId, item.items);
|
|
19518
|
+
}
|
|
19331
19519
|
});
|
|
19332
|
-
this.updateValue();
|
|
19333
|
-
this.change.emit(this.value);
|
|
19334
19520
|
}
|
|
19335
|
-
|
|
19336
|
-
|
|
19521
|
+
};
|
|
19522
|
+
const checkedProcess = (id, item, status) => {
|
|
19523
|
+
const value = getValue$2(id);
|
|
19524
|
+
if (value) {
|
|
19525
|
+
const treeview = value.options.treeview;
|
|
19526
|
+
if (item) {
|
|
19527
|
+
// && !item.hidden => select all bastığımızda hidden olanları seçmemesi içindi
|
|
19528
|
+
if (treeview || (!treeview && item.type != 'group')) {
|
|
19529
|
+
if (!item.disabled) {
|
|
19530
|
+
if (status != undefined) {
|
|
19531
|
+
item.checked = status;
|
|
19532
|
+
}
|
|
19533
|
+
else {
|
|
19534
|
+
item.checked = !item.checked;
|
|
19535
|
+
}
|
|
19536
|
+
item.itemObject.checked = item.checked;
|
|
19537
|
+
item.indeterminate = item.checked ? 'determinate' : 'uncheck';
|
|
19538
|
+
}
|
|
19539
|
+
}
|
|
19540
|
+
if (item.items) {
|
|
19541
|
+
item.items.forEach(child => {
|
|
19542
|
+
checkedProcess(id, child, status == undefined ? item.checked : status);
|
|
19543
|
+
});
|
|
19544
|
+
}
|
|
19545
|
+
}
|
|
19337
19546
|
}
|
|
19338
|
-
|
|
19339
|
-
|
|
19547
|
+
};
|
|
19548
|
+
const indeterminateStatus = (id, itemId, items) => {
|
|
19549
|
+
let dataSource;
|
|
19550
|
+
if (items) {
|
|
19551
|
+
dataSource = items;
|
|
19340
19552
|
}
|
|
19341
|
-
|
|
19342
|
-
|
|
19553
|
+
else {
|
|
19554
|
+
const value = getValue$2(id);
|
|
19555
|
+
dataSource = value.dataSource;
|
|
19343
19556
|
}
|
|
19344
|
-
|
|
19345
|
-
|
|
19346
|
-
|
|
19347
|
-
|
|
19348
|
-
|
|
19557
|
+
if (dataSource) {
|
|
19558
|
+
dataSource.forEach(item => {
|
|
19559
|
+
if (item.id == itemId) {
|
|
19560
|
+
let allChecked = true;
|
|
19561
|
+
let allUnchecked = true;
|
|
19562
|
+
if (item.items) {
|
|
19563
|
+
item.items.map(child => {
|
|
19564
|
+
(child.checked || child.indeterminate === 'indeterminate') && (allUnchecked = false);
|
|
19565
|
+
!child.checked && (allChecked = false);
|
|
19566
|
+
});
|
|
19567
|
+
}
|
|
19568
|
+
const indeterminateState = !allChecked && !allUnchecked ? 'indeterminate' : allChecked ? 'determinate' : 'uncheck';
|
|
19569
|
+
item.indeterminate = indeterminateState;
|
|
19570
|
+
item.checked = indeterminateState == 'determinate' ? true : false;
|
|
19571
|
+
item.itemObject.checked = item.checked;
|
|
19572
|
+
if (item.parentId) {
|
|
19573
|
+
indeterminateStatus(id, item.parentId);
|
|
19574
|
+
}
|
|
19575
|
+
}
|
|
19576
|
+
else if (item.items) {
|
|
19577
|
+
indeterminateStatus(id, itemId, item.items);
|
|
19578
|
+
}
|
|
19579
|
+
});
|
|
19349
19580
|
}
|
|
19350
|
-
|
|
19351
|
-
|
|
19352
|
-
|
|
19353
|
-
|
|
19354
|
-
|
|
19581
|
+
};
|
|
19582
|
+
const filterData = (id, ids, items, searchOtherTag) => {
|
|
19583
|
+
let checkeds = [];
|
|
19584
|
+
let visibled = [];
|
|
19585
|
+
getValue$2(id).isSearchOtherTag = searchOtherTag;
|
|
19586
|
+
let dataSource;
|
|
19587
|
+
if (items) {
|
|
19588
|
+
dataSource = items;
|
|
19589
|
+
}
|
|
19590
|
+
else {
|
|
19591
|
+
const value = getValue$2(id);
|
|
19592
|
+
dataSource = value.dataSource;
|
|
19593
|
+
}
|
|
19594
|
+
if (dataSource) {
|
|
19595
|
+
dataSource.forEach(item => {
|
|
19596
|
+
if (ids) {
|
|
19597
|
+
item.hidden = true;
|
|
19598
|
+
// const filter = ids.find((find) => find.id === item.id)
|
|
19599
|
+
var filter;
|
|
19600
|
+
for (let index = 0; index < ids.length; index++) {
|
|
19601
|
+
if (ids[index].id === item.id) {
|
|
19602
|
+
filter = ids[index];
|
|
19603
|
+
break;
|
|
19604
|
+
}
|
|
19605
|
+
}
|
|
19606
|
+
if (filter) {
|
|
19607
|
+
item.hidden = false;
|
|
19608
|
+
if (!getValue$2(id).isSearchOtherTag) {
|
|
19609
|
+
item.isSearching = true;
|
|
19610
|
+
}
|
|
19611
|
+
visibled.push(item);
|
|
19612
|
+
if (item.checked) {
|
|
19613
|
+
checkeds.push(item);
|
|
19614
|
+
}
|
|
19615
|
+
if (filter.items) {
|
|
19616
|
+
const { checkedItems, visibledItems } = filterData(id, filter.items, item.items, searchOtherTag);
|
|
19617
|
+
if (checkedItems) {
|
|
19618
|
+
checkeds = [...new Set([...checkeds, ...checkedItems])];
|
|
19619
|
+
}
|
|
19620
|
+
if (visibledItems) {
|
|
19621
|
+
visibled = [...new Set([...visibled, ...visibledItems])];
|
|
19622
|
+
}
|
|
19623
|
+
}
|
|
19624
|
+
}
|
|
19625
|
+
}
|
|
19626
|
+
else {
|
|
19627
|
+
item.hidden = false;
|
|
19628
|
+
if (item.items) {
|
|
19629
|
+
filterData(id, null, item.items);
|
|
19630
|
+
}
|
|
19631
|
+
visibled.push(item);
|
|
19632
|
+
item.isSearching = false;
|
|
19633
|
+
}
|
|
19634
|
+
});
|
|
19635
|
+
}
|
|
19636
|
+
return { checkedItems: checkeds !== null && checkeds !== void 0 ? checkeds : [], visibledItems: visibled !== null && visibled !== void 0 ? visibled : [] };
|
|
19637
|
+
};
|
|
19638
|
+
const getSelected = (id, items) => {
|
|
19639
|
+
let dataSource;
|
|
19640
|
+
let selected = null;
|
|
19641
|
+
if (items) {
|
|
19642
|
+
dataSource = items;
|
|
19643
|
+
}
|
|
19644
|
+
else {
|
|
19645
|
+
const value = getValue$2(id);
|
|
19646
|
+
dataSource = value.dataSource;
|
|
19647
|
+
}
|
|
19648
|
+
if (dataSource) {
|
|
19649
|
+
dataSource.forEach(item => {
|
|
19650
|
+
if (item.selected) {
|
|
19651
|
+
selected = item.itemObject;
|
|
19652
|
+
}
|
|
19653
|
+
else if (item.items) {
|
|
19654
|
+
const found = getSelected(id, item.items);
|
|
19655
|
+
if (found) {
|
|
19656
|
+
selected = found;
|
|
19657
|
+
}
|
|
19658
|
+
}
|
|
19659
|
+
});
|
|
19660
|
+
}
|
|
19661
|
+
return selected;
|
|
19662
|
+
};
|
|
19663
|
+
const getCheckedList = (id, items) => {
|
|
19664
|
+
let dataSource;
|
|
19665
|
+
let checkedList = [];
|
|
19666
|
+
let nestedResult = [];
|
|
19667
|
+
if (items) {
|
|
19668
|
+
dataSource = items;
|
|
19669
|
+
}
|
|
19670
|
+
else {
|
|
19671
|
+
const value = getValue$2(id);
|
|
19672
|
+
dataSource = value.dataSource;
|
|
19673
|
+
}
|
|
19674
|
+
if (dataSource) {
|
|
19675
|
+
dataSource.forEach(item => {
|
|
19676
|
+
var _a;
|
|
19677
|
+
let foundChild = [];
|
|
19678
|
+
let foundItem = [];
|
|
19679
|
+
if (item.checked) {
|
|
19680
|
+
checkedList.push(item.itemObject);
|
|
19681
|
+
foundItem.push(Object.assign(Object.assign({}, item.itemObject), { items: [] }));
|
|
19682
|
+
}
|
|
19683
|
+
if (item.items) {
|
|
19684
|
+
const found = getCheckedList(id, item.items);
|
|
19685
|
+
if (((_a = found === null || found === void 0 ? void 0 : found.checkedList) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
19686
|
+
checkedList = [...checkedList, ...found.checkedList];
|
|
19687
|
+
}
|
|
19688
|
+
if (found.nestedResult.length > 0) {
|
|
19689
|
+
foundChild = found.nestedResult;
|
|
19690
|
+
}
|
|
19691
|
+
}
|
|
19692
|
+
if (foundChild.length > 0) {
|
|
19693
|
+
if (foundItem.length == 0) {
|
|
19694
|
+
foundItem.push(Object.assign(Object.assign({}, item.itemObject), { items: [] }));
|
|
19695
|
+
}
|
|
19696
|
+
foundItem[0].items = foundChild;
|
|
19697
|
+
nestedResult.push(foundItem[0]);
|
|
19698
|
+
}
|
|
19699
|
+
else {
|
|
19700
|
+
if (foundItem.length > 0) {
|
|
19701
|
+
foundItem[0].items = foundChild;
|
|
19702
|
+
nestedResult.push(foundItem[0]);
|
|
19703
|
+
}
|
|
19704
|
+
}
|
|
19705
|
+
});
|
|
19706
|
+
}
|
|
19707
|
+
return { checkedList: (checkedList === null || checkedList === void 0 ? void 0 : checkedList.length) > 0 ? checkedList : null, nestedResult: nestedResult };
|
|
19708
|
+
};
|
|
19709
|
+
const selectedItem = (id, itemId, items) => {
|
|
19710
|
+
let dataSource;
|
|
19711
|
+
let selected = [];
|
|
19712
|
+
if (items) {
|
|
19713
|
+
dataSource = items;
|
|
19714
|
+
}
|
|
19715
|
+
else {
|
|
19716
|
+
const value = getValue$2(id);
|
|
19717
|
+
dataSource = value.dataSource;
|
|
19718
|
+
}
|
|
19719
|
+
if (dataSource) {
|
|
19720
|
+
dataSource.forEach(item => {
|
|
19721
|
+
if (itemId) {
|
|
19722
|
+
if (item.id == itemId) {
|
|
19723
|
+
// if (!item.selected){
|
|
19724
|
+
item.selected = true;
|
|
19725
|
+
item.itemObject.selected = item.selected;
|
|
19726
|
+
// }
|
|
19727
|
+
}
|
|
19728
|
+
else {
|
|
19729
|
+
if (item.selected) {
|
|
19730
|
+
item.selected = false;
|
|
19731
|
+
item.itemObject.selected = item.selected;
|
|
19732
|
+
}
|
|
19733
|
+
}
|
|
19734
|
+
}
|
|
19735
|
+
if (item.items) {
|
|
19736
|
+
const found = selectedItem(id, itemId, item.items);
|
|
19737
|
+
if ((found === null || found === void 0 ? void 0 : found.length) > 0) {
|
|
19738
|
+
selected = [...selected, ...found];
|
|
19739
|
+
}
|
|
19740
|
+
}
|
|
19741
|
+
if (item.selected) {
|
|
19742
|
+
selected.push(item.itemObject);
|
|
19743
|
+
}
|
|
19744
|
+
});
|
|
19745
|
+
}
|
|
19746
|
+
return selected && selected.length > 0 ? selected : null;
|
|
19747
|
+
};
|
|
19748
|
+
const setClear = (id, items) => {
|
|
19749
|
+
let dataSource;
|
|
19750
|
+
if (items) {
|
|
19751
|
+
dataSource = items;
|
|
19752
|
+
}
|
|
19753
|
+
else {
|
|
19754
|
+
const value = getValue$2(id);
|
|
19755
|
+
dataSource = value.dataSource;
|
|
19756
|
+
}
|
|
19757
|
+
if (dataSource) {
|
|
19758
|
+
dataSource.forEach(item => {
|
|
19759
|
+
var _a, _b, _c;
|
|
19760
|
+
item.checked && (item.checked = false);
|
|
19761
|
+
item.selected && (item.selected = false);
|
|
19762
|
+
item.indeterminate && (item.indeterminate = 'uncheck');
|
|
19763
|
+
((_a = item.itemObject) === null || _a === void 0 ? void 0 : _a.checked) && (item.itemObject.checked = false);
|
|
19764
|
+
((_b = item.itemObject) === null || _b === void 0 ? void 0 : _b.selected) && (item.itemObject.selected = false);
|
|
19765
|
+
((_c = item.itemObject) === null || _c === void 0 ? void 0 : _c.indeterminate) && (item.itemObject.indeterminate = 'uncheck');
|
|
19766
|
+
if (item.items) {
|
|
19767
|
+
setClear(id, item.items);
|
|
19768
|
+
}
|
|
19769
|
+
});
|
|
19770
|
+
}
|
|
19771
|
+
};
|
|
19772
|
+
const selectAll = (id, status) => {
|
|
19773
|
+
const dataSource = getValue$2(id).dataSource;
|
|
19774
|
+
if (dataSource) {
|
|
19775
|
+
dataSource.forEach(item => {
|
|
19776
|
+
checkedProcess(id, item, status);
|
|
19777
|
+
});
|
|
19778
|
+
}
|
|
19779
|
+
};
|
|
19780
|
+
const updateOptions = (id, options) => {
|
|
19781
|
+
Object.keys(getValue$2(id).options).forEach(key => {
|
|
19782
|
+
getValue$2(id).options[key] = options[key];
|
|
19783
|
+
});
|
|
19784
|
+
};
|
|
19785
|
+
const removeState$1 = id => {
|
|
19786
|
+
return Promise.resolve(state$2.value.delete(id));
|
|
19787
|
+
};
|
|
19788
|
+
const listState = {
|
|
19789
|
+
setValue: setValue$2,
|
|
19790
|
+
removeValue: removeValue$1,
|
|
19791
|
+
getValue: getValue$2,
|
|
19792
|
+
getData,
|
|
19793
|
+
getDataPagination: getDataPagination$1,
|
|
19794
|
+
openGroup,
|
|
19795
|
+
checkedItem,
|
|
19796
|
+
filterData,
|
|
19797
|
+
getSelected,
|
|
19798
|
+
getCheckedList,
|
|
19799
|
+
selectedItem,
|
|
19800
|
+
addChecked,
|
|
19801
|
+
setClear,
|
|
19802
|
+
selectAll,
|
|
19803
|
+
removeOtherTags,
|
|
19804
|
+
onRemoveItems,
|
|
19805
|
+
updateOptions,
|
|
19806
|
+
removeState: removeState$1,
|
|
19807
|
+
};
|
|
19808
|
+
|
|
19809
|
+
class KeyControl {
|
|
19810
|
+
constructor(keyCode, element, elementName, childElementName) {
|
|
19811
|
+
this.elementName = '';
|
|
19812
|
+
this.childElementName = '';
|
|
19813
|
+
this.keyCode = keyCode;
|
|
19814
|
+
this.element = element;
|
|
19815
|
+
this.elementName = elementName;
|
|
19816
|
+
this.childElementName = childElementName;
|
|
19817
|
+
}
|
|
19818
|
+
getKeyCode() {
|
|
19819
|
+
return this.keyCode;
|
|
19820
|
+
}
|
|
19821
|
+
getElementName() {
|
|
19822
|
+
return this.elementName;
|
|
19823
|
+
}
|
|
19824
|
+
getChildElementName() {
|
|
19825
|
+
return this.childElementName;
|
|
19826
|
+
}
|
|
19827
|
+
getFocusedElementName() {
|
|
19828
|
+
return this.getElementName() + '.focused';
|
|
19829
|
+
}
|
|
19830
|
+
getFocusedElement() {
|
|
19831
|
+
return this.element.querySelectorAll(this.getFocusedElementName())[0] || null;
|
|
19832
|
+
}
|
|
19833
|
+
getFirstElement() {
|
|
19834
|
+
return this.element.querySelectorAll(this.getElementName())[0] || null;
|
|
19835
|
+
}
|
|
19836
|
+
getNextElement() {
|
|
19837
|
+
var _a;
|
|
19838
|
+
return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.nextElementSibling) || this.getFirstElement();
|
|
19839
|
+
}
|
|
19840
|
+
getPreviousElement() {
|
|
19841
|
+
var _a;
|
|
19842
|
+
return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.previousElementSibling) || this.getFirstElement();
|
|
19843
|
+
}
|
|
19844
|
+
getChildElement() {
|
|
19845
|
+
var _a;
|
|
19846
|
+
return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.querySelectorAll(this.getChildElementName())[0]) || null;
|
|
19847
|
+
}
|
|
19848
|
+
getParentElement(element) {
|
|
19849
|
+
if (element && element) {
|
|
19850
|
+
const isRootElement = element && element.attributes['data-isroot'];
|
|
19851
|
+
if (isRootElement) {
|
|
19852
|
+
return element;
|
|
19853
|
+
}
|
|
19854
|
+
return this.getParentElement(element.parentNode);
|
|
19855
|
+
}
|
|
19856
|
+
}
|
|
19857
|
+
focusElementIsOpen() {
|
|
19858
|
+
var _a;
|
|
19859
|
+
return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.classList.contains('bcm-list__item--open')) || false;
|
|
19860
|
+
}
|
|
19861
|
+
isRootElement() {
|
|
19862
|
+
var _a;
|
|
19863
|
+
return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.querySelectorAll(this.getChildElementName()).length) > 0;
|
|
19864
|
+
}
|
|
19865
|
+
isRootElementIsOpen() {
|
|
19866
|
+
return this.getFocusedElement().classList.contains('bcm-list__item--open');
|
|
19867
|
+
}
|
|
19868
|
+
getFocusedChildElement() {
|
|
19869
|
+
var _a;
|
|
19870
|
+
return ((_a = this.getChildElement()) === null || _a === void 0 ? void 0 : _a.querySelectorAll('.focused')[0]) || null;
|
|
19871
|
+
}
|
|
19872
|
+
isLastElement() {
|
|
19873
|
+
var _a;
|
|
19874
|
+
return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.nextElementSibling) === null;
|
|
19875
|
+
}
|
|
19876
|
+
focusParentElementFirstChild() {
|
|
19877
|
+
var _a, _b;
|
|
19878
|
+
return this.setFocus((_b = (_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.firstChild);
|
|
19879
|
+
}
|
|
19880
|
+
isFirstElement() {
|
|
19881
|
+
var _a;
|
|
19882
|
+
return ((_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.previousElementSibling) === null;
|
|
19883
|
+
}
|
|
19884
|
+
focusRootElement() {
|
|
19885
|
+
var _a, _b, _c;
|
|
19886
|
+
return this.setFocus((_c = (_b = (_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.parentElement) === null || _c === void 0 ? void 0 : _c.firstChild);
|
|
19887
|
+
}
|
|
19888
|
+
nextRootElement() {
|
|
19889
|
+
var _a, _b, _c;
|
|
19890
|
+
return this.setFocus((_c = (_b = (_a = this.getFocusedElement()) === null || _a === void 0 ? void 0 : _a.parentElement) === null || _b === void 0 ? void 0 : _b.parentElement) === null || _c === void 0 ? void 0 : _c.nextElementSibling);
|
|
19891
|
+
}
|
|
19892
|
+
findFocusElementParent() {
|
|
19893
|
+
return this.getFocusedElement().parentNode.querySelectorAll('.bcm-list__item--open');
|
|
19894
|
+
}
|
|
19895
|
+
getLastElement() {
|
|
19896
|
+
return this.element.querySelectorAll(this.getElementName())[this.element.querySelectorAll(this.getElementName()).length - 1] || null;
|
|
19897
|
+
}
|
|
19898
|
+
setFocus(element) {
|
|
19899
|
+
element.focus();
|
|
19900
|
+
}
|
|
19901
|
+
}
|
|
19902
|
+
|
|
19903
|
+
class ListKeyControl extends KeyControl {
|
|
19904
|
+
constructor(keyCode, element, treeview, checkBoxes) {
|
|
19905
|
+
super(keyCode, element, '.bcm-list__item', '.bcm-list__item-childs');
|
|
19906
|
+
this.isTreeview = false;
|
|
19907
|
+
this.isCheckBoxes = false;
|
|
19908
|
+
this.isTreeview = treeview;
|
|
19909
|
+
this.isCheckBoxes = checkBoxes;
|
|
19910
|
+
}
|
|
19911
|
+
keyUpControl() {
|
|
19912
|
+
if (this.isTreeview) {
|
|
19913
|
+
this.keyUpTreeview();
|
|
19914
|
+
}
|
|
19915
|
+
else {
|
|
19916
|
+
if (this.isFirstElement()) {
|
|
19917
|
+
this.setFocus(this.getLastElement());
|
|
19918
|
+
}
|
|
19919
|
+
else {
|
|
19920
|
+
this.setFocus(this.getPreviousElement());
|
|
19921
|
+
}
|
|
19922
|
+
}
|
|
19923
|
+
}
|
|
19924
|
+
keyDownTreeView() {
|
|
19925
|
+
var _a;
|
|
19926
|
+
if (this.isTreeview) {
|
|
19927
|
+
if (this.isRootElement() && this.isRootElementIsOpen()) {
|
|
19928
|
+
const childs = this.getChildElement();
|
|
19929
|
+
if (childs) {
|
|
19930
|
+
this.setFocus(childs.firstChild);
|
|
19931
|
+
}
|
|
19932
|
+
}
|
|
19933
|
+
else {
|
|
19934
|
+
if (this.isLastElement() && this.getParentElement(this.getFocusedElement())) {
|
|
19935
|
+
this.setFocus((_a = this.getParentElement(this.getFocusedElement())) === null || _a === void 0 ? void 0 : _a.nextElementSibling);
|
|
19936
|
+
}
|
|
19937
|
+
else {
|
|
19938
|
+
this.setFocus(this.getNextElement());
|
|
19939
|
+
}
|
|
19940
|
+
}
|
|
19941
|
+
}
|
|
19942
|
+
}
|
|
19943
|
+
keyUpTreeview() {
|
|
19944
|
+
if (this.isFirstElement()) {
|
|
19945
|
+
const parent = this.getParentElement(this.getFocusedElement());
|
|
19946
|
+
this.setFocus(parent);
|
|
19947
|
+
}
|
|
19948
|
+
else {
|
|
19949
|
+
const previousElement = this.getPreviousElement();
|
|
19950
|
+
if (previousElement) {
|
|
19951
|
+
if (previousElement.classList.contains('bcm-list__item--open')) {
|
|
19952
|
+
const getChildElement = previousElement.querySelectorAll(this.getChildElementName())[0];
|
|
19953
|
+
console.log({ getChildElement });
|
|
19954
|
+
this.setFocus(getChildElement.lastChild);
|
|
19955
|
+
}
|
|
19956
|
+
else {
|
|
19957
|
+
this.setFocus(previousElement);
|
|
19958
|
+
}
|
|
19959
|
+
}
|
|
19960
|
+
}
|
|
19961
|
+
}
|
|
19962
|
+
keyDownControl() {
|
|
19963
|
+
if (this.isTreeview) {
|
|
19964
|
+
this.keyDownTreeView();
|
|
19965
|
+
}
|
|
19966
|
+
else {
|
|
19967
|
+
if (this.isLastElement()) {
|
|
19968
|
+
this.setFocus(this.getFirstElement());
|
|
19969
|
+
}
|
|
19970
|
+
else {
|
|
19971
|
+
this.setFocus(this.getNextElement());
|
|
19972
|
+
}
|
|
19973
|
+
}
|
|
19974
|
+
}
|
|
19975
|
+
keyRightControl() {
|
|
19976
|
+
if (this.isTreeview) {
|
|
19977
|
+
if (!this.isRootElementIsOpen() && this.isRootElement()) {
|
|
19978
|
+
const { id } = this.getFocusedElement();
|
|
19979
|
+
this.openGroup(id);
|
|
19980
|
+
}
|
|
19981
|
+
}
|
|
19982
|
+
}
|
|
19983
|
+
keyLeftControl() {
|
|
19984
|
+
if (this.isTreeview) {
|
|
19985
|
+
if (this.isRootElementIsOpen() && this.isRootElement()) {
|
|
19986
|
+
const { id } = this.getFocusedElement();
|
|
19987
|
+
this.openGroup(id);
|
|
19988
|
+
}
|
|
19989
|
+
}
|
|
19990
|
+
}
|
|
19991
|
+
keyEnterControl() { }
|
|
19992
|
+
keySpaceControl() {
|
|
19993
|
+
if (this.isCheckBoxes) {
|
|
19994
|
+
const { id } = this.getFocusedElement();
|
|
19995
|
+
this.checkedItem(id);
|
|
19996
|
+
}
|
|
19997
|
+
}
|
|
19998
|
+
keyDown() {
|
|
19999
|
+
switch (this.getKeyCode()) {
|
|
20000
|
+
case Bcm.KeyCode.up:
|
|
20001
|
+
this.keyUpControl();
|
|
20002
|
+
break;
|
|
20003
|
+
case Bcm.KeyCode.down:
|
|
20004
|
+
this.keyDownControl();
|
|
20005
|
+
break;
|
|
20006
|
+
case Bcm.KeyCode.left:
|
|
20007
|
+
this.keyLeftControl();
|
|
20008
|
+
break;
|
|
20009
|
+
case Bcm.KeyCode.right:
|
|
20010
|
+
this.keyRightControl();
|
|
20011
|
+
break;
|
|
20012
|
+
case Bcm.KeyCode.enter:
|
|
20013
|
+
this.keyEnterControl();
|
|
20014
|
+
break;
|
|
20015
|
+
case Bcm.KeyCode.space:
|
|
20016
|
+
this.keySpaceControl();
|
|
20017
|
+
break;
|
|
20018
|
+
}
|
|
20019
|
+
}
|
|
20020
|
+
keyUp() { }
|
|
20021
|
+
}
|
|
20022
|
+
|
|
20023
|
+
class ListTagControl {
|
|
20024
|
+
constructor(containerId, values, listId, selectedOtherTag, clearable) {
|
|
20025
|
+
this.clearable = false;
|
|
20026
|
+
this.containerId = containerId;
|
|
20027
|
+
this.values = values;
|
|
20028
|
+
this.listId = listId;
|
|
20029
|
+
this.selectedOtherTag = selectedOtherTag;
|
|
20030
|
+
this.clearable = clearable;
|
|
20031
|
+
}
|
|
20032
|
+
getTooltip(id, text) {
|
|
20033
|
+
return new Tooltip({ message: text, targetId: id, placement: 'bottom' });
|
|
20034
|
+
}
|
|
20035
|
+
tagHtmlTemplate(tag, isOtherTag = false, otherTagIsSingle = false) {
|
|
20036
|
+
return `<span class="bcm-tag__content dismissable ${!otherTagIsSingle && isOtherTag && (this.selectedOtherTag ? 'checkable checked' : '')}">
|
|
20037
|
+
<span class="value">${tag.text}</span>
|
|
20038
|
+
${otherTagIsSingle
|
|
20039
|
+
? ''
|
|
20040
|
+
: `
|
|
20041
|
+
<span class="right close-button" bcm-list-tag-dismiss >
|
|
20042
|
+
<bcm-icon icon="fal fa-times"></bcm-icon>
|
|
20043
|
+
</span>`}
|
|
20044
|
+
</span>`;
|
|
20045
|
+
}
|
|
20046
|
+
getContainer() {
|
|
20047
|
+
return document.getElementById(this.containerId);
|
|
20048
|
+
}
|
|
20049
|
+
getContainerWidth() {
|
|
20050
|
+
let tagContainerWidth = snq(() => document.getElementById(this.containerId).clientWidth, 0);
|
|
20051
|
+
tagContainerWidth = (this.clearable ? tagContainerWidth - 20 : tagContainerWidth) - 20;
|
|
20052
|
+
return [tagContainerWidth < 130 ? 130 : tagContainerWidth - 20, tagContainerWidth];
|
|
20053
|
+
}
|
|
20054
|
+
isClickDismiss(e) {
|
|
20055
|
+
const path = e.path || (e.composedPath && e.composedPath());
|
|
20056
|
+
const tag = path.find(element => element.attributes && element.attributes['bcm-list-tag-dismiss']);
|
|
20057
|
+
return !!tag;
|
|
20058
|
+
}
|
|
20059
|
+
onClickControl(e, id, isOtherTag = false) {
|
|
20060
|
+
const isDismiss = this.isClickDismiss(e);
|
|
20061
|
+
let tooltipId = '';
|
|
20062
|
+
if (isDismiss) {
|
|
20063
|
+
this.onClickDismiss(id);
|
|
20064
|
+
tooltipId = isOtherTag ? `bcm-list-input-tag-${this.listId}-other-tag` : `list-${this.listId}-${id}`;
|
|
20065
|
+
this.getTooltip(tooltipId, '').hide();
|
|
20066
|
+
}
|
|
20067
|
+
else {
|
|
20068
|
+
isOtherTag ? this.onClickOtherTag(id) : this.onClickTag(id);
|
|
20069
|
+
}
|
|
20070
|
+
}
|
|
20071
|
+
calculateTags() {
|
|
20072
|
+
const containerWidth = this.getContainerWidth();
|
|
20073
|
+
const virtualDom = this.getContainer();
|
|
20074
|
+
if (virtualDom) {
|
|
20075
|
+
if (this.values && this.values.length > 0) {
|
|
20076
|
+
if (containerWidth[0] > 0 && virtualDom) {
|
|
20077
|
+
virtualDom.innerHTML = '';
|
|
20078
|
+
this.values.slice(0, 50).map(value => {
|
|
20079
|
+
const tag = document.createElement('div');
|
|
20080
|
+
tag.classList.add('bcm-tag');
|
|
20081
|
+
tag.id = `list-${this.listId}-${value.id}`;
|
|
20082
|
+
// tag.title = value.tagTitle || value.text || '';
|
|
20083
|
+
tag.onmouseenter = () => this.getTooltip(`list-${this.listId}-${value.id}`, value.tagTitle || value.text || '').show();
|
|
20084
|
+
tag.onmouseleave = () => this.getTooltip(`list-${this.listId}-${value.id}`, value.tagTitle || value.text || '').hide();
|
|
20085
|
+
tag.dataset.id = value.id;
|
|
20086
|
+
tag.onclick = e => this.onClickControl(e, value.id);
|
|
20087
|
+
tag.innerHTML = this.tagHtmlTemplate(Object.assign(Object.assign({}, value), { text: StringHelper.textLimitter(value.text, 10) }));
|
|
20088
|
+
virtualDom.appendChild(tag);
|
|
20089
|
+
});
|
|
20090
|
+
let tags = virtualDom.querySelectorAll('.bcm-tag');
|
|
20091
|
+
let otherTags = [];
|
|
20092
|
+
let visibleTags = [];
|
|
20093
|
+
const checkControl = () => {
|
|
20094
|
+
const virtualDomTags = virtualDom.querySelectorAll('.bcm-tag');
|
|
20095
|
+
if (visibleTags.length === 1 && (virtualDomTags === null || virtualDomTags === void 0 ? void 0 : virtualDomTags.length) === 1) {
|
|
20096
|
+
visibleTags[0].innerHTML = this.tagHtmlTemplate({ text: '+1' }, false, true);
|
|
20097
|
+
}
|
|
20098
|
+
};
|
|
20099
|
+
let tagsWidth = Array.from(tags).reduce((acc, tag) => {
|
|
20100
|
+
const tagClientWidth = tag.clientWidth > 50 ? tag.clientWidth : 50;
|
|
20101
|
+
if (tagClientWidth > 0 && acc + tagClientWidth + 10 < containerWidth[0]) {
|
|
20102
|
+
acc += tagClientWidth + 10;
|
|
20103
|
+
visibleTags.push(tag);
|
|
20104
|
+
const checkFreeSpace = tagClientWidth > 0 && acc + tagClientWidth + 10 < containerWidth[0];
|
|
20105
|
+
!checkFreeSpace && containerWidth[1] < 70 && checkControl();
|
|
20106
|
+
}
|
|
20107
|
+
else {
|
|
20108
|
+
otherTags.push(tag);
|
|
20109
|
+
tag.remove();
|
|
20110
|
+
}
|
|
20111
|
+
return acc;
|
|
20112
|
+
}, 0);
|
|
20113
|
+
const otherTagElement = this.values.slice(visibleTags.length);
|
|
20114
|
+
const virtualDomLastElements = virtualDom.lastElementChild;
|
|
20115
|
+
const otherTagTextControl = args => {
|
|
20116
|
+
const { count, width } = args;
|
|
20117
|
+
if (count > 999)
|
|
20118
|
+
return '999+' + pluralize('item', count);
|
|
20119
|
+
if (width > 100)
|
|
20120
|
+
return `${count} ` + pluralize('item', count) + ' selected';
|
|
20121
|
+
if (width < 100)
|
|
20122
|
+
return `+${count < 10 ? count : '9'}`;
|
|
20123
|
+
};
|
|
20124
|
+
if (otherTags && otherTags.length > 0 && virtualDomLastElements && virtualDomLastElements.id !== `bcm-list-input-tag-${this.listId}-other-tag`) {
|
|
20125
|
+
otherTags.push(virtualDomLastElements);
|
|
20126
|
+
if (otherTags.length > 0) {
|
|
20127
|
+
const otherCounter = otherTagElement.length + 1;
|
|
20128
|
+
const createOthertagElement = {
|
|
20129
|
+
id: `bcm-list-input-tag-${this.listId}-other-tag`,
|
|
20130
|
+
text: otherTagTextControl({ count: otherCounter, width: containerWidth[1] }),
|
|
20131
|
+
title: snq(() => otherTags
|
|
20132
|
+
.map(tag => this.values.find(value => value.id == tag.dataset.id))
|
|
20133
|
+
.slice(0, 15)
|
|
20134
|
+
.map(item => StringHelper.textLimitter(item.tagTitle || item.text, 40, true))
|
|
20135
|
+
.toString()
|
|
20136
|
+
.split(',')
|
|
20137
|
+
.join('\r\n') + (otherTags.length > 15 ? ('\r\n...') : ''), '...'),
|
|
20138
|
+
};
|
|
20139
|
+
virtualDomLastElements.remove();
|
|
20140
|
+
visibleTags = visibleTags.filter(tag => tag.id !== virtualDomLastElements.id);
|
|
20141
|
+
const hiddenTags = this.values.filter(value => !visibleTags.find(tag => tag.dataset.id == value.id)).map(value => value.id);
|
|
20142
|
+
const otherTag = document.createElement('div');
|
|
20143
|
+
const otherTagIds = hiddenTags.join(',');
|
|
20144
|
+
const otherTagIsSingle = visibleTags.length === 0;
|
|
20145
|
+
otherTag.classList.add('bcm-tag');
|
|
20146
|
+
!otherTagIsSingle && otherTag.classList.add('bcm-tag--other');
|
|
20147
|
+
otherTag.id = createOthertagElement.id;
|
|
20148
|
+
// otherTag.title = createOthertagElement.title || false;
|
|
20149
|
+
if (createOthertagElement.title) {
|
|
20150
|
+
otherTag.onmouseenter = () => this.getTooltip(createOthertagElement.id, createOthertagElement.title).show();
|
|
20151
|
+
otherTag.onmouseleave = () => this.getTooltip(createOthertagElement.id, createOthertagElement.title).hide();
|
|
20152
|
+
}
|
|
20153
|
+
otherTag.onclick = e => this.onClickControl(e, otherTagIds, otherTagIsSingle ? false : true);
|
|
20154
|
+
otherTag.innerHTML = this.tagHtmlTemplate(createOthertagElement, true, otherTagIsSingle);
|
|
20155
|
+
otherTag.dataset.ids = hiddenTags.join(',');
|
|
20156
|
+
virtualDom.appendChild(otherTag);
|
|
20157
|
+
}
|
|
20158
|
+
}
|
|
20159
|
+
const otherTag = document.getElementById(`bcm-list-input-tag-${this.listId}-other-tag`);
|
|
20160
|
+
const otherTagWidth = otherTag ? (otherTag.clientWidth && otherTag.clientWidth < 50 ? 50 : otherTag.clientWidth) : 200;
|
|
20161
|
+
const tagsPerRow = Math.floor(containerWidth[0] - tagsWidth);
|
|
20162
|
+
if (tagsPerRow > otherTagWidth) {
|
|
20163
|
+
if (otherTag) {
|
|
20164
|
+
const findElement = this.values.find(value => value.id == otherTag.dataset.ids.split(',')[0]);
|
|
20165
|
+
const tag = document.createElement('div');
|
|
20166
|
+
tag.classList.add('bcm-tag');
|
|
20167
|
+
tag.id = `list-${this.listId}-${findElement.id}`;
|
|
20168
|
+
// tag.title = findElement?.title || '';
|
|
20169
|
+
tag.onmouseenter = () => this.getTooltip(`list-${this.listId}-${findElement.id}`, (findElement === null || findElement === void 0 ? void 0 : findElement.title) || '').show();
|
|
20170
|
+
tag.onmouseleave = () => this.getTooltip(`list-${this.listId}-${findElement.id}`, (findElement === null || findElement === void 0 ? void 0 : findElement.title) || '').hide();
|
|
20171
|
+
tag.dataset.id = findElement.id;
|
|
20172
|
+
tag.onclick = e => this.onClickControl(e, findElement === null || findElement === void 0 ? void 0 : findElement.id);
|
|
20173
|
+
tag.innerHTML = this.tagHtmlTemplate(Object.assign(Object.assign({}, findElement), { text: StringHelper.textLimitter(findElement.text, 10) }));
|
|
20174
|
+
const otherTagElement = document.getElementById(`bcm-list-input-tag-${this.listId}-other-tag`);
|
|
20175
|
+
otherTagElement.remove();
|
|
20176
|
+
virtualDom.appendChild(tag);
|
|
20177
|
+
}
|
|
20178
|
+
}
|
|
20179
|
+
}
|
|
20180
|
+
}
|
|
20181
|
+
else {
|
|
20182
|
+
virtualDom.innerHTML = '';
|
|
20183
|
+
}
|
|
20184
|
+
}
|
|
20185
|
+
}
|
|
20186
|
+
}
|
|
20187
|
+
|
|
20188
|
+
const listCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); @import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); @import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); @import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); .size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-caption-area{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;font-size:12px;line-height:calc(12px + 8px);color:var(--bcm-new-ds-color-slate-400);display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;flex-wrap:nowrap;margin-top:2px}.bcm-caption-area__text{color:var(--bcm-new-ds-color-slate-400)}.bcm-caption-area__text.default{color:var(--bcm-new-ds-color-slate-400)}.bcm-caption-area__text.info{color:var(--bcm-new-ds-color-blue-500)}.bcm-caption-area__text.success{color:var(--bcm-new-ds-color-emerald-500)}.bcm-caption-area__text.warning{color:var(--bcm-new-ds-color-amber-500)}.bcm-caption-area__text.error{color:var(--bcm-new-ds-color-red-500)}.bcm-caption-area__size-small{font-size:10px;line-height:calc(10px + 8px);min-height:calc(10px + 8px)}.bcm-caption-area__size-medium{font-size:12px;line-height:calc(12px + 8px);min-height:calc(12px + 8px)}.bcm-caption-area__size-large{font-size:14px;line-height:calc(14px + 8px);min-height:calc(14px + 8px)}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-label{display:inline-flex;align-items:flex-start;grid-gap:2px}.bcm-label__text{margin-bottom:2px;font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;display:inline-block;color:var(--bcm-new-ds-color-slate-600)}.bcm-label__size-small{font-size:10px;line-height:calc(10px + 8px);min-height:calc(10px + 8px)}.bcm-label__size-medium{font-size:12px;line-height:calc(12px + 8px);min-height:calc(12px + 8px)}.bcm-label__size-large{font-size:14px;line-height:calc(14px + 8px);min-height:calc(14px + 8px)}.bcm-input[no-margin]{margin:0}.bcm-textarea[no-margin]{margin:0}.bcm-switch[no-margin]{margin:0}.bcm-checkbox[no-margin]{margin:0}.bcm-radio-group[no-margin]{margin:0}.bcm-checkbox-group[no-margin]{margin:0}.bcm-range[no-margin]{margin:0}.bcm-form[no-margin]{margin:0}.bcm-form-group[no-margin]{margin:0}.bcm-list[no-margin]{margin:0}.bcm-colorpicker[no-margin]{margin:0}.bcm-date-picker[no-margin]{margin:0}.bcm-time-picker[no-margin]{margin:0}.bcm-datetime-picker[no-margin]{margin:0}.bcm-select[no-margin]{margin:0}.bcm-listbox[no-margin]{margin:0}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-checkbox{outline:none;border:none;--bcm-checkbox-primary-color-default:var(--bcm-new-ds-color-blue-500);--bcm-checkbox-secondary-color-default:var(--bcm-new-ds-color-white);--bcm-checkbox-primary-color-hover:var(--bcm-new-ds-color-blue-600);--bcm-checkbox-secondary-color-hover:var(--bcm-new-ds-color-slate-50);--bcm-checkbox-primary-color-focus-visible:var(--bcm-new-ds-color-blue-800);--bcm-checkbox-secondary-color-focus-visible:var(--bcm-new-ds-color-slate-50);--bcm-checkbox-primary-color-active:var(--bcm-new-ds-color-blue-700);--bcm-checkbox-secondary-color-active:var(--bcm-new-ds-color-slate-50);--bcm-checkbox-primary-color-disabled:var(--bcm-new-ds-color-slate-300);--bcm-checkbox-secondary-color-disabled:var(--bcm-new-ds-color-slate-200);display:inline-flex;width:fit-content;flex-direction:column;margin-bottom:8px}.bcm-checkbox:focus,.bcm-checkbox:hover,.bcm-checkbox:active{outline:none;border:none}.bcm-checkbox *{box-sizing:border-box}.bcm-checkbox input[type=radio],.bcm-checkbox input[type=checkbox]{-webkit-appearance:none;appearance:none;background-color:#fff;margin:0;display:none}.bcm-checkbox__input{display:flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;flex-wrap:nowrap;padding-top:4px}.bcm-checkbox.hidden{display:none}.bcm-checkbox :hover{cursor:pointer}.bcm-checkbox[disabled] :hover,.bcm-checkbox.disabled :hover{cursor:not-allowed}.bcm-checkbox .slot{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;font-weight:500;color:var(--bcm-new-ds-color-slate-600)}.bcm-checkbox .slot:not(:empty){margin-left:8px;margin-right:8px}.bcm-checkbox-size-small .slot{font-size:12px;line-height:calc(12px + 8px);margin-top:-2.5px}.bcm-checkbox-size-small .bcm-checkbox__input{min-height:calc(24px - 4px)}.bcm-checkbox-size-small .bcm-checkbox__label-icon{width:14px;height:14px;min-width:14px;font-size:calc(10px - 2px)}.bcm-checkbox-size-medium .slot{font-size:calc(12px + 1px);line-height:calc(12px + 8px);margin-top:-1.5px}.bcm-checkbox-size-medium .bcm-checkbox__input{min-height:calc(32px - 4px)}.bcm-checkbox-size-medium .bcm-checkbox__label-icon{width:16px;height:16px;min-width:16px;font-size:10px}.bcm-checkbox-size-large .slot{font-size:16px;line-height:calc(16px + 8px);margin-top:-1.5px}.bcm-checkbox-size-large .bcm-checkbox__input{min-height:calc(32px - 4px)}.bcm-checkbox-size-large .bcm-checkbox__label-icon{width:18px;height:18px;min-width:18px;font-size:12px}.bcm-checkbox__label{display:flex;flex-direction:row;align-items:flex-start;justify-content:flex-start;flex-wrap:nowrap}.bcm-checkbox__label-icon{display:flex;flex-direction:column;align-items:center;justify-content:center;flex-wrap:nowrap;border-width:1px;border-style:solid;border-radius:2px}.bcm-checkbox__label-icon-indeterminate{position:relative}.bcm-checkbox__label-icon-indeterminate:after{content:\"\";display:block;position:absolute;width:70%;height:1.5px;background:var(--bcm-new-ds-color-white)}.bcm-checkbox__label-icon.bcm-radio__icon{width:16px;height:16px;box-sizing:border-box;border-radius:100px}.bcm-checkbox__label-icon.bcm-radio__icon .bcm-radio__icon-inner{width:10px;height:10px;border-radius:100px;background-color:var(--bcm-new-ds-color-white)}.bcm-checkbox .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-default);color:var(--bcm-checkbox-secondary-color-default);border-color:var(--bcm-new-ds-color-slate-300)}.bcm-checkbox .bcm-checkbox__label-icon-checked,.bcm-checkbox .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-default);border-color:var(--bcm-checkbox-primary-color-default)}.bcm-checkbox .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-default);background-color:var(--bcm-checkbox-secondary-color-default)}.bcm-checkbox .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-default)}.bcm-checkbox .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-default)}.bcm-checkbox:hover .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-hover);color:var(--bcm-checkbox-secondary-color-hover);border-color:var(--bcm-checkbox-primary-color-hover)}.bcm-checkbox:hover .bcm-checkbox__label-icon-checked,.bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-hover);border-color:var(--bcm-checkbox-primary-color-hover)}.bcm-checkbox:hover .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-hover);background-color:var(--bcm-checkbox-secondary-color-hover)}.bcm-checkbox:hover .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-hover)}.bcm-checkbox:hover .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-hover)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-focus-visible);color:var(--bcm-checkbox-secondary-color-focus-visible);border-color:var(--bcm-checkbox-primary-color-focus-visible)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-checked,.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-focus-visible);border-color:var(--bcm-checkbox-primary-color-focus-visible)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-focus-visible);background-color:var(--bcm-checkbox-secondary-color-focus-visible)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-focus-visible)}.bcm-checkbox:focus-visible .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-focus-visible)}.bcm-checkbox:active .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-active);color:var(--bcm-checkbox-secondary-color-active);border-color:var(--bcm-checkbox-primary-color-active)}.bcm-checkbox:active .bcm-checkbox__label-icon-checked,.bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-active);border-color:var(--bcm-checkbox-primary-color-active)}.bcm-checkbox:active .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-active);background-color:var(--bcm-checkbox-secondary-color-active)}.bcm-checkbox:active .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-active)}.bcm-checkbox:active .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-active)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon,.bcm-checkbox.disabled .bcm-checkbox__label-icon{background:var(--bcm-checkbox-secondary-color-disabled);color:var(--bcm-checkbox-secondary-color-disabled);border-color:var(--bcm-checkbox-primary-color-disabled)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon-checked,.bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate,.bcm-checkbox.disabled .bcm-checkbox__label-icon-checked,.bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-checkbox-primary-color-disabled);border-color:var(--bcm-checkbox-primary-color-disabled)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon,.bcm-checkbox.disabled .bcm-checkbox__label-icon-checked.bcm-radio__icon,.bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon{border-color:var(--bcm-checkbox-primary-color-disabled);background-color:var(--bcm-checkbox-secondary-color-disabled)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox.disabled .bcm-checkbox__label-icon-checked.bcm-radio__icon .bcm-radio__icon-inner,.bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate.bcm-radio__icon .bcm-radio__icon-inner{background-color:var(--bcm-checkbox-primary-color-disabled)}.bcm-checkbox[disabled] .bcm-checkbox__label-icon-indeterminate,.bcm-checkbox.disabled .bcm-checkbox__label-icon-indeterminate{color:var(--bcm-checkbox-primary-color-disabled)}.bcm-checkbox[no-margin] .bcm-checkbox__input{margin:0;min-height:0;padding:0}.bcm-list{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;--width:256px;--height:256px;--max-height:inherit;--min-height:inherit;min-width:90px;display:flex;flex-direction:column;margin:0 0 8px 0}.bcm-list__listbox .bcm-list__container{height:var(--height);max-height:var(--max-height);min-height:var(--min-height)}.bcm-list.full-width{width:100%}.bcm-list__size-small .bcm-list__input{height:24px;font-size:12px;line-height:calc(12px + 8px)}.bcm-list__size-small .bcm-list__input .bcm-tag__content.dismissable{font-size:10px;line-height:calc(10px + 8px)}.bcm-list__size-medium .bcm-list__input{height:32px;font-size:14px;line-height:calc(14px + 8px)}.bcm-list__size-medium .bcm-list__input .bcm-tag__content.dismissable{font-size:12px;line-height:calc(12px + 8px)}.bcm-list__size-large .bcm-list__input{height:40px;font-size:16px;line-height:calc(16px + 8px)}.bcm-list__size-large .bcm-list__input .bcm-tag__content.dismissable{font-size:14px;line-height:calc(14px + 8px)}.bcm-list:hover{outline:none}.bcm-list:hover .bcm-list__input{border-color:var(--bcm-new-ds-color-blue-500);background-color:var(--bcm-new-ds-color-slate-50)}.bcm-list:focus-visible{outline:none}.bcm-list:focus-visible .bcm-list__input{border-color:var(--bcm-new-ds-color-blue-600);background-color:var(--bcm-new-ds-color-white)}.bcm-list:active{outline:none}.bcm-list:active .bcm-list__input{border-color:var(--bcm-new-ds-color-blue-600);box-shadow:0 1px 3px 0 rgba(17, 24, 38, 0.1)}.bcm-list__container{--width:256px;--height:256px;width:var(--width);height:var(--height);background-color:var(--bcm-new-ds-color-white);border:1px solid var(--bcm-new-ds-color-slate-300);border-radius:4px;box-sizing:border-box;padding-top:8px;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap;gap:4px}.bcm-list__container main{scroll-behavior:smooth;padding:0 8px;flex:1;overflow:auto;display:flex;flex-direction:column}.bcm-list__container-search{margin:0 8px}.bcm-list__container-search:after{margin:4px 0}.bcm-list__container-no-data{flex:1;display:flex;justify-content:stretch;align-items:stretch;padding-bottom:4px}.bcm-list__container.error{border-color:var(--bcm-color-red-6)}.bcm-list__container.full-width{width:100%}.bcm-list__container.bcm-list__type-linked-component,.bcm-list__container.bcm-list__type-select,.bcm-list__container.bcm-list__type-autocomplete{opacity:0;visibility:hidden;position:absolute;top:0;left:0;height:0;width:0;transform:translateY(10%);z-index:10800;transition:visibility 0s linear 400ms, opacity 100ms, transform 200ms}.bcm-list__container.bcm-list__type-linked-component.bcm-list--top,.bcm-list__container.bcm-list__type-select.bcm-list--top,.bcm-list__container.bcm-list__type-autocomplete.bcm-list--top{transform:translateY(-10%)}.bcm-list__container.bcm-list__type-linked-component.is-open,.bcm-list__container.bcm-list__type-select.is-open,.bcm-list__container.bcm-list__type-autocomplete.is-open{opacity:1;transform:translateY(0);visibility:visible;transition:visibility 0s linear 0s, opacity 100ms, transform 100ms}.bcm-list__label{line-height:1}.bcm-list__input{display:flex;align-items:center;justify-content:space-between;box-sizing:border-box;border:1px solid var(--bcm-new-ds-color-slate-300);border-radius:4px;color:var(--bcm-new-ds-color-slate-600);background-color:var(--bcm-new-ds-color-white);user-select:none;cursor:pointer;padding:0 8px;height:32px;overflow:hidden;position:relative;transition:background-color 100ms, border-color 100ms}.bcm-list__input-spinner{position:absolute;top:0;left:0;width:100%;height:100%;display:flex;justify-content:center;align-items:center;background-color:var(--bcm-color-grey-1);opacity:0;visibility:hidden;transition:opacity 0.2s ease-in-out;z-index:-1}.bcm-list__input-spinner.is-open{opacity:1;visibility:visible;z-index:1}.bcm-list__input-container{width:100%}.bcm-list__input-container.value-empty{color:var(--bcm-color-grey-6)}.bcm-list__input-container.type-single,.bcm-list__input-container.value-empty{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bcm-list__input-placeholder{color:var(--bcm-color-grey-6)}.bcm-list__input-tag-container{height:100%;width:100%;display:flex;align-items:center;justify-content:flex-start;flex-wrap:nowrap;grid-gap:2px;line-height:1}.bcm-list__input-buttons{display:flex;align-items:center;justify-content:flex-end;grid-gap:4px;min-width:40px}.bcm-list__input-buttons-button{display:flex;align-items:center;justify-content:center;box-sizing:border-box;padding:4px;font-size:16px;color:var(--bcm-new-ds-color-slate-500)}.bcm-list__input-buttons-button.caret-is{transform:rotate(360deg);transition:transform 0.2s ease-in-out}.bcm-list__input-buttons-button.caret-is-open{transform:rotate(180deg)}.bcm-list__input-buttons:not(.disabled) .bcm-list__input-buttons-button:hover{cursor:pointer;color:var(--bcm-new-ds-color-slate-600)}.bcm-list__input-autocomplete{position:relative;padding-right:0}.bcm-list__input-autocomplete .bcm-list-input-selected-text{background-color:#ffffff;display:flex;align-items:center;justify-content:flex-start;width:calc(100% - 24px);height:100%;padding:0 calc(8px + 4px);position:absolute;top:0;left:0}.bcm-list__input-autocomplete .bcm-list__input-container{height:100%;display:flex;flex-direction:row}.bcm-list__input-autocomplete .bcm-list__input-container .bcm-list__input-tag-container{width:auto}.bcm-list__input-autocomplete .bcm-input,.bcm-list__input-autocomplete .bcm-list__autocomplete{height:100%;min-width:70px;width:100%}.bcm-list__input-autocomplete .bcm-input__container,.bcm-list__input-autocomplete .bcm-list__autocomplete__container{height:100%;border:none;padding:0;width:100%}.bcm-list__input-autocomplete .bcm-input__container:not(.disabled).focused,.bcm-list__input-autocomplete .bcm-input__container:not(.disabled):hover,.bcm-list__input-autocomplete .bcm-list__autocomplete__container:not(.disabled).focused,.bcm-list__input-autocomplete .bcm-list__autocomplete__container:not(.disabled):hover{border:none;box-shadow:none}.bcm-list__autocomplete{width:100%;position:relative}.bcm-list.full-width .bcm-list__container,.bcm-list.full-width .bcm-list__input{width:100%}.bcm-list.error .bcm-list__input{border-color:var(--bcm-color-red-6)}.bcm-list.disabled .bcm-list__container,.bcm-list.disabled .bcm-list__input{color:var(--bcm-new-ds-color-slate-300);background-color:var(--bcm-new-ds-color-slate-50);cursor:not-allowed}.bcm-list.disabled .bcm-tag__content.dismissable .close-button{cursor:default}.bcm-list:not(.disabled) .bcm-list__input .bcm-tag__content.checked .close-button bcm-icon{color:var(--bcm-new-ds-color-slate-100)}.bcm-list:not(.disabled) .bcm-list__input .bcm-tag__content.checked .close-button:hover bcm-icon{color:var(--bcm-new-ds-color-slate-200)}.bcm-list:not(.disabled) .bcm-list__input:hover{border-color:var(--bcm-new-ds-color-blue-500)}.bcm-list:not(.disabled) .bcm-list__input:hover .bcm-tag__content.dismissable:not(.checked){background-color:var(--bcm-new-ds-color-slate-200);border-color:var(--bcm-new-ds-color-slate-200)}.bcm-list:not(.disabled) .bcm-list__input:focus-visible{border-color:var(--bcm-new-ds-color-blue-500);box-shadow:0 1px 3px 0 rgba(17, 24, 38, 0.1)}.bcm-list:not(.disabled) .bcm-list__input:active{border-color:var(--bcm-new-ds-color-blue-500)}.bcm-list__item{padding:2px 0}.bcm-list__item.disabled{user-select:none}.bcm-list__item:focus{outline:none}.bcm-list__item:focus-visible>.bcm-list__item-content{background-color:var(--bcm-new-ds-color-slate-300)}.bcm-list__item:focus-visible>.bcm-list__item-content:not(.disabled){color:var(--bcm-new-ds-color-slate-600)}.bcm-list__item-content{display:flex;flex-direction:row;align-items:stretch;justify-content:flex-start;flex-wrap:nowrap;cursor:pointer;border-radius:4px;padding:0;padding-left:4px;color:var(--bcm-new-ds-color-slate-600);background-color:var(--bcm-new-ds-color-slate-50);transition:background-color 0.2s ease}.bcm-list__item-content.disabled{color:var(--bcm-new-ds-color-slate-300);background-color:var(--bcm-new-ds-color-slate-50);user-select:none;cursor:not-allowed}.bcm-list__item-content.selected{color:var(--bcm-new-ds-color-white);background-color:var(--bcm-new-ds-color-blue-500)}.bcm-list__item-content.selected:hover:not(.disabled){color:var(--bcm-new-ds-color-white);background-color:var(--bcm-new-ds-color-blue-600)}.bcm-list__item-content:hover:not(.disabled){color:var(--bcm-new-ds-color-slate-600);background-color:var(--bcm-new-ds-color-slate-100)}.bcm-list__item-content:active:not(.disabled){color:var(--bcm-new-ds-color-slate-600);background-color:var(--bcm-new-ds-color-slate-200)}.bcm-list__item-content-collapse-icon{width:16px;padding:0 8px;display:flex;align-items:center;justify-content:center;font-size:16px}.bcm-list__item-content-collapse-icon.child{cursor:pointer}.bcm-list__item-content-text{user-select:none;padding:8px;width:100%;display:flex;flex-direction:row;align-items:center;justify-content:flex-start}.bcm-list__item-content-text.treeview{padding:8px 0}.bcm-list__item-content-text-checkbox{display:flex;flex-direction:row;align-items:center;justify-content:center;flex-wrap:nowrap;margin-right:8px}.bcm-list__item-content-text-checkbox .bcm-checkbox{margin:0}.bcm-list__item-content-text-inner{width:100%}.bcm-list__item-content-text mark{padding:0;margin:0;font-size:inherit;color:var(--bcm-color-grey-8);background-color:var(--bcm-color-yellow-4)}.bcm-list__item-childs{padding-left:16px}.bcm-list__item-small{padding:2px 0 2px 8px;font-size:10px;line-height:calc(10px + 8px)}.bcm-list__item-small .bcm-list__item-content-text{padding:3px 4px}.bcm-list__item-medium{font-size:12px;line-height:calc(12px + 8px)}.bcm-list__item-medium .bcm-list__item-content-text{padding:6px 4px}.bcm-list__item-large{font-size:14px;line-height:calc(14px + 8px)}.bcm-list__item-large .bcm-list__item-content-text{padding:9px 4px}.bcm-list__item--readonly:focus>.bcm-list__item-content:not(.disabled),.bcm-list__item--readonly.focused>.bcm-list__item-content:not(.disabled){color:var(--bcm-color-grey-7)}.bcm-list__item--readonly>.bcm-list__item-content{color:var(--bcm-color-grey-7)}.bcm-list__item--readonly>.bcm-list__item-content:hover,.bcm-list__item--readonly>.bcm-list__item-content:focus{color:var(--bcm-color-grey-7)}.bcm-list__item--group{border-radius:4px}.bcm-list__item--group:focus>.bcm-list__item-content:not(.disabled){background-color:var(--bcm-new-ds-color-slate-50);color:var(--bcm-new-ds-color-slate-600)}.bcm-list__item--group>.bcm-list__item-content{background-color:var(--bcm-new-ds-color-slate-50);color:var(--bcm-new-ds-color-slate-600);border-radius:4px 4px 0 0;cursor:default;font-size:14px;line-height:calc(14px + 8px);font-weight:500;position:sticky;top:0}.bcm-list__item--group>.bcm-list__item-content>.bcm-list__item-content-text{padding:4px 8px 4px 16px}.bcm-list__item--group>.bcm-list__item-content:hover,.bcm-list__item--group>.bcm-list__item-content:focus{color:var(--bcm-new-ds-color-slate-800);background-color:var(--bcm-new-ds-color-slate-50)}.bcm-list__item--group>.bcm-list__item-content-unclickable:hover{color:var(--bcm-new-ds-color-slate-700);background-color:var(--bcm-new-ds-color-slate-50)}.bcm-list__item--group>.bcm-list__item-childs{background-color:var(--bcm-new-ds-color-slate-50);color:var(--bcm-new-ds-color-slate-600);padding-bottom:8px;border-radius:0 0 4px 4px;padding-left:8px}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content{background-color:var(--bcm-new-ds-color-white);color:var(--bcm-new-ds-color-slate-600)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content:hover{background-color:var(--bcm-new-ds-color-slate-100)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content:active{background-color:var(--bcm-new-ds-color-slate-200)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content:focus-visible{background-color:var(--bcm-new-ds-color-slate-300)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content.selected{background-color:var(--bcm-new-ds-color-blue-500);color:var(--bcm-new-ds-color-white)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content.selected:hover{background-color:var(--bcm-new-ds-color-blue-600)}.bcm-list__item--group>.bcm-list__item-childs .bcm-list__item-content.selected:active{background-color:var(--bcm-new-ds-color-blue-700)}.bcm-list__linked{display:none}.bcm-list .bcm-tag--other .value{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bcm-info-footer{text-align:right;padding:4px 8px;background-color:var(--bcm-new-ds-color-slate-100);color:var(--bcm-new-ds-color-slate-600);border-radius:0 0 4px 4px}";
|
|
20189
|
+
|
|
20190
|
+
var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
20191
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
20192
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
20193
|
+
r = Reflect.decorate(decorators, target, key, desc);
|
|
20194
|
+
else
|
|
20195
|
+
for (var i = decorators.length - 1; i >= 0; i--)
|
|
20196
|
+
if (d = decorators[i])
|
|
20197
|
+
r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
20198
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
20199
|
+
};
|
|
20200
|
+
const BcmList = class {
|
|
20201
|
+
constructor(hostRef) {
|
|
20202
|
+
registerInstance(this, hostRef);
|
|
20203
|
+
this.bcmChecklist = createEvent(this, "bcm-checklist", 7);
|
|
20204
|
+
this.bcmSelected = createEvent(this, "bcm-selected", 7);
|
|
20205
|
+
this.change = createEvent(this, "bcm-change", 7);
|
|
20206
|
+
this.open = createEvent(this, "bcm-open", 7);
|
|
20207
|
+
this.close = createEvent(this, "bcm-close", 7);
|
|
20208
|
+
this.debounce = null;
|
|
20209
|
+
this.debounceHandler = Generate.debounceInput(() => this.listenResize(), 300, false);
|
|
20210
|
+
this._id = Generate.UID();
|
|
20211
|
+
this.type = Bcm$1.ListType.listbox;
|
|
20212
|
+
this.treeview = false;
|
|
20213
|
+
this.checkboxes = false;
|
|
20214
|
+
this.searchable = false;
|
|
20215
|
+
this.value = null;
|
|
20216
|
+
this.inputText = undefined;
|
|
20217
|
+
this.name = undefined;
|
|
20218
|
+
this.label = undefined;
|
|
20219
|
+
this.size = Bcm$1.Size.medium;
|
|
20220
|
+
this.disabled = false;
|
|
20221
|
+
this.readonly = false;
|
|
20222
|
+
this.highlight = false;
|
|
20223
|
+
this.highlightText = undefined;
|
|
20224
|
+
this.required = false;
|
|
20225
|
+
this.hidden = false;
|
|
20226
|
+
this.fullWidth = false;
|
|
20227
|
+
this.height = '256px';
|
|
20228
|
+
this.maxHeight = '500px';
|
|
20229
|
+
this.minHeight = '150px';
|
|
20230
|
+
this.width = '256px';
|
|
20231
|
+
this.infoFooter = false;
|
|
20232
|
+
this.variableText = 'item';
|
|
20233
|
+
this.template = undefined;
|
|
20234
|
+
this.allOpen = false;
|
|
20235
|
+
this.keyControl = false;
|
|
20236
|
+
this.checkAll = true;
|
|
20237
|
+
this.stopDeepClean = false;
|
|
20238
|
+
this.linkedComponent = undefined;
|
|
20239
|
+
this.isOpen = false;
|
|
20240
|
+
this.calculatedViewport = false;
|
|
20241
|
+
this.isSelectedOther = false;
|
|
20242
|
+
this.isHaveOtherTag = false;
|
|
20243
|
+
this.placeholder = 'Choose an option';
|
|
20244
|
+
this.searchPlaceholder = 'Search';
|
|
20245
|
+
this.searchIsOnlyChilds = false;
|
|
20246
|
+
this.minSearchLength = 2;
|
|
20247
|
+
this.clearable = false;
|
|
20248
|
+
this.caption = undefined;
|
|
20249
|
+
this.noCaption = false;
|
|
20250
|
+
this.captionType = Bcm$1.Status.default;
|
|
20251
|
+
this.captionError = undefined;
|
|
20252
|
+
this.emptyText = undefined;
|
|
20253
|
+
this.emptyIcon = 'fad fa-folder-open';
|
|
20254
|
+
this.captionCache = undefined;
|
|
20255
|
+
this.captionTypeCache = undefined;
|
|
20256
|
+
this.tick = {};
|
|
20257
|
+
this.totalData = 0;
|
|
20258
|
+
this.totalRootData = 0;
|
|
20259
|
+
this.limit = 20;
|
|
20260
|
+
this.searchGetParents = undefined;
|
|
20261
|
+
this.searchResultLimit = 20;
|
|
20262
|
+
this.searchFound = null;
|
|
20263
|
+
this.returnFilterData = {};
|
|
20264
|
+
this.returnOtherData = {};
|
|
20265
|
+
this.options = {
|
|
20266
|
+
rootMargin: '30px',
|
|
20267
|
+
};
|
|
20268
|
+
this.tagContainerWidth = 0;
|
|
20269
|
+
this.selectAllItem = {
|
|
20270
|
+
id: 'select-all',
|
|
20271
|
+
text: 'Select All',
|
|
20272
|
+
value: 'select-all',
|
|
20273
|
+
checked: false,
|
|
20274
|
+
disabled: false,
|
|
20275
|
+
icon: '',
|
|
20276
|
+
status: Bcm$1.Status.default,
|
|
20277
|
+
indeterminate: 'uncheck',
|
|
20278
|
+
};
|
|
20279
|
+
this.placement = Bcm$1.Placement['bottom-start'];
|
|
20280
|
+
this.data = [];
|
|
20281
|
+
}
|
|
20282
|
+
connectedCallback() {
|
|
20283
|
+
if (this.height != '256px') {
|
|
20284
|
+
if (this.height.indexOf('px') > -1) {
|
|
20285
|
+
this.limit = Math.floor(+this.height.replace('px', '') / 10);
|
|
20286
|
+
}
|
|
20287
|
+
else {
|
|
20288
|
+
this.limit = Math.floor(+(window.innerHeight / 10));
|
|
20289
|
+
}
|
|
20290
|
+
this.searchResultLimit = this.limit;
|
|
20291
|
+
this.markForCheck();
|
|
20292
|
+
}
|
|
20293
|
+
const checkElementWithDom = document.querySelectorAll(`#bcm-list-${this._id}`);
|
|
20294
|
+
(checkElementWithDom === null || checkElementWithDom === void 0 ? void 0 : checkElementWithDom.length) > 1 && checkElementWithDom.forEach((item, index) => index > 0 && item.remove());
|
|
20295
|
+
}
|
|
20296
|
+
componentWillRender() {
|
|
20297
|
+
this.calculateLocation();
|
|
20298
|
+
}
|
|
20299
|
+
componentShouldUpdate(newVal, oldVal, propName) {
|
|
20300
|
+
if (Object.keys(this.getOptions()).indexOf(propName) > -1 && newVal !== oldVal) {
|
|
20301
|
+
this.updateOptions();
|
|
20302
|
+
}
|
|
20303
|
+
}
|
|
20304
|
+
async componentDidLoad() {
|
|
20305
|
+
await this.initState();
|
|
20306
|
+
if (this.type == 'select' || this.type == 'autocomplete' || this.linkedComponent) {
|
|
20307
|
+
const list = this.el.querySelector(`#bcm-list-${this._id}`);
|
|
20308
|
+
if (list) {
|
|
20309
|
+
document.body.appendChild(list);
|
|
20310
|
+
}
|
|
20311
|
+
}
|
|
20312
|
+
}
|
|
20313
|
+
tagCalculator() {
|
|
20314
|
+
if (this.checkboxes && (this.type == 'select' || this.type == 'autocomplete')) {
|
|
20315
|
+
const tagCalculator = new ListTagControl(`bcm-list-input-tag-container-${this._id}`, this.value, this._id, this.isSelectedOther, this.clearable);
|
|
20316
|
+
tagCalculator.calculateTags();
|
|
20317
|
+
const arrayIds = id => (typeof id == 'string' ? id.split(',') : [id]);
|
|
20318
|
+
const clearAutocomplete = () => {
|
|
20319
|
+
if (this.type == 'autocomplete') {
|
|
20320
|
+
const autocompleteInput = this.getAutoCompleteInput();
|
|
20321
|
+
if (autocompleteInput) {
|
|
20322
|
+
autocompleteInput.handleClear(false);
|
|
20323
|
+
}
|
|
20324
|
+
}
|
|
20325
|
+
};
|
|
20326
|
+
tagCalculator.onClickOtherTag = async (id) => {
|
|
20327
|
+
if (!this.disabled) {
|
|
20328
|
+
clearAutocomplete();
|
|
20329
|
+
if (this.isSelectedOther) {
|
|
20330
|
+
await this.unSelectOther();
|
|
20331
|
+
}
|
|
20332
|
+
else {
|
|
20333
|
+
await this.onClearSearch();
|
|
20334
|
+
this.isSelectedOther = true;
|
|
20335
|
+
this.filterOtherList(arrayIds(id));
|
|
20336
|
+
this.isOpen = true;
|
|
20337
|
+
}
|
|
20338
|
+
this.onSelectSearch();
|
|
20339
|
+
}
|
|
20340
|
+
};
|
|
20341
|
+
tagCalculator.onClickTag = _ => {
|
|
20342
|
+
// console.log(id);
|
|
20343
|
+
clearAutocomplete();
|
|
20344
|
+
this.onSelectSearch();
|
|
20345
|
+
this.unSelectOther();
|
|
20346
|
+
};
|
|
20347
|
+
tagCalculator.onClickDismiss = async (id) => {
|
|
20348
|
+
var _a;
|
|
20349
|
+
if (!this.disabled) {
|
|
20350
|
+
if (this.isSelectedOther) {
|
|
20351
|
+
await this.unSelectOther();
|
|
20352
|
+
}
|
|
20353
|
+
arrayIds(id).length > 1 ? listState.removeOtherTags(this._id, arrayIds(id)) : listState.checkedItem(this._id, arrayIds(id)[0]);
|
|
20354
|
+
this.value = (await this.getCheckedList()).checkedList;
|
|
20355
|
+
this.handleIndeterminate(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, this.totalData);
|
|
20356
|
+
}
|
|
20357
|
+
};
|
|
20358
|
+
}
|
|
20359
|
+
}
|
|
20360
|
+
disconnectedCallback() {
|
|
20361
|
+
this.isOpen = false;
|
|
20362
|
+
if (this.stopDeepClean)
|
|
20363
|
+
return;
|
|
20364
|
+
listState.removeState(this._id);
|
|
20365
|
+
this.el.innerHTML = '';
|
|
20366
|
+
if (this.type == 'select' || this.type == 'autocomplete' || this.linkedComponent) {
|
|
20367
|
+
const list = document.querySelectorAll(`#bcm-list-${this._id}`);
|
|
20368
|
+
if (list === null || list === void 0 ? void 0 : list.length) {
|
|
20369
|
+
list.forEach(item => item.remove());
|
|
20370
|
+
this.el.remove();
|
|
20371
|
+
}
|
|
20372
|
+
}
|
|
20373
|
+
}
|
|
20374
|
+
watchId(_, oldVal) {
|
|
20375
|
+
// console.info('Changed component id:', oldVal + ' -> ' + newVal);
|
|
20376
|
+
listState.removeState(oldVal);
|
|
20377
|
+
this.initState();
|
|
20378
|
+
}
|
|
20379
|
+
handleValueChange(newVal, oldVal) {
|
|
20380
|
+
var _a;
|
|
20381
|
+
if (Generate.objectIsEmpty(this.returnFilterData)) {
|
|
20382
|
+
this.handleIndeterminate(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, this.totalData);
|
|
20383
|
+
}
|
|
20384
|
+
if (this.checkboxes) {
|
|
20385
|
+
if (!Validators.compareTwoArrayIsSame(newVal, oldVal)) {
|
|
20386
|
+
this.bcmChecklist.emit(this.value);
|
|
20387
|
+
this.change.emit(this.value);
|
|
20388
|
+
}
|
|
20389
|
+
}
|
|
20390
|
+
else {
|
|
20391
|
+
if ((newVal === null || newVal === void 0 ? void 0 : newVal.text) != (oldVal === null || oldVal === void 0 ? void 0 : oldVal.text)) {
|
|
20392
|
+
this.change.emit(this.value);
|
|
20393
|
+
}
|
|
20394
|
+
}
|
|
20395
|
+
this.tagCalculator();
|
|
20396
|
+
}
|
|
20397
|
+
watchReturnFilterData(newVal) {
|
|
20398
|
+
var _a;
|
|
20399
|
+
const { checkedItems, visibledItems } = newVal;
|
|
20400
|
+
if (checkedItems && visibledItems) {
|
|
20401
|
+
this.handleIndeterminate(checkedItems.length, visibledItems.length);
|
|
20402
|
+
}
|
|
20403
|
+
else {
|
|
20404
|
+
this.handleIndeterminate(((_a = this.value) === null || _a === void 0 ? void 0 : _a.length) || 0, this.totalData);
|
|
20405
|
+
}
|
|
20406
|
+
}
|
|
20407
|
+
handleOtherSelected(newValue) {
|
|
20408
|
+
var _a;
|
|
20409
|
+
const tagContent = (_a = document.getElementById(`bcm-list-input-tag-${this._id}-other-tag`)) === null || _a === void 0 ? void 0 : _a.querySelector('.bcm-tag__content');
|
|
20410
|
+
if (tagContent) {
|
|
20411
|
+
if (newValue === true) {
|
|
20412
|
+
tagContent.classList.add('checkable', 'checked');
|
|
20413
|
+
}
|
|
20414
|
+
else {
|
|
20415
|
+
tagContent.classList.remove('checkable', 'checked');
|
|
20416
|
+
}
|
|
20417
|
+
}
|
|
20418
|
+
}
|
|
20419
|
+
async handleOpen() {
|
|
20420
|
+
if (this.isOpen) {
|
|
20421
|
+
this.open.emit();
|
|
20422
|
+
this.calculateLocation();
|
|
20423
|
+
this.onSelectSearch();
|
|
20424
|
+
}
|
|
20425
|
+
else {
|
|
20426
|
+
this.listScrollToTop();
|
|
20427
|
+
this.close.emit();
|
|
20428
|
+
await delay(100);
|
|
20429
|
+
this.unSelectOther();
|
|
20430
|
+
}
|
|
20431
|
+
}
|
|
20432
|
+
listScrollToTop() {
|
|
20433
|
+
const list = document.querySelector(`#bcm-list-${this._id}`);
|
|
20434
|
+
if (list) {
|
|
20435
|
+
list.querySelector('.scrolling').scrollTop = 0;
|
|
20436
|
+
}
|
|
20437
|
+
}
|
|
20438
|
+
async dataChanged(newValue, oldValue) {
|
|
20439
|
+
if (!Validators.compareTwoArrayIsSame(newValue, oldValue)) {
|
|
20440
|
+
await this.initState();
|
|
20441
|
+
}
|
|
20442
|
+
}
|
|
20443
|
+
isIntersecting(e) {
|
|
20444
|
+
const target = e === null || e === void 0 ? void 0 : e.target;
|
|
20445
|
+
if (target && target.id === this._id) {
|
|
20446
|
+
this.listenResize();
|
|
20447
|
+
}
|
|
20448
|
+
}
|
|
20449
|
+
handleSlotItems(e) {
|
|
20450
|
+
var _a;
|
|
20451
|
+
if (((_a = e === null || e === void 0 ? void 0 : e.detail) === null || _a === void 0 ? void 0 : _a.length) > 0) {
|
|
20452
|
+
this.data = e.detail;
|
|
20453
|
+
}
|
|
20454
|
+
}
|
|
20455
|
+
handleChange(e) {
|
|
20456
|
+
if (e.target.id == `bcm-list-input-tag-container-${this._id}-autocomplete-input`) {
|
|
20457
|
+
e.stopImmediatePropagation();
|
|
20458
|
+
}
|
|
20459
|
+
}
|
|
20460
|
+
handleResize() {
|
|
20461
|
+
this.calculateLocation();
|
|
20462
|
+
this.debounceHandler();
|
|
20463
|
+
}
|
|
20464
|
+
handleWheel(event) {
|
|
20465
|
+
if (this.isOpen) {
|
|
20466
|
+
const list = document.querySelector(`#bcm-list-${this._id}`);
|
|
20467
|
+
const isClickInside = list && Generate.findEventPath(event, list);
|
|
20468
|
+
if (isClickInside) {
|
|
20469
|
+
if (this.type == 'select' || this.type == 'autocomplete' || this.linkedComponent) {
|
|
20470
|
+
this.calculateLocation();
|
|
20471
|
+
}
|
|
20472
|
+
}
|
|
20473
|
+
else {
|
|
20474
|
+
this.hide();
|
|
20475
|
+
}
|
|
20476
|
+
}
|
|
20477
|
+
}
|
|
20478
|
+
handleClick(event) {
|
|
20479
|
+
var _a;
|
|
20480
|
+
if (this.disabled)
|
|
20481
|
+
return;
|
|
20482
|
+
const list = document.querySelector(`#bcm-list-${this._id}`);
|
|
20483
|
+
const isClickInside = Generate.findEventPath(event, this.el) || (list && Generate.findEventPath(event, list));
|
|
20484
|
+
if (isClickInside) {
|
|
20485
|
+
if (this.debounce !== null) {
|
|
20486
|
+
event.preventDefault();
|
|
20487
|
+
event.stopPropagation();
|
|
20488
|
+
clearTimeout(this.debounce);
|
|
20489
|
+
this.debounce = null;
|
|
20490
|
+
}
|
|
20491
|
+
this.debounce = setTimeout(() => {
|
|
20492
|
+
this.debounce = null;
|
|
20493
|
+
}, 300);
|
|
20494
|
+
}
|
|
20495
|
+
if (!isClickInside) {
|
|
20496
|
+
if (this.type == 'autocomplete') {
|
|
20497
|
+
const autocompleteInput = this.getAutoCompleteInput();
|
|
20498
|
+
if (autocompleteInput) {
|
|
20499
|
+
if (this.checkboxes) {
|
|
20500
|
+
autocompleteInput.setValue('');
|
|
20501
|
+
}
|
|
20502
|
+
else {
|
|
20503
|
+
autocompleteInput.setValue(((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || '');
|
|
20504
|
+
}
|
|
20505
|
+
}
|
|
20506
|
+
}
|
|
20507
|
+
}
|
|
20508
|
+
const clickToTag = Generate.findEventPathWithKey(event, 'className', ['bcm-tag']);
|
|
20509
|
+
const clickToOtherTag = Generate.findEventPathWithKey(event, 'className', ['bcm-tag bcm-tag--other']);
|
|
20510
|
+
const clickToSelect = Generate.findEventPathWithKey(event, 'id', [`bcm-list-input-${this._id}`, `bcm-list-label-${this._id}`]);
|
|
20511
|
+
const clickToTagDismiss = Generate.findEventPathWithKey(event, 'className', ['right close-button']);
|
|
20512
|
+
if (clickToSelect && !clickToTagDismiss && this.type != 'autocomplete') {
|
|
20513
|
+
this.isOpen = clickToTag || clickToOtherTag ? true : !this.isOpen;
|
|
20514
|
+
}
|
|
20515
|
+
if (list) {
|
|
20516
|
+
if (this.isOpen) {
|
|
20517
|
+
if (!list.contains(event.target) && !this.el.contains(event.target)) {
|
|
20518
|
+
this.isOpen = false;
|
|
20519
|
+
// this.unSelectOther()
|
|
20520
|
+
}
|
|
20521
|
+
}
|
|
20522
|
+
}
|
|
20523
|
+
}
|
|
20524
|
+
bcmOnSearchClear(event) {
|
|
20525
|
+
var _a, _b;
|
|
20526
|
+
if (this.type == 'autocomplete') {
|
|
20527
|
+
if (((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.id) === `bcm-list-${this._id}-search` || ((_b = event === null || event === void 0 ? void 0 : event.target) === null || _b === void 0 ? void 0 : _b.id) === `bcm-list-input-tag-container-${this._id}-autocomplete-input`) {
|
|
20528
|
+
if (event.detail) {
|
|
20529
|
+
this.setClear();
|
|
20530
|
+
}
|
|
20531
|
+
}
|
|
20532
|
+
}
|
|
20533
|
+
}
|
|
20534
|
+
bcmOnSearch(event) {
|
|
20535
|
+
var _a, _b, _c, _d, _e, _f;
|
|
20536
|
+
if (((_a = event === null || event === void 0 ? void 0 : event.target) === null || _a === void 0 ? void 0 : _a.id) === `bcm-list-${this._id}-search` || ((_b = event === null || event === void 0 ? void 0 : event.target) === null || _b === void 0 ? void 0 : _b.id) === `bcm-list-input-tag-container-${this._id}-autocomplete-input`) {
|
|
20537
|
+
this.searchGetParents = snq(() => { var _a; return (_a = event.detail) === null || _a === void 0 ? void 0 : _a.parentIndex; }, null);
|
|
20538
|
+
this.searchResultLimit = 10;
|
|
20539
|
+
this.searchFound = ((_c = event.detail) === null || _c === void 0 ? void 0 : _c.matching) != null ? (_d = event.detail) === null || _d === void 0 ? void 0 : _d.matching.length : null;
|
|
20540
|
+
this.returnFilterData = listState.filterData(this._id, (_e = event.detail) === null || _e === void 0 ? void 0 : _e.nestedResult);
|
|
20541
|
+
if (this.searchFound > 0 && this.highlight) {
|
|
20542
|
+
this.highlightText = (_f = event.detail) === null || _f === void 0 ? void 0 : _f.value;
|
|
20543
|
+
}
|
|
20544
|
+
if (this.type == 'autocomplete') {
|
|
20545
|
+
this.isOpen = true;
|
|
20546
|
+
}
|
|
20547
|
+
if (!event.detail.result) {
|
|
20548
|
+
if (this.type == 'autocomplete') {
|
|
20549
|
+
this.isOpen = false;
|
|
20550
|
+
}
|
|
20551
|
+
if (this.isSelectedOther) {
|
|
20552
|
+
this.filterOtherList(this.otherTagIds());
|
|
20553
|
+
}
|
|
20554
|
+
else {
|
|
20555
|
+
this.returnFilterData = {};
|
|
20556
|
+
listState.filterData(this._id, null);
|
|
20557
|
+
}
|
|
20558
|
+
// this.isSelectedOther = false
|
|
20559
|
+
this.searchResultLimit = null;
|
|
20560
|
+
this.highlightText = null;
|
|
20561
|
+
}
|
|
20562
|
+
this.markForCheck();
|
|
20563
|
+
}
|
|
20564
|
+
}
|
|
20565
|
+
//keyboard navigation
|
|
20566
|
+
handleKeyDown(ev) {
|
|
20567
|
+
const keycode = ev.keyCode || ev.which;
|
|
20568
|
+
if (keycode === Bcm$1.KeyCode.escape) {
|
|
20569
|
+
if (this.isOpen) {
|
|
20570
|
+
this.isOpen = false;
|
|
20571
|
+
ev.preventDefault();
|
|
20572
|
+
ev.stopPropagation();
|
|
20573
|
+
ev.stopImmediatePropagation();
|
|
20574
|
+
}
|
|
20575
|
+
}
|
|
20576
|
+
if (this.keyControl) {
|
|
20577
|
+
const keyboard = new ListKeyControl(keycode, this.el, this.treeview, this.checkboxes);
|
|
20578
|
+
keyboard.openGroup = openGroupId => {
|
|
20579
|
+
this.openGroup(openGroupId);
|
|
20580
|
+
};
|
|
20581
|
+
keyboard.checkedItem = checkedItemId => {
|
|
20582
|
+
this.checkedItem(checkedItemId);
|
|
20583
|
+
};
|
|
20584
|
+
keyboard.keyDown();
|
|
20585
|
+
}
|
|
20586
|
+
}
|
|
20587
|
+
handleKeyUp(ev) {
|
|
20588
|
+
if (this.keyControl) {
|
|
20589
|
+
const focusedList = Generate.findEventPath(ev, this.el);
|
|
20590
|
+
if (focusedList) {
|
|
20591
|
+
const list = document.getElementById(`bcm-list-${this._id}`);
|
|
20592
|
+
if (list) {
|
|
20593
|
+
const items = list.querySelectorAll('.bcm-list__item.focused');
|
|
20594
|
+
if (items.length > 0) {
|
|
20595
|
+
const main = list.querySelector('main');
|
|
20596
|
+
const itemHeight = items[0].offsetHeight;
|
|
20597
|
+
const listHeight = main.offsetHeight;
|
|
20598
|
+
const itemTop = items[0].offsetTop;
|
|
20599
|
+
if (itemTop > listHeight) {
|
|
20600
|
+
main.scrollTop = itemTop - listHeight / 2 + itemHeight / 2;
|
|
20601
|
+
}
|
|
20602
|
+
if (itemTop < listHeight) {
|
|
20603
|
+
main.scrollTop = itemTop - listHeight / 2 - itemHeight / 2;
|
|
20604
|
+
}
|
|
20605
|
+
}
|
|
20606
|
+
}
|
|
20607
|
+
}
|
|
20608
|
+
}
|
|
20609
|
+
}
|
|
20610
|
+
async set(data) {
|
|
20611
|
+
if (data) {
|
|
20612
|
+
if (Array.isArray(data)) {
|
|
20613
|
+
this.addChecked(data);
|
|
20614
|
+
}
|
|
20615
|
+
if (typeof data === 'string' || typeof data === 'number') {
|
|
20616
|
+
this.selectedItem(data);
|
|
20617
|
+
}
|
|
20618
|
+
}
|
|
20619
|
+
else {
|
|
20620
|
+
this.setClear();
|
|
20621
|
+
}
|
|
20622
|
+
}
|
|
20623
|
+
async get() {
|
|
20624
|
+
var _a, _b;
|
|
20625
|
+
return this.value ? (this.checkboxes ? (_b = (_a = ((await this.getCheckedList()))) === null || _a === void 0 ? void 0 : _a.checkedList) === null || _b === void 0 ? void 0 : _b.map(item => item.id) : this.value.id) : null;
|
|
20626
|
+
}
|
|
20627
|
+
async getCheckedList() {
|
|
20628
|
+
return Promise.resolve(listState.getCheckedList(this._id));
|
|
20629
|
+
}
|
|
20630
|
+
async getSelected() {
|
|
20631
|
+
return Promise.resolve(listState.getSelected(this._id));
|
|
20632
|
+
}
|
|
20633
|
+
async getValue() {
|
|
20634
|
+
return Promise.resolve(this.value);
|
|
20635
|
+
}
|
|
20636
|
+
async addChecked(ids = [], save = false, emit = true) {
|
|
20637
|
+
if (ids && ids.length > 0) {
|
|
20638
|
+
if (!save) {
|
|
20639
|
+
listState.setClear(this._id);
|
|
20640
|
+
await delay(10);
|
|
20641
|
+
}
|
|
20642
|
+
await listState.addChecked(this._id, ids);
|
|
20643
|
+
await delay(10);
|
|
20644
|
+
emit && (this.value = (await this.getCheckedList()).checkedList);
|
|
20645
|
+
this.markForCheck();
|
|
20646
|
+
}
|
|
20647
|
+
return Promise.resolve(this.value);
|
|
20648
|
+
}
|
|
20649
|
+
async selected(id) {
|
|
20650
|
+
if (id) {
|
|
20651
|
+
return Promise.resolve(await this.selectedItem(id));
|
|
20652
|
+
}
|
|
20653
|
+
return false;
|
|
20654
|
+
}
|
|
20655
|
+
async setClear(e) {
|
|
20656
|
+
listState.setClear(this._id);
|
|
20657
|
+
this.value = null;
|
|
20658
|
+
this.inputText = '';
|
|
20659
|
+
this.isOpen = false;
|
|
20660
|
+
this.selectAllItem.indeterminate = 'uncheck';
|
|
20661
|
+
this.tagCalculator();
|
|
20662
|
+
this.markForCheck();
|
|
20663
|
+
if (e) {
|
|
20664
|
+
e.stopPropagation();
|
|
20665
|
+
e.preventDefault();
|
|
20666
|
+
}
|
|
20667
|
+
await delay(10);
|
|
20668
|
+
return Promise.resolve();
|
|
20669
|
+
}
|
|
20670
|
+
async resetCaption() {
|
|
20671
|
+
await delay(10);
|
|
20672
|
+
this.caption = this.captionCache;
|
|
20673
|
+
this.captionType = this.captionTypeCache;
|
|
20674
|
+
this.captionError = null;
|
|
20675
|
+
await delay(10);
|
|
20676
|
+
return Promise.resolve();
|
|
20677
|
+
}
|
|
20678
|
+
async show() {
|
|
20679
|
+
this.isOpen = true;
|
|
20680
|
+
return Promise.resolve();
|
|
20681
|
+
}
|
|
20682
|
+
async hide() {
|
|
20683
|
+
this.isOpen = false;
|
|
20684
|
+
return Promise.resolve();
|
|
20685
|
+
}
|
|
20686
|
+
updateOptions() {
|
|
20687
|
+
listState.updateOptions(this._id, this);
|
|
20688
|
+
}
|
|
20689
|
+
handleIndeterminate(checkeds, total) {
|
|
20690
|
+
this.selectAllItem = Object.assign(Object.assign({}, this.selectAllItem), { indeterminate: this.checkboxes && checkeds > 0 ? (checkeds === total ? 'check' : 'indeterminate') : 'uncheck', checked: this.checkboxes && checkeds > 0 ? (checkeds === total ? true : false) : false });
|
|
20691
|
+
}
|
|
20692
|
+
listenResize() {
|
|
20693
|
+
this.tagCalculator();
|
|
20694
|
+
this.calculateLocation();
|
|
20695
|
+
this.markForCheck();
|
|
20696
|
+
}
|
|
20697
|
+
async unSelectOther() {
|
|
20698
|
+
await this.onClearSearch();
|
|
20699
|
+
this.isSelectedOther = false;
|
|
20700
|
+
this.searchFound = null;
|
|
20701
|
+
this.returnFilterData = {};
|
|
20702
|
+
listState.filterData(this._id, null);
|
|
20703
|
+
await delay(10);
|
|
20704
|
+
return Promise.resolve();
|
|
20705
|
+
}
|
|
20706
|
+
async onClearSearch() {
|
|
20707
|
+
const searchInput = document.getElementById(`bcm-list-${this._id}-search`);
|
|
20708
|
+
if (searchInput) {
|
|
20709
|
+
await searchInput.handleClear();
|
|
20710
|
+
}
|
|
20711
|
+
return Promise.resolve();
|
|
20712
|
+
}
|
|
20713
|
+
async onSelectSearch() {
|
|
20714
|
+
const searchInput = document.getElementById(`bcm-list-${this._id}-search`);
|
|
20715
|
+
if (searchInput) {
|
|
20716
|
+
await delay(100);
|
|
20717
|
+
searchInput.onBcmFocus();
|
|
20718
|
+
searchInput.onBcmSelect();
|
|
20719
|
+
}
|
|
20720
|
+
}
|
|
20721
|
+
otherTagIds() {
|
|
20722
|
+
const otherTag = document.querySelector(`#bcm-list-input-tag-${this._id}-other-tag`);
|
|
20723
|
+
if (otherTag) {
|
|
20724
|
+
return otherTag.getAttribute('data-ids').split(',');
|
|
20725
|
+
}
|
|
20726
|
+
}
|
|
20727
|
+
async filterOtherList(ids) {
|
|
20728
|
+
const checklist = (await this.getCheckedList()).nestedResult;
|
|
20729
|
+
const filter = Generate.convertIdsToNestedData(ids, checklist);
|
|
20730
|
+
this.returnFilterData = await listState.filterData(this._id, filter, null, true);
|
|
20731
|
+
this.searchFound = (ids === null || ids === void 0 ? void 0 : ids.length) || 0;
|
|
20732
|
+
this.limit = 500;
|
|
20733
|
+
this.searchGetParents = null;
|
|
20734
|
+
await delay(1000);
|
|
20735
|
+
this.markForCheck();
|
|
20736
|
+
}
|
|
20737
|
+
async initState() {
|
|
20738
|
+
var _a, _b, _c;
|
|
20739
|
+
this.onClearSearch();
|
|
20740
|
+
await listState.setValue({
|
|
20741
|
+
id: this._id,
|
|
20742
|
+
dataSource: this.data && snq(() => (typeof this.data == 'string' ? JSON.parse(this.data) : this.data), []),
|
|
20743
|
+
options: this,
|
|
20744
|
+
});
|
|
20745
|
+
const { totalRoots, totalItems } = listState.getValue(this._id);
|
|
20746
|
+
this.totalData = totalItems;
|
|
20747
|
+
this.totalRootData = totalRoots;
|
|
20748
|
+
this.value = this.checkboxes ? (await this.getCheckedList()).checkedList : listState.selectedItem(this._id) ? listState.selectedItem(this._id)[0] : null;
|
|
20749
|
+
if (!this.checkboxes) {
|
|
20750
|
+
this.inputText = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || null;
|
|
20751
|
+
}
|
|
20752
|
+
// checkli olan subparentların indeterminate kontrolü için
|
|
20753
|
+
if (this.checkboxes && ((_b = this.value) === null || _b === void 0 ? void 0 : _b.length) > 0) {
|
|
20754
|
+
const checkedIDs = [];
|
|
20755
|
+
this.value.forEach(item => {
|
|
20756
|
+
if (!item.items || item.items.length === 0) {
|
|
20757
|
+
checkedIDs.push(item.id);
|
|
20758
|
+
}
|
|
20759
|
+
});
|
|
20760
|
+
await this.addChecked(checkedIDs, false, false);
|
|
20761
|
+
}
|
|
20762
|
+
await this.handleIndeterminate((_c = this.value) === null || _c === void 0 ? void 0 : _c.length, this.totalData);
|
|
20763
|
+
await this.markForCheck();
|
|
20764
|
+
}
|
|
20765
|
+
async markForCheck() {
|
|
20766
|
+
await delay(10);
|
|
20767
|
+
this.tick = Generate.UID();
|
|
20768
|
+
}
|
|
20769
|
+
getOptions() {
|
|
20770
|
+
return snq(() => listState.getValue(this._id).options, {});
|
|
20771
|
+
}
|
|
20772
|
+
getItems() {
|
|
20773
|
+
if (this.isSelectedOther) {
|
|
20774
|
+
return this.returnFilterData['checkedItems'];
|
|
20775
|
+
}
|
|
20776
|
+
return snq(() => listState.getData(this._id), []);
|
|
20777
|
+
}
|
|
20778
|
+
getLimitedItems(ids) {
|
|
20779
|
+
return snq(() => listState.getDataPagination(this._id, this.searchResultLimit || this.limit, ids), []);
|
|
20780
|
+
}
|
|
20781
|
+
openGroup(parentId) {
|
|
20782
|
+
listState.openGroup(this._id, parentId);
|
|
20783
|
+
this.markForCheck();
|
|
20784
|
+
}
|
|
20785
|
+
focusItem(e) {
|
|
20786
|
+
if (e.target.classList.contains('bcm-list__item')) {
|
|
20787
|
+
const item = e.target;
|
|
20788
|
+
const list = document.getElementById(`bcm-list-${this._id}`);
|
|
20789
|
+
if (list) {
|
|
20790
|
+
const items = list.querySelectorAll('.bcm-list__item');
|
|
20791
|
+
if (items.length > 0) {
|
|
20792
|
+
const selectedItem = list.querySelector('.bcm-list__item.focused');
|
|
20793
|
+
if (selectedItem) {
|
|
20794
|
+
selectedItem.classList.remove('focused');
|
|
20795
|
+
}
|
|
20796
|
+
item.classList.add('focused');
|
|
20797
|
+
}
|
|
20798
|
+
}
|
|
20799
|
+
}
|
|
20800
|
+
}
|
|
20801
|
+
async selectedItem(itemId) {
|
|
20802
|
+
var _a;
|
|
20803
|
+
if (!this.checkboxes) {
|
|
20804
|
+
this.value = listState.selectedItem(this._id, itemId) ? listState.selectedItem(this._id, itemId)[0] : null;
|
|
20805
|
+
this.inputText = ((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || null;
|
|
20806
|
+
this.isOpen = false;
|
|
20807
|
+
this.markForCheck();
|
|
20808
|
+
if (this.type == 'autocomplete' && this.value) {
|
|
20809
|
+
// await delay(100)
|
|
20810
|
+
// this.resetCaption()
|
|
20811
|
+
const autocompleteInput = this.getAutoCompleteInput();
|
|
20812
|
+
if (autocompleteInput) {
|
|
20813
|
+
setTimeout(() => {
|
|
20814
|
+
var _a;
|
|
20815
|
+
autocompleteInput.setValue(((_a = this.value) === null || _a === void 0 ? void 0 : _a.text) || '');
|
|
20816
|
+
this.isOpen = false;
|
|
20817
|
+
}, 100);
|
|
20818
|
+
}
|
|
20819
|
+
}
|
|
20820
|
+
}
|
|
20821
|
+
return Promise.resolve(this.value);
|
|
20822
|
+
}
|
|
20823
|
+
async checkedItem(itemId) {
|
|
20824
|
+
const isCheckSelectAll = itemId === 'select-all';
|
|
20825
|
+
if (!isCheckSelectAll) {
|
|
20826
|
+
listState.checkedItem(this._id, itemId);
|
|
20827
|
+
}
|
|
20828
|
+
else {
|
|
20829
|
+
listState.selectAll(this._id, !this.selectAllItem.checked);
|
|
20830
|
+
}
|
|
20831
|
+
this.value = (await this.getCheckedList()).checkedList;
|
|
20832
|
+
this.changeVisibleCheckeds();
|
|
20833
|
+
this.markForCheck();
|
|
20834
|
+
}
|
|
20835
|
+
changeVisibleCheckeds() {
|
|
20836
|
+
const { visibledItems } = this.returnFilterData;
|
|
20837
|
+
this.returnFilterData = {
|
|
20838
|
+
visibledItems,
|
|
20839
|
+
checkedItems: (visibledItems && visibledItems.filter(item => item.checked)) || [],
|
|
20840
|
+
};
|
|
20841
|
+
}
|
|
20842
|
+
getAutoCompleteInput() {
|
|
20843
|
+
return document.getElementById(`bcm-list-input-tag-container-${this._id}-autocomplete-input`);
|
|
20844
|
+
}
|
|
20845
|
+
dataScrollEvent(event) {
|
|
20846
|
+
let count = 0;
|
|
20847
|
+
let io = new IntersectionObserver((data) => {
|
|
20848
|
+
if (count === 0) {
|
|
20849
|
+
count++;
|
|
20850
|
+
if (data[0].isIntersecting) {
|
|
20851
|
+
this.limit += 15;
|
|
20852
|
+
this.searchResultLimit += 15;
|
|
20853
|
+
io.disconnect();
|
|
20854
|
+
io = null;
|
|
20855
|
+
}
|
|
20856
|
+
}
|
|
20857
|
+
}, this.options);
|
|
20858
|
+
io.observe(event.target.lastElementChild);
|
|
20859
|
+
}
|
|
20860
|
+
async calculateLocation() {
|
|
20861
|
+
var _a, _b;
|
|
20862
|
+
if (this.type == 'select' || this.type == 'autocomplete' || this.linkedComponent) {
|
|
20863
|
+
const list = document.getElementById(`bcm-list-${this._id}`);
|
|
20864
|
+
// list && (list.style.height = '256px') //sebebi neydi ki!
|
|
20865
|
+
var placement = this.placement;
|
|
20866
|
+
const targetElementId = this.linkedComponent ? this.linkedComponent : `bcm-list-input-${this._id}`;
|
|
20867
|
+
const targetElement = document.getElementById(targetElementId);
|
|
20868
|
+
if (list && targetElement) {
|
|
20869
|
+
getPlacement(list, targetElement, placement, (place) => (placement = place));
|
|
20870
|
+
await delay(10);
|
|
20871
|
+
let pos = setPosition(placement, targetElement);
|
|
20872
|
+
let captionAreaHeight = 0;
|
|
20873
|
+
let labelAreaHeight = 0;
|
|
20874
|
+
if (this.linkedComponent) {
|
|
20875
|
+
const linked = document.getElementById(this.linkedComponent);
|
|
20876
|
+
if (linked) {
|
|
20877
|
+
if (!linked['noCaption']) {
|
|
20878
|
+
const captionArea = ((_a = linked.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.bcm-caption-area')) || linked.querySelector('.bcm-caption-area');
|
|
20879
|
+
if (captionArea) {
|
|
20880
|
+
captionAreaHeight = captionArea.offsetHeight || captionArea.clientHeight;
|
|
20881
|
+
}
|
|
20882
|
+
}
|
|
20883
|
+
const labelArea = ((_b = linked.shadowRoot) === null || _b === void 0 ? void 0 : _b.querySelector('.bcm-label')) || linked.querySelector('.bcm-label');
|
|
20884
|
+
if (labelArea) {
|
|
20885
|
+
labelAreaHeight = labelArea.offsetHeight || labelArea.clientHeight;
|
|
20886
|
+
}
|
|
20887
|
+
}
|
|
20888
|
+
}
|
|
20889
|
+
if (this.fullWidth) {
|
|
20890
|
+
list.style.width = targetElement.offsetWidth + 'px';
|
|
20891
|
+
}
|
|
20892
|
+
else {
|
|
20893
|
+
list.style.width = this.width || 'auto';
|
|
20894
|
+
}
|
|
20895
|
+
if (this.height.indexOf('%') > -1) {
|
|
20896
|
+
list.style.height = NumberHelper.toNumber(this.height) * 0.01 * window.innerHeight - pos[0] - 50 + 'px';
|
|
20897
|
+
}
|
|
20898
|
+
else {
|
|
20899
|
+
list.style.height = this.height;
|
|
20900
|
+
}
|
|
20901
|
+
list.style.minHeight = this.minHeight;
|
|
20902
|
+
// const calculatedMaxHeight = window.innerHeight - pos[0] - 50;
|
|
20903
|
+
const calculatedMaxHeight = placement.split('-')[0] == 'top' ? window.innerHeight - (window.innerHeight - pos[0]) - 50 : window.innerHeight - pos[0] - 50;
|
|
20904
|
+
if (this.maxHeight.indexOf('%') > -1) {
|
|
20905
|
+
list.style.maxHeight = NumberHelper.toNumber(this.maxHeight) * 0.01 * calculatedMaxHeight + 'px';
|
|
20906
|
+
}
|
|
20907
|
+
else {
|
|
20908
|
+
list.style.maxHeight = NumberHelper.toNumber(this.maxHeight) < calculatedMaxHeight ? this.maxHeight : calculatedMaxHeight + 'px';
|
|
20909
|
+
}
|
|
20910
|
+
getPlacement(list, targetElement, placement, (place) => (placement = place));
|
|
20911
|
+
await delay(10);
|
|
20912
|
+
pos = setPosition(placement, targetElement);
|
|
20913
|
+
list.style.top = (placement.split('-')[0] == 'top' ? pos[0] - list.offsetHeight + labelAreaHeight : pos[0] - captionAreaHeight) + 'px';
|
|
20914
|
+
// list.style.left = pos[1] + 'px';
|
|
20915
|
+
list.style.left = placement.split('-')[1] == 'end' ? pos[1] - list.offsetWidth + 'px' : pos[1] + 'px';
|
|
20916
|
+
list.classList.toggle('bcm-list--top', placement.split('-')[0] == 'top');
|
|
20917
|
+
this.calculatedViewport = true;
|
|
20918
|
+
}
|
|
20919
|
+
}
|
|
20920
|
+
}
|
|
20921
|
+
render() {
|
|
20922
|
+
const { checkboxes, treeview, label, size, disabled, readonly, required, hidden, fullWidth, searchable } = this.getOptions();
|
|
20923
|
+
const hostClasses = classnames('bcm-list', `bcm-list__size-${size}`, `bcm-list__${this.type}`, size === 'large' ? 'size-3' : 'size-2', {
|
|
20924
|
+
'error': this.captionType == Bcm$1.Status.error,
|
|
20925
|
+
'full-width': fullWidth,
|
|
20926
|
+
'bcm-list__linked': this.linkedComponent,
|
|
20927
|
+
hidden,
|
|
20928
|
+
readonly,
|
|
20929
|
+
disabled,
|
|
20930
|
+
});
|
|
20931
|
+
const bcmListContainer = classnames('bcm-list__container', this.linkedComponent ? 'bcm-list__type-linked-component' : `bcm-list__type-${this.type}`, {
|
|
20932
|
+
'is-open': this.isOpen && this.calculatedViewport,
|
|
20933
|
+
'error': this.captionType == Bcm$1.Status.error,
|
|
20934
|
+
'full-width': fullWidth,
|
|
20935
|
+
hidden,
|
|
20936
|
+
readonly,
|
|
20937
|
+
disabled,
|
|
20938
|
+
});
|
|
20939
|
+
const bcmListInput = classnames('bcm-list__input');
|
|
20940
|
+
const openedType = this.type == 'select' || this.type == 'autocomplete' || this.linkedComponent;
|
|
20941
|
+
return (h$1(Host, { class: hostClasses, tabindex: "0", style: {
|
|
20942
|
+
'--width': fullWidth ? '100%' : this.width,
|
|
20943
|
+
'--height': openedType ? '100%' : this.height,
|
|
20944
|
+
'--max-height': openedType ? 'inherit' : this.maxHeight,
|
|
20945
|
+
'--min-height': openedType ? 'inherit' : this.minHeight,
|
|
20946
|
+
} }, h$1("div", { id: `bcm-list-label-${this._id}`, class: "bcm-list__label" }, label && (h$1("div", null, h$1(LabelTemplate, { size: this.size, type: this.captionType, value: label, required: required, htmlFor: this._id })))), this.type == 'select' && (h$1("div", { id: `bcm-list-input-${this._id}`, class: bcmListInput }, h$1("span", { class: classnames('bcm-list__input-container', { 'type-single': !checkboxes, 'value-empty': !this.value }) }, this.checkboxes && h$1("span", { id: `bcm-list-input-tag-container-${this._id}`, class: "bcm-list__input-tag-container" }), this.checkboxes && !this.value && h$1("span", { class: "bcm-list__input-placeholder" }, this.placeholder), !this.checkboxes && (this.value ? this.inputText : h$1("span", { class: "bcm-list__input-placeholder" }, this.placeholder))), h$1("span", { class: classnames('bcm-list__input-buttons', {
|
|
20947
|
+
disabled: disabled,
|
|
20948
|
+
}) }, this.clearable && this.value && (h$1("div", { class: "bcm-list__input-buttons-button" }, h$1("bcm-icon", { icon: "fal fa-times", onClick: e => !disabled && this.setClear(e) }))), h$1("div", { class: `bcm-list__input-buttons-button caret-is ${this.isOpen && this.calculatedViewport && 'caret-is-open'}` }, h$1("bcm-icon", { icon: `far fa-angle-down` }))))), this.type === 'autocomplete' && (h$1("div", { id: `bcm-list-input-${this._id}`, class: classnames(bcmListInput, { 'bcm-list__input-autocomplete': this.type == 'autocomplete' }) }, h$1("span", { class: "bcm-list__input-container", id: `bcm-list-input-tag-container-${this._id}` }, this.checkboxes && h$1("span", { class: "bcm-list__input-tag-container", id: `bcm-list-input-tag-container-${this._id}-autocomplete` }), h$1("bcm-search", { id: `bcm-list-input-tag-container-${this._id}-autocomplete-input`, class: "bcm-list__autocomplete", data: this.data, clearable: true, "full-width": true, "no-caption": true, placeholder: this.placeholder })))), h$1(ListTemplate, { highlight: this.highlightText, searchable: this.type == 'autocomplete' ? false : searchable, bcmListContainer: bcmListContainer, checkboxes: checkboxes, treeview: treeview, infoFooter: this.infoFooter, value: this.value, totalData: this.totalData, searchFound: this.searchFound, variableText: this.variableText, searchPlaceholder: this.searchPlaceholder, minSearchLength: this.minSearchLength, searchIsOnlyChilds: this.searchIsOnlyChilds, _id: this._id, checkAll: this.checkAll, data: this.getItems(), width: this.width, height: this.height, size: this.size, selectAllItem: this.selectAllItem, onScrollEvent: e => this.dataScrollEvent(e), items: this.getLimitedItems(this.searchGetParents), selectedItem: itemId => this.selectedItem(itemId), checkedItem: itemId => this.checkedItem(itemId), openGroup: parentId => this.openGroup(parentId), focusItem: itemId => this.focusItem(itemId), emptyText: this.emptyText, emptyIcon: this.emptyIcon }), h$1(CaptionTemplate, { noCaption: this.noCaption, captionType: this.captionType, captionError: this.captionError, caption: this.caption })));
|
|
20949
|
+
}
|
|
20950
|
+
get el() { return getElement(this); }
|
|
20951
|
+
static get watchers() { return {
|
|
20952
|
+
"_id": ["watchId"],
|
|
20953
|
+
"value": ["handleValueChange"],
|
|
20954
|
+
"returnFilterData": ["watchReturnFilterData"],
|
|
20955
|
+
"isSelectedOther": ["handleOtherSelected"],
|
|
20956
|
+
"isOpen": ["handleOpen"],
|
|
20957
|
+
"data": ["dataChanged"]
|
|
20958
|
+
}; }
|
|
20959
|
+
};
|
|
20960
|
+
__decorate$5([
|
|
20961
|
+
IsLoad()
|
|
20962
|
+
], BcmList.prototype, "el", void 0);
|
|
20963
|
+
__decorate$5([
|
|
20964
|
+
JsonParse('data', true)
|
|
20965
|
+
], BcmList.prototype, "dataChanged", null);
|
|
20966
|
+
BcmList.style = listCss;
|
|
20967
|
+
|
|
20968
|
+
const { state: state$1 } = createStore({
|
|
20969
|
+
value: new Map(),
|
|
20970
|
+
});
|
|
20971
|
+
const setValue$1 = val => {
|
|
20972
|
+
const { id, dataSource } = val;
|
|
20973
|
+
const data = {
|
|
20974
|
+
id: snq(() => id, Generate.UID),
|
|
20975
|
+
dataSource: dataSource && dataSource.length > 0 && recursive(dataSource),
|
|
20976
|
+
searchIsOnlyChilds: val.searchIsOnlyChilds,
|
|
20977
|
+
};
|
|
20978
|
+
state$1.value.set(data.id, data);
|
|
20979
|
+
};
|
|
20980
|
+
const recursive = (data, parentId) => {
|
|
20981
|
+
let recData = [];
|
|
20982
|
+
if (data) {
|
|
20983
|
+
recData = data.map(item => (Object.assign(Object.assign(Object.assign({}, item), { parentId: snq(() => parentId, null) }), (item.items && item.items.length > 0 && { items: snq(() => recursive(item.items, item.id), []) }))));
|
|
20984
|
+
}
|
|
20985
|
+
return recData;
|
|
20986
|
+
};
|
|
20987
|
+
const removeValue = _id => {
|
|
20988
|
+
state$1.value.delete(_id);
|
|
20989
|
+
};
|
|
20990
|
+
const getValue$1 = id => snq(() => state$1.value.get(id), {});
|
|
20991
|
+
const getDataPagination = (id, limit = 3) => {
|
|
20992
|
+
let data = [];
|
|
20993
|
+
const value = getValue$1(id);
|
|
20994
|
+
if (value) {
|
|
20995
|
+
const { dataSource } = value;
|
|
20996
|
+
data = dataSource.slice(0, limit);
|
|
20997
|
+
}
|
|
20998
|
+
return data;
|
|
20999
|
+
};
|
|
21000
|
+
// //search treeview data by text
|
|
21001
|
+
// const searchData = (id, search, items?) => {
|
|
21002
|
+
// let dataSource
|
|
21003
|
+
// if (items && items.length > 0) {
|
|
21004
|
+
// dataSource = items
|
|
21005
|
+
// } else {
|
|
21006
|
+
// const value = getValue(id);
|
|
21007
|
+
// dataSource = value.dataSource;
|
|
21008
|
+
// }
|
|
21009
|
+
// let result = []
|
|
21010
|
+
// if (dataSource) {
|
|
21011
|
+
// dataSource.forEach(child => {
|
|
21012
|
+
// if (child.text.toLowerCase().includes(search.toLowerCase())) {
|
|
21013
|
+
// result.push(child)
|
|
21014
|
+
// }
|
|
21015
|
+
// result = result.concat(searchData(id, search, child.items))
|
|
21016
|
+
// })
|
|
21017
|
+
// };
|
|
21018
|
+
// return result
|
|
21019
|
+
// };
|
|
21020
|
+
//nested search
|
|
21021
|
+
const searchData = (id, searchText, items) => {
|
|
21022
|
+
let dataSource;
|
|
21023
|
+
if (items && items.length > 0) {
|
|
21024
|
+
dataSource = items;
|
|
21025
|
+
}
|
|
21026
|
+
else {
|
|
21027
|
+
const value = getValue$1(id);
|
|
21028
|
+
dataSource = value.dataSource;
|
|
21029
|
+
}
|
|
21030
|
+
let results = [];
|
|
21031
|
+
if (dataSource) {
|
|
21032
|
+
results.push(nestedSearch(id, dataSource, searchText));
|
|
21033
|
+
//return with their parents
|
|
21034
|
+
// dataSource.forEach(child => {
|
|
21035
|
+
// if (child.text.toLowerCase().includes(searchText.toLowerCase())) {
|
|
21036
|
+
// results.push(child)
|
|
21037
|
+
// } else if (child.items && child.items.length > 0) {
|
|
21038
|
+
// child.items = nestedSearch(child.items, searchText)
|
|
21039
|
+
// if (child.items.length > 0) {
|
|
21040
|
+
// results.push(child)
|
|
21041
|
+
// }
|
|
21042
|
+
// }
|
|
21043
|
+
// })
|
|
21044
|
+
}
|
|
21045
|
+
return {
|
|
21046
|
+
result: snq(() => Generate.flatArray(results[0].result), []),
|
|
21047
|
+
matching: snq(() => results[0].matching, []),
|
|
21048
|
+
parentIndex: snq(() => results[0].parentIndex, []),
|
|
21049
|
+
nestedResult: snq(() => results[0].nestedResult, []),
|
|
21050
|
+
};
|
|
21051
|
+
};
|
|
21052
|
+
const nestedSearch = (id, items, searchText) => {
|
|
21053
|
+
let matching = [];
|
|
21054
|
+
let parentIndex = [];
|
|
21055
|
+
let result = [];
|
|
21056
|
+
let nestedResult = [];
|
|
21057
|
+
const { searchIsOnlyChilds } = getValue$1(id);
|
|
21058
|
+
if (items && items.length > 0) {
|
|
21059
|
+
items.forEach(child => {
|
|
21060
|
+
let isChild = searchIsOnlyChilds && child.parentId !== null;
|
|
21061
|
+
let isMatching = StringHelper.slugify(child.text).indexOf(StringHelper.slugify(searchText)) > -1 ||
|
|
21062
|
+
(child.keywords && StringHelper.slugify(child.keywords).indexOf(StringHelper.slugify(searchText)) > -1);
|
|
21063
|
+
if (isMatching && (!searchIsOnlyChilds || (searchIsOnlyChilds && isChild))) {
|
|
21064
|
+
result.push(child.id);
|
|
21065
|
+
matching.push(child.id);
|
|
21066
|
+
parentIndex.push(child.id);
|
|
21067
|
+
nestedResult.push({ id: child.id, text: child.text, parentId: child.parentId });
|
|
21068
|
+
if (child.items && child.items.length > 0) {
|
|
21069
|
+
const found = nestedSearch(id, child.items, searchText);
|
|
21070
|
+
if (found.matching.length > 0) {
|
|
21071
|
+
found.matching.forEach(chi => {
|
|
21072
|
+
matching.push(chi);
|
|
21073
|
+
});
|
|
21074
|
+
}
|
|
21075
|
+
}
|
|
21076
|
+
}
|
|
21077
|
+
else if (child.items && child.items.length > 0) {
|
|
21078
|
+
const found = nestedSearch(id, child.items, searchText);
|
|
21079
|
+
if (found.result.length > 0) {
|
|
21080
|
+
found.result.forEach(chi => {
|
|
21081
|
+
result.push(chi);
|
|
21082
|
+
});
|
|
21083
|
+
result.push(child.id);
|
|
21084
|
+
parentIndex.push(child.id);
|
|
21085
|
+
nestedResult.push({ id: child.id, text: child.text, parentId: child.parentId, items: found.nestedResult });
|
|
21086
|
+
}
|
|
21087
|
+
if (found.matching.length > 0) {
|
|
21088
|
+
matching.push(...found.matching);
|
|
21089
|
+
}
|
|
21090
|
+
}
|
|
21091
|
+
});
|
|
21092
|
+
}
|
|
21093
|
+
return { result, matching, parentIndex, nestedResult };
|
|
21094
|
+
};
|
|
21095
|
+
const searchState = {
|
|
21096
|
+
setValue: setValue$1,
|
|
21097
|
+
removeValue,
|
|
21098
|
+
getValue: getValue$1,
|
|
21099
|
+
getDataPagination,
|
|
21100
|
+
searchData,
|
|
21101
|
+
};
|
|
21102
|
+
|
|
21103
|
+
const searchCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); @import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); @import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); .size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-caption-area{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;font-size:12px;line-height:calc(12px + 8px);color:var(--bcm-new-ds-color-slate-400);display:flex;flex-direction:row;align-items:flex-start;justify-content:space-between;flex-wrap:nowrap;margin-top:2px}.bcm-caption-area__text{color:var(--bcm-new-ds-color-slate-400)}.bcm-caption-area__text.default{color:var(--bcm-new-ds-color-slate-400)}.bcm-caption-area__text.info{color:var(--bcm-new-ds-color-blue-500)}.bcm-caption-area__text.success{color:var(--bcm-new-ds-color-emerald-500)}.bcm-caption-area__text.warning{color:var(--bcm-new-ds-color-amber-500)}.bcm-caption-area__text.error{color:var(--bcm-new-ds-color-red-500)}.bcm-caption-area__size-small{font-size:10px;line-height:calc(10px + 8px);min-height:calc(10px + 8px)}.bcm-caption-area__size-medium{font-size:12px;line-height:calc(12px + 8px);min-height:calc(12px + 8px)}.bcm-caption-area__size-large{font-size:14px;line-height:calc(14px + 8px);min-height:calc(14px + 8px)}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-label{display:inline-flex;align-items:flex-start;grid-gap:2px}.bcm-label__text{margin-bottom:2px;font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;display:inline-block;color:var(--bcm-new-ds-color-slate-600)}.bcm-label__size-small{font-size:10px;line-height:calc(10px + 8px);min-height:calc(10px + 8px)}.bcm-label__size-medium{font-size:12px;line-height:calc(12px + 8px);min-height:calc(12px + 8px)}.bcm-label__size-large{font-size:14px;line-height:calc(14px + 8px);min-height:calc(14px + 8px)}.bcm-input[no-margin]{margin:0}.bcm-textarea[no-margin]{margin:0}.bcm-switch[no-margin]{margin:0}.bcm-checkbox[no-margin]{margin:0}.bcm-radio-group[no-margin]{margin:0}.bcm-checkbox-group[no-margin]{margin:0}.bcm-range[no-margin]{margin:0}.bcm-form[no-margin]{margin:0}.bcm-form-group[no-margin]{margin:0}.bcm-list[no-margin]{margin:0}.bcm-colorpicker[no-margin]{margin:0}.bcm-date-picker[no-margin]{margin:0}.bcm-time-picker[no-margin]{margin:0}.bcm-datetime-picker[no-margin]{margin:0}.bcm-select[no-margin]{margin:0}.bcm-listbox[no-margin]{margin:0}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-input{display:inline-flex;flex-direction:column;width:100%;max-width:256px;margin-bottom:8px}.bcm-input.full-width{max-width:100%}.bcm-input.hidden{display:none}.bcm-input__container{font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400;display:flex;align-items:stretch;flex-direction:row;background-color:var(--bcm-new-ds-color-white);border:1px solid var(--bcm-new-ds-color-slate-300);border-radius:4px;box-sizing:border-box;cursor:text;padding:0 0 0 4px;position:relative;width:100%}.bcm-input__container.disabled{background-color:var(--bcm-new-ds-color-slate-50);cursor:not-allowed}.bcm-input__container.disabled .bcm-input-element{color:var(--bcm-new-ds-color-slate-500)}.bcm-input__container.readonly{background-color:var(--bcm-new-ds-color-slate-50);cursor:default}.bcm-input__container.readonly .bcm-input-element{color:var(--bcm-new-ds-color-slate-600)}.bcm-input__container:not(.disabled):hover .caret-container,.bcm-input__container:not(.disabled).focused .caret-container{opacity:1}.bcm-input__container:not(.disabled):hover .input-clear-button,.bcm-input__container:not(.disabled).focused .input-clear-button{opacity:1}.bcm-input__container:not(.disabled).focused{background-color:var(--bcm-new-ds-color-slate-50)}.bcm-input__container:not(.disabled):hover{border-color:var(--bcm-color-prime-blue-6)}.bcm-input__container.empty .input-clear-button{display:none}.bcm-input__container.invalid,.bcm-input__container.error{border-color:var(--bcm-new-ds-color-red-500)}.bcm-input__container .bcm-input-element{width:100%;color:var(--bcm-new-ds-color-slate-600);flex:1;border:none;background:transparent;box-shadow:unset;padding:0 4px;font-family:\"Inter\", sans-serif;cursor:inherit;-webkit-appearance:none;-moz-appearance:none;appearance:none;outline:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.bcm-input__container .bcm-input-element::placeholder{font-family:\"Inter\", sans-serif;color:var(--bcm-new-ds-color-slate-300);user-select:none}.bcm-input__container .bcm-input-element::-webkit-search-decoration,.bcm-input__container .bcm-input-element::-webkit-search-cancel-button,.bcm-input__container .bcm-input-element::-webkit-search-results-button,.bcm-input__container .bcm-input-element::-webkit-search-results-decoration,.bcm-input__container .bcm-input-element::-webkit-calendar-picker-indicator,.bcm-input__container .bcm-input-element::-webkit-inner-spin-button,.bcm-input__container .bcm-input-element::-webkit-outer-spin-button{-webkit-appearance:none}.bcm-input__container .caret-container{width:30px;display:flex;flex-direction:column;justify-content:center;align-items:stretch;border-left:1px solid #D9D9D9;transition:0.2s opacity;user-select:none;box-sizing:border-box}.bcm-input__container .caret-container .bcm-input-caret{display:flex;align-items:center;justify-content:center;color:var(--bcm-color-grey-7);cursor:pointer;flex:1}.bcm-input__container .caret-container .bcm-input-caret bcm-icon{line-height:1}.bcm-input__container .caret-container .bcm-input-caret:hover{color:var(--bcm-color-prime-blue-6)}.bcm-input__container .caret-container .bcm-input-caret:active{background-color:var(--bcm-color-grey-3)}.bcm-input__container .caret-container .bcm-input-caret:last-child{border-top:1px solid #D9D9D9}.bcm-input__container .caret-container.disabled{background-color:var(--bcm-color-grey-3)}.bcm-input__container .caret-container.disabled .bcm-input-caret{cursor:not-allowed}.bcm-input__container .input-suffix-content{display:flex;align-items:center;justify-content:center}.bcm-input__container .input-prefix:not(:empty){padding-left:4px}.bcm-input__container .input-suffix:not(:empty){min-width:24px;padding-right:4px}.bcm-input__container .input-prefix:not(:empty),.bcm-input__container .input-suffix:not(:empty){display:flex;align-items:center;justify-content:center;cursor:default;color:#64748a}.bcm-input__container .input-prefix:not(:empty) .unit-prefix,.bcm-input__container .input-suffix:not(:empty) .unit-prefix{color:#64748a}.bcm-input__container .input-prefix-button:not(:empty),.bcm-input__container .input-suffix-button:not(:empty){cursor:pointer}.bcm-input__container .caret-container,.bcm-input__container .input-clear-button{opacity:0}.bcm-input__container--small{font-size:12px}.bcm-input__container--medium{font-size:14px}.bcm-input__container--large{font-size:16px}.bcm-input__textarea .bcm-input-element{white-space:normal}.bcm-input__textarea.clearable .bcm-input-element{padding-right:24px}.bcm-input__textarea .input-clear-button{position:absolute;top:4px;right:0}";
|
|
21104
|
+
|
|
21105
|
+
var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
21106
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
21107
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
21108
|
+
r = Reflect.decorate(decorators, target, key, desc);
|
|
21109
|
+
else
|
|
21110
|
+
for (var i = decorators.length - 1; i >= 0; i--)
|
|
21111
|
+
if (d = decorators[i])
|
|
21112
|
+
r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
21113
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
21114
|
+
};
|
|
21115
|
+
const BcmSearch = class {
|
|
21116
|
+
constructor(hostRef) {
|
|
21117
|
+
registerInstance(this, hostRef);
|
|
21118
|
+
this.bcmOnSearch = createEvent(this, "bcm-on-search", 7);
|
|
21119
|
+
this.bcmOnSearchClear = createEvent(this, "bcm-on-search-clear", 7);
|
|
21120
|
+
this.debounceHandler = Generate.debounceInput((event) => this.onSearchValue(event, this), 300, false, () => {
|
|
21121
|
+
var _a, _b;
|
|
21122
|
+
this.isActiveClearable = ((_b = (_a = this.inputElement) === null || _a === void 0 ? void 0 : _a.value) === null || _b === void 0 ? void 0 : _b.length) > 0 && this.clearable;
|
|
21123
|
+
});
|
|
21124
|
+
this._id = Generate.UID();
|
|
21125
|
+
this.placeholder = "Search";
|
|
21126
|
+
this.disabled = false;
|
|
21127
|
+
this.readonly = false;
|
|
21128
|
+
this.clearable = true;
|
|
21129
|
+
this.size = Bcm.Size.medium;
|
|
21130
|
+
this.limit = 10;
|
|
21131
|
+
this.searchIsOnlyChilds = false;
|
|
21132
|
+
this.minSearchLength = 2;
|
|
21133
|
+
this.data = [];
|
|
21134
|
+
this.tick = {};
|
|
21135
|
+
this.isActiveClearable = false;
|
|
21136
|
+
}
|
|
21137
|
+
async componentDidLoad() {
|
|
21138
|
+
await this.initState();
|
|
21139
|
+
}
|
|
21140
|
+
async dataChanged(newValue, oldValue) {
|
|
21141
|
+
// console.log('data changed', newValue, oldValue)
|
|
21142
|
+
if (newValue !== oldValue) {
|
|
21143
|
+
await this.initState();
|
|
21144
|
+
}
|
|
21145
|
+
}
|
|
21146
|
+
async initState() {
|
|
21147
|
+
await searchState.setValue({
|
|
21148
|
+
id: this._id + "-input",
|
|
21149
|
+
dataSource: this.data,
|
|
21150
|
+
searchIsOnlyChilds: this.searchIsOnlyChilds,
|
|
21151
|
+
});
|
|
21152
|
+
await this.markForCheck();
|
|
21153
|
+
}
|
|
21154
|
+
markForCheck() {
|
|
21155
|
+
this.tick = Generate.UID();
|
|
21156
|
+
}
|
|
21157
|
+
handleInput() {
|
|
21158
|
+
// console.log("aheyya")
|
|
21159
|
+
}
|
|
21160
|
+
async onBcmFocus() {
|
|
21161
|
+
this.inputElement.focus();
|
|
21162
|
+
}
|
|
21163
|
+
async onBcmBlur() {
|
|
21164
|
+
this.inputElement.blur();
|
|
21165
|
+
}
|
|
21166
|
+
async onBcmSelect() {
|
|
21167
|
+
this.inputElement.select();
|
|
21168
|
+
}
|
|
21169
|
+
async setValue(newValue) {
|
|
21170
|
+
this.inputElement.value = newValue;
|
|
21171
|
+
}
|
|
21172
|
+
handleFocus() { }
|
|
21173
|
+
handleBlur() { }
|
|
21174
|
+
handleChange() { }
|
|
21175
|
+
async handleClear(eventEmit = true) {
|
|
21176
|
+
this.inputElement.value = '';
|
|
21177
|
+
const { value, id } = this.inputElement;
|
|
21178
|
+
searchState.searchData(id, value);
|
|
21179
|
+
this.isActiveClearable = false;
|
|
21180
|
+
this.bcmOnSearch.emit({ result: null, value: null, matching: null, parentIndex: null });
|
|
21181
|
+
this.bcmOnSearchClear.emit(eventEmit);
|
|
21182
|
+
await delay(10);
|
|
21183
|
+
return Promise.resolve();
|
|
21184
|
+
}
|
|
21185
|
+
onSearchValue(event, instance) {
|
|
21186
|
+
const { value, id } = event.target;
|
|
21187
|
+
const searchResult = (value === null || value === void 0 ? void 0 : value.length) >= this.minSearchLength ? searchState.searchData(id, value, null) : null;
|
|
21188
|
+
const { bcmOnSearch, inputElement } = instance;
|
|
21189
|
+
bcmOnSearch.emit({ result: searchResult === null || searchResult === void 0 ? void 0 : searchResult.result, value: inputElement === null || inputElement === void 0 ? void 0 : inputElement.value, matching: searchResult === null || searchResult === void 0 ? void 0 : searchResult.matching, parentIndex: searchResult === null || searchResult === void 0 ? void 0 : searchResult.parentIndex, nestedResult: searchResult === null || searchResult === void 0 ? void 0 : searchResult.nestedResult });
|
|
21190
|
+
}
|
|
21191
|
+
render() {
|
|
21192
|
+
const { _id, placeholder, disabled, readonly } = this;
|
|
21193
|
+
return h$1(Host, { onClick: () => { this.onBcmFocus(); this.onBcmSelect(); } }, h$1(InputTemplate, { size: this.size, id: _id, type: "search", placeholder: placeholder, disabled: disabled, "full-width": true, readonly: readonly, clearable: this.isActiveClearable, handleFocus: () => this.handleFocus(), handleBlur: () => this.handleBlur(), handleChange: () => this.handleChange(), handleClear: () => this.handleClear(), handleInput: this.debounceHandler, ref: (el) => this.inputElement = el }));
|
|
21194
|
+
}
|
|
21195
|
+
get el() { return getElement(this); }
|
|
21196
|
+
static get watchers() { return {
|
|
21197
|
+
"data": ["dataChanged"]
|
|
21198
|
+
}; }
|
|
21199
|
+
};
|
|
21200
|
+
__decorate$4([
|
|
21201
|
+
IsLoad()
|
|
21202
|
+
], BcmSearch.prototype, "el", void 0);
|
|
21203
|
+
BcmSearch.style = searchCss;
|
|
21204
|
+
|
|
21205
|
+
const { state } = createStore({
|
|
21206
|
+
value: new Map(),
|
|
21207
|
+
setData: {},
|
|
21208
|
+
});
|
|
21209
|
+
const setValue = val => {
|
|
21210
|
+
const data = Object.assign(Object.assign({}, val), { steps: val.steps &&
|
|
21211
|
+
val.steps.length > 0 &&
|
|
21212
|
+
val.steps
|
|
21213
|
+
.filter(data => !data.hidden)
|
|
21214
|
+
.map((item, index) => ({
|
|
21215
|
+
id: item.id || Generate.UID(),
|
|
21216
|
+
title: item.title || item._title,
|
|
21217
|
+
_title: item.title || item._title || 'Step ' + (index + 1),
|
|
21218
|
+
description: item.description || '',
|
|
21219
|
+
status: item.status || 'default',
|
|
21220
|
+
disabled: val.linear ? (index == 0 ? false : true) : item.disabled || false,
|
|
21221
|
+
icon: item.icon || undefined,
|
|
21222
|
+
valid: item.valid || true,
|
|
21223
|
+
loading: item.loading || false,
|
|
21224
|
+
index: index + 1,
|
|
21225
|
+
active: val.linear ? (index == 0 ? true : false) : val.active === index + 1,
|
|
21226
|
+
isLast: index === val.steps.length - 1,
|
|
21227
|
+
statusIcon: val.icon,
|
|
21228
|
+
headerHidden: item.hidden,
|
|
21229
|
+
})) });
|
|
21230
|
+
state.value.set(val.id, data);
|
|
21231
|
+
};
|
|
21232
|
+
const removeState = _id => {
|
|
21233
|
+
state.value.delete(_id);
|
|
21234
|
+
};
|
|
21235
|
+
const changeActiveStep = (id, index) => {
|
|
21236
|
+
const value = state.value.get(id);
|
|
21237
|
+
if (value) {
|
|
21238
|
+
value.active = index;
|
|
21239
|
+
value.steps = value.steps.map((step, i) => (Object.assign(Object.assign({}, step), { active: i === index - 1 })));
|
|
21240
|
+
}
|
|
21241
|
+
};
|
|
21242
|
+
const getActiveIndex = id => snq(() => state.value.get(id).active, 0);
|
|
21243
|
+
const changeStepStatus = (id, stepId, status) => {
|
|
21244
|
+
const value = state.value.get(id);
|
|
21245
|
+
if (value && value.steps) {
|
|
21246
|
+
value.steps = value.steps.map(step => (Object.assign(Object.assign({}, step), { status: step.id === stepId ? status : step.status })));
|
|
21247
|
+
forceUpdate(value.el);
|
|
21248
|
+
}
|
|
21249
|
+
};
|
|
21250
|
+
const changeStepDisabled = (id, stepId, disabled) => {
|
|
21251
|
+
const value = state.value.get(id);
|
|
21252
|
+
if (value && value.steps) {
|
|
21253
|
+
value.steps = value.steps.map(step => (Object.assign(Object.assign({}, step), { disabled: step.id === stepId ? disabled : step.disabled })));
|
|
21254
|
+
forceUpdate(value.el);
|
|
21255
|
+
}
|
|
21256
|
+
};
|
|
21257
|
+
const setActiveIndex = (id, index) => state.value.get(id).active = index;
|
|
21258
|
+
const stepperReset = id => {
|
|
21259
|
+
const value = state.value.get(id);
|
|
21260
|
+
if (value) {
|
|
21261
|
+
value.active = 1;
|
|
21262
|
+
value.steps = value.steps.map((step, i) => (Object.assign(Object.assign({}, step), { active: i === 0, status: 'default', disabled: i !== 0, loading: false })));
|
|
21263
|
+
forceUpdate(value.el);
|
|
21264
|
+
}
|
|
21265
|
+
};
|
|
21266
|
+
const getValue = id => snq(() => state.value.get(id), {});
|
|
21267
|
+
const stepperStates = {
|
|
21268
|
+
removeState,
|
|
21269
|
+
getValue,
|
|
21270
|
+
setValue,
|
|
21271
|
+
changeActiveStep,
|
|
21272
|
+
getActiveIndex,
|
|
21273
|
+
changeStepStatus,
|
|
21274
|
+
changeStepDisabled,
|
|
21275
|
+
stepperReset,
|
|
21276
|
+
setActiveIndex
|
|
21277
|
+
};
|
|
21278
|
+
|
|
21279
|
+
var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
21280
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
21281
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
21282
|
+
r = Reflect.decorate(decorators, target, key, desc);
|
|
21283
|
+
else
|
|
21284
|
+
for (var i = decorators.length - 1; i >= 0; i--)
|
|
21285
|
+
if (d = decorators[i])
|
|
21286
|
+
r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
21287
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
21288
|
+
};
|
|
21289
|
+
const BcmStep = class {
|
|
21290
|
+
constructor(hostRef) {
|
|
21291
|
+
registerInstance(this, hostRef);
|
|
21292
|
+
this.dataIsLoaded = createEvent(this, "data-is-loaded", 7);
|
|
21293
|
+
this.bcmChangeHidden = createEvent(this, "bcm-change-hidden", 7);
|
|
21294
|
+
this.hidden = false;
|
|
21295
|
+
this._id = Generate.UID();
|
|
21296
|
+
this._title = undefined;
|
|
21297
|
+
this.description = undefined;
|
|
21298
|
+
this.status = 'default';
|
|
21299
|
+
this.icon = undefined;
|
|
21300
|
+
this.loading = false;
|
|
21301
|
+
this.valid = true;
|
|
21302
|
+
this.index = undefined;
|
|
21303
|
+
this.active = false;
|
|
21304
|
+
this.htmlTemplate = undefined;
|
|
21305
|
+
this.isLast = false;
|
|
21306
|
+
this.disabled = false;
|
|
21307
|
+
}
|
|
21308
|
+
componentDidLoad() {
|
|
21309
|
+
if (this.isLast) {
|
|
21310
|
+
this.dataIsLoaded.emit(true);
|
|
21311
|
+
}
|
|
21312
|
+
}
|
|
21313
|
+
getStepper() {
|
|
21314
|
+
const stepper = this.el.closest('bcm-stepper');
|
|
21315
|
+
return stepper || null;
|
|
21316
|
+
}
|
|
21317
|
+
activeChanged() {
|
|
21318
|
+
if (this.active) {
|
|
21319
|
+
const stepper = this.getStepper();
|
|
21320
|
+
if (stepper) {
|
|
21321
|
+
stepperStates.changeStepDisabled(stepper.stepperId, this._id, false);
|
|
21322
|
+
}
|
|
21323
|
+
}
|
|
21324
|
+
}
|
|
21325
|
+
statusChange() {
|
|
21326
|
+
const stepper = this.getStepper();
|
|
21327
|
+
if (stepper) {
|
|
21328
|
+
stepperStates.changeStepStatus(stepper.stepperId, this._id, this.status);
|
|
21329
|
+
}
|
|
21330
|
+
}
|
|
21331
|
+
hiddenChange(newValue, oldValue) {
|
|
21332
|
+
const stepper = this.getStepper();
|
|
21333
|
+
if (newValue !== oldValue && stepper && !this.active) {
|
|
21334
|
+
this.bcmChangeHidden.emit(newValue);
|
|
21335
|
+
}
|
|
21336
|
+
}
|
|
21337
|
+
disabledChange(newValue, _) {
|
|
21338
|
+
const stepper = this.getStepper();
|
|
21339
|
+
if (stepper) {
|
|
21340
|
+
stepperStates.changeStepDisabled(stepper.stepperId, this._id, newValue);
|
|
21341
|
+
}
|
|
21342
|
+
}
|
|
21343
|
+
render() {
|
|
21344
|
+
const { hidden, valid, active } = this;
|
|
21345
|
+
const hostClasses = classnames('bcm-stepper__step', valid ? 'bcm-stepper__step-valid' : 'bcm-stepper__step-invalid', {
|
|
21346
|
+
'bcm-stepper__step-active': active,
|
|
21347
|
+
hidden,
|
|
21348
|
+
});
|
|
21349
|
+
return (h$1(Host, { class: hostClasses }, h$1("slot", null)));
|
|
21350
|
+
}
|
|
21351
|
+
get el() { return getElement(this); }
|
|
21352
|
+
static get watchers() { return {
|
|
21353
|
+
"active": ["activeChanged"],
|
|
21354
|
+
"status": ["statusChange"],
|
|
21355
|
+
"hidden": ["hiddenChange"],
|
|
21356
|
+
"disabled": ["disabledChange"]
|
|
21357
|
+
}; }
|
|
21358
|
+
};
|
|
21359
|
+
__decorate$3([
|
|
21360
|
+
IsLoad()
|
|
21361
|
+
], BcmStep.prototype, "el", void 0);
|
|
21362
|
+
|
|
21363
|
+
const stepperCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); .size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-stepper{display:block;font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400}.bcm-stepper__header{display:flex;flex-direction:row;justify-content:space-between;align-items:flex-start;padding:16px}.bcm-stepper__header *,.bcm-stepper__header ::after,.bcm-stepper__header ::before{box-sizing:content-box}.bcm-stepper__header-item{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.bcm-stepper__header-item--container{display:flex;flex-direction:column;align-items:center;justify-content:center;position:relative}.bcm-stepper__header-item-icon{position:relative;width:32px;height:32px;display:flex;justify-content:center;align-items:center;border-radius:50%;background-color:var(--bcm-color-prime-blue-6);color:var(--bcm-color-grey-1);line-height:1;margin-bottom:16px;user-select:none}.bcm-stepper__header-item-icon::before{width:40px;height:40px;border-radius:50%;border:2px solid var(--bcm-color-prime-blue-6);border-color:transparent;position:absolute;z-index:0;user-select:none;top:-6px;left:-6px}.bcm-stepper__header-item-title{color:var(--bcm-color-grey-8)}.bcm-stepper__header-item:not(.bcm-stepper__header-item--disabled):hover{cursor:pointer}.bcm-stepper__header-item:not(.bcm-stepper__header-item--disabled):hover .bcm-stepper__header-item-icon{background-color:var(--bcm-color-prime-blue-7)}.bcm-stepper__header-item::before,.bcm-stepper__header-item::after{content:\"\";position:absolute;width:calc(50% - 24px);height:2px;background-color:var(--bcm-color-prime-blue-6);top:16px;box-sizing:content-box}.bcm-stepper__header-item::after{right:0}.bcm-stepper__header-item::before{left:0}.bcm-stepper__header-item:first-of-type::before{display:none}.bcm-stepper__header-item:last-of-type::after{display:none}.bcm-stepper__header-item--active .bcm-stepper__header-item-icon::before{content:\"\";border:2px solid var(--bcm-color-prime-blue-6)}.bcm-stepper__header-item--active .bcm-stepper__header-item-title{font-weight:500}.bcm-stepper__header-line{width:100%;flex:1;height:2px;background-color:var(--bcm-color-prime-blue-6);margin-top:16px}.bcm-stepper__header-line--warning{background-color:var(--bcm-color-warmyellow-6)}.bcm-stepper__header-line--warning+.bcm-stepper__header-item::before{background-color:var(--bcm-color-warmyellow-6)}.bcm-stepper__header-item--warning::after{background-color:var(--bcm-color-warmyellow-6)}.bcm-stepper__header-item--warning .bcm-stepper__header-item-icon{background-color:var(--bcm-color-warmyellow-6)}.bcm-stepper__header-item--warning .bcm-stepper__header-item-icon::before{border-color:var(--bcm-color-warmyellow-6)}.bcm-stepper__header-item--warning:not(.bcm-stepper__header-item--disabled):hover{cursor:pointer}.bcm-stepper__header-item--warning:not(.bcm-stepper__header-item--disabled):hover .bcm-stepper__header-item-icon{background-color:var(--bcm-color-warmyellow-5)}.bcm-stepper__header-line--success{background-color:var(--bcm-color-green-6)}.bcm-stepper__header-line--success+.bcm-stepper__header-item::before{background-color:var(--bcm-color-green-6)}.bcm-stepper__header-item--success::after{background-color:var(--bcm-color-green-6)}.bcm-stepper__header-item--success .bcm-stepper__header-item-icon{background-color:var(--bcm-color-green-6)}.bcm-stepper__header-item--success .bcm-stepper__header-item-icon::before{border-color:var(--bcm-color-green-6)}.bcm-stepper__header-item--success:not(.bcm-stepper__header-item--disabled):hover{cursor:pointer}.bcm-stepper__header-item--success:not(.bcm-stepper__header-item--disabled):hover .bcm-stepper__header-item-icon{background-color:var(--bcm-color-green-5)}.bcm-stepper__header-line--error{background-color:var(--bcm-color-grey-6)}.bcm-stepper__header-line--error+.bcm-stepper__header-item::before{background-color:var(--bcm-color-grey-6)}.bcm-stepper__header-item--error::after{background-color:var(--bcm-color-grey-6)}.bcm-stepper__header-item--error .bcm-stepper__header-item-icon{background-color:var(--bcm-color-red-6)}.bcm-stepper__header-item--error .bcm-stepper__header-item-icon::before{border-color:var(--bcm-color-red-6)}.bcm-stepper__header-item--error:not(.bcm-stepper__header-item--disabled):hover{cursor:pointer}.bcm-stepper__header-item--error:not(.bcm-stepper__header-item--disabled):hover .bcm-stepper__header-item-icon{background-color:var(--bcm-color-red-5)}.bcm-stepper__header-line--default{background-color:var(--bcm-color-grey-6)}.bcm-stepper__header-line--default+.bcm-stepper__header-item::before{background-color:var(--bcm-color-grey-6)}.bcm-stepper__header-item--default::after{background-color:var(--bcm-color-grey-6)}.bcm-stepper__header-item--default .bcm-stepper__header-item-icon{background-color:var(--bcm-color-prime-blue-6)}.bcm-stepper__header-item--default .bcm-stepper__header-item-icon::before{border-color:var(--bcm-color-prime-blue-6)}.bcm-stepper__header-item--default:not(.bcm-stepper__header-item--disabled):hover{cursor:pointer}.bcm-stepper__header-item--default:not(.bcm-stepper__header-item--disabled):hover .bcm-stepper__header-item-icon{background-color:var(--bcm-color-prime-blue-5)}.bcm-stepper__header-line--loading{background-color:var(--bcm-color-prime-blue-6)}.bcm-stepper__header-line--loading+.bcm-stepper__header-item::before{background-color:var(--bcm-color-prime-blue-6)}.bcm-stepper__header-item--loading::after{background-color:var(--bcm-color-prime-blue-6)}.bcm-stepper__header-item--loading .bcm-stepper__header-item-icon{background-color:var(--bcm-color-prime-blue-6)}.bcm-stepper__header-item--loading .bcm-stepper__header-item-icon::before{border-color:var(--bcm-color-prime-blue-6)}.bcm-stepper__header-item--loading:not(.bcm-stepper__header-item--disabled):hover{cursor:pointer}.bcm-stepper__header-item--loading:not(.bcm-stepper__header-item--disabled):hover .bcm-stepper__header-item-icon{background-color:var(--bcm-color-prime-blue-5)}.bcm-stepper__header-line--disabled{background-color:var(--bcm-color-grey-6)}.bcm-stepper__header-line--disabled+.bcm-stepper__header-item::before{background-color:var(--bcm-color-grey-6)}.bcm-stepper__header-item--disabled::after{background-color:var(--bcm-color-grey-6)}.bcm-stepper__header-item--disabled .bcm-stepper__header-item-icon{background-color:var(--bcm-color-grey-6)}.bcm-stepper__header-item--disabled .bcm-stepper__header-item-icon::before{border-color:var(--bcm-color-grey-6)}.bcm-stepper__header-item--disabled:not(.bcm-stepper__header-item--disabled):hover{cursor:pointer}.bcm-stepper__header-item--disabled:not(.bcm-stepper__header-item--disabled):hover .bcm-stepper__header-item-icon{background-color:var(--bcm-color-grey-5)}.bcm-stepper__header-item--disabled{cursor:not-allowed}.bcm-stepper__header-item--disabled.bcm-stepper__header-item--container{pointer-events:none}.bcm-stepper__step{display:none}.bcm-stepper__step-active{display:block}";
|
|
21364
|
+
|
|
21365
|
+
var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
21366
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
21367
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
21368
|
+
r = Reflect.decorate(decorators, target, key, desc);
|
|
21369
|
+
else
|
|
21370
|
+
for (var i = decorators.length - 1; i >= 0; i--)
|
|
21371
|
+
if (d = decorators[i])
|
|
21372
|
+
r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
21373
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
21374
|
+
};
|
|
21375
|
+
const BcmStepper = class {
|
|
21376
|
+
constructor(hostRef) {
|
|
21377
|
+
registerInstance(this, hostRef);
|
|
21378
|
+
this.bcmStepChange = createEvent(this, "bcm-step-change", 7);
|
|
21379
|
+
this.hidden = false;
|
|
21380
|
+
this._id = Generate.UID();
|
|
21381
|
+
this.direction = Bcm$1.Direction.horizontal;
|
|
21382
|
+
this.linear = false;
|
|
21383
|
+
this.size = Bcm$1.Size.medium;
|
|
21384
|
+
this.icon = false;
|
|
21385
|
+
this.active = 1;
|
|
21386
|
+
this.stepperId = Generate.UID();
|
|
21387
|
+
this.data = [];
|
|
21388
|
+
this.tick = {};
|
|
21389
|
+
}
|
|
21390
|
+
async dataChanged() {
|
|
21391
|
+
this.initState();
|
|
21392
|
+
}
|
|
21393
|
+
componentDidLoad() {
|
|
21394
|
+
this.initState();
|
|
21395
|
+
}
|
|
21396
|
+
disconnectedCallback() {
|
|
21397
|
+
// stepperStates.removeState(this.stepperId);
|
|
21398
|
+
this.reset();
|
|
21399
|
+
}
|
|
21400
|
+
async initState() {
|
|
21401
|
+
const { stepperId, data, direction, linear, size, icon, active, el } = this;
|
|
21402
|
+
const steps = data.length > 0 ? data : this.getSlotElements();
|
|
21403
|
+
await stepperStates.setValue({
|
|
21404
|
+
id: stepperId,
|
|
21405
|
+
el,
|
|
21406
|
+
direction,
|
|
21407
|
+
linear,
|
|
21408
|
+
size,
|
|
21409
|
+
icon,
|
|
21410
|
+
active,
|
|
21411
|
+
steps,
|
|
21412
|
+
});
|
|
21413
|
+
this.markForCheck();
|
|
21414
|
+
}
|
|
21415
|
+
componentDidRender() {
|
|
21416
|
+
this.setSteps(this.getItems());
|
|
21417
|
+
}
|
|
21418
|
+
setSteps(steps) {
|
|
21419
|
+
const slots = getChildElements(this.el, "bcm-step");
|
|
21420
|
+
if (slots.length > 0) {
|
|
21421
|
+
slots.forEach((item, index) => {
|
|
21422
|
+
const step = steps.find(step => !item.headerHidden && step.id === item.id);
|
|
21423
|
+
if (step) {
|
|
21424
|
+
Generate.setAttributes(item, Object.assign({ title: "", _title: step.title || step._title || "", status: step.status || "default", disabled: step.disabled || false, valid: step.valid || true, loading: step.loading || false, index: step.index || index, active: step.active || false, innerHtml: step.innerHtml || "" }, (item.hidden == true && { headerHidden: true })));
|
|
21425
|
+
if ((item.hidden = false)) {
|
|
21426
|
+
item.removeAttribute("hidden");
|
|
21427
|
+
}
|
|
21428
|
+
}
|
|
21429
|
+
});
|
|
21430
|
+
}
|
|
21431
|
+
}
|
|
21432
|
+
markForCheck() {
|
|
21433
|
+
this.tick = Generate.UID();
|
|
21434
|
+
}
|
|
21435
|
+
handleChangeBcmHidden() {
|
|
21436
|
+
this.initState();
|
|
21437
|
+
}
|
|
21438
|
+
getActiveIndex() {
|
|
21439
|
+
return stepperStates.getActiveIndex(this.stepperId);
|
|
21440
|
+
}
|
|
21441
|
+
getSlotElements() {
|
|
21442
|
+
return snq(() => getChildElements(this.el, "bcm-step"), []);
|
|
21443
|
+
}
|
|
21444
|
+
async onStepChange(index) {
|
|
21445
|
+
if (index) {
|
|
21446
|
+
stepperStates.changeActiveStep(this.stepperId, index);
|
|
21447
|
+
this.bcmStepChange.emit(index);
|
|
21448
|
+
}
|
|
21449
|
+
forceUpdate(this.el);
|
|
21450
|
+
return Promise.resolve(index);
|
|
21451
|
+
}
|
|
21452
|
+
async prev() {
|
|
21453
|
+
const index = this.getActiveIndex() - 1;
|
|
21454
|
+
if (index >= 1) {
|
|
21455
|
+
if (!this.linear) {
|
|
21456
|
+
const previosStep = this.getItems()[index - 1];
|
|
21457
|
+
if (previosStep.disabled)
|
|
21458
|
+
return;
|
|
21459
|
+
await this.onStepChange(index);
|
|
21460
|
+
}
|
|
21461
|
+
else {
|
|
21462
|
+
await this.onStepChange(index);
|
|
21463
|
+
}
|
|
21464
|
+
}
|
|
21465
|
+
forceUpdate(this.el);
|
|
21466
|
+
return Promise.resolve(this.getActiveIndex());
|
|
21467
|
+
}
|
|
21468
|
+
async next(idx) {
|
|
21469
|
+
const index = idx || this.getActiveIndex();
|
|
21470
|
+
const step = await this.getCurrentStep();
|
|
21471
|
+
const lastStep = this.getItems()[this.getItems().length - 1];
|
|
21472
|
+
if (step.valid) {
|
|
21473
|
+
this.linear && lastStep.id != step.id && (step.status = "success");
|
|
21474
|
+
if (index < this.getItems().length) {
|
|
21475
|
+
await this.onStepChange(index + 1);
|
|
21476
|
+
}
|
|
21477
|
+
}
|
|
21478
|
+
else {
|
|
21479
|
+
step.status = "error";
|
|
21480
|
+
}
|
|
21481
|
+
forceUpdate(this.el);
|
|
21482
|
+
return Promise.resolve(this.getActiveIndex());
|
|
21483
|
+
}
|
|
21484
|
+
async setActive(index, force = false) {
|
|
21485
|
+
if (!index)
|
|
21486
|
+
return;
|
|
21487
|
+
if (force) {
|
|
21488
|
+
if (this.getActiveIndex() < index) {
|
|
21489
|
+
while (this.getActiveIndex() < index) {
|
|
21490
|
+
await this.next();
|
|
21491
|
+
await delay(100);
|
|
21492
|
+
}
|
|
21493
|
+
}
|
|
21494
|
+
else {
|
|
21495
|
+
while (this.getActiveIndex() > index) {
|
|
21496
|
+
await this.prev();
|
|
21497
|
+
await delay(100);
|
|
21498
|
+
}
|
|
21499
|
+
}
|
|
21500
|
+
}
|
|
21501
|
+
else {
|
|
21502
|
+
if (this.linear) {
|
|
21503
|
+
const prevStepIsValid = this.getItems()
|
|
21504
|
+
.filter(item => item.index < index)
|
|
21505
|
+
.map(item => ({
|
|
21506
|
+
id: item.id,
|
|
21507
|
+
status: item.status,
|
|
21508
|
+
disabled: item.disabled,
|
|
21509
|
+
}))
|
|
21510
|
+
.every(item => !item.disabled && (item.status === "success" || item.status === "default"));
|
|
21511
|
+
console.log("prevStepIsValid", prevStepIsValid);
|
|
21512
|
+
if (prevStepIsValid) {
|
|
21513
|
+
await this.next(index - 1);
|
|
21514
|
+
}
|
|
21515
|
+
}
|
|
21516
|
+
else {
|
|
21517
|
+
stepperStates.setActiveIndex(this.stepperId, index);
|
|
21518
|
+
await this.next(index - 1);
|
|
21519
|
+
}
|
|
21520
|
+
}
|
|
21521
|
+
}
|
|
21522
|
+
async reset() {
|
|
21523
|
+
await this.onStepChange(1);
|
|
21524
|
+
stepperStates.stepperReset(this.stepperId);
|
|
21525
|
+
return Promise.resolve(this.getActiveIndex());
|
|
21526
|
+
}
|
|
21527
|
+
async getCurrentStep() {
|
|
21528
|
+
var _a;
|
|
21529
|
+
return snq(() => this.getItems().filter(item => item.active == true)[0], (_a = this.getItems()[0]) !== null && _a !== void 0 ? _a : null);
|
|
21530
|
+
}
|
|
21531
|
+
async getSteps() {
|
|
21532
|
+
return Promise.resolve(this.getItems());
|
|
21533
|
+
}
|
|
21534
|
+
getItems() {
|
|
21535
|
+
return snq(() => { var _a; return (_a = stepperStates.getValue(this.stepperId).steps) === null || _a === void 0 ? void 0 : _a.filter(item => !item.headerHidden); }, []);
|
|
21536
|
+
}
|
|
21537
|
+
render() {
|
|
21538
|
+
const { hidden, direction, linear, size } = this;
|
|
21539
|
+
const hostClasses = classnames("bcm-stepper", "bcm-stepper__direction-" + direction, "bcm-stepper__size-" + size, {
|
|
21540
|
+
"bcm-stepper__linear": linear,
|
|
21541
|
+
hidden,
|
|
21542
|
+
});
|
|
21543
|
+
const lineClasses = item => classnames("bcm-stepper__header-line", `bcm-stepper__header-line--${(item === null || item === void 0 ? void 0 : item.disabled) ? "disabled" : (item === null || item === void 0 ? void 0 : item.status) === "error" ? "default" : item === null || item === void 0 ? void 0 : item.status}`);
|
|
21544
|
+
const items = this.getItems();
|
|
21545
|
+
return (h$1(Host, { class: hostClasses }, h$1("span", { hidden: true, id: `bcm-stepper__steps-${this._id}` }, h$1("slot", null)), h$1("main", null, h$1("header", { class: "bcm-stepper__header" }, items === null || items === void 0 ? void 0 : items.map((item, index) => [
|
|
21546
|
+
h$1(StepperHeaderTemplate, Object.assign({}, item, { stepChange: step => this.onStepChange(step) })),
|
|
21547
|
+
items.length > index + 1 && h$1("div", { class: lineClasses(item) }),
|
|
21548
|
+
])), h$1("section", { class: "bcm-stepper__body" }, this.data && this.data.length > 0 ? items === null || items === void 0 ? void 0 : items.map(item => h$1("bcm-step", Object.assign({}, item))) : h$1("slot", null)))));
|
|
21549
|
+
}
|
|
21550
|
+
get el() { return getElement(this); }
|
|
21551
|
+
static get watchers() { return {
|
|
21552
|
+
"data": ["dataChanged"]
|
|
21553
|
+
}; }
|
|
21554
|
+
};
|
|
21555
|
+
__decorate$2([
|
|
21556
|
+
IsLoad()
|
|
21557
|
+
], BcmStepper.prototype, "el", void 0);
|
|
21558
|
+
BcmStepper.style = stepperCss;
|
|
21559
|
+
|
|
21560
|
+
const textCss = "@import url(\"https://fonts.googleapis.com/css?family=Roboto:400,500\");@import url(\"https://fonts.googleapis.com/css2?family=Inter:wght@200;400;500;600&display=swap\"); .size-1{font-size:12px;line-height:20px}.size-2{font-size:14px;line-height:22px}.size-3{font-size:16px;line-height:24px}.size-4{font-size:20px;line-height:28px}.size-5{font-size:24px;line-height:32px}.size-6{font-size:30px;line-height:38px}.size-7{font-size:38px;line-height:46px}.size-8{font-size:46px;line-height:54px}.size-9{font-size:56px;line-height:64px}.weight-regular{font-weight:400}.weight-semibold{font-weight:500}.input-size-large{height:40px}.input-size-medium{height:32px}.input-size-small{height:24px}.resize-none textarea{resize:none}.resize-vertical textarea{resize:vertical}.resize-auto textarea{height:auto;resize:none}.textarea-size-large{padding:4px 0 0 4px;min-height:40px}.textarea-size-large .bcm-input-element{min-height:calc((40px - 8px) + 2px)}.textarea-size-large .input-clear-button{height:calc( 40px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-medium{padding:4px 0 0 4px;min-height:32px}.textarea-size-medium .bcm-input-element{min-height:calc((32px - 8px) + 2px)}.textarea-size-medium .input-clear-button{height:calc( 32px - 16px );top:8px;padding:0;margin-right:8px}.textarea-size-small{padding:0px 0 0 4px;min-height:24px}.textarea-size-small .bcm-input-element{min-height:calc((24px - 8px) + 2px)}.textarea-size-small .input-clear-button{height:calc( 24px - 16px );top:8px;padding:0;margin-right:8px}:root,::after,::before{--bcm-new-ds-color-inherit:inherit;--bcm-new-ds-color-current:currentColor;--bcm-new-ds-color-transparent:transparent;--bcm-new-ds-color-black:#000;--bcm-new-ds-color-white:#fff;--bcm-new-ds-color-slate:#64748b;--bcm-new-ds-color-slate-50:#f8fafc;--bcm-new-ds-color-slate-100:#f1f5f9;--bcm-new-ds-color-slate-200:#e2e8f0;--bcm-new-ds-color-slate-300:#cbd5e1;--bcm-new-ds-color-slate-400:#94a3b8;--bcm-new-ds-color-slate-500:#64748b;--bcm-new-ds-color-slate-600:#475569;--bcm-new-ds-color-slate-700:#334155;--bcm-new-ds-color-slate-800:#1e293b;--bcm-new-ds-color-slate-900:#0f172a;--bcm-new-ds-color-gray:#6b7280;--bcm-new-ds-color-gray-50:#f9fafb;--bcm-new-ds-color-gray-100:#f3f4f6;--bcm-new-ds-color-gray-200:#e5e7eb;--bcm-new-ds-color-gray-300:#d1d5db;--bcm-new-ds-color-gray-400:#9ca3af;--bcm-new-ds-color-gray-500:#6b7280;--bcm-new-ds-color-gray-600:#4b5563;--bcm-new-ds-color-gray-700:#374151;--bcm-new-ds-color-gray-800:#1f2937;--bcm-new-ds-color-gray-900:#111827;--bcm-new-ds-color-zinc:#71717a;--bcm-new-ds-color-zinc-50:#fafafa;--bcm-new-ds-color-zinc-100:#f4f4f5;--bcm-new-ds-color-zinc-200:#e4e4e7;--bcm-new-ds-color-zinc-300:#d4d4d8;--bcm-new-ds-color-zinc-400:#a1a1aa;--bcm-new-ds-color-zinc-500:#71717a;--bcm-new-ds-color-zinc-600:#52525b;--bcm-new-ds-color-zinc-700:#3f3f46;--bcm-new-ds-color-zinc-800:#27272a;--bcm-new-ds-color-zinc-900:#18181b;--bcm-new-ds-color-neutral:#737373;--bcm-new-ds-color-neutral-50:#fafafa;--bcm-new-ds-color-neutral-100:#f5f5f5;--bcm-new-ds-color-neutral-200:#e5e5e5;--bcm-new-ds-color-neutral-300:#d4d4d4;--bcm-new-ds-color-neutral-400:#a3a3a3;--bcm-new-ds-color-neutral-500:#737373;--bcm-new-ds-color-neutral-600:#525252;--bcm-new-ds-color-neutral-700:#404040;--bcm-new-ds-color-neutral-800:#262626;--bcm-new-ds-color-neutral-900:#171717;--bcm-new-ds-color-stone:#78716c;--bcm-new-ds-color-stone-50:#fafaf9;--bcm-new-ds-color-stone-100:#f5f5f4;--bcm-new-ds-color-stone-200:#e7e5e4;--bcm-new-ds-color-stone-300:#d6d3d1;--bcm-new-ds-color-stone-400:#a8a29e;--bcm-new-ds-color-stone-500:#78716c;--bcm-new-ds-color-stone-600:#57534e;--bcm-new-ds-color-stone-700:#44403c;--bcm-new-ds-color-stone-800:#292524;--bcm-new-ds-color-stone-900:#1c1917;--bcm-new-ds-color-red:#ef4444;--bcm-new-ds-color-red-50:#fef2f2;--bcm-new-ds-color-red-100:#fee2e2;--bcm-new-ds-color-red-200:#fecaca;--bcm-new-ds-color-red-300:#fca5a5;--bcm-new-ds-color-red-400:#f87171;--bcm-new-ds-color-red-500:#ef4444;--bcm-new-ds-color-red-600:#dc2626;--bcm-new-ds-color-red-700:#b91c1c;--bcm-new-ds-color-red-800:#991b1b;--bcm-new-ds-color-red-900:#7f1d1d;--bcm-new-ds-color-orange:#f97316;--bcm-new-ds-color-orange-50:#fff7ed;--bcm-new-ds-color-orange-100:#ffedd5;--bcm-new-ds-color-orange-200:#fed7aa;--bcm-new-ds-color-orange-300:#fdba74;--bcm-new-ds-color-orange-400:#fb923c;--bcm-new-ds-color-orange-500:#f97316;--bcm-new-ds-color-orange-600:#ea580c;--bcm-new-ds-color-orange-700:#c2410c;--bcm-new-ds-color-orange-800:#9a3412;--bcm-new-ds-color-orange-900:#7c2d12;--bcm-new-ds-color-amber:#f59e0b;--bcm-new-ds-color-amber-50:#fffbeb;--bcm-new-ds-color-amber-100:#fef3c7;--bcm-new-ds-color-amber-200:#fde68a;--bcm-new-ds-color-amber-300:#fcd34d;--bcm-new-ds-color-amber-400:#fbbf24;--bcm-new-ds-color-amber-500:#f59e0b;--bcm-new-ds-color-amber-600:#d97706;--bcm-new-ds-color-amber-700:#b45309;--bcm-new-ds-color-amber-800:#92400e;--bcm-new-ds-color-amber-900:#78350f;--bcm-new-ds-color-yellow:#eab308;--bcm-new-ds-color-yellow-50:#fefce8;--bcm-new-ds-color-yellow-100:#fef9c3;--bcm-new-ds-color-yellow-200:#fef08a;--bcm-new-ds-color-yellow-300:#fde047;--bcm-new-ds-color-yellow-400:#facc15;--bcm-new-ds-color-yellow-500:#eab308;--bcm-new-ds-color-yellow-600:#ca8a04;--bcm-new-ds-color-yellow-700:#a16207;--bcm-new-ds-color-yellow-800:#854d0e;--bcm-new-ds-color-yellow-900:#713f12;--bcm-new-ds-color-lime:#84cc16;--bcm-new-ds-color-lime-50:#f7fee7;--bcm-new-ds-color-lime-100:#ecfccb;--bcm-new-ds-color-lime-200:#d9f99d;--bcm-new-ds-color-lime-300:#bef264;--bcm-new-ds-color-lime-400:#a3e635;--bcm-new-ds-color-lime-500:#84cc16;--bcm-new-ds-color-lime-600:#65a30d;--bcm-new-ds-color-lime-700:#4d7c0f;--bcm-new-ds-color-lime-800:#3f6212;--bcm-new-ds-color-lime-900:#365314;--bcm-new-ds-color-green:#22c55e;--bcm-new-ds-color-green-50:#f0fdf4;--bcm-new-ds-color-green-100:#dcfce7;--bcm-new-ds-color-green-200:#bbf7d0;--bcm-new-ds-color-green-300:#86efac;--bcm-new-ds-color-green-400:#4ade80;--bcm-new-ds-color-green-500:#22c55e;--bcm-new-ds-color-green-600:#16a34a;--bcm-new-ds-color-green-700:#15803d;--bcm-new-ds-color-green-800:#166534;--bcm-new-ds-color-green-900:#14532d;--bcm-new-ds-color-emerald:#10b981;--bcm-new-ds-color-emerald-50:#ecfdf5;--bcm-new-ds-color-emerald-100:#d1fae5;--bcm-new-ds-color-emerald-200:#a7f3d0;--bcm-new-ds-color-emerald-300:#6ee7b7;--bcm-new-ds-color-emerald-400:#34d399;--bcm-new-ds-color-emerald-500:#10b981;--bcm-new-ds-color-emerald-600:#059669;--bcm-new-ds-color-emerald-700:#047857;--bcm-new-ds-color-emerald-800:#065f46;--bcm-new-ds-color-emerald-900:#064e3b;--bcm-new-ds-color-teal:#14b8a6;--bcm-new-ds-color-teal-50:#f0fdfa;--bcm-new-ds-color-teal-100:#ccfbf1;--bcm-new-ds-color-teal-200:#99f6e4;--bcm-new-ds-color-teal-300:#5eead4;--bcm-new-ds-color-teal-400:#2dd4bf;--bcm-new-ds-color-teal-500:#14b8a6;--bcm-new-ds-color-teal-600:#0d9488;--bcm-new-ds-color-teal-700:#0f766e;--bcm-new-ds-color-teal-800:#115e59;--bcm-new-ds-color-teal-900:#134e4a;--bcm-new-ds-color-cyan:#06b6d4;--bcm-new-ds-color-cyan-50:#ecfeff;--bcm-new-ds-color-cyan-100:#cffafe;--bcm-new-ds-color-cyan-200:#a5f3fc;--bcm-new-ds-color-cyan-300:#67e8f9;--bcm-new-ds-color-cyan-400:#22d3ee;--bcm-new-ds-color-cyan-500:#06b6d4;--bcm-new-ds-color-cyan-600:#0891b2;--bcm-new-ds-color-cyan-700:#0e7490;--bcm-new-ds-color-cyan-800:#155e75;--bcm-new-ds-color-cyan-900:#164e63;--bcm-new-ds-color-sky:#0ea5e9;--bcm-new-ds-color-sky-50:#f0f9ff;--bcm-new-ds-color-sky-100:#e0f2fe;--bcm-new-ds-color-sky-200:#bae6fd;--bcm-new-ds-color-sky-300:#7dd3fc;--bcm-new-ds-color-sky-400:#38bdf8;--bcm-new-ds-color-sky-500:#0ea5e9;--bcm-new-ds-color-sky-600:#0284c7;--bcm-new-ds-color-sky-700:#0369a1;--bcm-new-ds-color-sky-800:#075985;--bcm-new-ds-color-sky-900:#0c4a6e;--bcm-new-ds-color-blue:#3b82f6;--bcm-new-ds-color-blue-50:#eff6ff;--bcm-new-ds-color-blue-100:#dbeafe;--bcm-new-ds-color-blue-200:#bfdbfe;--bcm-new-ds-color-blue-300:#93c5fd;--bcm-new-ds-color-blue-400:#60a5fa;--bcm-new-ds-color-blue-500:#3b82f6;--bcm-new-ds-color-blue-600:#2563eb;--bcm-new-ds-color-blue-700:#1d4ed8;--bcm-new-ds-color-blue-800:#1e40af;--bcm-new-ds-color-blue-900:#1e3a8a;--bcm-new-ds-color-indigo:#6366f1;--bcm-new-ds-color-indigo-50:#eef2ff;--bcm-new-ds-color-indigo-100:#e0e7ff;--bcm-new-ds-color-indigo-200:#c7d2fe;--bcm-new-ds-color-indigo-300:#a5b4fc;--bcm-new-ds-color-indigo-400:#818cf8;--bcm-new-ds-color-indigo-500:#6366f1;--bcm-new-ds-color-indigo-600:#4f46e5;--bcm-new-ds-color-indigo-700:#4338ca;--bcm-new-ds-color-indigo-800:#3730a3;--bcm-new-ds-color-indigo-900:#312e81;--bcm-new-ds-color-violet:#8b5cf6;--bcm-new-ds-color-violet-50:#f5f3ff;--bcm-new-ds-color-violet-100:#ede9fe;--bcm-new-ds-color-violet-200:#ddd6fe;--bcm-new-ds-color-violet-300:#c4b5fd;--bcm-new-ds-color-violet-400:#a78bfa;--bcm-new-ds-color-violet-500:#8b5cf6;--bcm-new-ds-color-violet-600:#7c3aed;--bcm-new-ds-color-violet-700:#6d28d9;--bcm-new-ds-color-violet-800:#5b21b6;--bcm-new-ds-color-violet-900:#4c1d95;--bcm-new-ds-color-purple:#a855f7;--bcm-new-ds-color-purple-50:#faf5ff;--bcm-new-ds-color-purple-100:#f3e8ff;--bcm-new-ds-color-purple-200:#e9d5ff;--bcm-new-ds-color-purple-300:#d8b4fe;--bcm-new-ds-color-purple-400:#c084fc;--bcm-new-ds-color-purple-500:#a855f7;--bcm-new-ds-color-purple-600:#9333ea;--bcm-new-ds-color-purple-700:#7e22ce;--bcm-new-ds-color-purple-800:#6b21a8;--bcm-new-ds-color-purple-900:#581c87;--bcm-new-ds-color-fuchsia:#d946ef;--bcm-new-ds-color-fuchsia-50:#fdf4ff;--bcm-new-ds-color-fuchsia-100:#fae8ff;--bcm-new-ds-color-fuchsia-200:#f5d0fe;--bcm-new-ds-color-fuchsia-300:#f0abfc;--bcm-new-ds-color-fuchsia-400:#e879f9;--bcm-new-ds-color-fuchsia-500:#d946ef;--bcm-new-ds-color-fuchsia-600:#c026d3;--bcm-new-ds-color-fuchsia-700:#a21caf;--bcm-new-ds-color-fuchsia-800:#86198f;--bcm-new-ds-color-fuchsia-900:#701a75;--bcm-new-ds-color-pink:#ec4899;--bcm-new-ds-color-pink-50:#fdf2f8;--bcm-new-ds-color-pink-100:#fce7f3;--bcm-new-ds-color-pink-200:#fbcfe8;--bcm-new-ds-color-pink-300:#f9a8d4;--bcm-new-ds-color-pink-400:#f472b6;--bcm-new-ds-color-pink-500:#ec4899;--bcm-new-ds-color-pink-600:#db2777;--bcm-new-ds-color-pink-700:#be185d;--bcm-new-ds-color-pink-800:#9d174d;--bcm-new-ds-color-pink-900:#831843;--bcm-new-ds-color-rose:#f43f5e;--bcm-new-ds-color-rose-50:#fff1f2;--bcm-new-ds-color-rose-100:#ffe4e6;--bcm-new-ds-color-rose-200:#fecdd3;--bcm-new-ds-color-rose-300:#fda4af;--bcm-new-ds-color-rose-400:#fb7185;--bcm-new-ds-color-rose-500:#f43f5e;--bcm-new-ds-color-rose-600:#e11d48;--bcm-new-ds-color-rose-700:#be123c;--bcm-new-ds-color-rose-800:#9f1239;--bcm-new-ds-color-rose-900:#881337}*{box-sizing:border-box}.bcm-text{display:inline;font-family:\"Inter\", sans-serif;font-size:14px;line-height:calc(14px + 8px);font-weight:400}.bcm-text.hidden{display:none}.bcm-text__paragraph{margin:0;padding:0}.bcm-text__font-size-1{font-size:10px;line-height:calc(10px + 8px)}.bcm-text__font-size-2{font-size:12px;line-height:calc(12px + 8px)}.bcm-text__font-size-3{font-size:14px;line-height:calc(14px + 8px)}.bcm-text__font-size-4{font-size:16px;line-height:calc(16px + 8px)}.bcm-text__font-size-5{font-size:18px;line-height:calc(18px + 8px)}.bcm-text__font-size-6{font-size:20px;line-height:calc(20px + 8px)}.bcm-text__font-size-7{font-size:24px;line-height:calc(24px + 8px)}.bcm-text__font-size-8{font-size:32px;line-height:calc(32px + 8px)}.bcm-text__font-size-9{font-size:40px;line-height:calc(40px + 8px)}";
|
|
21561
|
+
|
|
21562
|
+
var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
21563
|
+
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
21564
|
+
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
21565
|
+
r = Reflect.decorate(decorators, target, key, desc);
|
|
21566
|
+
else
|
|
21567
|
+
for (var i = decorators.length - 1; i >= 0; i--)
|
|
21568
|
+
if (d = decorators[i])
|
|
21569
|
+
r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
21570
|
+
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
21571
|
+
};
|
|
21572
|
+
const BcmText = class {
|
|
21573
|
+
constructor(hostRef) {
|
|
21574
|
+
registerInstance(this, hostRef);
|
|
21575
|
+
this.hidden = false;
|
|
21576
|
+
this.scale = undefined;
|
|
21577
|
+
this.weight = "400";
|
|
21578
|
+
this.color = "slate";
|
|
21579
|
+
this.text = undefined;
|
|
21580
|
+
this.fontSize = 4;
|
|
21581
|
+
}
|
|
21582
|
+
render() {
|
|
21583
|
+
const { hidden, scale, weight, color, fontSize } = this;
|
|
21584
|
+
const hostClasses = classnames('bcm-text', {
|
|
21585
|
+
hidden
|
|
21586
|
+
});
|
|
21587
|
+
const classes = classnames('bcm-text__paragraph', `bcm-text__font-size-${fontSize}`, scale);
|
|
21588
|
+
const fontWeight = +weight || 400;
|
|
21589
|
+
const style = {
|
|
21590
|
+
color: ColorHelper.dsColor(color),
|
|
21591
|
+
fontWeight
|
|
21592
|
+
};
|
|
21593
|
+
return (h$1(Host, { class: hostClasses }, h$1("span", { hidden: true }, h$1("slot", null)), h$1("p", { class: classes, style: Object.assign({}, style) }, h$1(SlotTemplate, { value: this.text }))));
|
|
21594
|
+
}
|
|
21595
|
+
get el() { return getElement(this); }
|
|
19355
21596
|
};
|
|
19356
21597
|
__decorate$1([
|
|
19357
21598
|
IsLoad()
|
|
19358
|
-
],
|
|
21599
|
+
], BcmText.prototype, "el", void 0);
|
|
21600
|
+
BcmText.style = textCss;
|
|
19359
21601
|
|
|
19360
21602
|
var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
19361
21603
|
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
@@ -19438,4 +21680,4 @@ __decorate([
|
|
|
19438
21680
|
IsLoad()
|
|
19439
21681
|
], BcmTooltip.prototype, "el", void 0);
|
|
19440
21682
|
|
|
19441
|
-
export { BcmButton as bcm_button, BcmColorful as bcm_colorful, BcmForm as bcm_form, BcmIcon as bcm_icon, BcmInput as bcm_input, BcmLabel as bcm_label, BcmLinked as bcm_linked,
|
|
21683
|
+
export { BcmButton as bcm_button, BcmColorful as bcm_colorful, BcmForm as bcm_form, BcmIcon as bcm_icon, BcmInput as bcm_input, BcmLabel as bcm_label, BcmLinked as bcm_linked, BcmList as bcm_list, BcmSearch as bcm_search, BcmStep as bcm_step, BcmStepper as bcm_stepper, BcmText as bcm_text, BcmTooltip as bcm_tooltip };
|