@rededor/cura-hydrate 1.4.0 → 1.5.0-alpha.1
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/index.js +407 -83
- package/index.mjs +407 -83
- package/package.json +1 -1
package/index.mjs
CHANGED
|
@@ -3032,7 +3032,7 @@ class CuraAlert {
|
|
|
3032
3032
|
return this.icon ? this.icon : iconMapping[this.type];
|
|
3033
3033
|
}
|
|
3034
3034
|
render() {
|
|
3035
|
-
return (hAsync(Host, { key: '
|
|
3035
|
+
return (hAsync(Host, { key: 'a0b22404673b1568b9cb937150dda71ce4c99d50' }, hAsync("div", { key: 'c30bf1b97d1e1ffaf334ef3bca6cdd1f081c679c', class: this.getClasses(), style: this.styles }, hAsync("cura-icon", { key: '1bd88c8a19e073d7b9d967d8df38bb74063cd110', name: this.getNameIcon(), class: "icon-left", size: 16, color: `${this.type}-dark` }), hAsync("div", { key: '0df09a27c27c7e1743f7cfb9e71c96b102ff4484', class: "content" }, this.label ? (hAsync("cura-label", { class: "title", size: "small", color: "neutral-darker", weight: "bold" }, this.label)) : '', hAsync("cura-paragraph", { key: '687cc7ab050299f0878c2d10ccd28e92708db85d', class: "text", color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, hAsync("slot", { key: 'e2d85d40e65029ea71a43aa23e7298d6dcc7efa9' })), hAsync("slot", { key: 'a28fe90c9bfe2b9fb22f196eab7bb2e09e408dbf', name: "actions" })), this.closeable ?
|
|
3036
3036
|
(hAsync("cura-icon", { name: "close", size: 16, color: "error-dark", class: "icon-right", onClick: this.handleClose }))
|
|
3037
3037
|
: '')));
|
|
3038
3038
|
}
|
|
@@ -3108,7 +3108,7 @@ class CuraAvatar {
|
|
|
3108
3108
|
this.imageSrc = this.imageSrcDefault || `${this.assetsPath}/images/avatar/patient-default.svg`;
|
|
3109
3109
|
}
|
|
3110
3110
|
render() {
|
|
3111
|
-
return (hAsync(Host, { key: '
|
|
3111
|
+
return (hAsync(Host, { key: '467e74004b400e80a2d7f8e1a40cd9d7e782ff8a', style: this.hostCSSProperties(), role: "img" }, hAsync("div", { key: 'c38a163b8aeebd07f8aece7aea9889c336df92a5', class: this.getClasses(), style: this.styles }, hAsync("img", { key: 'a22868d4aae4029afb9b325a5c8f5556fa8984ea', src: this.imageSrc || this.imageSrcDefault || `${this.assetsPath}/images/avatar/patient-default.svg`, onError: () => this.onSrcError() }))));
|
|
3112
3112
|
}
|
|
3113
3113
|
get host() { return getElement(this); }
|
|
3114
3114
|
static get watchers() { return {
|
|
@@ -3136,6 +3136,54 @@ class CuraAvatar {
|
|
|
3136
3136
|
}; }
|
|
3137
3137
|
}
|
|
3138
3138
|
|
|
3139
|
+
const curaBadgeDotCss = ":host{display:block;position:relative;width:fit-content;height:fit-content}:host .container{width:calc(var(--base-spacing) * 2px);height:calc(var(--base-spacing) * 2px);position:relative;box-sizing:border-box}:host .container::before{width:100%;height:100%;position:absolute;left:0;top:0;content:\"\";box-sizing:border-box;border-radius:50%;border:1px solid var(--color-dark);background:var(--color)}:host .container.disabled::before{background:var(--neutral-pale);border:1px solid var(--neutral-medium)}:host .container.outline::before{background:transparent;border:2px solid var(--color)}:host .container.outline.disabled::before{border:2px solid var(--neutral-medium)}:host .container.transparent::before{background:var(--color-dark);border:none}:host .container.transparent.disabled::before{background:var(--neutral-medium);border:none}";
|
|
3140
|
+
var CuraBadgeDotStyle0 = curaBadgeDotCss;
|
|
3141
|
+
|
|
3142
|
+
class CuraBadgeDot {
|
|
3143
|
+
constructor(hostRef) {
|
|
3144
|
+
registerInstance(this, hostRef);
|
|
3145
|
+
this.theme = window.CuraAPI.theme;
|
|
3146
|
+
this.color = 'primary';
|
|
3147
|
+
this.disabled = false;
|
|
3148
|
+
this.type = 'solid';
|
|
3149
|
+
this.styles = {};
|
|
3150
|
+
}
|
|
3151
|
+
connectedCallback() {
|
|
3152
|
+
this.styles['--base-spacing'] = this.theme.spacing.getSpacing();
|
|
3153
|
+
this.styles['--neutral-medium'] = this.theme.colors.getColor('neutral-dark');
|
|
3154
|
+
this.styles['--neutral-pale'] = this.theme.colors.getColor('neutral-pale');
|
|
3155
|
+
this.setColors();
|
|
3156
|
+
}
|
|
3157
|
+
setColors() {
|
|
3158
|
+
this.styles = Object.assign(Object.assign({}, this.styles), { '--color': this.theme.colors.getColor(`${this.color}`), '--color-dark': this.theme.colors.getColor(`${this.color}-dark`) });
|
|
3159
|
+
}
|
|
3160
|
+
getClasses() {
|
|
3161
|
+
const classes = {
|
|
3162
|
+
'container': true,
|
|
3163
|
+
'disabled': this.disabled
|
|
3164
|
+
};
|
|
3165
|
+
classes[`${this.type}`] = true;
|
|
3166
|
+
return classes;
|
|
3167
|
+
}
|
|
3168
|
+
render() {
|
|
3169
|
+
return (hAsync(Host, { key: '00e335977fbb0677db9d95bab901a012ba8a5c06' }, hAsync("div", { key: 'e828743793731c986f37dd6a9f7abdc78b63932b', class: this.getClasses(), style: this.styles })));
|
|
3170
|
+
}
|
|
3171
|
+
static get style() { return CuraBadgeDotStyle0; }
|
|
3172
|
+
static get cmpMeta() { return {
|
|
3173
|
+
"$flags$": 9,
|
|
3174
|
+
"$tagName$": "cura-badge-dot",
|
|
3175
|
+
"$members$": {
|
|
3176
|
+
"color": [1],
|
|
3177
|
+
"disabled": [516],
|
|
3178
|
+
"type": [513],
|
|
3179
|
+
"styles": [32]
|
|
3180
|
+
},
|
|
3181
|
+
"$listeners$": undefined,
|
|
3182
|
+
"$lazyBundleId$": "-",
|
|
3183
|
+
"$attrsToReflect$": [["disabled", "disabled"], ["type", "type"]]
|
|
3184
|
+
}; }
|
|
3185
|
+
}
|
|
3186
|
+
|
|
3139
3187
|
const curaBadgeCounterCss = ":host{width:fit-content;display:inline-block;height:calc(var(--base-spacing) * 4px);position:relative}:host .container{display:flex;min-width:calc(var(--base-spacing) * 4px);width:fit-content;height:calc(var(--base-spacing) * 4px);justify-content:center;align-items:center;border-radius:calc(calc(var(--base-spacing) * 4px) / 2);background:var(--background-color);box-sizing:border-box;padding:0 calc(var(--base-spacing) * 1px);position:relative}:host .container.outline,:host .container.transparent{background:transparent !important}:host .container.outline::before{content:\"\";width:100%;height:100%;position:absolute;left:0px;top:0px;box-sizing:border-box;border:1px solid var(--background-color);border-radius:calc(calc(var(--base-spacing) * 4px) / 2)}";
|
|
3140
3188
|
var CuraBadgeCounterStyle0 = curaBadgeCounterCss;
|
|
3141
3189
|
|
|
@@ -3174,13 +3222,13 @@ class CuraBadgeNumber {
|
|
|
3174
3222
|
}
|
|
3175
3223
|
getClasses() {
|
|
3176
3224
|
const classes = {
|
|
3177
|
-
'container': true
|
|
3225
|
+
'container': true
|
|
3178
3226
|
};
|
|
3179
3227
|
classes[this.type.toLowerCase()] = true;
|
|
3180
3228
|
return classes;
|
|
3181
3229
|
}
|
|
3182
3230
|
render() {
|
|
3183
|
-
return (hAsync(Host, { key: '
|
|
3231
|
+
return (hAsync(Host, { key: '8b67f2b913a10de53a519cdafcfbcb140b2adda5' }, this.number && this.number <= 0 ? '' : (hAsync("div", { class: this.getClasses(), style: this.styles }, hAsync("cura-label", { size: "xsmall", "line-height": "none", color: this.labelColor }, this.number >= 100 ? '99+' : this.number)))));
|
|
3184
3232
|
}
|
|
3185
3233
|
static get watchers() { return {
|
|
3186
3234
|
"disabled": ["handleColorChange"],
|
|
@@ -3243,6 +3291,7 @@ class CuraBadgePill {
|
|
|
3243
3291
|
colors.forEach(color => {
|
|
3244
3292
|
this.styles[color.name] = this.theme.colors.getColor(color.theme);
|
|
3245
3293
|
});
|
|
3294
|
+
this.styles = Object.assign({}, this.styles);
|
|
3246
3295
|
}
|
|
3247
3296
|
hostCSSProperties() {
|
|
3248
3297
|
return {
|
|
@@ -3269,7 +3318,7 @@ class CuraBadgePill {
|
|
|
3269
3318
|
}
|
|
3270
3319
|
render() {
|
|
3271
3320
|
const symbolColor = this.getSymbolColor();
|
|
3272
|
-
return (hAsync(Host, { key: '
|
|
3321
|
+
return (hAsync(Host, { key: 'd2b79aa7ede4462cd2b591b62321ef69b9e4fed3', style: this.hostCSSProperties() }, hAsync("div", { key: 'a82383b03c02990b5879ca647ae06cabb5c32845', class: this.getClasses(), style: this.styles }, this.getIcon(), hAsync("cura-label", { key: '1ccf493530fa6b7cee25db83d0fcb37cf308df3d', size: 'xsmall', "line-height": "117%", color: symbolColor }, hAsync("slot", { key: '488e4fbd8b30cfcd15b25c9227e129b1c6e1ce32' })))));
|
|
3273
3322
|
}
|
|
3274
3323
|
get host() { return getElement(this); }
|
|
3275
3324
|
static get watchers() { return {
|
|
@@ -3401,7 +3450,7 @@ class CuraButton {
|
|
|
3401
3450
|
render() {
|
|
3402
3451
|
const symbolColor = this.getSymbolColor();
|
|
3403
3452
|
const labelSize = labelSizes[this.size] || labelSizes["default"];
|
|
3404
|
-
return (hAsync(Host, { key: '
|
|
3453
|
+
return (hAsync(Host, { key: '07b87d98fb398bc2897e666dc8cd54734f20734d' }, this.href ? (hAsync("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, hAsync("span", { class: "button-container" }, this.getIcon(), hAsync("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, hAsync("slot", null))), hAsync("cura-loader-circle", { size: this.size, color: symbolColor }))) : (hAsync("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, hAsync("span", { class: "button-container" }, this.getIcon(), hAsync("cura-label", { class: "label", size: labelSize, lineHeight: '105%', color: symbolColor }, hAsync("slot", null))), hAsync("cura-loader-circle", { size: this.size, color: symbolColor })))));
|
|
3405
3454
|
}
|
|
3406
3455
|
static get formAssociated() { return true; }
|
|
3407
3456
|
static get watchers() { return {
|
|
@@ -3535,7 +3584,7 @@ class CuraButtonOutline {
|
|
|
3535
3584
|
render() {
|
|
3536
3585
|
const symbolColor = this.getSymbolColor();
|
|
3537
3586
|
const labelSize = labelSizes[this.size] || labelSizes["default"];
|
|
3538
|
-
return (hAsync(Host, { key: '
|
|
3587
|
+
return (hAsync(Host, { key: '0a0c25f94d0c18dbb90e4836ca3e7bcbbe10d032' }, this.href ? (hAsync("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, hAsync("span", { class: "button-container" }, this.getIcon(), hAsync("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, hAsync("slot", null))), hAsync("cura-loader-circle", { size: this.size, color: symbolColor }))) : (hAsync("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, hAsync("span", { class: "button-container" }, this.getIcon(), hAsync("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, hAsync("slot", null))), hAsync("cura-loader-circle", { size: this.size, color: symbolColor })))));
|
|
3539
3588
|
}
|
|
3540
3589
|
static get formAssociated() { return true; }
|
|
3541
3590
|
static get watchers() { return {
|
|
@@ -3673,7 +3722,7 @@ class CuraButtonSelect {
|
|
|
3673
3722
|
}
|
|
3674
3723
|
render() {
|
|
3675
3724
|
const labelSize = labelSizes[this.size] || labelSizes['default'];
|
|
3676
|
-
return (hAsync(Host, { key: '
|
|
3725
|
+
return (hAsync(Host, { key: '4b7592b68a09c5b93ec1c9ec6b84c7e5afa06ec3' }, hAsync("button", { key: 'd607a733d64f73bd4bd4405e0aeb9d7f5ceebf52', class: this.getClasses(), style: this.styles, disabled: this.disabled, onClick: e => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, hAsync("div", { key: '14e2f5b7309bf6c2252c81ab2f02fb36670facf3', class: "button-container" }, this.iconName ? this.getIcon() : null, hAsync("cura-label", { key: '0759d70b0105a56dfa42bce78f2f5b8c33b04254', class: "label", size: labelSize, lineHeight: "0%", color: this.getLabelFontColor(), weight: "regular" }, hAsync("slot", { key: 'a9935483ee6c67b8142878672804dfb7df0d8479' })), this.counter ? this.getCounter() : null, this.iconPosition === 'right' && this.selected ? this.getCheckIconRight() : null))));
|
|
3677
3726
|
}
|
|
3678
3727
|
get host() { return getElement(this); }
|
|
3679
3728
|
static get watchers() { return {
|
|
@@ -3789,7 +3838,7 @@ class CuraButtonTransparent {
|
|
|
3789
3838
|
render() {
|
|
3790
3839
|
const symbolColor = this.getSymbolColor();
|
|
3791
3840
|
const labelSize = labelSizes[this.size] || labelSizes["default"];
|
|
3792
|
-
return (hAsync(Host, { key: '
|
|
3841
|
+
return (hAsync(Host, { key: 'f93f2f1b495403127238468c57edfcb5e9f69d43' }, this.href ? (hAsync("a", { href: this.disabled ? '' : this.href, target: this.target, class: this.getClasses(), style: this.styles, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave() }, hAsync("span", { class: "button-container" }, this.getIcon(), hAsync("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, hAsync("slot", null))), hAsync("cura-loader-circle", { size: this.size, color: symbolColor }))) : (hAsync("button", { class: this.getClasses(), style: this.styles, disabled: this.disabled || null, onClick: (e) => this.handleClick(e), onMouseEnter: () => this.handleMouseEnter(), onMouseLeave: () => this.handleMouseLeave(), type: this.type }, hAsync("span", { class: "button-container" }, this.getIcon(), hAsync("cura-label", { size: labelSize, lineHeight: '105%', color: symbolColor }, hAsync("slot", null))), hAsync("cura-loader-circle", { size: this.size, color: symbolColor })))));
|
|
3793
3842
|
}
|
|
3794
3843
|
static get formAssociated() { return true; }
|
|
3795
3844
|
static get watchers() { return {
|
|
@@ -7842,7 +7891,7 @@ class CuraCalendar {
|
|
|
7842
7891
|
}
|
|
7843
7892
|
render() {
|
|
7844
7893
|
const { months } = this.fetchMonthNames();
|
|
7845
|
-
return (hAsync(Host, { key: '
|
|
7894
|
+
return (hAsync(Host, { key: '859c5f15de173c774dc9f8a88792845741b665e2', style: this.getHostCSSProperties() }, hAsync("div", { key: '5838783d7ecb5b2258ef7ef73ba32ca7ddbad470', class: `calendar ${this.floating ? 'floating' : ''} ${this.embedded ? 'embedded' : ''}`, style: this.styles }, hAsync("header", { key: '16245dbb73d9d0a277891b3853f451b89acccc35', class: "header" }, hAsync("div", { key: '9a22c4386363642fa7219edebd9e9a5cfb5220aa', class: `month-year ${this.type === 'dropdown' && 'dropdown'}` }, hAsync("cura-icon", { key: '4d3ee4454dfc8bbcd8d76df101b553c86b0cea8f', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "left", color: this.determinePrevButtonColor(), onClick: !this.collapsed ? () => this.updateCurrentMonth('prev') : () => this.updateCurrentWeek('prev') }), this.type === 'dropdown' ? (hAsync("div", { class: "select" }, hAsync("cura-select", { size: "small", class: "drop-month", mode: "transparent", value: months[getMonth(this.currentDate)], onSelected: e => this.onMonthDropdownChange(e) }, months.map((month, index) => (hAsync("cura-select-option", { size: "xsmall", key: index, value: month }, month)))), hAsync("cura-select", { size: "small", class: "drop-year", mode: "transparent", value: getYear(this.currentDate).toString(), onSelected: e => this.onYearDropdownChange(e) }, this.fetchYearList().map((year, index) => (hAsync("cura-select-option", { key: index, value: year.toString() }, year.toString())))))) : (hAsync("cura-label", { color: "neutral-black", size: "large" }, months[getMonth(this.currentDate)].slice(0, 3), ", ", getYear(this.currentDate))), hAsync("cura-icon", { key: '1f54119aafaa80816cdd016100a7987cba6656b0', class: `icon ${this.type === 'dropdown' && 'dropdown'}`, name: "right", color: "primary-base", onClick: !this.collapsed ? () => this.updateCurrentMonth('next') : () => this.updateCurrentWeek('next') }))), hAsync("span", { key: '40be6c876675cf43b42e214e30639e48873dc4bc', class: "days-of-week" }, this.fetchWeekDays().map((day, index) => (hAsync("cura-label", { class: "day", size: "xsmall", color: "neutral-black", weight: "bold", key: index }, day === 'sab' ? 'SÁB' : day.toLocaleUpperCase())))), hAsync("div", { key: '72cae6b30fa5b7d5e180b796458d1844aba27ea9', class: "dates" }, !this.collapsed
|
|
7846
7895
|
? this.fetchDaysOfMonth().map((day, index) => (hAsync("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))
|
|
7847
7896
|
: this.fetchDaysOfWeek().map((day, index) => (hAsync("div", { key: index, class: this.getClasses(day), onClick: () => this.onDateClick(day) }, day ? format(day, 'd') : '')))), this.collapsed !== null ? (this.collapsed ? (hAsync("div", { class: "collapsed-container" }, hAsync("cura-button-transparent", { onClick: () => this.showNotColapsedCalendar(), size: "small", color: "primary", fontColor: "dark", iconName: "plusCircle" }, "Veja mais datas"))) : (hAsync("div", { class: "collapsed-container" }, hAsync("cura-button-transparent", { onClick: () => this.showColapsedCalendar(), size: "small", color: "primary", fontColor: "dark", iconName: "minusCircle" }, "Veja menos datas")))) : null)));
|
|
7848
7897
|
}
|
|
@@ -7926,7 +7975,7 @@ class CuraCard {
|
|
|
7926
7975
|
return classes;
|
|
7927
7976
|
}
|
|
7928
7977
|
render() {
|
|
7929
|
-
return (hAsync(Host, { key: '
|
|
7978
|
+
return (hAsync(Host, { key: '9478ce754c108db722dbc5bcbb00a0884b6c6f38', role: this.href ? 'link' : 'div' }, this.href ? (hAsync("a", { class: this.getClasses(), target: this.target, style: this.styles, href: this.href }, hAsync("slot", null))) : (hAsync("div", { class: this.getClasses(), style: this.styles }, hAsync("slot", null)))));
|
|
7930
7979
|
}
|
|
7931
7980
|
static get style() { return CuraCardStyle0; }
|
|
7932
7981
|
static get cmpMeta() { return {
|
|
@@ -8121,7 +8170,7 @@ class CuraCheckbox {
|
|
|
8121
8170
|
return hAsync("cura-icon", { class: "icon", name: iconName, size: iconSize, color: iconColor });
|
|
8122
8171
|
}
|
|
8123
8172
|
render() {
|
|
8124
|
-
return (hAsync(Host, { key: '
|
|
8173
|
+
return (hAsync(Host, { key: 'c589b642a730e09b8d5ba60b69b45f131560ffda' }, hAsync("div", { key: '85ee55dc52042e513e070d68af348dc78d1990e2', class: this.getClasses(), style: this.styles, onClick: this.handleClick }, hAsync("div", { key: '59e78d3b717b0bbd77d98da09ab7f1da30d02f14', class: "info" }, hAsync("div", { key: '64d683966633a625e7e477fcf1b00364d5fd3fa7', class: "label-wrapper" }, hAsync("cura-label", { key: '76d34006ffd837285cb899278f759d95862097c5', class: "label", weight: 'bold', size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && hAsync("cura-paragraph", { key: '01394587736d7402d5c6729e9f7e93f7b08ad742', lineHeight: '0%', marginBlock: '0', color: "error-base" }, "* ")), hAsync("cura-label", { key: 'fcbbea9a05b9299a814111ea36d7412df6f54e92', color: this.assignColor('message'), size: "xsmall", class: "message" }, hAsync("slot", { key: '99c46ed2eb8492cbebb114d828935f1ec0bf7796' }))), hAsync("div", { key: '6291780f613af4e320c486b46697df6f19bdce0e', class: 'checkbox', tabIndex: this.ontabindex }, hAsync("input", { key: 'b922e6498ecfd28391843cdfa45c850f045f3ab6', type: "checkbox", name: this.name, value: this.value, disabled: this.disabled, required: this.required, checked: this.checked, indeterminate: this.indeterminate }), this.getIcon()))));
|
|
8125
8174
|
}
|
|
8126
8175
|
static get formAssociated() { return true; }
|
|
8127
8176
|
get host() { return getElement(this); }
|
|
@@ -8223,7 +8272,7 @@ class CuraDisplay {
|
|
|
8223
8272
|
return tags[`${this.level}`] || tags['default'];
|
|
8224
8273
|
}
|
|
8225
8274
|
render() {
|
|
8226
|
-
return (hAsync(Host, { key: '
|
|
8275
|
+
return (hAsync(Host, { key: '01876449797c600a4fa37c9b4addd80855e6fc83', style: this.hostCSSProperties() }, this.getHeadingTag()));
|
|
8227
8276
|
}
|
|
8228
8277
|
get host() { return getElement(this); }
|
|
8229
8278
|
static get watchers() { return {
|
|
@@ -8249,7 +8298,7 @@ class CuraDisplay {
|
|
|
8249
8298
|
}; }
|
|
8250
8299
|
}
|
|
8251
8300
|
|
|
8252
|
-
const curaBadgeDistanceCss = ":host .container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:calc(var(--base-spacing) *
|
|
8301
|
+
const curaBadgeDistanceCss = ":host .container{display:flex;flex-direction:column;justify-content:center;align-items:center;width:calc(var(--base-spacing) * 10px);height:calc(var(--base-spacing) * 10px);border-radius:calc(var(--base-spacing) * 1px);background:var(--neutral-pale)}";
|
|
8253
8302
|
var CuraBadgeDistanceStyle0 = curaBadgeDistanceCss;
|
|
8254
8303
|
|
|
8255
8304
|
class CuraDistance {
|
|
@@ -8299,7 +8348,7 @@ class CuraDistance {
|
|
|
8299
8348
|
}; }
|
|
8300
8349
|
}
|
|
8301
8350
|
|
|
8302
|
-
const curaDropdownSearchCss = ":host{display:block;width:100%;box-sizing:border-box}.dropdown{display:flex;position:relative;flex-direction:column;width:inherit}.dropdown .dropdown-search-list{z-index:1000}.dropdown-input-search{width:100%;display:flex;justify-content:center;align-items:center;background:transparent}.dropdown-input-search.dropdown-open ::part(cura-input-field){border-radius:4px 4px 0px 0px}.dropdown-input-search.dropdown-open ::slotted([slot=helperText]){display:none}.dropdown-input-search.dropdown-open cura-input-text ::slotted([slot=helperText]){display:none}.dropdown-search-list{position:absolute;top:calc(100% - 8px);width:100%;max-height:var(--dropdown-max-height);padding:12px 12px;margin:0;box-sizing:border-box;box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16));border-radius:0px 0px 4px 4px;border-top:0 var(--neutral-light);border-right:2px solid var(--neutral-light);border-bottom:2px solid var(--neutral-light);border-left:2px solid var(--neutral-light);background-color:var(--neutral-purewhite);list-style:none;overflow-y:auto;display:none}.dropdown-search-list.visible{display:block}.dropdown-search-list-input-search{width:inherit;display:flex;justify-content:center;align-items:center;padding:16px 8px;border-bottom:2px solid var(--info-base);background-color:var(--neutral-purewhite)}.dropdown-search-list-input-search cura-input-text{width:inherit}.dropdown-search-list-input-search.error{background-color:var(--error-lighter);border-bottom:2px solid var(--error-dark)}.dropdown-mobile{position:fixed;top:1%;left:0;right:0;width:100%;z-index:10000}.dropdown-mobile .dropdown-input-search{display:flex;
|
|
8351
|
+
const curaDropdownSearchCss = ":host{display:block;width:100%;box-sizing:border-box}.dropdown{display:flex;position:relative;flex-direction:column;width:inherit}.dropdown .dropdown-search-list{z-index:1000}.dropdown-input-search{width:100%;display:flex;justify-content:center;align-items:center;background:transparent}.dropdown-input-search.dropdown-open ::part(cura-input-field){border-radius:4px 4px 0px 0px}.dropdown-input-search.dropdown-open ::slotted([slot=helperText]){display:none}.dropdown-input-search.dropdown-open cura-input-text ::slotted([slot=helperText]){display:none}.dropdown-search-list{position:absolute;top:calc(100% - 8px);width:100%;max-height:var(--dropdown-max-height);padding:12px 12px;margin:0;box-sizing:border-box;box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16));border-radius:0px 0px 4px 4px;border-top:0 var(--neutral-light);border-right:2px solid var(--neutral-light);border-bottom:2px solid var(--neutral-light);border-left:2px solid var(--neutral-light);background-color:var(--neutral-purewhite);list-style:none;overflow-y:auto;display:none}.dropdown-search-list.visible{display:block}.dropdown-search-list-input-search{width:inherit;display:flex;justify-content:center;align-items:center;padding:16px 8px;border-bottom:2px solid var(--info-base);background-color:var(--neutral-purewhite)}.dropdown-search-list-input-search cura-input-text{width:inherit}.dropdown-search-list-input-search.error{background-color:var(--error-lighter);border-bottom:2px solid var(--error-dark)}.dropdown-mobile{position:fixed;top:1%;left:0;right:0;width:100%;z-index:10000}.dropdown-mobile .dropdown-input-search{display:flex;background-color:var(--neutral-purewhite);border-bottom:2px solid var(--info-base);z-index:10000}.dropdown-mobile .dropdown-input-search cura-button-transparent{display:flex;margin-right:4px}.dropdown-mobile .dropdown-input-search cura-input-text{padding:12px 8px 12px 0px}.dropdown-mobile .dropdown-input-search.error{background-color:var(--error-lighter);border-bottom:2px solid var(--error-dark)}.dropdown-mobile .dropdown-input-search.dropdown-open{display:flex}.dropdown-mobile .dropdown-input-search.dropdown-open ::slotted([slot=helperText]){display:block}.dropdown-mobile .dropdown-search-list{position:static;width:100%;height:calc(100vh - var(--dynamic-input-search-height, 0));max-height:none;padding:12px 12px;margin:0;box-sizing:border-box;box-shadow:none;border:none;background-color:var(--neutral-purewhite);list-style:none;overflow-y:auto;z-index:10000}";
|
|
8303
8352
|
var CuraDropdownSearchStyle0 = curaDropdownSearchCss;
|
|
8304
8353
|
|
|
8305
8354
|
class CuraDropdownSearch {
|
|
@@ -8309,16 +8358,14 @@ class CuraDropdownSearch {
|
|
|
8309
8358
|
this.onselect = createEvent(this, "onselect", 7);
|
|
8310
8359
|
this.overlayElement = null;
|
|
8311
8360
|
this.adjustInputPosition = () => {
|
|
8312
|
-
|
|
8313
|
-
|
|
8314
|
-
|
|
8315
|
-
|
|
8316
|
-
|
|
8317
|
-
|
|
8318
|
-
|
|
8319
|
-
|
|
8320
|
-
}
|
|
8321
|
-
});
|
|
8361
|
+
var _a, _b;
|
|
8362
|
+
const isKeyboardOpen = (window === null || window === void 0 ? void 0 : window.innerHeight) < this.screenDefaultHeight;
|
|
8363
|
+
const dropdown = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dropdown-mobile');
|
|
8364
|
+
if (dropdown) {
|
|
8365
|
+
dropdown.style.position = isKeyboardOpen ? 'absolute' : 'fixed';
|
|
8366
|
+
dropdown.style.bottom = isKeyboardOpen ? `${((_b = window === null || window === void 0 ? void 0 : window.screen) === null || _b === void 0 ? void 0 : _b.height) - (window === null || window === void 0 ? void 0 : window.innerHeight)}px` : '0';
|
|
8367
|
+
window.scroll({ top: 0, left: 0, behavior: 'smooth' });
|
|
8368
|
+
}
|
|
8322
8369
|
};
|
|
8323
8370
|
this.handleSlotChange = () => {
|
|
8324
8371
|
this.options = Array.from(this.host.querySelectorAll('cura-dropdown-search-option'));
|
|
@@ -8360,6 +8407,10 @@ class CuraDropdownSearch {
|
|
|
8360
8407
|
}
|
|
8361
8408
|
}
|
|
8362
8409
|
};
|
|
8410
|
+
this.setUp = () => {
|
|
8411
|
+
this.handleResize();
|
|
8412
|
+
this.adjustInputPosition();
|
|
8413
|
+
};
|
|
8363
8414
|
this.size = 'large';
|
|
8364
8415
|
this.status = 'default';
|
|
8365
8416
|
this.disabled = false;
|
|
@@ -8381,6 +8432,7 @@ class CuraDropdownSearch {
|
|
|
8381
8432
|
this.hoveredIndex = -1;
|
|
8382
8433
|
this.options = [];
|
|
8383
8434
|
this.originalOverflow = '';
|
|
8435
|
+
this.screenDefaultHeight = 0;
|
|
8384
8436
|
}
|
|
8385
8437
|
connectedCallback() {
|
|
8386
8438
|
this.weights = window.CuraAPI.theme.fonts.getWeights();
|
|
@@ -8413,12 +8465,15 @@ class CuraDropdownSearch {
|
|
|
8413
8465
|
}
|
|
8414
8466
|
}
|
|
8415
8467
|
componentDidLoad() {
|
|
8416
|
-
|
|
8417
|
-
|
|
8468
|
+
var _a;
|
|
8469
|
+
this.screenDefaultHeight = window === null || window === void 0 ? void 0 : window.innerHeight;
|
|
8470
|
+
window === null || window === void 0 ? void 0 : window.addEventListener('resize', this.setUp);
|
|
8471
|
+
(_a = window === null || window === void 0 ? void 0 : window.visualViewport) === null || _a === void 0 ? void 0 : _a.addEventListener('resize', this.adjustInputPosition);
|
|
8418
8472
|
}
|
|
8419
8473
|
disconnectedCallback() {
|
|
8420
|
-
|
|
8421
|
-
window.removeEventListener('resize', this.
|
|
8474
|
+
var _a;
|
|
8475
|
+
window === null || window === void 0 ? void 0 : window.removeEventListener('resize', this.setUp);
|
|
8476
|
+
(_a = window === null || window === void 0 ? void 0 : window.visualViewport) === null || _a === void 0 ? void 0 : _a.removeEventListener('resize', this.adjustInputPosition);
|
|
8422
8477
|
}
|
|
8423
8478
|
showOverlay() {
|
|
8424
8479
|
if (!this.overlayElement) {
|
|
@@ -8445,7 +8500,7 @@ class CuraDropdownSearch {
|
|
|
8445
8500
|
}
|
|
8446
8501
|
addClickListenersToOptions() {
|
|
8447
8502
|
this.options.forEach((option, index) => {
|
|
8448
|
-
option.addEventListener('optionSelected', () => this.onSelectedOption(index));
|
|
8503
|
+
option === null || option === void 0 ? void 0 : option.addEventListener('optionSelected', () => this.onSelectedOption(index));
|
|
8449
8504
|
});
|
|
8450
8505
|
}
|
|
8451
8506
|
updateSelectedOption(value) {
|
|
@@ -8453,7 +8508,7 @@ class CuraDropdownSearch {
|
|
|
8453
8508
|
this.hoveredIndex = selectedOptionIndex;
|
|
8454
8509
|
this.updateOptionAttribute('hovered', this.hoveredIndex);
|
|
8455
8510
|
this.updateOptionAttribute('selected', this.hoveredIndex);
|
|
8456
|
-
this.
|
|
8511
|
+
this.scrollHoveredOptionIntoView();
|
|
8457
8512
|
this.adjustInputPosition();
|
|
8458
8513
|
}
|
|
8459
8514
|
onSelectedOption(index) {
|
|
@@ -8473,7 +8528,7 @@ class CuraDropdownSearch {
|
|
|
8473
8528
|
const newIndex = (this.hoveredIndex + direction + visibleOptions.length) % visibleOptions.length;
|
|
8474
8529
|
this.hoveredIndex = newIndex;
|
|
8475
8530
|
this.updateOptionAttribute('hovered', this.hoveredIndex);
|
|
8476
|
-
this.
|
|
8531
|
+
this.scrollHoveredOptionIntoView();
|
|
8477
8532
|
}
|
|
8478
8533
|
updateOptionAttribute(attribute, indexToUpdate) {
|
|
8479
8534
|
this.options.forEach((option, index) => {
|
|
@@ -8485,7 +8540,7 @@ class CuraDropdownSearch {
|
|
|
8485
8540
|
const currentValue = this.value;
|
|
8486
8541
|
this.hoveredIndex = visibleOptions.findIndex(option => option.getAttribute('value') === currentValue);
|
|
8487
8542
|
}
|
|
8488
|
-
|
|
8543
|
+
scrollHoveredOptionIntoView() {
|
|
8489
8544
|
var _a;
|
|
8490
8545
|
const container = (_a = this.host.shadowRoot) === null || _a === void 0 ? void 0 : _a.querySelector('.dropdown-search-list');
|
|
8491
8546
|
const hoveredOption = this.options[this.hoveredIndex];
|
|
@@ -8552,9 +8607,9 @@ class CuraDropdownSearch {
|
|
|
8552
8607
|
}
|
|
8553
8608
|
render() {
|
|
8554
8609
|
const isMobileDropdown = this.isMobile && this.isDropdownOpen;
|
|
8555
|
-
return (hAsync(Host, { key: '
|
|
8610
|
+
return (hAsync(Host, { key: 'b65367e4fa490b0dff8616bb9d82665bf3bb6f2b', style: this.hostCSSProperties(), class: "dropdown-overlay" }, hAsync("div", { key: 'ab7e1b6038a6dfa6b707bc97f225d68ed97bdc07', class: `dropdown ${isMobileDropdown ? 'dropdown-mobile' : ''}`, style: this.styles }, hAsync("div", { key: '7e3ab85750a9d868fa789d1f1841c0a907b8948c', class: this.getClasses() }, this.isMobile && this.isDropdownOpen && (hAsync("cura-button-transparent", { key: 'f171dceed48f41ad15736cbb358a1ffa6288d261', fontColor: "dark", onClick: () => this.handleGoBack(), iconName: "arrowLeft", size: "medium", iconOnly: true, color: "primary" })), hAsync("cura-input-text", { key: '53e7aa39324cc7c4ce52388f80823d0fb144d4e0', disabled: this.disabled, label: this.label, part: "cura-input-field", mode: isMobileDropdown ? 'transparent' : 'default', required: this.required, hideErrorIcon: this.status === 'error', iconName: this.iconName || 'search', value: this.value, status: this.status, onValueChange: e => this.onValueChange(e.target.value), onInput: e => this.handleInputChange(e), onFocus: () => this.handleOnFocus(), onClick: () => (window.innerWidth < 768 ? (this.isMobile = true) : null), onBlur: () => {
|
|
8556
8611
|
this.handleOnBlur();
|
|
8557
|
-
}, placeholder: this.placeholder, size: this.size, onKeyDown: this.handleKeyDown }, hAsync("slot", { key: '
|
|
8612
|
+
}, placeholder: this.placeholder, size: this.size, onKeyDown: this.handleKeyDown }, hAsync("slot", { key: '0fec269301bc1aa23978ec2b52adb856e9e8f17d', name: "helperText" }))), hAsync("div", { key: 'a6060851435b1da0bac0adb2445bfb90000c17d7', id: "dropdown-search-list", class: this.getDropdownClasses() }, hAsync("slot", { key: '5443c23f1279be7243a27fccb39aa9ce35452b99', name: "dropdown-search-option", onSlotchange: this.handleSlotChange })))));
|
|
8558
8613
|
}
|
|
8559
8614
|
get host() { return getElement(this); }
|
|
8560
8615
|
static get watchers() { return {
|
|
@@ -8585,7 +8640,8 @@ class CuraDropdownSearch {
|
|
|
8585
8640
|
"isOnBlurInput": [32],
|
|
8586
8641
|
"hoveredIndex": [32],
|
|
8587
8642
|
"options": [32],
|
|
8588
|
-
"originalOverflow": [32]
|
|
8643
|
+
"originalOverflow": [32],
|
|
8644
|
+
"screenDefaultHeight": [32]
|
|
8589
8645
|
},
|
|
8590
8646
|
"$listeners$": undefined,
|
|
8591
8647
|
"$lazyBundleId$": "-",
|
|
@@ -8635,12 +8691,12 @@ class CuraDropdownSearchOption {
|
|
|
8635
8691
|
}
|
|
8636
8692
|
}
|
|
8637
8693
|
render() {
|
|
8638
|
-
return (hAsync(Host, { key: '
|
|
8694
|
+
return (hAsync(Host, { key: '515f662d5fb08cd77e7ad24de425ec34497e5e6e', slot: "dropdown-search-option" }, hAsync("div", { key: '8decccf2416ae3ea135bba38845da2a63c9cfdce', style: this.styles, class: {
|
|
8639
8695
|
"option-container": true,
|
|
8640
8696
|
hovered: this.selectable ? this.hovered : false,
|
|
8641
8697
|
selected: this.selected,
|
|
8642
8698
|
disabled: !this.selectable
|
|
8643
|
-
} }, hAsync("div", { key: '
|
|
8699
|
+
} }, hAsync("div", { key: '8c3cce88d40c764ae87cf8c54e3fb9fe9651f62d', class: "content-container" }, hAsync("div", { key: '1c674ff6a3721c42e034b994bf903d8608100cb8', class: "option-info", onClick: (e) => this.handleOptionClick(e) }, hAsync("slot", { key: '7a6545a242da0774b74a403b2dc26ce378d146fd', name: "image" }), hAsync("cura-heading", { key: '860fede2f20748b5e15ddf3222cd0c6ce3ff1f8c', size: "xsmall", lineHeight: "16px", marginBlock: "0px", weight: "bold", color: "neutral-black" }, hAsync("slot", { key: 'e9a7610e2d561cb399d58c44f98fb9ea0e6cf5c6' }))), hAsync("slot", { key: 'c784f7cddd4d5e246126ef43ab08e82db51fc2be', name: "action" })))));
|
|
8644
8700
|
}
|
|
8645
8701
|
get hostElement() { return getElement(this); }
|
|
8646
8702
|
static get watchers() { return {
|
|
@@ -8671,7 +8727,7 @@ class CuraDropdownSearchOptionTitle {
|
|
|
8671
8727
|
registerInstance(this, hostRef);
|
|
8672
8728
|
}
|
|
8673
8729
|
render() {
|
|
8674
|
-
return (hAsync(Host, { key: '
|
|
8730
|
+
return (hAsync(Host, { key: 'b378a877e6a90727e3216c284c2a064992f2dfc9', slot: "dropdown-search-option" }, hAsync("cura-label", { key: 'e2d457a7d42bcacae09012322b19a54e44fb109f', color: "neutral-dark", size: "xsmall", lineHeight: "16px", marginBlock: "0" }, hAsync("slot", { key: 'e889fa1839988a0f138e14ad15b0e250100ba38c' }))));
|
|
8675
8731
|
}
|
|
8676
8732
|
static get style() { return CuraDropdownSearchOptionTitleStyle0; }
|
|
8677
8733
|
static get cmpMeta() { return {
|
|
@@ -8751,7 +8807,7 @@ class CuraHeading {
|
|
|
8751
8807
|
return tags[`${this.level}`] || tags['default'];
|
|
8752
8808
|
}
|
|
8753
8809
|
render() {
|
|
8754
|
-
return (hAsync(Host, { key: '
|
|
8810
|
+
return (hAsync(Host, { key: '6384b5f7302399cca695c7c51d403ee704c95a48', style: this.hostCSSProperties() }, this.getHeadingTag()));
|
|
8755
8811
|
}
|
|
8756
8812
|
get host() { return getElement(this); }
|
|
8757
8813
|
static get watchers() { return {
|
|
@@ -8823,7 +8879,7 @@ class CuraIcon {
|
|
|
8823
8879
|
this.host.style.setProperty(prop, value);
|
|
8824
8880
|
}
|
|
8825
8881
|
render() {
|
|
8826
|
-
return (hAsync(Host, { key: '
|
|
8882
|
+
return (hAsync(Host, { key: '09f68d2b455427bf45dca2e6b30e993ebfa6b3a0' }, hAsync("svg", { key: 'f15fea7564efac510263f06f8d15288fec004f66', version: "1.1", viewBox: "0 0 24 24", preserveAspectRatio: "xMidYMid meet", xmlns: "http://www.w3.org/2000/svg" }, hAsync("use", { key: 'b88136d10453dc9e1d2c41ceb10676b348430ae3', xlinkHref: `${this.assetsPath}/icons/iconset-${this.iconset}.svg#${this.name}` }))));
|
|
8827
8883
|
}
|
|
8828
8884
|
get host() { return getElement(this); }
|
|
8829
8885
|
static get watchers() { return {
|
|
@@ -8867,7 +8923,7 @@ class CuraIconsView {
|
|
|
8867
8923
|
this.sizes.unshift(this.sizes.pop());
|
|
8868
8924
|
}
|
|
8869
8925
|
render() {
|
|
8870
|
-
return (hAsync(Host, { key: '
|
|
8926
|
+
return (hAsync(Host, { key: '4918bc5d13f24f3133af45ce5991b3f3f43e99cf' }, hAsync("div", { key: '837d47976a39702b13ceb5a7c5ac8ae097d34988', class: "iconDetail" }, hAsync("cura-heading", { key: 'de4c75c4652b464991aa173cf7243db65f9ba2ba', size: "small", "margin-block": "0 24px" }, "Icon: ", hAsync("b", { key: '77591ce199e5140ddcde3d7b956586d27fe6bc05' }, this.selected)), hAsync("div", { key: '6da36b174603d48ab3b11a8490c424f164855147', class: "iconSizes" }, this.sizes.map(size => hAsync("div", { class: "size" }, hAsync("cura-icon", { name: this.selected, size: size }), hAsync("span", null, size)))), hAsync("div", { key: '4920c8010e0a55f80bb557f4ba0e537b7861ae36', class: "iconSizes invert" }, this.sizes.map(size => hAsync("div", { class: "size" }, hAsync("cura-icon", { name: this.selected, size: size, color: "neutral-white" }), hAsync("span", null, size))))), hAsync("div", { key: '99739b351fb25036efd4b55774c0f077058be8fc', class: "icons" }, iconsetdefaulticons.map(icon => hAsync("div", { class: { icon: true, selected: icon === this.selected }, onClick: () => this.setSelected(icon) }, hAsync("cura-icon", { name: icon, size: "32", color: icon === this.selected ? 'accent-dark' : 'neutral-dark' }), hAsync("cura-label", { size: "xsmall", weight: icon === this.selected ? 'bold' : 'regular', color: icon === this.selected ? 'accent-dark' : 'neutral-dark' }, icon))))));
|
|
8871
8927
|
}
|
|
8872
8928
|
static get style() { return CuraIconsViewStyle0; }
|
|
8873
8929
|
static get cmpMeta() { return {
|
|
@@ -9050,7 +9106,7 @@ class CuraInputDate {
|
|
|
9050
9106
|
}
|
|
9051
9107
|
}
|
|
9052
9108
|
render() {
|
|
9053
|
-
return (hAsync(Host, { key: '
|
|
9109
|
+
return (hAsync(Host, { key: '1395108764c1957abb9371b82ab983d076aaf61e' }, hAsync("div", { key: 'e3134a1cfbf6f07b83f148b3e1b9c699e273a098', class: "container", style: this.styles }, hAsync("cura-input-text", { key: '507ce8cedd5a169832579ae3ea313d3b3d6813d2', label: this.label, name: this.name, status: this.status, value: this.value, onFocus: () => this.showCalendar(), size: this.size, "icon-name": this.iconName, placeholder: this.dateSettings.placeholder, "mask-preset": this.dateSettings.mask, "enable-selection-mode": true, onKeyUp: event => this.handleInputDates(event), autocomplete: "off", onValueChange: event => this.handleChangeDates(event) }, this.renderCalendarOrHelperText()))));
|
|
9054
9110
|
}
|
|
9055
9111
|
static get formAssociated() { return true; }
|
|
9056
9112
|
get el() { return getElement(this); }
|
|
@@ -13125,7 +13181,7 @@ class CuraLabel {
|
|
|
13125
13181
|
};
|
|
13126
13182
|
}
|
|
13127
13183
|
render() {
|
|
13128
|
-
return (hAsync(Host, { key: '
|
|
13184
|
+
return (hAsync(Host, { key: '0155daf05e29fca75db8d8b8b103a4d3b60c1bc9', style: this.hostCSSProperties() }, hAsync("p", { key: 'cd63e97738f18f2842e3f6e3a0d086dd0c240651', style: this.styles, class: this.getClasses() }, hAsync("slot", { key: 'e20da850c970c10f03f832d59db1050f2329c856' }))));
|
|
13129
13185
|
}
|
|
13130
13186
|
get host() { return getElement(this); }
|
|
13131
13187
|
static get watchers() { return {
|
|
@@ -13172,7 +13228,7 @@ class CuraLoaderBar {
|
|
|
13172
13228
|
this.setProgress();
|
|
13173
13229
|
}
|
|
13174
13230
|
render() {
|
|
13175
|
-
return (hAsync(Host, { key: '
|
|
13231
|
+
return (hAsync(Host, { key: '4dc7ef7b17bfb408fa7ff9a74509637bb9045353' }, hAsync("div", { key: 'cd2654377f0b45c5b6fa6aa57940f5d81cfd0cce', id: "progress-bar", class: "progress-bar", style: this.styles }, hAsync("span", { key: '5d7b4a058162b840f167adb81843403f6c488c4e', class: "progress-bar-fill" }))));
|
|
13176
13232
|
}
|
|
13177
13233
|
setColor() {
|
|
13178
13234
|
this.styles = Object.assign(Object.assign({}, this.styles), { '--neutral-base': window.CuraAPI.theme.colors.getColor(`neutral-base`, 0.2), '--color-base': window.CuraAPI.theme.colors.getColor(this.color) });
|
|
@@ -13224,7 +13280,7 @@ class CuraLoaderCircle {
|
|
|
13224
13280
|
};
|
|
13225
13281
|
}
|
|
13226
13282
|
render() {
|
|
13227
|
-
return (hAsync(Host, { key: '
|
|
13283
|
+
return (hAsync(Host, { key: '627023f3e413d6a28e802eaf011f0ca39ccc17d9', style: this.getStyles() }, hAsync("svg", { key: '1f7dab1ef6e82d81ffacf336660c508c039e7430', viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, hAsync("g", { key: '4baeff0f8c83335be93cd067dbed2cfa5d0be88a' }, hAsync("circle", { key: '7929b1120288af1f17976a69463bf8965f2e4fae', cx: "8", cy: "8", r: "7", stroke: "url(#paint0_linear_13485_11488)", "stroke-width": "2" }), hAsync("path", { key: '832582680715bedebca8f025d141d40785832a86', d: "M1 8C1 4.13401 4.11877 1 7.96596 1C9.53445 1 10.9819 1.52093 12.1462 2.4C12.8959 2.96601 13.5282 3.68049 14 4.5", "stroke-width": "2" })), hAsync("defs", { key: 'ad393945da8c664faed05c17ed1c51cae3a02edb' }, hAsync("linearGradient", { key: 'bf42d208d369c60bbdad5adf81c4c61144ad34eb', id: "paint0_linear_13485_11488", x1: "15.7", y1: "4.5", x2: "4.15", y2: "11.5", gradientUnits: "userSpaceOnUse" }, hAsync("stop", { key: '445c119c6cebcfb057826ebd090b883aa479a8cd' }), hAsync("stop", { key: '47555985163574e69556490d1d09c6283d31845c', offset: "1" }))))));
|
|
13228
13284
|
}
|
|
13229
13285
|
static get style() { return CuraLoaderCircleStyle0; }
|
|
13230
13286
|
static get cmpMeta() { return {
|
|
@@ -13240,7 +13296,7 @@ class CuraLoaderCircle {
|
|
|
13240
13296
|
}; }
|
|
13241
13297
|
}
|
|
13242
13298
|
|
|
13243
|
-
const curaModalCss = ":host{display:block}.modal{position:fixed;height:100%;width:100%;top:var(--top-offset);bottom:var(--bottom-offset);left:var(--left-offset);right:var(--right-offset);z-index:-1;margin-top:var(--offset-top)}.modal.open{z-index:
|
|
13299
|
+
const curaModalCss = ":host{display:block}.modal{position:fixed;height:100%;width:100%;top:var(--top-offset);bottom:var(--bottom-offset);left:var(--left-offset);right:var(--right-offset);z-index:-1;margin-top:var(--offset-top)}.modal.open{z-index:var(--zIndex)}.modal.open .backdrop,.modal.open .wrapper{opacity:1;visibility:visible;animation:fadeIn 0.3s ease-out}.container{display:flex;align-items:center;justify-content:center}.backdrop,.wrapper{opacity:0;visibility:hidden;transition:opacity 0.3s ease, visibility 0.3s ease}.backdrop{background-color:var(--background-color);z-index:calc(var(--zIndex) - 10);animation:fadeIn 0.3s ease-out}.wrapper{position:fixed;background-color:var(--neutral-white);border:2px solid var(--neutral-light);border-radius:calc(var(--base-spacing) * 3px);width:700px;max-width:600px;min-width:200px;padding:0px calc(var(--base-spacing) * 4px) calc(var(--base-spacing) * 4px) calc(var(--base-spacing) * 4px);z-index:var(--zIndex);box-shadow:0px 8px 16px 0px var(--neutral-black-shadow-4, rgba(38, 38, 38, 0.12));transform:scale(0.95);transition:transform 0.3s ease-out, opacity 0.3s ease, visibility 0.3s ease}.wrapper ::slotted(*){max-height:80vh;overflow:auto;padding-right:calc(var(--base-spacing) * 5px)}.modal.open .wrapper{transform:scale(1);opacity:1;visibility:visible}.close{justify-self:flex-end;padding-top:calc(var(--base-spacing) * 4px);background:none;border:none;cursor:pointer}.close.mobile{display:none}.close.desktop{display:flex}@media (max-width: 768px){.wrapper{position:fixed;bottom:0px;width:80%;padding-top:calc(var(--base-spacing) * 4px);padding-bottom:0px;border-radius:calc(var(--base-spacing) * 3px) calc(var(--base-spacing) * 3px) 0px 0px;border-bottom:none}.close{align-items:center;border-top:1px dashed var(--neutral-light);margin-top:calc(var(--base-spacing) * 4px);padding:calc(var(--base-spacing) * 4px) 0px;justify-content:center;width:100%}.close.mobile{display:flex;gap:calc(var(--base-spacing) * 2px)}.close.desktop{display:none}}@keyframes fadeIn{from{opacity:0}to{opacity:1}}@keyframes fadeOut{from{opacity:1}to{opacity:0}}";
|
|
13244
13300
|
var CuraModalStyle0 = curaModalCss;
|
|
13245
13301
|
|
|
13246
13302
|
class CuraModal {
|
|
@@ -13257,6 +13313,8 @@ class CuraModal {
|
|
|
13257
13313
|
this.bottom = 0;
|
|
13258
13314
|
this.left = 0;
|
|
13259
13315
|
this.right = 0;
|
|
13316
|
+
this.mobileCloseLabel = 'Fechar';
|
|
13317
|
+
this.zindex = '100';
|
|
13260
13318
|
this.styles = {};
|
|
13261
13319
|
}
|
|
13262
13320
|
setColors() {
|
|
@@ -13290,7 +13348,7 @@ class CuraModal {
|
|
|
13290
13348
|
this.setRight();
|
|
13291
13349
|
}
|
|
13292
13350
|
render() {
|
|
13293
|
-
return (hAsync(Host, { key: '
|
|
13351
|
+
return (hAsync(Host, { key: '50f4146aed5392ae16803fb060d4921a5e8a3271', role: "dialog", "aria-modal": "true", style: { '--zIndex': this.zindex } }, hAsync("div", { key: '149e99a4b8b479515ed3d67c5c8aea08d4d96d1c', class: this.open ? 'modal container open' : 'modal container', style: this.styles }, hAsync("div", { key: 'f32f7f7e16475c51babf95e1ca5f4fea449c1bb0', class: this.open ? 'modal backdrop open' : 'modal backdrop', onClick: this.handleClose }), hAsync("div", { key: '183f7ab8f2cee8106795f6104c38a2c93272387f', class: "wrapper" }, hAsync("button", { key: '28778c8120c92dfcae0443dccd21f55a204bd82e', class: "close desktop", onClick: this.handleClose }, hAsync("cura-icon", { key: 'a847de5c1314ea1460673870334f3f98e98f1cf9', name: "close", color: "error-dark", size: "small" })), hAsync("slot", { key: 'e08b556b7232425c2b83a21dac75d30fb4361a83' }), hAsync("button", { key: 'e736a95f878ff5a2ad6897d9140fd74b26939445', class: "close mobile", onClick: this.handleClose }, hAsync("cura-icon", { key: '9eaeaca6f4ea9d3cde5fd44e108de389c727f991', name: "close", color: "error-dark", size: "16" }), hAsync("cura-paragraph", { key: '2476b85e5dd7d6092d3d1d1714ee4a79b73b12d0', color: "error-dark", size: "small", marginBlock: "0" }, this.mobileCloseLabel))))));
|
|
13294
13352
|
}
|
|
13295
13353
|
static get watchers() { return {
|
|
13296
13354
|
"background": ["setColors"],
|
|
@@ -13310,11 +13368,13 @@ class CuraModal {
|
|
|
13310
13368
|
"bottom": [2],
|
|
13311
13369
|
"left": [2],
|
|
13312
13370
|
"right": [2],
|
|
13371
|
+
"mobileCloseLabel": [513, "mobile-close-label"],
|
|
13372
|
+
"zindex": [513],
|
|
13313
13373
|
"styles": [32]
|
|
13314
13374
|
},
|
|
13315
13375
|
"$listeners$": undefined,
|
|
13316
13376
|
"$lazyBundleId$": "-",
|
|
13317
|
-
"$attrsToReflect$": [["open", "open"]]
|
|
13377
|
+
"$attrsToReflect$": [["open", "open"], ["mobileCloseLabel", "mobile-close-label"], ["zindex", "zindex"]]
|
|
13318
13378
|
}; }
|
|
13319
13379
|
}
|
|
13320
13380
|
|
|
@@ -13337,7 +13397,7 @@ class CuraPageTemplate {
|
|
|
13337
13397
|
return classes;
|
|
13338
13398
|
}
|
|
13339
13399
|
render() {
|
|
13340
|
-
return (hAsync(Host, { key: '
|
|
13400
|
+
return (hAsync(Host, { key: '9f26fb8ceb8b22ed9223bd215c07b6a19f6d78f1' }, hAsync("div", { key: '38541ca9be4feecb9911c96cc954ba7501dc9b5e', style: this.styles, class: "grid-template" }, hAsync("div", { key: 'daf436a589d75bb270f4b16230d1db1d7365c47e', id: "sub-header" }, hAsync("slot", { key: '547c858a5913c600c1b745f400319d207a04c7ce', name: 'sub-header' })), hAsync("div", { key: 'ba69ae91e87af01a8001a347f6de7d8ba7088619', id: "header" }, hAsync("slot", { key: '6f72885d42d005f234942f2cbf8eefd98f4d0241', name: 'header' })), hAsync("div", { key: 'd21dbb37e236b1b22e886a036a37fb2e65e538f3', id: "pre-content" }, hAsync("slot", { key: '31b14b314d1ee2672f15883ea4bcc3c542520558', name: 'pre-content' })), hAsync("div", { key: 'a1297f482f15b4947043401b25e2c4ecbedd31fd', id: "content-container", class: this.getClasses() }, hAsync("div", { key: '9c0c466a46c5fc81c64663dd0aff4e073cc6cb72', id: "sidebar-left" }, hAsync("slot", { key: '10364527d218b1c05064095a5a69a411cb23322a', name: 'sidebar-left' })), hAsync("div", { key: '23029f84833a0959f43f30b4dcc5d8bc08a0bf05', id: "content" }, hAsync("slot", { key: '8dbcf34f4808d0983df99c77b52f927b8f1a69d7', name: "content" }), hAsync("slot", { key: '6a235586dfb316c6449d531a566940d8de4e4a40' })), hAsync("div", { key: 'b88f94db774c17aaa312ca55c9e67d611cabace3', id: "sidebar-right" }, hAsync("slot", { key: '5efbbf777d7acb28e91f4dace10558926dafef60', name: 'sidebar-right' }))), hAsync("div", { key: 'f40b983f2266e565faba96e8906cd69073b6598c', id: "post-body" }, hAsync("slot", { key: 'd0f047c73b5b777f1eb9d61191bf172473c100cf', name: 'post-body' })), hAsync("div", { key: 'b54482672a8017036b060203b5426bb2897c75fa', id: "footer" }, hAsync("slot", { key: '4c65d471dcd2dfabc32e163cb9575f3d05fb2cda', name: 'footer' })), hAsync("div", { key: '24c5d5a19e6d3fb943a1e99a7dfcfe9ad7cbb283', id: "sub-footer" }, hAsync("slot", { key: '6f595500cac9906db6902685f172feaa7ee9e711', name: 'sub-footer' })))));
|
|
13341
13401
|
}
|
|
13342
13402
|
get host() { return getElement(this); }
|
|
13343
13403
|
static get style() { return CuraPageTemplateStyle0; }
|
|
@@ -13403,7 +13463,7 @@ class CuraParagraph {
|
|
|
13403
13463
|
};
|
|
13404
13464
|
}
|
|
13405
13465
|
render() {
|
|
13406
|
-
return (hAsync(Host, { key: '
|
|
13466
|
+
return (hAsync(Host, { key: '2ca388b3d1c31588765768ece303decb6e421a81', style: this.hostCSSProperties() }, hAsync("p", { key: '1f31f6b9831cceed88606754581f282a515e3598', style: this.styles, class: this.setsizeClass() }, hAsync("slot", { key: 'f50ffaf10f933daac9e2ae901556bbfc62ac8a72' }))));
|
|
13407
13467
|
}
|
|
13408
13468
|
get host() { return getElement(this); }
|
|
13409
13469
|
static get watchers() { return {
|
|
@@ -13428,6 +13488,42 @@ class CuraParagraph {
|
|
|
13428
13488
|
}; }
|
|
13429
13489
|
}
|
|
13430
13490
|
|
|
13491
|
+
const curaProgressBarCss = ":host{display:block;box-sizing:border-box}.progress-bar{position:relative;display:flex;align-items:center;justify-content:center}.progress-bar span{position:absolute;display:flex}";
|
|
13492
|
+
var CuraProgressBarStyle0 = curaProgressBarCss;
|
|
13493
|
+
|
|
13494
|
+
class CuraProgressBar {
|
|
13495
|
+
constructor(hostRef) {
|
|
13496
|
+
registerInstance(this, hostRef);
|
|
13497
|
+
this.progressColor = undefined;
|
|
13498
|
+
this.progress = undefined;
|
|
13499
|
+
this.size = 40;
|
|
13500
|
+
this.strokeWidth = 3.25;
|
|
13501
|
+
this.active = undefined;
|
|
13502
|
+
}
|
|
13503
|
+
render() {
|
|
13504
|
+
const radius = (this.size - this.strokeWidth) / 2;
|
|
13505
|
+
const circumference = radius * Math.PI * 2;
|
|
13506
|
+
const dash = (this.progress * circumference) / 100;
|
|
13507
|
+
const viewBox = `0 0 ${this.size} ${this.size}`;
|
|
13508
|
+
return (hAsync(Host, { key: 'e0da7ede087161c67c9dd0371d15030dd5107a19' }, hAsync("div", { key: 'ebe68fb426b46e94b7d03ded4e8aaed852337f30', class: "progress-bar" }, hAsync("svg", { key: 'ace46878d45bfbe51dae29c3020d74f43c2f5147', width: this.size, height: this.size, viewBox: viewBox }, hAsync("circle", { key: 'dbbde61a95a7f13dc14a72fe538da43953852d7b', fill: "none", stroke: "#ccc", cx: this.size / 2, cy: this.size / 2, r: radius, "stroke-width": `${this.strokeWidth}px` }), this.active && (hAsync("circle", { key: '272c197451a47c73cfa91d7f7578a50b26958732', fill: "none", stroke: this.progressColor, cx: this.size / 2, cy: this.size / 2, r: radius, "stroke-width": `${this.strokeWidth}px`, transform: `rotate(-90 ${this.size / 2} ${this.size / 2})`, "stroke-dasharray": `${dash}px ${circumference - dash}px`, "stroke-linecap": "round", style: { transition: 'all 0.5s' } }))), hAsync("span", { key: 'a80f024e09fb54218fe97039459472855226c063' }, hAsync("slot", { key: '5683f5edd5b54bd852fc1036b284656bfda066c4' })))));
|
|
13509
|
+
}
|
|
13510
|
+
static get style() { return CuraProgressBarStyle0; }
|
|
13511
|
+
static get cmpMeta() { return {
|
|
13512
|
+
"$flags$": 9,
|
|
13513
|
+
"$tagName$": "cura-progress-bar",
|
|
13514
|
+
"$members$": {
|
|
13515
|
+
"progressColor": [513, "progress-color"],
|
|
13516
|
+
"progress": [514],
|
|
13517
|
+
"size": [514],
|
|
13518
|
+
"strokeWidth": [514, "stroke-width"],
|
|
13519
|
+
"active": [516]
|
|
13520
|
+
},
|
|
13521
|
+
"$listeners$": undefined,
|
|
13522
|
+
"$lazyBundleId$": "-",
|
|
13523
|
+
"$attrsToReflect$": [["progressColor", "progress-color"], ["progress", "progress"], ["size", "size"], ["strokeWidth", "stroke-width"], ["active", "active"]]
|
|
13524
|
+
}; }
|
|
13525
|
+
}
|
|
13526
|
+
|
|
13431
13527
|
const curaRadioCss = "@charset \"UTF-8\";:host{display:block;width:fit-content;box-sizing:border-box;}:host .container{display:flex;align-items:center;flex-direction:row-reverse;gap:var(--gap)}:host .position.container{flex-direction:row}:host .position .label-wrapper{justify-content:end}:host .position .message{text-align:right}:host .position .label{order:1}:host .info{display:flex;flex-direction:column}:host .label-wrapper{display:flex;justify-content:start;align-items:center;gap:5px}:host .control{width:fit-content;cursor:pointer;position:relative}:host .radio{margin:0;appearance:none;-webkit-appearance:none;-moz-appearance:none;border-radius:50%;border:2px solid var(--primary-base-neutral-medium);background:var(--neutral-purewhite);box-sizing:border-box;transition:border-color 0.3s;position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer;width:var(--size);height:var(--size);flex:0 0 var(--size)}:host .radio::after{content:\"\";background:var(--color-base-light);border-radius:50%;opacity:0;transition:opacity 0.3s;width:var(--size-after);height:var(--size-after)}:host .radio:focus{border-color:var(--info-base) !important}:host .success .radio{border-color:var(--success-base);background:var(--success-lighter)}:host .success .radio:hover{border-color:var(--success-base) !important}:host .success.checked .radio{border-color:var(--success-base)}:host .success.checked .radio::after{background:var(--success-base)}:host .success.checked .radio:hover{background:var(--success-lighter) !important;border-color:var(--success-base) !important}:host .success.checked .radio:hover::after{background:var(--success-base) !important}:host .error .radio{border-color:var(--error-base);background:var(--error-lighter)}:host .error .radio:hover{border-color:var(--error-base) !important}:host .error.checked .radio{border-color:var(--error-base)}:host .error.checked .radio::after{background:var(--error-base)}:host .error.checked .radio:hover{background:var(--error-lighter) !important;border-color:var(--error-base) !important}:host .error.checked .radio:hover::after{background:var(--error-base) !important}:host .checked .radio::after{opacity:1;background:var(--color-base)}:host .checked .radio{border-color:var(--color-dark)}:host .checked .radio:hover{border-color:var(--color-light) !important}:host .checked .radio:hover::after{background:var(--color-light)}:host .disabled .radio{background:var(--primary-base-neutral-white);border-color:var(--primary-darker-neutral-base);cursor:not-allowed}:host .disabled .radio::after{background:var(--neutral-lighter)}:host .disabled.checked .radio{border-color:var(--primary-base-neutral-base) !important;background:var(--primary-darker-neutral-white) !important}:host .disabled.checked .radio::after{background:var(--primary-base-neutral-base) !important}:host :not(.disabled):not(.checked) .radio:hover{border-color:var(--primary-base-neutral-dark)}";
|
|
13432
13528
|
var CuraRadioStyle0 = curaRadioCss;
|
|
13433
13529
|
|
|
@@ -13560,7 +13656,7 @@ class CuraRadio {
|
|
|
13560
13656
|
return statusColors[this.status][type];
|
|
13561
13657
|
}
|
|
13562
13658
|
render() {
|
|
13563
|
-
return (hAsync(Host, { key: '
|
|
13659
|
+
return (hAsync(Host, { key: 'eecc279b05da57162acf41d62bac48a00cc9d985' }, hAsync("div", { key: '279b6922349bf02b7e65065bcb98b9c824073516', class: this.getClasses(), style: this.styles }, hAsync("div", { key: 'a6a2de8f8d7e6efbca3aee079255451e448903a2', class: "info" }, hAsync("div", { key: '6d2733ca86d087031e1ec4fdea26d5906f695479', class: "label-wrapper" }, hAsync("cura-label", { key: '2c0c878411bb846ff7bcf24c385895f1d86b3022', class: "label", size: this.size === 'large' ? 'medium' : 'xsmall', color: this.assignColor('label') }, this.label), this.required && hAsync("cura-paragraph", { key: '07abc53858276dc6429381a0c658c562e1d05933', lineHeight: '0%', marginBlock: '0', color: "error-base" }, "* ")), hAsync("cura-label", { key: 'ab5c0451842242ee584f2d3b430b803498190118', color: this.assignColor('message'), size: "xsmall", class: "message" }, hAsync("slot", { key: '3673a0a1ecc7f9dfa6975bdddaf708ed8ad1b72d' }))), hAsync("input", { key: 'db602c601168ada1a5a375d3ef122d4f315fa256', type: "radio", class: `radio ${this.size.toLocaleLowerCase()}`, name: this.name, value: this.value, required: this.required, tabIndex: this.ontabindex, disabled: this.disabled, checked: this.checked, onClick: this.handleClick }))));
|
|
13564
13660
|
}
|
|
13565
13661
|
static get formAssociated() { return true; }
|
|
13566
13662
|
get host() { return getElement(this); }
|
|
@@ -13594,7 +13690,7 @@ class CuraRadio {
|
|
|
13594
13690
|
}; }
|
|
13595
13691
|
}
|
|
13596
13692
|
|
|
13597
|
-
const curaSelectCss = ":host{display:block;position:relative;font-family:var(--font-family)}.wrapper{width:100%;user-select:none;text-align:left !important}.wrapper cura-label{margin-bottom:8px}.wrapper .helper-text{margin-top:8px;color:var(--neutral-dark)}.wrapper .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper .cura-input-field .feedback-icon{padding-left:12px}.wrapper .cura-input-field .up-down-icon{order:3;padding-right:12px;cursor:pointer;pointer-events:all}.wrapper .cura-input-field input{padding:0px 12px 0px 8px;cursor:pointer}.wrapper .cura-input-field.open{border-radius:4px 4px 0 0 !important}.wrapper.transparent{background-color:transparent;padding:0px;max-height:80px}.wrapper.transparent .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;background-color:transparent !important;border:none !important;border-radius:0;height:27px}.wrapper.transparent .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.transparent .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.transparent .cura-input-field .feedback-icon{padding-left:12px}.wrapper.transparent .cura-input-field input{color:var(--neutral-black) !important;font-size:16px;font-weight:var(--font-weight-bold) !important;padding:0}.wrapper.transparent .cura-input-field input::placeholder{color:var(--neutral-black)}.wrapper.transparent .cura-input-field .feedback-icon{order:3;margin:0 20px 0 0}.wrapper.transparent:focus-within .cura-input-field{border:none !important;background-color:transparent !important}.wrapper.transparent:focus-within .cura-input-field input{border:none !important;outline:none}.wrapper.transparent .helper-text{margin-top:0px}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field{border-color:var(--neutral-dark)}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field input{color:var(--neutral-dark)}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper:focus-within:not(.selection) .cura-input-field{border:2px solid var(--info-base) !important;background-color:var(--neutral-purewhite);outline:none}.wrapper:focus-within:not(.selection) .cura-input-field input{color:var(--neutral-black) !important}.wrapper:focus-within.selection .cura-input-field{border-radius:4px 4px 0px 0px}.wrapper.success .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.success .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.success .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.success .cura-input-field .feedback-icon{padding-left:12px}.wrapper.success .cura-input-field input{color:var(--success-darker) !important}.wrapper.success .cura-input-field input::placeholder{color:var(--success-darker) !important}.wrapper.success:not(.transparent) .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;border:2px solid var(--success-dark) !important;background-color:var(--success-lighter) !important}.wrapper.success:not(.transparent) .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.success:not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.success:not(.transparent) .cura-input-field .feedback-icon{padding-left:12px}.wrapper.error .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.error .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.error .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.error .cura-input-field .feedback-icon{padding-left:12px}.wrapper.error .cura-input-field input{color:var(--error-darker) !important}.wrapper.error .cura-input-field input::placeholder{color:var(--error-darker) !important}.wrapper.error:not(.transparent) .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;border:2px solid var(--error-dark) !important;background-color:var(--error-lighter) !important}.wrapper.error:not(.transparent) .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.error:not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.error:not(.transparent) .cura-input-field .feedback-icon{padding-left:12px}.wrapper.small .cura-input-field{width:100%;height:32px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.small .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:12px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.small .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.small .cura-input-field .feedback-icon{padding-left:12px}.wrapper.small .cura-input-field input{line-height:13px;letter-spacing:0.72px}.wrapper.small .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-regular)}.wrapper.small.label .menu{top:53px}.wrapper.small .menu{top:33px}.wrapper.medium .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.medium .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.medium .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.medium .cura-input-field .feedback-icon{padding-left:12px}.wrapper.medium .cura-input-field input{line-height:16px;letter-spacing:0.56px}.wrapper.medium .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-regular)}.wrapper.medium.label .menu{top:61px}.wrapper.medium .menu{top:40px}.wrapper.large .cura-input-field{width:100%;height:44px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.large .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:16px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.large .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.large .cura-input-field .feedback-icon{padding-left:12px}.wrapper.large .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-bold)}.wrapper.large.label .menu{top:69px}.wrapper.large .menu{top:47px}.wrapper.disabled .cura-input-field{background-color:var(--neutral-white);border:2px solid var(--neutral-base)}.wrapper.disabled .cura-input-field input{color:var(--neutral-medium)}.wrapper.disabled .cura-input-field input::placeholder{color:var(--neutral-medium)}.required{color:red}.menu{position:absolute;left:0;right:-1px;background:#fff;border:2px solid var(--neutral-light);border-radius:4px;z-index:1000;max-height:285px;overflow:hidden;border-top:transparent;align-items:center;scrollbar-color:var(--neutral-medium) var(--neutral-black-20);overflow-y:auto;box-shadow:0px 4px 8px 0px rgba(38, 38, 38, 0.16)}.menu.open{border-radius:0 !important}";
|
|
13693
|
+
const curaSelectCss = ":host{display:block;position:relative;font-family:var(--font-family)}.wrapper{width:100%;user-select:none;text-align:left !important}.wrapper cura-label{margin-bottom:8px}.wrapper .helper-text{margin-top:8px;color:var(--neutral-dark)}.wrapper .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper .cura-input-field .feedback-icon{padding-left:12px}.wrapper .cura-input-field .up-down-icon{order:3;padding-right:9px;cursor:pointer;pointer-events:all}.wrapper .cura-input-field .up-down-button{background-color:transparent;border:none}.wrapper .cura-input-field input{padding:0px 12px 0px 8px;cursor:pointer}.wrapper .cura-input-field.open{border-radius:4px 4px 0 0 !important}.wrapper.transparent{background-color:transparent;padding:0px;max-height:80px}.wrapper.transparent .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;background-color:transparent !important;border:none !important;border-radius:0;height:27px}.wrapper.transparent .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.transparent .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.transparent .cura-input-field .feedback-icon{padding-left:12px}.wrapper.transparent .cura-input-field input{color:var(--neutral-black) !important;font-size:16px;font-weight:var(--font-weight-bold) !important;padding:0}.wrapper.transparent .cura-input-field input::placeholder{color:var(--neutral-black)}.wrapper.transparent .cura-input-field .feedback-icon{order:3;margin:0 20px 0 0}.wrapper.transparent:focus-within .cura-input-field{border:none !important;background-color:transparent !important}.wrapper.transparent:focus-within .cura-input-field input{border:none !important;outline:none}.wrapper.transparent .helper-text{margin-top:0px}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field{border-color:var(--neutral-dark)}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field input{color:var(--neutral-dark)}.wrapper:hover:not(.disabled):not(.isLoading):not(.success):not(.error):not(.isFocused):not(.readOnly):not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper:focus-within:not(.selection) .cura-input-field{border:2px solid var(--info-base) !important;background-color:var(--neutral-purewhite);outline:none}.wrapper:focus-within:not(.selection) .cura-input-field input{color:var(--neutral-black) !important}.wrapper:focus-within.selection .cura-input-field{border-radius:4px 4px 0px 0px}.wrapper.success .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.success .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.success .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.success .cura-input-field .feedback-icon{padding-left:12px}.wrapper.success .cura-input-field input{color:var(--success-darker) !important}.wrapper.success .cura-input-field input::placeholder{color:var(--success-darker) !important}.wrapper.success:not(.transparent) .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;border:2px solid var(--success-dark) !important;background-color:var(--success-lighter) !important}.wrapper.success:not(.transparent) .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.success:not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.success:not(.transparent) .cura-input-field .feedback-icon{padding-left:12px}.wrapper.error .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.error .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.error .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.error .cura-input-field .feedback-icon{padding-left:12px}.wrapper.error .cura-input-field input{color:var(--error-darker) !important}.wrapper.error .cura-input-field input::placeholder{color:var(--error-darker) !important}.wrapper.error:not(.transparent) .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box;border:2px solid var(--error-dark) !important;background-color:var(--error-lighter) !important}.wrapper.error:not(.transparent) .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.error:not(.transparent) .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.error:not(.transparent) .cura-input-field .feedback-icon{padding-left:12px}.wrapper.small .cura-input-field{width:100%;height:32px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.small .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:12px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.small .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.small .cura-input-field .feedback-icon{padding-left:12px}.wrapper.small .cura-input-field input{line-height:13px;letter-spacing:0.72px}.wrapper.small .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-regular)}.wrapper.small.label .menu{top:53px}.wrapper.small .menu{top:33px}.wrapper.medium .cura-input-field{width:100%;height:40px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.medium .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:14px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.medium .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.medium .cura-input-field .feedback-icon{padding-left:12px}.wrapper.medium .cura-input-field input{line-height:16px;letter-spacing:0.56px}.wrapper.medium .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-regular)}.wrapper.medium.label .menu{top:61px}.wrapper.medium .menu{top:40px}.wrapper.large .cura-input-field{width:100%;height:44px;display:flex;flex-direction:row;align-items:center;background-color:var(--neutral-purewhite);border:2px solid var(--neutral-medium);border-radius:4px;color:var(--primary-base);letter-spacing:0.32px;line-height:20px;overflow:hidden;box-sizing:border-box}.wrapper.large .cura-input-field input{flex:1;width:100%;height:100%;background:transparent;border:none;outline:none;color:var(--neutral-dark);font-family:var(--font-family);font-weight:var(--font-weight-medium);font-size:16px;box-sizing:border-box;padding:0px 12px 0px 8px}.wrapper.large .cura-input-field input::placeholder{color:var(--neutral-dark)}.wrapper.large .cura-input-field .feedback-icon{padding-left:12px}.wrapper.large .helper-text{margin-top:8px;color:var(--neutral-dark);font-weight:var(--font-weight-bold)}.wrapper.large.label .menu{top:69px}.wrapper.large .menu{top:47px}.wrapper.disabled .cura-input-field{background-color:var(--neutral-white);border:2px solid var(--neutral-base)}.wrapper.disabled .cura-input-field input{color:var(--neutral-medium)}.wrapper.disabled .cura-input-field input::placeholder{color:var(--neutral-medium)}.required{color:red}.menu{position:absolute;left:0;right:-1px;background:#fff;border:2px solid var(--neutral-light);border-radius:4px;z-index:1000;max-height:285px;overflow:hidden;border-top:transparent;align-items:center;scrollbar-color:var(--neutral-medium) var(--neutral-black-20);overflow-y:auto;box-shadow:0px 4px 8px 0px rgba(38, 38, 38, 0.16)}.menu.open{border-radius:0 !important}";
|
|
13598
13694
|
var CuraSelectStyle0 = curaSelectCss;
|
|
13599
13695
|
|
|
13600
13696
|
class CuraSelect {
|
|
@@ -13689,7 +13785,7 @@ class CuraSelect {
|
|
|
13689
13785
|
this.textInput = '';
|
|
13690
13786
|
}
|
|
13691
13787
|
updateOptionHighlights(newActiveINdex) {
|
|
13692
|
-
this.options.forEach((option, index) => option.active = index === newActiveINdex);
|
|
13788
|
+
this.options.forEach((option, index) => (option.active = index === newActiveINdex));
|
|
13693
13789
|
}
|
|
13694
13790
|
/**
|
|
13695
13791
|
* Filters the options based on the current input value.
|
|
@@ -13706,21 +13802,21 @@ class CuraSelect {
|
|
|
13706
13802
|
});
|
|
13707
13803
|
}
|
|
13708
13804
|
/**
|
|
13709
|
-
|
|
13710
|
-
|
|
13805
|
+
* Callback for form association.
|
|
13806
|
+
*/
|
|
13711
13807
|
formAssociatedCallback(form) {
|
|
13712
13808
|
form.ariaLabel = this.label;
|
|
13713
13809
|
}
|
|
13714
13810
|
/**
|
|
13715
|
-
|
|
13716
|
-
|
|
13811
|
+
* Callback to restore the switch state from the form.
|
|
13812
|
+
*/
|
|
13717
13813
|
formStateRestoreCallback(state) {
|
|
13718
13814
|
this.textInput = state.value;
|
|
13719
13815
|
this.updateSelectedOption();
|
|
13720
13816
|
}
|
|
13721
13817
|
/**
|
|
13722
|
-
|
|
13723
|
-
|
|
13818
|
+
* Callback to reset the switch state when the form is reset.
|
|
13819
|
+
*/
|
|
13724
13820
|
formResetCallback() {
|
|
13725
13821
|
this.textInput = '';
|
|
13726
13822
|
this.clearSelectedAttributes();
|
|
@@ -13728,8 +13824,8 @@ class CuraSelect {
|
|
|
13728
13824
|
this.internals.setValidity({});
|
|
13729
13825
|
}
|
|
13730
13826
|
/**
|
|
13731
|
-
|
|
13732
|
-
|
|
13827
|
+
* Callback to update the switch's disabled state when the form's disabled state changes.
|
|
13828
|
+
*/
|
|
13733
13829
|
formDisabledCallback(disabled) {
|
|
13734
13830
|
this.disabled = disabled;
|
|
13735
13831
|
}
|
|
@@ -13784,9 +13880,22 @@ class CuraSelect {
|
|
|
13784
13880
|
const fontWeights = fonts.getWeights();
|
|
13785
13881
|
this.styles = Object.assign(Object.assign({}, this.styles), { '--font-weight-medium': fontWeights.medium, '--font-weight-bold': fontWeights.bold, '--font-weight-regular': fontWeights.regular, '--font-color': fonts.getColor(), '--font-family': fonts.getFamily(), '--font-size': fonts.getSize() });
|
|
13786
13882
|
const colorKeys = [
|
|
13787
|
-
'primary-base',
|
|
13788
|
-
'neutral-
|
|
13789
|
-
'
|
|
13883
|
+
'primary-base',
|
|
13884
|
+
'neutral-purewhite',
|
|
13885
|
+
'neutral-white',
|
|
13886
|
+
'neutral-black',
|
|
13887
|
+
'neutral-medium',
|
|
13888
|
+
'neutral-light',
|
|
13889
|
+
'neutral-base',
|
|
13890
|
+
'neutral-dark',
|
|
13891
|
+
'success-dark',
|
|
13892
|
+
'success-darker',
|
|
13893
|
+
'success-lighter',
|
|
13894
|
+
'error-lighter',
|
|
13895
|
+
'error-dark',
|
|
13896
|
+
'error-darker',
|
|
13897
|
+
'error-base',
|
|
13898
|
+
'info-base',
|
|
13790
13899
|
];
|
|
13791
13900
|
colorKeys.forEach(key => {
|
|
13792
13901
|
this.styles[`--${key}`] = colors.getColor(key);
|
|
@@ -13869,16 +13978,16 @@ class CuraSelect {
|
|
|
13869
13978
|
if (this.status === 'default')
|
|
13870
13979
|
return null;
|
|
13871
13980
|
const icon = { success: 'checkCircle', error: 'alertCircle' }[this.status];
|
|
13872
|
-
return
|
|
13981
|
+
return hAsync("cura-icon", { class: "feedback-icon", name: icon, iconset: "default", size: this.size === 'large' ? 20 : 16, color: this.getColor('icon'), style: this.styles });
|
|
13873
13982
|
}
|
|
13874
13983
|
render() {
|
|
13875
|
-
return (hAsync(Host, { key: '
|
|
13984
|
+
return (hAsync(Host, { key: 'd0433e214411ca390ff69ffbfdc2d8d3f6364b9c', style: this.styles }, hAsync("div", { key: 'e644f2ff6f37867ab5d6737f99d772c72fdf17b9', class: this.getClasses(), onMouseEnter: () => (this.isHovered = true), onMouseLeave: () => (this.isHovered = false), onClick: this.handleClick }, this.label && (hAsync("cura-label", { key: '7f382f95d58b6e90b9e7f82ade4d55a4ae74a952', class: "label", weight: "bold", size: this.size === 'large' ? 'small' : 'xsmall', color: this.getColor('label') }, this.label, " ", this.required && hAsync("span", { key: 'e782b69050063221f9f8c011c753f03bff1b2fed', class: "required" }, "* "))), hAsync("div", { key: 'b9b1c4a4ad3b19bbec7640bbbe7921fc2e2dc2a9', class: {
|
|
13876
13985
|
'cura-input-field': true,
|
|
13877
|
-
'open': this.isOpen
|
|
13878
|
-
} }, this.renderIcon(), hAsync("input", { key: '
|
|
13879
|
-
|
|
13880
|
-
|
|
13881
|
-
} }, hAsync("slot", { key: '
|
|
13986
|
+
'open': this.isOpen,
|
|
13987
|
+
} }, this.renderIcon(), hAsync("input", { key: 'f107ce1837c7eb5e2be8e21073bc514861e36de5', type: "text", autocomplete: "off", onFocus: () => (this.isFocused = true), onBlur: () => (this.isFocused = false), onKeyDown: this.handleKeyNavigation, "aria-required": String(this.required), "aria-disabled": String(this.disabled), "aria-invalid": String(this.status === 'error'), onInput: this.handleInputChange, style: this.styles, placeholder: this.placeholder, disabled: this.disabled, required: this.required, value: this.textInput, readonly: this.searchBehavior ? null : true }), hAsync("button", { key: '2d535a37f67c28eee7a868de1d5fe5297aa91a1d', class: "up-down-button" }, hAsync("cura-icon", { key: '9292fb9f72d3c4f67b0cffaafdc3c0cceefb5b07', name: this.isOpen ? 'up' : 'down', class: "up-down-icon", color: this.disabled ? 'neutral-dark' : 'primary-base', size: 16, iconset: "default" }))), hAsync("cura-label", { key: '344572553d1920a66cab43912cae5f24200789c5', class: "helper-text", size: "xsmall", color: this.getColor('text'), weight: this.mode === 'transparent' ? 'bold' : 'regular' }, hAsync("slot", { key: 'a2dd9204ad33c6fb2518dca1bfaa18cc51c19d2a' })), this.isOpen && (hAsync("div", { key: '73fd79fd3073b0a9a4537e104e9e1721129da480', class: {
|
|
13988
|
+
menu: true,
|
|
13989
|
+
open: this.isOpen,
|
|
13990
|
+
} }, hAsync("slot", { key: 'dfd5a1f698dddeab8efec68beb5ff038024571dd', name: "option" }))))));
|
|
13882
13991
|
}
|
|
13883
13992
|
static get formAssociated() { return true; }
|
|
13884
13993
|
get host() { return getElement(this); }
|
|
@@ -13952,7 +14061,7 @@ class CuraSelectOption {
|
|
|
13952
14061
|
};
|
|
13953
14062
|
}
|
|
13954
14063
|
render() {
|
|
13955
|
-
return (hAsync(Host, { key: '
|
|
14064
|
+
return (hAsync(Host, { key: '7633d57e0ab5ba265c31e53dde513bdb0bc934e8', slot: "option" }, hAsync("div", { key: 'aa301dd963ffde79251ad79428934609ba70d713', class: this.getClasses(), style: this.styles }, hAsync("cura-label", { key: '2a55fc05a9bb9a47a4a4b191e85ce5fdb6c7d5cf', color: `${this.selected ? 'primary-base' : 'neutral-black'}`, size: this.getSize('label'), "margin-block": "0" }, hAsync("slot", { key: '4f28e0d1142cf847174f72614470b89ac3495197' })), this.selected && hAsync("cura-icon", { key: '189b1b8877e68648f5282281df144ead39b64441', name: 'check', size: this.getSize('icon'), color: "primary-base" }))));
|
|
13956
14065
|
}
|
|
13957
14066
|
get host() { return getElement(this); }
|
|
13958
14067
|
static get watchers() { return {
|
|
@@ -13975,6 +14084,216 @@ class CuraSelectOption {
|
|
|
13975
14084
|
}; }
|
|
13976
14085
|
}
|
|
13977
14086
|
|
|
14087
|
+
const curaStepperCss = ":host{display:block;box-sizing:border-box;width:100%}cura-heading{--margin-block:0 !important}.container{display:flex}.compact{display:flex;padding:0px;justify-content:space-between;align-items:center}.compact .heading{text-align:right}.stepper-list{gap:4px;display:flex;flex-shrink:0;align-items:center;padding:0;flex:1;width:100%;justify-content:space-between}.step{display:flex;align-items:center;flex-direction:row;flex:1;gap:4px}.step .wrapper{flex:1;position:relative}.step .divider{background-color:var(--neutral-light);height:2px;flex:1;transition:all 1s}.step .animation{position:absolute;top:0;left:0;right:0;width:var(--progress-width)}.step .done{background-color:var(--success-light)}.step .stop{background-color:var(--error-light)}.step .active{background-color:var(--info-light)}.last{flex:0}";
|
|
14088
|
+
var CuraStepperStyle0 = curaStepperCss;
|
|
14089
|
+
|
|
14090
|
+
class CuraStepper {
|
|
14091
|
+
constructor(hostRef) {
|
|
14092
|
+
registerInstance(this, hostRef);
|
|
14093
|
+
this.activeStepIndex = undefined;
|
|
14094
|
+
this.errorInCurrentStep = false;
|
|
14095
|
+
this.displayHeading = false;
|
|
14096
|
+
this.variant = 'default';
|
|
14097
|
+
this.steps = [];
|
|
14098
|
+
this.styles = {};
|
|
14099
|
+
this.stepList = [];
|
|
14100
|
+
}
|
|
14101
|
+
connectedCallback() {
|
|
14102
|
+
this.initializeSteps();
|
|
14103
|
+
const { fonts, colors, spacing } = window.CuraAPI.theme;
|
|
14104
|
+
const weights = fonts.getWeights();
|
|
14105
|
+
this.styles = this.generateStyles(colors, fonts, spacing, weights);
|
|
14106
|
+
}
|
|
14107
|
+
generateStyles(colors, fonts, spacing, weights) {
|
|
14108
|
+
return {
|
|
14109
|
+
'--base-spacing': spacing.getSpacing(),
|
|
14110
|
+
'--neutral-purewhite': colors.getColor('neutral-purewhite'),
|
|
14111
|
+
'--neutral-lighter': colors.getColor('neutral-lighter'),
|
|
14112
|
+
'--neutral-base': colors.getColor('neutral-base'),
|
|
14113
|
+
'--neutral-light': colors.getColor('neutral-light'),
|
|
14114
|
+
'--success-light': colors.getColor('success-light'),
|
|
14115
|
+
'--info-light': colors.getColor('info-light'),
|
|
14116
|
+
'--error-light': colors.getColor('error-light'),
|
|
14117
|
+
'--font-size': fonts.getSize(),
|
|
14118
|
+
'--font-color': fonts.getColor(),
|
|
14119
|
+
'--font-family': fonts.getFamily(),
|
|
14120
|
+
'--font-weight-regular': weights.regular,
|
|
14121
|
+
};
|
|
14122
|
+
}
|
|
14123
|
+
initializeSteps() {
|
|
14124
|
+
if (typeof this.steps === 'string') {
|
|
14125
|
+
this.stepList = JSON.parse(this.steps || '[]');
|
|
14126
|
+
}
|
|
14127
|
+
else {
|
|
14128
|
+
this.stepList = this.steps;
|
|
14129
|
+
}
|
|
14130
|
+
}
|
|
14131
|
+
getStepStatus(step) {
|
|
14132
|
+
if (this.activeStepIndex === step && this.errorInCurrentStep)
|
|
14133
|
+
return 'stop';
|
|
14134
|
+
if (this.activeStepIndex === step && this.stepList.length !== step)
|
|
14135
|
+
return 'active';
|
|
14136
|
+
if (this.activeStepIndex >= step)
|
|
14137
|
+
return 'done';
|
|
14138
|
+
return 'default';
|
|
14139
|
+
}
|
|
14140
|
+
getProgressStyles() {
|
|
14141
|
+
const progressStyles = {
|
|
14142
|
+
default: {
|
|
14143
|
+
progressColor: 'var(--info-light)',
|
|
14144
|
+
activeStepTextColor: 'info-darker',
|
|
14145
|
+
nextStepTextColor: 'info-dark',
|
|
14146
|
+
},
|
|
14147
|
+
firstStep: {
|
|
14148
|
+
progressColor: 'var(--info-light)',
|
|
14149
|
+
activeStepTextColor: 'neutral-dark',
|
|
14150
|
+
nextStepTextColor: 'neutral-medium',
|
|
14151
|
+
},
|
|
14152
|
+
completed: {
|
|
14153
|
+
progressColor: 'var(--success-light)',
|
|
14154
|
+
activeStepTextColor: 'success-darker',
|
|
14155
|
+
nextStepTextColor: 'success-dark',
|
|
14156
|
+
},
|
|
14157
|
+
error: {
|
|
14158
|
+
progressColor: 'var(--error-light)',
|
|
14159
|
+
activeStepTextColor: 'error-darker',
|
|
14160
|
+
nextStepTextColor: 'error-dark',
|
|
14161
|
+
},
|
|
14162
|
+
};
|
|
14163
|
+
if (this.errorInCurrentStep) {
|
|
14164
|
+
return progressStyles.error;
|
|
14165
|
+
}
|
|
14166
|
+
if (this.activeStepIndex === 0) {
|
|
14167
|
+
return progressStyles.firstStep;
|
|
14168
|
+
}
|
|
14169
|
+
if (this.activeStepIndex === this.stepList.length) {
|
|
14170
|
+
return progressStyles.completed;
|
|
14171
|
+
}
|
|
14172
|
+
return progressStyles.default;
|
|
14173
|
+
}
|
|
14174
|
+
renderCompactStepper() {
|
|
14175
|
+
var _a;
|
|
14176
|
+
const title = this.activeStepIndex === 0 ? this.stepList[this.activeStepIndex].title : this.stepList[this.activeStepIndex - 1].title;
|
|
14177
|
+
const subtitle = this.activeStepIndex === 0 ? this.stepList[this.activeStepIndex + 1].title : (_a = this.stepList[this.activeStepIndex]) === null || _a === void 0 ? void 0 : _a.title;
|
|
14178
|
+
const completed = this.activeStepIndex === this.stepList.length;
|
|
14179
|
+
const inProgress = !(completed || this.errorInCurrentStep);
|
|
14180
|
+
const { progressColor, activeStepTextColor, nextStepTextColor } = this.getProgressStyles();
|
|
14181
|
+
// Representa a porcentagem de progresso (step atual / quantidade de steps;)
|
|
14182
|
+
const progress = (this.activeStepIndex * 100) / this.stepList.length;
|
|
14183
|
+
return (hAsync("div", { class: "container compact", style: this.styles }, hAsync("cura-progress-bar", { progress: progress, progressColor: progressColor, active: this.activeStepIndex !== 0 }, !inProgress ? (hAsync("cura-icon", { name: this.errorInCurrentStep ? 'alertCircle' : 'checkCircle', color: this.errorInCurrentStep ? 'error-dark' : 'success-dark', size: "16" })) : (hAsync("cura-heading", { color: "neutral-dark", size: "xsmall" }, this.activeStepIndex, "/", this.stepList.length))), this.displayHeading && (hAsync("div", { class: "heading" }, hAsync("cura-heading", { size: "small", weight: "bold", color: activeStepTextColor }, title), !completed && (hAsync("cura-heading", { size: "xsmall", weight: "regular", color: nextStepTextColor }, "Pr\u00F3ximo: ", subtitle))))));
|
|
14184
|
+
}
|
|
14185
|
+
renderStep(step, stepIndex) {
|
|
14186
|
+
const stepStatus = this.getStepStatus(stepIndex + 1);
|
|
14187
|
+
const lastStep = stepIndex === this.stepList.length - 1;
|
|
14188
|
+
const progressWidth = stepStatus !== 'default' ? '100%' : '0';
|
|
14189
|
+
return (hAsync("div", { class: `step ${lastStep ? 'last' : ''}`, key: step.title }, hAsync("cura-stepper-item", { heading: step.title, label: step.label, displayHeading: this.displayHeading, status: stepStatus }), stepIndex < this.stepList.length - 1 && (hAsync("div", { class: "wrapper" }, hAsync("div", { class: "divider" }), hAsync("div", { class: `divider ${stepStatus} animation`, style: { '--progress-width': progressWidth } })))));
|
|
14190
|
+
}
|
|
14191
|
+
renderStepper() {
|
|
14192
|
+
return (hAsync("div", { class: "container", style: this.styles }, hAsync("div", { class: "stepper-list" }, this.stepList.map((step, stepIndex) => this.renderStep(step, stepIndex)))));
|
|
14193
|
+
}
|
|
14194
|
+
render() {
|
|
14195
|
+
return hAsync(Host, { key: 'a3c23a43dc82cba74b777a7e28ae7de1632ec95d' }, this.variant === 'default' ? this.renderStepper() : this.renderCompactStepper());
|
|
14196
|
+
}
|
|
14197
|
+
get host() { return getElement(this); }
|
|
14198
|
+
static get style() { return CuraStepperStyle0; }
|
|
14199
|
+
static get cmpMeta() { return {
|
|
14200
|
+
"$flags$": 9,
|
|
14201
|
+
"$tagName$": "cura-stepper",
|
|
14202
|
+
"$members$": {
|
|
14203
|
+
"activeStepIndex": [514, "active-step-index"],
|
|
14204
|
+
"errorInCurrentStep": [516, "error-in-current-step"],
|
|
14205
|
+
"displayHeading": [516, "display-heading"],
|
|
14206
|
+
"variant": [513],
|
|
14207
|
+
"steps": [1],
|
|
14208
|
+
"styles": [32],
|
|
14209
|
+
"stepList": [32]
|
|
14210
|
+
},
|
|
14211
|
+
"$listeners$": undefined,
|
|
14212
|
+
"$lazyBundleId$": "-",
|
|
14213
|
+
"$attrsToReflect$": [["activeStepIndex", "active-step-index"], ["errorInCurrentStep", "error-in-current-step"], ["displayHeading", "display-heading"], ["variant", "variant"]]
|
|
14214
|
+
}; }
|
|
14215
|
+
}
|
|
14216
|
+
|
|
14217
|
+
const curaStepperItemCss = ":host{display:block;box-sizing:border-box}.item-container{display:flex;gap:4px;align-items:center}";
|
|
14218
|
+
var CuraStepperItemStyle0 = curaStepperItemCss;
|
|
14219
|
+
|
|
14220
|
+
class CuraStepperItem {
|
|
14221
|
+
constructor(hostRef) {
|
|
14222
|
+
registerInstance(this, hostRef);
|
|
14223
|
+
this.statusMap = {
|
|
14224
|
+
active: {
|
|
14225
|
+
badgeColor: 'info',
|
|
14226
|
+
textColor: 'info-dark',
|
|
14227
|
+
icon: '',
|
|
14228
|
+
iconOnly: false,
|
|
14229
|
+
},
|
|
14230
|
+
stop: {
|
|
14231
|
+
badgeColor: 'error',
|
|
14232
|
+
textColor: 'error-darker',
|
|
14233
|
+
icon: 'alertCircle',
|
|
14234
|
+
iconOnly: true,
|
|
14235
|
+
},
|
|
14236
|
+
done: {
|
|
14237
|
+
badgeColor: 'success',
|
|
14238
|
+
textColor: 'success-darker',
|
|
14239
|
+
icon: 'checkCircle',
|
|
14240
|
+
iconOnly: true,
|
|
14241
|
+
},
|
|
14242
|
+
default: {
|
|
14243
|
+
badgeColor: 'neutral',
|
|
14244
|
+
textColor: 'neutral',
|
|
14245
|
+
icon: '',
|
|
14246
|
+
iconOnly: false,
|
|
14247
|
+
},
|
|
14248
|
+
};
|
|
14249
|
+
this.displayHeading = false;
|
|
14250
|
+
this.heading = undefined;
|
|
14251
|
+
this.label = undefined;
|
|
14252
|
+
this.status = 'default';
|
|
14253
|
+
this.styles = {};
|
|
14254
|
+
}
|
|
14255
|
+
connectedCallback() {
|
|
14256
|
+
this.updateStyles();
|
|
14257
|
+
}
|
|
14258
|
+
getStatusProperties() {
|
|
14259
|
+
return this.statusMap[this.status] || this.statusMap.default;
|
|
14260
|
+
}
|
|
14261
|
+
updateStyles() {
|
|
14262
|
+
const { fonts, colors, spacing } = window.CuraAPI.theme;
|
|
14263
|
+
const weights = fonts.getWeights();
|
|
14264
|
+
this.styles = {
|
|
14265
|
+
'--base-spacing': spacing.getSpacing(),
|
|
14266
|
+
'--neutral-purewhite': colors.getColor('neutral-purewhite'),
|
|
14267
|
+
'--neutral-lighter': colors.getColor('neutral-lighter'),
|
|
14268
|
+
'--neutral-base': colors.getColor('neutral-base'),
|
|
14269
|
+
'--font-size': fonts.getSize(),
|
|
14270
|
+
'--font-color': fonts.getColor(),
|
|
14271
|
+
'--font-family': fonts.getFamily(),
|
|
14272
|
+
'--font-weight-regular': weights.regular,
|
|
14273
|
+
};
|
|
14274
|
+
}
|
|
14275
|
+
render() {
|
|
14276
|
+
const { badgeColor, textColor, icon, iconOnly } = this.getStatusProperties();
|
|
14277
|
+
return (hAsync(Host, { key: 'c226daf451d9c861d5303474ef0fc31c1602371b' }, hAsync("div", { key: '7aece988946e4bef02c597a80ea1a505c201e188', class: "item-container", style: this.styles }, hAsync("cura-badge-pill", { key: 'd0362b4a4ee3c047173399ea5f7c912a5a0f7810', type: "solid", color: badgeColor, "icon-name": icon, "icon-only": iconOnly, "border-radius": "50%" }, this.label), this.displayHeading && this.heading && (hAsync("cura-paragraph", { key: '015effecdb26be22386363e77bd5a0e671701d60', marginBlock: "0", size: "xsmall", color: textColor }, this.heading)))));
|
|
14278
|
+
}
|
|
14279
|
+
get hostElement() { return getElement(this); }
|
|
14280
|
+
static get style() { return CuraStepperItemStyle0; }
|
|
14281
|
+
static get cmpMeta() { return {
|
|
14282
|
+
"$flags$": 9,
|
|
14283
|
+
"$tagName$": "cura-stepper-item",
|
|
14284
|
+
"$members$": {
|
|
14285
|
+
"displayHeading": [516, "display-heading"],
|
|
14286
|
+
"heading": [513],
|
|
14287
|
+
"label": [513],
|
|
14288
|
+
"status": [513],
|
|
14289
|
+
"styles": [32]
|
|
14290
|
+
},
|
|
14291
|
+
"$listeners$": undefined,
|
|
14292
|
+
"$lazyBundleId$": "-",
|
|
14293
|
+
"$attrsToReflect$": [["displayHeading", "display-heading"], ["heading", "heading"], ["label", "label"], ["status", "status"]]
|
|
14294
|
+
}; }
|
|
14295
|
+
}
|
|
14296
|
+
|
|
13978
14297
|
const curaSwitchCss = "@charset \"UTF-8\";:host{display:block;width:fit-content;box-sizing:border-box}.container{display:flex;align-items:center;flex-direction:row-reverse;gap:var(--gap);text-align:left}.position{flex-direction:row}.label,.message{text-align:left}.control{width:fit-content}.track{background:var(--neutral-dark-base);border-radius:16px;transition:background-color 0.3s;align-items:flex-start;flex-shrink:0;box-sizing:border-box;width:var(--size-track);height:var(--size);position:relative}.thumb{background:var(--neutral-purewhite);border:2px solid var(--neutral-darker-medium);border-radius:50%;position:absolute;transition:transform 0.3s, outline 0.3s;display:inline-block;cursor:pointer;user-select:none;box-sizing:border-box;width:var(--size);height:var(--size);top:50%;transform:translateY(-50%)}.checked .thumb{border-color:var(--color-dark);box-shadow:0px 4px 8px 0px var(--neutral-black-shadow, rgba(38, 38, 38, 0.16));background:var(--neutral-purewhite);transform:translateX(var(--size)) translateY(-50%)}.checked .thumb:hover{background:var(--neutral-pale) !important;border-color:var(--neutral-darker-medium) !important}.checked .thumb:active{border-color:var(--color-dark);background:var(--neutral-pale)}.checked .track{background:var(--color-base-light)}.disabled .track{background:var(--neutral-black-neutral-pale)}.disabled .thumb{background:var(--neutral-black-neutral-base) !important;border-color:var(--neutral-black-neutral-pale) !important;cursor:not-allowed}.disabled.checked .track{background:var(--neutral-black-neutral-pale)}.container.disabled .thumb:focus{outline:none !important;border-color:var(--neutral-black-neutral-pale) !important}:not(.disabled):not(.checked) .thumb:hover{border-color:var(--color-dark);background:var(--neutral-pale)}:not(.disabled):not(.checked) .thumb:active{border-color:var(--color-dark);background:var(--neutral-pale)}:not(.disabled) .thumb:focus{outline:2px solid var(--info-base) !important;border:2px solid var(--neutral-darker-medium);z-index:1}:not(.disabled) .checked .thumb:focus{outline:2px solid var(--info-base) !important;border-color:var(--color-dark)}";
|
|
13979
14298
|
var CuraSwitchStyle0 = curaSwitchCss;
|
|
13980
14299
|
|
|
@@ -14079,7 +14398,7 @@ class CuraSwitch {
|
|
|
14079
14398
|
return classes;
|
|
14080
14399
|
}
|
|
14081
14400
|
render() {
|
|
14082
|
-
return (hAsync(Host, { key: '
|
|
14401
|
+
return (hAsync(Host, { key: '11257c8df21e4d88ef7a1e26b72f8c53fd316edd' }, hAsync("div", { key: '358b9bf587443350fd092abb179b2207064c9278', class: this.getClasses(), style: this.styles }, hAsync("div", { key: 'acc517d68a7fde4a83653a7fadbdb337e6175498', class: "info" }, hAsync("cura-label", { key: 'dede214a31292a72e8f55adb50060628a1a101c0', style: { textAlign: this.position === 'right' ? 'right' : 'left' }, class: "label", weight: "bold", size: this.size === 'large' ? 'medium' : 'xsmall', lineHeight: "125%", color: this.assignColor('neutral-white', 'neutral-black') }, this.label), hAsync("cura-label", { key: 'a96960a7e898e8f9d7151c468d18e52860d589d1', style: { textAlign: this.position === 'right' ? 'right' : 'left' }, color: this.assignColor('primary-lighter', 'neutral-dark'), size: "xsmall", class: "message" }, hAsync("slot", { key: 'de46f003bf8046e3742d831cc45d22471e19c0a4' }))), hAsync("div", { key: 'ae0c72cd68ed42fec1338d6ded49d7b535157476', onClick: this.toggleSwitch, class: "control" }, hAsync("div", { key: '3aa0e60235071541289ea6a430966094a2753520', class: `track ${this.size.toLowerCase()}` }, hAsync("div", { key: '419866ba2b46a394428f83e6824ebb315e6671a1', class: `thumb ${this.size.toLowerCase()}`, tabIndex: this.ontabindex }))))));
|
|
14083
14402
|
}
|
|
14084
14403
|
static get formAssociated() { return true; }
|
|
14085
14404
|
static get watchers() { return {
|
|
@@ -14135,7 +14454,7 @@ class CuraToast {
|
|
|
14135
14454
|
this.setStyle();
|
|
14136
14455
|
}
|
|
14137
14456
|
render() {
|
|
14138
|
-
return (hAsync(Host, { key: '
|
|
14457
|
+
return (hAsync(Host, { key: '4dc290042792d96f31c2e63936d70a77bc37917d' }, hAsync("div", { key: '668c102d3a31d0a0e39c390546fcf5422e954246', class: this.getClasses(), style: this.styles }, hAsync("cura-icon", { key: '502b24915e1000877ccd4ae25806b152b4a72948', class: "default-icon", name: this.getNameIcon(), size: 16, color: `${this.type}-dark` }), hAsync("div", { key: 'd7afe4d1a9740d3bd1bce04858f6e71e0c857da2', class: "content" }, hAsync("cura-heading", { key: '419e0d64e12e828efa2fecebe0eb86c74ff86dda', level: 4, size: "xsmall", color: `${this.type}-dark`, weight: "bold", "margin-block": "0" }, this.label), hAsync("cura-paragraph", { key: 'bc6f5c120f0b32858cbda9ebf16c5d79366452bb', color: `${this.type}-darker`, size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, hAsync("slot", { key: '9cc8ba28b3e5ee5d8137351cfbb5dc07b417b7e9' })), hAsync("slot", { key: 'f260ca44fa6cc515a1bda3ecb94dd1ac90f880d7', name: "actions" })), this.closeButton && hAsync("cura-icon", { key: '7db6c2e5c3c66ab0b12822fc8099e17b77ed2c39', class: "close-icon", name: "close", size: 16, color: "error-dark", onClick: this.handleClose }), this.loader && !!this.autoCloseDelay && hAsync("cura-loader-bar", { key: 'd0a6f1e838ec98f6dac5773214e1e5cf501e3e2e', color: `${this.type}-base`, progress: this.progress }))));
|
|
14139
14458
|
}
|
|
14140
14459
|
componentDidLoad() {
|
|
14141
14460
|
this.openContainer();
|
|
@@ -14254,9 +14573,10 @@ class CuraTooltip {
|
|
|
14254
14573
|
this.setStyle();
|
|
14255
14574
|
}
|
|
14256
14575
|
render() {
|
|
14257
|
-
return (hAsync(Host, { key: '
|
|
14576
|
+
return (hAsync(Host, { key: '3fe89da4d5b3a2830d4ab6a88e705b4cf2433289', role: "tooltip", id: this.elementId }, hAsync("div", { key: '6cece3dcbf275a851e0d53cb154b9dcf50a76948', class: "container", style: this.styles }, hAsync("div", { key: '802840b89feb6c4d89303da156f6f130e552a83b', class: "content" }, hAsync("cura-heading", { key: 'ea98692d4fc34f05dcf8fcd5c325b8a1cd408226', level: 4, size: "xsmall", color: "neutral-black", weight: "bold", "margin-block": "0" }, this.label), hAsync("cura-paragraph", { key: '38bb7bf9f0a837813b490062ba5645f7148ac74b', color: "neutral-dark", "spot-color": "secondary-darker", size: "xsmall", marginBlock: "0", lineHeight: "133.33%" }, hAsync("slot", { key: '960b6b6d8ee4636a31c2058aa4779050973e143e' }))), this.closeButton && !this.isMobile && hAsync("cura-icon", { key: 'd0bf72702fa8d24d1f5fac6fa473747bdaadcdaf', class: "close-icon", name: "close", size: 16, color: "error-dark", onClick: this.handleClose }), this.isMobile && hAsync("cura-button-transparent", { key: '2213a6353b3d326ecde2e9eefe84811bd3161727', class: "close-button", size: "small", type: "button", color: "error", "icon-name": "close", "icon-position": "right", onClick: this.handleClose }, "OK, entendi."))));
|
|
14258
14577
|
}
|
|
14259
14578
|
componentDidLoad() {
|
|
14579
|
+
var _a, _b, _c, _d, _e;
|
|
14260
14580
|
this.targetElement = document.querySelector(`[aria-labelledby="${this.elementId}"]`);
|
|
14261
14581
|
if (!this.interactive) {
|
|
14262
14582
|
this.host.style.visibility = 'visible';
|
|
@@ -14265,28 +14585,28 @@ class CuraTooltip {
|
|
|
14265
14585
|
this.host.style.visibility = 'hidden';
|
|
14266
14586
|
let openTimeoutID = null;
|
|
14267
14587
|
let closeTimeoutID = null;
|
|
14268
|
-
this.targetElement.addEventListener('mouseenter', () => {
|
|
14588
|
+
(_a = this.targetElement) === null || _a === void 0 ? void 0 : _a.addEventListener('mouseenter', () => {
|
|
14269
14589
|
clearTimeout(closeTimeoutID);
|
|
14270
14590
|
openTimeoutID = setTimeout(() => {
|
|
14271
14591
|
this.host.style.visibility = 'visible';
|
|
14272
14592
|
}, typeof this.delay === 'number' && this.delay > 250 ? this.delay : 250);
|
|
14273
14593
|
});
|
|
14274
|
-
this.targetElement.addEventListener('mouseleave', () => {
|
|
14594
|
+
(_b = this.targetElement) === null || _b === void 0 ? void 0 : _b.addEventListener('mouseleave', () => {
|
|
14275
14595
|
clearTimeout(openTimeoutID);
|
|
14276
14596
|
closeTimeoutID = setTimeout(() => {
|
|
14277
14597
|
this.handleClose();
|
|
14278
14598
|
}, typeof this.delay === 'number' && this.delay > 250 ? this.delay : 250);
|
|
14279
14599
|
});
|
|
14280
|
-
this.host.addEventListener('mouseenter', () => {
|
|
14600
|
+
(_c = this.host) === null || _c === void 0 ? void 0 : _c.addEventListener('mouseenter', () => {
|
|
14281
14601
|
if (window.getComputedStyle(this.host).visibility === 'visible') {
|
|
14282
14602
|
clearTimeout(closeTimeoutID);
|
|
14283
14603
|
}
|
|
14284
14604
|
});
|
|
14285
|
-
this.host.addEventListener('mouseleave', () => {
|
|
14605
|
+
(_d = this.host) === null || _d === void 0 ? void 0 : _d.addEventListener('mouseleave', () => {
|
|
14286
14606
|
clearTimeout(openTimeoutID);
|
|
14287
14607
|
this.handleClose();
|
|
14288
14608
|
});
|
|
14289
|
-
this.targetElement.addEventListener('click', () => {
|
|
14609
|
+
(_e = this.targetElement) === null || _e === void 0 ? void 0 : _e.addEventListener('click', () => {
|
|
14290
14610
|
if (window.getComputedStyle(this.host).visibility === 'hidden') {
|
|
14291
14611
|
openTimeoutID = setTimeout(() => {
|
|
14292
14612
|
this.host.style.visibility = 'visible';
|
|
@@ -14297,7 +14617,7 @@ class CuraTooltip {
|
|
|
14297
14617
|
this.handleClose();
|
|
14298
14618
|
}
|
|
14299
14619
|
});
|
|
14300
|
-
document.addEventListener('click', (event) => {
|
|
14620
|
+
document === null || document === void 0 ? void 0 : document.addEventListener('click', (event) => {
|
|
14301
14621
|
if (!this.targetElement.contains(event.target) && !this.host.contains(event.target)) {
|
|
14302
14622
|
clearTimeout(openTimeoutID);
|
|
14303
14623
|
this.handleClose();
|
|
@@ -14332,7 +14652,7 @@ class CuraTooltip {
|
|
|
14332
14652
|
this.host.style.bottom = this.isMobile ? '0' : 'unset';
|
|
14333
14653
|
container.style.flexDirection = this.isMobile ? 'column' : 'row';
|
|
14334
14654
|
if (this.isMobile) {
|
|
14335
|
-
this.host.style.left = '
|
|
14655
|
+
this.host.style.left = '0';
|
|
14336
14656
|
this.host.style.top = 'unset';
|
|
14337
14657
|
return;
|
|
14338
14658
|
}
|
|
@@ -14468,6 +14788,7 @@ registerComponents([
|
|
|
14468
14788
|
CuraAccordionItem,
|
|
14469
14789
|
CuraAlert,
|
|
14470
14790
|
CuraAvatar,
|
|
14791
|
+
CuraBadgeDot,
|
|
14471
14792
|
CuraBadgeNumber,
|
|
14472
14793
|
CuraBadgePill,
|
|
14473
14794
|
CuraButton,
|
|
@@ -14493,9 +14814,12 @@ registerComponents([
|
|
|
14493
14814
|
CuraModal,
|
|
14494
14815
|
CuraPageTemplate,
|
|
14495
14816
|
CuraParagraph,
|
|
14817
|
+
CuraProgressBar,
|
|
14496
14818
|
CuraRadio,
|
|
14497
14819
|
CuraSelect,
|
|
14498
14820
|
CuraSelectOption,
|
|
14821
|
+
CuraStepper,
|
|
14822
|
+
CuraStepperItem,
|
|
14499
14823
|
CuraSwitch,
|
|
14500
14824
|
CuraToast,
|
|
14501
14825
|
CuraTooltip,
|