bromcom-ui 2.8.0-rc.1 → 2.8.0-rc.2
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-89a9e8e3.entry.js → p-00269ca7.entry.js} +1 -1
- package/dist/bromcom-ui/{p-0ae31364.entry.js → p-0041bd28.entry.js} +1 -1
- package/dist/bromcom-ui/{p-98c9ac37.entry.js → p-007bec47.entry.js} +1 -1
- package/dist/bromcom-ui/{p-3a093f9e.entry.js → p-036f3880.entry.js} +1 -1
- package/dist/bromcom-ui/{p-8fa7cdf0.entry.js → p-0626d065.entry.js} +1 -1
- package/dist/bromcom-ui/p-13082089.entry.js +5 -0
- package/dist/bromcom-ui/{p-2a57c8c7.entry.js → p-13337304.entry.js} +1 -1
- package/dist/bromcom-ui/p-19cba40f.js +5 -0
- package/dist/bromcom-ui/{p-3d8802d9.entry.js → p-1e328bbb.entry.js} +1 -1
- package/dist/bromcom-ui/{p-3ccc9177.entry.js → p-30070e50.entry.js} +1 -1
- package/dist/bromcom-ui/p-3407de8c.entry.js +5 -0
- package/dist/bromcom-ui/{p-ffb57c2c.entry.js → p-35e357fb.entry.js} +1 -1
- package/dist/bromcom-ui/{p-2eaf7068.entry.js → p-400f7245.entry.js} +1 -1
- package/dist/bromcom-ui/{p-970a4dd6.entry.js → p-445a227f.entry.js} +1 -1
- package/dist/bromcom-ui/{p-79a1c167.js → p-4bbba8b4.js} +1 -1
- package/dist/bromcom-ui/{p-58815bb1.entry.js → p-57185ca0.entry.js} +1 -1
- package/dist/bromcom-ui/{p-4185987d.entry.js → p-5948de7f.entry.js} +1 -1
- package/dist/bromcom-ui/{p-afa908e9.entry.js → p-5a26b9b8.entry.js} +1 -1
- package/dist/bromcom-ui/{p-07b62dab.entry.js → p-5bad0d7b.entry.js} +1 -1
- package/dist/bromcom-ui/{p-80fdd63f.entry.js → p-6530b216.entry.js} +1 -1
- package/dist/bromcom-ui/{p-178fb088.entry.js → p-67659c20.entry.js} +1 -1
- package/dist/bromcom-ui/{p-65fbabc8.entry.js → p-6bd60d81.entry.js} +1 -1
- package/dist/bromcom-ui/{p-b175a1e1.entry.js → p-6bfece08.entry.js} +1 -1
- package/dist/bromcom-ui/{p-bd2d9941.entry.js → p-6c288e79.entry.js} +1 -1
- package/dist/bromcom-ui/{p-ceace9c7.entry.js → p-6c7b218c.entry.js} +1 -1
- package/dist/bromcom-ui/{p-34a59d30.js → p-7124553b.js} +1 -1
- package/dist/bromcom-ui/{p-410c74f6.js → p-7b153da4.js} +1 -1
- package/dist/bromcom-ui/{p-b5531d54.entry.js → p-82031406.entry.js} +1 -1
- package/dist/bromcom-ui/{p-1faaac85.entry.js → p-843c229b.entry.js} +1 -1
- package/dist/bromcom-ui/{p-e30c5251.entry.js → p-8c9d67ad.entry.js} +1 -1
- package/dist/bromcom-ui/{p-6baf6ea4.entry.js → p-8ced5b81.entry.js} +1 -1
- package/dist/bromcom-ui/{p-d39369ff.entry.js → p-935fdf64.entry.js} +1 -1
- package/dist/bromcom-ui/{p-a5abe2d6.entry.js → p-9490e993.entry.js} +1 -1
- package/dist/bromcom-ui/{p-56a5396d.js → p-a366b934.js} +1 -1
- package/dist/bromcom-ui/{p-3e45d00d.entry.js → p-a3a346fc.entry.js} +1 -1
- package/dist/bromcom-ui/{p-c718f29a.js → p-a82bcbd4.js} +1 -1
- package/dist/bromcom-ui/{p-ef6e4107.entry.js → p-aa59b8d1.entry.js} +1 -1
- package/dist/bromcom-ui/{p-a452bb5e.entry.js → p-b0d84958.entry.js} +1 -1
- package/dist/bromcom-ui/{p-94da7678.entry.js → p-b3003060.entry.js} +1 -1
- package/dist/bromcom-ui/{p-e3d32c37.entry.js → p-c012565a.entry.js} +1 -1
- package/dist/bromcom-ui/p-c092fafd.entry.js +11 -0
- package/dist/bromcom-ui/{p-7eb09daf.entry.js → p-cf24655f.entry.js} +1 -1
- package/dist/bromcom-ui/{p-524ab0fc.entry.js → p-d9bd56ef.entry.js} +1 -1
- package/dist/bromcom-ui/{p-c3238361.entry.js → p-dc3d9f76.entry.js} +1 -1
- package/dist/bromcom-ui/{p-ba8d8c03.entry.js → p-e38344ed.entry.js} +1 -1
- package/dist/bromcom-ui/{p-889553d3.entry.js → p-e842eb54.entry.js} +1 -1
- package/dist/bromcom-ui/{p-e9295fec.entry.js → p-ed04ae18.entry.js} +1 -1
- package/dist/bromcom-ui/{p-17bafd84.entry.js → p-efd4bae1.entry.js} +1 -1
- package/dist/bromcom-ui/{p-8cc29a92.entry.js → p-f0877724.entry.js} +1 -1
- package/dist/bromcom-ui/{p-5cd30376.entry.js → p-f4c08ca4.entry.js} +1 -1
- package/dist/bromcom-ui/{p-701cf04e.entry.js → p-f4d15784.entry.js} +1 -1
- package/dist/bromcom-ui/{p-7eb8c46e.js → p-f4d6590d.js} +1 -1
- package/dist/bromcom-ui/{p-d236a84f.entry.js → p-ff78d3f1.entry.js} +1 -1
- package/dist/cjs/bcm-accordion.cjs.entry.js +1 -1
- package/dist/cjs/bcm-alert.cjs.entry.js +1 -1
- package/dist/cjs/bcm-attendance.cjs.entry.js +1 -1
- package/dist/cjs/bcm-avatar_2.cjs.entry.js +3 -3
- package/dist/cjs/bcm-breadcrumb.cjs.entry.js +1 -1
- package/dist/cjs/bcm-button-group.cjs.entry.js +1 -1
- package/dist/cjs/{bcm-colorful_2.cjs.entry.js → bcm-button_10.cjs.entry.js} +1533 -19
- package/dist/cjs/bcm-card.cjs.entry.js +1 -1
- package/dist/cjs/bcm-checkbox-group.cjs.entry.js +17 -17
- package/dist/cjs/bcm-checkbox-lite_9.cjs.entry.js +1 -1
- package/dist/cjs/bcm-checkbox_2.cjs.entry.js +1 -1
- package/dist/cjs/bcm-chip.cjs.entry.js +1 -1
- package/dist/cjs/bcm-collapse.cjs.entry.js +1 -1
- package/dist/cjs/bcm-color-input.cjs.entry.js +3 -3
- package/dist/cjs/bcm-date-picker.cjs.entry.js +1 -1
- package/dist/cjs/bcm-datetime-picker.cjs.entry.js +1 -1
- package/dist/cjs/bcm-default.cjs.entry.js +1 -1
- package/dist/cjs/bcm-drawer.cjs.entry.js +3 -3
- package/dist/cjs/bcm-dropdown.cjs.entry.js +2 -2
- package/dist/cjs/bcm-expansion-panel.cjs.entry.js +1 -1
- package/dist/cjs/bcm-form-2.cjs.entry.js +1 -1
- package/dist/cjs/bcm-input-custom.cjs.entry.js +1 -1
- package/dist/cjs/bcm-item.cjs.entry.js +1 -1
- package/dist/cjs/bcm-items.cjs.entry.js +1 -1
- package/dist/cjs/bcm-list.cjs.entry.js +5 -5
- package/dist/cjs/bcm-menu.cjs.entry.js +4 -4
- package/dist/cjs/bcm-modal.cjs.entry.js +1 -1
- package/dist/cjs/bcm-popconfirm-box.cjs.entry.js +1 -1
- package/dist/cjs/bcm-popconfirm.cjs.entry.js +1 -1
- package/dist/cjs/bcm-popover.cjs.entry.js +3 -3
- package/dist/cjs/bcm-progress.cjs.entry.js +1 -1
- package/dist/cjs/bcm-range.cjs.entry.js +1 -1
- package/dist/cjs/bcm-search.cjs.entry.js +2 -2
- package/dist/cjs/bcm-skeleton.cjs.entry.js +1 -1
- package/dist/cjs/bcm-step.cjs.entry.js +2 -2
- package/dist/cjs/bcm-stepper.cjs.entry.js +4 -4
- package/dist/cjs/bcm-switch.cjs.entry.js +1 -1
- package/dist/cjs/bcm-tab-group.cjs.entry.js +3 -3
- package/dist/cjs/bcm-tab-item-header.cjs.entry.js +3 -3
- package/dist/cjs/bcm-tab-item.cjs.entry.js +3 -3
- package/dist/cjs/bcm-tag.cjs.entry.js +2 -2
- package/dist/cjs/bcm-textarea.cjs.entry.js +2 -2
- package/dist/cjs/bcm-time-picker.cjs.entry.js +1 -1
- package/dist/cjs/bcm-toast.cjs.entry.js +115 -0
- package/dist/cjs/bromcom-ui.cjs.js +1 -1
- package/dist/cjs/{generate-b2779357.js → generate-e2397ffa.js} +1 -1
- package/dist/cjs/{input-template-ef0dff49.js → input-template-2bdd0688.js} +1 -1
- package/dist/cjs/{json-parse-decarator-6daa901d.js → json-parse-decarator-fe468734.js} +1 -1
- package/dist/cjs/loader.cjs.js +1 -1
- package/dist/cjs/{number-helper-c0a3073d.js → number-helper-aac9b592.js} +1 -1
- package/dist/cjs/old-bcm-popover-box.cjs.entry.js +2 -2
- package/dist/cjs/old-bcm-popover.cjs.entry.js +1 -1
- package/dist/cjs/{stepper-states-7458308e.js → stepper-states-5aa9bb64.js} +1 -1
- package/dist/cjs/{tooltip-helper-d4c09d59.js → tooltip-helper-18b3deae.js} +3 -3
- package/dist/cjs/{validators-9db90679.js → validators-5c4ee18b.js} +1 -1
- package/dist/collection/components/molecules/radio/radio-group.js +27 -6
- package/dist/components/bcm-radio-group.js +21 -4
- package/dist/components/generate.js +1 -1
- package/dist/esm/bcm-accordion.entry.js +1 -1
- package/dist/esm/bcm-alert.entry.js +1 -1
- package/dist/esm/bcm-attendance.entry.js +1 -1
- package/dist/esm/bcm-avatar_2.entry.js +3 -3
- package/dist/esm/bcm-breadcrumb.entry.js +1 -1
- package/dist/esm/bcm-button-group.entry.js +1 -1
- package/dist/esm/{bcm-colorful_2.entry.js → bcm-button_10.entry.js} +1521 -15
- package/dist/esm/bcm-card.entry.js +1 -1
- package/dist/esm/bcm-checkbox-group.entry.js +7 -7
- package/dist/esm/bcm-checkbox-lite_9.entry.js +1 -1
- package/dist/esm/bcm-checkbox_2.entry.js +1 -1
- package/dist/esm/bcm-chip.entry.js +1 -1
- package/dist/esm/bcm-collapse.entry.js +1 -1
- package/dist/esm/bcm-color-input.entry.js +3 -3
- package/dist/esm/bcm-date-picker.entry.js +1 -1
- package/dist/esm/bcm-datetime-picker.entry.js +1 -1
- package/dist/esm/bcm-default.entry.js +1 -1
- package/dist/esm/bcm-drawer.entry.js +3 -3
- package/dist/esm/bcm-dropdown.entry.js +2 -2
- package/dist/esm/bcm-expansion-panel.entry.js +1 -1
- package/dist/esm/bcm-form-2.entry.js +1 -1
- package/dist/esm/bcm-input-custom.entry.js +1 -1
- package/dist/esm/bcm-item.entry.js +1 -1
- package/dist/esm/bcm-items.entry.js +1 -1
- package/dist/esm/bcm-list.entry.js +5 -5
- package/dist/esm/bcm-menu.entry.js +4 -4
- package/dist/esm/bcm-modal.entry.js +1 -1
- package/dist/esm/bcm-popconfirm-box.entry.js +1 -1
- package/dist/esm/bcm-popconfirm.entry.js +1 -1
- package/dist/esm/bcm-popover.entry.js +3 -3
- package/dist/esm/bcm-progress.entry.js +1 -1
- package/dist/esm/bcm-range.entry.js +1 -1
- package/dist/esm/bcm-search.entry.js +2 -2
- package/dist/esm/bcm-skeleton.entry.js +1 -1
- package/dist/esm/bcm-step.entry.js +2 -2
- package/dist/esm/bcm-stepper.entry.js +4 -4
- package/dist/esm/bcm-switch.entry.js +1 -1
- package/dist/esm/bcm-tab-group.entry.js +3 -3
- package/dist/esm/bcm-tab-item-header.entry.js +3 -3
- package/dist/esm/bcm-tab-item.entry.js +3 -3
- package/dist/esm/bcm-tag.entry.js +2 -2
- package/dist/esm/bcm-textarea.entry.js +2 -2
- package/dist/esm/bcm-time-picker.entry.js +1 -1
- package/dist/esm/bcm-toast.entry.js +111 -0
- package/dist/esm/bromcom-ui.js +1 -1
- package/dist/esm/{generate-fbf3c64b.js → generate-82c3ee1f.js} +1 -1
- package/dist/esm/{input-template-f5b003c0.js → input-template-9a5da65a.js} +1 -1
- package/dist/esm/{json-parse-decarator-f023562b.js → json-parse-decarator-aba7d121.js} +1 -1
- package/dist/esm/loader.js +1 -1
- package/dist/esm/{number-helper-b69dc985.js → number-helper-d4126c02.js} +1 -1
- package/dist/esm/old-bcm-popover-box.entry.js +2 -2
- package/dist/esm/old-bcm-popover.entry.js +1 -1
- package/dist/esm/{stepper-states-7087f0cb.js → stepper-states-3b8d6edd.js} +1 -1
- package/dist/esm/{tooltip-helper-31ca799b.js → tooltip-helper-e7eb577d.js} +3 -3
- package/dist/esm/{validators-d3c37e80.js → validators-2a89d009.js} +1 -1
- package/dist/types/components/molecules/radio/radio-group.d.ts +3 -0
- package/package.json +1 -1
- package/dist/bromcom-ui/p-168d2632.entry.js +0 -5
- package/dist/bromcom-ui/p-1a0900cc.entry.js +0 -10
- package/dist/bromcom-ui/p-4a123037.entry.js +0 -5
- package/dist/bromcom-ui/p-51deaab5.entry.js +0 -5
- package/dist/bromcom-ui/p-6ea775e8.entry.js +0 -5
- package/dist/bromcom-ui/p-70c794df.js +0 -5
- package/dist/bromcom-ui/p-967df53d.entry.js +0 -5
- package/dist/bromcom-ui/p-e2e7d808.entry.js +0 -5
- package/dist/bromcom-ui/p-e422fc70.entry.js +0 -5
- package/dist/bromcom-ui/p-f881a6b8.entry.js +0 -5
- package/dist/cjs/bcm-button_2.cjs.entry.js +0 -482
- package/dist/cjs/bcm-form.cjs.entry.js +0 -487
- package/dist/cjs/bcm-icon.cjs.entry.js +0 -41
- package/dist/cjs/bcm-input.cjs.entry.js +0 -369
- package/dist/cjs/bcm-label_2.cjs.entry.js +0 -149
- package/dist/cjs/bcm-radio-group.cjs.entry.js +0 -143
- package/dist/cjs/bcm-radio.cjs.entry.js +0 -64
- package/dist/esm/bcm-button_2.entry.js +0 -477
- package/dist/esm/bcm-form.entry.js +0 -483
- package/dist/esm/bcm-icon.entry.js +0 -37
- package/dist/esm/bcm-input.entry.js +0 -365
- package/dist/esm/bcm-label_2.entry.js +0 -144
- package/dist/esm/bcm-radio-group.entry.js +0 -139
- package/dist/esm/bcm-radio.entry.js +0 -60
|
@@ -1,477 +0,0 @@
|
|
|
1
|
-
/*!
|
|
2
|
-
* Built with Stencil
|
|
3
|
-
* Copyright (c) Bromcom.
|
|
4
|
-
*/
|
|
5
|
-
import { h, 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-fbf3c64b.js';
|
|
7
|
-
import { B as Bcm } from './bcm-9f50af9c.js';
|
|
8
|
-
import { c as classnames } from './index-ba2edd32.js';
|
|
9
|
-
import { c as createStore } from './index-8b349654.js';
|
|
10
|
-
import { S as SlotTemplate } from './slot-template-64b41ee5.js';
|
|
11
|
-
import { C as ColorHelper } from './color-helper-2b6697b6.js';
|
|
12
|
-
import { I as IsLoad } from './is-load-decorator-66e19e04.js';
|
|
13
|
-
import { S as StringHelper } from './string-helper-0fb7ff20.js';
|
|
14
|
-
import { d as delay } from './utils-57652744.js';
|
|
15
|
-
import './colors-39b87f63.js';
|
|
16
|
-
import './_commonjsHelpers-3016b722.js';
|
|
17
|
-
import './colors-1d7854ea.js';
|
|
18
|
-
|
|
19
|
-
const variantOptions = {
|
|
20
|
-
save: {
|
|
21
|
-
text: 'Save',
|
|
22
|
-
color: 'emerald',
|
|
23
|
-
icon: 'far fa-save',
|
|
24
|
-
iconPosition: 'prefix',
|
|
25
|
-
},
|
|
26
|
-
ok: {
|
|
27
|
-
text: 'Ok',
|
|
28
|
-
color: 'emerald',
|
|
29
|
-
icon: 'far fa-check',
|
|
30
|
-
iconPosition: 'prefix',
|
|
31
|
-
},
|
|
32
|
-
new: {
|
|
33
|
-
text: 'New',
|
|
34
|
-
color: 'emerald',
|
|
35
|
-
icon: 'far fa-plus',
|
|
36
|
-
iconPosition: 'prefix',
|
|
37
|
-
},
|
|
38
|
-
add: {
|
|
39
|
-
text: 'Add',
|
|
40
|
-
color: 'emerald',
|
|
41
|
-
icon: 'far fa-plus',
|
|
42
|
-
iconPosition: 'prefix',
|
|
43
|
-
},
|
|
44
|
-
create: {
|
|
45
|
-
text: 'Create',
|
|
46
|
-
color: 'emerald',
|
|
47
|
-
icon: 'far fa-plus',
|
|
48
|
-
iconPosition: 'prefix',
|
|
49
|
-
},
|
|
50
|
-
prev: {
|
|
51
|
-
text: 'Prev',
|
|
52
|
-
color: '',
|
|
53
|
-
icon: 'far fa-arrow-left',
|
|
54
|
-
iconPosition: 'prefix',
|
|
55
|
-
},
|
|
56
|
-
next: {
|
|
57
|
-
text: 'Next',
|
|
58
|
-
color: '',
|
|
59
|
-
icon: 'far fa-arrow-right',
|
|
60
|
-
iconPosition: 'suffix',
|
|
61
|
-
},
|
|
62
|
-
apply: {
|
|
63
|
-
text: 'Apply',
|
|
64
|
-
color: '',
|
|
65
|
-
icon: 'far fa-check-circle',
|
|
66
|
-
iconPosition: 'prefix',
|
|
67
|
-
},
|
|
68
|
-
submit: {
|
|
69
|
-
text: 'Submit',
|
|
70
|
-
color: '',
|
|
71
|
-
icon: 'far fa-save',
|
|
72
|
-
iconPosition: 'prefix',
|
|
73
|
-
},
|
|
74
|
-
send: {
|
|
75
|
-
text: 'Send',
|
|
76
|
-
color: 'emerald',
|
|
77
|
-
icon: 'far fa-paper-plane',
|
|
78
|
-
iconPosition: 'prefix',
|
|
79
|
-
},
|
|
80
|
-
delete: {
|
|
81
|
-
text: 'Delete',
|
|
82
|
-
color: 'red',
|
|
83
|
-
icon: 'far fa-trash',
|
|
84
|
-
iconPosition: 'prefix',
|
|
85
|
-
},
|
|
86
|
-
cancel: {
|
|
87
|
-
text: 'Cancel',
|
|
88
|
-
color: 'red',
|
|
89
|
-
icon: 'far fa-times',
|
|
90
|
-
iconPosition: 'prefix',
|
|
91
|
-
},
|
|
92
|
-
decline: {
|
|
93
|
-
text: 'Decline',
|
|
94
|
-
color: 'red',
|
|
95
|
-
icon: 'far fa-ban',
|
|
96
|
-
iconPosition: 'prefix',
|
|
97
|
-
},
|
|
98
|
-
close: {
|
|
99
|
-
text: 'Close',
|
|
100
|
-
color: 'red',
|
|
101
|
-
icon: 'far fa-times-circle',
|
|
102
|
-
iconPosition: 'prefix',
|
|
103
|
-
},
|
|
104
|
-
archive: {
|
|
105
|
-
text: 'Archive',
|
|
106
|
-
color: 'red',
|
|
107
|
-
icon: 'far fa-folder-open',
|
|
108
|
-
iconPosition: 'prefix',
|
|
109
|
-
},
|
|
110
|
-
remove: {
|
|
111
|
-
text: 'Remove',
|
|
112
|
-
color: 'red',
|
|
113
|
-
icon: 'far fa-minus-circle',
|
|
114
|
-
iconPosition: 'prefix',
|
|
115
|
-
},
|
|
116
|
-
edit: {
|
|
117
|
-
text: 'Edit',
|
|
118
|
-
color: '',
|
|
119
|
-
icon: 'far fa-edit',
|
|
120
|
-
iconPosition: 'prefix',
|
|
121
|
-
},
|
|
122
|
-
export: {
|
|
123
|
-
text: 'Export',
|
|
124
|
-
color: '',
|
|
125
|
-
icon: 'far fa-sign-out',
|
|
126
|
-
iconPosition: 'prefix',
|
|
127
|
-
},
|
|
128
|
-
import: {
|
|
129
|
-
text: 'Import',
|
|
130
|
-
color: '',
|
|
131
|
-
icon: 'far fa-sign-in',
|
|
132
|
-
iconPosition: 'prefix',
|
|
133
|
-
},
|
|
134
|
-
filter: {
|
|
135
|
-
text: 'Filter',
|
|
136
|
-
color: '',
|
|
137
|
-
icon: 'far fa-filter',
|
|
138
|
-
iconPosition: 'prefix',
|
|
139
|
-
},
|
|
140
|
-
update: {
|
|
141
|
-
text: 'Update',
|
|
142
|
-
color: '',
|
|
143
|
-
icon: 'far fa-sync',
|
|
144
|
-
iconPosition: 'prefix',
|
|
145
|
-
},
|
|
146
|
-
reset: {
|
|
147
|
-
text: "Reset",
|
|
148
|
-
color: "",
|
|
149
|
-
icon: 'far fa-sync',
|
|
150
|
-
iconPosition: "prefix",
|
|
151
|
-
},
|
|
152
|
-
download: {
|
|
153
|
-
text: 'Download',
|
|
154
|
-
color: '',
|
|
155
|
-
icon: 'far fa-download',
|
|
156
|
-
iconPosition: 'prefix',
|
|
157
|
-
},
|
|
158
|
-
};
|
|
159
|
-
var VariantProps;
|
|
160
|
-
(function (VariantProps) {
|
|
161
|
-
VariantProps["save"] = "save";
|
|
162
|
-
VariantProps["submit"] = "submit";
|
|
163
|
-
VariantProps["ok"] = "ok";
|
|
164
|
-
VariantProps["new"] = "new";
|
|
165
|
-
VariantProps["add"] = "add";
|
|
166
|
-
VariantProps["create"] = "create";
|
|
167
|
-
VariantProps["apply"] = "apply";
|
|
168
|
-
VariantProps["prev"] = "prev";
|
|
169
|
-
VariantProps["next"] = "next";
|
|
170
|
-
VariantProps["send"] = "send";
|
|
171
|
-
VariantProps["delete"] = "delete";
|
|
172
|
-
VariantProps["cancel"] = "cancel";
|
|
173
|
-
VariantProps["decline"] = "decline";
|
|
174
|
-
VariantProps["close"] = "close";
|
|
175
|
-
VariantProps["archive"] = "archive";
|
|
176
|
-
VariantProps["remove"] = "remove";
|
|
177
|
-
VariantProps["edit"] = "edit";
|
|
178
|
-
VariantProps["export"] = "export";
|
|
179
|
-
VariantProps["import"] = "import";
|
|
180
|
-
VariantProps["filter"] = "filter";
|
|
181
|
-
VariantProps["update"] = "update";
|
|
182
|
-
VariantProps["reset"] = "Reset";
|
|
183
|
-
VariantProps["download"] = "download";
|
|
184
|
-
})(VariantProps || (VariantProps = {}));
|
|
185
|
-
|
|
186
|
-
const { state } = createStore({
|
|
187
|
-
value: new Map(),
|
|
188
|
-
setData: {},
|
|
189
|
-
removeData: {}
|
|
190
|
-
});
|
|
191
|
-
const setValue = (val) => {
|
|
192
|
-
const data = Object.assign(Object.assign({}, val), (variantOptions[val.variant] && {
|
|
193
|
-
icon: variantOptions[val.variant].icon,
|
|
194
|
-
value: variantOptions[val.variant].text,
|
|
195
|
-
iconPosition: Bcm.IconPosition[variantOptions[val.variant].iconPosition],
|
|
196
|
-
variantColor: variantOptions[val.variant].color
|
|
197
|
-
}));
|
|
198
|
-
state.value.set(data.id, data);
|
|
199
|
-
};
|
|
200
|
-
const removeValue = (_id) => {
|
|
201
|
-
state.value.delete(_id);
|
|
202
|
-
};
|
|
203
|
-
const getValue = (id) => snq(() => state.value.get(id), {});
|
|
204
|
-
const buttonState = {
|
|
205
|
-
setValue,
|
|
206
|
-
removeValue,
|
|
207
|
-
getValue
|
|
208
|
-
};
|
|
209
|
-
|
|
210
|
-
const ButtonTemplate = ({ value, type, componentClass, disabled, href, target, loading, isIconOnly, icon, iconPosition, id }) => {
|
|
211
|
-
const ButtonTagType = (href) ? Bcm.HtmlElementType.a : Bcm.HtmlElementType.button;
|
|
212
|
-
return (h(ButtonTagType, Object.assign({ id: id }, (type == Bcm.HtmlElementType.button && { type }), { class: componentClass, disabled: disabled, href: href, target: target, tabindex: "0" }),
|
|
213
|
-
h("span", { hidden: true },
|
|
214
|
-
h("slot", null)),
|
|
215
|
-
loading && h("span", { class: "bcm-button__container-loading" },
|
|
216
|
-
" ",
|
|
217
|
-
h("span", { class: "bcm-button__container-icon" },
|
|
218
|
-
h("i", { class: "far fa-spinner-third fa-spin" }),
|
|
219
|
-
" ")),
|
|
220
|
-
icon && h("span", { class: `${iconPosition} bcm-button__container-icon` },
|
|
221
|
-
h("i", { class: `${icon}` })),
|
|
222
|
-
!isIconOnly && (h(SlotTemplate, { className: "bcm-button__container-text", value: value })),
|
|
223
|
-
h("slot", { name: "suffix" })));
|
|
224
|
-
};
|
|
225
|
-
|
|
226
|
-
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)}";
|
|
227
|
-
|
|
228
|
-
var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
229
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
230
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
231
|
-
r = Reflect.decorate(decorators, target, key, desc);
|
|
232
|
-
else
|
|
233
|
-
for (var i = decorators.length - 1; i >= 0; i--)
|
|
234
|
-
if (d = decorators[i])
|
|
235
|
-
r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
236
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
237
|
-
};
|
|
238
|
-
const BcmButton = class {
|
|
239
|
-
constructor(hostRef) {
|
|
240
|
-
registerInstance(this, hostRef);
|
|
241
|
-
this.bcmClick = createEvent(this, "bcm-click", 7);
|
|
242
|
-
this._id = Generate.UID();
|
|
243
|
-
this.hidden = false;
|
|
244
|
-
this.type = Bcm.ButtonType.button;
|
|
245
|
-
this.size = Bcm.Size.medium;
|
|
246
|
-
this.disabled = false;
|
|
247
|
-
this.kind = Bcm.Kind.solid;
|
|
248
|
-
this.outline = false;
|
|
249
|
-
this.icon = undefined;
|
|
250
|
-
this.href = undefined;
|
|
251
|
-
this.target = undefined;
|
|
252
|
-
this.value = undefined;
|
|
253
|
-
this.loading = false;
|
|
254
|
-
this.variant = undefined;
|
|
255
|
-
this.dataDismiss = false;
|
|
256
|
-
this.fullWidth = false;
|
|
257
|
-
this.iconPosition = Bcm.IconPosition.prefix;
|
|
258
|
-
this.color = undefined;
|
|
259
|
-
this.checked = false;
|
|
260
|
-
}
|
|
261
|
-
handleOnClick(e) {
|
|
262
|
-
if (this.disabled) {
|
|
263
|
-
e.preventDefault();
|
|
264
|
-
e.stopPropagation();
|
|
265
|
-
return false;
|
|
266
|
-
}
|
|
267
|
-
}
|
|
268
|
-
componentWillRender() {
|
|
269
|
-
const { size, kind, icon, iconPosition, disabled, outline, href, type, target, loading, variant, fullWidth, hidden, value } = this;
|
|
270
|
-
buttonState.setValue({
|
|
271
|
-
id: this._id,
|
|
272
|
-
size,
|
|
273
|
-
type,
|
|
274
|
-
kind,
|
|
275
|
-
icon,
|
|
276
|
-
iconPosition,
|
|
277
|
-
disabled,
|
|
278
|
-
outline,
|
|
279
|
-
href,
|
|
280
|
-
target,
|
|
281
|
-
loading,
|
|
282
|
-
variant,
|
|
283
|
-
fullWidth,
|
|
284
|
-
hidden,
|
|
285
|
-
value,
|
|
286
|
-
isIconOnly: !!(this.isHaveChildNodes() && this.icon),
|
|
287
|
-
});
|
|
288
|
-
}
|
|
289
|
-
getStateData() {
|
|
290
|
-
return buttonState.getValue(this._id);
|
|
291
|
-
}
|
|
292
|
-
isHaveChildNodes() {
|
|
293
|
-
const childNodes = Array.from(this.el.childNodes);
|
|
294
|
-
return childNodes.find(node => node.nodeType === Node.TEXT_NODE) === undefined;
|
|
295
|
-
}
|
|
296
|
-
setColor(color = this.color) {
|
|
297
|
-
if (!color)
|
|
298
|
-
return;
|
|
299
|
-
const { kind } = this;
|
|
300
|
-
const prefix = `--bcm-button-${kind}`;
|
|
301
|
-
if (kind === 'solid') {
|
|
302
|
-
return {
|
|
303
|
-
[`${prefix}-color-default`]: ColorHelper.dsColor('white'),
|
|
304
|
-
[`${prefix}-color-hover`]: ColorHelper.dsColor('white'),
|
|
305
|
-
[`${prefix}-color-focus-visible`]: ColorHelper.dsColor('white'),
|
|
306
|
-
[`${prefix}-color-active`]: ColorHelper.dsColor('white'),
|
|
307
|
-
[`${prefix}-color-disabled`]: ColorHelper.dsColor('white'),
|
|
308
|
-
[`${prefix}-background-color-default`]: ColorHelper.dsColor(color + '-500'),
|
|
309
|
-
[`${prefix}-background-color-hover`]: ColorHelper.dsColor(color + '-600'),
|
|
310
|
-
[`${prefix}-background-color-focus-visible`]: ColorHelper.dsColor(color + '-700'),
|
|
311
|
-
[`${prefix}-background-color-active`]: ColorHelper.dsColor(color + '-800'),
|
|
312
|
-
[`${prefix}-background-color-disabled`]: ColorHelper.dsColor('slate-400'),
|
|
313
|
-
[`${prefix}-border-default`]: ColorHelper.dsColor(color + '-500'),
|
|
314
|
-
[`${prefix}-border-hover`]: ColorHelper.dsColor(color + '-600'),
|
|
315
|
-
[`${prefix}-border-focus-visible`]: ColorHelper.dsColor(color + '-700'),
|
|
316
|
-
[`${prefix}-border-active`]: ColorHelper.dsColor(color + '-800'),
|
|
317
|
-
[`${prefix}-border-disabled`]: ColorHelper.dsColor('slate-400')
|
|
318
|
-
};
|
|
319
|
-
}
|
|
320
|
-
else if (kind == 'link') {
|
|
321
|
-
return {
|
|
322
|
-
[`${prefix}-color-default`]: ColorHelper.dsColor(color + '-500'),
|
|
323
|
-
[`${prefix}-color-hover`]: ColorHelper.dsColor(color + '-600'),
|
|
324
|
-
[`${prefix}-color-focus-visible`]: ColorHelper.dsColor(color + '-800'),
|
|
325
|
-
[`${prefix}-color-active`]: ColorHelper.dsColor(color + '-700'),
|
|
326
|
-
[`${prefix}-color-disabled`]: ColorHelper.dsColor('slate-400'),
|
|
327
|
-
[`${prefix}-background-color-default`]: ColorHelper.dsColor('transparent'),
|
|
328
|
-
[`${prefix}-background-color-hover`]: ColorHelper.dsColor('transparent'),
|
|
329
|
-
[`${prefix}-background-color-focus-visible`]: ColorHelper.dsColor('slate-50'),
|
|
330
|
-
[`${prefix}-background-color-active`]: ColorHelper.dsColor('slate-50'),
|
|
331
|
-
[`${prefix}-background-color-disabled`]: ColorHelper.dsColor('transparent'),
|
|
332
|
-
[`${prefix}-border-default`]: ColorHelper.dsColor('transparent'),
|
|
333
|
-
[`${prefix}-border-hover`]: ColorHelper.dsColor('transparent'),
|
|
334
|
-
[`${prefix}-border-focus-visible`]: ColorHelper.dsColor('slate-50'),
|
|
335
|
-
[`${prefix}-border-active`]: ColorHelper.dsColor('slate-50'),
|
|
336
|
-
[`${prefix}-border-disabled`]: ColorHelper.dsColor('transparent')
|
|
337
|
-
};
|
|
338
|
-
}
|
|
339
|
-
else if (kind == 'ghost') {
|
|
340
|
-
return {
|
|
341
|
-
[`${prefix}-color-default`]: ColorHelper.dsColor(color + '-600'),
|
|
342
|
-
[`${prefix}-color-hover`]: ColorHelper.dsColor(color + '-600'),
|
|
343
|
-
[`${prefix}-color-focus-visible`]: ColorHelper.dsColor(color + '-600'),
|
|
344
|
-
[`${prefix}-color-active`]: ColorHelper.dsColor(color + '-600'),
|
|
345
|
-
[`${prefix}-color-disabled`]: ColorHelper.dsColor(color + '-300'),
|
|
346
|
-
[`${prefix}-background-color-default`]: ColorHelper.dsColor(color + '-100'),
|
|
347
|
-
[`${prefix}-background-color-hover`]: ColorHelper.dsColor(color + '-200'),
|
|
348
|
-
[`${prefix}-background-color-focus-visible`]: ColorHelper.dsColor(color + '-400'),
|
|
349
|
-
[`${prefix}-background-color-active`]: ColorHelper.dsColor(color + '-300'),
|
|
350
|
-
[`${prefix}-background-color-disabled`]: ColorHelper.dsColor(color + '-50'),
|
|
351
|
-
[`${prefix}-border-default`]: ColorHelper.dsColor(color + '-300'),
|
|
352
|
-
[`${prefix}-border-hover`]: ColorHelper.dsColor(color + '-400'),
|
|
353
|
-
[`${prefix}-border-focus-visible`]: ColorHelper.dsColor(color + '-600'),
|
|
354
|
-
[`${prefix}-border-active`]: ColorHelper.dsColor(color + '-500'),
|
|
355
|
-
[`${prefix}-border-disabled`]: ColorHelper.dsColor(color + '-200'),
|
|
356
|
-
};
|
|
357
|
-
}
|
|
358
|
-
return;
|
|
359
|
-
}
|
|
360
|
-
render() {
|
|
361
|
-
const { size, kind, disabled, outline, type, href, target, loading, variantColor, fullWidth, hidden, icon, iconPosition, value, isIconOnly, iconSize } = this.getStateData();
|
|
362
|
-
const classPrefix = 'bcm-button';
|
|
363
|
-
let componentClass = classnames('bcm-button__container', `bcm-button__container-size-${size}`, `bcm-button__container-kind-${outline ? 'ghost' : kind}`, {
|
|
364
|
-
'full-width': fullWidth,
|
|
365
|
-
'checked': this.checked,
|
|
366
|
-
'disabled': disabled,
|
|
367
|
-
});
|
|
368
|
-
const hostClasses = classnames(`${classPrefix}`, {
|
|
369
|
-
hidden,
|
|
370
|
-
'full-width': fullWidth,
|
|
371
|
-
});
|
|
372
|
-
return (h(Host, { class: hostClasses, style: this.setColor(variantColor), onClick: () => !disabled && this.bcmClick.emit(this.el) }, h(ButtonTemplate, { type: type, value: value, componentClass: componentClass, disabled: disabled, href: href, target: target, icon: icon, loading: loading, iconSize: iconSize, isIconOnly: isIconOnly, iconPosition: iconPosition })));
|
|
373
|
-
}
|
|
374
|
-
get el() { return getElement(this); }
|
|
375
|
-
};
|
|
376
|
-
__decorate$1([
|
|
377
|
-
IsLoad()
|
|
378
|
-
], BcmButton.prototype, "el", void 0);
|
|
379
|
-
BcmButton.style = buttonCss;
|
|
380
|
-
|
|
381
|
-
var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
|
|
382
|
-
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
|
|
383
|
-
if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
|
|
384
|
-
r = Reflect.decorate(decorators, target, key, desc);
|
|
385
|
-
else
|
|
386
|
-
for (var i = decorators.length - 1; i >= 0; i--)
|
|
387
|
-
if (d = decorators[i])
|
|
388
|
-
r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
|
|
389
|
-
return c > 3 && r && Object.defineProperty(target, key, r), r;
|
|
390
|
-
};
|
|
391
|
-
const BcmToast = class {
|
|
392
|
-
constructor(hostRef) {
|
|
393
|
-
registerInstance(this, hostRef);
|
|
394
|
-
this.bcmToastClose = createEvent(this, "bcm-toast-close", 7);
|
|
395
|
-
this.bcmToastOpen = createEvent(this, "bcm-toast-open", 7);
|
|
396
|
-
this.bcmToastView = createEvent(this, "bcm-toast-view", 7);
|
|
397
|
-
this._id = Generate.UID();
|
|
398
|
-
this.status = undefined;
|
|
399
|
-
this.message = "";
|
|
400
|
-
this.description = "";
|
|
401
|
-
this.duration = 3000;
|
|
402
|
-
this.position = Bcm.Placement.bottom;
|
|
403
|
-
this.messageIcon = undefined;
|
|
404
|
-
this.viewButton = false;
|
|
405
|
-
this.closeButton = true;
|
|
406
|
-
this.visible = false;
|
|
407
|
-
this.visibleContainer = false;
|
|
408
|
-
}
|
|
409
|
-
async show() {
|
|
410
|
-
const container = document.getElementById(this._id + "-container");
|
|
411
|
-
if (container) {
|
|
412
|
-
document.body.appendChild(container);
|
|
413
|
-
}
|
|
414
|
-
this.visible = true;
|
|
415
|
-
await delay(50);
|
|
416
|
-
this.visibleContainer = true;
|
|
417
|
-
this.bcmToastOpen.emit();
|
|
418
|
-
if (this.timer) {
|
|
419
|
-
clearTimeout(this.timer);
|
|
420
|
-
}
|
|
421
|
-
this.timer = setTimeout(() => this.hide(), this.duration);
|
|
422
|
-
return this.el;
|
|
423
|
-
}
|
|
424
|
-
async hide() {
|
|
425
|
-
this.visibleContainer = false;
|
|
426
|
-
clearTimeout(this.timer);
|
|
427
|
-
this.bcmToastClose.emit();
|
|
428
|
-
await delay(100);
|
|
429
|
-
this.visible = false;
|
|
430
|
-
}
|
|
431
|
-
handleMouseEnter() {
|
|
432
|
-
clearTimeout(this.timer);
|
|
433
|
-
}
|
|
434
|
-
handleMouseLeave() {
|
|
435
|
-
if (this.visible) {
|
|
436
|
-
this.timer = setTimeout(() => this.hide(), 1000);
|
|
437
|
-
}
|
|
438
|
-
}
|
|
439
|
-
render() {
|
|
440
|
-
return (h(Host, { class: "tw-hidden" }, h("div", { class: classnames({ "tw-hidden": !this.visible }), id: this._id + "-container", onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, h("div", { class: classnames("tw-pointer-events-auto tw-transform tw-transition tw-duration-300 tw-ease-in-out", "tw-flex tw-min-w-[256px] tw-max-w-[420px] tw-flex-col tw-gap-2 tw-rounded-lg tw-border tw-font-sans tw-font-normal tw-shadow-2", "tw-border-gray-300 tw-bg-white tw-text-slate-600", {
|
|
441
|
-
"tw-p-4": !this.description,
|
|
442
|
-
"tw-p-6": this.description,
|
|
443
|
-
}, "tw-fixed tw-z-50", "tw-transform tw-transition tw-duration-300 tw-ease-in-out ", {
|
|
444
|
-
"tw-inset-x-0 tw-top-4 tw-mx-auto": this.position === Bcm.Placement.top,
|
|
445
|
-
"tw-inset-x-0 tw-bottom-4 tw-mx-auto": this.position === Bcm.Placement.bottom,
|
|
446
|
-
"tw-top-4 tw-left-4": this.position === Bcm.Placement["top-start"],
|
|
447
|
-
"tw-top-4 tw-right-4": this.position === Bcm.Placement["top-end"],
|
|
448
|
-
"tw-bottom-4 tw-left-4": this.position === Bcm.Placement["bottom-start"],
|
|
449
|
-
"tw-bottom-4 tw-right-4": this.position === Bcm.Placement["bottom-end"],
|
|
450
|
-
"tw-translate-y-0 tw-opacity-100 ": this.visibleContainer,
|
|
451
|
-
"tw-opacity-0": !this.visibleContainer,
|
|
452
|
-
"tw-translate-y-[-100%]": !this.visibleContainer && this.position.split("-")[0] === "top",
|
|
453
|
-
"tw-translate-y-[100%]": !this.visibleContainer && this.position.split("-")[0] === "bottom",
|
|
454
|
-
}) }, h("div", { class: "tw-flex tw-items-center tw-justify-between tw-gap-5" }, h("div", { class: "tw-flex tw-items-center tw-gap-3 " }, this.status && (h("i", { class: classnames("tw-text-6", this.messageIcon ? this.messageIcon : "far", {
|
|
455
|
-
"tw-text-emerald-500": this.status === "success",
|
|
456
|
-
"tw-text-red-500": this.status === "error",
|
|
457
|
-
"tw-text-amber-500": this.status === "warning",
|
|
458
|
-
"tw-text-blue-500": this.status === "info",
|
|
459
|
-
}, {
|
|
460
|
-
"fa-check-circle": !this.messageIcon && this.status === "success",
|
|
461
|
-
"fa-exclamation-circle": !this.messageIcon && this.status === "error",
|
|
462
|
-
"fa-exclamation-triangle": !this.messageIcon && this.status === "warning",
|
|
463
|
-
"fa-info-circle": !this.messageIcon && this.status === "info",
|
|
464
|
-
}) })), h("span", { class: classnames({
|
|
465
|
-
"tw-text-4": !this.description,
|
|
466
|
-
"tw-text-6 tw-font-medium": this.description,
|
|
467
|
-
}) }, !this.description && this.status && h("span", null, StringHelper.capitalize(this.status), ": "), this.message)), h("div", { class: "tw-flex tw-items-baseline tw-gap-2" }, this.viewButton && (h("button", { onClick: () => this.bcmToastView.emit(), title: "View details", class: classnames("tw-cursor-pointer tw-rounded tw-bg-transparent tw-p-0 tw-px-1 tw-text-4 tw-text-inherit", "hover:tw-bg-gray-100 hover:tw-text-slate-800", "active:tw-bg-gray-200", "tw-transition tw-duration-300 tw-ease-in-out", {
|
|
468
|
-
"tw-font-medium": this.description,
|
|
469
|
-
}) }, "View")), this.closeButton && (h("button", { title: "Close", onClick: () => this.hide(), class: classnames("tw-rounded tw-bg-transparent tw-p-0", "tw-flex tw-h-6 tw-w-6 tw-cursor-pointer tw-items-center tw-justify-center tw-text-3 tw-text-inherit", "hover:tw-bg-gray-100 hover:tw-text-slate-800", "active:tw-bg-gray-200") }, h("i", { class: "fal fa-times" }))))), this.description && h("div", { class: "tw-text-3 " }, this.description), h("slot", null)))));
|
|
470
|
-
}
|
|
471
|
-
get el() { return getElement(this); }
|
|
472
|
-
};
|
|
473
|
-
__decorate([
|
|
474
|
-
IsLoad()
|
|
475
|
-
], BcmToast.prototype, "el", void 0);
|
|
476
|
-
|
|
477
|
-
export { BcmButton as bcm_button, BcmToast as bcm_toast };
|