@nova-design-system/nova-react 3.9.1 → 3.10.1-beta.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/dist/cjs/{constants-4faa1fae-BzFAKCkR.js → constants-23aaef7b-Cj2b-su0.js} +12 -0
- package/dist/cjs/{index-BtjpbnUr.js → index-B-1F0q3j.js} +1458 -448
- package/dist/cjs/index.js +4 -1
- package/dist/cjs/{nv-accordion-item.entry-Dr_2iHhQ.js → nv-accordion-item.entry-BF6TIAqX.js} +2 -2
- package/dist/cjs/{nv-accordion.entry-CYVpcwuY.js → nv-accordion.entry-CaTzxCZe.js} +1 -1
- package/dist/cjs/{nv-alert.entry-C_H-R9wb.js → nv-alert.entry-EOVv8IiE.js} +8 -8
- package/dist/cjs/{nv-avatar.entry-BeSOqGvb.js → nv-avatar.entry-DyiNDtz4.js} +7 -7
- package/dist/cjs/nv-badge_2.entry-DTc3EkVi.js +212 -0
- package/dist/cjs/{nv-breadcrumb.entry-yQozUTFi.js → nv-breadcrumb.entry-DKmd0vLH.js} +2 -2
- package/dist/cjs/{nv-breadcrumbs.entry-Qar1fOI7.js → nv-breadcrumbs.entry-CQB0c_7Y.js} +1 -1
- package/dist/cjs/{nv-button.entry-M_c4r8PX.js → nv-button.entry-rPyTGZZw.js} +8 -8
- package/dist/cjs/nv-buttongroup.entry-BT9JC-IJ.js +195 -0
- package/dist/cjs/{nv-calendar.entry-DFE372aB.js → nv-calendar.entry-C4stLDAG.js} +120 -43
- package/dist/cjs/{nv-col.entry-Bi8pH33J.js → nv-col.entry-DY7HEDMv.js} +2 -2
- package/dist/cjs/{nv-datagrid.entry-B-blFDg-.js → nv-datagrid.entry-yzQVVpxg.js} +9 -9
- package/dist/cjs/{nv-datagridcolumn.entry-CAzB7NtB.js → nv-datagridcolumn.entry-AOVwen5Y.js} +2 -2
- package/dist/cjs/{nv-dialog.entry-Bdw3O22w.js → nv-dialog.entry-DztbR2hl.js} +3 -3
- package/dist/cjs/{nv-dialogfooter_2.entry-BTUrxVzn.js → nv-dialogfooter_2.entry-iPMNyDQF.js} +5 -5
- package/dist/cjs/{nv-fieldcheckbox.entry-DNzC8s-J.js → nv-fieldcheckbox.entry-WEzw8Y0l.js} +6 -6
- package/dist/cjs/{nv-fielddate.entry-BI8REINj.js → nv-fielddate.entry-B4B2QgCn.js} +7 -7
- package/dist/cjs/{nv-fielddaterange.entry-B7mtEV97.js → nv-fielddaterange.entry-BQ-J4HKx.js} +7 -7
- package/dist/cjs/{nv-fielddropdown.entry-Cz7yuHTj.js → nv-fielddropdown.entry-B2YBjdkI.js} +4 -4
- package/dist/cjs/{nv-fielddropdownitem.entry-CH_C4Dr-.js → nv-fielddropdownitem.entry-B0wCnSfT.js} +2 -2
- package/dist/cjs/{nv-fieldmultiselect.entry-BqEdEUR0.js → nv-fieldmultiselect.entry-DuPOvire.js} +433 -43
- package/dist/cjs/{nv-fieldnumber.entry-BhRb8v1L.js → nv-fieldnumber.entry-BJANMe4j.js} +4 -4
- package/dist/cjs/{nv-fieldpassword.entry-BL4T90zr.js → nv-fieldpassword.entry-DkkJHwkG.js} +4 -4
- package/dist/cjs/{nv-fieldradio.entry-D-x10Pri.js → nv-fieldradio.entry-8uDJz8PS.js} +5 -5
- package/dist/cjs/{nv-fieldselect.entry-B-kynHlw.js → nv-fieldselect.entry-DN6euwMc.js} +6 -6
- package/dist/cjs/{nv-fieldslider.entry-D6X0LJKJ.js → nv-fieldslider.entry-BI72B0_Z.js} +4 -4
- package/dist/cjs/{nv-fieldtext.entry-xR41AQcM.js → nv-fieldtext.entry-DzHqp5Lp.js} +4 -4
- package/dist/cjs/{nv-fieldtextarea.entry-4mqhSSHM.js → nv-fieldtextarea.entry-CFgoC_mT.js} +4 -4
- package/dist/cjs/{nv-fieldtime.entry-S3r7RYwN.js → nv-fieldtime.entry-nVAeh7Ot.js} +66 -66
- package/dist/cjs/{nv-icon.entry-C2t6pj-B.js → nv-icon.entry-C0-IQQji.js} +9 -9
- package/dist/cjs/{nv-iconbutton_2.entry-Cv1d6ktl.js → nv-iconbutton_2.entry-BnnDZjg4.js} +4 -4
- package/dist/cjs/{nv-menu.entry-J_Ytq1Kn.js → nv-menu.entry-BB2mjwHV.js} +2 -2
- package/dist/cjs/{nv-menuitem.entry-DpOO9tMo.js → nv-menuitem.entry-CgkJiqc_.js} +2 -2
- package/dist/cjs/{nv-popover.entry-BZJHJXSA.js → nv-popover.entry-_Iv8yq0t.js} +2 -2
- package/dist/cjs/{nv-row.entry-D4qBjtBv.js → nv-row.entry-BZ2prXQS.js} +2 -2
- package/dist/cjs/{nv-stack.entry-DOc6ZvMZ.js → nv-stack.entry-C69ZIFWU.js} +2 -2
- package/dist/cjs/{nv-table.entry-7-TxQSlH.js → nv-table.entry-CXqK-89M.js} +3 -3
- package/dist/cjs/{nv-tablecolumn.entry-Bd4xWDYD.js → nv-tablecolumn.entry-RMYxY100.js} +1 -1
- package/dist/cjs/{nv-toggle.entry-DJmXXavz.js → nv-toggle.entry-Bx7cG_fC.js} +4 -4
- package/dist/cjs/nv-togglebutton.entry-CeYlChll.js +55 -0
- package/dist/cjs/nv-togglebuttongroup.entry-ehe00MUL.js +169 -0
- package/dist/cjs/{nv-tooltip.entry-D9nl_ejz.js → nv-tooltip.entry-CCDVLdqi.js} +2 -2
- package/dist/generated/components.js +24 -0
- package/dist/generated/components.server.js +41 -4
- package/dist/types/generated/components.d.ts +16 -0
- package/dist/types/generated/components.server.d.ts +16 -0
- package/package.json +1 -1
- package/dist/cjs/nv-badge_2.entry-BGWUswPo.js +0 -206
package/dist/cjs/index.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-B-1F0q3j.js');
|
|
4
4
|
require('react');
|
|
5
5
|
|
|
6
6
|
|
|
@@ -13,6 +13,7 @@ exports.NvBadge = index.NvBadge;
|
|
|
13
13
|
exports.NvBreadcrumb = index.NvBreadcrumb;
|
|
14
14
|
exports.NvBreadcrumbs = index.NvBreadcrumbs;
|
|
15
15
|
exports.NvButton = index.NvButton;
|
|
16
|
+
exports.NvButtongroup = index.NvButtongroup;
|
|
16
17
|
exports.NvCalendar = index.NvCalendar;
|
|
17
18
|
exports.NvCol = index.NvCol;
|
|
18
19
|
exports.NvDatagrid = index.NvDatagrid;
|
|
@@ -46,5 +47,7 @@ exports.NvStack = index.NvStack;
|
|
|
46
47
|
exports.NvTable = index.NvTable;
|
|
47
48
|
exports.NvTablecolumn = index.NvTablecolumn;
|
|
48
49
|
exports.NvToggle = index.NvToggle;
|
|
50
|
+
exports.NvTogglebutton = index.NvTogglebutton;
|
|
51
|
+
exports.NvTogglebuttongroup = index.NvTogglebuttongroup;
|
|
49
52
|
exports.NvTooltip = index.NvTooltip;
|
|
50
53
|
exports.defineCustomElements = index.defineCustomElements;
|
package/dist/cjs/{nv-accordion-item.entry-Dr_2iHhQ.js → nv-accordion-item.entry-BF6TIAqX.js}
RENAMED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-B-1F0q3j.js');
|
|
4
4
|
var collapse_animation16e3af45 = require('./collapse.animation-16e3af45-CChx_tQJ.js');
|
|
5
5
|
require('./stylefire.es-74da334a-y0piPjlz.js');
|
|
6
6
|
require('react');
|
|
@@ -166,7 +166,7 @@ const NvAccordionItem = class {
|
|
|
166
166
|
'is-open': this.open,
|
|
167
167
|
'is-disabled': this.disabled,
|
|
168
168
|
'is-animating': this.isAnimating,
|
|
169
|
-
}, role: "listitem", "aria-expanded": this.open ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }, index.h("div", { key: '258efe0502a39d963a9e75c16285ee9cbc65cb9f', class: "nv-accordion-item__header", onClick: this.handleHeaderClick, "aria-controls": "content" }, index.h("slot", { key: 'bb4dae743f06e3d41d1f7b8c17793b668df9347b', name: "header" }, index.h("div", { key: 'f3142a81c6be776d95ab9292101b889db6e35805', class: "nv-accordion-item__header-content" }, this.itemTitle && (index.h("span", { key: 'e897d8b4d414ba4e93b2853c152059579063335e', class: "nv-accordion-item__title" }, this.itemTitle)), this.subtitle && (index.h("span", { key: 'b8e03ceb1ca0e4c0b0fe24398f0e1c592ac077ab', class: "nv-accordion-item__subtitle" }, this.subtitle)))), index.h("nv-iconbutton", { key: '
|
|
169
|
+
}, role: "listitem", "aria-expanded": this.open ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : 'false' }, index.h("div", { key: '258efe0502a39d963a9e75c16285ee9cbc65cb9f', class: "nv-accordion-item__header", onClick: this.handleHeaderClick, "aria-controls": "content" }, index.h("slot", { key: 'bb4dae743f06e3d41d1f7b8c17793b668df9347b', name: "header" }, index.h("div", { key: 'f3142a81c6be776d95ab9292101b889db6e35805', class: "nv-accordion-item__header-content" }, this.itemTitle && (index.h("span", { key: 'e897d8b4d414ba4e93b2853c152059579063335e', class: "nv-accordion-item__title" }, this.itemTitle)), this.subtitle && (index.h("span", { key: 'b8e03ceb1ca0e4c0b0fe24398f0e1c592ac077ab', class: "nv-accordion-item__subtitle" }, this.subtitle)))), index.h("nv-iconbutton", { key: '145718cd664f6b1015cf99ad3c72dbe80df1f54e', emphasis: "low", size: "sm", shape: "square", name: this.chevronIconName, tabindex: this.disabled ? -1 : 0, onClick: this.handleIconClick, onKeyDown: this.handleHeaderKeyDown, "aria-controls": "content", "aria-label": this.open ? 'Fermer la section' : 'Ouvrir la section' })), index.h("div", { key: '667967ca20edaa1fc738188f42cfa8bf47bb080f', id: "content", class: "nv-accordion-item__content", ref: el => (this.contentRef = el) }, index.h("div", { key: '1f66bac904a5992d5e6cd63852d5aec9bc602ed7', class: "nv-accordion-item__content-inner" }, index.h("slot", { key: 'd7b5cf5c69daab242e7696e7432769905b3d4c72', name: "content" })))));
|
|
170
170
|
}
|
|
171
171
|
get el() { return index.getElement(this); }
|
|
172
172
|
static get watchers() { return {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-B-1F0q3j.js');
|
|
4
4
|
require('react');
|
|
5
5
|
|
|
6
6
|
const nvAccordionCss = "nv-accordion{display:block;border:var(--spacing-px) solid var(--color-content-low-border);border-radius:var(--radius-rounded-lg)}nv-accordion .nv-accordion__footer{padding:var(--spacing-3);background:var(--color-level-05-background);border-radius:0 0 var(--radius-rounded-lg) var(--radius-rounded-lg);margin-top:calc(var(--spacing-px) * -1);border-top:var(--spacing-px) solid var(--color-content-low-border)}nv-accordion .nv-accordion__footer:empty{display:none}";
|
|
@@ -1,15 +1,15 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-B-1F0q3j.js');
|
|
4
4
|
var clsx297c1ffe = require('./clsx-297c1ffe-BtxeOLZW.js');
|
|
5
|
-
var
|
|
5
|
+
var constants23aaef7b = require('./constants-23aaef7b-Cj2b-su0.js');
|
|
6
6
|
var collapse_animation16e3af45 = require('./collapse.animation-16e3af45-CChx_tQJ.js');
|
|
7
7
|
var fade_animation71e8e34c = require('./fade.animation-71e8e34c-BAw_TYsB.js');
|
|
8
8
|
require('./stylefire.es-74da334a-y0piPjlz.js');
|
|
9
9
|
var timeline_animationAdf35ecb = require('./timeline.animation-adf35ecb-CE6Dsdxr.js');
|
|
10
10
|
require('react');
|
|
11
11
|
|
|
12
|
-
const nvAlertCss = "nv-alert{display:flex !important;align-items:flex-start;position:relative;gap:var(--alert-gap-x);border-radius:var(--alert-radius);font-family:\"TT Norms Pro\", \"Montserrat\", sans-serif}nv-alert>nv-icon{margin-left:var(--alert-icon-position-x);margin-top:var(--alert-icon-position-y)}nv-alert.hidden{display:none !important}nv-alert.feedback-information{background-color:var(--components-alert-information-background);border:1px solid var(--components-alert-information-border) !important}nv-alert.feedback-information>.close:focus,nv-alert.feedback-information>.close:focus-within{outline:none}nv-alert.feedback-information>.close:focus-visible,nv-alert.feedback-information>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-information-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert.feedback-warning{background-color:var(--components-alert-warning-background);border:1px solid var(--components-alert-warning-border) !important}nv-alert.feedback-warning>.close:focus,nv-alert.feedback-warning>.close:focus-within{outline:none}nv-alert.feedback-warning>.close:focus-visible,nv-alert.feedback-warning>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-warning-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert.feedback-error{background-color:var(--components-alert-error-background);border:1px solid var(--components-alert-error-border) !important}nv-alert.feedback-error>.close:focus,nv-alert.feedback-error>.close:focus-within{outline:none}nv-alert.feedback-error>.close:focus-visible,nv-alert.feedback-error>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-error-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert.feedback-success{background-color:var(--components-alert-success-background);border:1px solid var(--components-alert-success-border) !important}nv-alert.feedback-success>.close:focus,nv-alert.feedback-success>.close:focus-within{outline:none}nv-alert.feedback-success>.close:focus-visible,nv-alert.feedback-success>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-success-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert.feedback-neutral{background-color:var(--components-alert-neutral-background);border:1px solid var(--components-alert-neutral-border) !important}nv-alert.feedback-neutral>.close:focus,nv-alert.feedback-neutral>.close:focus-within{outline:none}nv-alert.feedback-neutral>.close:focus-visible,nv-alert.feedback-neutral>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-neutral-border);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-alert>nv-icon.icon-information{color:var(--components-alert-information-icon)}nv-alert>nv-icon.icon-warning{color:var(--components-alert-warning-icon)}nv-alert>nv-icon.icon-error{color:var(--components-alert-error-icon)}nv-alert>nv-icon.icon-success{color:var(--components-alert-success-icon)}nv-alert>nv-icon.icon-neutral{color:var(--components-alert-neutral-icon)}nv-alert>.content{display:flex;padding:var(--alert-padding);padding-left:0;flex-direction:column;gap:var(--alert-gap-y)}nv-alert>.content>.heading{color:var(--components-alert-content-title);font-size:var(--alert-heading-font-size);line-height:var(--alert-heading-line-height);font-weight:var(--alert-heading-font-weight)}nv-alert>.content>.message{color:var(--components-alert-content-description);font-size:var(--alert-message-font-size);line-height:var(--alert-message-line-height)}nv-alert>.close{border-radius:var(--alert-radius);position:absolute;display:flex;top:var(--alert-icon-position-y);right:var(--alert-icon-position-x);padding:0;border:none;background:none;cursor:pointer}";
|
|
12
|
+
const nvAlertCss = "nv-alert{display:flex !important;align-items:flex-start;position:relative;gap:var(--alert-gap-x);border-radius:var(--alert-radius);font-family:\"TT Norms Pro\", \"Montserrat\", sans-serif}nv-alert>nv-icon{margin-left:var(--alert-icon-position-x);margin-top:var(--alert-icon-position-y)}nv-alert.hidden{display:none !important}nv-alert.feedback-information{background-color:var(--components-alert-information-background);border:1px solid var(--components-alert-information-border) !important}nv-alert.feedback-information>.close:focus,nv-alert.feedback-information>.close:focus-within{outline:none}nv-alert.feedback-information>.close:focus-visible,nv-alert.feedback-information>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-information-border);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-alert.feedback-warning{background-color:var(--components-alert-warning-background);border:1px solid var(--components-alert-warning-border) !important}nv-alert.feedback-warning>.close:focus,nv-alert.feedback-warning>.close:focus-within{outline:none}nv-alert.feedback-warning>.close:focus-visible,nv-alert.feedback-warning>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-warning-border);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-alert.feedback-error{background-color:var(--components-alert-error-background);border:1px solid var(--components-alert-error-border) !important}nv-alert.feedback-error>.close:focus,nv-alert.feedback-error>.close:focus-within{outline:none}nv-alert.feedback-error>.close:focus-visible,nv-alert.feedback-error>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-error-border);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-alert.feedback-success{background-color:var(--components-alert-success-background);border:1px solid var(--components-alert-success-border) !important}nv-alert.feedback-success>.close:focus,nv-alert.feedback-success>.close:focus-within{outline:none}nv-alert.feedback-success>.close:focus-visible,nv-alert.feedback-success>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-success-border);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-alert.feedback-neutral{background-color:var(--components-alert-neutral-background);border:1px solid var(--components-alert-neutral-border) !important}nv-alert.feedback-neutral>.close:focus,nv-alert.feedback-neutral>.close:focus-within{outline:none}nv-alert.feedback-neutral>.close:focus-visible,nv-alert.feedback-neutral>.close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--components-alert-neutral-border);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-alert>nv-icon.icon-information{color:var(--components-alert-information-icon)}nv-alert>nv-icon.icon-warning{color:var(--components-alert-warning-icon)}nv-alert>nv-icon.icon-error{color:var(--components-alert-error-icon)}nv-alert>nv-icon.icon-success{color:var(--components-alert-success-icon)}nv-alert>nv-icon.icon-neutral{color:var(--components-alert-neutral-icon)}nv-alert>.content{display:flex;padding:var(--alert-padding);padding-right:calc(var(--alert-padding) + var(--icon-md) + var(--spacing-1));padding-left:0;flex-direction:column;gap:var(--alert-gap-y)}nv-alert>.content>.heading{color:var(--components-alert-content-title);font-size:var(--alert-heading-font-size);line-height:var(--alert-heading-line-height);font-weight:var(--alert-heading-font-weight)}nv-alert>.content>.message{color:var(--components-alert-content-description);font-size:var(--alert-message-font-size);line-height:var(--alert-message-line-height)}nv-alert>.close{border-radius:var(--alert-radius);position:absolute;display:flex;top:var(--alert-icon-position-y);right:var(--alert-icon-position-x);padding:0;border:none;background:none;cursor:pointer}";
|
|
13
13
|
const NvAlertStyle0 = nvAlertCss;
|
|
14
14
|
|
|
15
15
|
const NvAlert = class {
|
|
@@ -63,15 +63,15 @@ const NvAlert = class {
|
|
|
63
63
|
*/
|
|
64
64
|
this.getDefaultIcon = () => {
|
|
65
65
|
switch (this.feedback) {
|
|
66
|
-
case
|
|
66
|
+
case constants23aaef7b.FeedbackColors.Warning:
|
|
67
67
|
return 'alert-circle';
|
|
68
|
-
case
|
|
68
|
+
case constants23aaef7b.FeedbackColors.Information:
|
|
69
69
|
return 'info-circle';
|
|
70
|
-
case
|
|
70
|
+
case constants23aaef7b.FeedbackColors.Success:
|
|
71
71
|
return 'circle-check';
|
|
72
|
-
case
|
|
72
|
+
case constants23aaef7b.FeedbackColors.Error:
|
|
73
73
|
return 'alert-circle';
|
|
74
|
-
case
|
|
74
|
+
case constants23aaef7b.FeedbackColors.Neutral:
|
|
75
75
|
return 'help';
|
|
76
76
|
default:
|
|
77
77
|
return 'info-circle';
|
|
@@ -1,8 +1,8 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-B-1F0q3j.js');
|
|
4
4
|
var clsx297c1ffe = require('./clsx-297c1ffe-BtxeOLZW.js');
|
|
5
|
-
var
|
|
5
|
+
var constants23aaef7b = require('./constants-23aaef7b-Cj2b-su0.js');
|
|
6
6
|
require('react');
|
|
7
7
|
|
|
8
8
|
const nvAvatarCss = "nv-avatar{align-items:center !important;background-color:var(--components-avatar-background-1);border-radius:var(--radius-rounded-full) !important;display:flex !important;flex-shrink:0 !important;font-family:\"TT Norms Pro\", sans-serif;font-style:normal;font-weight:var(--font-weight-medium-emphasis);justify-content:center !important;leading-trim:both;line-height:1 !important;text-align:center;text-edge:cap;text-transform:uppercase}nv-avatar.avatar-color-1{background-color:var(--components-avatar-background-1);color:var(--components-avatar-content-1)}nv-avatar.avatar-color-2{background-color:var(--components-avatar-background-2);color:var(--components-avatar-content-2)}nv-avatar.avatar-color-3{background-color:var(--components-avatar-background-3);color:var(--components-avatar-content-3)}nv-avatar.avatar-color-4{background-color:var(--components-avatar-background-4);color:var(--components-avatar-content-4)}nv-avatar.avatar-color-5{background-color:var(--components-avatar-background-5);color:var(--components-avatar-content-5)}nv-avatar.avatar-color-6{background-color:var(--components-avatar-background-6);color:var(--components-avatar-content-6)}nv-avatar.avatar-color-7{background-color:var(--components-avatar-background-7);color:var(--components-avatar-content-7)}nv-avatar.avatar-color-8{background-color:var(--components-avatar-background-8);color:var(--components-avatar-content-8)}nv-avatar.avatar-color-9{background-color:var(--components-avatar-background-9);color:var(--components-avatar-content-9)}nv-avatar.avatar-color-10{background-color:var(--components-avatar-background-10);color:var(--components-avatar-content-10)}nv-avatar img{height:100%;width:100%;object-fit:cover;object-position:center;border-radius:50%}nv-avatar.avatar-xs{width:var(--avatar-xs-size);height:var(--avatar-xs-size);font-size:var(--avatar-xs-font-size);line-height:var(--avatar-xs-font-size)}nv-avatar.avatar-xs nv-icon>svg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-avatar.avatar-sm{width:var(--avatar-sm-size);height:var(--avatar-sm-size);font-size:var(--avatar-sm-font-size);line-height:var(--avatar-sm-font-size)}nv-avatar.avatar-sm nv-icon>svg{width:var(--spacing-4);height:var(--spacing-4);stroke-width:1.5px}nv-avatar.avatar-md{width:var(--avatar-md-size);height:var(--avatar-md-size);font-size:var(--avatar-md-font-size);line-height:var(--avatar-md-font-size)}nv-avatar.avatar-md nv-icon>svg{width:var(--spacing-5);height:var(--spacing-5);stroke-width:1.6px}nv-avatar.avatar-lg{width:var(--avatar-lg-size);height:var(--avatar-lg-size);font-size:var(--avatar-lg-font-size);line-height:var(--avatar-lg-font-size)}nv-avatar.avatar-lg nv-icon>svg{width:var(--spacing-6);height:var(--spacing-6);stroke-width:1.8px}nv-avatar.avatar-xl{width:var(--avatar-xl-size);height:var(--avatar-xl-size);font-size:var(--avatar-xl-font-size);line-height:var(--avatar-xl-font-size)}nv-avatar.avatar-xl nv-icon>svg{width:var(--spacing-7);height:var(--spacing-7);stroke-width:1.9px}";
|
|
@@ -23,19 +23,19 @@ const NvAvatar = class {
|
|
|
23
23
|
}
|
|
24
24
|
componentWillRender() {
|
|
25
25
|
if (this.xsmall) {
|
|
26
|
-
this.size =
|
|
26
|
+
this.size = constants23aaef7b.SemanticSizes.ExtraSmall;
|
|
27
27
|
}
|
|
28
28
|
if (this.small) {
|
|
29
|
-
this.size =
|
|
29
|
+
this.size = constants23aaef7b.SemanticSizes.Small;
|
|
30
30
|
}
|
|
31
31
|
if (this.medium) {
|
|
32
|
-
this.size =
|
|
32
|
+
this.size = constants23aaef7b.SemanticSizes.Medium;
|
|
33
33
|
}
|
|
34
34
|
if (this.large) {
|
|
35
|
-
this.size =
|
|
35
|
+
this.size = constants23aaef7b.SemanticSizes.Large;
|
|
36
36
|
}
|
|
37
37
|
if (this.xlarge) {
|
|
38
|
-
this.size =
|
|
38
|
+
this.size = constants23aaef7b.SemanticSizes.ExtraLarge;
|
|
39
39
|
}
|
|
40
40
|
if (this.text) {
|
|
41
41
|
this.initials = this.text;
|
|
@@ -0,0 +1,212 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
var index = require('./index-B-1F0q3j.js');
|
|
4
|
+
var clsx297c1ffe = require('./clsx-297c1ffe-BtxeOLZW.js');
|
|
5
|
+
var collapse_animation16e3af45 = require('./collapse.animation-16e3af45-CChx_tQJ.js');
|
|
6
|
+
var fade_animation71e8e34c = require('./fade.animation-71e8e34c-BAw_TYsB.js');
|
|
7
|
+
require('./stylefire.es-74da334a-y0piPjlz.js');
|
|
8
|
+
var timeline_animationAdf35ecb = require('./timeline.animation-adf35ecb-CE6Dsdxr.js');
|
|
9
|
+
require('react');
|
|
10
|
+
|
|
11
|
+
const nvBadgeCss = "nv-badge{padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge.is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.with-gap{padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge.with-gap.is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-badge:not(.with-gap){padding:var(--badge-padding-y) var(--badge-padding-x);display:inline-flex !important;gap:var(--badge-gap-x);vertical-align:middle;align-items:center;border-radius:var(--radius-rounded-full);border-style:solid;border-width:0.5px;height:fit-content;width:fit-content}nv-badge:not(.with-gap).is-icon-only{padding:var(--badge-padding-y) var(--badge-padding-icon-only-x);gap:var(--badge-gap-icon-only-x)}nv-badge.badge-1{color:var(--color-rainbow-1-text);background-color:var(--color-rainbow-1-background);border-color:var(--color-rainbow-1-border)}nv-badge.badge-1 .close:focus,nv-badge.badge-1 .close:focus-within{outline:none}nv-badge.badge-1 .close:focus-visible,nv-badge.badge-1 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-1-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-1 nv-icon{color:var(--color-rainbow-1-icon)}nv-badge.badge-2{color:var(--color-rainbow-2-text);background-color:var(--color-rainbow-2-background);border-color:var(--color-rainbow-2-border)}nv-badge.badge-2 .close:focus,nv-badge.badge-2 .close:focus-within{outline:none}nv-badge.badge-2 .close:focus-visible,nv-badge.badge-2 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-2-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-2 nv-icon{color:var(--color-rainbow-2-icon)}nv-badge.badge-3{color:var(--color-rainbow-3-text);background-color:var(--color-rainbow-3-background);border-color:var(--color-rainbow-3-border)}nv-badge.badge-3 .close:focus,nv-badge.badge-3 .close:focus-within{outline:none}nv-badge.badge-3 .close:focus-visible,nv-badge.badge-3 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-3-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-3 nv-icon{color:var(--color-rainbow-3-icon)}nv-badge.badge-4{color:var(--color-rainbow-4-text);background-color:var(--color-rainbow-4-background);border-color:var(--color-rainbow-4-border)}nv-badge.badge-4 .close:focus,nv-badge.badge-4 .close:focus-within{outline:none}nv-badge.badge-4 .close:focus-visible,nv-badge.badge-4 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-4-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-4 nv-icon{color:var(--color-rainbow-4-icon)}nv-badge.badge-5{color:var(--color-rainbow-5-text);background-color:var(--color-rainbow-5-background);border-color:var(--color-rainbow-5-border)}nv-badge.badge-5 .close:focus,nv-badge.badge-5 .close:focus-within{outline:none}nv-badge.badge-5 .close:focus-visible,nv-badge.badge-5 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-5-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-5 nv-icon{color:var(--color-rainbow-5-icon)}nv-badge.badge-6{color:var(--color-rainbow-6-text);background-color:var(--color-rainbow-6-background);border-color:var(--color-rainbow-6-border)}nv-badge.badge-6 .close:focus,nv-badge.badge-6 .close:focus-within{outline:none}nv-badge.badge-6 .close:focus-visible,nv-badge.badge-6 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-6-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-6 nv-icon{color:var(--color-rainbow-6-icon)}nv-badge.badge-7{color:var(--color-rainbow-7-text);background-color:var(--color-rainbow-7-background);border-color:var(--color-rainbow-7-border)}nv-badge.badge-7 .close:focus,nv-badge.badge-7 .close:focus-within{outline:none}nv-badge.badge-7 .close:focus-visible,nv-badge.badge-7 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-7-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-7 nv-icon{color:var(--color-rainbow-7-icon)}nv-badge.badge-8{color:var(--color-rainbow-8-text);background-color:var(--color-rainbow-8-background);border-color:var(--color-rainbow-8-border)}nv-badge.badge-8 .close:focus,nv-badge.badge-8 .close:focus-within{outline:none}nv-badge.badge-8 .close:focus-visible,nv-badge.badge-8 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-8-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-8 nv-icon{color:var(--color-rainbow-8-icon)}nv-badge.badge-9{color:var(--color-rainbow-9-text);background-color:var(--color-rainbow-9-background);border-color:var(--color-rainbow-9-border)}nv-badge.badge-9 .close:focus,nv-badge.badge-9 .close:focus-within{outline:none}nv-badge.badge-9 .close:focus-visible,nv-badge.badge-9 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-9-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-9 nv-icon{color:var(--color-rainbow-9-icon)}nv-badge.badge-10{color:var(--color-rainbow-10-text);background-color:var(--color-rainbow-10-background);border-color:var(--color-rainbow-10-border)}nv-badge.badge-10 .close:focus,nv-badge.badge-10 .close:focus-within{outline:none}nv-badge.badge-10 .close:focus-visible,nv-badge.badge-10 .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-rainbow-10-content);outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-10 nv-icon{color:var(--color-rainbow-10-icon)}nv-badge.badge-error{color:var(--color-feedback-error-low-text);background-color:var(--color-feedback-error-low-background);border-color:var(--color-feedback-error-low-border)}nv-badge.badge-error .close:focus,nv-badge.badge-error .close:focus-within{outline:none}nv-badge.badge-error .close:focus-visible,nv-badge.badge-error .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-error-low-content, var(--color-feedback-error-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-error nv-icon{color:var(--color-feedback-error-low-icon)}nv-badge.badge-information{color:var(--color-feedback-information-low-text);background-color:var(--color-feedback-information-low-background);border-color:var(--color-feedback-information-low-border)}nv-badge.badge-information .close:focus,nv-badge.badge-information .close:focus-within{outline:none}nv-badge.badge-information .close:focus-visible,nv-badge.badge-information .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-information-low-content, var(--color-feedback-information-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-information nv-icon{color:var(--color-feedback-information-low-icon)}nv-badge.badge-neutral{color:var(--color-feedback-neutral-low-text);background-color:var(--color-feedback-neutral-low-background);border-color:var(--color-feedback-neutral-low-border)}nv-badge.badge-neutral .close:focus,nv-badge.badge-neutral .close:focus-within{outline:none}nv-badge.badge-neutral .close:focus-visible,nv-badge.badge-neutral .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-neutral-low-content, var(--color-feedback-neutral-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-neutral nv-icon{color:var(--color-feedback-neutral-low-icon)}nv-badge.badge-success{color:var(--color-feedback-success-low-text);background-color:var(--color-feedback-success-low-background);border-color:var(--color-feedback-success-low-border)}nv-badge.badge-success .close:focus,nv-badge.badge-success .close:focus-within{outline:none}nv-badge.badge-success .close:focus-visible,nv-badge.badge-success .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-success-low-content, var(--color-feedback-success-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-success nv-icon{color:var(--color-feedback-success-low-icon)}nv-badge.badge-warning{color:var(--color-feedback-warning-low-text);background-color:var(--color-feedback-warning-low-background);border-color:var(--color-feedback-warning-low-border)}nv-badge.badge-warning .close:focus,nv-badge.badge-warning .close:focus-within{outline:none}nv-badge.badge-warning .close:focus-visible,nv-badge.badge-warning .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-feedback-warning-low-content, var(--color-feedback-warning-low-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-warning nv-icon{color:var(--color-feedback-warning-low-icon)}nv-badge.badge-amber{color:var(--color-rainbow-1-text);background-color:var(--color-rainbow-1-background);border-color:var(--color-rainbow-1-border)}nv-badge.badge-amber .close:focus,nv-badge.badge-amber .close:focus-within{outline:none}nv-badge.badge-amber .close:focus-visible,nv-badge.badge-amber .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-amber-content, var(--color-rainbow-1-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-amber nv-icon{color:var(--color-rainbow-1-icon)}nv-badge.badge-orange{color:var(--color-rainbow-2-text);background-color:var(--color-rainbow-2-background);border-color:var(--color-rainbow-2-border)}nv-badge.badge-orange .close:focus,nv-badge.badge-orange .close:focus-within{outline:none}nv-badge.badge-orange .close:focus-visible,nv-badge.badge-orange .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-orange-content, var(--color-rainbow-2-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-orange nv-icon{color:var(--color-rainbow-2-icon)}nv-badge.badge-turquoise{color:var(--color-rainbow-5-text);background-color:var(--color-rainbow-5-background);border-color:var(--color-rainbow-5-border)}nv-badge.badge-turquoise .close:focus,nv-badge.badge-turquoise .close:focus-within{outline:none}nv-badge.badge-turquoise .close:focus-visible,nv-badge.badge-turquoise .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-turquoise-content, var(--color-rainbow-5-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-turquoise nv-icon{color:var(--color-rainbow-5-icon)}nv-badge.badge-crimson{color:var(--color-rainbow-6-text);background-color:var(--color-rainbow-6-background);border-color:var(--color-rainbow-6-border)}nv-badge.badge-crimson .close:focus,nv-badge.badge-crimson .close:focus-within{outline:none}nv-badge.badge-crimson .close:focus-visible,nv-badge.badge-crimson .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-crimson-content, var(--color-rainbow-6-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-crimson nv-icon{color:var(--color-rainbow-6-icon)}nv-badge.badge-lime{color:var(--color-rainbow-9-text);background-color:var(--color-rainbow-9-background);border-color:var(--color-rainbow-9-border)}nv-badge.badge-lime .close:focus,nv-badge.badge-lime .close:focus-within{outline:none}nv-badge.badge-lime .close:focus-visible,nv-badge.badge-lime .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-lime-content, var(--color-rainbow-9-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-lime nv-icon{color:var(--color-rainbow-9-icon)}nv-badge.badge-petrol{color:var(--color-rainbow-8-text);background-color:var(--color-rainbow-8-background);border-color:var(--color-rainbow-8-border)}nv-badge.badge-petrol .close:focus,nv-badge.badge-petrol .close:focus-within{outline:none}nv-badge.badge-petrol .close:focus-visible,nv-badge.badge-petrol .close:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-petrol-content, var(--color-rainbow-8-text));outline-offset:calc(var(--focus-outline-offset) * 0.2);z-index:111}nv-badge.badge-petrol nv-icon{color:var(--color-rainbow-8-icon)}nv-badge span{font-size:var(--font-size-xs);line-height:var(--line-height-xs) !important;text-align:center}nv-badge nv-icon>svg.icon-xs{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-sm{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-md{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-lg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge nv-icon>svg.icon-xl{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-badge .close{padding:0;line-height:0;border:none;background:none;cursor:pointer;color:inherit;display:inline-flex;align-items:center;aspect-ratio:1/1;border-radius:var(--radius-rounded-full)}";
|
|
12
|
+
const NvBadgeStyle0 = nvBadgeCss;
|
|
13
|
+
|
|
14
|
+
const NvBadge = class {
|
|
15
|
+
constructor(hostRef) {
|
|
16
|
+
index.registerInstance(this, hostRef);
|
|
17
|
+
this.closeClicked = index.createEvent(this, "closeClicked");
|
|
18
|
+
this.hiddenChanged = index.createEvent(this, "hiddenChanged");
|
|
19
|
+
this.hiddenChangedComplete = index.createEvent(this, "hiddenChangedComplete");
|
|
20
|
+
/****************************************************************************/
|
|
21
|
+
//#region DEPRECATED
|
|
22
|
+
/**
|
|
23
|
+
* Whether the badge is dismissible.
|
|
24
|
+
* @deprecated use dismissible instead.
|
|
25
|
+
*/
|
|
26
|
+
this.dismissal = false;
|
|
27
|
+
//#endregion DEPRECATED
|
|
28
|
+
/****************************************************************************/
|
|
29
|
+
//#region PROPERTIES
|
|
30
|
+
/**
|
|
31
|
+
* The color of the badge.
|
|
32
|
+
* deprecated Use status values or named colors instead.
|
|
33
|
+
* Use a string between 1 to 10
|
|
34
|
+
* or one of the status values: error, information, neutral, success, warning
|
|
35
|
+
* or one of the color names: amber, orange, turquoise, crimson, lime
|
|
36
|
+
*/
|
|
37
|
+
this.color = '1';
|
|
38
|
+
/**
|
|
39
|
+
* Main content of the badge.
|
|
40
|
+
*/
|
|
41
|
+
this.label = null;
|
|
42
|
+
/**
|
|
43
|
+
* The lead icon of the badge.
|
|
44
|
+
*/
|
|
45
|
+
this.leadIcon = null;
|
|
46
|
+
/**
|
|
47
|
+
* Whether the badge is dismissible.
|
|
48
|
+
*/
|
|
49
|
+
this.dismissible = false;
|
|
50
|
+
/**
|
|
51
|
+
* Controls the visibility of the badge. Will animate with fade and collapse.
|
|
52
|
+
*/
|
|
53
|
+
this.hidden = false; // eslint-disable-line @stencil-community/reserved-member-names
|
|
54
|
+
/**
|
|
55
|
+
* When true, the alert does not automatically close upon dismissing.
|
|
56
|
+
* Useful for externally controlled component behavior.
|
|
57
|
+
*/
|
|
58
|
+
this.preventAutoClose = false;
|
|
59
|
+
/**
|
|
60
|
+
* When true, the badge will only display an icon without label.
|
|
61
|
+
* The label will be visually hidden but still accessible for screen readers.
|
|
62
|
+
*/
|
|
63
|
+
this.isIconOnly = false;
|
|
64
|
+
//#endregion LIFECYCLE
|
|
65
|
+
/****************************************************************************/
|
|
66
|
+
//#region METHODS
|
|
67
|
+
/**
|
|
68
|
+
* Handles the close button click.
|
|
69
|
+
*/
|
|
70
|
+
this.handleClose = () => {
|
|
71
|
+
if (!this.preventAutoClose) {
|
|
72
|
+
this.hidden = true;
|
|
73
|
+
}
|
|
74
|
+
this.closeClicked.emit();
|
|
75
|
+
};
|
|
76
|
+
}
|
|
77
|
+
//#endregion EVENTS
|
|
78
|
+
/****************************************************************************/
|
|
79
|
+
//#region WATCHERS
|
|
80
|
+
/**
|
|
81
|
+
* Handles the dismissal prop change.
|
|
82
|
+
* @param {boolean} dismissal - The new dismissal value.
|
|
83
|
+
*/
|
|
84
|
+
handleDismissalChange(dismissal) {
|
|
85
|
+
this.dismissible = dismissal;
|
|
86
|
+
}
|
|
87
|
+
/**
|
|
88
|
+
* Handles the icon prop change.
|
|
89
|
+
* @param {string} icon - The new icon value.
|
|
90
|
+
*/
|
|
91
|
+
handleIconChange(icon) {
|
|
92
|
+
this.leadIcon = icon;
|
|
93
|
+
}
|
|
94
|
+
/**
|
|
95
|
+
* Handles the hidden prop change.
|
|
96
|
+
* @param {boolean} hidden - The new hidden value.
|
|
97
|
+
*/
|
|
98
|
+
async handleHiddenChange(hidden) {
|
|
99
|
+
this.hiddenChanged.emit(hidden);
|
|
100
|
+
if (this._isHidden === true)
|
|
101
|
+
this._isHidden = hidden;
|
|
102
|
+
const { fadeIn, fadeOut } = fade_animation71e8e34c.useFade(this.ref, { duration: 150 });
|
|
103
|
+
const { collapse, expand } = collapse_animation16e3af45.useCollapse(this.ref, { duration: 150 });
|
|
104
|
+
if (hidden === true)
|
|
105
|
+
await timeline_animationAdf35ecb.timeline(fadeOut, collapse).start();
|
|
106
|
+
if (hidden === false)
|
|
107
|
+
await timeline_animationAdf35ecb.timeline(expand, fadeIn).start();
|
|
108
|
+
this.hiddenChangedComplete.emit(hidden);
|
|
109
|
+
if (this._isHidden === false)
|
|
110
|
+
this._isHidden = hidden;
|
|
111
|
+
}
|
|
112
|
+
//#endregion WATCHERS
|
|
113
|
+
/****************************************************************************/
|
|
114
|
+
//#region LIFECYCLE
|
|
115
|
+
/**
|
|
116
|
+
* Component will load.
|
|
117
|
+
*/
|
|
118
|
+
componentWillLoad() {
|
|
119
|
+
if (this.dismissal) {
|
|
120
|
+
this.dismissible = this.dismissal;
|
|
121
|
+
}
|
|
122
|
+
if (this.icon != null && this.icon != '') {
|
|
123
|
+
this.leadIcon = this.icon;
|
|
124
|
+
}
|
|
125
|
+
if (this.hidden) {
|
|
126
|
+
this._isHidden = true;
|
|
127
|
+
const { setCollapsed } = collapse_animation16e3af45.useCollapse(this.ref);
|
|
128
|
+
const { setFadeOut } = fade_animation71e8e34c.useFade(this.ref);
|
|
129
|
+
setCollapsed();
|
|
130
|
+
setFadeOut();
|
|
131
|
+
}
|
|
132
|
+
}
|
|
133
|
+
//#endregion METHODS
|
|
134
|
+
/****************************************************************************/
|
|
135
|
+
//#region RENDER
|
|
136
|
+
render() {
|
|
137
|
+
return (index.h(index.Host, { key: '435c5bb1f565c8bd95cca5c6828157c80f60aa39', class: clsx297c1ffe.clsx(`badge-${this.color}`, {
|
|
138
|
+
'has-close': this.dismissible,
|
|
139
|
+
'with-gap': this.dismissible || this.label,
|
|
140
|
+
'visually-hidden': this._isHidden,
|
|
141
|
+
'is-icon-only': this.isIconOnly,
|
|
142
|
+
}) }, index.h("slot", { key: '271dc833471e026af5088f48227639682e661e97', name: "leading-icon" }, this.leadIcon && index.h("nv-icon", { key: 'e578eabf4c5a09e61e28c3839b943804acdf88e8', name: this.leadIcon, size: "sm" })), index.h("span", { key: '24d16a21b2b4499be712f9b747c9ab63c5e6ca0c', class: clsx297c1ffe.clsx({ 'visually-hidden': this.isIconOnly }) }, this.label, index.h("slot", { key: '3e3827620e6ade8be256ce7dd0b8bb949f36f2d5' })), this.dismissible && (index.h("button", { key: '90ed9ec1b71815554b963b0eafeb5536578700cf', onClick: this.handleClose, class: "close", type: "button" }, index.h("nv-icon", { key: 'df426e5d88c2bf02e7aa83c179c05db4795f03db', name: "x", size: "sm" })))));
|
|
143
|
+
}
|
|
144
|
+
get ref() { return index.getElement(this); }
|
|
145
|
+
static get watchers() { return {
|
|
146
|
+
"dismissal": ["handleDismissalChange"],
|
|
147
|
+
"icon": ["handleIconChange"],
|
|
148
|
+
"hidden": ["handleHiddenChange"]
|
|
149
|
+
}; }
|
|
150
|
+
};
|
|
151
|
+
NvBadge.style = NvBadgeStyle0;
|
|
152
|
+
|
|
153
|
+
const nvFielddropdownitemcheckCss = "nv-fielddropdownitemcheck{cursor:pointer;display:flex;padding:var(--list-dropdown-item-padding-y) var(--list-dropdown-item-padding-x);border-radius:var(--list-dropdown-item-radius)}nv-fielddropdownitemcheck slot-fb,nv-fielddropdownitemcheck span{all:unset}nv-fielddropdownitemcheck:hover{background-color:var(--components-list-dropdown-item-background-hover)}";
|
|
154
|
+
const NvFielddropdownitemcheckStyle0 = nvFielddropdownitemcheckCss;
|
|
155
|
+
|
|
156
|
+
const NvFielddropdownitemcheck = class {
|
|
157
|
+
constructor(hostRef) {
|
|
158
|
+
index.registerInstance(this, hostRef);
|
|
159
|
+
this.itemChecked = index.createEvent(this, "itemChecked");
|
|
160
|
+
/****************************************************************************/
|
|
161
|
+
//#region PROPERTIES
|
|
162
|
+
/**
|
|
163
|
+
* Indicates whether the checkbox is selected.
|
|
164
|
+
*/
|
|
165
|
+
this.checked = false;
|
|
166
|
+
/**
|
|
167
|
+
* Disables the item, preventing any user interaction.
|
|
168
|
+
*/
|
|
169
|
+
this.disabled = false;
|
|
170
|
+
//#endregion EVENTS
|
|
171
|
+
/****************************************************************************/
|
|
172
|
+
//#region METHODS
|
|
173
|
+
/**
|
|
174
|
+
* when the child <nv-fieldcheckbox> change its `checked` state,
|
|
175
|
+
* update `this.checked` and emit `itemChecked`.
|
|
176
|
+
* @param {CustomEvent<boolean>} event - The event emitted by the <nv-fieldcheckbox> component.
|
|
177
|
+
*/
|
|
178
|
+
this.onFieldcheckboxChanged = (event) => {
|
|
179
|
+
if (this.disabled)
|
|
180
|
+
return;
|
|
181
|
+
// NvFieldcheckbox has emitted checkedChanged
|
|
182
|
+
this.checked = event.detail; // get the new state
|
|
183
|
+
this.itemChecked.emit({
|
|
184
|
+
value: this.value,
|
|
185
|
+
checked: this.checked,
|
|
186
|
+
group: this.group,
|
|
187
|
+
});
|
|
188
|
+
};
|
|
189
|
+
/** Make sure the checkbox is checked when clicked anywhere in the item. */
|
|
190
|
+
this.handleClick = () => {
|
|
191
|
+
if (this.disabled)
|
|
192
|
+
return;
|
|
193
|
+
if (this.el.querySelector('input').checked) {
|
|
194
|
+
this.checked = false;
|
|
195
|
+
}
|
|
196
|
+
else {
|
|
197
|
+
this.checked = true;
|
|
198
|
+
}
|
|
199
|
+
};
|
|
200
|
+
}
|
|
201
|
+
//#endregion METHODS
|
|
202
|
+
/****************************************************************************/
|
|
203
|
+
//#region RENDER
|
|
204
|
+
render() {
|
|
205
|
+
return (index.h(index.Host, { key: 'cb922f0c0224c950ab5a87783028f2909eb1e39c', onClick: this.handleClick }, index.h("nv-fieldcheckbox", { key: '6f8748022131a8cd31b0f69851313f80c330172a', checked: this.checked, name: this.label || this.value, label: this.label || this.value, labelPlacement: "after", description: this.description, disabled: this.disabled, tabindex: "-1", onCheckedChanged: this.onFieldcheckboxChanged }, index.h("slot", { key: '20d1014accc6cfc00658703057b25037175287af' }), index.h("slot", { key: 'a7e61eed6bc72d3a14096cac2c195629a0ce2928', name: "main" }), index.h("slot", { key: '93f6bce370ac36f1ce3e0f2c1d9cdd598c14cb14', name: "label" }), index.h("slot", { key: '837359fc1fea49e0dea221039dc7466cdc86b757', name: "description" }))));
|
|
206
|
+
}
|
|
207
|
+
get el() { return index.getElement(this); }
|
|
208
|
+
};
|
|
209
|
+
NvFielddropdownitemcheck.style = NvFielddropdownitemcheckStyle0;
|
|
210
|
+
|
|
211
|
+
exports.nv_badge = NvBadge;
|
|
212
|
+
exports.nv_fielddropdownitemcheck = NvFielddropdownitemcheck;
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-B-1F0q3j.js');
|
|
4
4
|
var clsx297c1ffe = require('./clsx-297c1ffe-BtxeOLZW.js');
|
|
5
5
|
require('react');
|
|
6
6
|
|
|
7
|
-
const nvBreadcrumbCss = "nv-breadcrumb{display:flex;align-items:center;color:var(--components-breadcrumb-text);font-size:var(--font-size-sm);font-style:normal;font-weight:500;line-height:var(--line-height-sm)}nv-breadcrumb.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-breadcrumb ul{display:flex;flex-direction:column;gap:var(--spacing-1-5);padding:var(--spacing-1)}nv-breadcrumb ul a,nv-breadcrumb ul button{display:inline-flex;align-self:center;color:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;line-height:inherit;text-decoration:none}nv-breadcrumb ul a:focus,nv-breadcrumb ul a:focus-within,nv-breadcrumb ul button:focus,nv-breadcrumb ul button:focus-within{outline:none}nv-breadcrumb ul a:focus-visible,nv-breadcrumb ul a:has(:focus-visible),nv-breadcrumb ul button:focus-visible,nv-breadcrumb ul button:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 0.5) solid var(--components-breadcrumb-text-hover);outline-offset:calc(var(--focus-outline-offset) * 0.3)}nv-breadcrumb ul a:hover,nv-breadcrumb ul button:hover{text-decoration:underline;color:var(--components-breadcrumb-text-hover)}nv-breadcrumb>a,nv-breadcrumb>button{display:inline-flex;align-self:center;color:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;line-height:inherit;text-decoration:none}nv-breadcrumb>a:focus,nv-breadcrumb>a:focus-within,nv-breadcrumb>button:focus,nv-breadcrumb>button:focus-within{outline:none}nv-breadcrumb>a:focus-visible,nv-breadcrumb>a:has(:focus-visible),nv-breadcrumb>button:focus-visible,nv-breadcrumb>button:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 0.5) solid var(--components-breadcrumb-text-hover);outline-offset:calc(var(--focus-outline-offset) * 0.3)}nv-breadcrumb>a:hover,nv-breadcrumb>button:hover{text-decoration:underline;color:var(--components-breadcrumb-text-hover)}nv-breadcrumb span[data-scope=separator]{display:inline-flex;padding-left:var(--breadcrumb-padding-y)}";
|
|
7
|
+
const nvBreadcrumbCss = "nv-breadcrumb{display:flex;align-items:center;color:var(--components-breadcrumb-text);font-size:var(--font-size-sm);font-style:normal;font-weight:500;line-height:var(--line-height-sm)}nv-breadcrumb.visually-hidden{position:absolute;padding:0;border:0;overflow:hidden;white-space:nowrap;width:1px;height:1px;margin:-1px;clip:rect(0, 0, 0, 0)}nv-breadcrumb ul{display:flex;flex-direction:column;gap:var(--spacing-1-5);padding:var(--spacing-1)}nv-breadcrumb ul a,nv-breadcrumb ul button{display:inline-flex;align-self:center;color:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;line-height:inherit;text-decoration:none}nv-breadcrumb ul a:focus,nv-breadcrumb ul a:focus-within,nv-breadcrumb ul button:focus,nv-breadcrumb ul button:focus-within{outline:none}nv-breadcrumb ul a:focus-visible,nv-breadcrumb ul a:has(:focus-visible),nv-breadcrumb ul button:focus-visible,nv-breadcrumb ul button:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 0.5) solid var(--components-breadcrumb-text-hover);outline-offset:calc(var(--focus-outline-offset) * 0.3);z-index:111}nv-breadcrumb ul a:hover,nv-breadcrumb ul button:hover{text-decoration:underline;color:var(--components-breadcrumb-text-hover)}nv-breadcrumb>a,nv-breadcrumb>button{display:inline-flex;align-self:center;color:inherit;font-size:inherit;font-style:inherit;font-weight:inherit;line-height:inherit;text-decoration:none}nv-breadcrumb>a:focus,nv-breadcrumb>a:focus-within,nv-breadcrumb>button:focus,nv-breadcrumb>button:focus-within{outline:none}nv-breadcrumb>a:focus-visible,nv-breadcrumb>a:has(:focus-visible),nv-breadcrumb>button:focus-visible,nv-breadcrumb>button:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 0.5) solid var(--components-breadcrumb-text-hover);outline-offset:calc(var(--focus-outline-offset) * 0.3);z-index:111}nv-breadcrumb>a:hover,nv-breadcrumb>button:hover{text-decoration:underline;color:var(--components-breadcrumb-text-hover)}nv-breadcrumb span[data-scope=separator]{display:inline-flex;padding-left:var(--breadcrumb-padding-y)}";
|
|
8
8
|
const NvBreadcrumbStyle0 = nvBreadcrumbCss;
|
|
9
9
|
|
|
10
10
|
const NvBreadcrumb = class {
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
3
|
+
var index = require('./index-B-1F0q3j.js');
|
|
4
4
|
require('react');
|
|
5
5
|
|
|
6
6
|
const nvBreadcrumbsCss = "nv-breadcrumbs{display:block}nv-breadcrumbs>ol{display:flex;flex-wrap:wrap;align-items:center;gap:var(--breadcrumb-padding-y)}nv-breadcrumbs nv-breadcrumb:last-child [data-scope=separator],nv-breadcrumbs nv-breadcrumb:last-child [slot=separator]{display:none}";
|
|
@@ -1,10 +1,10 @@
|
|
|
1
1
|
'use strict';
|
|
2
2
|
|
|
3
|
-
var index = require('./index-
|
|
4
|
-
var
|
|
3
|
+
var index = require('./index-B-1F0q3j.js');
|
|
4
|
+
var constants23aaef7b = require('./constants-23aaef7b-Cj2b-su0.js');
|
|
5
5
|
require('react');
|
|
6
6
|
|
|
7
|
-
const nvButtonCss = "nv-button{text-decoration:none;display:inline-flex;justify-content:center;align-items:center;font-style:normal;font-weight:var(--font-weight-medium-emphasis);font-family:\"TT Norms Pro\", sans-serif;transition:background-color 150ms ease-out;user-select:none;cursor:pointer;height:fit-content;width:fit-content}nv-button[size=xs]{padding:var(--button-xs-padding-y) var(--button-xs-padding-x);gap:var(--button-xs-gap);border-radius:var(--button-xs-border-radius);line-height:var(--button-xs-line-height);font-size:var(--button-xs-font-size)}nv-button[size=xs] nv-icon>svg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-button[size=sm]{padding:var(--button-sm-padding-y) var(--button-sm-padding-x);gap:var(--button-sm-gap);border-radius:var(--button-sm-border-radius);line-height:var(--button-sm-line-height);font-size:var(--button-sm-font-size)}nv-button[size=sm] nv-icon>svg{width:var(--spacing-4);height:var(--spacing-4);stroke-width:1.5px}nv-button[size=md]{padding:var(--button-md-padding-y) var(--button-md-padding-x);gap:var(--button-md-gap);border-radius:var(--button-md-border-radius);line-height:var(--button-md-line-height);font-size:var(--button-md-font-size)}nv-button[size=md] nv-icon>svg{width:var(--spacing-5);height:var(--spacing-5);stroke-width:1.6px}nv-button[size=lg]{padding:var(--button-lg-padding-y) var(--button-lg-padding-x);gap:var(--button-lg-gap);border-radius:var(--button-lg-border-radius);line-height:var(--button-lg-line-height);font-size:var(--button-lg-font-size)}nv-button[size=lg] nv-icon>svg{width:var(--spacing-6);height:var(--spacing-6);stroke-width:1.8px}nv-button[emphasis=high]{background:var(--components-button-high-background);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text)}nv-button[emphasis=high]:hover{background:var(--components-button-high-background-hover);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text-hover)}nv-button[emphasis=high]:active{background:var(--components-button-high-background-active);border:1px solid var(--components-button-high-border-active);color:var(--components-button-high-text-active)}nv-button[emphasis=high]:focus,nv-button[emphasis=high]:focus-within{outline:none}nv-button[emphasis=high]:focus-visible,nv-button[emphasis=high]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=high]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=high][active]:not([active=false]){background:var(--components-button-high-background-active);border:1px solid var(--components-button-high-border-active);color:var(--components-button-high-text-active)}nv-button[emphasis=high][danger]:not([danger=false]){background:var(--components-button-destructive-high-background);border:1px solid transparent;color:var(--components-button-destructive-high-text)}nv-button[emphasis=high][danger]:not([danger=false]):hover{background:var(--components-button-destructive-high-background-hover);border:1px solid transparent;color:var(--components-button-destructive-high-text-hover)}nv-button[emphasis=high][danger]:not([danger=false]):focus,nv-button[emphasis=high][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=high][danger]:not([danger=false]):focus-visible,nv-button[emphasis=high][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=medium]{background:var(--components-button-medium-background);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text)}nv-button[emphasis=medium]:hover{background:var(--components-button-medium-background-hover);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text-hover)}nv-button[emphasis=medium]:active{background:var(--components-button-medium-background-active);border:1px solid var(--components-button-medium-border-active);color:var(--components-button-medium-text-active)}nv-button[emphasis=medium]:focus,nv-button[emphasis=medium]:focus-within{outline:none}nv-button[emphasis=medium]:focus-visible,nv-button[emphasis=medium]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=medium]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=medium][active]:not([active=false]){background:var(--components-button-medium-background-active);border:1px solid var(--components-button-medium-border-active);color:var(--components-button-medium-text-active)}nv-button[emphasis=medium][danger]:not([danger=false]){background:var(--components-button-destructive-medium-background);border:1px solid var(--components-button-destructive-medium-border);color:var(--components-button-destructive-medium-text)}nv-button[emphasis=medium][danger]:not([danger=false]):hover{background:var(--components-button-destructive-medium-background-hover);border:1px solid var(--components-button-destructive-medium-border);color:var(--components-button-destructive-medium-text-hover)}nv-button[emphasis=medium][danger]:not([danger=false]):focus,nv-button[emphasis=medium][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=medium][danger]:not([danger=false]):focus-visible,nv-button[emphasis=medium][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=low]{background:var(--components-button-low-background);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text)}nv-button[emphasis=low]:hover{background:var(--components-button-low-background-hover);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text-hover)}nv-button[emphasis=low]:active{background:var(--components-button-low-background-active);border:1px solid var(--components-button-low-border-active);color:var(--components-button-low-text-active)}nv-button[emphasis=low]:focus,nv-button[emphasis=low]:focus-within{outline:none}nv-button[emphasis=low]:focus-visible,nv-button[emphasis=low]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=low]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=low][active]:not([active=false]){background:var(--components-button-low-background-active);border:1px solid var(--components-button-low-border-active);color:var(--components-button-low-text-active)}nv-button[emphasis=low][danger]:not([danger=false]){background:var(--components-button-destructive-low-background);border:1px solid var(--components-button-destructive-low-border);color:var(--components-button-destructive-low-text)}nv-button[emphasis=low][danger]:not([danger=false]):hover{background:var(--components-button-destructive-low-background-hover);border:1px solid var(--components-button-destructive-low-border);color:var(--components-button-destructive-low-text-hover)}nv-button[emphasis=low][danger]:not([danger=false]):focus,nv-button[emphasis=low][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=low][danger]:not([danger=false]):focus-visible,nv-button[emphasis=low][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=lower]{background:var(--components-button-lower-background);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text)}nv-button[emphasis=lower]:hover{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}nv-button[emphasis=lower]:active{background:var(--components-button-lower-background-active);border:1px solid var(--components-button-lower-border-active);color:var(--components-button-lower-text-active)}nv-button[emphasis=lower]:focus,nv-button[emphasis=lower]:focus-within{outline:none}nv-button[emphasis=lower]:focus-visible,nv-button[emphasis=lower]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[emphasis=lower]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=lower][active]:not([active=false]){background:var(--components-button-lower-background-active);border:1px solid var(--components-button-lower-border-active);color:var(--components-button-lower-text-active)}nv-button[emphasis=lower][danger]:not([danger=false]){background:var(--components-button-destructive-lower-background);border:1px solid var(--components-button-destructive-lower-border);color:var(--components-button-destructive-lower-text)}nv-button[emphasis=lower][danger]:not([danger=false]):hover{background:var(--components-button-destructive-lower-background-hover);border:1px solid var(--components-button-destructive-lower-border);color:var(--components-button-destructive-lower-text-hover)}nv-button[emphasis=lower][danger]:not([danger=false]):focus,nv-button[emphasis=lower][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=lower][danger]:not([danger=false]):focus-visible,nv-button[emphasis=lower][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1)}nv-button[fluid]:not([fluid=false]){width:100%}nv-button[loading]:not([loading=false]) [slot=leading-icon]{display:none}";
|
|
7
|
+
const nvButtonCss = "nv-button{text-decoration:none;display:inline-flex;justify-content:center;align-items:center;font-style:normal;font-weight:var(--font-weight-medium-emphasis);font-family:\"TT Norms Pro\", sans-serif;transition:background-color 150ms ease-out;user-select:none;cursor:pointer;height:fit-content;width:fit-content}nv-button[size=xs]{padding:var(--button-xs-padding-y) var(--button-xs-padding-x);gap:var(--button-xs-gap);border-radius:var(--button-xs-border-radius);line-height:var(--button-xs-line-height);font-size:var(--button-xs-font-size)}nv-button[size=xs] nv-icon>svg{width:var(--spacing-3);height:var(--spacing-3);stroke-width:1.2px}nv-button[size=sm]{padding:var(--button-sm-padding-y) var(--button-sm-padding-x);gap:var(--button-sm-gap);border-radius:var(--button-sm-border-radius);line-height:var(--button-sm-line-height);font-size:var(--button-sm-font-size)}nv-button[size=sm] nv-icon>svg{width:var(--spacing-4);height:var(--spacing-4);stroke-width:1.5px}nv-button[size=md]{padding:var(--button-md-padding-y) var(--button-md-padding-x);gap:var(--button-md-gap);border-radius:var(--button-md-border-radius);line-height:var(--button-md-line-height);font-size:var(--button-md-font-size)}nv-button[size=md] nv-icon>svg{width:var(--spacing-5);height:var(--spacing-5);stroke-width:1.6px}nv-button[size=lg]{padding:var(--button-lg-padding-y) var(--button-lg-padding-x);gap:var(--button-lg-gap);border-radius:var(--button-lg-border-radius);line-height:var(--button-lg-line-height);font-size:var(--button-lg-font-size)}nv-button[size=lg] nv-icon>svg{width:var(--spacing-6);height:var(--spacing-6);stroke-width:1.8px}nv-button[emphasis=high]{background:var(--components-button-high-background);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text)}nv-button[emphasis=high]:hover{background:var(--components-button-high-background-hover);border:1px solid var(--components-button-high-border);color:var(--components-button-high-text-hover)}nv-button[emphasis=high]:active{background:var(--components-button-high-background-active);border:1px solid var(--components-button-high-border-active);color:var(--components-button-high-text-active)}nv-button[emphasis=high]:focus,nv-button[emphasis=high]:focus-within{outline:none}nv-button[emphasis=high]:focus-visible,nv-button[emphasis=high]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[emphasis=high]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=high][active]:not([active=false]){background:var(--components-button-high-background-active);border:1px solid var(--components-button-high-border-active);color:var(--components-button-high-text-active)}nv-button[emphasis=high][danger]:not([danger=false]){background:var(--components-button-destructive-high-background);border:1px solid transparent;color:var(--components-button-destructive-high-text)}nv-button[emphasis=high][danger]:not([danger=false]):hover{background:var(--components-button-destructive-high-background-hover);border:1px solid transparent;color:var(--components-button-destructive-high-text-hover)}nv-button[emphasis=high][danger]:not([danger=false]):focus,nv-button[emphasis=high][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=high][danger]:not([danger=false]):focus-visible,nv-button[emphasis=high][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[emphasis=medium]{background:var(--components-button-medium-background);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text)}nv-button[emphasis=medium]:hover{background:var(--components-button-medium-background-hover);border:1px solid var(--components-button-medium-border);color:var(--components-button-medium-text-hover)}nv-button[emphasis=medium]:active{background:var(--components-button-medium-background-active);border:1px solid var(--components-button-medium-border-active);color:var(--components-button-medium-text-active)}nv-button[emphasis=medium]:focus,nv-button[emphasis=medium]:focus-within{outline:none}nv-button[emphasis=medium]:focus-visible,nv-button[emphasis=medium]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[emphasis=medium]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=medium][active]:not([active=false]){background:var(--components-button-medium-background-active);border:1px solid var(--components-button-medium-border-active);color:var(--components-button-medium-text-active)}nv-button[emphasis=medium][danger]:not([danger=false]){background:var(--components-button-destructive-medium-background);border:1px solid var(--components-button-destructive-medium-border);color:var(--components-button-destructive-medium-text)}nv-button[emphasis=medium][danger]:not([danger=false]):hover{background:var(--components-button-destructive-medium-background-hover);border:1px solid var(--components-button-destructive-medium-border);color:var(--components-button-destructive-medium-text-hover)}nv-button[emphasis=medium][danger]:not([danger=false]):focus,nv-button[emphasis=medium][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=medium][danger]:not([danger=false]):focus-visible,nv-button[emphasis=medium][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[emphasis=low]{background:var(--components-button-low-background);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text)}nv-button[emphasis=low]:hover{background:var(--components-button-low-background-hover);border:1px solid var(--components-button-low-border);color:var(--components-button-low-text-hover)}nv-button[emphasis=low]:active{background:var(--components-button-low-background-active);border:1px solid var(--components-button-low-border-active);color:var(--components-button-low-text-active)}nv-button[emphasis=low]:focus,nv-button[emphasis=low]:focus-within{outline:none}nv-button[emphasis=low]:focus-visible,nv-button[emphasis=low]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[emphasis=low]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=low][active]:not([active=false]){background:var(--components-button-low-background-active);border:1px solid var(--components-button-low-border-active);color:var(--components-button-low-text-active)}nv-button[emphasis=low][danger]:not([danger=false]){background:var(--components-button-destructive-low-background);border:1px solid var(--components-button-destructive-low-border);color:var(--components-button-destructive-low-text)}nv-button[emphasis=low][danger]:not([danger=false]):hover{background:var(--components-button-destructive-low-background-hover);border:1px solid var(--components-button-destructive-low-border);color:var(--components-button-destructive-low-text-hover)}nv-button[emphasis=low][danger]:not([danger=false]):focus,nv-button[emphasis=low][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=low][danger]:not([danger=false]):focus-visible,nv-button[emphasis=low][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[emphasis=lower]{background:var(--components-button-lower-background);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text)}nv-button[emphasis=lower]:hover{background:var(--components-button-lower-background-hover);border:1px solid var(--components-button-lower-border);color:var(--components-button-lower-text-hover)}nv-button[emphasis=lower]:active{background:var(--components-button-lower-background-active);border:1px solid var(--components-button-lower-border-active);color:var(--components-button-lower-text-active)}nv-button[emphasis=lower]:focus,nv-button[emphasis=lower]:focus-within{outline:none}nv-button[emphasis=lower]:focus-visible,nv-button[emphasis=lower]:has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-brand);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[emphasis=lower]:disabled:not([disabled=false]){opacity:0.5;cursor:not-allowed;box-shadow:none}nv-button[emphasis=lower][active]:not([active=false]){background:var(--components-button-lower-background-active);border:1px solid var(--components-button-lower-border-active);color:var(--components-button-lower-text-active)}nv-button[emphasis=lower][danger]:not([danger=false]){background:var(--components-button-destructive-lower-background);border:1px solid var(--components-button-destructive-lower-border);color:var(--components-button-destructive-lower-text)}nv-button[emphasis=lower][danger]:not([danger=false]):hover{background:var(--components-button-destructive-lower-background-hover);border:1px solid var(--components-button-destructive-lower-border);color:var(--components-button-destructive-lower-text-hover)}nv-button[emphasis=lower][danger]:not([danger=false]):focus,nv-button[emphasis=lower][danger]:not([danger=false]):focus-within{outline:none}nv-button[emphasis=lower][danger]:not([danger=false]):focus-visible,nv-button[emphasis=lower][danger]:not([danger=false]):has(:focus-visible){outline:calc(var(--focus-outline-stroke) * 1) solid var(--color-focus-destructive);outline-offset:calc(var(--focus-outline-offset) * 1);z-index:111}nv-button[fluid]:not([fluid=false]){width:100%}nv-button[loading]:not([loading=false]) [slot=leading-icon]{display:none}";
|
|
8
8
|
const NvButtonStyle0 = nvButtonCss;
|
|
9
9
|
|
|
10
10
|
const NvButton = class {
|
|
@@ -76,11 +76,11 @@ const NvButton = class {
|
|
|
76
76
|
event.preventDefault();
|
|
77
77
|
return;
|
|
78
78
|
}
|
|
79
|
-
if (this.type !==
|
|
79
|
+
if (this.type !== constants23aaef7b.ButtonType.Button &&
|
|
80
80
|
(this.form || ((_a = this.internals) === null || _a === void 0 ? void 0 : _a.form))) {
|
|
81
81
|
this.processFormAction();
|
|
82
82
|
}
|
|
83
|
-
else if (this.form && this.type ===
|
|
83
|
+
else if (this.form && this.type === constants23aaef7b.ButtonType.Button) {
|
|
84
84
|
console.warn('Button has a form id but is not of type submit or reset so no form action will be processed.', `Button:`, this.el);
|
|
85
85
|
}
|
|
86
86
|
};
|
|
@@ -99,10 +99,10 @@ const NvButton = class {
|
|
|
99
99
|
return;
|
|
100
100
|
}
|
|
101
101
|
switch (this.type) {
|
|
102
|
-
case
|
|
102
|
+
case constants23aaef7b.ButtonType.Submit:
|
|
103
103
|
formElement.requestSubmit();
|
|
104
104
|
break;
|
|
105
|
-
case
|
|
105
|
+
case constants23aaef7b.ButtonType.Reset:
|
|
106
106
|
formElement.reset();
|
|
107
107
|
break;
|
|
108
108
|
}
|
|
@@ -150,7 +150,7 @@ const NvButton = class {
|
|
|
150
150
|
/****************************************************************************/
|
|
151
151
|
//#region RENDER
|
|
152
152
|
render() {
|
|
153
|
-
return (index.h(index.Host, { key: '54c0b3351f4d8a180058a03e61a562882fb98498', role: "button", tabindex: "0", onClick: this.handleButtonClick }, this.loading && (index.h("nv-loader", { key: '21315e4af4111bcf47c67e65a9a58a1d7121a43e', size: this.size ===
|
|
153
|
+
return (index.h(index.Host, { key: '54c0b3351f4d8a180058a03e61a562882fb98498', role: "button", tabindex: "0", onClick: this.handleButtonClick }, this.loading && (index.h("nv-loader", { key: '21315e4af4111bcf47c67e65a9a58a1d7121a43e', size: this.size === constants23aaef7b.ButtonSize.Large ? 'sm' : 'xs' })), index.h("slot", { key: 'f37683ddaa2c11c5b7accfc99429c930f5a3dcf6', name: "leading-icon" }), index.h("slot", { key: 'd17ebe7505d9027c6c58f930a8ea9b097561cead' }), index.h("slot", { key: '2cd6c9756cc7540417041adf5830b734291b2ab5', name: "trailing-icon" })));
|
|
154
154
|
}
|
|
155
155
|
static get formAssociated() { return true; }
|
|
156
156
|
get el() { return index.getElement(this); }
|