@vialiq/web-components 0.8.0 → 0.9.0
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/badge/vi-badge.d.ts +2 -0
- package/badge/vi-badge.d.ts.map +1 -1
- package/icons/vi-icon.d.ts +1 -0
- package/icons/vi-icon.d.ts.map +1 -1
- package/icons/vi-icon.js +5 -3
- package/index.d.ts +2 -0
- package/index.js +916 -46
- package/package.json +2 -2
package/badge/vi-badge.d.ts
CHANGED
|
@@ -34,6 +34,8 @@ export declare class ViBadge extends ViElement {
|
|
|
34
34
|
accessor pill: boolean;
|
|
35
35
|
/** Numeric count to display */
|
|
36
36
|
accessor count: number | undefined;
|
|
37
|
+
/** Show the badge even if the count is zero */
|
|
38
|
+
accessor showZero: boolean;
|
|
37
39
|
/** Max count before showing {max}+ */
|
|
38
40
|
accessor max: number;
|
|
39
41
|
/** Outlined/ghost style */
|
package/badge/vi-badge.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"vi-badge.d.ts","sourceRoot":"","sources":["../../../../libs/web-components/src/badge/vi-badge.ts"],"names":[],"mappings":"AAAA,OAAO,EAAwB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAEhE,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAGlD,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC;AAC7F,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE3C;;;;;;;;;;;;;;;;;;;GAmBG;AACH,qBACa,OAAQ,SAAQ,SAAS;IACpC,OAAgB,MAAM,0BAAkC;IAExD,sBAAsB;IACqB,QAAQ,CAAC,OAAO,EAAE,YAAY,CAAa;IAEtF,WAAW;IACgC,QAAQ,CAAC,IAAI,EAAE,SAAS,CAAQ;IAE3E,wBAAwB;IACoB,QAAQ,CAAC,GAAG,UAAS;IAEjE,4CAA4C;IACA,QAAQ,CAAC,IAAI,UAAQ;IAEjE,+BAA+B;
|
|
1
|
+
{"version":3,"file":"vi-badge.d.ts","sourceRoot":"","sources":["../../../../libs/web-components/src/badge/vi-badge.ts"],"names":[],"mappings":"AAAA,OAAO,EAAwB,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAEhE,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAGlD,MAAM,MAAM,YAAY,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,SAAS,GAAG,QAAQ,GAAG,MAAM,CAAC;AAC7F,MAAM,MAAM,SAAS,GAAG,IAAI,GAAG,IAAI,GAAG,IAAI,CAAC;AAE3C;;;;;;;;;;;;;;;;;;;GAmBG;AACH,qBACa,OAAQ,SAAQ,SAAS;IACpC,OAAgB,MAAM,0BAAkC;IAExD,sBAAsB;IACqB,QAAQ,CAAC,OAAO,EAAE,YAAY,CAAa;IAEtF,WAAW;IACgC,QAAQ,CAAC,IAAI,EAAE,SAAS,CAAQ;IAE3E,wBAAwB;IACoB,QAAQ,CAAC,GAAG,UAAS;IAEjE,4CAA4C;IACA,QAAQ,CAAC,IAAI,UAAQ;IAEjE,+BAA+B;IACY,QAAQ,CAAC,KAAK,EAAE,MAAM,GAAG,SAAS,CAAa;IAE1F,+CAA+C;IACqB,QAAQ,CAAC,QAAQ,UAAS;IAE9F,sCAAsC;IACV,QAAQ,CAAC,GAAG,SAAM;IAE9C,2BAA2B;IACiB,QAAQ,CAAC,OAAO,UAAS;IAE5D,OAAO,CAAC,QAAQ,CAAC,QAAQ,CAAS;IAClC,OAAO,CAAC,QAAQ,CAAC,eAAe,CAAS;IAEzC,iBAAiB,IAAI,IAAI;IAKzB,OAAO,CAAC,iBAAiB,EAAE,GAAG,CAAC,MAAM,GAAG,MAAM,GAAG,MAAM,EAAE,OAAO,CAAC,GAAG,IAAI;IAOjF,OAAO,CAAC,gBAAgB;IASxB,OAAO,CAAC,gBAAgB;IAKxB,OAAO,CAAC,mBAAmB;IASlB,MAAM,IAAI,cAAc;CA0BlC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,UAAU,EAAE,OAAO,CAAC;KACrB;CACF"}
|
package/icons/vi-icon.d.ts
CHANGED
|
@@ -35,6 +35,7 @@ export declare class ViIcon extends ViElement {
|
|
|
35
35
|
*/
|
|
36
36
|
accessor label: string;
|
|
37
37
|
private accessor _icon;
|
|
38
|
+
willUpdate(changedProperties: PropertyValues): void;
|
|
38
39
|
updated(changedProperties: PropertyValues): void;
|
|
39
40
|
firstUpdated(changedProperties: PropertyValues): void;
|
|
40
41
|
render(): TemplateResult;
|
package/icons/vi-icon.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"vi-icon.d.ts","sourceRoot":"","sources":["../../../../libs/web-components/src/icons/vi-icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAGnF,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAGlD;;;;;;;;;;;;;;;GAeG;AACH,qBACa,MAAO,SAAQ,SAAS;IACnC,OAAgB,MAAM,0BAkBpB;IAEF;;;OAGG;IACwC,QAAQ,CAAC,IAAI,SAAM;IAE9D;;;OAGG;IACyB,QAAQ,CAAC,IAAI,SAAM;IAE/C;;;;OAIG;IACyB,QAAQ,CAAC,KAAK,SAAM;IAEvC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAqC;IAE3D,OAAO,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;
|
|
1
|
+
{"version":3,"file":"vi-icon.d.ts","sourceRoot":"","sources":["../../../../libs/web-components/src/icons/vi-icon.ts"],"names":[],"mappings":"AAAA,OAAO,EAAsB,KAAK,cAAc,EAAE,KAAK,cAAc,EAAE,MAAM,KAAK,CAAC;AAGnF,OAAO,EAAE,SAAS,EAAE,MAAM,uBAAuB,CAAC;AAGlD;;;;;;;;;;;;;;;GAeG;AACH,qBACa,MAAO,SAAQ,SAAS;IACnC,OAAgB,MAAM,0BAkBpB;IAEF;;;OAGG;IACwC,QAAQ,CAAC,IAAI,SAAM;IAE9D;;;OAGG;IACyB,QAAQ,CAAC,IAAI,SAAM;IAE/C;;;;OAIG;IACyB,QAAQ,CAAC,KAAK,SAAM;IAEvC,OAAO,CAAC,QAAQ,CAAC,KAAK,CAAqC;IAE3D,UAAU,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;IAOnD,OAAO,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;IAchD,YAAY,CAAC,iBAAiB,EAAE,cAAc,GAAG,IAAI;IAOrD,MAAM,IAAI,cAAc;CAoBlC;AAED,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,qBAAqB;QAC7B,SAAS,EAAE,MAAM,CAAC;KACnB;CACF"}
|
package/icons/vi-icon.js
CHANGED
|
@@ -478,11 +478,14 @@ new class extends _identity {
|
|
|
478
478
|
set _icon(_v) {
|
|
479
479
|
this.#___private__icon_4 = _v;
|
|
480
480
|
}
|
|
481
|
-
|
|
482
|
-
super.
|
|
481
|
+
willUpdate(changedProperties) {
|
|
482
|
+
super.willUpdate(changedProperties);
|
|
483
483
|
if (changedProperties.has('name')) {
|
|
484
484
|
this._icon = getIcon(this.name);
|
|
485
485
|
}
|
|
486
|
+
}
|
|
487
|
+
updated(changedProperties) {
|
|
488
|
+
super.updated(changedProperties);
|
|
486
489
|
// Set or clear the inline custom property based on whether the consumer
|
|
487
490
|
// has explicitly provided a size attribute. Clearing on removal ensures
|
|
488
491
|
// a stale inline style does not keep overriding consumer CSS.
|
|
@@ -496,7 +499,6 @@ new class extends _identity {
|
|
|
496
499
|
}
|
|
497
500
|
firstUpdated(changedProperties) {
|
|
498
501
|
super.firstUpdated(changedProperties);
|
|
499
|
-
this._icon = getIcon(this.name);
|
|
500
502
|
if (this.hasAttribute('size')) {
|
|
501
503
|
this.style.setProperty('--vi-icon-size', `${this.size}px`);
|
|
502
504
|
}
|
package/index.d.ts
CHANGED
|
@@ -23,4 +23,6 @@ export type { AccordionVariant, AccordionSize } from './accordion/vi-accordion.j
|
|
|
23
23
|
export { ViAccordionItem } from './accordion/vi-accordion-item.js';
|
|
24
24
|
export { ViBadge } from './badge/vi-badge.js';
|
|
25
25
|
export type { BadgeVariant, BadgeSize } from './badge/vi-badge.js';
|
|
26
|
+
export { ViAlert } from './alert/vi-alert.js';
|
|
27
|
+
export type { AlertVariant } from './alert/vi-alert.js';
|
|
26
28
|
//# sourceMappingURL=index.d.ts.map
|
package/index.js
CHANGED
|
@@ -2,7 +2,8 @@ import { V as ViElement } from './vi-element-C6GfDPs3.js';
|
|
|
2
2
|
export { ViButton } from './button/vi-button.js';
|
|
3
3
|
export { ViInput } from './input/vi-input.js';
|
|
4
4
|
export { ViIcon } from './icons/vi-icon.js';
|
|
5
|
-
|
|
5
|
+
import { registerIcons } from './icons/registry.js';
|
|
6
|
+
export { getIcon } from './icons/registry.js';
|
|
6
7
|
export { ViRadio } from './radio/vi-radio.js';
|
|
7
8
|
export { ViRadioGroup } from './radio/vi-radio-group.js';
|
|
8
9
|
export { ViCheckbox } from './checkbox/vi-checkbox.js';
|
|
@@ -13,9 +14,9 @@ export { ViAccordionItem } from './accordion/vi-accordion-item.js';
|
|
|
13
14
|
import { unsafeCSS, css, html } from 'lit';
|
|
14
15
|
import { customElement, property, state } from 'lit/decorators.js';
|
|
15
16
|
|
|
16
|
-
const badgeStyles = "@charset \"UTF-8\";@layer reset,components,utilities;@layer components{.badge{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;box-sizing:border-box;font-size:var(--vi-badge-font-size, 11px);font-weight:var(--vi-badge-font-weight, var(--vi-font-weight-semibold, 600));padding:var(--vi-badge-padding, 2px 8px);border-radius:var(--vi-badge-border-radius, 9999px);gap:var(--vi-badge-gap, 4px);border:var(--vi-border-width-thin, 1px) solid transparent}.dot{display:inline-block;width:var(--vi-badge-dot-size, 8px);height:var(--vi-badge-dot-size, 8px);border-radius:50%;background-color:currentColor;flex-shrink:0}.icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}}:host{display:inline-block;vertical-align:middle}:host([hidden]){display:none!important}:host([size=sm]){--vi-badge-font-size: 10px;--vi-badge-padding: 0 6px;--vi-badge-gap: 2px;--vi-badge-dot-size: 6px}:host([size=md]){--vi-badge-font-size: 11px;--vi-badge-padding: 2px 8px;--vi-badge-gap: 4px;--vi-badge-dot-size: 8px}:host([size=lg]){--vi-badge-font-size: 13px;--vi-badge-padding: 4px 12px;--vi-badge-gap: 6px;--vi-badge-dot-size: 10px}:host([pill]){--vi-badge-border-radius: 9999px}:host(:not([pill])){--vi-badge-border-radius: var(--vi-border-radius-sm, 2px)}.badge.dot-only{--vi-badge-padding: 4px}:host([variant=neutral]) .badge{background-color:var(--vi-badge-neutral-
|
|
17
|
+
const badgeStyles = "@charset \"UTF-8\";@layer reset,components,utilities;@layer components{.badge{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;box-sizing:border-box;font-size:var(--vi-badge-font-size, 11px);font-weight:var(--vi-badge-font-weight, var(--vi-font-weight-semibold, 600));padding:var(--vi-badge-padding, 2px 8px);border-radius:var(--vi-badge-border-radius, 9999px);gap:var(--vi-badge-gap, 4px);border:var(--vi-border-width-thin, 1px) solid transparent}.dot{display:inline-block;width:var(--vi-badge-dot-size, 8px);height:var(--vi-badge-dot-size, 8px);border-radius:50%;background-color:currentColor;flex-shrink:0}.icon{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0}}:host{display:inline-block;vertical-align:middle}:host([hidden]),:host([count=\"0\"]:not([show-zero])){display:none!important}:host([size=sm]){--vi-badge-font-size: 10px;--vi-badge-padding: 0 6px;--vi-badge-gap: 2px;--vi-badge-dot-size: 6px}:host([size=md]){--vi-badge-font-size: 11px;--vi-badge-padding: 2px 8px;--vi-badge-gap: 4px;--vi-badge-dot-size: 8px}:host([size=lg]){--vi-badge-font-size: 13px;--vi-badge-padding: 4px 12px;--vi-badge-gap: 6px;--vi-badge-dot-size: 10px}:host([pill]){--vi-badge-border-radius: 9999px}:host(:not([pill])){--vi-badge-border-radius: var(--vi-border-radius-sm, 2px)}.badge.dot-only{--vi-badge-padding: 4px}:host([variant=neutral]) .badge{background-color:var(--vi-badge-neutral-bg, var(--vi-border-02, #eeeeee));color:var(--vi-badge-neutral-color, var(--vi-text-secondary, #4b5563))}:host([variant=primary]) .badge{background-color:var(--vi-badge-primary-bg, var(--vi-bg-info, #e3f2fd));color:var(--vi-badge-primary-color, var(--vi-text-info, #3676d0))}:host([variant=success]) .badge{background-color:var(--vi-badge-success-bg, var(--vi-bg-success, #e6f9f0));color:var(--vi-badge-success-color, var(--vi-text-success, #265a3d))}:host([variant=warning]) .badge{background-color:var(--vi-badge-warning-bg, var(--vi-bg-warning, #fff8e1));color:var(--vi-badge-warning-color, var(--vi-text-warning, #e68300))}:host([variant=danger]) .badge{background-color:var(--vi-badge-danger-bg, var(--vi-bg-error, #ffebee));color:var(--vi-badge-danger-color, var(--vi-text-error, #db231b))}:host([variant=info]) .badge{background-color:var(--vi-badge-info-bg, var(--vi-bg-info, #e3f2fd));color:var(--vi-badge-info-color, var(--vi-text-info, #3676d0))}:host([outline][variant=neutral]) .badge{background-color:transparent;color:var(--vi-badge-neutral-color, var(--vi-text-secondary, #4b5563));border-color:var(--vi-badge-neutral-border, var(--vi-border-03, #e0e0e0))}:host([outline][variant=primary]) .badge{background-color:transparent;color:var(--vi-badge-primary-color, var(--vi-text-info, #3676d0));border-color:var(--vi-badge-primary-border, var(--vi-color-primary, #3676d0))}:host([outline][variant=success]) .badge{background-color:transparent;color:var(--vi-badge-success-color, var(--vi-text-success, #265a3d));border-color:var(--vi-badge-success-border, var(--vi-color-success, #489167))}:host([outline][variant=warning]) .badge{background-color:transparent;color:var(--vi-badge-warning-color, var(--vi-text-warning, #e68300));border-color:var(--vi-badge-warning-border, var(--vi-color-warning, #ffba00))}:host([outline][variant=danger]) .badge{background-color:transparent;color:var(--vi-badge-danger-color, var(--vi-text-error, #db231b));border-color:var(--vi-badge-danger-border, var(--vi-color-error, #ef4444))}:host([outline][variant=info]) .badge{background-color:transparent;color:var(--vi-badge-info-color, var(--vi-text-info, #3676d0));border-color:var(--vi-badge-info-border, var(--vi-color-info, #3676d0))}.icon{display:inline-flex;flex-shrink:0}.icon[hidden]{display:none}::slotted(vi-icon),::slotted(svg){--vi-icon-size: 1em;width:1em;height:1em}";
|
|
17
18
|
|
|
18
|
-
function applyDecs2203RFactory() {
|
|
19
|
+
function applyDecs2203RFactory$1() {
|
|
19
20
|
function createAddInitializerMethod(initializers, decoratorFinishedRef) {
|
|
20
21
|
return function addInitializer(initializer) {
|
|
21
22
|
assertNotFinished(decoratorFinishedRef, "addInitializer");
|
|
@@ -384,93 +385,103 @@ function applyDecs2203RFactory() {
|
|
|
384
385
|
};
|
|
385
386
|
};
|
|
386
387
|
}
|
|
387
|
-
function _apply_decs_2203_r(targetClass, memberDecs, classDecs, parentClass) {
|
|
388
|
-
return (_apply_decs_2203_r = applyDecs2203RFactory())(targetClass, memberDecs, classDecs, parentClass);
|
|
388
|
+
function _apply_decs_2203_r$1(targetClass, memberDecs, classDecs, parentClass) {
|
|
389
|
+
return (_apply_decs_2203_r$1 = applyDecs2203RFactory$1())(targetClass, memberDecs, classDecs, parentClass);
|
|
389
390
|
}
|
|
390
|
-
function _identity(x) {
|
|
391
|
+
function _identity$1(x) {
|
|
391
392
|
return x;
|
|
392
393
|
}
|
|
393
|
-
var _dec, _initClass, _ViElement, _dec1, _dec2, _dec3, _dec4, _dec5, _dec6, _dec7, _dec8, _dec9, /** Colour semantic */ _init_variant, /** Size */ _init_size, /** Show coloured dot */ _init_dot, /** Fully rounded (pill shape) vs. square */ _init_pill, /** Numeric count to display */ _init_count, /** Max count before showing {max}+ */ _init_max, /** Outlined/ghost style */ _init_outline, _init__hasIcon, _init__hasDefaultSlot, _initProto;
|
|
394
|
+
var _dec$1, _initClass$1, _ViElement$1, _dec1$1, _dec2$1, _dec3$1, _dec4$1, _dec5$1, _dec6$1, _dec7$1, _dec8$1, _dec9$1, _dec10$1, /** Colour semantic */ _init_variant$1, /** Size */ _init_size, /** Show coloured dot */ _init_dot, /** Fully rounded (pill shape) vs. square */ _init_pill, /** Numeric count to display */ _init_count, /** Show the badge even if the count is zero */ _init_showZero, /** Max count before showing {max}+ */ _init_max, /** Outlined/ghost style */ _init_outline, _init__hasIcon, _init__hasDefaultSlot, _initProto$1;
|
|
394
395
|
let _ViBadge;
|
|
395
|
-
_dec = customElement('vi-badge'), _dec1 = property({
|
|
396
|
+
_dec$1 = customElement('vi-badge'), _dec1$1 = property({
|
|
396
397
|
type: String,
|
|
397
398
|
reflect: true
|
|
398
|
-
}), _dec2 = property({
|
|
399
|
+
}), _dec2$1 = property({
|
|
399
400
|
type: String,
|
|
400
401
|
reflect: true
|
|
401
|
-
}), _dec3 = property({
|
|
402
|
+
}), _dec3$1 = property({
|
|
402
403
|
type: Boolean,
|
|
403
404
|
reflect: true
|
|
404
|
-
}), _dec4 = property({
|
|
405
|
+
}), _dec4$1 = property({
|
|
405
406
|
type: Boolean,
|
|
406
407
|
reflect: true
|
|
407
|
-
}), _dec5 = property({
|
|
408
|
-
type: Number
|
|
409
|
-
|
|
408
|
+
}), _dec5$1 = property({
|
|
409
|
+
type: Number,
|
|
410
|
+
reflect: true
|
|
411
|
+
}), _dec6$1 = property({
|
|
412
|
+
type: Boolean,
|
|
413
|
+
reflect: true,
|
|
414
|
+
attribute: 'show-zero'
|
|
415
|
+
}), _dec7$1 = property({
|
|
410
416
|
type: Number
|
|
411
|
-
}),
|
|
417
|
+
}), _dec8$1 = property({
|
|
412
418
|
type: Boolean,
|
|
413
419
|
reflect: true
|
|
414
|
-
}),
|
|
415
|
-
new class extends _identity {
|
|
420
|
+
}), _dec9$1 = state(), _dec10$1 = state();
|
|
421
|
+
new class extends _identity$1 {
|
|
416
422
|
constructor(){
|
|
417
|
-
super(_ViBadge), _initClass();
|
|
423
|
+
super(_ViBadge), _initClass$1();
|
|
418
424
|
}
|
|
419
425
|
static{
|
|
420
|
-
class ViBadge extends (_ViElement = ViElement) {
|
|
426
|
+
class ViBadge extends (_ViElement$1 = ViElement) {
|
|
421
427
|
static{
|
|
422
|
-
({ e: [_init_variant, _init_size, _init_dot, _init_pill, _init_count, _init_max, _init_outline, _init__hasIcon, _init__hasDefaultSlot, _initProto], c: [_ViBadge, _initClass] } = _apply_decs_2203_r(this, [
|
|
428
|
+
({ e: [_init_variant$1, _init_size, _init_dot, _init_pill, _init_count, _init_showZero, _init_max, _init_outline, _init__hasIcon, _init__hasDefaultSlot, _initProto$1], c: [_ViBadge, _initClass$1] } = _apply_decs_2203_r$1(this, [
|
|
423
429
|
[
|
|
424
|
-
_dec1,
|
|
430
|
+
_dec1$1,
|
|
425
431
|
1,
|
|
426
432
|
"variant"
|
|
427
433
|
],
|
|
428
434
|
[
|
|
429
|
-
_dec2,
|
|
435
|
+
_dec2$1,
|
|
430
436
|
1,
|
|
431
437
|
"size"
|
|
432
438
|
],
|
|
433
439
|
[
|
|
434
|
-
_dec3,
|
|
440
|
+
_dec3$1,
|
|
435
441
|
1,
|
|
436
442
|
"dot"
|
|
437
443
|
],
|
|
438
444
|
[
|
|
439
|
-
_dec4,
|
|
445
|
+
_dec4$1,
|
|
440
446
|
1,
|
|
441
447
|
"pill"
|
|
442
448
|
],
|
|
443
449
|
[
|
|
444
|
-
_dec5,
|
|
450
|
+
_dec5$1,
|
|
445
451
|
1,
|
|
446
452
|
"count"
|
|
447
453
|
],
|
|
448
454
|
[
|
|
449
|
-
_dec6,
|
|
455
|
+
_dec6$1,
|
|
456
|
+
1,
|
|
457
|
+
"showZero"
|
|
458
|
+
],
|
|
459
|
+
[
|
|
460
|
+
_dec7$1,
|
|
450
461
|
1,
|
|
451
462
|
"max"
|
|
452
463
|
],
|
|
453
464
|
[
|
|
454
|
-
|
|
465
|
+
_dec8$1,
|
|
455
466
|
1,
|
|
456
467
|
"outline"
|
|
457
468
|
],
|
|
458
469
|
[
|
|
459
|
-
|
|
470
|
+
_dec9$1,
|
|
460
471
|
1,
|
|
461
472
|
"_hasIcon"
|
|
462
473
|
],
|
|
463
474
|
[
|
|
464
|
-
|
|
475
|
+
_dec10$1,
|
|
465
476
|
1,
|
|
466
477
|
"_hasDefaultSlot"
|
|
467
478
|
]
|
|
468
479
|
], [
|
|
469
|
-
_dec
|
|
470
|
-
], _ViElement));
|
|
480
|
+
_dec$1
|
|
481
|
+
], _ViElement$1));
|
|
471
482
|
}
|
|
472
483
|
static styles = css`${unsafeCSS(badgeStyles)}`;
|
|
473
|
-
#___private_variant_1 = (_initProto(this), _init_variant(this, 'neutral'));
|
|
484
|
+
#___private_variant_1 = (_initProto$1(this), _init_variant$1(this, 'neutral'));
|
|
474
485
|
get variant() {
|
|
475
486
|
return this.#___private_variant_1;
|
|
476
487
|
}
|
|
@@ -505,33 +516,40 @@ new class extends _identity {
|
|
|
505
516
|
set count(_v) {
|
|
506
517
|
this.#___private_count_5 = _v;
|
|
507
518
|
}
|
|
508
|
-
#
|
|
519
|
+
#___private_showZero_6 = _init_showZero(this, false);
|
|
520
|
+
get showZero() {
|
|
521
|
+
return this.#___private_showZero_6;
|
|
522
|
+
}
|
|
523
|
+
set showZero(_v) {
|
|
524
|
+
this.#___private_showZero_6 = _v;
|
|
525
|
+
}
|
|
526
|
+
#___private_max_7 = _init_max(this, 99);
|
|
509
527
|
get max() {
|
|
510
|
-
return this.#
|
|
528
|
+
return this.#___private_max_7;
|
|
511
529
|
}
|
|
512
530
|
set max(_v) {
|
|
513
|
-
this.#
|
|
531
|
+
this.#___private_max_7 = _v;
|
|
514
532
|
}
|
|
515
|
-
#
|
|
533
|
+
#___private_outline_8 = _init_outline(this, false);
|
|
516
534
|
get outline() {
|
|
517
|
-
return this.#
|
|
535
|
+
return this.#___private_outline_8;
|
|
518
536
|
}
|
|
519
537
|
set outline(_v) {
|
|
520
|
-
this.#
|
|
538
|
+
this.#___private_outline_8 = _v;
|
|
521
539
|
}
|
|
522
|
-
#
|
|
540
|
+
#___private__hasIcon_9 = _init__hasIcon(this, false);
|
|
523
541
|
get _hasIcon() {
|
|
524
|
-
return this.#
|
|
542
|
+
return this.#___private__hasIcon_9;
|
|
525
543
|
}
|
|
526
544
|
set _hasIcon(_v) {
|
|
527
|
-
this.#
|
|
545
|
+
this.#___private__hasIcon_9 = _v;
|
|
528
546
|
}
|
|
529
|
-
#
|
|
547
|
+
#___private__hasDefaultSlot_10 = _init__hasDefaultSlot(this, false);
|
|
530
548
|
get _hasDefaultSlot() {
|
|
531
|
-
return this.#
|
|
549
|
+
return this.#___private__hasDefaultSlot_10;
|
|
532
550
|
}
|
|
533
551
|
set _hasDefaultSlot(_v) {
|
|
534
|
-
this.#
|
|
552
|
+
this.#___private__hasDefaultSlot_10 = _v;
|
|
535
553
|
}
|
|
536
554
|
connectedCallback() {
|
|
537
555
|
super.connectedCallback();
|
|
@@ -539,7 +557,7 @@ new class extends _identity {
|
|
|
539
557
|
}
|
|
540
558
|
updated(changedProperties) {
|
|
541
559
|
super.updated(changedProperties);
|
|
542
|
-
if (changedProperties.has('dot') || changedProperties.has('count') || changedProperties.has('_hasDefaultSlot')) {
|
|
560
|
+
if (changedProperties.has('dot') || changedProperties.has('count') || changedProperties.has('showZero') || changedProperties.has('_hasDefaultSlot')) {
|
|
543
561
|
this.updateAriaHidden();
|
|
544
562
|
}
|
|
545
563
|
}
|
|
@@ -594,4 +612,856 @@ new class extends _identity {
|
|
|
594
612
|
}
|
|
595
613
|
}();
|
|
596
614
|
|
|
597
|
-
|
|
615
|
+
const alertStyles = "@charset \"UTF-8\";@layer reset,components,utilities;@layer components{.alert-root{display:flex;align-items:flex-start;box-sizing:border-box;width:100%;border-radius:var(--vi-alert-border-radius, 6px);padding:var(--vi-alert-padding, 12px 16px);gap:var(--vi-alert-gap, 12px);border-width:var(--vi-alert-border-width, 1px);border-style:solid;font-family:var(--vi-font-family-base, -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif);font-size:var(--vi-font-size-sm, 14px);line-height:var(--vi-line-height-normal, 1.5)}.alert-icon{display:flex;align-items:center;justify-content:center;flex-shrink:0;padding-top:2px}.alert-content{display:flex;flex-direction:column;flex-grow:1;min-width:0}.alert-title{font-weight:var(--vi-font-weight-semibold, 600);margin-bottom:4px;display:block}.alert-actions{display:flex;align-items:center;gap:var(--vi-spacing-xs, 8px);margin-top:var(--vi-spacing-sm, 16px)}}:host{display:block;width:100%}:host([floating]){position:absolute;top:0;left:0;right:0;z-index:var(--vi-alert-floating-z-index, 10);box-shadow:var(--vi-alert-floating-shadow, 0 4px 12px rgba(0, 0, 0, .12))}:host([hidden]){display:none!important}.alert-root{overflow:hidden}.alert-root[data-variant=neutral]{background-color:var(--vi-alert-neutral-bg, var(--vi-layer-02, #f3f4f6));border-color:var(--vi-alert-neutral-border, var(--vi-border-04, #bdbdbd));color:var(--vi-alert-neutral-text-color, var(--vi-text-primary, #111827))}.alert-root[data-variant=neutral] .alert-title{color:var(--vi-alert-neutral-title-color, var(--vi-text-primary, #111827))}.alert-root[data-variant=neutral] .alert-icon{color:var(--vi-alert-neutral-icon-color, var(--vi-text-secondary, #4b5563))}.alert-root[data-variant=info]{background-color:var(--vi-alert-info-bg, var(--vi-bg-info, #e3f2fd));border-color:var(--vi-alert-info-border, var(--vi-color-info, #3676d0));color:var(--vi-alert-info-text-color, var(--vi-text-info, #3676d0))}.alert-root[data-variant=info] .alert-title{color:var(--vi-alert-info-title-color, var(--vi-text-info, #3676d0))}.alert-root[data-variant=info] .alert-icon{color:var(--vi-alert-info-icon-color, var(--vi-color-info, #3676d0))}.alert-root[data-variant=success]{background-color:var(--vi-alert-success-bg, var(--vi-bg-success, #e6f9f0));border-color:var(--vi-alert-success-border, var(--vi-color-success, #489167));color:var(--vi-alert-success-text-color, var(--vi-text-success, #265a3d))}.alert-root[data-variant=success] .alert-title{color:var(--vi-alert-success-title-color, var(--vi-text-success, #265a3d))}.alert-root[data-variant=success] .alert-icon{color:var(--vi-alert-success-icon-color, var(--vi-color-success, #489167))}.alert-root[data-variant=warning]{background-color:var(--vi-alert-warning-bg, var(--vi-bg-warning, #fff8e1));border-color:var(--vi-alert-warning-border, var(--vi-color-warning, #ffba00));color:var(--vi-alert-warning-text-color, var(--vi-text-warning, #e68300))}.alert-root[data-variant=warning] .alert-title{color:var(--vi-alert-warning-title-color, var(--vi-text-warning, #e68300))}.alert-root[data-variant=warning] .alert-icon{color:var(--vi-alert-warning-icon-color, var(--vi-color-warning, #ffba00))}.alert-root[data-variant=danger]{background-color:var(--vi-alert-danger-bg, var(--vi-bg-error, #ffebee));border-color:var(--vi-alert-danger-border, var(--vi-color-error, #ef4444));color:var(--vi-alert-danger-text-color, var(--vi-text-error, #db231b))}.alert-root[data-variant=danger] .alert-title{color:var(--vi-alert-danger-title-color, var(--vi-text-error, #db231b))}.alert-root[data-variant=danger] .alert-icon{color:var(--vi-alert-danger-icon-color, var(--vi-color-error, #ef4444))}vi-icon,::slotted(vi-icon),::slotted(svg){--vi-icon-size: 1.25em;width:1.25em;height:1.25em}vi-button[part=close-btn]{margin-top:-4px;margin-right:-4px;margin-left:4px}";
|
|
616
|
+
|
|
617
|
+
function applyDecs2203RFactory() {
|
|
618
|
+
function createAddInitializerMethod(initializers, decoratorFinishedRef) {
|
|
619
|
+
return function addInitializer(initializer) {
|
|
620
|
+
assertNotFinished(decoratorFinishedRef, "addInitializer");
|
|
621
|
+
assertCallable(initializer, "An initializer");
|
|
622
|
+
initializers.push(initializer);
|
|
623
|
+
};
|
|
624
|
+
}
|
|
625
|
+
function memberDec(dec, name, desc, initializers, kind, isStatic, isPrivate, metadata, value) {
|
|
626
|
+
var kindStr;
|
|
627
|
+
switch(kind){
|
|
628
|
+
case 1:
|
|
629
|
+
kindStr = "accessor";
|
|
630
|
+
break;
|
|
631
|
+
case 2:
|
|
632
|
+
kindStr = "method";
|
|
633
|
+
break;
|
|
634
|
+
case 3:
|
|
635
|
+
kindStr = "getter";
|
|
636
|
+
break;
|
|
637
|
+
case 4:
|
|
638
|
+
kindStr = "setter";
|
|
639
|
+
break;
|
|
640
|
+
default:
|
|
641
|
+
kindStr = "field";
|
|
642
|
+
}
|
|
643
|
+
var ctx = {
|
|
644
|
+
kind: kindStr,
|
|
645
|
+
name: isPrivate ? "#" + name : name,
|
|
646
|
+
static: isStatic,
|
|
647
|
+
private: isPrivate,
|
|
648
|
+
metadata: metadata
|
|
649
|
+
};
|
|
650
|
+
var decoratorFinishedRef = {
|
|
651
|
+
v: false
|
|
652
|
+
};
|
|
653
|
+
ctx.addInitializer = createAddInitializerMethod(initializers, decoratorFinishedRef);
|
|
654
|
+
var get, set;
|
|
655
|
+
if (kind === 0) {
|
|
656
|
+
if (isPrivate) {
|
|
657
|
+
get = desc.get;
|
|
658
|
+
set = desc.set;
|
|
659
|
+
} else {
|
|
660
|
+
get = function() {
|
|
661
|
+
return this[name];
|
|
662
|
+
};
|
|
663
|
+
set = function(v) {
|
|
664
|
+
this[name] = v;
|
|
665
|
+
};
|
|
666
|
+
}
|
|
667
|
+
} else if (kind === 2) {
|
|
668
|
+
get = function() {
|
|
669
|
+
return desc.value;
|
|
670
|
+
};
|
|
671
|
+
} else {
|
|
672
|
+
if (kind === 1 || kind === 3) {
|
|
673
|
+
get = function() {
|
|
674
|
+
return desc.get.call(this);
|
|
675
|
+
};
|
|
676
|
+
}
|
|
677
|
+
if (kind === 1 || kind === 4) {
|
|
678
|
+
set = function(v) {
|
|
679
|
+
desc.set.call(this, v);
|
|
680
|
+
};
|
|
681
|
+
}
|
|
682
|
+
}
|
|
683
|
+
ctx.access = get && set ? {
|
|
684
|
+
get: get,
|
|
685
|
+
set: set
|
|
686
|
+
} : get ? {
|
|
687
|
+
get: get
|
|
688
|
+
} : {
|
|
689
|
+
set: set
|
|
690
|
+
};
|
|
691
|
+
try {
|
|
692
|
+
return dec(value, ctx);
|
|
693
|
+
} finally{
|
|
694
|
+
decoratorFinishedRef.v = true;
|
|
695
|
+
}
|
|
696
|
+
}
|
|
697
|
+
function assertNotFinished(decoratorFinishedRef, fnName) {
|
|
698
|
+
if (decoratorFinishedRef.v) {
|
|
699
|
+
throw new Error("attempted to call " + fnName + " after decoration was finished");
|
|
700
|
+
}
|
|
701
|
+
}
|
|
702
|
+
function assertCallable(fn, hint) {
|
|
703
|
+
if (typeof fn !== "function") {
|
|
704
|
+
throw new TypeError(hint + " must be a function");
|
|
705
|
+
}
|
|
706
|
+
}
|
|
707
|
+
function assertValidReturnValue(kind, value) {
|
|
708
|
+
var type = typeof value;
|
|
709
|
+
if (kind === 1) {
|
|
710
|
+
if (type !== "object" || value === null) {
|
|
711
|
+
throw new TypeError("accessor decorators must return an object with get, set, or init properties or void 0");
|
|
712
|
+
}
|
|
713
|
+
if (value.get !== undefined) {
|
|
714
|
+
assertCallable(value.get, "accessor.get");
|
|
715
|
+
}
|
|
716
|
+
if (value.set !== undefined) {
|
|
717
|
+
assertCallable(value.set, "accessor.set");
|
|
718
|
+
}
|
|
719
|
+
if (value.init !== undefined) {
|
|
720
|
+
assertCallable(value.init, "accessor.init");
|
|
721
|
+
}
|
|
722
|
+
} else if (type !== "function") {
|
|
723
|
+
var hint;
|
|
724
|
+
if (kind === 0) {
|
|
725
|
+
hint = "field";
|
|
726
|
+
} else if (kind === 10) {
|
|
727
|
+
hint = "class";
|
|
728
|
+
} else {
|
|
729
|
+
hint = "method";
|
|
730
|
+
}
|
|
731
|
+
throw new TypeError(hint + " decorators must return a function or void 0");
|
|
732
|
+
}
|
|
733
|
+
}
|
|
734
|
+
function applyMemberDec(ret, base, decInfo, name, kind, isStatic, isPrivate, initializers, metadata) {
|
|
735
|
+
var decs = decInfo[0];
|
|
736
|
+
var desc, init, value;
|
|
737
|
+
if (isPrivate) {
|
|
738
|
+
if (kind === 0 || kind === 1) {
|
|
739
|
+
desc = {
|
|
740
|
+
get: decInfo[3],
|
|
741
|
+
set: decInfo[4]
|
|
742
|
+
};
|
|
743
|
+
} else if (kind === 3) {
|
|
744
|
+
desc = {
|
|
745
|
+
get: decInfo[3]
|
|
746
|
+
};
|
|
747
|
+
} else if (kind === 4) {
|
|
748
|
+
desc = {
|
|
749
|
+
set: decInfo[3]
|
|
750
|
+
};
|
|
751
|
+
} else {
|
|
752
|
+
desc = {
|
|
753
|
+
value: decInfo[3]
|
|
754
|
+
};
|
|
755
|
+
}
|
|
756
|
+
} else if (kind !== 0) {
|
|
757
|
+
desc = Object.getOwnPropertyDescriptor(base, name);
|
|
758
|
+
}
|
|
759
|
+
if (kind === 1) {
|
|
760
|
+
value = {
|
|
761
|
+
get: desc.get,
|
|
762
|
+
set: desc.set
|
|
763
|
+
};
|
|
764
|
+
} else if (kind === 2) {
|
|
765
|
+
value = desc.value;
|
|
766
|
+
} else if (kind === 3) {
|
|
767
|
+
value = desc.get;
|
|
768
|
+
} else if (kind === 4) {
|
|
769
|
+
value = desc.set;
|
|
770
|
+
}
|
|
771
|
+
var newValue, get, set;
|
|
772
|
+
if (typeof decs === "function") {
|
|
773
|
+
newValue = memberDec(decs, name, desc, initializers, kind, isStatic, isPrivate, metadata, value);
|
|
774
|
+
if (newValue !== void 0) {
|
|
775
|
+
assertValidReturnValue(kind, newValue);
|
|
776
|
+
if (kind === 0) {
|
|
777
|
+
init = newValue;
|
|
778
|
+
} else if (kind === 1) {
|
|
779
|
+
init = newValue.init;
|
|
780
|
+
get = newValue.get || value.get;
|
|
781
|
+
set = newValue.set || value.set;
|
|
782
|
+
value = {
|
|
783
|
+
get: get,
|
|
784
|
+
set: set
|
|
785
|
+
};
|
|
786
|
+
} else {
|
|
787
|
+
value = newValue;
|
|
788
|
+
}
|
|
789
|
+
}
|
|
790
|
+
} else {
|
|
791
|
+
for(var i = decs.length - 1; i >= 0; i--){
|
|
792
|
+
var dec = decs[i];
|
|
793
|
+
newValue = memberDec(dec, name, desc, initializers, kind, isStatic, isPrivate, metadata, value);
|
|
794
|
+
if (newValue !== void 0) {
|
|
795
|
+
assertValidReturnValue(kind, newValue);
|
|
796
|
+
var newInit;
|
|
797
|
+
if (kind === 0) {
|
|
798
|
+
newInit = newValue;
|
|
799
|
+
} else if (kind === 1) {
|
|
800
|
+
newInit = newValue.init;
|
|
801
|
+
get = newValue.get || value.get;
|
|
802
|
+
set = newValue.set || value.set;
|
|
803
|
+
value = {
|
|
804
|
+
get: get,
|
|
805
|
+
set: set
|
|
806
|
+
};
|
|
807
|
+
} else {
|
|
808
|
+
value = newValue;
|
|
809
|
+
}
|
|
810
|
+
if (newInit !== void 0) {
|
|
811
|
+
if (init === void 0) {
|
|
812
|
+
init = newInit;
|
|
813
|
+
} else if (typeof init === "function") {
|
|
814
|
+
init = [
|
|
815
|
+
init,
|
|
816
|
+
newInit
|
|
817
|
+
];
|
|
818
|
+
} else {
|
|
819
|
+
init.push(newInit);
|
|
820
|
+
}
|
|
821
|
+
}
|
|
822
|
+
}
|
|
823
|
+
}
|
|
824
|
+
}
|
|
825
|
+
if (kind === 0 || kind === 1) {
|
|
826
|
+
if (init === void 0) {
|
|
827
|
+
init = function(instance, init) {
|
|
828
|
+
return init;
|
|
829
|
+
};
|
|
830
|
+
} else if (typeof init !== "function") {
|
|
831
|
+
var ownInitializers = init;
|
|
832
|
+
init = function(instance, init) {
|
|
833
|
+
var value = init;
|
|
834
|
+
for(var i = 0; i < ownInitializers.length; i++){
|
|
835
|
+
value = ownInitializers[i].call(instance, value);
|
|
836
|
+
}
|
|
837
|
+
return value;
|
|
838
|
+
};
|
|
839
|
+
} else {
|
|
840
|
+
var originalInitializer = init;
|
|
841
|
+
init = function(instance, init) {
|
|
842
|
+
return originalInitializer.call(instance, init);
|
|
843
|
+
};
|
|
844
|
+
}
|
|
845
|
+
ret.push(init);
|
|
846
|
+
}
|
|
847
|
+
if (kind !== 0) {
|
|
848
|
+
if (kind === 1) {
|
|
849
|
+
desc.get = value.get;
|
|
850
|
+
desc.set = value.set;
|
|
851
|
+
} else if (kind === 2) {
|
|
852
|
+
desc.value = value;
|
|
853
|
+
} else if (kind === 3) {
|
|
854
|
+
desc.get = value;
|
|
855
|
+
} else if (kind === 4) {
|
|
856
|
+
desc.set = value;
|
|
857
|
+
}
|
|
858
|
+
if (isPrivate) {
|
|
859
|
+
if (kind === 1) {
|
|
860
|
+
ret.push(function(instance, args) {
|
|
861
|
+
return value.get.call(instance, args);
|
|
862
|
+
});
|
|
863
|
+
ret.push(function(instance, args) {
|
|
864
|
+
return value.set.call(instance, args);
|
|
865
|
+
});
|
|
866
|
+
} else if (kind === 2) {
|
|
867
|
+
ret.push(value);
|
|
868
|
+
} else {
|
|
869
|
+
ret.push(function(instance, args) {
|
|
870
|
+
return value.call(instance, args);
|
|
871
|
+
});
|
|
872
|
+
}
|
|
873
|
+
} else {
|
|
874
|
+
Object.defineProperty(base, name, desc);
|
|
875
|
+
}
|
|
876
|
+
}
|
|
877
|
+
}
|
|
878
|
+
function applyMemberDecs(Class, decInfos, metadata) {
|
|
879
|
+
var ret = [];
|
|
880
|
+
var protoInitializers;
|
|
881
|
+
var staticInitializers;
|
|
882
|
+
var existingProtoNonFields = new Map();
|
|
883
|
+
var existingStaticNonFields = new Map();
|
|
884
|
+
for(var i = 0; i < decInfos.length; i++){
|
|
885
|
+
var decInfo = decInfos[i];
|
|
886
|
+
if (!Array.isArray(decInfo)) continue;
|
|
887
|
+
var kind = decInfo[1];
|
|
888
|
+
var name = decInfo[2];
|
|
889
|
+
var isPrivate = decInfo.length > 3;
|
|
890
|
+
var isStatic = kind >= 5;
|
|
891
|
+
var base;
|
|
892
|
+
var initializers;
|
|
893
|
+
if (isStatic) {
|
|
894
|
+
base = Class;
|
|
895
|
+
kind = kind - 5;
|
|
896
|
+
staticInitializers = staticInitializers || [];
|
|
897
|
+
initializers = staticInitializers;
|
|
898
|
+
} else {
|
|
899
|
+
base = Class.prototype;
|
|
900
|
+
protoInitializers = protoInitializers || [];
|
|
901
|
+
initializers = protoInitializers;
|
|
902
|
+
}
|
|
903
|
+
if (kind !== 0 && !isPrivate) {
|
|
904
|
+
var existingNonFields = isStatic ? existingStaticNonFields : existingProtoNonFields;
|
|
905
|
+
var existingKind = existingNonFields.get(name) || 0;
|
|
906
|
+
if (existingKind === true || existingKind === 3 && kind !== 4 || existingKind === 4 && kind !== 3) {
|
|
907
|
+
throw new Error("Attempted to decorate a public method/accessor that has the same name as a previously decorated public method/accessor. This is not currently supported by the decorators plugin. Property name was: " + name);
|
|
908
|
+
} else if (!existingKind && kind > 2) {
|
|
909
|
+
existingNonFields.set(name, kind);
|
|
910
|
+
} else {
|
|
911
|
+
existingNonFields.set(name, true);
|
|
912
|
+
}
|
|
913
|
+
}
|
|
914
|
+
applyMemberDec(ret, base, decInfo, name, kind, isStatic, isPrivate, initializers, metadata);
|
|
915
|
+
}
|
|
916
|
+
pushInitializers(ret, protoInitializers);
|
|
917
|
+
pushInitializers(ret, staticInitializers);
|
|
918
|
+
return ret;
|
|
919
|
+
}
|
|
920
|
+
function pushInitializers(ret, initializers) {
|
|
921
|
+
if (initializers) {
|
|
922
|
+
ret.push(function(instance) {
|
|
923
|
+
for(var i = 0; i < initializers.length; i++){
|
|
924
|
+
initializers[i].call(instance);
|
|
925
|
+
}
|
|
926
|
+
return instance;
|
|
927
|
+
});
|
|
928
|
+
}
|
|
929
|
+
}
|
|
930
|
+
function applyClassDecs(targetClass, classDecs, metadata) {
|
|
931
|
+
if (classDecs.length > 0) {
|
|
932
|
+
var initializers = [];
|
|
933
|
+
var newClass = targetClass;
|
|
934
|
+
var name = targetClass.name;
|
|
935
|
+
for(var i = classDecs.length - 1; i >= 0; i--){
|
|
936
|
+
var decoratorFinishedRef = {
|
|
937
|
+
v: false
|
|
938
|
+
};
|
|
939
|
+
try {
|
|
940
|
+
var nextNewClass = classDecs[i](newClass, {
|
|
941
|
+
kind: "class",
|
|
942
|
+
name: name,
|
|
943
|
+
addInitializer: createAddInitializerMethod(initializers, decoratorFinishedRef),
|
|
944
|
+
metadata
|
|
945
|
+
});
|
|
946
|
+
} finally{
|
|
947
|
+
decoratorFinishedRef.v = true;
|
|
948
|
+
}
|
|
949
|
+
if (nextNewClass !== undefined) {
|
|
950
|
+
assertValidReturnValue(10, nextNewClass);
|
|
951
|
+
newClass = nextNewClass;
|
|
952
|
+
}
|
|
953
|
+
}
|
|
954
|
+
return [
|
|
955
|
+
defineMetadata(newClass, metadata),
|
|
956
|
+
function() {
|
|
957
|
+
for(var i = 0; i < initializers.length; i++){
|
|
958
|
+
initializers[i].call(newClass);
|
|
959
|
+
}
|
|
960
|
+
}
|
|
961
|
+
];
|
|
962
|
+
}
|
|
963
|
+
}
|
|
964
|
+
function defineMetadata(Class, metadata) {
|
|
965
|
+
return Object.defineProperty(Class, Symbol.metadata || Symbol.for("Symbol.metadata"), {
|
|
966
|
+
configurable: true,
|
|
967
|
+
enumerable: true,
|
|
968
|
+
value: metadata
|
|
969
|
+
});
|
|
970
|
+
}
|
|
971
|
+
return function applyDecs2203R(targetClass, memberDecs, classDecs, parentClass) {
|
|
972
|
+
if (parentClass !== void 0) {
|
|
973
|
+
var parentMetadata = parentClass[Symbol.metadata || Symbol.for("Symbol.metadata")];
|
|
974
|
+
}
|
|
975
|
+
var metadata = Object.create(parentMetadata === void 0 ? null : parentMetadata);
|
|
976
|
+
var e = applyMemberDecs(targetClass, memberDecs, metadata);
|
|
977
|
+
if (!classDecs.length) defineMetadata(targetClass, metadata);
|
|
978
|
+
return {
|
|
979
|
+
e: e,
|
|
980
|
+
get c () {
|
|
981
|
+
return applyClassDecs(targetClass, classDecs, metadata);
|
|
982
|
+
}
|
|
983
|
+
};
|
|
984
|
+
};
|
|
985
|
+
}
|
|
986
|
+
function _apply_decs_2203_r(targetClass, memberDecs, classDecs, parentClass) {
|
|
987
|
+
return (_apply_decs_2203_r = applyDecs2203RFactory())(targetClass, memberDecs, classDecs, parentClass);
|
|
988
|
+
}
|
|
989
|
+
function _identity(x) {
|
|
990
|
+
return x;
|
|
991
|
+
}
|
|
992
|
+
var _dec, _initClass, _ViElement, _dec1, _dec2, _dec3, _dec4, _dec5, _dec6, _dec7, _dec8, _dec9, _dec10, _dec11, _dec12, _dec13, /** Colour, icon, ARIA role */ _init_variant, /** Bold headline (optional) */ _init_title, /** Show × dismiss button */ _init_dismissible, /** Accessible label for the dismiss button */ _init_dismissLabel, /**
|
|
993
|
+
* Enables auto-hiding after a duration (default: 5000ms).
|
|
994
|
+
* Note: Setting a positive `duration` or `auto-hide-duration` also implicitly enables auto-hiding.
|
|
995
|
+
*/ _init_autoHide, /** Auto hide duration in milliseconds (default: 5000ms) */ _init_autoHideDuration, /**
|
|
996
|
+
* Alias for auto-hide-duration in milliseconds.
|
|
997
|
+
* Setting a positive duration enables auto-hiding automatically.
|
|
998
|
+
*/ _init_duration, /** Override the default status icon name */ _init_icon, /** Controls whether the alert is displayed */ _init_open, /** Position alert absolutely over parent container without pushing layout */ _init_floating, /** Hide the icon */ _init_noIcon, _init__hasTitleSlot, _init__hasActionsSlot, _initProto;
|
|
999
|
+
const checkCircleIcon = {
|
|
1000
|
+
name: 'check-circle',
|
|
1001
|
+
data: `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M22 11.08V12a10 10 0 1 1-5.93-9.14"></path><polyline points="22 4 12 14.01 9 11.01"></polyline></svg>`
|
|
1002
|
+
};
|
|
1003
|
+
const alertTriangleIcon = {
|
|
1004
|
+
name: 'alert-triangle',
|
|
1005
|
+
data: `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><path d="M10.29 3.86L1.82 18a2 2 0 0 0 1.71 3h16.94a2 2 0 0 0 1.71-3L13.71 3.86a2 2 0 0 0-3.42 0z"></path><line x1="12" y1="9" x2="12" y2="13"></line><line x1="12" y1="17" x2="12.01" y2="17"></line></svg>`
|
|
1006
|
+
};
|
|
1007
|
+
const infoIcon = {
|
|
1008
|
+
name: 'info',
|
|
1009
|
+
data: `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="16" x2="12" y2="12"></line><line x1="12" y1="8" x2="12.01" y2="8"></line></svg>`
|
|
1010
|
+
};
|
|
1011
|
+
const xIcon = {
|
|
1012
|
+
name: 'x',
|
|
1013
|
+
data: `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="6" x2="6" y2="18"></line><line x1="6" y1="6" x2="18" y2="18"></line></svg>`
|
|
1014
|
+
};
|
|
1015
|
+
const lockIcon = {
|
|
1016
|
+
name: 'lock',
|
|
1017
|
+
data: `<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="11" width="18" height="11" rx="2" ry="2"></rect><path d="M7 11V7a5 5 0 0 1 10 0v4"></path></svg>`
|
|
1018
|
+
};
|
|
1019
|
+
registerIcons([
|
|
1020
|
+
checkCircleIcon,
|
|
1021
|
+
alertTriangleIcon,
|
|
1022
|
+
infoIcon,
|
|
1023
|
+
xIcon,
|
|
1024
|
+
lockIcon
|
|
1025
|
+
]);
|
|
1026
|
+
let _ViAlert;
|
|
1027
|
+
_dec = customElement('vi-alert'), _dec1 = property({
|
|
1028
|
+
type: String,
|
|
1029
|
+
reflect: true
|
|
1030
|
+
}), _dec2 = property({
|
|
1031
|
+
type: String
|
|
1032
|
+
}), _dec3 = property({
|
|
1033
|
+
type: Boolean,
|
|
1034
|
+
reflect: true
|
|
1035
|
+
}), _dec4 = property({
|
|
1036
|
+
type: String,
|
|
1037
|
+
attribute: 'dismiss-label'
|
|
1038
|
+
}), _dec5 = property({
|
|
1039
|
+
type: Boolean,
|
|
1040
|
+
attribute: 'auto-hide',
|
|
1041
|
+
reflect: true
|
|
1042
|
+
}), _dec6 = property({
|
|
1043
|
+
type: Number,
|
|
1044
|
+
attribute: 'auto-hide-duration'
|
|
1045
|
+
}), _dec7 = property({
|
|
1046
|
+
type: Number
|
|
1047
|
+
}), _dec8 = property({
|
|
1048
|
+
type: String
|
|
1049
|
+
}), _dec9 = property({
|
|
1050
|
+
type: Boolean,
|
|
1051
|
+
reflect: true
|
|
1052
|
+
}), _dec10 = property({
|
|
1053
|
+
type: Boolean,
|
|
1054
|
+
reflect: true
|
|
1055
|
+
}), _dec11 = property({
|
|
1056
|
+
type: Boolean,
|
|
1057
|
+
attribute: 'no-icon',
|
|
1058
|
+
reflect: true
|
|
1059
|
+
}), _dec12 = state(), _dec13 = state();
|
|
1060
|
+
new class extends _identity {
|
|
1061
|
+
constructor(){
|
|
1062
|
+
super(_ViAlert), _initClass();
|
|
1063
|
+
}
|
|
1064
|
+
static{
|
|
1065
|
+
class ViAlert extends (_ViElement = ViElement) {
|
|
1066
|
+
static{
|
|
1067
|
+
({ e: [_init_variant, _init_title, _init_dismissible, _init_dismissLabel, _init_autoHide, _init_autoHideDuration, _init_duration, _init_icon, _init_open, _init_floating, _init_noIcon, _init__hasTitleSlot, _init__hasActionsSlot, _initProto], c: [_ViAlert, _initClass] } = _apply_decs_2203_r(this, [
|
|
1068
|
+
[
|
|
1069
|
+
_dec1,
|
|
1070
|
+
1,
|
|
1071
|
+
"variant"
|
|
1072
|
+
],
|
|
1073
|
+
[
|
|
1074
|
+
_dec2,
|
|
1075
|
+
1,
|
|
1076
|
+
"title"
|
|
1077
|
+
],
|
|
1078
|
+
[
|
|
1079
|
+
_dec3,
|
|
1080
|
+
1,
|
|
1081
|
+
"dismissible"
|
|
1082
|
+
],
|
|
1083
|
+
[
|
|
1084
|
+
_dec4,
|
|
1085
|
+
1,
|
|
1086
|
+
"dismissLabel"
|
|
1087
|
+
],
|
|
1088
|
+
[
|
|
1089
|
+
_dec5,
|
|
1090
|
+
1,
|
|
1091
|
+
"autoHide"
|
|
1092
|
+
],
|
|
1093
|
+
[
|
|
1094
|
+
_dec6,
|
|
1095
|
+
1,
|
|
1096
|
+
"autoHideDuration"
|
|
1097
|
+
],
|
|
1098
|
+
[
|
|
1099
|
+
_dec7,
|
|
1100
|
+
1,
|
|
1101
|
+
"duration"
|
|
1102
|
+
],
|
|
1103
|
+
[
|
|
1104
|
+
_dec8,
|
|
1105
|
+
1,
|
|
1106
|
+
"icon"
|
|
1107
|
+
],
|
|
1108
|
+
[
|
|
1109
|
+
_dec9,
|
|
1110
|
+
1,
|
|
1111
|
+
"open"
|
|
1112
|
+
],
|
|
1113
|
+
[
|
|
1114
|
+
_dec10,
|
|
1115
|
+
1,
|
|
1116
|
+
"floating"
|
|
1117
|
+
],
|
|
1118
|
+
[
|
|
1119
|
+
_dec11,
|
|
1120
|
+
1,
|
|
1121
|
+
"noIcon"
|
|
1122
|
+
],
|
|
1123
|
+
[
|
|
1124
|
+
_dec12,
|
|
1125
|
+
1,
|
|
1126
|
+
"_hasTitleSlot"
|
|
1127
|
+
],
|
|
1128
|
+
[
|
|
1129
|
+
_dec13,
|
|
1130
|
+
1,
|
|
1131
|
+
"_hasActionsSlot"
|
|
1132
|
+
]
|
|
1133
|
+
], [
|
|
1134
|
+
_dec
|
|
1135
|
+
], _ViElement));
|
|
1136
|
+
}
|
|
1137
|
+
static styles = css`
|
|
1138
|
+
${unsafeCSS(alertStyles)}
|
|
1139
|
+
`;
|
|
1140
|
+
#___private_variant_1 = (_initProto(this), _init_variant(this, 'info'));
|
|
1141
|
+
get variant() {
|
|
1142
|
+
return this.#___private_variant_1;
|
|
1143
|
+
}
|
|
1144
|
+
set variant(_v) {
|
|
1145
|
+
this.#___private_variant_1 = _v;
|
|
1146
|
+
}
|
|
1147
|
+
#___private_title_2 = _init_title(this, '');
|
|
1148
|
+
get title() {
|
|
1149
|
+
return this.#___private_title_2;
|
|
1150
|
+
}
|
|
1151
|
+
set title(_v) {
|
|
1152
|
+
this.#___private_title_2 = _v;
|
|
1153
|
+
}
|
|
1154
|
+
#___private_dismissible_3 = _init_dismissible(this, false);
|
|
1155
|
+
get dismissible() {
|
|
1156
|
+
return this.#___private_dismissible_3;
|
|
1157
|
+
}
|
|
1158
|
+
set dismissible(_v) {
|
|
1159
|
+
this.#___private_dismissible_3 = _v;
|
|
1160
|
+
}
|
|
1161
|
+
#___private_dismissLabel_4 = _init_dismissLabel(this, 'Dismiss alert');
|
|
1162
|
+
get dismissLabel() {
|
|
1163
|
+
return this.#___private_dismissLabel_4;
|
|
1164
|
+
}
|
|
1165
|
+
set dismissLabel(_v) {
|
|
1166
|
+
this.#___private_dismissLabel_4 = _v;
|
|
1167
|
+
}
|
|
1168
|
+
#___private_autoHide_5 = _init_autoHide(this, false);
|
|
1169
|
+
get autoHide() {
|
|
1170
|
+
return this.#___private_autoHide_5;
|
|
1171
|
+
}
|
|
1172
|
+
set autoHide(_v) {
|
|
1173
|
+
this.#___private_autoHide_5 = _v;
|
|
1174
|
+
}
|
|
1175
|
+
#___private_autoHideDuration_6 = _init_autoHideDuration(this, 5000);
|
|
1176
|
+
get autoHideDuration() {
|
|
1177
|
+
return this.#___private_autoHideDuration_6;
|
|
1178
|
+
}
|
|
1179
|
+
set autoHideDuration(_v) {
|
|
1180
|
+
this.#___private_autoHideDuration_6 = _v;
|
|
1181
|
+
}
|
|
1182
|
+
#___private_duration_7 = _init_duration(this, undefined);
|
|
1183
|
+
get duration() {
|
|
1184
|
+
return this.#___private_duration_7;
|
|
1185
|
+
}
|
|
1186
|
+
set duration(_v) {
|
|
1187
|
+
this.#___private_duration_7 = _v;
|
|
1188
|
+
}
|
|
1189
|
+
#___private_icon_8 = _init_icon(this, undefined);
|
|
1190
|
+
get icon() {
|
|
1191
|
+
return this.#___private_icon_8;
|
|
1192
|
+
}
|
|
1193
|
+
set icon(_v) {
|
|
1194
|
+
this.#___private_icon_8 = _v;
|
|
1195
|
+
}
|
|
1196
|
+
#___private_open_9 = _init_open(this, true);
|
|
1197
|
+
get open() {
|
|
1198
|
+
return this.#___private_open_9;
|
|
1199
|
+
}
|
|
1200
|
+
set open(_v) {
|
|
1201
|
+
this.#___private_open_9 = _v;
|
|
1202
|
+
}
|
|
1203
|
+
#___private_floating_10 = _init_floating(this, false);
|
|
1204
|
+
get floating() {
|
|
1205
|
+
return this.#___private_floating_10;
|
|
1206
|
+
}
|
|
1207
|
+
set floating(_v) {
|
|
1208
|
+
this.#___private_floating_10 = _v;
|
|
1209
|
+
}
|
|
1210
|
+
#___private_noIcon_11 = _init_noIcon(this, false);
|
|
1211
|
+
get noIcon() {
|
|
1212
|
+
return this.#___private_noIcon_11;
|
|
1213
|
+
}
|
|
1214
|
+
set noIcon(_v) {
|
|
1215
|
+
this.#___private_noIcon_11 = _v;
|
|
1216
|
+
}
|
|
1217
|
+
#___private__hasTitleSlot_12 = _init__hasTitleSlot(this, false);
|
|
1218
|
+
get _hasTitleSlot() {
|
|
1219
|
+
return this.#___private__hasTitleSlot_12;
|
|
1220
|
+
}
|
|
1221
|
+
set _hasTitleSlot(_v) {
|
|
1222
|
+
this.#___private__hasTitleSlot_12 = _v;
|
|
1223
|
+
}
|
|
1224
|
+
#___private__hasActionsSlot_13 = _init__hasActionsSlot(this, false);
|
|
1225
|
+
get _hasActionsSlot() {
|
|
1226
|
+
return this.#___private__hasActionsSlot_13;
|
|
1227
|
+
}
|
|
1228
|
+
set _hasActionsSlot(_v) {
|
|
1229
|
+
this.#___private__hasActionsSlot_13 = _v;
|
|
1230
|
+
}
|
|
1231
|
+
_autoHideTimer = null;
|
|
1232
|
+
/** Helper to check whether auto-hide is enabled via boolean toggle or duration setting */ get _shouldAutoHide() {
|
|
1233
|
+
return this.autoHide || this.duration !== undefined && this.duration > 0;
|
|
1234
|
+
}
|
|
1235
|
+
connectedCallback() {
|
|
1236
|
+
super.connectedCallback();
|
|
1237
|
+
this.updateRole();
|
|
1238
|
+
if (!this.open) {
|
|
1239
|
+
this.hidden = true;
|
|
1240
|
+
} else if (this._shouldAutoHide) {
|
|
1241
|
+
this._startAutoHideTimer();
|
|
1242
|
+
}
|
|
1243
|
+
}
|
|
1244
|
+
disconnectedCallback() {
|
|
1245
|
+
super.disconnectedCallback();
|
|
1246
|
+
this._clearAutoHideTimer();
|
|
1247
|
+
}
|
|
1248
|
+
updated(changedProperties) {
|
|
1249
|
+
super.updated(changedProperties);
|
|
1250
|
+
if (changedProperties.has('variant')) {
|
|
1251
|
+
this.updateRole();
|
|
1252
|
+
}
|
|
1253
|
+
if (changedProperties.has('open') && changedProperties.get('open') !== undefined) {
|
|
1254
|
+
if (this.open) {
|
|
1255
|
+
this._handleOpen();
|
|
1256
|
+
} else if (!this.hidden) {
|
|
1257
|
+
this.handleDismiss();
|
|
1258
|
+
}
|
|
1259
|
+
}
|
|
1260
|
+
if (changedProperties.has('autoHide') || changedProperties.has('autoHideDuration') || changedProperties.has('duration')) {
|
|
1261
|
+
if (this.open && this._shouldAutoHide) {
|
|
1262
|
+
this._startAutoHideTimer();
|
|
1263
|
+
} else {
|
|
1264
|
+
this._clearAutoHideTimer();
|
|
1265
|
+
}
|
|
1266
|
+
}
|
|
1267
|
+
}
|
|
1268
|
+
updateRole() {
|
|
1269
|
+
switch(this.variant){
|
|
1270
|
+
case 'warning':
|
|
1271
|
+
case 'danger':
|
|
1272
|
+
this.setAttribute('role', 'alert');
|
|
1273
|
+
break;
|
|
1274
|
+
case 'info':
|
|
1275
|
+
case 'success':
|
|
1276
|
+
this.setAttribute('role', 'status');
|
|
1277
|
+
break;
|
|
1278
|
+
case 'neutral':
|
|
1279
|
+
default:
|
|
1280
|
+
this.removeAttribute('role');
|
|
1281
|
+
break;
|
|
1282
|
+
}
|
|
1283
|
+
}
|
|
1284
|
+
get defaultIcon() {
|
|
1285
|
+
switch(this.variant){
|
|
1286
|
+
case 'success':
|
|
1287
|
+
return 'check-circle';
|
|
1288
|
+
case 'warning':
|
|
1289
|
+
case 'danger':
|
|
1290
|
+
return 'alert-triangle';
|
|
1291
|
+
case 'info':
|
|
1292
|
+
default:
|
|
1293
|
+
return 'info';
|
|
1294
|
+
}
|
|
1295
|
+
}
|
|
1296
|
+
onTitleSlotChange(e) {
|
|
1297
|
+
const slot = e.target;
|
|
1298
|
+
this._hasTitleSlot = slot.assignedNodes({
|
|
1299
|
+
flatten: true
|
|
1300
|
+
}).length > 0;
|
|
1301
|
+
}
|
|
1302
|
+
onActionsSlotChange(e) {
|
|
1303
|
+
const slot = e.target;
|
|
1304
|
+
this._hasActionsSlot = slot.assignedNodes({
|
|
1305
|
+
flatten: true
|
|
1306
|
+
}).length > 0;
|
|
1307
|
+
}
|
|
1308
|
+
_startAutoHideTimer() {
|
|
1309
|
+
this._clearAutoHideTimer();
|
|
1310
|
+
const timeout = this.duration ?? this.autoHideDuration;
|
|
1311
|
+
if (timeout > 0) {
|
|
1312
|
+
this._autoHideTimer = setTimeout(()=>{
|
|
1313
|
+
this.hide();
|
|
1314
|
+
}, timeout);
|
|
1315
|
+
}
|
|
1316
|
+
}
|
|
1317
|
+
_clearAutoHideTimer() {
|
|
1318
|
+
if (this._autoHideTimer !== null) {
|
|
1319
|
+
clearTimeout(this._autoHideTimer);
|
|
1320
|
+
this._autoHideTimer = null;
|
|
1321
|
+
}
|
|
1322
|
+
}
|
|
1323
|
+
_handleOpen() {
|
|
1324
|
+
this.hidden = false;
|
|
1325
|
+
if (this.shadowRoot) {
|
|
1326
|
+
const root = this.shadowRoot.querySelector('.alert-root');
|
|
1327
|
+
if (root && typeof root.getAnimations === 'function') {
|
|
1328
|
+
root.getAnimations().forEach((anim)=>anim.cancel());
|
|
1329
|
+
}
|
|
1330
|
+
}
|
|
1331
|
+
if (this._shouldAutoHide) {
|
|
1332
|
+
this._startAutoHideTimer();
|
|
1333
|
+
}
|
|
1334
|
+
this.dispatchEvent(new CustomEvent('vialiq-alert-show', {
|
|
1335
|
+
bubbles: true,
|
|
1336
|
+
composed: true,
|
|
1337
|
+
detail: {
|
|
1338
|
+
id: this.id
|
|
1339
|
+
}
|
|
1340
|
+
}));
|
|
1341
|
+
}
|
|
1342
|
+
_dismissPromise = null;
|
|
1343
|
+
async handleDismiss() {
|
|
1344
|
+
this._clearAutoHideTimer();
|
|
1345
|
+
if (this._dismissPromise) {
|
|
1346
|
+
return this._dismissPromise;
|
|
1347
|
+
}
|
|
1348
|
+
this._dismissPromise = (async ()=>{
|
|
1349
|
+
if (this.shadowRoot) {
|
|
1350
|
+
const root = this.shadowRoot.querySelector('.alert-root');
|
|
1351
|
+
if (root && typeof root.animate === 'function') {
|
|
1352
|
+
try {
|
|
1353
|
+
const computed = getComputedStyle(root);
|
|
1354
|
+
const currentHeight = root.offsetHeight;
|
|
1355
|
+
const currentPadding = computed.padding;
|
|
1356
|
+
const currentMargin = computed.margin;
|
|
1357
|
+
const animation = root.animate([
|
|
1358
|
+
{
|
|
1359
|
+
height: `${currentHeight}px`,
|
|
1360
|
+
opacity: 1,
|
|
1361
|
+
margin: currentMargin,
|
|
1362
|
+
padding: currentPadding
|
|
1363
|
+
},
|
|
1364
|
+
{
|
|
1365
|
+
height: '0px',
|
|
1366
|
+
opacity: 0,
|
|
1367
|
+
margin: '0px',
|
|
1368
|
+
padding: '0px'
|
|
1369
|
+
}
|
|
1370
|
+
], {
|
|
1371
|
+
duration: 200,
|
|
1372
|
+
easing: 'ease-out',
|
|
1373
|
+
fill: 'forwards'
|
|
1374
|
+
});
|
|
1375
|
+
await animation.finished;
|
|
1376
|
+
} catch {
|
|
1377
|
+
// Animation was cancelled or failed; swallow rejection and proceed
|
|
1378
|
+
}
|
|
1379
|
+
}
|
|
1380
|
+
}
|
|
1381
|
+
this.hidden = true;
|
|
1382
|
+
this.open = false;
|
|
1383
|
+
this.dispatchEvent(new CustomEvent('vialiq-alert-close', {
|
|
1384
|
+
bubbles: true,
|
|
1385
|
+
composed: true,
|
|
1386
|
+
detail: {
|
|
1387
|
+
id: this.id
|
|
1388
|
+
}
|
|
1389
|
+
}));
|
|
1390
|
+
})();
|
|
1391
|
+
try {
|
|
1392
|
+
await this._dismissPromise;
|
|
1393
|
+
} finally{
|
|
1394
|
+
this._dismissPromise = null;
|
|
1395
|
+
}
|
|
1396
|
+
}
|
|
1397
|
+
/** Programmatically shows the alert */ async show() {
|
|
1398
|
+
this.open = true;
|
|
1399
|
+
await this.updateComplete;
|
|
1400
|
+
}
|
|
1401
|
+
/** Programmatically hides/dismisses the alert */ async hide() {
|
|
1402
|
+
if (this.open) {
|
|
1403
|
+
this.open = false;
|
|
1404
|
+
await this.updateComplete;
|
|
1405
|
+
if (this._dismissPromise) {
|
|
1406
|
+
await this._dismissPromise;
|
|
1407
|
+
}
|
|
1408
|
+
}
|
|
1409
|
+
}
|
|
1410
|
+
render() {
|
|
1411
|
+
return html`
|
|
1412
|
+
<div part="alert" class="alert-root" data-variant=${this.variant}>
|
|
1413
|
+
${!this.noIcon ? html`
|
|
1414
|
+
<div part="icon" class="alert-icon">
|
|
1415
|
+
<slot name="icon">
|
|
1416
|
+
<vi-icon
|
|
1417
|
+
name=${this.icon || this.defaultIcon}
|
|
1418
|
+
aria-hidden="true"
|
|
1419
|
+
></vi-icon>
|
|
1420
|
+
</slot>
|
|
1421
|
+
</div>
|
|
1422
|
+
` : ''}
|
|
1423
|
+
|
|
1424
|
+
<div part="content" class="alert-content">
|
|
1425
|
+
<div
|
|
1426
|
+
part="title"
|
|
1427
|
+
class="alert-title"
|
|
1428
|
+
?hidden=${!(this.title || this._hasTitleSlot)}
|
|
1429
|
+
>
|
|
1430
|
+
<slot name="title" @slotchange=${this.onTitleSlotChange}>
|
|
1431
|
+
${this.title}
|
|
1432
|
+
</slot>
|
|
1433
|
+
</div>
|
|
1434
|
+
|
|
1435
|
+
<div part="body" class="alert-body">
|
|
1436
|
+
<slot></slot>
|
|
1437
|
+
</div>
|
|
1438
|
+
|
|
1439
|
+
<div
|
|
1440
|
+
part="actions"
|
|
1441
|
+
class="alert-actions"
|
|
1442
|
+
?hidden=${!this._hasActionsSlot}
|
|
1443
|
+
>
|
|
1444
|
+
<slot name="actions" @slotchange=${this.onActionsSlotChange}></slot>
|
|
1445
|
+
</div>
|
|
1446
|
+
</div>
|
|
1447
|
+
|
|
1448
|
+
${this.dismissible ? html`
|
|
1449
|
+
<vi-button
|
|
1450
|
+
part="close-btn"
|
|
1451
|
+
variant="ghost"
|
|
1452
|
+
size="sm"
|
|
1453
|
+
icon-only
|
|
1454
|
+
aria-label=${this.dismissLabel}
|
|
1455
|
+
@click=${this.handleDismiss}
|
|
1456
|
+
>
|
|
1457
|
+
<vi-icon name="x" slot="icon"></vi-icon>
|
|
1458
|
+
</vi-button>
|
|
1459
|
+
` : ''}
|
|
1460
|
+
</div>
|
|
1461
|
+
`;
|
|
1462
|
+
}
|
|
1463
|
+
}
|
|
1464
|
+
}
|
|
1465
|
+
}();
|
|
1466
|
+
|
|
1467
|
+
export { _ViAlert as ViAlert, _ViBadge as ViBadge, ViElement, registerIcons };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@vialiq/web-components",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.9.0",
|
|
4
4
|
"private": false,
|
|
5
5
|
"publishConfig": {
|
|
6
6
|
"access": "public"
|
|
@@ -103,7 +103,7 @@
|
|
|
103
103
|
},
|
|
104
104
|
"peerDependencies": {
|
|
105
105
|
"@floating-ui/dom": ">=1.0.0",
|
|
106
|
-
"@vialiq/flux-ui": "^0.
|
|
106
|
+
"@vialiq/flux-ui": "^0.7.0",
|
|
107
107
|
"@vialiq/icons": ">=0.0.3 <0.1.0",
|
|
108
108
|
"lit": "^3.0.0"
|
|
109
109
|
},
|